body{font-family:Arial,Helvetica,sans-serif;background:#f7f8fb;color:#111;margin:0;padding:0}
.container{max-width:520px;margin:0 auto;padding:16px;padding-bottom:40px}
h1{margin:0 0 12px;font-size:22px;color:#b71c1c}
h2{margin:0 0 10px;font-size:18px;color:#111}
.card{background:#fff;padding:14px;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,0.08);margin-bottom:12px}
.hidden{display:none}
input{width:100%;box-sizing:border-box;padding:10px;margin:6px 0;border:1px solid #ddd;border-radius:6px;font-size:16px}
textarea{width:100%;box-sizing:border-box;padding:10px;margin:6px 0;border:1px solid #ddd;border-radius:6px;font-size:15px;min-height:70px;font-family:inherit}
button{background:#1b6fd8;color:#fff;border:none;padding:10px 14px;border-radius:6px;cursor:pointer;font-size:15px}
button:active{transform:translateY(1px)}
button.danger{background:#cc3333}
button.ghost{background:none;color:#1b6fd8;border:1px solid #1b6fd8}
button:disabled{opacity:.5;cursor:default}
.muted{color:#666;font-size:13px}
.statusTag{padding:8px 10px;border-radius:6px;font-size:14px;margin-top:8px;display:inline-block}
.statusTag.ready{background:#e6f4ea;color:#1e6b34}
.statusTag.reject{background:#fdecea;color:#7a1a1a}
.statusTag.enroute{background:#fff3cd;color:#7a5b00}

/* Živý stav poplachu — pulzujúci rám, kým je poplach aktívny */
@keyframes pulseAlert{
  0%,100%{box-shadow:0 0 0 0 rgba(183,28,28,.55)}
  50%{box-shadow:0 0 0 8px rgba(183,28,28,0)}
}
#publicStatus.alertBlock{border:2px solid #b71c1c;animation:pulseAlert 1.6s infinite}
.statusCounts{display:flex;flex-direction:column;gap:4px;margin-top:10px;font-size:14px}
.checkboxRow{display:flex;align-items:flex-start;gap:8px;margin:10px 0;font-size:14px}
.checkboxRow input{width:auto;margin:2px 0 0}
.logos{display:flex;align-items:center;gap:10px;min-height:1px}
.brandLogo{width:48px;height:48px;object-fit:contain;display:block}
.navButtons{display:flex;gap:10px;flex-wrap:wrap}
.btnLink{flex:1;min-width:150px;display:inline-block;text-align:center;text-decoration:none;padding:12px 14px;border-radius:6px;font-size:15px;box-sizing:border-box}
.btnLink.primary{background:#1b6fd8;color:#fff}
.btnLink.ghost{background:none;color:#1b6fd8;border:1px solid #1b6fd8}

/* Horný riadok — logá/názov vľavo, malé admin tlačidlo vpravo hore */
.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:16px}
.brand{display:flex;align-items:center;gap:10px}
.brand h1{margin:0;font-size:22px}
.brand p{margin:2px 0 0}
.adminLink{flex-shrink:0;display:inline-block;text-decoration:none;color:#666;background:#fff;border:1px solid #ddd;padding:6px 12px;border-radius:999px;font-size:13px;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.adminLink:hover{background:#f2f2f2}

/* PC/väčšie obrazovky — logo pri ľavom okraji prehliadača (mimo úzkeho stĺpca s obsahom),
   zvisle vycentrované na celú výšku stránky a posúva sa spolu s ňou pri rolovaní
   (position:absolute bez position:relative predka = vzhľadom na celý dokument, nie viewport).
   Na mobile ostáva logo bez zmeny, pri nadpise v hlavičke. */
@media (min-width: 700px) {
  /* Vodorovne vycentrované v ľavom okraji (medzi krajom okna a stĺpcom s obsahom):
     stred loga = polovica šírky okraja = (100vw - šírka stĺpca 520px) / 4 */
  .logos{position:absolute;left:calc(25vw - 370px);top:50%;transform:translateY(-50%);z-index:5}
  .brandLogo{width:480px;height:480px}
}

/* Samostatné grafické bloky na stránke — rovnaká karta ako v mobilnej appke (.card),
   s červeným pruhom vľavo rovnako ako majú poplachy v appke (.alertItem), nech stránka
   aj appka pôsobia ako súčasť toho istého produktu. */
.accentBlock{border-left:4px solid #b71c1c}

/* Oddeľovač medzi blokmi ("Chceš sa pridať k nám?") */
.sectionDivider{display:flex;align-items:center;gap:10px;margin:22px 0 12px;color:#999;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.sectionDivider::before,.sectionDivider::after{content:'';flex:1;height:1px;background:#e0e0e0}
.testLink{display:inline-block;text-decoration:none;color:#1b6fd8;border:1px solid #1b6fd8;padding:10px 14px;border-radius:6px;text-align:center;margin:6px 0}
.banner{padding:10px 12px;border-radius:6px;margin-bottom:12px;font-size:14px}
.banner.install{background:#e7f0fe;color:#0d3f8f;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.banner.install .txt{flex:1;min-width:200px}
.banner.install button{white-space:nowrap;font-size:13px;padding:6px 10px}
.banner.install button.ghost{background:none;border:1px solid #0d3f8f;color:#0d3f8f}
.banner.install.hidden{display:none}

/* Päta stránky */
.siteFooter{margin-top:24px;padding-top:16px;border-top:1px solid #e0e0e0;text-align:center;color:#999;font-size:12px;line-height:1.6}
.siteFooter a{color:#999}