/* Premium Knjiga — izgled. Svijetla i tamna tema, tokeni, jedan sistem. */
:root {
  --navy:#2c3e50; --akcent:#1c7fc3; --akcent-d:#15689e; --akcent-s:#dbeaf7;
  --bg:#f4f6f9; --bg2:#ffffff; --bg3:#eef2f6; --tekst:#1b2530; --tekst2:#5b6775; --crta:#e2e7ed; --sjena:0 8px 28px rgba(44,62,80,.08);
  --zel:#1e8f5a; --zel-s:#dff3e8; --nar:#d9822b; --nar-s:#fdebd8; --crv:#c0392b; --crv-s:#f9dedb; --ljub:#8e44ad; --ljub-s:#ecdff5;
  --side:#22303f; --side-t:#d6dee8; --side-akt:#1c7fc3;
  --r:14px; --r2:9px;
}
:root[data-theme="dark"] {
  --bg:#0f141a; --bg2:#171e27; --bg3:#1f2834; --tekst:#e6ebf1; --tekst2:#9aa7b5; --crta:#2a3542; --sjena:0 8px 28px rgba(0,0,0,.35);
  --akcent-s:#163a55; --zel-s:#123b2a; --nar-s:#45301a; --crv-s:#4a1f1b; --ljub-s:#35204a;
  --side:#0b1016; --side-t:#aab6c3;
}
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; }
body { font-family:'Exo 2','Segoe UI',system-ui,sans-serif; background:var(--bg); color:var(--tekst); font-size:14px; line-height:1.45; -webkit-font-smoothing:antialiased; }
a { color:var(--akcent); text-decoration:none; } a:hover { text-decoration:underline; }
button, input, select, textarea { font:inherit; color:inherit; }
::selection { background:var(--akcent-s); }
.ucitavanje { padding:40px; color:var(--tekst2); }
.skelet { background:linear-gradient(90deg, var(--bg3) 25%, var(--crta) 50%, var(--bg3) 75%); background-size:200% 100%; animation:sk 1.2s infinite; border-radius:8px; height:14px; margin:8px 0; }
@keyframes sk { to { background-position:-200% 0; } }

