/* RADNI STOL — na GDS-u (G5.3: novi moduli SAMO na GDS-u). Boje ISKLJUČIVO iz /gds/genesis-tokens.css;
   komponente iz /gds/genesis-ui.css (gds-kartica, gds-badge, gds-gumb, gds-forma, gds-toast, gi ikone).
   Ovdje samo RASPORED (grid/flex/razmaci) — nijedna hex boja (G4a detektor = 0). */
*{box-sizing:border-box}
body{margin:0;background:var(--boja-pozadina);color:var(--boja-tekst);font-family:var(--font-osnovni);font-size:var(--tekst-m);line-height:1.5;padding-bottom:var(--razmak-6)}
a{color:var(--boja-akcija)}
.omot{max-width:1240px;margin:0 auto;padding:0 var(--razmak-4)}
header{position:sticky;top:0;z-index:5;background:var(--boja-pozadina-2);border-bottom:1px solid var(--boja-rub);box-shadow:var(--sjena-1)}
.zag{display:flex;align-items:center;gap:var(--razmak-4);padding:var(--razmak-3) var(--razmak-4);max-width:1240px;margin:0 auto;flex-wrap:wrap}
.marka{font-weight:800;font-size:var(--tekst-l);letter-spacing:.02em;display:flex;align-items:center;gap:var(--razmak-2)}
.marka b{color:var(--boja-akcija)}
.pod{color:var(--boja-tekst-3);font-size:var(--tekst-xs);font-family:var(--font-mono)}
.desno{margin-left:auto;display:flex;gap:var(--razmak-2);align-items:center}

/* presuda traka = gds-kartica u zaglavlju, rub nosi stanje (token boje) */
.presuda-traka{display:flex;align-items:center;gap:var(--razmak-2);padding:var(--razmak-2) var(--razmak-4);border:1px solid var(--boja-rub);border-radius:var(--radijus-m);background:var(--boja-povrsina);font-family:var(--font-mono);font-weight:700}
.presuda-traka.OK{border-color:var(--boja-uspjeh)} .presuda-traka.DEGRADED{border-color:var(--boja-upozorenje)}
.presuda-traka.ALARM{border-color:var(--boja-greska);background:var(--boja-greska-podloga)}
.presuda-traka.NEPOZNATO{border-color:var(--boja-tekst-3);border-style:dashed} .presuda-traka.MJERI_SE{border-color:var(--boja-info);border-style:dashed}

.tocka{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none;background:var(--boja-tekst-3)}
.tocka.OK,.tocka.ok{background:var(--boja-uspjeh)} .tocka.DEGRADED,.tocka.degraded{background:var(--boja-upozorenje)}
.tocka.ALARM,.tocka.alarm{background:var(--boja-greska)} .tocka.MJERI_SE{background:var(--boja-info)}

section{margin-top:var(--razmak-6)}
h2{font-size:var(--tekst-xs);text-transform:uppercase;letter-spacing:.14em;color:var(--boja-tekst-3);margin:0 0 var(--razmak-3);font-weight:600}
h2 span:first-child{color:var(--boja-akcija)}

.kartice{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--razmak-3)}
.kartica{cursor:pointer}
.kartica h3{font-size:var(--tekst-m);display:flex;align-items:center;gap:var(--razmak-2);margin:0}
.kartica h3 .gds-badge{margin-left:auto}
.kartica .pitanje{color:var(--boja-tekst-3);font-size:var(--tekst-s);margin-top:var(--razmak-1)}
.kartica .razlozi{display:none;margin-top:var(--razmak-3);font-size:var(--tekst-s);border-top:1px dashed var(--boja-rub);padding-top:var(--razmak-2)}
.kartica.otvorena .razlozi{display:block}
.kartica .razlozi ul{margin:0;padding-left:var(--razmak-4)} .kartica .razlozi li{margin:var(--razmak-1) 0}
.kartica .izvor{color:var(--boja-tekst-3);font-family:var(--font-mono);font-size:var(--tekst-xs);margin-top:var(--razmak-2)}
.kartica.ALARM{border-color:var(--boja-greska)} .kartica.DEGRADED{border-color:var(--boja-upozorenje)}
.kartica.NEPOZNATO,.kartica.MJERI_SE{border-style:dashed}

.tablica-omot{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:var(--tekst-s)}
th,td{padding:var(--razmak-2) var(--razmak-3);text-align:left;border-bottom:1px solid var(--boja-rub);white-space:nowrap}
th{color:var(--boja-tekst-3);font-weight:600;font-size:var(--tekst-xs);text-transform:uppercase;letter-spacing:.08em}
tr.sivo td{color:var(--boja-tekst-3);font-style:italic}
td.mono{font-family:var(--font-mono)}

