:root{--ink:#1c2630;--muted:#667583;--line:#d8dee4;--bg:#f2f4f6;--card:#fff;--brand:#1f2d3a;--accent:#f5a623;--accent-d:#c9801a;--ok:#2e7d4f;--err:#b3261e;--we:#eceff2;--abs:#e3edff;--r:8px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0}
.boot{padding:2rem;text-align:center;color:var(--muted)}
.hidden{display:none!important}

/* Prihlásenie */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:16px}
.login-card{width:100%;max-width:360px;background:var(--card);border-radius:12px;padding:28px 24px;box-shadow:0 6px 30px rgba(0,0,0,.12)}
.login-card h1{font-size:1.4rem;margin-bottom:4px}
.login-card .sub{color:var(--muted);margin:0 0 18px}
.login-card .field{margin-bottom:14px}

/* Hlavička */
.topbar{background:var(--brand);color:#fff;position:sticky;top:0;z-index:20}
.topbar-in{max-width:1500px;margin:0 auto;padding:8px 16px;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between}
.brand{display:flex;gap:10px;align-items:center;font-weight:700;font-size:1.05rem}
.brand svg{width:28px;height:28px}
.top-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.who{font-size:.85rem;opacity:.85;margin-right:4px}
.tabs{max-width:1500px;margin:0 auto;display:flex;gap:2px;overflow-x:auto;padding:0 16px}
.tab{background:none;border:0;color:#cdd6de;padding:10px 14px;cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap;font-weight:600}
.tab:hover{color:#fff}
.tab.active{color:#fff;border-bottom-color:var(--accent)}

main{max-width:1500px;margin:0 auto;padding:14px 16px 60px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;margin-bottom:14px}
.toolbar{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;margin-bottom:12px}
.field{display:flex;flex-direction:column;gap:3px;min-width:0}
.field label,.lbl{font-size:.78rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
input,select,textarea{border:1px solid #b9c3cc;border-radius:6px;padding:8px 10px;background:#fff;min-height:38px;max-width:100%}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
textarea{width:100%;resize:vertical}
.month-nav{display:flex;align-items:center;gap:4px}
.month-nav .cur{min-width:140px;text-align:center;font-weight:700}
.spacer{flex:1}

button{cursor:pointer}
.btn{border:1px solid #b9c3cc;background:#fff;border-radius:6px;padding:8px 14px;min-height:38px;font-weight:600}
.btn:hover{background:#f3f6f8}
.btn.primary{background:var(--accent);border-color:var(--accent-d);color:#1c1300}
.btn.primary:hover{background:#ffb83d}
.btn.danger{color:var(--err);border-color:#e3b3af}
.btn.sm{padding:4px 10px;min-height:30px;font-size:.85rem}
.btn[disabled]{opacity:.5;cursor:default}
.topbar .btn{background:transparent;color:#fff;border-color:#55687a}
.topbar .btn:hover{background:#2d4254}
.topbar .btn.primary{background:var(--accent);color:#1c1300;border-color:var(--accent)}
.icon-btn{border:1px solid #b9c3cc;background:#fff;border-radius:6px;width:38px;height:38px;font-size:1.1rem}

/* Tabuľky */
.scroll{overflow:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;max-height:calc(100vh - 230px)}
table{border-collapse:separate;border-spacing:0;width:100%}
th,td{border-bottom:1px solid #e7ebef;border-right:1px solid #eef1f4;padding:0;text-align:center;font-size:.9rem}
thead th{position:sticky;top:0;background:#e9eef2;z-index:2;padding:6px 4px;font-size:.78rem;white-space:nowrap}
th.name,td.name{position:sticky;left:0;background:#fff;text-align:left;padding:6px 10px;min-width:150px;z-index:1;white-space:nowrap;border-right:2px solid var(--line)}
thead th.name{z-index:3;background:#e9eef2}
td.total,th.total{background:#fafbfc;font-weight:700;padding:6px 8px;min-width:56px;white-space:nowrap}
.we{background:var(--we)}
thead th.we{background:#dde3e8}
.today{box-shadow:inset 0 -3px 0 var(--accent)}
td.num{padding:6px 8px;text-align:right;white-space:nowrap}
tfoot td{font-weight:700;background:#f6f8fa;padding:6px 8px;position:sticky;bottom:0}
.cell{width:44px;min-height:34px;border:0;border-radius:0;padding:4px 2px;text-align:center;background:transparent}
.cell:focus{background:#fff6e0;outline:2px solid var(--accent);outline-offset:-2px;z-index:1;position:relative}
.cell.abs{background:var(--abs);font-weight:700;color:#1d4aa8}
.cell.has-note{box-shadow:inset -6px 6px 0 -3px var(--accent-d)}
.cell.saving{background:#fff3c4}
.cell.err{background:#fbdcd9}
.cell.ro{pointer-events:none}
.wide-cell{width:78px}
.emp-day td.date{text-align:left;padding:6px 10px;white-space:nowrap;position:sticky;left:0;background:#fff;border-right:2px solid var(--line);z-index:1}
.emp-day tr.we td.date{background:var(--we)}
tr.we td{background:var(--we)}
tr.we td .cell{background:transparent}

/* Hromadne */
.bulk-grid{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:850px){.bulk-grid{grid-template-columns:1fr}}
.stack{display:flex;flex-direction:column;gap:12px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid #b9c3cc;background:#fff;border-radius:999px;padding:5px 12px;font-weight:600;min-height:34px}
.chip:hover{background:#fff3d6;border-color:var(--accent-d)}
.emp-list{display:flex;flex-direction:column}
.emp-row{display:grid;grid-template-columns:28px 1fr 90px 90px;gap:8px;align-items:center;padding:7px 4px;border-bottom:1px solid #eef1f4}
.emp-row.off{opacity:.55}
.emp-row input[type=checkbox]{width:22px;height:22px;min-height:0}
.emp-row .cur{font-size:.82rem;color:var(--muted)}
.emp-row .cur b{color:var(--ink)}
.emp-row .own{width:90px;text-align:center}
.emp-head{display:grid;grid-template-columns:28px 1fr 90px 90px;gap:8px;font-size:.74rem;color:var(--muted);text-transform:uppercase;font-weight:600;padding:4px}
.sticky-bar{position:sticky;bottom:0;background:var(--card);padding:10px 0 2px;border-top:1px solid var(--line);display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:8px}
.inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.check{display:flex;gap:6px;align-items:center;min-height:38px}
.check input{width:18px;height:18px;min-height:0}
.hint{color:var(--muted);font-size:.85rem}
.warn{color:var(--err)}
.pill{display:inline-block;padding:1px 8px;border-radius:999px;background:#e6edf3;font-size:.78rem;font-weight:600}
.pill.admin{background:#ffe9bd}.pill.off{background:#f3d6d3}

/* Dialóg */
dialog{border:0;border-radius:12px;padding:0;width:min(640px,calc(100vw - 24px));max-height:calc(100vh - 24px);box-shadow:0 10px 50px rgba(0,0,0,.35)}
dialog.big{width:min(900px,calc(100vw - 24px))}
dialog::backdrop{background:rgba(20,30,40,.55)}
.dlg-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}
.dlg-head h2{font-size:1.1rem}
.dlg-body{padding:16px 18px;display:flex;flex-direction:column;gap:14px}
.dlg-foot{display:flex;gap:8px;justify-content:flex-end;padding:12px 18px;border-top:1px solid var(--line)}
.list-row{display:flex;gap:6px;align-items:center;padding:4px 0;border-bottom:1px solid #eef1f4}
.list-row input{flex:1;min-width:0}
.list-row.off input{opacity:.55}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.grid2{grid-template-columns:1fr}}
.gen{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:700}
table.simple th,table.simple td{padding:6px 8px;text-align:left;border-bottom:1px solid #e7ebef;border-right:0}
table.simple thead th{position:static}
.mono-r{text-align:right}

#toasts{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:100;width:min(92vw,460px)}
.toast{background:#1f2d3a;color:#fff;padding:10px 14px;border-radius:8px;box-shadow:0 4px 18px rgba(0,0,0,.3)}
.toast.err{background:var(--err)}.toast.ok{background:var(--ok)}
.save-ind{font-size:.8rem;opacity:.85}

@media print{
  .topbar,.toolbar,.tabs,#toasts,.no-print,.sticky-bar{display:none!important}
  body{background:#fff}.scroll{max-height:none;overflow:visible;border:0}
  th.name,td.name,.emp-day td.date,thead th{position:static}
  .card{border:0;padding:0}
  @page{size:A3 landscape;margin:8mm}
}
