:root{color-scheme:light;--bg:#f3f6fa;--panel:#fff;--row-alt:#f8fafc;--soft:#edf1f7;--ink:#172436;--muted:#53657a;--line:#ced8e5;--accent:#c54217;--accent-fill:#c54217;--accent-fill-hover:#aa3610;--accent-light:#fff1e9;--on-accent:#fff;--ok:#166534;--ok-bg:#e8f7ed;--warn:#704714;--warn-bg:#fff8ea;--danger:#ac2333;--danger-bg:#fff0f2;--shadow:0 3px 14px #1021390c}
body.dark-mode{color-scheme:dark;--bg:#0c1320;--panel:#142030;--row-alt:#18283a;--soft:#1c2b3e;--ink:#edf4ff;--muted:#b0bed0;--line:#3c4d63;--accent:#ffab80;--accent-fill:#c54217;--accent-fill-hover:#aa3610;--accent-light:#34241f;--on-accent:#fff;--ok:#b4f0c6;--ok-bg:#153624;--warn:#ffddb2;--warn-bg:#382a1e;--danger:#ffb0b9;--danger-bg:#392129;--shadow:0 3px 14px #0002}
*{box-sizing:border-box}html{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}body{margin:0;background:var(--bg);color:var(--ink);min-width:290px;font-size:15px;line-height:1.45}button,input,select{font:inherit}button{min-height:44px;cursor:pointer;font-weight:650}button:disabled{opacity:.55;cursor:not-allowed}[hidden]{display:none!important}a{color:var(--accent)}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.topbar{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:1rem max(1rem,calc((100vw - 1160px)/2));background:var(--panel);border-bottom:1px solid var(--line)}.topbar-actions{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;justify-content:flex-end}.site{display:flex;align-items:center;gap:.7rem}.site img{object-fit:contain;flex-shrink:0;background:#fff;border-radius:8px;padding:3px}.site strong{display:block;font-size:1.05rem}.site small{display:block;color:var(--muted)}.session{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;font-size:.85rem}.session span{font-weight:650}.theme-button{width:44px;flex:0 0 44px;padding:.45rem;font-size:1.2rem;line-height:1}main{max-width:1188px;margin:0 auto;padding:1rem}#status{margin:.25rem 0 .75rem;padding:.65rem .9rem;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:.65rem;background:var(--accent-light);font-weight:600}#status.error{background:var(--danger-bg);color:var(--danger);border-color:var(--danger)}.login-box{max-width:440px;margin:4rem auto;background:var(--panel);padding:2rem;border:1px solid var(--line);border-radius:1rem;box-shadow:var(--shadow)}h1{margin-top:0;font-size:1.45rem}h2{margin:.1rem 0;font-size:1.15rem}h3{font-size:1rem;margin:1.1rem 0 .5rem}.login-box p,.login-box small,.panel-head p{color:var(--muted)}.login-box form{display:grid;gap:.85rem;margin:1.5rem 0}label:not(.check){display:grid;gap:.25rem;font-size:.85rem;font-weight:600}input,select{width:100%;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:.65rem;padding:.64rem .72rem;min-height:44px;font-size:16px}.primary{background:var(--accent-fill);color:var(--on-accent);border:1px solid var(--accent-fill);border-radius:.65rem;padding:.65rem .95rem;font-weight:650}.primary:hover:not(:disabled){background:var(--accent-fill-hover);border-color:var(--accent-fill-hover)}.outline{border:1px solid var(--line);border-radius:.65rem;padding:.6rem .8rem;background:var(--panel);color:var(--ink)}.outline:hover:not(:disabled){border-color:var(--accent);background:var(--accent-light)}.period{display:grid;gap:.7rem;background:var(--panel);border-radius:.85rem;border:1px solid var(--line);padding:1rem;box-shadow:var(--shadow)}.quick-days{display:flex;gap:.35rem;overflow-x:auto;scrollbar-width:thin}.quick-days button{white-space:nowrap;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:2rem;padding:.4rem .85rem}.quick-days button[aria-pressed="true"]{background:var(--accent-fill);color:var(--on-accent);border-color:var(--accent-fill)}.date-row{display:flex;align-items:end;gap:.65rem;flex-wrap:wrap}.date-row label{flex:1;min-width:125px}.period small{color:var(--muted)}.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin:.85rem 0}.kpis article{border:1px solid var(--line);border-radius:.85rem;background:var(--panel);padding:1rem;box-shadow:var(--shadow);min-width:0}.kpis article small{color:var(--muted);display:block;min-height:2.7em}.kpis article strong{font-size:clamp(1.05rem,2vw,1.55rem);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.data-note{color:var(--muted);font-size:.85rem;margin:.5rem 0 .9rem}.dashboard-tabs{display:flex;gap:.4rem;overflow-x:auto;margin-bottom:.75rem;scrollbar-width:thin}.dashboard-tabs button{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:.7rem;padding:.72rem 1rem;white-space:nowrap}.dashboard-tabs button[aria-current="page"]{background:var(--accent-fill);color:var(--on-accent);border-color:var(--accent-fill)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:.85rem;padding:1rem;min-height:230px;box-shadow:var(--shadow)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}.panel-head p{font-size:.86rem;margin:.3rem 0}.table-filters{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;margin-bottom:1rem}.table-filters input[type="search"]{flex:1;min-width:170px}.table-filters select{width:auto;max-width:240px}.check{display:flex;align-items:center;gap:.4rem;white-space:nowrap;font-size:.86rem}.check input{width:auto;min-height:auto}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:.75rem;background:var(--panel)}table{border-collapse:collapse;width:100%;font-size:.87rem;background:var(--panel)}th{text-align:left;color:var(--muted);background:var(--soft,var(--row-alt));font-size:.8rem}th,td{border-bottom:1px solid var(--line);padding:.7rem .65rem;vertical-align:middle}tbody tr:nth-child(even)>td{background:var(--row-alt)}td strong{font-weight:650}tr:last-child td{border-bottom:0}td small{display:block;color:var(--muted)}.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.pill{display:inline-block;border-radius:1rem;padding:.2rem .5rem;font-size:.75rem;color:var(--ok);background:var(--ok-bg)}.pill.warn{color:var(--warn);background:var(--warn-bg)}.pill.muted{color:var(--muted);background:var(--row-alt)}.empty{padding:1.5rem;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:.7rem}.summary-strip{display:flex;gap:.75rem;flex-wrap:wrap;padding:.8rem 0;color:var(--muted);font-size:.9rem}.summary-strip strong{color:var(--ink)}.report-line{border:1px solid var(--line);border-radius:.72rem;padding:.75rem .9rem;display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin:.45rem 0;background:var(--panel)}.report-line:nth-child(even){background:var(--row-alt)}.report-line small{display:block;color:var(--muted)}.report-line button{white-space:nowrap}.debt-line{border:1px solid var(--line);border-radius:.7rem;margin:.5rem 0;background:var(--panel)}.debt-line:nth-child(even){background:var(--row-alt)}.debt-line summary{list-style:none;padding:.8rem;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;align-items:center}.debt-line summary::-webkit-details-marker{display:none}.debt-line summary::after{content:"▾";color:var(--muted)}.debt-line[open] summary::after{content:"▴"}.debt-meta{padding:0 .8rem .8rem;font-size:.85rem}.debt-meta h4{margin:.8rem 0 .35rem}.debt-meta p{margin:.3rem 0}.report-dialog-inner{max-height:88dvh;overflow:auto;max-width:920px;width:min(92vw,920px)}dialog{max-width:95vw;max-height:94dvh;border:1px solid var(--line);border-radius:.85rem;background:var(--panel);color:var(--ink);padding:1.2rem;box-shadow:0 20px 70px #0005}dialog::backdrop{background:rgba(12,23,34,.63)}dialog header{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:1px solid var(--line);padding-bottom:.6rem;position:sticky;top:-1.2rem;background:var(--panel);z-index:2}dialog p{font-size:.9rem}.report-info{padding:.6rem 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.report-info span{color:var(--muted)}.report-info strong{display:block;color:var(--ink)}.report-warning{color:var(--warn)}.stock-help{font-size:.78rem;color:var(--muted);margin:.2rem 0 0;max-width:65ch}
@media(max-width:750px){.topbar{padding:.75rem;align-items:flex-start}.topbar-actions{gap:.4rem}.site strong{font-size:.93rem}main{padding:.65rem}.kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.kpis article{padding:.75rem}.kpis article strong{font-size:1.2rem}.session{gap:.4rem}.panel{padding:.75rem}.login-box{margin:2rem auto;padding:1.25rem}.report-line{align-items:flex-start;flex-wrap:wrap}.report-info{grid-template-columns:1fr}.table-filters select{max-width:none;flex:1}.table-filters .check{width:100%}}
@media(max-width:480px){.topbar{flex-wrap:wrap}.topbar-actions{width:100%;justify-content:space-between}.session{flex:1}.theme-button{margin-left:auto}}

.report-analytics-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:1rem;margin-bottom:1.1rem}.report-analysis{min-width:0;border:1px solid var(--line);border-radius:.78rem;padding:.85rem;background:var(--panel)}.report-analysis>h3{margin:.05rem 0 .65rem}.report-list-head{display:flex;align-items:end;justify-content:space-between;gap:.8rem;flex-wrap:wrap;margin:1rem 0 .45rem}.report-list-head h3{margin:0}.report-list-head label{display:flex;align-items:center;gap:.55rem;font-size:.82rem;color:var(--muted)}.report-list-head select{width:auto;min-width:190px}.movement-day{margin:.65rem 0}.movement-day h4{margin:.2rem 0 .4rem}.movement-day .table-wrap{max-height:300px;overflow:auto}@media(max-width:850px){.report-analytics-grid{grid-template-columns:1fr}.report-list-head label{width:100%;align-items:stretch;flex-direction:column}.report-list-head select{width:100%}}


/* v20.63 - vlasnicka analitika i usporedba razdoblja */
.analytics-block{min-width:0;border:1px solid var(--line);border-radius:.8rem;background:var(--panel);padding:.85rem;margin:.85rem 0}.analytics-title{display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start;flex-wrap:wrap}.analytics-title h3{margin:.05rem 0 .25rem}.top-products-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.top-products-grid .analytics-block{margin:0}.quantity-group{margin:.55rem 0 1rem}.quantity-group:last-child{margin-bottom:0}.quantity-group h4{margin:.25rem 0 .4rem;color:var(--muted);font-size:.86rem}.trend{display:inline-flex;align-items:center;justify-content:center;min-width:54px;padding:.18rem .45rem;border-radius:999px;font-size:.76rem;font-weight:800}.trend.up{color:var(--ok);background:var(--ok-bg)}.trend.down{color:var(--danger);background:var(--danger-bg)}.trend.neutral{color:var(--muted);background:var(--soft)}
@media(max-width:900px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.top-products-grid{grid-template-columns:1fr}}
@media(max-width:420px){.kpis{grid-template-columns:1fr}.kpis article small{min-height:auto}}

/* v20.64 - dnevni trendovi i informativna kontrola odstupanja */
.daily-trend{display:grid;gap:.42rem;margin:.55rem 0}
.daily-trend-row{display:grid;grid-template-columns:52px minmax(60px,1fr) minmax(110px,auto);gap:.7rem;align-items:center;padding:.26rem .35rem;border-radius:.45rem}
.daily-trend-row:nth-child(even){background:var(--row-alt)}
.daily-trend-date,.daily-trend-value{font-size:.8rem;font-variant-numeric:tabular-nums}
.daily-trend-date{font-weight:650;color:var(--muted)}.daily-trend-value{text-align:right}
.daily-trend progress{height:16px;width:100%;border:0;border-radius:999px;overflow:hidden;background:var(--soft,var(--row-alt));color:var(--accent-fill);accent-color:var(--accent-fill)}
.daily-trend progress::-webkit-progress-bar{background:var(--soft,var(--row-alt));border-radius:999px}
.daily-trend progress::-webkit-progress-value{background:var(--accent-fill);border-radius:999px}
.daily-trend progress::-moz-progress-bar{background:var(--accent-fill);border-radius:999px}
.trend-no-bar{width:100%;border:1px dashed var(--line);height:16px;text-align:center;border-radius:999px;font-size:11px;line-height:13px;color:var(--muted)}
.alert-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.alert-grid .analytics-block{margin:0}.alert-grid h3{margin:.1rem 0 .4rem}
@media(max-width:850px){.alert-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:420px){.daily-trend-row{grid-template-columns:45px minmax(35px,1fr) minmax(96px,auto);gap:.35rem}.daily-trend-value{font-size:.74rem}}

/* v20.66 - navigation within closed-shift report details */
#report-dialog .report-dialog-inner{min-width:0;}
#report-dialog header{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;}
#report-dialog header h2{min-width:0;margin:0;flex:1 1 220px;font-size:1.05rem;}
#report-dialog .report-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.45rem;}
#report-dialog .report-nav button{min-height:44px;white-space:nowrap;font-size:.86rem;}
#report-dialog .report-nav button:disabled{opacity:.48;cursor:not-allowed;}
#report-dialog #report-position{font-size:.76rem;color:var(--muted);font-variant-numeric:tabular-nums;min-width:32px;text-align:center;}
@media(max-width:620px){
#report-dialog{width:calc(100vw - 16px);max-width:calc(100vw - 16px);box-sizing:border-box;padding:.65rem;}
#report-dialog .report-dialog-inner{width:100%;max-width:100%;box-sizing:border-box;max-height:calc(100dvh - 40px);}
#report-dialog header{top:-.65rem;display:block;}
#report-dialog header h2{width:100%;margin:0 0 .6rem;}
#report-dialog .report-nav{display:grid;width:100%;min-width:0;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.4rem;}
#report-dialog .report-nav button{min-width:0;white-space:normal;padding:.55rem .4rem;font-size:.8rem;}
#report-dialog #report-prev{grid-column:1;}
#report-dialog #report-position{grid-column:2;}
#report-dialog #report-next{grid-column:3;}
#report-dialog #report-close{grid-column:1/-1;width:100%;}
}

/* v20.66 – mobile details navigation: prevent double-tap zoom on these buttons
   while retaining pinch-to-zoom and browser accessibility elsewhere. */
#report-dialog .report-nav,
#report-dialog .report-nav button {
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
}

/* v20.66 UI R2: semantic inactive navigation that still receives touch events.
   The button stays visually inactive but touch-action now works consistently. */
#report-dialog .report-nav button[aria-disabled="true"] {
    opacity: .48;
    cursor: not-allowed;
}
#report-dialog .report-nav button[aria-disabled="true"]:hover {
    border-color: var(--line);
    background: var(--panel);
}