.feed{display:flex;flex-direction:column;gap:var(--razmak-2)}
.feed .stavka{display:flex;gap:var(--razmak-3);align-items:baseline;font-size:var(--tekst-s);padding:var(--razmak-2) var(--razmak-4)}
.feed .stavka .kad{font-family:var(--font-mono);color:var(--boja-tekst-3);font-size:var(--tekst-xs);flex:none}

.most-poruke{display:flex;flex-direction:column;gap:var(--razmak-2);max-height:420px;overflow:auto;margin-bottom:var(--razmak-3)}
.por{border:1px solid var(--boja-rub);border-radius:var(--radijus-s);padding:var(--razmak-2) var(--razmak-3);font-size:var(--tekst-s);background:var(--boja-povrsina);white-space:pre-wrap}
.por .tko{font-family:var(--font-mono);font-size:var(--tekst-xs);color:var(--boja-tekst-3);display:flex;gap:var(--razmak-2);align-items:center;white-space:normal}
.por.KAPETAN{border-left:3px solid var(--boja-upozorenje)} .por.IZVRSITELJ{border-left:3px solid var(--boja-info)} .por.IVAN{border-left:3px solid var(--boja-uspjeh)}
.por .kljuc.ok{color:var(--boja-uspjeh)} .por .kljuc.lose{color:var(--boja-greska)}
.most-unos{display:flex;gap:var(--razmak-2);align-items:center}
.most-unos input{flex:1}
.zadaci{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--razmak-3);margin-top:var(--razmak-4)}
.zadaci h4{font-size:var(--tekst-xs);text-transform:uppercase;letter-spacing:.1em;color:var(--boja-tekst-3);margin:0 0 var(--razmak-2)}
.zad{border:1px solid var(--boja-rub);border-radius:var(--radijus-s);padding:var(--razmak-2) var(--razmak-3);font-size:var(--tekst-xs);margin-bottom:var(--razmak-2);background:var(--boja-povrsina)}
.zad .w3{font-family:var(--font-mono);color:var(--boja-tekst-3);word-break:break-all}
@media (max-width:900px){.zadaci{grid-template-columns:1fr}}

/* NALOG (kartica "Nalog", c4212 R4) — vrijeme snimke + gumb Osvježi uvijek vidljivi, ne prešućeni */
.nalog-alat{display:flex;justify-content:space-between;align-items:center;gap:var(--razmak-3);margin-bottom:var(--razmak-3)}
.nalog-blok{padding:var(--razmak-4);margin-bottom:var(--razmak-4)}
.nalog-blok h3{font-size:var(--tekst-m);margin:0 0 var(--razmak-2);display:flex;flex-wrap:wrap;gap:var(--razmak-2);align-items:baseline}
.nalog-sazetak{display:flex;flex-wrap:wrap;gap:var(--razmak-3);align-items:center;font-size:var(--tekst-s);color:var(--boja-tekst-3);margin-bottom:var(--razmak-3)}
.nalog-sazetak b{color:var(--boja-tekst)}
.nalog-blok .ceka-ivana{margin-top:var(--razmak-2);font-size:var(--tekst-s);color:var(--boja-upozorenje)}

