/* Dokumenta – vizuelni stil po uzoru na euprava.gov.rs: Montserrat, tamnoplava, pravougaono, bez senki */
:root {
  --papir: #ffffff;
  --povrs: #ffffff;
  --povrs-2: #f2f2f2;
  --povrs-3: #f8f8f8;
  --mastilo: #000000;
  --tekst-2: #333333;
  --tekst-3: #666666;
  --tekst-4: #9b9b9b;
  --linija: #d7d8d6;
  --linija-jaka: #cccccc;
  --akcent: #253965;
  --akcent-tamni: #1a2a4d;
  --akcent-tekst: #ffffff;
  --hero: #10254f;
  --plava: #4a90e2;
  --akcent-blagi: #d2e7ff;
  --akcent-blagi-2: #f3f9ff;
  --zelena: #017932;
  --crvena: #d0021b;
  --upoz: #a33943;
  --upoz-pozadina: #fff8f8;
  --ok: #017932;
  --senka-mala: none;
  --senka: none;
  --senka-velika: 0 8px 30px rgba(0, 0, 0, .18);
  --radijus: 0;
  --radijus-mali: 0;
  --display: "Montserrat", Arial, Helvetica, sans-serif;
  --telo: "Montserrat", Arial, Helvetica, sans-serif;
  color-scheme: light only;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { height: 100%; scroll-behavior: smooth; }
body { margin: 0; min-height: 100%; overflow-x: hidden; background: var(--papir); color: var(--mastilo); font: 500 14px/1.6 var(--telo); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4 { margin: 0; font-family: var(--display); font-weight: 700; color: var(--akcent); text-wrap: balance; }
p { margin: 0; }
button { font: inherit; }
a { color: var(--akcent); }
.strelica { display: inline-block; margin-left: 8px; font-weight: 400; }

/* ---- Zaglavlje ---- */
.vrh { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 10; background: #fff; border-bottom: 1px solid var(--linija); }
.gornja-traka { background: var(--akcent); color: #fff; height: 36px; font-size: 12.5px; }
.gornja-unutra { max-width: 1440px; margin: 0 auto; padding: 0 28px; height: 100%; display: flex; align-items: stretch; justify-content: space-between; }
.gornji-linkovi, .gornji-desno { display: flex; }
.gornji-linkovi a, .gornji-desno a { color: #fff; text-decoration: none; padding: 0 14px; display: flex; align-items: center; font-weight: 600; border-right: 1px solid rgba(255, 255, 255, .25); }
.gornji-desno a { border-right: 0; border-left: 1px solid rgba(255, 255, 255, .25); }
.gornji-linkovi a:first-child { padding-left: 0; }
.gornji-linkovi a.aktivan { background: #fff; color: var(--akcent); padding: 0 14px; }
.gornji-linkovi a:hover, .gornji-desno a:hover { text-decoration: underline; }
.vrh-unutra { max-width: 1440px; margin: 0 auto; padding: 12px 28px; display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: nowrap; }
.akcije { flex: none; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.brend { display: flex; align-items: center; gap: 12px; min-width: 0; text-decoration: none; color: inherit; }
.brend-tekst { display: flex; flex-direction: column; line-height: 1.1; }
.brend-tekst strong { font-size: 25px; font-weight: 800; color: var(--akcent); letter-spacing: -.02em; }
.brend-tekst small { font-size: 11px; color: var(--tekst-3); font-weight: 500; margin-top: 3px; }
.logo { flex: none; width: 44px; height: 44px; display: block; }
.brend-tekst .rs { color: #c6363c; }
.putanja { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--tekst-3); min-width: 0; }
.putanja a { color: var(--tekst-3); text-decoration: none; }
.putanja a:hover { color: var(--akcent); text-decoration: underline; }
.putanja b { color: var(--akcent); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- Dugmad ---- */
.dugme { border: 1px solid var(--akcent); background: #fff; color: var(--akcent); padding: 9px 16px; border-radius: 0; cursor: pointer; font-weight: 600; font-size: 13.5px; transition: background .12s, color .12s; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.dugme:hover { background: var(--akcent-blagi-2); }
.dugme:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, .tab:focus-visible { outline: 2px solid var(--plava); outline-offset: 1px; }
.dugme.glavno { background: var(--akcent); border-color: var(--akcent); color: #fff; }
.dugme.glavno:hover { background: var(--akcent-tamni); }
.dugme.tiho { background: transparent; border-color: transparent; color: var(--akcent); }
.dugme.tiho:hover { background: var(--povrs-2); }
.dugme.okvir-belo { background: transparent; border-color: #fff; color: #fff; }
.dugme.okvir-belo:hover { background: rgba(255, 255, 255, .12); }
.dugme.zeleno { background: var(--zelena); border-color: var(--zelena); color: #fff; }
.dugme[disabled] { opacity: .5; cursor: progress; }
.dugme.mali { padding: 6px 11px; font-size: 12.5px; }
.dugme.veliko { padding: 12px 22px; font-size: 14px; }
.puno-siroko { width: 100%; justify-content: center; }
.dugme.opasno { color: var(--crvena); border-color: var(--crvena); }
.dugme.opasno:hover { background: var(--upoz-pozadina); }

/* meniji */
.korisnik { display: flex; align-items: center; gap: 8px; max-width: 220px; padding: 4px 8px 4px 4px; border: 1px solid transparent; background: transparent; cursor: pointer; font: 600 13.5px var(--telo); color: var(--akcent); }
.korisnik:hover { background: var(--povrs-2); border-color: var(--linija); }
.korisnik-ime { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avatar { flex: none; width: 46px; height: 46px; border-radius: 50%; background: var(--akcent); color: #fff; display: grid; place-items: center; font: 700 16px var(--display); }
.avatar.mali { width: 30px; height: 30px; font-size: 12px; }
.meni { position: relative; }
.meni-strelica { font-size: 11px; color: var(--tekst-3); margin-left: 2px; }
.meni-dugme { display: inline-flex; align-items: center; gap: 6px; }
.meni-lista { position: absolute; right: 0; top: calc(100% + 6px); min-width: 260px; background: #fff; border: 1px solid var(--linija); box-shadow: var(--senka-velika); padding: 6px 0; z-index: 40; display: flex; flex-direction: column; }
.meni-lista button, .meni-lista a { display: block; width: 100%; text-align: left; border: 0; background: transparent; padding: 10px 16px; font: 500 13.5px var(--telo); color: var(--mastilo); cursor: pointer; text-decoration: none; }
.meni-lista button:hover, .meni-lista a:hover { background: var(--akcent-blagi-2); color: var(--akcent); }
.meni-lista button.opasno { color: var(--crvena); }
.meni-crta { border-top: 1px solid var(--linija); margin: 4px 0; }
.meni-zaglavlje { padding: 8px 16px 6px; font-size: 12px; color: var(--tekst-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- Raspored strane dokumenta ---- */
.raspored { max-width: 1440px; margin: 0 auto; padding: 24px 28px 48px; display: grid; grid-template-columns: minmax(0, 640px) minmax(360px, 1fr); gap: 28px; align-items: start; }
@media (max-width: 1040px) { .raspored { grid-template-columns: 1fr; } .pregled { position: static !important; } }
@media (max-width: 600px) {
  .vrh-unutra, .raspored, .pocetna, .dno, .pocetna-strana .vrh-unutra, .pocetna-strana .dno, .gornja-unutra { padding-left: 16px; padding-right: 16px; }
  .gornji-desno { display: none; }
  .brend-tekst, .putanja { display: none; }
  .brend { flex: none; }
  .vrh-unutra { gap: 10px; }
  .akcije { gap: 6px; }
  .korisnik-ime { display: none; }
  .korisnik { padding: 2px; }
  .meni-lista { min-width: 230px; }
  .poziv { padding: 32px 16px; }
}

/* ---- Odeljci obrasca ---- */
.obrazac { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.odeljak { background: #fff; border: 1px solid var(--linija); padding: 22px 24px 24px; }
.odeljak-naslov { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.odeljak-naslov h2 { font-size: 17px; }
.broj { flex: none; width: 28px; height: 28px; background: var(--akcent); color: #fff; font: 700 12.5px/28px var(--display); text-align: center; }
.napomena-naslov { font-size: 12.5px; color: var(--tekst-3); }
.oznaka-ugovora { font-size: 12.5px; color: var(--tekst-3); margin: -4px 0 -6px 2px; }
.oznaka-ugovora.nesacuvano { color: var(--crvena); }
.polja { display: grid; gap: 14px 16px; }
.polja.dva { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 560px) { .polja.dva { grid-template-columns: 1fr; } }
.polja label, label.puno { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--akcent); min-width: 0; }
label.puno { margin-top: 14px; }
label em { font-style: normal; font-weight: 500; color: var(--tekst-4); }
label small { font-weight: 500; color: var(--tekst-3); font-size: 12px; line-height: 1.4; }
input[type="text"], input[type="number"], input[type="date"], input[type="email"], input[type="password"], input[type="search"], select, textarea {
  width: 100%; font: 500 14px/1.4 var(--telo); color: var(--mastilo); background: #fff; border: 1px solid var(--linija-jaka); border-radius: 0; padding: 9px 12px; min-height: 42px; transition: border-color .12s;
}
textarea { resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--tekst-4); font-weight: 400; }
input:hover, select:hover, textarea:hover { border-color: var(--tekst-4); }
input:focus, select:focus, textarea:focus { border-color: var(--akcent); outline: none; box-shadow: inset 0 0 0 1px var(--akcent); }
input.velika { text-transform: uppercase; }
input.mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: .04em; }
input.pogresno { border-color: var(--crvena); }
.polja .prekid { grid-column: 1 / -1; }
.prekidac { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--linija); background: var(--povrs-3); font-weight: 600; cursor: pointer; margin-top: 2px; font-size: 13.5px; color: var(--mastilo); }
.polja label.prekidac, .polja .podblok label.prekidac { flex-direction: row; align-items: center; }
.prekidac input { width: 18px; height: 18px; accent-color: var(--akcent); margin: 0; flex: none; }
.prekidac span small { display: block; font-weight: 500; color: var(--tekst-3); font-size: 12px; margin-top: 2px; }
.podblok { grid-column: 1 / -1; display: grid; gap: 14px 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; background: var(--akcent-blagi-2); border: 1px solid var(--akcent-blagi); }
@media (max-width: 560px) { .podblok { grid-template-columns: 1fr; } }
.podblok h3 { grid-column: 1 / -1; font-size: 15px; }
.podblok .objasnjenje { grid-column: 1 / -1; margin-top: -8px; }
.objasnjenje { font-size: 13px; color: var(--tekst-3); margin-bottom: 10px; }
.tip-lica { display: inline-flex; border: 1px solid var(--akcent); margin-left: auto; }
.tip-lica label { cursor: pointer; padding: 5px 13px; font-size: 12.5px; font-weight: 600; color: var(--akcent); }
.tip-lica label:has(input:checked) { background: var(--akcent); color: #fff; }
.tip-lica input { position: absolute; opacity: 0; width: 0; height: 0; }
.radio-grupa { border: 0; padding: 0; margin: 18px 0 0; display: flex; flex-direction: column; gap: 6px; }
.radio-grupa legend { font-size: 12.5px; font-weight: 600; color: var(--akcent); margin-bottom: 8px; }
.radio { display: flex; align-items: flex-start; gap: 10px; font-size: 13.5px; cursor: pointer; padding: 4px 2px; }
.radio input { margin: 4px 0 0; accent-color: var(--akcent); }
#rok-polja { margin-top: 14px; }
.slovima { margin-top: 12px; padding: 11px 14px; background: var(--akcent-blagi); border-left: 4px solid var(--akcent); font-size: 14px; color: var(--akcent); font-weight: 600; }
.uputstvo { border: 1px solid var(--linija); padding: 20px 24px; background: var(--povrs-3); }
.uputstvo h3 { font-size: 16px; margin-bottom: 8px; }
.uputstvo ol { margin: 0; padding-left: 20px; font-size: 13.5px; color: var(--tekst-2); }
.uputstvo li { margin: 6px 0; }
.uputstvo li::marker { color: var(--akcent); font-weight: 700; }

/* lica */
.lica-alat { position: relative; }
.lica-dugme { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; cursor: pointer; padding: 9px 14px; border: 1px dashed var(--akcent); background: var(--akcent-blagi-2); font: inherit; color: var(--mastilo); }
.lica-dugme:hover { background: var(--akcent-blagi); }
.lica-dugme strong { display: block; font-size: 13.5px; color: var(--akcent); }
.lica-dugme small { display: block; font-size: 12px; color: var(--tekst-3); font-weight: 500; }
.lica-ikona { flex: none; width: 30px; height: 30px; background: var(--akcent); color: #fff; display: grid; place-items: center; font-size: 15px; }
.lica-strelica { margin-left: auto; color: var(--tekst-3); }
.lica-panel { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 20; background: #fff; border: 1px solid var(--linija); box-shadow: var(--senka-velika); padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.pretraga-omot { position: relative; flex: 1; }
.pretraga-omot::before { content: ""; position: absolute; left: 12px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666666' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") center/contain no-repeat; pointer-events: none; }
.pretraga-omot input, .lica-pretraga { padding-left: 38px; font-size: 13.5px; }
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; height: 14px; width: 14px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666666' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center/contain no-repeat; cursor: pointer; }
.lica-lista { max-height: 300px; overflow: auto; display: flex; flex-direction: column; gap: 2px; }
.lica-stavka { display: flex; align-items: center; gap: 10px; padding: 8px 10px; cursor: pointer; border: 1px solid transparent; }
.lica-stavka:hover { background: var(--akcent-blagi-2); }
.lica-stavka.ja { background: var(--akcent-blagi-2); border-color: var(--akcent-blagi); }
.lica-avatar { flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--akcent); color: #fff; display: grid; place-items: center; font: 700 12px var(--display); }
.lica-tekst { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.lica-tekst b { font-size: 13.5px; font-weight: 700; color: var(--akcent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lica-tekst small { font-size: 12px; color: var(--tekst-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lica-meta { color: var(--tekst-4) !important; }
.lica-prazno { font-size: 13px; color: var(--tekst-3); padding: 10px 6px; }
.lica-nap { font-size: 12px; color: var(--tekst-4); }
.lica-dno { display: flex; justify-content: flex-end; }
.lica-stavka.nl { cursor: default; border: 1px solid var(--linija); }
.lica-stavka.nl:hover { background: #fff; border-color: var(--linija-jaka); }
.lica-stavka.nl.ja { background: var(--akcent-blagi-2); border-color: var(--akcent-blagi); }
.lica-stavka .akc { display: flex; gap: 2px; flex: none; }
.nl-alat { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; }
.nl-alat .dugme { white-space: nowrap; }
.nl-lista { display: flex; flex-direction: column; gap: 4px; max-height: 360px; overflow: auto; }
.nl-forma { border: 1px solid var(--linija); padding: 14px 16px; background: var(--povrs-3); }
.nl-forma h4 { margin: 0 0 10px; font-size: 14px; }

/* ---- Pregled ---- */
.pregled { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 112px); display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pregled-glava { display: flex; align-items: baseline; justify-content: space-between; }
.pregled-glava h2 { font-size: 17px; }
.status { font-size: 12.5px; color: var(--tekst-3); }
.status.radi::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--plava); margin-right: 6px; animation: puls 1s infinite; }
@keyframes puls { 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .status.radi::before { animation: none; } .dugme, a.kartica { transition: none; } }
.upozorenje { background: var(--upoz-pozadina); color: var(--upoz); padding: 10px 14px; font-size: 13px; border: 1px solid #f1c9cd; border-left: 4px solid var(--crvena); }
.upozorenje ul { margin: 6px 0 0; padding-left: 18px; columns: 2; column-gap: 16px; }
.upozorenje li { break-inside: avoid; }
.list-okvir { background: var(--povrs-2); border: 1px solid var(--linija); padding: 12px; }
.strane { display: flex; flex-direction: column; gap: 12px; max-height: calc(100vh - 230px); overflow: auto; }
.strane canvas { display: block; width: 100%; height: auto; background: #fff; border: 1px solid var(--linija); }
#pdf-okvir { display: block; width: 100%; aspect-ratio: 1 / 1.25; max-height: calc(100vh - 230px); min-height: 480px; border: 0; background: #fff; }
.pregled-nap { font-size: 12px; color: var(--tekst-4); margin-top: 8px; text-align: center; }
.dno { max-width: 1440px; margin: 0 auto; padding: 24px 28px 36px; font-size: 12px; color: var(--tekst-4); border-top: 1px solid var(--linija); }
.dno p { max-width: 80ch; }
.dno-linkovi { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 12px; font-size: 12.5px; }
.dno-linkovi a { color: var(--akcent); text-decoration: none; font-weight: 600; }
.dno-linkovi a:hover { text-decoration: underline; }
.dno-linkovi span { color: var(--tekst-4); }

/* ---- Modal, fioka, toast ---- */
.modal, .fioka { position: fixed; inset: 0; z-index: 50; }
.modal-pozadina { position: absolute; inset: 0; background: rgba(16, 37, 79, .55); }
.modal-kutija { position: relative; margin: 8vh auto 0; width: min(440px, calc(100% - 32px)); background: #fff; padding: 26px 26px 22px; box-shadow: var(--senka-velika); }
.modal-kutija h2 { font-size: 20px; margin-bottom: 4px; }
.modal-opis { font-size: 13.5px; color: var(--tekst-2); margin-bottom: 18px; }
.modal-x { position: absolute; top: 10px; right: 10px; width: 32px; height: 32px; border: 0; background: transparent; color: var(--tekst-3); font-size: 22px; cursor: pointer; }
.modal-x:hover { background: var(--povrs-2); color: var(--mastilo); }
.dugme.google { width: 100%; justify-content: center; gap: 10px; padding: 11px; }
.ili { display: flex; align-items: center; gap: 10px; margin: 16px 0; font-size: 12px; color: var(--tekst-4); }
.ili::before, .ili::after { content: ""; flex: 1; border-top: 1px solid var(--linija); }
.tabovi { display: flex; border-bottom: 2px solid var(--linija); margin-bottom: 14px; }
.tab { flex: 1; border: 0; background: transparent; padding: 9px 12px; cursor: pointer; color: var(--tekst-3); font-weight: 600; font-size: 13.5px; border-bottom: 3px solid transparent; margin-bottom: -2px; }
.tab.aktivan { color: var(--akcent); border-bottom-color: var(--akcent); }
#forma-prijava { display: flex; flex-direction: column; gap: 12px; }
#forma-prijava label { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--akcent); }
.pr-greska { font-size: 13px; color: var(--upoz); background: var(--upoz-pozadina); padding: 9px 12px; border-left: 4px solid var(--crvena); }
.pr-link { font-size: 13px; color: var(--akcent); text-align: center; }
.nalog-kutija { width: min(780px, calc(100% - 32px)); padding: 0; overflow: hidden; margin-top: 6vh; max-height: calc(100vh - 12vh); display: flex; flex-direction: column; }
.nalog-glava { display: flex; align-items: center; gap: 14px; padding: 22px 26px 18px; border-bottom: 1px solid var(--linija); }
.nalog-glava h2 { font-size: 19px; margin-bottom: 2px; }
.nalog-telo { display: grid; grid-template-columns: 200px 1fr; min-height: 0; overflow: auto; }
.nalog-nav { display: flex; flex-direction: column; gap: 0; padding: 14px 0; background: var(--povrs-3); border-right: 1px solid var(--linija); }
.nalog-nav button { text-align: left; border: 0; border-left: 4px solid transparent; background: transparent; padding: 10px 16px; font: 600 13.5px var(--telo); color: var(--tekst-2); cursor: pointer; }
.nalog-nav button:hover { background: #fff; color: var(--akcent); }
.nalog-nav button.aktivan { background: #fff; color: var(--akcent); border-left-color: var(--akcent); }
.nalog-nav a { margin-top: auto; padding: 10px 16px; font-size: 13px; font-weight: 600; text-decoration: none; }
.nalog-sadrzaj { padding: 22px 26px 26px; min-width: 0; }
.nalog-sekcija h3 { font-size: 16px; margin-bottom: 4px; }
.nalog-sekcija > p { font-size: 13px; color: var(--tekst-2); margin-bottom: 16px; max-width: 56ch; }
.nalog-polja { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.nalog-polja label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--akcent); min-width: 0; }
.nalog-polja .prekid { grid-column: 1 / -1; }
.nalog-dugmad { display: flex; gap: 8px; margin-top: 16px; }
.opasna-zona { margin-top: 26px; padding: 16px 18px; border: 1px solid #f1c9cd; border-left: 4px solid var(--crvena); background: var(--upoz-pozadina); }
.opasna-zona h3 { color: var(--crvena); }
.opasna-zona > p { font-size: 13px; color: var(--tekst-2); margin-bottom: 0; }
@media (max-width: 640px) { .nalog-telo { grid-template-columns: 1fr; } .nalog-nav { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--linija); padding: 0; } .nalog-nav button { border-left: 0; border-bottom: 3px solid transparent; } .nalog-nav button.aktivan { border-bottom-color: var(--akcent); } .nalog-nav a { margin-top: 0; } .nalog-polja { grid-template-columns: 1fr; } }
.nalog-blok { border-top: 1px solid var(--linija); padding: 16px 0 6px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.nalog-blok h3 { font-size: 15px; }
.nalog-blok p { font-size: 13px; color: var(--tekst-2); }
.nalog-blok label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--akcent); width: 100%; }
.link-red { display: flex; gap: 8px; width: 100%; }
.link-red input { flex: 1; font-size: 13px; }
.dl-lista { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.dl-stavka { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.dl-tekst { flex: 1; color: var(--tekst-2); }
.dl-status { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 3px 8px; background: #fffa90; color: #5a4a00; }
.dl-status.popunjeno { background: #b5fbb5; color: var(--zelena); }
.fioka-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(540px, 100%); background: #fff; display: flex; flex-direction: column; box-shadow: var(--senka-velika); }
.fioka-glava { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--linija); background: var(--akcent); color: #fff; }
.fioka-glava h2 { font-size: 18px; color: #fff; }
.fioka-glava .modal-x { position: static; color: #fff; }
.fioka-glava .modal-x:hover { background: rgba(255, 255, 255, .15); color: #fff; }
.fioka-filter { display: flex; flex-wrap: wrap; gap: 6px; padding: 14px 18px 0; }
.fioka-filter:empty { display: none; }
.cip { border: 1px solid var(--akcent); background: #fff; padding: 5px 13px; font-size: 12.5px; font-weight: 600; cursor: pointer; color: var(--akcent); }
.cip.aktivan { background: var(--akcent); color: #fff; }
.fioka-lista { overflow: auto; padding: 14px 18px 24px; display: flex; flex-direction: column; gap: 8px; }
.fioka-prazno { font-size: 13.5px; color: var(--tekst-3); padding: 12px 6px; }
.ugovor-stavka { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--linija); background: #fff; }
.ugovor-stavka:hover { border-color: var(--akcent); }
.ugovor-stavka.otvoren { border-color: var(--akcent); border-left-width: 4px; background: var(--akcent-blagi-2); }
.ugovor-info { flex: 1; min-width: 0; }
.vrsta-oznaka { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--plava); font-weight: 700; margin-bottom: 2px; }
.ugovor-info h4 { margin: 0; font: 700 14px/1.3 var(--telo); color: var(--akcent); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ugovor-info .meta { font-size: 12px; color: var(--tekst-3); margin-top: 2px; }
.ugovor-dugmad { display: flex; gap: 4px; flex: none; }
@media (max-width: 560px) { .ugovor-stavka { flex-wrap: wrap; } .ugovor-dugmad { width: 100%; justify-content: flex-end; } }
.toast { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 60; background: var(--akcent); color: #fff; padding: 11px 18px; font-size: 13.5px; font-weight: 600; box-shadow: var(--senka-velika); max-width: calc(100% - 32px); }
.toast.greska { background: var(--crvena); }

/* ---- Početna ---- */
.pocetna-strana .vrh-unutra, .pocetna, .pocetna-strana .dno { max-width: 1440px; padding-left: 28px; padding-right: 28px; }
.pocetna { margin: 0 auto; padding-top: 0; padding-bottom: 40px; display: flex; flex-direction: column; gap: 64px; }
.sekcija-glava { margin-bottom: 22px; max-width: 700px; }
.sekcija-glava h2 { font-size: clamp(22px, 2.6vw, 30px); margin-bottom: 6px; }
.sekcija-glava p { font-size: 14.5px; color: var(--tekst-2); }
.hero { position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; width: 100vw; background: var(--hero); color: #fff; padding: 72px 28px 64px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 40px; align-items: center; }
.hero > * { max-width: 1384px; }
.hero-tekst { justify-self: end; width: 100%; max-width: 660px; }
.hero-vizuel { justify-self: start; width: 100%; max-width: 620px; }
.nadnaslov { font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #a1cdff; margin-bottom: 16px; }
.hero h1 { font-size: clamp(30px, 4.2vw, 52px); line-height: 1.1; text-transform: uppercase; color: #fff; margin-bottom: 16px; letter-spacing: .01em; }
.hero h1 em { font-style: normal; color: #fff; }
.hero-opis { font-size: 16px; color: #fff; line-height: 1.6; max-width: 56ch; font-weight: 500; }
.hero-dugmad { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-tacke { list-style: none; padding: 0; margin: 26px 0 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 13px; font-weight: 600; color: #d2e7ff; }
.hero-tacke li { display: flex; align-items: center; gap: 8px; }
.hero-tacke li::before { content: "✓"; font-weight: 800; color: #fff; }
.hero-vizuel { position: relative; padding: 10px 0 40px; min-height: 520px; display: grid; place-items: center; }
.hero-vizuel::before { content: ""; position: absolute; width: 560px; height: 560px; border-radius: 50%; background: radial-gradient(circle, rgba(74,144,226,.28), rgba(74,144,226,0) 65%); display: block; }
.papir-stek { position: relative; width: min(440px, 100%); transform: rotate(-2deg); }
.papir { background: #fff; padding: 26px 26px 22px; font-size: 9px; line-height: 1.55; color: #2b3445; }
.papir-glavni { position: relative; z-index: 3; box-shadow: 0 40px 70px -26px rgba(0, 0, 0, .65), 0 2px 0 rgba(0, 0, 0, .1); }
.papir-2, .papir-3 { position: absolute; inset: 0; }
.papir-2 { z-index: 2; transform: rotate(3.2deg) translate(10px, 8px); box-shadow: 0 24px 44px -20px rgba(0, 0, 0, .5); }
.papir-3 { z-index: 1; transform: rotate(6.5deg) translate(20px, 16px); box-shadow: 0 20px 36px -18px rgba(0, 0, 0, .4); }
.papir-zaglavlje { display: flex; align-items: center; gap: 6px; font-size: 7px; font-weight: 700; letter-spacing: .12em; color: #6b7793; border-bottom: 1px solid #e5e9f2; padding-bottom: 7px; margin-bottom: 12px; }
.papir-grb { width: 12px; height: 14px; background: linear-gradient(to bottom, #c6363c 33%, #253965 33% 66%, #e9edf5 66%); border: 1px solid #b9c2d4; }
.papir i { display: block; height: 4px; background: #e5e9f2; margin: 5px 0; }
.papir i.kratka { width: 62%; }
.papir-naslov { font: 800 12px/1.35 var(--display); text-align: center; letter-spacing: .03em; margin-bottom: 12px; color: var(--akcent); }
.papir-red { margin: 4px 0; }
.papir-red b { font-weight: 700; color: var(--mastilo); }
.papir-sitno { font-size: 8px; color: #6b7793; }
.papir-strana { display: grid; grid-template-columns: 62px 1fr; gap: 2px 10px; align-items: center; margin: 7px 0; }
.papir-strana span { font-weight: 800; color: var(--mastilo); grid-row: 1 / 3; font-size: 8px; }
.papir-strana i { margin: 2px 0; }
.papir-clan { font-weight: 800; color: var(--mastilo); margin: 11px 0 4px; font-size: 9px; }
.papir-tabela { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #d9deea; }
.papir-tabela div { padding: 5px 7px; border: 1px solid #d9deea; font-weight: 700; color: var(--mastilo); }
.papir-tabela small { display: block; font-size: 6.5px; font-weight: 400; color: #7c8699; }
.papir-potpisi { display: flex; justify-content: space-between; gap: 26px; margin-top: 26px; }
.papir-potpisi span { flex: 1; text-align: center; padding-top: 6px; border-top: 1px solid #2b3445; font-weight: 800; font-size: 7.5px; color: var(--mastilo); position: relative; }
.potpis { position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); width: 86px; height: 26px; opacity: .85; }
.papir-pecat { position: absolute; right: 18px; bottom: 64px; width: 92px; height: 92px; border: 2.5px solid rgba(198, 54, 60, .55); border-radius: 50%; color: rgba(198, 54, 60, .7); display: grid; place-content: center; text-align: center; transform: rotate(-14deg); line-height: 1.3; }
.papir-pecat::before { content: ""; position: absolute; inset: 5px; border: 1px solid rgba(198, 54, 60, .45); border-radius: 50%; }
.papir-pecat span { font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.papir-pecat b { font-size: 6.5px; font-weight: 700; letter-spacing: .04em; }
.papir-pecat small { font-size: 5.5px; letter-spacing: .06em; }
.hero-znacka { position: absolute; right: 0; bottom: 8px; z-index: 5; display: flex; align-items: center; gap: 9px; background: var(--zelena); color: #fff; padding: 11px 16px 11px 12px; font-size: 14px; font-weight: 700; box-shadow: 0 16px 30px -14px rgba(0, 0, 0, .6); }
.hero-znacka svg { width: 24px; height: 24px; padding: 4px; background: #fff; color: var(--zelena); border-radius: 50%; }
@media (max-width: 900px) { .hero { grid-template-columns: 1fr; gap: 20px; padding: 36px 16px 32px; } .hero-tekst, .hero-vizuel { max-width: none; justify-self: stretch; } .hero-vizuel { min-height: 0; padding: 0 0 24px; } .hero-vizuel::before { width: 360px; height: 360px; } .papir-stek { width: min(320px, calc(100% - 40px)); } .papir-2 { transform: rotate(3deg) translate(6px, 6px); } .papir-3 { transform: rotate(6deg) translate(12px, 12px); } .papir-pecat { right: 10px; bottom: 58px; width: 78px; height: 78px; } .hero-znacka { right: 50%; transform: translateX(50%); bottom: 0; font-size: 13px; } .pocetna { gap: 48px; } }
.kartice { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 18px; }
.kartica { display: grid; grid-template-columns: 52px 1fr; grid-template-rows: auto auto; gap: 6px 16px; align-items: start; padding: 22px 22px 18px; background: #fff; border: 1px solid var(--linija); border-top: 4px solid var(--akcent); color: var(--mastilo); text-decoration: none; transition: border-color .12s, background .12s; }
a.kartica:hover { background: var(--akcent-blagi-2); border-color: var(--akcent); }
a.kartica:focus-visible { outline: 3px solid var(--plava); }
.kartica-ikona { grid-row: 1 / 3; width: 52px; height: 52px; background: var(--akcent-blagi); color: var(--akcent); display: grid; place-items: center; }
.kartica-ikona svg { width: 28px; height: 28px; }
.kartica-telo { display: flex; flex-direction: column; gap: 6px; }
.kartica-telo strong { font-family: var(--display); font-size: 17px; font-weight: 700; line-height: 1.25; color: var(--akcent); }
.kartica-telo span { font-size: 13px; color: var(--tekst-2); line-height: 1.55; }
.kartica-oznaka { grid-column: 1 / -1; font-size: 13px; font-weight: 700; color: var(--akcent); margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--linija); }
/* Najtraženiji dokumenti */
.pop-mreza { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1000px) { .pop-mreza { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .pop-mreza { grid-template-columns: 1fr; } }
.pop-kartica { display: flex; flex-direction: column; gap: 10px; padding: 22px; background: var(--akcent); border: 1px solid var(--akcent); color: #fff; text-decoration: none; transition: background .12s; }
.pop-kartica:hover { background: var(--akcent-tamni); }
.pop-kartica:focus-visible { outline: 3px solid var(--plava); outline-offset: 2px; }
.pop-red { display: flex; align-items: center; gap: 10px; }
.pop-mesto { width: 26px; height: 26px; background: #fff; color: var(--akcent); font: 800 13px/26px var(--display); text-align: center; flex: none; }
.pop-znak { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--hero); background: #a1cdff; padding: 3px 8px; }
.pop-ikona { color: #fff; }
.pop-ikona svg { width: 30px; height: 30px; }
.pop-kartica strong { font-family: var(--display); font-size: 17px; font-weight: 700; line-height: 1.25; color: #fff; }
.pop-kad { font-size: 13px; color: #d2e7ff; line-height: 1.5; flex: 1; }
.pop-akcija { font-size: 13px; font-weight: 700; color: #fff; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .35); }

.uskoro-blok { margin-top: 22px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.uskoro-blok h3 { font-size: 12.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--tekst-3); }
.uskoro-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.uskoro-lista li { font-size: 13px; color: var(--tekst-2); background: #fff; border: 1px solid var(--linija); padding: 5px 12px; }
.kako { padding: 0; }
.koraci { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--linija); }
.koraci li { padding: 26px 26px 24px; border-right: 1px solid var(--linija); background: #fff; }
.koraci li:last-child { border-right: 0; }
.korak-broj { display: inline-block; width: 40px; height: 40px; background: var(--akcent); color: #fff; font: 800 17px/40px var(--display); text-align: center; margin-bottom: 16px; }
.koraci h3 { font-size: 16px; margin-bottom: 8px; }
.koraci p { font-size: 13.5px; color: var(--tekst-2); line-height: 1.65; }
@media (max-width: 860px) { .koraci { grid-template-columns: 1fr; } .koraci li { border-right: 0; border-bottom: 1px solid var(--linija); } .koraci li:last-child { border-bottom: 0; } }
.prednosti-mreza { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 700px) { .prednosti-mreza { grid-template-columns: 1fr; } }
.prednosti-mreza article { padding: 24px; background: var(--akcent-blagi-2); border: 1px solid var(--akcent-blagi); border-top: 4px solid var(--akcent); }
.prednost-ikona { display: grid; place-items: center; width: 42px; height: 42px; background: var(--akcent); color: #fff; margin-bottom: 14px; }
.prednost-ikona svg { width: 22px; height: 22px; }
.prednosti-mreza h3 { font-size: 16px; margin-bottom: 8px; }
.prednosti-mreza p { font-size: 13.5px; color: var(--tekst-2); line-height: 1.6; }
.pitanja-lista { display: flex; flex-direction: column; gap: 0; max-width: 900px; border-top: 1px solid var(--linija); }
.pitanja-lista details { border-bottom: 1px solid var(--linija); padding: 0 4px; }
.pitanja-lista summary { cursor: pointer; list-style: none; padding: 16px 32px 16px 0; font-weight: 700; font-family: var(--display); font-size: 14.5px; color: var(--akcent); position: relative; }
.pitanja-lista summary::-webkit-details-marker { display: none; }
.pitanja-lista summary::after { content: ""; position: absolute; right: 6px; top: 20px; width: 9px; height: 9px; border-right: 2px solid var(--akcent); border-bottom: 2px solid var(--akcent); transform: rotate(45deg); transition: transform .15s; }
.pitanja-lista details[open] summary::after { transform: rotate(-135deg); top: 26px; }
.pitanja-lista details p { padding: 0 0 18px; font-size: 13.5px; color: var(--tekst-2); line-height: 1.65; max-width: 75ch; }
.poziv { text-align: center; padding: 56px 24px; background: var(--hero); color: #fff; position: relative; left: 50%; margin-left: -50vw; width: 100vw; }
.poziv h2 { font-size: clamp(22px, 2.6vw, 30px); margin-bottom: 8px; color: #fff; text-transform: uppercase; }
.poziv p { color: #d2e7ff; font-size: 14.5px; }
.poziv .hero-dugmad { justify-content: center; margin-top: 22px; }
.poziv .dugme.glavno { background: #fff; color: var(--akcent); border-color: #fff; }
.poziv .dugme.glavno:hover { background: #d2e7ff; }
.poziv .dugme:not(.glavno) { background: transparent; color: #fff; border-color: #fff; }
.poziv .dugme:not(.glavno):hover { background: rgba(255, 255, 255, .12); }
.dok-uvod { padding: 4px 2px 6px; }
.dok-uvod h1 { font-size: clamp(20px, 2.4vw, 26px); margin-bottom: 6px; }
.dok-uvod p { font-size: 13.5px; color: var(--tekst-2); line-height: 1.6; max-width: 70ch; }
.dok-pitanja h2 { font-size: 17px; margin-bottom: 10px; }
.dok-pitanja details { border-top: 1px solid var(--linija); }
.dok-pitanja summary { cursor: pointer; list-style: none; padding: 12px 28px 12px 0; font-weight: 700; font-size: 13.5px; color: var(--akcent); position: relative; }
.dok-pitanja summary::-webkit-details-marker { display: none; }
.dok-pitanja summary::after { content: ""; position: absolute; right: 4px; top: 16px; width: 8px; height: 8px; border-right: 2px solid var(--akcent); border-bottom: 2px solid var(--akcent); transform: rotate(45deg); }
.dok-pitanja details[open] summary::after { transform: rotate(-135deg); top: 20px; }
.dok-pitanja details p { padding: 0 0 14px; font-size: 13.5px; color: var(--tekst-2); line-height: 1.6; }

/* ---- Punomoćje / izbor vrste ---- */
.vrste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 560px) { .vrste { grid-template-columns: 1fr; } }
.kartica-vrsta { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--linija-jaka); cursor: pointer; background: #fff; transition: border-color .12s, background .12s; }
.kartica-vrsta:hover { border-color: var(--akcent); }
.kartica-vrsta:has(input:checked) { border-color: var(--akcent); background: var(--akcent-blagi-2); box-shadow: inset 0 0 0 1px var(--akcent); }
.kartica-vrsta input { margin: 3px 0 0; accent-color: var(--akcent); }
.kartica-tekst { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; font-weight: 600; color: var(--akcent); }
.kartica-tekst small { color: var(--tekst-3); font-size: 12px; font-weight: 500; }
.vrsta-napomena { margin-top: 12px; padding: 10px 14px; font-size: 13px; background: #fffa90; color: #3a3000; border-left: 4px solid #e0c800; }
.radnje { display: flex; flex-direction: column; gap: 2px; }
.radnja { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; cursor: pointer; padding: 8px 10px; border-bottom: 1px solid var(--linija); }
.radnja:hover { background: var(--akcent-blagi-2); }
.radnja input { margin: 4px 0 0; accent-color: var(--akcent); flex: none; }
.radnja em { font-style: normal; border-bottom: 1px dashed var(--tekst-3); color: var(--tekst-2); }

/* ---- Tekstualne strane ---- */
.tekst-strana { max-width: 1440px; margin: 0 auto; padding: 40px 28px 56px; font-size: 14.5px; line-height: 1.7; }
.tekst-strana > * { max-width: 800px; }
.tekst-strana h1 { font-size: clamp(24px, 3.4vw, 34px); margin-bottom: 6px; }
.datum-vazenja { font-size: 12.5px; color: var(--tekst-4); margin-bottom: 26px; }
.tekst-strana h2 { font-size: 18px; margin: 30px 0 8px; }
.tekst-strana p { margin-bottom: 12px; color: var(--tekst-2); }
.tekst-strana ul { margin: 0 0 12px; padding-left: 22px; color: var(--tekst-2); }
.tekst-strana li { margin: 5px 0; }
.tekst-strana strong { color: var(--mastilo); }
.tekst-strana table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 8px 0 14px; display: block; overflow-x: auto; }
.tekst-strana th, .tekst-strana td { text-align: left; vertical-align: top; padding: 9px 10px; border: 1px solid var(--linija); min-width: 120px; }
.tekst-strana th { background: var(--akcent); color: #fff; font-weight: 600; }
.tekst-strana td { background: #fff; color: var(--tekst-2); }
.ukratko { background: var(--akcent-blagi-2); border: 1px solid var(--akcent-blagi); border-left: 4px solid var(--akcent); padding: 18px 22px 8px; margin: 8px 0 12px; }
.ukratko h2 { margin-top: 0; font-size: 16px; }

/* ---- Popuni (javna strana) ---- */
.popuni { max-width: 760px; margin: 0 auto; padding: 36px 24px 56px; display: flex; flex-direction: column; gap: 16px; }
.popuni .uvod-kartica { background: var(--akcent); color: #fff; padding: 22px 26px; }
.popuni .uvod-kartica h1 { font-size: 22px; margin-bottom: 6px; color: #fff; }
.popuni .uvod-kartica p { color: #d2e7ff; font-size: 14px; }
.popuni .uvod-kartica strong { color: #fff; }
.popuni .gotovo { text-align: center; padding: 28px 22px; }
.popuni .gotovo h2 { font-size: 22px; margin-bottom: 8px; }
.popuni .gotovo p { color: var(--tekst-2); margin-bottom: 16px; }

/* ---- AI pomoć ---- */
.ai-omot { width: 100%; display: flex; flex-direction: column; gap: 8px; }
.ai-traka { display: flex; }
.ai-dugme { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; cursor: pointer; padding: 10px 14px; border: 1px solid var(--akcent-blagi); background: var(--akcent-blagi-2); color: var(--mastilo); font: inherit; transition: border-color .12s, background .12s; }
.ai-dugme:hover { border-color: var(--akcent); background: var(--akcent-blagi); }
.ai-dugme strong { display: block; font-size: 13.5px; font-weight: 700; color: var(--akcent); }
.ai-dugme small { display: block; font-size: 12.5px; color: var(--tekst-3); font-weight: 500; margin-top: 1px; }
.ai-ikona { flex: none; width: 30px; height: 30px; display: grid; place-items: center; background: var(--akcent); color: #fff; font-size: 15px; }
.ai-panel { padding: 14px 16px; border: 1px solid var(--akcent-blagi); border-left: 4px solid var(--akcent); background: var(--akcent-blagi-2); display: flex; flex-direction: column; gap: 10px; }
.ai-glava { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--tekst-2); }
.ai-glava b { color: var(--akcent); }
.ai-glava .ai-ikona { width: 26px; height: 26px; font-size: 13px; }
.ai-panel label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; font-weight: 600; color: var(--akcent); }
.ai-panel label em { font-style: normal; font-weight: 500; color: var(--tekst-4); }
.ai-panel textarea { background: #fff; }
.ai-predlozi { display: flex; flex-wrap: wrap; gap: 6px; }
.ai-red { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.ai-rezultat { display: flex; flex-direction: column; gap: 8px; border-top: 1px dashed var(--akcent-blagi); padding-top: 10px; }
.ai-rezultat::before { content: "Predlog teksta – pregledajte i po potrebi ispravite pre ubacivanja"; font-size: 12.5px; color: var(--tekst-3); }

/* ---- Dijalozi (zamena za window.confirm / prompt) ---- */
.dijalog-kutija { width: min(460px, calc(100% - 32px)); margin-top: 14vh; padding: 0; border-top: 4px solid var(--akcent); }
.dijalog-kutija.opasno { border-top-color: var(--crvena); }
.dijalog-glava { display: flex; align-items: center; gap: 12px; padding: 20px 24px 12px; }
.dijalog-glava h2 { font-size: 18px; margin: 0; }
.dijalog-ikona { flex: none; width: 36px; height: 36px; display: grid; place-items: center; background: var(--akcent-blagi); color: var(--akcent); }
.dijalog-ikona svg { width: 20px; height: 20px; }
.dijalog-kutija.opasno .dijalog-ikona { background: #fde8e8; color: var(--crvena); }
.dijalog-kutija.opasno h2 { color: var(--crvena); }
.dijalog-tekst { padding: 0 24px 4px; font-size: 13.5px; color: var(--tekst-2); line-height: 1.6; }
.dijalog-polje { display: flex; flex-direction: column; gap: 6px; padding: 12px 24px 0; font-size: 12.5px; font-weight: 600; color: var(--akcent); }
.dijalog-greska { margin: 10px 24px 0; padding: 8px 12px; font-size: 13px; color: var(--upoz); background: var(--upoz-pozadina); border-left: 4px solid var(--crvena); }
.dijalog-dugmad { display: flex; justify-content: flex-end; gap: 8px; padding: 18px 24px 20px; margin-top: 8px; border-top: 1px solid var(--linija); background: var(--povrs-3); }
.dugme.opasno-puno { background: var(--crvena); border-color: var(--crvena); color: #fff; }
.dugme.opasno-puno:hover { background: #a80116; border-color: #a80116; }

/* ---- Ikone u menijima i dugmadima ---- */
.ik { width: 17px; height: 17px; flex: none; color: var(--akcent); }
.meni-lista button, .meni-lista a { display: flex; align-items: center; gap: 10px; }
.meni-lista button.opasno .ik { color: var(--crvena); }
.dugme.mali .ik { width: 15px; height: 15px; }
.akc .dugme, .ugovor-dugmad .dugme { padding: 6px 8px; }
.ik.puna { fill: currentColor; }
#btn-pismo { text-align: left; }

/* ---- SEO sadržaj na strani dokumenta ---- */
.dok-tekst h2 { font-size: 17px; margin-bottom: 12px; }
.dok-lista { margin: 0; padding-left: 20px; display: grid; gap: 7px; font-size: 13.5px; color: var(--tekst-2); line-height: 1.6; }
.dok-lista li::marker { color: var(--akcent); }
.dok-lista.greske li::marker { color: var(--crvena); }
.dok-srodni h2 { font-size: 17px; margin-bottom: 12px; }
.srodni-mreza { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 620px) { .srodni-mreza { grid-template-columns: 1fr; } }
.srodni-mreza a { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--linija); text-decoration: none; background: #fff; }
.srodni-mreza a:hover { border-color: var(--akcent); background: var(--akcent-blagi-2); }
.srodni-ikona { flex: none; width: 34px; height: 34px; background: var(--akcent-blagi); color: var(--akcent); display: grid; place-items: center; }
.srodni-ikona svg { width: 20px; height: 20px; }
.srodni-mreza strong { display: block; font-size: 13.5px; color: var(--akcent); line-height: 1.3; }
.srodni-mreza small { display: block; font-size: 12px; color: var(--tekst-3); margin-top: 2px; line-height: 1.45; }