:root{--bg:#ebedef;--panel:#edf1f3;--navy:#0f3e6f;--blue:#16589c;--mid:#4e769d;--line:#c9d2d9;--fg:#1d2330;--mut:#5d6b78;--ok:#127a3e;--warn:#9a6700;--bad:#b42318}
*{box-sizing:border-box}
body{margin:0;font:12px/1.45 Verdana,Arial,sans-serif;background:var(--bg);color:#111}
.wrap{max-width:1880px;margin:0 auto;padding:0 12px 30px;position:relative}
.logo{position:absolute;right:24px;top:6px;display:flex;align-items:center;gap:12px;font:700 30px/1 "Trebuchet MS",Verdana,sans-serif;letter-spacing:1px;color:#0e3965}
.logo b{color:#14b3e6;font-weight:700}.logo img{height:44px}
.panel{background:var(--panel);border:1px solid #f4f6f7;border-radius:18px;box-shadow:0 0 0 1px #dfe4e8;padding:14px 22px}
.userbar{margin-top:44px;display:flex;gap:10px;align-items:center}
.tabs{display:flex;gap:3px;margin-top:10px;padding-left:6px}
.tabs a{background:var(--mid);color:#fff;font-weight:700;padding:5px 18px;border-radius:12px 12px 0 0;text-decoration:none}
.tabs a:hover{background:#5f8cbb}.tabs a.on{background:var(--navy);color:#ffe100}
main{background:var(--panel);border:1px solid #f4f6f7;border-radius:0 0 18px 18px;padding:0 0 16px;min-height:200px}
main>*:not(.band):not(table):not(.pager){margin-left:18px;margin-right:18px}
h1{font-size:18px;margin:16px 18px 10px}h2{font-size:14px;margin:22px 18px 8px}
.band{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:#fff;font-weight:700;padding:14px 22px;margin:0 0 14px;
  background:linear-gradient(#d6e2ee 0%,#a9c1db 22%,#5484b6 52%,#16589c 78%);border-radius:0 18px 0 0}
.band .info{margin-left:auto}.band select,.band input{font-weight:400}.band .chk{display:inline-flex;gap:4px;align-items:center;color:#fff}
.band b{color:#fff}
table{width:calc(100% - 0px);border-collapse:collapse;background:#fff}
main>table{width:100%}
th{background:linear-gradient(#cfd7db 0%,#739ac3 25%,#356ea9 65%,#16589c 100%);color:#fff;font-weight:700;text-decoration:underline;text-align:left;padding:6px 8px;font-size:12px}
td{padding:5px 8px;vertical-align:top}
tr:nth-child(even) td{background:#fff}tr:nth-child(odd) td{background:var(--panel)}
a{color:#0b3b78}
input,select,textarea{font:inherit;padding:3px 6px;border:1px solid #98a8b6;border-radius:4px;background:#fff;color:#111}
textarea{width:100%;min-height:70px}
button,.btn{font:inherit;font-weight:600;background:linear-gradient(#f4f6f7,#dfe2e4);color:#111;border:1px solid #8a97a4;border-radius:14px;padding:3px 14px;cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.btn:hover{background:#fff}
button.del{color:var(--bad);padding:1px 10px}
.card{background:#f7f9fa;border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-top:12px;margin-bottom:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
label{display:block;font-size:11px;color:var(--mut);margin-bottom:3px}
.flash{padding:9px 14px;border-radius:10px;margin:14px 18px}.flash.ok{background:#e7f6ec;color:var(--ok)}.flash.err{background:#fdecea;color:var(--bad)}
.badge{padding:1px 9px;border-radius:10px;font-weight:700;font-size:11px;background:#e3e7eb;white-space:nowrap}
.s-ok,.s-closed{background:#e1f4e6;color:var(--ok)}.s-open,.s-servicing,.s-transfer{background:#fff1c9;color:var(--warn)}
.s-bad,.s-notsolved{background:#fbe0dc;color:var(--bad)}.s-destroyed,.s-nosolution{background:#e4e4e7;color:#3f3f46}
.pager{text-align:center;margin:14px 0 4px;color:#222}.pager a{color:#0b3b78}
form.filter{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;margin-bottom:12px}
.card.login{max-width:340px;margin:80px auto!important}
.muted{color:var(--mut)}
@media(max-width:800px){.logo{display:none}.userbar{margin-top:12px}.band .info{margin-left:0}}
.dbg{max-width:1340px;margin:10px auto;padding:8px 14px;font:11px/1.4 Consolas,monospace;background:#fffbe6;border:1px solid #e6d98a;border-radius:8px}.dbg ul{margin:4px 0 0 16px;padding:0}
/* Prijavni ekran */
.guest main{background:none;border:0;min-height:0;padding:0}
.loginbox{width:450px;max-width:100%;margin:44px auto 0!important;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px #d4dbe1}
.lh{background:linear-gradient(#0b3b78,#0f4a8e 60%,#0b3b78);color:#fff;font-weight:700;padding:11px 16px}
.lbody{padding:6px 14px 10px}
.lr{display:flex;align-items:center;padding:4px 2px}
.lr label{flex:0 0 168px;margin:0;font-size:12px;font-weight:700;color:#162a6b}
.lr input[type=text],.lr input:not([type]),.lr input[type=password]{width:134px}
.lerr{background:#fdecea;color:var(--bad);border-radius:6px;padding:6px 10px;margin:8px 2px 4px}
.lf{background:#16589c;padding:12px 20px 22px}

/* Široka tablica naloga */
table.wide{font-size:11px}
table.wide td,table.wide th{padding:4px 6px}
table.wide th{text-align:center;line-height:1.15}
th a{color:#fff}
.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:300px;word-break:break-word}
.num{text-align:center;white-space:nowrap}
.toolbar{margin:0 18px 14px;padding:10px 14px;background:#f7f9fa;border:1px solid var(--line);border-radius:14px}
/* Obrazac za unos (Dodaj novi zapis) */
.formbox{width:560px;max-width:100%;margin:26px auto!important;background:#16589c;border-radius:14px;overflow:hidden;padding-bottom:14px}
.fh{background:#0b3b78;color:#fff;font-weight:700;padding:7px 16px}
.fi{background:#fff;margin:6px 16px 0;border-radius:14px 14px 0 0;padding:12px 14px 8px}
.fr{display:flex;align-items:center;gap:6px;padding:3px 0}
.fr label{flex:0 0 110px;margin:0;font-size:11px;font-weight:700;color:#162a6b}
.fr input{width:134px}
.fr .req,.fleg .req{color:#c62828;font-weight:700}
.fleg{margin-top:8px;font-size:11px;color:#444}
.ff{background:linear-gradient(#0f4a8e,#16589c);margin:0 16px;padding:12px 16px 14px;border-radius:0 0 14px 14px}
.fr select{min-width:140px}#sifra{max-width:360px}
.fr textarea{width:300px;min-height:58px}
.fr.top{align-items:flex-start}.fr.top label{padding-top:6px}
.fr .ro{color:#555}
#modul{min-width:140px;max-width:380px}
.fr input[type=date],.fr input[type=time]{width:150px}
/* Glavni zapis + stavke (stranica naloga) */
.mhead{margin:0 4px 8px;padding-top:56px;font-weight:700}
.master .userbar{margin-top:14px}
.mtable{margin-bottom:6px}
.mback{margin:4px 4px 0;font-size:11px;font-weight:700}
.mback a{color:#111}
.empty{background:#dfe2e4;text-align:center;padding:10px;margin:0 18px}
/* Autocomplete (Serial Number) */
.pred{position:absolute;left:116px;top:100%;z-index:20;background:#fff;border:1px solid #98a8b6;border-radius:4px;max-height:230px;overflow:auto;font-size:11px;min-width:340px;box-shadow:0 4px 10px rgba(0,0,0,.15)}
.pred div{padding:4px 8px;cursor:pointer}.pred div:hover{background:#e3edf7}
.fr{position:relative}
.zbroj td{background:#e9edf0!important;font-weight:600}
.mini{padding:1px 8px!important;font-size:11px!important;font-weight:600}
.skriven{position:absolute;opacity:0;width:1px!important;height:1px;pointer-events:none;border:0;padding:0}
.fr .chk-sap{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#162a6b;font-weight:700;margin:0}
.fr .chk-sap input{width:auto}
.pred .nema{color:#9a6700;cursor:default}
.pred .nema:hover{background:#fff}
.fr .sp{flex:0 0 110px}
.fr label.chk-sap{flex:none;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:12px;color:#162a6b;font-weight:700;margin:0}
.fr label.chk-sap input{width:auto;margin:0}
.fr[hidden]{display:none}
/* Uvoz POS-ova */
.uvoz-brojke{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:14px 18px}
.uvoz-brojke div{background:#f7f9fa;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.uvoz-brojke b{display:block;font-size:20px}
.uvoz-brojke .lose b{color:var(--bad)}.uvoz-brojke .dobro b{color:var(--ok)}
details.uvoz{margin:8px 18px}details.uvoz summary{cursor:pointer;font-weight:700;padding:4px 0}
details.uvoz table{margin-top:6px}
/* Napredna pretraga */
.formbox.siroka{width:max-content;min-width:820px;max-width:100%}
.kriterij{background:linear-gradient(#0f4a8e,#16589c);color:#fff;font-size:11px;font-weight:700;text-align:center;padding:6px 10px;margin:0 16px}
.kriterij label.r{display:inline-flex;gap:4px;align-items:center;color:#fff;margin:0 8px;font-size:11px}
.npr{display:grid;grid-template-columns:170px 40px 120px 1fr;gap:8px;align-items:center;padding:3px 0}
.npr label{margin:0;font-size:11px;font-weight:700;color:#162a6b}
.npr.npg{font-size:11px;font-weight:700;color:#162a6b}
.npr input[type=checkbox]{width:auto}
.npr select,.npr input{max-width:100%}
.npr .vr{display:flex;flex-wrap:nowrap;gap:6px;align-items:center}
.npr .v1,.npr .v2{white-space:nowrap}
.npr .v1[hidden],.npr .v2[hidden]{display:none}
.npr .v2{display:inline-flex;gap:4px;align-items:center;font-size:11px}
.ikona{display:inline-block;width:22px;height:22px;line-height:20px;text-align:center;border:1px solid #98a8b6;border-radius:5px;background:linear-gradient(#fff,#e3e8ec);color:#0b3b78;text-decoration:none;font-size:14px}
.ikona:hover{background:#fff;border-color:#0b3b78}

/* Padajući izbornici (Part Number, Dodatno) */
.tabs .mn{position:relative}
.tabs .mn>a.top{display:block}
.tabs .mn>a.top.on{background:var(--navy);color:#ffe100}
.tabs .dd{display:none;position:absolute;left:0;top:100%;z-index:50;margin:0;padding:4px 0;list-style:none;min-width:190px;background:var(--navy);box-shadow:0 4px 10px rgba(0,0,0,.3);border-radius:0 0 8px 8px}
.tabs .mn:hover>.dd,.tabs .mn:focus-within>.dd{display:block}
.tabs .dd li{position:relative}
.tabs .dd a{display:block;background:none;border-radius:0;padding:4px 16px;font-weight:400;color:#e6eef7;white-space:nowrap}
.tabs .dd a:hover{background:var(--mid);color:#fff}
.tabs .dd .sub>.dd{left:100%;top:0;border-radius:0 8px 8px 8px}
.tabs .dd .sub:hover>.dd,.tabs .dd .sub:focus-within>.dd{display:block}
.alati{margin:10px 18px}
.btn.opasno,button.opasno{background:#b42318;color:#fff;margin-left:30px}

/* Skener barkoda */
.skener{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center}
.sk-kutija{position:relative;width:min(100vw,640px);padding:10px;text-align:center}
.sk-kutija video{width:100%;max-height:70vh;background:#000;border-radius:8px;object-fit:cover}
.sk-okvir{position:absolute;left:12%;right:12%;top:30%;height:28%;border:2px solid #ffe100;border-radius:6px;pointer-events:none}
.sk-poruka{color:#fff;margin:12px 0}

.helpbtn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#14b3e6;color:#fff;font:700 16px/1 Verdana,Arial,sans-serif;text-decoration:none}
.helpbtn:hover{background:var(--navy)}