/* MREŽA (kartica "Mreža", MREZA-UI-1) — pogled na granu DNK interneta */
.mreza-test-prekidac{display:flex;align-items:center;gap:var(--razmak-1);cursor:pointer}
.mreza-blok{padding:var(--razmak-4);margin-bottom:var(--razmak-3)}
.mreza-blok h3{font-size:var(--tekst-s);text-transform:uppercase;letter-spacing:.1em;color:var(--boja-tekst-3);margin:0 0 var(--razmak-3);font-weight:600}
.mreza-epoha{display:flex;align-items:center;gap:var(--razmak-3)}
.mreza-broj{font-family:var(--font-mono);font-size:var(--tekst-l);font-weight:700}
.mreza-red-nepoznato{font-size:var(--tekst-s);color:var(--boja-tekst-3);border:1px dashed var(--boja-rub);border-radius:var(--radijus-s);padding:var(--razmak-2) var(--razmak-3)}
.identikon{fill:var(--boja-akcija);border:1px solid var(--boja-rub);border-radius:var(--radijus-s);background:var(--boja-povrsina);flex:none}
table tr.upozorenje td{background:var(--boja-greska-podloga)}
table tr.alarm-red td:first-child{border-left:3px solid var(--boja-greska)}
.mreza-put{display:inline-block;font-family:var(--font-mono);font-size:var(--tekst-xs);border:1px solid var(--boja-rub);border-radius:var(--radijus-s);padding:1px var(--razmak-2);margin:1px;background:var(--boja-povrsina)}
.mreza-put.alarm-red{border-color:var(--boja-greska);color:var(--boja-greska)}
.mreza-pull{margin-top:var(--razmak-2)}
.mreza-stablo{border-top:1px dashed var(--boja-rub);padding-top:var(--razmak-2);margin-top:var(--razmak-2)}
.mreza-stablo:first-child{border-top:0;margin-top:0;padding-top:0}
.mreza-ime{font-size:var(--tekst-s);padding:var(--razmak-1) 0}
.mreza-ime.dijete{padding-left:var(--razmak-4);border-left:2px solid var(--boja-rub);margin-left:var(--razmak-2)}
.mreza-sukob{font-size:var(--tekst-xs);color:var(--boja-upozorenje);margin-top:var(--razmak-1)}
.mreza-sukob .pobjednik{color:var(--boja-uspjeh);font-weight:700}
.mreza-sukladnost-glave{display:flex;align-items:center;gap:var(--razmak-2);flex-wrap:wrap;margin-bottom:var(--razmak-3)}
.mreza-glifovi{display:flex;gap:var(--razmak-4);flex-wrap:wrap}
.mreza-glif{display:flex;flex-direction:column;align-items:center;gap:var(--razmak-1);text-align:center}
.mreza-glif.siv{opacity:.5}
.mreza-glif-x{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--boja-rub);border-radius:var(--radijus-s);font-family:var(--font-mono);color:var(--boja-tekst-3)}
.mreza-vatra{display:flex;align-items:center;gap:var(--razmak-2);font-size:var(--tekst-s)}
/* ZRCALO (MREZA-UI-3): dvije karte jedna do druge; razlika nosi boju stanja, ne novi hex */
.zrcalo-alat{margin-top:var(--razmak-4)}
.zrcalo-alat .gds-polje{max-width:16rem}
.zrcalo-karte{display:grid;grid-template-columns:1fr 1fr;gap:var(--razmak-4);margin-top:var(--razmak-3)}
@media (max-width:900px){.zrcalo-karte{grid-template-columns:1fr}}
.zrcalo-karta h4{margin:0 0 var(--razmak-2);display:flex;align-items:center;gap:var(--razmak-2);flex-wrap:wrap}
.zrcalo-karta .zrcalo-izvor{font-size:var(--tekst-xs);font-family:var(--font-mono);color:var(--boja-tekst-3);word-break:break-all}
.zrcalo-glava{display:flex;align-items:center;gap:var(--razmak-3);margin-bottom:var(--razmak-3)}
.zrcalo-redak{font-size:var(--tekst-s);padding:var(--razmak-1) 0;border-bottom:1px dashed var(--boja-rub)}
.zrcalo-redak.samo{border-left:3px solid var(--boja-greska);padding-left:var(--razmak-2);color:var(--boja-greska)}
.zrcalo-redak.razlika{border-left:3px solid var(--boja-upozorenje);padding-left:var(--razmak-2)}
.zrcalo-diff{display:flex;align-items:center;gap:var(--razmak-2);flex-wrap:wrap;margin-top:var(--razmak-3);font-size:var(--tekst-s)}
.zrcalo-diff .pod{font-family:var(--font-mono)}

body.tv .desno,body.tv #s-most,body.tv #s-nalog,body.tv #s-mreza{display:none}
body.tv{font-size:var(--tekst-l)}

body.tv #s-uredjaji{display:none}
#s-uredjaji .tab{width:100%;border-collapse:collapse;font-size:var(--tekst-s)}
#s-uredjaji th,#s-uredjaji td{padding:var(--razmak-2) var(--razmak-3);border-bottom:1px solid var(--boja-rub);text-align:left;vertical-align:middle}
#s-uredjaji td:last-child{white-space:normal}
@media(max-width:700px){#s-uredjaji thead{display:none}#s-uredjaji table,#s-uredjaji tbody,#s-uredjaji tr,#s-uredjaji td{display:block;width:100%}#s-uredjaji tr{border-bottom:1px solid var(--boja-rub);padding:var(--razmak-2) 0}#s-uredjaji td{border:0;padding:var(--razmak-1) var(--razmak-3)}#s-uredjaji .uredjaj-akcija{margin:2px 4px 2px 0}}
#s-uredjaji .gds-kartica{overflow-x:auto}