/* v20.67 UI R1: report modal has ONE vertical scroll area. Keep the date
   and previous/next/close controls visible while report content scrolls. */
#report-dialog {
    overflow: hidden;
}
#report-dialog .report-dialog-inner {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: min(88dvh, calc(94dvh - 2.4rem - 2px));
}
#report-dialog header {
    position: static;
    top: auto;
    flex: 0 0 auto;
}
#report-dialog #report-details {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 620px) {
    #report-dialog .report-dialog-inner {
        max-height: min(calc(100dvh - 40px), calc(94dvh - 1.3rem - 2px));
    }
}

/* 20.78 (U5): Nadzor — zaglavlje tablica i stupac Artikl uvijek vidljivi */
.table-wrap thead th{position:sticky;top:0;z-index:2;background:var(--soft,var(--row-alt,var(--panel)))}
.table-wrap tbody td:first-child,.table-wrap thead th:first-child{position:sticky;left:0;z-index:1;background:var(--panel)}
.table-wrap thead th:first-child{z-index:3;background:var(--soft,var(--row-alt,var(--panel)))}
#report-dialog [data-report-items] .table-wrap{max-height:60dvh;overflow:auto}
@media(max-width:700px){.table-wrap tbody td:first-child{max-width:42vw}.table-wrap tbody td:first-child>strong,.table-wrap tbody td:first-child>small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media(max-width:700px){.table-wrap tbody td:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
/* 20.78.2 (U8): bez „plivanja” tablica na iPhoneu/iPadu */
.table-wrap{overscroll-behavior-x:none}@media (pointer:coarse){.table-wrap,.report-dialog-inner{overscroll-behavior:none}}

/* ===== 20.82 (U20): jasnije razlikovanje panela, naslova i tablica ===== */
:root{--head-bg:#e2e9f3;--head-ink:#24344b;--panel-head-bg:#eef3f9;--row-alt:#f1f5fa;--line-strong:#b3c1d3;--row-hover:#fff3ec;
  --k-blue:#2563a8;--k-green:#1d7a46;--k-orange:#c2600f;--k-red:#b42339;--k-teal:#0f7b84;--k-purple:#6d4bb3}
body.dark-mode{--head-bg:#22344b;--head-ink:#dce8f7;--panel-head-bg:#182739;--row-alt:#1c2e43;--line-strong:#516580;--row-hover:#2b2420;
  --k-blue:#7fb2ee;--k-green:#7fd6a1;--k-orange:#f3a65f;--k-red:#ff8f9c;--k-teal:#6fd3dc;--k-purple:#b9a1f0}
/* Paneli: jači obrub, naslovni dio s podlogom i crtom */
.panel{border-color:var(--line-strong)}
.panel>.panel-head{margin:-1rem -1rem 1rem;padding:.8rem 1rem;background:var(--panel-head-bg);border-bottom:1px solid var(--line-strong);border-radius:.85rem .85rem 0 0}
@media(max-width:750px){.panel>.panel-head{margin:-.75rem -.75rem .75rem;padding:.65rem .75rem}}
.panel-head h2,.panel-head h3{border-left:4px solid var(--accent-fill);padding-left:.55rem}
.period{border-color:var(--line-strong)}
/* KPI kartice: svaka svoja boja (lijevi rub i iznos) */
.kpis article{border-color:var(--line-strong);border-left-width:5px}
.kpis article:nth-child(1){border-left-color:var(--k-blue)}.kpis article:nth-child(1) strong{color:var(--k-blue)}
.kpis article:nth-child(2){border-left-color:var(--k-green)}.kpis article:nth-child(2) strong{color:var(--k-green)}
.kpis article:nth-child(3){border-left-color:var(--k-orange)}.kpis article:nth-child(3) strong{color:var(--k-orange)}
.kpis article:nth-child(4){border-left-color:var(--k-red)}.kpis article:nth-child(4) strong{color:var(--k-red)}
.kpis article:nth-child(5){border-left-color:var(--k-teal)}.kpis article:nth-child(5) strong{color:var(--k-teal)}
.kpis article:nth-child(6){border-left-color:var(--k-purple)}.kpis article:nth-child(6) strong{color:var(--k-purple)}
/* Analitički blokovi: podloga različita od panela */
.analytics-block,.report-analysis{background:var(--panel-head-bg);border-color:var(--line-strong)}
.analytics-title,.analytics-block>h3,.report-analysis>h3{color:var(--head-ink)}
/* Tablice: izraženo zaglavlje, jasne pruge, istaknut redak ispod miša */
.table-wrap{border:1px solid var(--line-strong)}
.table-wrap thead th,thead th{background:var(--head-bg);color:var(--head-ink);border-bottom:2px solid var(--line-strong);text-transform:uppercase;letter-spacing:.03em;font-size:.74rem}
.table-wrap thead th:first-child{background:var(--head-bg)}
tbody tr:nth-child(even)>td,.table-wrap tbody tr:nth-child(even)>td:first-child{background:var(--row-alt)}
tbody tr:hover>td,.table-wrap tbody tr:hover>td:first-child{background:var(--row-hover)}
.report-line:hover,.debt-line:hover{background:var(--row-hover)}
/* 20.82.1 (U20, tamni način): naslovi sekcija, blokova i datumi jasno odvojeni od podataka */
:root{--title-ink:#7a2a0c;--block-ink:#1f4f86;--date-bg:#fff1e9;--date-ink:#9a3412;--date-line:#f2b896}
body.dark-mode{--panel-head-bg:#20324a;--title-ink:#ffc6a3;--block-ink:#9ccaff;--date-bg:#3a2619;--date-ink:#ffc6a3;--date-line:#8a4a28}
.panel>.panel-head h2,.panel>.panel-head h3{color:var(--title-ink)}
.panel>.panel-head p,.panel>.panel-head small{color:var(--muted)}
.analytics-block>h3,.analytics-title h3,.report-analysis>h3,.analytics-block>header h3{color:var(--block-ink)}
.movement-day>h4,.quantity-group>h4{display:inline-block;margin:.9rem 0 .45rem;padding:.2rem .65rem;border-radius:999px;background:var(--date-bg);color:var(--date-ink);border:1px solid var(--date-line);font-size:.9rem;letter-spacing:.02em}
.movement-day:first-child>h4,.quantity-group:first-child>h4{margin-top:.2rem}
.report-list-head h3,.report-list-head h2{color:var(--block-ink)}