/* Simin Han – Javni registar · mobile-first, WCAG 2.2 AA, bez inline stilova (CSP) */
:root {
  --zelena: #17463b; --zelena-t: #0f3029; --zelena-s: #317058; --zelena-b: #e7eddf; --zelena-bb: #f1f5ec;
  --krem: #f8f6ee; --papir: #fffdf7; --zlatna: #f0dfa2; --zlatna-t: #8a6a12; --hrda: #ab510e;
  --tekst: #1d2a25; --blag: #56635c; --rub: #dce2d6; --rub-j: #c6cfc0;
  --r: 14px; --r-s: 9px; --sjena: 0 1px 2px rgb(23 70 59 / .06), 0 6px 22px rgb(23 70 59 / .07);
  --serif: Georgia, "Times New Roman", serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
  --nav-h: 64px;
  /* boje statusa (kontrast teksta ≥ 4.5:1 na pozadini značke) */
  --s-EVIDENTIRANO: #5b6670; --s-U_PROVJERI: #8a6a12; --s-DOSTAVLJENO: #1f5f8b; --s-ODGOVOR_ZAPRIMLJEN: #5b3e9e;
  --s-U_PRIPREMI: #0f6b6b; --s-RADOVI_U_TOKU: #ab510e; --s-RIJESENO_POTVRDJENO: #1d6b38; --s-ZATVORENO_BEZ_REALIZACIJE: #6b6b6b;
  color-scheme: light;
  font-family: var(--sans); font-size: 106.25%; line-height: 1.55; color: var(--tekst); background: var(--krem);
}
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom)); }
@media (min-width: 900px) { body { padding-bottom: 0; } }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--zelena-s); text-underline-offset: 3px; }
a:hover { color: var(--zelena); }
:focus-visible { outline: 3px solid #e2a800; outline-offset: 2px; border-radius: 4px; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.15; margin: 0 0 .5em; color: var(--zelena-t); }
h1 { font-size: clamp(1.9rem, 5vw, 2.8rem); }
h2 { font-size: clamp(1.35rem, 3.5vw, 1.8rem); }
h3 { font-size: 1.15rem; }
p { margin: 0 0 .8em; }
button, input, select, textarea { font: inherit; color: inherit; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.preskoci { position: absolute; left: -9999px; top: 8px; z-index: 50; background: #fff; padding: .5rem 1rem; border-radius: 8px; }
.preskoci:focus { left: 8px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ───── okvir ───── */
.okvir { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 700px) { .okvir { padding: 0 28px; } }
.zaglavlje { position: sticky; top: 0; z-index: 20; background: rgb(248 246 238 / .92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--rub); }
.zaglavlje .okvir { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.logo { display: flex; gap: 10px; align-items: center; text-decoration: none; color: var(--zelena-t); }
.logo-znak { width: 40px; height: 40px; border-radius: 12px; background: var(--zelena); color: var(--zlatna); display: grid; place-items: center; font-family: var(--serif); font-weight: 700; }
.logo b { display: block; font-size: 1rem; }
.logo small { display: block; color: var(--blag); font-size: .78rem; }
.nav-gore { display: none; gap: 4px; }
@media (min-width: 900px) { .nav-gore { display: flex; align-items: center; } }
.nav-gore a { text-decoration: none; color: var(--tekst); padding: 8px 12px; border-radius: 999px; font-weight: 500; }
.nav-gore a[aria-current="page"], .nav-gore a:hover { background: var(--zelena-b); color: var(--zelena-t); }
.nav-gore a.cta { background: var(--zelena); color: #fff; margin-left: 6px; }
.nav-gore a.cta:hover { background: var(--zelena-t); }

.nav-dole { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; height: calc(var(--nav-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom);
  display: grid; grid-template-columns: repeat(5, 1fr); background: var(--papir); border-top: 1px solid var(--rub); box-shadow: 0 -4px 18px rgb(23 70 59 / .07); }
@media (min-width: 900px) { .nav-dole { display: none; } }
.nav-dole a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-decoration: none; color: var(--blag); font-size: .72rem; font-weight: 600; min-height: 48px; }
.nav-dole svg { width: 24px; height: 24px; }
.nav-dole a[aria-current="page"] { color: var(--zelena); }
.nav-dole a.istaknuto span.ikona { background: var(--zelena); color: var(--zlatna); border-radius: 14px; width: 46px; height: 34px; display: grid; place-items: center; }
.nav-dole a.istaknuto { color: var(--zelena-t); }

.napomena { font-size: .82rem; color: var(--blag); background: var(--zelena-bb); border-bottom: 1px solid var(--rub); }
.napomena .okvir { padding-top: 6px; padding-bottom: 6px; }
main { padding: 20px 0 48px; min-height: 60vh; }
main:focus { outline: none; }

/* ───── osnovni elementi ───── */
.kartica { background: var(--papir); border: 1px solid var(--rub); border-radius: var(--r); padding: 18px; box-shadow: var(--sjena); }
.mreza { display: grid; gap: 16px; align-content: start; }
@media (min-width: 700px) { .m2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .m3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .m-dash { grid-template-columns: 1.15fr .85fr; } }
.oznaka-sekcije { text-transform: uppercase; letter-spacing: .12em; font-size: .74rem; font-weight: 700; color: var(--zelena-s); margin: 0 0 6px; }
.blag { color: var(--blag); }
.mali { font-size: .86rem; }
.red { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.razmak { justify-content: space-between; }

.dugme { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 10px 18px; border-radius: 999px; border: 1.5px solid var(--zelena);
  background: var(--zelena); color: #fff; font-weight: 650; text-decoration: none; cursor: pointer; }
.dugme:hover { background: var(--zelena-t); color: #fff; }
.dugme:disabled { opacity: .6; cursor: progress; }
.dugme.zlatno { background: var(--zlatna); border-color: var(--zlatna); color: var(--zelena-t); }
.dugme.zlatno:hover { background: #e6d18a; color: var(--zelena-t); }
.dugme.obrub { background: transparent; color: var(--zelena); }
.dugme.obrub:hover { background: var(--zelena-b); color: var(--zelena-t); }
.dugme.opasno { background: #a1251b; border-color: #a1251b; }
.dugme.malo { min-height: 38px; padding: 6px 14px; font-size: .9rem; }
.dugme svg { width: 18px; height: 18px; }

.status { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; white-space: nowrap; color: var(--sc); background: color-mix(in srgb, var(--sc) 12%, #fff); border: 1px solid color-mix(in srgb, var(--sc) 30%, #fff); }
.status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--sc); }
.oznaka { display: inline-block; font-size: .78rem; padding: 3px 8px; border-radius: 6px; background: var(--zelena-b); color: var(--zelena-t); font-weight: 600; }
.oznaka.upoz { background: #fff1d6; color: #7a4c00; }
.broj { white-space: nowrap; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; color: var(--blag); }

.obavijest { border-radius: var(--r-s); padding: 12px 14px; border: 1px solid; margin: 10px 0; }
.obavijest.greska { background: #fdecea; color: #8e2017; border-color: #f0bdb6; }
.obavijest.uspjeh { background: #e5f4ea; color: #1d6b38; border-color: #b5dcc1; }
.obavijest.info { background: var(--zelena-bb); color: var(--zelena-t); border-color: var(--rub-j); }
.obavijest.upoz { background: #fff6e0; color: #6b4300; border-color: #ecd29b; }

/* ───── dashboard ───── */
.hero { display: grid; gap: 0; border-radius: 22px; overflow: hidden; background: var(--zelena); color: #fff; box-shadow: var(--sjena); }
@media (min-width: 800px) { .hero { grid-template-columns: 1fr 1fr; } }
.hero-tekst { padding: 26px 22px; display: flex; flex-direction: column; justify-content: center; }
@media (min-width: 800px) { .hero-tekst { padding: 40px 38px; } }
.hero h1 { color: #fff; margin-bottom: .3em; }
.hero h1 em { color: var(--zlatna); font-style: italic; }
.hero p { color: #dbe7e0; max-width: 34rem; }
.hero .oznaka-sekcije { color: var(--zlatna); }
.hero-slika { position: relative; min-height: 180px; margin: 0; }
.hero-slika img { width: 100%; height: 100%; object-fit: cover; }
.hero-slika figcaption { position: absolute; right: 10px; bottom: 10px; font-size: .72rem; background: rgb(15 48 41 / .78); color: #fff; padding: 3px 9px; border-radius: 999px; }

.kpi-mreza { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
@media (min-width: 800px) { .kpi-mreza { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.kpi { background: var(--papir); border: 1px solid var(--rub); border-radius: var(--r); padding: 14px 16px; text-decoration: none; color: inherit; box-shadow: var(--sjena); position: relative; overflow: hidden; transition: transform .15s; }
.kpi:hover { transform: translateY(-2px); }
.kpi::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--kc, var(--zelena)); }
.kpi b { display: block; font-family: var(--serif); font-size: 2.1rem; font-weight: 400; line-height: 1.1; color: var(--zelena-t); }
.kpi span { font-size: .84rem; color: var(--blag); font-weight: 600; }
.kpi.k-ukupno { --kc: var(--zelena); } .kpi.k-postupak { --kc: #1f5f8b; } .kpi.k-ceka { --kc: #8a6a12; } .kpi.k-rijeseno { --kc: #1d6b38; } .kpi.k-prijave { --kc: var(--hrda); }

.graf-naslov { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.graf-naslov h2 { font-size: 1.2rem; margin: 0; }
.krug-omotac { display: grid; grid-template-columns: 150px 1fr; gap: 16px; align-items: center; }
@media (max-width: 380px) { .krug-omotac { grid-template-columns: 1fr; justify-items: center; } }
.krug svg { width: 150px; height: 150px; }
.krug-srediste { font-family: var(--serif); fill: var(--zelena-t); }
.legenda { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.legenda a { display: grid; grid-template-columns: 12px 1fr auto; gap: 8px; align-items: center; padding: 6px 8px; border-radius: 8px; text-decoration: none; color: var(--tekst); font-size: .9rem; }
.legenda a:hover { background: var(--zelena-bb); }
.legenda i { width: 12px; height: 12px; border-radius: 3px; background: var(--sc); }
.legenda b { font-variant-numeric: tabular-nums; }
.trake { display: grid; gap: 10px; }
.traka { display: grid; grid-template-columns: minmax(7rem, 38%) 1fr 2rem; gap: 10px; align-items: center; font-size: .9rem; text-decoration: none; color: var(--tekst); }
.traka-polje { height: 12px; background: var(--zelena-bb); border-radius: 999px; overflow: hidden; }
.traka-polje span { display: block; height: 100%; background: linear-gradient(90deg, var(--zelena-s), var(--zelena)); border-radius: 999px; transform-origin: left; animation: rasti .7s ease-out both; }
.traka b { text-align: right; font-variant-numeric: tabular-nums; }
@keyframes rasti { from { transform: scaleX(0); } }
.stupci svg { width: 100%; height: 170px; }
.stupci rect { fill: var(--zelena-s); }
.stupci rect.prazno { fill: var(--zelena-b); }
.stupci text { font-size: 10px; fill: var(--blag); font-family: var(--sans); }

.lista-cekanja { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.lista-cekanja a { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 12px; border-radius: var(--r-s); background: var(--zelena-bb); text-decoration: none; color: var(--tekst); }
.lista-cekanja a:hover { background: var(--zelena-b); }
.dani { font-family: var(--serif); font-size: 1.5rem; color: var(--hrda); text-align: right; line-height: 1; }
.dani small { display: block; font-family: var(--sans); font-size: .7rem; color: var(--blag); }

.vremenska { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 2px solid var(--rub-j); }
.vremenska li { position: relative; padding: 0 0 18px 14px; }
.vremenska li::before { content: ""; position: absolute; left: -26px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: var(--papir); border: 3px solid var(--zelena-s); }
.vremenska li:first-child::before { background: var(--zlatna); border-color: var(--zelena); }
.vremenska time { font-weight: 700; font-size: .84rem; color: var(--zelena-s); }
.vremenska h3 { font-family: var(--sans); font-weight: 650; font-size: 1rem; margin: 2px 0 4px; color: var(--tekst); }
.vremenska .izvor { font-size: .82rem; color: var(--blag); }

.napredak { display: grid; gap: 6px; }
.napredak-polje { height: 14px; border-radius: 999px; background: var(--zelena-b); overflow: hidden; }
.napredak-polje span { display: block; height: 100%; background: repeating-linear-gradient(45deg, var(--zelena-s) 0 10px, #3d7f66 10px 20px); transform-origin: left; animation: rasti 1s ease-out both; }

/* ───── registar ───── */
.filteri { display: grid; gap: 12px; margin-bottom: 14px; }
.pretraga { position: relative; }
.pretraga svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: var(--blag); }
.pretraga input { width: 100%; min-height: 50px; padding: 12px 14px 12px 44px; border-radius: 999px; border: 1.5px solid var(--rub-j); background: #fff; }
.pretraga input:focus { border-color: var(--zelena-s); outline: none; box-shadow: 0 0 0 4px rgb(49 112 88 / .15); }
.cipovi { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.cip { flex: none; min-height: 40px; padding: 6px 14px; border-radius: 999px; border: 1.5px solid var(--rub-j); background: var(--papir); cursor: pointer; font-size: .88rem; font-weight: 600; color: var(--tekst); display: inline-flex; align-items: center; gap: 6px; }
.cip[aria-pressed="true"] { background: var(--zelena); border-color: var(--zelena); color: #fff; }
.cip .n { font-size: .78rem; opacity: .75; }
.selekcije { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
@media (min-width: 800px) { .selekcije { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.selekcije label { display: grid; gap: 4px; font-size: .8rem; font-weight: 700; color: var(--blag); }
select, .polje { width: 100%; min-height: 46px; padding: 10px 12px; border-radius: 10px; border: 1.5px solid var(--rub-j); background: #fff; }
select:focus, .polje:focus { border-color: var(--zelena-s); outline: none; box-shadow: 0 0 0 4px rgb(49 112 88 / .15); }
.rezultati-traka { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 6px 0 12px; flex-wrap: wrap; }
.prekidac { display: inline-flex; background: var(--zelena-bb); border-radius: 999px; padding: 3px; }
.prekidac button { border: 0; background: transparent; min-height: 36px; padding: 4px 14px; border-radius: 999px; cursor: pointer; font-weight: 600; font-size: .86rem; color: var(--blag); }
.prekidac button[aria-pressed="true"] { background: #fff; color: var(--zelena-t); box-shadow: 0 1px 3px rgb(0 0 0 / .1); }
.predmet-kartica { display: grid; gap: 8px; text-decoration: none; color: var(--tekst); background: var(--papir); border: 1px solid var(--rub); border-radius: var(--r); padding: 16px; box-shadow: var(--sjena); border-top: 4px solid var(--sc); transition: transform .15s, box-shadow .15s; }
.predmet-kartica:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgb(23 70 59 / .12); color: var(--tekst); }
.predmet-kartica h3 { font-family: var(--sans); font-weight: 650; font-size: 1.05rem; margin: 0; color: var(--zelena-t); }
.predmet-kartica .meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .82rem; color: var(--blag); }
.tabela-omotac { overflow-x: auto; border: 1px solid var(--rub); border-radius: var(--r); background: var(--papir); }
table { border-collapse: collapse; width: 100%; font-size: .92rem; }
th, td { text-align: left; padding: 11px 12px; border-bottom: 1px solid var(--rub); vertical-align: top; }
th { background: var(--zelena-bb); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--blag); }
th button { all: unset; cursor: pointer; display: inline-flex; gap: 4px; align-items: center; }
th button:focus-visible { outline: 3px solid #e2a800; }
tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: var(--zelena-bb); }
.prazno-stanje { text-align: center; padding: 34px 16px; }
.prazno-stanje svg { width: 56px; height: 56px; color: var(--rub-j); margin: 0 auto 8px; }

/* ───── detalj predmeta ───── */
.detalj-glava { display: grid; gap: 10px; margin-bottom: 18px; }
.stepper { list-style: none; margin: 14px 0 6px; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; }
.stepper li { display: grid; gap: 6px; font-size: .7rem; color: var(--blag); text-align: center; }
.stepper li::before { content: ""; height: 8px; border-radius: 999px; background: var(--rub); }
.stepper li.prosao::before { background: var(--zelena-s); }
.stepper li.trenutni::before { background: var(--zlatna-t); box-shadow: 0 0 0 3px rgb(240 223 162 / .9); }
.stepper li.trenutni { color: var(--zelena-t); font-weight: 700; }
@media (max-width: 560px) { .stepper li span { display: none; } .stepper li.trenutni span { display: block; grid-column: 1 / -1; } }
.podaci { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 0; font-size: .92rem; }
.podaci dt { color: var(--blag); }
.podaci dd { margin: 0; font-weight: 500; }

/* ───── forme ───── */
.forma { display: grid; gap: 16px; }
.forma fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.forma legend, .forma label.naslov { font-weight: 700; font-size: .95rem; color: var(--zelena-t); padding: 0; }
.forma .pomoc { font-size: .84rem; color: var(--blag); margin: 0; }
.forma textarea.polje { min-height: 140px; resize: vertical; }
.brojac { font-size: .78rem; color: var(--blag); text-align: right; }
.kategorije-izbor { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 700px) { .kategorije-izbor { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.kategorije-izbor label { position: relative; }
.kategorije-izbor input { position: absolute; opacity: 0; inset: 0; }
.kategorije-izbor span { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 10px 12px; border: 1.5px solid var(--rub-j); border-radius: 12px; background: #fff; font-size: .88rem; font-weight: 600; cursor: pointer; }
.kategorije-izbor input:checked + span { border-color: var(--zelena); background: var(--zelena-b); box-shadow: inset 0 0 0 1px var(--zelena); }
.kategorije-izbor input:focus-visible + span { outline: 3px solid #e2a800; outline-offset: 2px; }
.cekiraj { display: flex; gap: 10px; align-items: flex-start; font-size: .92rem; }
.cekiraj input { width: 22px; height: 22px; margin-top: 1px; flex: none; accent-color: var(--zelena); }
.medeno { position: absolute; left: -5000px; width: 1px; height: 1px; overflow: hidden; }
.kod-prikaz { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: clamp(1.25rem, 5vw, 1.9rem); letter-spacing: .08em; background: #fff; border: 2px dashed var(--zelena-s); border-radius: 14px; padding: 16px; text-align: center; color: var(--zelena-t); word-break: break-all; }
.koraci-prijave { counter-reset: k; list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.koraci-prijave li { counter-increment: k; display: grid; grid-template-columns: 32px 1fr; gap: 10px; align-items: start; font-size: .92rem; }
.koraci-prijave li::before { content: counter(k); width: 32px; height: 32px; border-radius: 50%; background: var(--zelena); color: var(--zlatna); display: grid; place-items: center; font-weight: 700; }

/* ───── ostalo ───── */
.ucitavanje { display: grid; gap: 12px; }
.skelet { height: 90px; border-radius: var(--r); background: linear-gradient(90deg, var(--zelena-bb), #fff, var(--zelena-bb)); background-size: 200% 100%; animation: sjaj 1.2s infinite linear; }
@keyframes sjaj { to { background-position: -200% 0; } }
.podnozje { border-top: 1px solid var(--rub); background: var(--papir); font-size: .86rem; color: var(--blag); }
.podnozje .okvir { padding-top: 22px; padding-bottom: 22px; display: grid; gap: 10px; }
.historija-kartica b.godina { display: block; font-family: var(--serif); font-style: italic; font-size: 1.7rem; color: var(--zelena-s); font-weight: 400; }
.vizija { background: var(--zelena-b); border-radius: 22px; padding: 26px 20px; }
@media (min-width: 700px) { .vizija { padding: 34px 38px; } }
.toast { position: fixed; left: 50%; bottom: calc(var(--nav-h) + 18px); transform: translateX(-50%); background: var(--zelena-t); color: #fff; padding: 10px 18px; border-radius: 999px; z-index: 60; font-weight: 600; box-shadow: var(--sjena); }
@media (min-width: 900px) { .toast { bottom: 24px; } }

/* ───── admin ───── */
.admin-tabovi { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 16px; }
.admin-tabovi button { flex: none; }
.admin-red { display: grid; gap: 12px; }
@media (min-width: 900px) { .admin-red { grid-template-columns: 340px 1fr; align-items: start; } }
.admin-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; max-height: 75vh; overflow: auto; }
.admin-lista button { width: 100%; text-align: left; border: 1px solid var(--rub); background: var(--papir); border-radius: 10px; padding: 10px 12px; cursor: pointer; display: grid; gap: 4px; }
.admin-lista button[aria-current="true"] { border-color: var(--zelena); box-shadow: inset 0 0 0 1px var(--zelena); background: var(--zelena-bb); }
.dvije { display: grid; gap: 10px; }
@media (min-width: 700px) { .dvije { grid-template-columns: 1fr 1fr; } }
details.kartica > summary { cursor: pointer; font-weight: 700; color: var(--zelena-t); }
details.kartica[open] > summary { margin-bottom: 12px; }
.audit-tab td { font-size: .82rem; }
.s-EVIDENTIRANO { --sc: var(--s-EVIDENTIRANO); }
.s-U_PROVJERI { --sc: var(--s-U_PROVJERI); }
.s-DOSTAVLJENO { --sc: var(--s-DOSTAVLJENO); }
.s-ODGOVOR_ZAPRIMLJEN { --sc: var(--s-ODGOVOR_ZAPRIMLJEN); }
.s-U_PRIPREMI { --sc: var(--s-U_PRIPREMI); }
.s-RADOVI_U_TOKU { --sc: var(--s-RADOVI_U_TOKU); }
.s-RIJESENO_POTVRDJENO { --sc: var(--s-RIJESENO_POTVRDJENO); }
.s-ZATVORENO_BEZ_REALIZACIJE { --sc: var(--s-ZATVORENO_BEZ_REALIZACIJE); }

.dugme.svijetlo { background: transparent; border-color: rgb(255 255 255 / .7); color: #fff; }
.dugme.svijetlo:hover { background: rgb(255 255 255 / .12); color: #fff; }
.hero .red { margin-top: 6px; }
@media (max-width: 799px) {
  .hero-tekst { padding: 20px 18px; }
  .hero h1 { font-size: 1.75rem; }
  .hero p { font-size: .95rem; }
  .hero-slika { max-height: 140px; min-height: 0; }
  .hero .dugme { min-height: 44px; padding: 8px 14px; }
}