/* ---------- prijava ---------- */
.prijava { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; background:radial-gradient(1200px 600px at 20% -10%, var(--akcent-s), transparent), var(--bg); }
.prijava .kutija { background:var(--bg2); border:1px solid var(--crta); border-radius:18px; padding:30px 32px; width:100%; max-width:430px; box-shadow:var(--sjena); }
.prijava .logo-plocica { margin:0 auto 18px; }
.prijava h1 { font-size:20px; margin:0 0 4px; text-align:center; }
.prijava .pod { text-align:center; color:var(--tekst2); font-size:13px; margin-bottom:18px; }
.logo-plocica { background:#2c3e50; width:208px; max-width:100%; border-radius:12px; padding:12px 14px; display:flex; align-items:center; justify-content:center; }
.logo-plocica img { width:100%; display:block; }
.vero-logo { display:flex; align-items:center; gap:10px; padding:6px 8px 14px; }
.prijava .vero-logo { justify-content:center; padding:4px 0 10px; }
.vero-logo .vero-znak { width:40px; height:40px; flex:none; }
.vero-logo .vero-znak path { fill:none; stroke-width:8; stroke-linecap:round; }
.vero-logo .vero-ime { font-size:30px; font-weight:800; letter-spacing:-.8px; color:#12343b; line-height:1; }
.vero-logo .vero-ime b { color:#1d9e75; font-weight:800; }
.prijava .vero-logo .vero-znak { width:52px; height:52px; } .prijava .vero-logo .vero-ime { font-size:40px; }
.app.skupljeno aside .vero-logo { justify-content:center; padding:6px 0 12px; } .app.skupljeno aside .vero-logo .vero-ime { display:none; }
:root[data-theme="dark"] .vero-logo .vero-ime { color:#e1f5ee; } :root[data-theme="dark"] .vero-logo .vero-ime b { color:#5dcaa5; }
label { display:block; font-size:12px; color:var(--tekst2); margin:10px 0 4px; }
input:not([type]), input[type=text], input[type=email], input[type=password], input[type=date], input[type=datetime-local], input[type=month], input[type=number], input[type=search], input[type=tel], input[type=url], select, textarea { width:100%; border:1px solid var(--crta); border-radius:var(--r2); padding:8px 11px; background:var(--bg2); color:var(--tekst); }
input:focus, select:focus, textarea:focus { outline:2px solid var(--akcent-s); border-color:var(--akcent); }
input[type=number] { text-align:right; font-variant-numeric:tabular-nums; }
.dug { background:var(--akcent); color:#fff; border:none; border-radius:var(--r2); padding:8px 15px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:background .12s, transform .05s; }
.dug:hover { background:var(--akcent-d); } .dug:active { transform:translateY(1px); }
.dug.sek { background:var(--bg3); color:var(--tekst); } .dug.sek:hover { background:var(--crta); }
.dug.crv { background:var(--crv); } .dug.zel { background:var(--zel); }
.dug.mali { padding:5px 10px; font-size:12.5px; }
.dug.siroko { width:100%; margin-top:16px; justify-content:center; }
.dug:disabled { opacity:.5; cursor:default; transform:none; }
.dug svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.poruka { margin-top:12px; padding:10px 12px; border-radius:var(--r2); font-size:13px; }
.poruka.greska { background:var(--crv-s); color:var(--crv); } .poruka.ok { background:var(--zel-s); color:var(--zel); } .poruka.info { background:var(--akcent-s); color:var(--akcent-d); }
:root[data-theme="dark"] .poruka.info { color:#9ccbf0; } :root[data-theme="dark"] .poruka.greska { color:#f2a59c; } :root[data-theme="dark"] .poruka.ok { color:#8fd9b3; }
.qr { display:flex; justify-content:center; margin:14px 0; } .qr img { border:8px solid #fff; border-radius:8px; }
.tajna { font-family:Consolas, monospace; letter-spacing:2px; text-align:center; background:var(--bg3); padding:8px; border-radius:8px; word-break:break-all; font-size:13px; }

/* ---------- ljuska ---------- */
.app { display:grid; grid-template-columns:272px 1fr; min-height:100vh; }
.app.skupljeno { grid-template-columns:64px 1fr; }
.app aside { background:var(--side); color:var(--side-t); padding:12px 10px; position:sticky; top:0; height:100vh; overflow:auto; display:flex; flex-direction:column; }
.app aside .logo-plocica { width:100%; margin-bottom:10px; }
.app.skupljeno aside .logo-plocica { padding:8px; } .app.skupljeno aside .logo-plocica img { width:36px; }
.app aside .grupa { font-size:10.5px; text-transform:uppercase; letter-spacing:.7px; opacity:.5; padding:12px 10px 3px; }
.app.skupljeno aside .grupa, .app.skupljeno aside .txt { display:none; }
.app aside button { display:flex; align-items:center; gap:10px; width:100%; background:none; border:none; color:var(--side-t); font-size:13.5px; padding:7px 10px; border-radius:9px; cursor:pointer; text-align:left; white-space:nowrap; }
.app aside button:hover { background:rgba(255,255,255,.07); color:#fff; }
.app aside button.akt { background:var(--side-akt); color:#fff; font-weight:600; }
.app aside button:disabled { opacity:.35; cursor:default; }
.app aside svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.app aside .dno { margin-top:auto; border-top:1px solid rgba(255,255,255,.12); padding-top:8px; }
.app aside .modul { margin-top:4px; }
.app aside .modul .zag { font-weight:600; color:#fff; }
.app aside .modul .zag .broj { margin-left:auto; font-size:10.5px; opacity:.55; font-weight:500; }
.app aside .modul .zag .strelica { opacity:.6; transition:transform .15s; font-size:14px; line-height:1; }
.app aside .modul.zatvoren .zag .strelica { transform:rotate(-90deg); }
.app aside .modul .stavke { margin-left:10px; border-left:1px solid rgba(255,255,255,.12); padding-left:4px; }
.app aside .modul.zatvoren .stavke { display:none; }
.app aside button.pod { font-size:13px; padding:5px 10px; white-space:normal; line-height:1.25; }
.app aside .tacka { width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.5; flex:none; margin:0 6px; }
.app aside button.pod.akt .tacka { opacity:1; }
.app.skupljeno aside .modul .stavke { display:none; } .app.skupljeno aside .modul .zag .strelica { display:none; }
.app aside .oznaka { margin-left:auto; }
.app main { min-width:0; display:flex; flex-direction:column; }
.vrh { display:flex; align-items:center; gap:12px; padding:10px 20px; border-bottom:1px solid var(--crta); background:var(--bg2); position:sticky; top:0; z-index:20; }
.vrh h2 { margin:0; font-size:17px; flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vrh .ikdug { background:none; border:1px solid var(--crta); border-radius:9px; width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; color:var(--tekst2); }
.vrh .ikdug:hover { background:var(--bg3); color:var(--tekst); }
.vrh .ikdug svg { width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.vrh .trazi { display:flex; align-items:center; gap:8px; border:1px solid var(--crta); border-radius:9px; padding:6px 10px; color:var(--tekst2); cursor:text; min-width:240px; background:var(--bg); }
.vrh .trazi svg { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.vrh .trazi span { white-space:nowrap; }
.vrh .trazi kbd { font-family:inherit; font-size:11px; border:1px solid var(--crta); border-radius:5px; padding:1px 5px; margin-left:auto; }
.vrh .ko { display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--tekst2); }
.vrh .ko .avatar { width:30px; height:30px; border-radius:50%; background:var(--akcent); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; }
.alati { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.sadrzaj { padding:18px 20px 40px; }
.kpi { display:grid; grid-template-columns:repeat(auto-fit,minmax(185px,1fr)); gap:12px; margin-bottom:16px; }
.kpi .k { background:var(--bg2); border:1px solid var(--crta); border-radius:var(--r); padding:13px 15px; cursor:default; transition:transform .1s, box-shadow .1s; }
.kpi .k.klik { cursor:pointer; } .kpi .k.klik:hover { transform:translateY(-2px); box-shadow:var(--sjena); }
.kpi .k .v { font-size:24px; font-weight:800; letter-spacing:-.3px; font-variant-numeric:tabular-nums; }
.kpi .k .n { font-size:12px; color:var(--tekst2); margin-top:2px; }
.kpi .k.nar .v { color:var(--nar); } .kpi .k.zel .v { color:var(--zel); } .kpi .k.crv .v { color:var(--crv); } .kpi .k.plav .v { color:var(--akcent); }
.kart { background:var(--bg2); border:1px solid var(--crta); border-radius:var(--r); padding:16px 18px; margin-bottom:14px; }
.kart h3 { margin:0 0 10px; font-size:14.5px; display:flex; align-items:center; gap:8px; }
.kart h3 .oznaka { margin-left:auto; }
.mreza { display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); }
.tabela { overflow:auto; border:1px solid var(--crta); border-radius:12px; background:var(--bg2); max-height:72vh; }
/* zbijene tabele (3.11.2026, Dario: „Prevelika su polja i ne stane sve u pregled“): jedan red po stavci, dug tekst skraćen „…“, pun tekst na prelaz mišem */
table.mt { width:100%; border-collapse:separate; border-spacing:0; font-size:12.5px; }
table.mt th { text-align:left; padding:7px 6px; background:var(--bg3); color:var(--tekst2); font-size:10.5px; text-transform:uppercase; letter-spacing:.2px; white-space:nowrap; position:sticky; top:0; z-index:1; border-bottom:1px solid var(--crta); }
table.mt td { padding:4px 6px; border-bottom:1px solid var(--crta); white-space:nowrap; vertical-align:middle; }
table.mt td:not(:has(input, select, button, textarea, details, .meni)) { max-width:380px; overflow:hidden; text-overflow:ellipsis; }
table.mt tr:last-child td { border-bottom:none; }
table.mt th.sortira { cursor:pointer; user-select:none; } table.mt th.sortira:hover { color:var(--akcent); }
table.mt td.br, table.mt th.br { text-align:right; font-variant-numeric:tabular-nums; }
table.mt tr.suma td { font-weight:700; background:var(--bg3); position:sticky; bottom:0; }
table.mt tbody tr:hover td { background:color-mix(in srgb, var(--akcent-s) 45%, transparent); }
table.mt tr.klik { cursor:pointer; }
table.mt td.neg { color:var(--crv); }
.isti-red { display:flex; flex-wrap:wrap; gap:4px 18px; font-size:12.5px; margin-top:8px; color:var(--tekst2); } .isti-red b { color:var(--tekst); font-weight:600; }
table.mt td.w { max-width:200px; overflow:hidden; text-overflow:ellipsis; } table.mt td.w3 { max-width:240px; }
.oznaka { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; padding:2px 8px; border-radius:20px; background:var(--bg3); color:var(--tekst2); white-space:nowrap; }
.oznaka.zel { background:var(--zel-s); color:var(--zel); } .oznaka.nar { background:var(--nar-s); color:var(--nar); } .oznaka.crv { background:var(--crv-s); color:var(--crv); } .oznaka.plav { background:var(--akcent-s); color:var(--akcent-d); } .oznaka.ljub { background:var(--ljub-s); color:var(--ljub); }
:root[data-theme="dark"] .oznaka.plav { color:#9ccbf0; } :root[data-theme="dark"] .oznaka.zel { color:#8fd9b3; } :root[data-theme="dark"] .oznaka.nar { color:#f0b87a; } :root[data-theme="dark"] .oznaka.crv { color:#f2a59c; }
.filter { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px; align-items:end; }
.filter > div { min-width:130px; } .filter label { margin:0 0 4px; }
.cipovi { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.cip { border:1px solid var(--crta); border-radius:20px; padding:4px 11px; font-size:12px; background:var(--bg2); cursor:pointer; }
.cip.akt, .cip:hover { background:var(--navy); color:#fff; border-color:var(--navy); }
.podtab { display:flex; border-bottom:2px solid var(--crta); margin-bottom:14px; flex-wrap:wrap; }
.podtab span { padding:8px 14px; font-size:13px; font-weight:600; color:var(--tekst2); border-bottom:2px solid transparent; margin-bottom:-2px; cursor:pointer; }
.podtab span.akt { color:var(--tekst); border-color:var(--akcent); }
.sifr { color:var(--tekst2); font-family:Consolas, monospace; font-size:12.5px; }
.nap { font-size:12px; color:var(--tekst2); margin-top:10px; line-height:1.5; }
.red { display:flex; gap:8px; margin-top:14px; justify-content:flex-end; flex-wrap:wrap; }
.polja { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; margin-bottom:14px; }
.polje label { margin:0 0 3px; } .polje .v { border:1px solid var(--crta); border-radius:var(--r2); padding:7px 9px; background:var(--bg); font-size:13px; min-height:34px; }
dialog { border:none; border-radius:16px; padding:22px 24px; width:min(560px, 94vw); box-shadow:0 18px 50px rgba(0,0,0,.3); background:var(--bg2); color:var(--tekst); }
dialog.siroka { width:min(1100px, 96vw); }
dialog::backdrop { background:rgba(10,16,24,.55); backdrop-filter:blur(2px); }
dialog h3 { margin:0 0 10px; font-size:17px; }
.pravo { display:inline-block; width:14px; height:14px; border-radius:3px; background:var(--zel-s); border:1px solid #9fd4b8; }
.pravo.ne { background:var(--bg3); border-color:var(--crta); } .pravo.citaj { background:var(--nar-s); border-color:#e6cf7a; }
.prava-tab th, .prava-tab td { text-align:center; } .prava-tab td:first-child, .prava-tab th:first-child { text-align:left; } .prava-tab input { width:16px; height:16px; }
.hodogram { display:flex; gap:0; align-items:stretch; flex-wrap:wrap; }
.hodogram .korak { background:var(--bg); border:1px solid var(--crta); border-radius:10px; padding:8px 12px; font-size:12.5px; min-width:140px; position:relative; margin-right:22px; margin-bottom:8px; }
.hodogram .korak:after { content:'→'; position:absolute; right:-18px; top:8px; color:var(--tekst2); } .hodogram .korak:last-child:after { content:''; }
.hodogram .korak b { display:block; } .hodogram .korak small { color:var(--tekst2); }

/* urednik temeljnice */
.urednik table.mt td { padding:4px 6px; }
.urednik input, .urednik select { padding:6px 8px; font-size:13px; }
.urednik .saldo { font-weight:700; font-variant-numeric:tabular-nums; }
.urednik .saldo.ok { color:var(--zel); } .urednik .saldo.ne { color:var(--crv); }

/* toast */
#toasti { position:fixed; right:18px; bottom:18px; display:flex; flex-direction:column; gap:8px; z-index:100; }
.toast { background:var(--navy); color:#fff; padding:10px 14px; border-radius:10px; font-size:13px; box-shadow:var(--sjena); animation:ulaz .18s ease-out; max-width:360px; }
.toast.greska { background:var(--crv); } .toast.ok { background:var(--zel); }
@keyframes ulaz { from { transform:translateY(8px); opacity:0; } }

/* paleta pretrage */
.paleta { width:min(640px,94vw); padding:0; overflow:hidden; }
.paleta input { border:none; border-bottom:1px solid var(--crta); border-radius:0; padding:14px 18px; font-size:15px; }
.paleta input:focus { outline:none; }
.paleta .rez { max-height:50vh; overflow:auto; }
.paleta .rez div { padding:9px 18px; display:flex; gap:10px; align-items:center; cursor:pointer; }
.paleta .rez div:hover, .paleta .rez div.akt { background:var(--akcent-s); }
.paleta .rez small { color:var(--tekst2); margin-left:auto; }

@media print { .app aside, .vrh, .kartice, .alati, .nap, .red { display:none !important; } .app { display:block; } .tabela { max-height:none; overflow:visible; } body { background:#fff; } }
/* telefon i manji tablet: vidi blok „MOBILNI“ na kraju fajla */

/* polja u tabelama urednika (stavke, etape): zadržavaju zadatu širinu, kompaktnija */
table.mt input, table.mt select { padding:6px 8px; font-size:13px; }

/* moduli koji još nemaju nijedan gotov ekran */
#meni .modul.kasnije .zag { opacity:.55; }

/* podnaslovi unutar modula (Knjiga: Temeljnice / Izvještavanje) */
#meni .modul .podnaslov { font-size:10.5px; letter-spacing:.8px; text-transform:uppercase; color:rgba(255,255,255,.45); padding:8px 10px 2px; }
#meni .modul .podnaslov:first-child { padding-top:4px; }

/* Finansije › Izvještaji: stablo · filter · rezultat */
.izv { display:grid; grid-template-columns:225px 265px minmax(0,1fr); gap:14px; align-items:start; }
.izv .rez { min-width:0; } .izv .rez .tabela { overflow:auto; }
.izv .stablo .grupa-i { font-size:11px; text-transform:uppercase; letter-spacing:.7px; color:var(--tekst2); padding:10px 8px 4px; font-weight:700; }
.izv .stablo .st { display:block; width:100%; text-align:left; background:none; border:none; padding:6px 8px 6px 22px; border-radius:8px; cursor:pointer; color:var(--tekst); font:inherit; font-size:13px; position:relative; }
.izv .stablo .st::before { content:''; position:absolute; left:9px; top:11px; width:6px; height:6px; border-radius:50%; background:var(--crta); }
.izv .stablo .st:hover { background:var(--bg); } .izv .stablo .st.akt { background:var(--akcent-s); color:var(--akcent); font-weight:600; } .izv .stablo .st.akt::before { background:var(--akcent); }
.izv .stablo .st:disabled { opacity:.45; cursor:default; }
.izv .filter-i .polje { margin-bottom:8px; } .izv .filter-i label { font-size:11.5px; }
.izv .rez table.mt tr.grupa td { background:var(--bg); font-weight:700; } .izv .rez table.mt tr.pocetno td { font-style:italic; color:var(--tekst2); } .izv .rez table.mt tr.medjusuma td { border-top:1px solid var(--crta); font-weight:600; }
.izv .istorija .st { font-size:12px; padding-left:8px; } .izv .istorija .st::before { display:none; }
@media (max-width:1100px) { .izv { grid-template-columns:1fr; } }

/* višestruki izbor sa kvačicama (vrste temeljnica, odjeli) */
.vise { border:1px solid var(--crta); border-radius:var(--r2); background:var(--bg2); }
.vise .vise-zag { display:flex; align-items:center; gap:8px; padding:7px 10px; cursor:pointer; font-size:13px; }
.vise .vise-zag .vise-txt { flex:1; } .vise .vise-zag .vise-sve, .vise .vise-zag .vise-nista { font-size:11px; color:var(--akcent); cursor:pointer; }
.vise .vise-lista { display:none; max-height:220px; overflow:auto; border-top:1px solid var(--crta); padding:4px 8px; }
.vise.otvoren .vise-lista { display:block; } .vise .vise-lista label { display:block; font-size:12.5px; padding:3px 0; cursor:pointer; }
.izv .rez table.mt tr.medjusuma.nivo1 td { background:var(--bg); font-weight:800; } .izv .rez table.mt tr.medjusuma.nivo2 td { font-weight:700; } .izv .rez table.mt tr.medjusuma.nivo3 td { font-weight:600; color:var(--tekst2); }

/* izvještaj preko cijelog ekrana (sakriveno stablo i filter, bez unutrašnjeg skrola) */
.izv.puno { grid-template-columns:1fr; } .izv.puno .stablo, .izv.puno .filter-i { display:none; } .izv.puno .rez .tabela { max-height:none !important; }
.vise .vise-trazi { display:flex; gap:6px; align-items:center; padding:4px 0 6px; } .vise .vise-trazi input { padding:5px 8px; font-size:12px; } .vise .vise-trazi span { font-size:11px; color:var(--akcent); cursor:pointer; white-space:nowrap; }
.vise .vise-cip { display:flex; gap:6px; padding:0 0 6px; } .vise .vise-cip span { font-size:11px; padding:2px 8px; border:1px solid var(--crta); border-radius:999px; cursor:pointer; } .vise .vise-cip span:hover { background:var(--akcent-s); color:var(--akcent); }
.izv .istorija .ist-red { display:flex; align-items:flex-start; gap:4px; } .izv .istorija .ist-red .st { flex:1; line-height:1.3; padding:5px 8px; } .izv .istorija .ist-x { color:var(--tekst2); cursor:pointer; padding:6px 4px; font-size:12px; } .izv .istorija .ist-x:hover { color:var(--crv); }

/* izbor poslovne godine u zaglavlju */
.vrh .godina { display:flex; align-items:center; gap:8px; border:1px solid var(--crta); border-radius:9px; padding:0 10px 0 0; background:var(--bg); color:var(--tekst2); font-size:12.5px; white-space:nowrap; }
.vrh .godina select { border:0; background:var(--plava, #2c3e50); color:#fff; font-weight:700; font-size:14px; padding:7px 10px; border-radius:9px 0 0 9px; cursor:pointer; font-family:inherit; }
@media (max-width: 900px) { .vrh .godina .txt { display:none; } .vrh .godina { padding:0; } .vrh .godina select { border-radius:9px; } }

/* grupe polja u dijalogu šifranta (Finera kartice) */
fieldset.grupa { border:1px solid var(--crta); border-radius:10px; padding:8px 12px 10px; margin:0 0 10px; }
fieldset.grupa legend { font-size:12px; font-weight:700; color:var(--tekst2); padding:0 6px; text-transform:uppercase; letter-spacing:.3px; }
.polje.preklop { padding:6px 0; }
.polje.preklop input[type=checkbox] { width:36px; height:20px; appearance:none; background:var(--crta); border-radius:10px; position:relative; cursor:pointer; flex:none; }
.polje.preklop input[type=checkbox]::after { content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:#fff; transition:left .15s; }
.polje.preklop input[type=checkbox]:checked { background:var(--akcent, #2c7be5); }
.polje.preklop input[type=checkbox]:checked::after { left:18px; }

/* tabele šifranata: bez vodoravnog klizača, prelamanje naziva, dvoklik */
.sif-tab { table-layout:auto; width:100%; }
.sif-tab th, .sif-tab td { white-space:normal !important; word-break:normal; }
.sif-tab td:last-child { white-space:nowrap !important; }
.sif-tab .dug.mali { padding:3px 8px; font-size:12px; }
.sif-tab tr.klik { cursor:pointer; }
.sif-tab tr.klik:hover td { background:var(--bg3); }

/* uputstvo za rad */
.uputstvo { display:grid; grid-template-columns:270px 1fr; gap:18px; align-items:start; }
.up-sadrzaj { background:var(--bg2); border:1px solid var(--crta); border-radius:14px; padding:12px; position:sticky; top:118px; display:flex; flex-direction:column; gap:2px; max-height:calc(100vh - 140px); overflow:auto; }
.up-sadrzaj input { margin-bottom:8px; }
.up-sadrzaj a { display:block; padding:7px 10px; border-radius:8px; color:var(--tekst); text-decoration:none; font-size:13.5px; }
.up-sadrzaj a:hover { background:var(--bg3); } .up-sadrzaj a.akt { background:var(--bg3); font-weight:700; }
.up-tekst { max-width:920px; background:var(--bg2); border:1px solid var(--crta); border-radius:14px; padding:20px 28px 30px; line-height:1.6; font-size:14.5px; }
.up-tekst h2 { font-size:21px; margin:4px 0 10px; } .up-tekst h3 { font-size:16px; margin:24px 0 8px; padding-top:8px; border-top:1px solid var(--crta); } .up-tekst h4 { font-size:14.5px; margin:14px 0 6px; }
.up-tekst ol li, .up-tekst ul li { margin:4px 0; } .up-tekst code { background:var(--bg3); padding:1px 5px; border-radius:5px; font-size:12.5px; }
.up-tekst table.tab, .pomoc-tekst table.tab { width:100%; border-collapse:collapse; border:1px solid var(--crta); border-radius:10px; overflow:hidden; font-size:13px; margin:8px 0 12px; }
.up-tekst table.tab th, .pomoc-tekst table.tab th { background:var(--bg3); text-align:left; padding:7px 10px; } .up-tekst table.tab td, .pomoc-tekst table.tab td { padding:6px 10px; border-top:1px solid var(--crta); vertical-align:top; }
.up-tekst mark, .pomoc-tekst mark { background:#fde68a; color:inherit; border-radius:3px; }
.up-rez { padding:8px 10px; border-radius:8px; cursor:pointer; font-size:13px; } .up-rez:hover { background:var(--bg3); } .up-rez b { display:block; }
.pomoc-tekst { max-height:62vh; overflow:auto; line-height:1.55; font-size:14px; }
@media (max-width: 860px) { .uputstvo { grid-template-columns:1fr; } .up-sadrzaj { position:static; max-height:none; } .up-tekst { padding:16px; } }

/* kartice (tabovi) — traka ispod zaglavlja, ljepljiva; aktivna kartica ima boju sadržaja */
.kartice { display:flex; align-items:flex-end; gap:2px; padding:6px 12px 0; background:var(--bg2); border-bottom:1px solid var(--crta); position:sticky; top:55px; z-index:19; min-height:39px; box-sizing:border-box; }
.kartice .kt-lista { display:flex; gap:3px; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; flex:1; min-width:0; align-items:flex-end; }
.kartice .kt-lista::-webkit-scrollbar { display:none; }
.kartice .kt { display:flex; align-items:center; gap:6px; max-width:240px; padding:6px 6px 7px 12px; border:1px solid var(--crta); border-bottom:none; border-radius:9px 9px 0 0; background:var(--bg3); color:var(--tekst2); font-size:12.5px; cursor:pointer; white-space:nowrap; user-select:none; flex:none; position:relative; top:1px; }
.kartice .kt span { overflow:hidden; text-overflow:ellipsis; }
.kartice .kt:hover:not(.akt) { color:var(--tekst); background:var(--bg); }
.kartice .kt.akt { background:var(--bg); color:var(--tekst); font-weight:600; box-shadow:inset 0 2px 0 var(--akcent); }
.kartice .kt.nova span { font-style:italic; }
.kartice .kt.fiks { padding:6px 12px 7px; }
.kartice .kt.vuce { opacity:.4; }
.kartice .kt-x { font-weight:400; font-size:16px; line-height:1; width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center; border-radius:5px; opacity:.5; flex:none; }
.kartice .kt-x:hover { opacity:1; background:var(--bg3); }
.kartice svg { width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.kartice .kt-str { background:none; border:none; color:var(--tekst2); cursor:pointer; padding:4px 3px; align-self:center; border-radius:6px; display:inline-flex; }
.kartice .kt-str:hover:not(:disabled) { background:var(--bg3); color:var(--tekst); }
.kartice .kt-str:disabled { opacity:.3; cursor:default; }
.kt-meni { position:fixed; z-index:200; background:var(--bg2); border:1px solid var(--crta); border-radius:9px; box-shadow:var(--sjena); padding:4px; min-width:210px; }
.kt-meni button { display:block; width:100%; text-align:left; background:none; border:none; padding:7px 12px; border-radius:6px; font:inherit; font-size:13px; color:var(--tekst); cursor:pointer; }
.kt-meni button:hover { background:var(--bg3); }
.kt-meni hr { border:none; border-top:1px solid var(--crta); margin:4px 0; }

/* šihtarica: zbijena mreža radnik × dan */
.mt.sih td, .mt.sih th { padding:3px 2px; font-size:12px; }
.mt.sih td:first-child { padding:4px 8px; }

/* polje sa greškom: crveni okvir, crveni naslov i poruka ispod (oznaciPolje) */
.nevazece > input, .nevazece > select, .nevazece > textarea, .nevazece > div > input, td.nevazece input, td.nevazece select { border-color:var(--crv) !important; box-shadow:0 0 0 3px var(--crv-s) !important; }
.polje.nevazece > label { color:var(--crv); }
.greska-txt { color:var(--crv); font-size:12px; margin-top:3px; line-height:1.3; }

/* ===== Vero (profil privredno): bijeli meni, veće ikonice u obojenim pločicama, svaki modul svoja boja ===== */
.app.vero aside { background:#ffffff; color:#444441; border-right:1px solid #e4e2da; }
.app.vero aside button { color:#444441; font-size:14px; }
.app.vero aside button:hover { background:#f1efe8; color:#2c2c2a; }
.app.vero aside button.akt { background:#e1f5ee; color:#085041; font-weight:600; }
.app.vero aside .modul .zag { color:#2c2c2a; }
.app.vero aside .modul .stavke { border-left-color:#e4e2da; margin-left:22px; }
.app.vero aside button.pod { color:#5f5e5a; }
.app.vero aside button.pod.akt { background:#e1f5ee; color:#085041; }
.app.vero aside .grupa, .app.vero aside .podnaslov { color:#888780; opacity:1; }
.app.vero aside .dno { border-top-color:#e4e2da; }
.app.vero aside > nav > button > svg, .app.vero aside .modul .zag > svg, .app.vero aside .dno svg { width:30px; height:30px; padding:6px; border-radius:9px; stroke-width:1.8; background:#f1efe8; color:#5f5e5a; }
.app.vero aside button[data-e="pocetna"] > svg { background:#1d9e75; color:#fff; }
.app.vero aside button[data-e="uputstvo"] > svg { background:#e6f1fb; color:#185fa5; }
.app.vero aside .modul[data-m="Radna površina"] .zag > svg { background:#eeedfe; color:#534ab7; }
.app.vero aside .modul[data-m="Finansije"] .zag > svg { background:#e6f1fb; color:#185fa5; }
.app.vero aside .modul[data-m="Dokumenti"] .zag > svg { background:#faeeda; color:#854f0b; }
.app.vero aside .modul[data-m="Novac"] .zag > svg { background:#eaf3de; color:#3b6d11; }
.app.vero aside .modul[data-m="PDV"] .zag > svg { background:#faece7; color:#993c1d; }
.app.vero aside .modul[data-m="Osnovna sredstva"] .zag > svg { background:#f1efe8; color:#5f5e5a; }
.app.vero aside .modul[data-m="Kadrovska evidencija"] .zag > svg, .app.vero aside .modul[data-m="Personal"] .zag > svg { background:#fbeaf0; color:#993556; }
.app.vero aside .modul[data-m="Šifranti"] .zag > svg { background:#e1f5ee; color:#0f6e56; }
.app.vero aside .modul[data-m="Podešavanja"] .zag > svg { background:#ece9e1; color:#444441; }
.app.vero.skupljeno aside > nav > button > svg, .app.vero.skupljeno aside .modul .zag > svg { width:32px; height:32px; }
:root[data-theme="dark"] .app.vero aside { background:#1b1d1f; color:#d3d1c7; border-right-color:#2c2c2a; }
:root[data-theme="dark"] .app.vero aside button, :root[data-theme="dark"] .app.vero aside .modul .zag { color:#d3d1c7; }
:root[data-theme="dark"] .app.vero aside button.pod { color:#b4b2a9; }
:root[data-theme="dark"] .app.vero aside button:hover { background:#2c2c2a; color:#f1efe8; }
:root[data-theme="dark"] .app.vero aside button.akt, :root[data-theme="dark"] .app.vero aside button.pod.akt { background:#085041; color:#e1f5ee; }
:root[data-theme="dark"] .app.vero aside .modul .stavke, :root[data-theme="dark"] .app.vero aside .dno { border-color:#2c2c2a; }
.app.vero #meni .modul .podnaslov { color:#888780; }
:root[data-theme="dark"] .app.vero #meni .modul .podnaslov { color:#888780; }

/* Vero: male ikonice podstavki u boji modula */
.app.vero aside button.pod svg.pod-ik { width:16px; height:16px; stroke-width:1.9; flex:none; }
.app.vero aside .modul[data-m="Radna površina"] .stavke svg.pod-ik { color:#534ab7; }
.app.vero aside .modul[data-m="Finansije"] .stavke svg.pod-ik { color:#185fa5; }
.app.vero aside .modul[data-m="Dokumenti"] .stavke svg.pod-ik { color:#854f0b; }
.app.vero aside .modul[data-m="Novac"] .stavke svg.pod-ik { color:#3b6d11; }
.app.vero aside .modul[data-m="PDV"] .stavke svg.pod-ik { color:#993c1d; }
.app.vero aside .modul[data-m="Osnovna sredstva"] .stavke svg.pod-ik { color:#5f5e5a; }
.app.vero aside .modul[data-m="Kadrovska evidencija"] .stavke svg.pod-ik, .app.vero aside .modul[data-m="Personal"] .stavke svg.pod-ik { color:#993556; }
.app.vero aside .modul[data-m="Šifranti"] .stavke svg.pod-ik { color:#0f6e56; }
.app.vero aside .modul[data-m="Podešavanja"] .stavke svg.pod-ik { color:#444441; }
.app.vero aside button.pod.akt svg.pod-ik { color:#085041; }
:root[data-theme="dark"] .app.vero aside .modul .stavke svg.pod-ik { color:#9fe1cb; }


/* ================= MOBILNI (≤ 860 px): meni kao fioka, zbijeno zaglavlje, kartice umjesto tabela, veće mete za prst ================= */
.zastor { display:none; }
.samo-mob { display:none !important; }
@media (max-width:860px) {
  .samo-mob { display:inline-flex !important; }
  .app, .app.skupljeno { grid-template-columns:1fr; }
  .app aside, .app.skupljeno aside { position:fixed; z-index:60; top:0; bottom:0; left:0; width:min(300px, 86vw); height:100%; transform:translateX(-105%); transition:transform .2s ease; box-shadow:0 0 40px rgba(0,0,0,.35); padding-top:calc(12px + env(safe-area-inset-top, 0px)); padding-bottom:calc(12px + env(safe-area-inset-bottom, 0px)); }
  .app.skupljeno aside .grupa, .app.skupljeno aside .txt { display:initial; }
  .app.meni-otvoren aside { transform:none; }
  .app.meni-otvoren .zastor { display:block; position:fixed; inset:0; z-index:55; background:rgba(10,16,24,.45); }
  .app aside button { min-height:42px; font-size:15px; }
  .vrh { padding:8px 10px; gap:6px; padding-top:calc(8px + env(safe-area-inset-top, 0px)); }
  .vrh h2 { font-size:15px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
  .vrh .trazi { min-width:0; padding:0 8px; } .vrh .trazi span, .vrh .trazi kbd { display:none; }
  .vrh .ko span, #zad-novi { display:none; }
  .vrh .godina select { max-width:120px; }
  .kartice { overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none; top:52px; } .kartice::-webkit-scrollbar { display:none; }
  #alatiTraka { top:91px !important; padding:6px 10px !important; }
  .alati { overflow-x:auto; flex-wrap:nowrap; } .alati > * { flex:none; }
  .sadrzaj { padding:12px 10px calc(40px + env(safe-area-inset-bottom, 0px)); }
  .filter > div { min-width:0; flex:1 1 140px; }
  button, .dug, select, input:not([type=checkbox]):not([type=radio]) { min-height:40px; }
  input, select, textarea { font-size:16px; }   /* iPhone ne zumira polje */
  .kpi { grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
  dialog, dialog.siroka { width:100vw; max-width:100vw; height:100%; max-height:100%; margin:0; border-radius:0; padding:16px 14px calc(16px + env(safe-area-inset-bottom, 0px)); }
  dialog .red { position:sticky; bottom:-16px; background:var(--bg2); padding:10px 0; margin-bottom:-16px; border-top:1px solid var(--crta); z-index:2; }
  .tabela { -webkit-overflow-scrolling:touch; }
}
/* liste kao kartice na telefonu: svaki red je kartica, kolona = „naziv: vrijednost“ (oznaka kolone iz zaglavlja tabele) */
@media (max-width:640px) {
  table.mt.mob-k, table.mt.mob-k tbody { display:block; width:100%; }
  table.mt.mob-k tr:first-child:has(th), table.mt.mob-k thead { display:none; }
  table.mt.mob-k tr { display:grid; grid-template-columns:1fr 1fr; gap:2px 12px; padding:10px 12px; margin:0 0 8px; border:1px solid var(--crta); border-radius:12px; background:var(--bg2); }
  table.mt.mob-k td { display:block; border:0; padding:2px 0; white-space:normal; max-width:none; overflow:visible; text-align:left !important; }
  table.mt.mob-k td[data-l]::before { content:attr(data-l); display:block; font-size:11px; color:var(--blijedo, #6b7785); text-transform:uppercase; letter-spacing:.04em; }
  table.mt.mob-k td:first-child { grid-column:1 / -1; font-weight:600; font-size:15px; }
  table.mt.mob-k td:empty { display:none; }
  table.mt.mob-k tr.suma { background:var(--bg); }
}

/* Vero: modul Mail (boja pločice i ikonica podstavki) */
.app.vero aside .modul[data-m="Mail"] .zag > svg { background:#e6f1fb; color:#185fa5; }
.app.vero aside .modul[data-m="Mail"] .stavke svg.pod-ik { color:#185fa5; }
:root[data-theme="dark"] .app.vero aside .modul[data-m="Mail"] .zag > svg { background:#16304a; color:#9cc8f0; }

/* PDV evidencije: red sa upozorenjem */
.upoz-red td { background:var(--nar-s); }
.poruka.upoz { background:var(--nar-s); color:var(--nar); }
.cip.nar { border-color:var(--nar); color:var(--nar); background:var(--nar-s); }

/* korisnički nalog (inicijali u zaglavlju) i podnožje sa autorom */
.vrh .ko { cursor:pointer; border-radius:20px; padding:2px 2px 2px 8px; }
.vrh .ko:hover, .vrh .ko:focus-visible { background:var(--bg3); outline:none; }
.nalog-meni { position:fixed; top:54px; right:16px; z-index:200; width:260px; background:var(--bg2); border:1px solid var(--crta); border-radius:var(--r2); box-shadow:0 10px 30px rgba(0,0,0,.18); padding:6px; }
.nalog-meni .nm-zag { display:flex; gap:10px; align-items:center; padding:8px 8px 10px; border-bottom:1px solid var(--crta); margin-bottom:4px; font-size:13px; }
.nalog-meni .avatar { width:36px; height:36px; border-radius:50%; background:var(--akcent); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-weight:700; flex:none; }
.nalog-meni button { display:flex; align-items:center; gap:10px; width:100%; border:0; background:none; padding:8px; border-radius:8px; font:inherit; font-size:13px; color:var(--tekst); cursor:pointer; text-align:left; }
.nalog-meni button:hover, .nalog-meni button:focus-visible { background:var(--bg3); outline:none; }
.nalog-meni button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; flex:none; }
.nalog-meni .nm-odjava { border-top:1px solid var(--crta); border-radius:0 0 8px 8px; margin-top:4px; color:var(--crv); }
.podnozje { text-align:center; font-size:11.5px; color:var(--tekst2); padding:18px 16px 22px; }