:root{
    --plava:#1982C4; --plava-t:#136A9F; --plava-s:#E8F3FA;
    --nar:#FF8C42; --nar-t:#C25607; --nar-s:#FFF1E6;
    --ljub:#C4195D; --ljub-t:#A11448;
    --tekst:#1F2933; --siv-tekst:#5C6670; --svetla:#EEEEF3; --bela:#FFFFFF;
    --zelena:#1E8E4E; --zelena-s:#E6F4EC; --crvena:#C62828; --crvena-s:#FDECEC;
    --dugme-sivo:#E3E5EA; --linija:#E1E3E8;
  }
  *{box-sizing:border-box}
  html,body{margin:0}
  body{background:var(--svetla);color:var(--tekst);font:400 16px/1.45 'Open Sans','Segoe UI',sans-serif}
  button{font:inherit;cursor:pointer}
  :focus-visible{outline:3px solid var(--plava-t);outline-offset:2px}

  .strana{max-width:480px;margin:0 auto;min-height:100vh;background:var(--bela)}
  .zaglavlje{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--linija)}
  .zaglavlje img{height:30px;display:block}
  .odjava{background:none;border:0;color:var(--siv-tekst);font:500 14px Montserrat,Arial,sans-serif;padding:6px 0}
  .sadrzaj{padding:20px 16px 32px}
  h1{font:600 26px/1.2 Montserrat,Arial,sans-serif;margin:0 0 18px;color:var(--tekst)}
  .nazad{display:inline-flex;align-items:center;gap:8px;min-height:44px;background:var(--plava-s);border:0;border-radius:10px;padding:8px 14px;margin:0 0 18px;color:var(--plava-t);font:600 15px Montserrat,Arial,sans-serif}
  .nazad .strelica{font-size:20px;line-height:1}
  .nad-naslov{font:500 13px Montserrat,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--siv-tekst);margin:0 0 4px}
  h1.sa-pod{margin-bottom:4px}
  .pod{font:500 17px Montserrat,Arial,sans-serif;color:var(--siv-tekst);margin:0 0 20px}
  .uputstvo{font-size:15px;color:var(--siv-tekst);margin:-6px 0 16px}
  .cta small{display:block;font:400 13px 'Open Sans',sans-serif;opacity:.9;margin-top:2px}
  .ekran{display:none}.ekran.akt{display:block}

  /* dugmad */
  .veliko{display:block;width:100%;text-align:left;background:var(--bela);border:2px solid var(--plava);color:var(--tekst);border-radius:10px;padding:16px;margin:0 0 12px;font:600 17px/1.3 Montserrat,Arial,sans-serif}
  .veliko small{display:block;font:400 14px 'Open Sans',sans-serif;color:var(--siv-tekst);margin-top:3px}
  .cta{display:block;width:100%;background:var(--ljub);color:#fff;border:0;border-radius:10px;padding:15px 16px;font:600 16px Montserrat,Arial,sans-serif;text-align:center}
  .cta:hover{background:var(--ljub-t)}
  .sek{display:block;width:100%;background:var(--bela);color:var(--plava-t);border:2px solid var(--plava);border-radius:10px;padding:13px 16px;font:600 16px Montserrat,Arial,sans-serif;text-align:center}

  /* prijava */
  .prijava{padding-top:28px}
  .prijava p{color:var(--siv-tekst);margin:0 0 22px}
  .prijava .cta,.prijava .sek{margin-bottom:12px}
  .polje{width:100%;border:1.5px solid #C9CDD4;border-radius:4px;padding:12px;font:400 16px 'Open Sans',sans-serif;color:var(--tekst)}
  .napomena{font-size:14px;color:var(--siv-tekst);margin:10px 0 0}

  /* spisak časova */
  .casovi{margin-top:10px;border-top:1px solid var(--linija)}
  .cas{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;background:none;border:0;border-bottom:1px solid var(--linija);padding:15px 4px;text-align:left;font:600 16px Montserrat,Arial,sans-serif;color:var(--tekst)}
  .cas .ok{color:var(--zelena);font-size:20px;line-height:1}
  .cas .nije{background:var(--nar-s);color:var(--nar-t);border-radius:999px;padding:3px 10px;font:600 12px Montserrat,Arial,sans-serif;white-space:nowrap}
  .cas.buduci{color:#A3A9B1;cursor:default}
  .cas.buduci .brava{font-size:15px}

  /* čas */
  .lepljivo{position:sticky;top:0;z-index:5;background:var(--bela);padding:12px 16px;border-bottom:1px solid var(--linija)}
  .lepljivo .cta[disabled]{opacity:1}
  .vrti{display:inline-block;width:15px;height:15px;border:2px solid #fff8;border-top-color:#fff;border-radius:50%;vertical-align:-2px;margin-right:8px;animation:v .8s linear infinite}
  @keyframes v{to{transform:rotate(360deg)}}
  .cta.uspeh{background:var(--zelena)}
  .brojac{margin:7px 0 0;text-align:center;font-size:13px;color:var(--siv-tekst)}
  .brojac.sve{color:var(--zelena);font-weight:600}
  .poruke{margin:12px 0 0}
  .poruka{background:var(--crvena-s);color:var(--crvena);border-radius:4px;padding:10px 12px;font-size:15px;margin:0 0 8px}
  .poruka.siva{background:var(--plava-s);color:var(--plava-t)}
  label.nad{display:block;font:500 13px Montserrat,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--siv-tekst);margin:0 0 6px}
  textarea.polje{min-height:76px;resize:vertical}
  .polje.greska{border-color:var(--crvena);box-shadow:0 0 0 2px var(--crvena-s)}
  .prisustvo{margin-top:24px}
  .dete{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 6px;border-bottom:1px solid var(--linija);border-radius:4px}
  .dete:first-of-type{border-top:1px solid var(--linija)}
  .dete.greska{outline:2px solid var(--crvena);outline-offset:-2px;background:var(--crvena-s)}
  .ime{font-size:16px;line-height:1.3}
  .novo{display:inline-block;background:var(--nar);color:#fff;border-radius:999px;padding:1px 8px;font:600 11px Montserrat,Arial,sans-serif;letter-spacing:.05em;text-transform:uppercase;margin-left:6px;vertical-align:1px}
  .otislo .ime{text-decoration:line-through;color:#A3A9B1}
  .par{display:flex;gap:8px;flex:none}
  .dn{width:58px;height:44px;border:0;border-radius:10px;background:var(--dugme-sivo);color:var(--siv-tekst);font:600 15px Montserrat,Arial,sans-serif}
  .dn.da.on{background:var(--zelena);color:#fff}
  .dn.ne.on{background:var(--crvena);color:#fff}

  /* stranica (dodato uz skicu) */
  .traka-proba{background:var(--nar);color:#fff;text-align:center;font:600 13px/1.3 Montserrat,Arial,sans-serif;letter-spacing:.12em;padding:5px 8px}
  .ucitava{color:var(--siv-tekst);padding:24px 0}
  .google-dugme{min-height:44px;margin:0 0 12px}
  .kod-polje{letter-spacing:.3em;font-size:20px;text-align:center}
  .poruka.uspeh{background:var(--zelena-s);color:var(--zelena)}
  [hidden]{display:none!important}