/* Základ */
html{-webkit-text-size-adjust:100%}
:root{padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0}
[hidden]{display:none!important}
img{max-width:100%}

/* Layout: pracovní nástroj – horní lišta s přepínačem pohledů, pod ní jeden velký list (tabulka) s posuvem do strany */
:root{
  --bg:#eef1fa; --surface:#ffffff; --surface-2:#e6eaf7; --line:#d3d9ec; --line-strong:#a7b1d1;
  --fg:#121833; --muted:#4f5a7d; --accent:#3540d6; --accent-fg:#ffffff;
  --fe3:#0587c2; --fe3-soft:#cdeefc; --g35:#ea6a00; --g35-soft:#ffe2c7;
  --wkend:#ffeea0; --wk-fg:#8a5300; --holi:#ffc9cf; --holi-fg:#c0122b; --pre:#e1e5f2; --pre-fg:#737d9f;
  --ok:#15803d; --ok-soft:#d6f8e1; --warn:#a15c00; --warn-soft:#fff0c2; --bad:#c81e1e; --bad-soft:#ffe0e0;
  --cash-a:#f08400; --cash-b:#9333ea; --cash-g:#4f5b80; --sat:#ffeea0;
  --f-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --f-ui:"Source Sans 3", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --r:6px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#0c0f1d; --surface:#151a2e; --surface-2:#1e2440; --line:#2b3254; --line-strong:#465079;
  --fg:#eaedfa; --muted:#a0a8cb; --accent:#7c89ff; --accent-fg:#0c0f1d;
  --fe3:#38bdf8; --fe3-soft:#0b3550; --g35:#ff9838; --g35-soft:#4d2a08;
  --wkend:#3d3410; --wk-fg:#fcd34d; --holi:#4d1622; --holi-fg:#ff8d9b; --pre:#262c47; --pre-fg:#8d95b8;
  --ok:#4ade80; --ok-soft:#0f3320; --warn:#fbbf24; --warn-soft:#3a2f0c; --bad:#f87171; --bad-soft:#421a1c;
  --cash-a:#d97706; --cash-b:#8b2fe0; --cash-g:#3a4468; --sat:#3d3410;
  color-scheme:dark }}
:root[data-theme="dark"]{
  --bg:#0c0f1d; --surface:#151a2e; --surface-2:#1e2440; --line:#2b3254; --line-strong:#465079;
  --fg:#eaedfa; --muted:#a0a8cb; --accent:#7c89ff; --accent-fg:#0c0f1d;
  --fe3:#38bdf8; --fe3-soft:#0b3550; --g35:#ff9838; --g35-soft:#4d2a08;
  --wkend:#3d3410; --wk-fg:#fcd34d; --holi:#4d1622; --holi-fg:#ff8d9b; --pre:#262c47; --pre-fg:#8d95b8;
  --ok:#4ade80; --ok-soft:#0f3320; --warn:#fbbf24; --warn-soft:#3a2f0c; --bad:#f87171; --bad-soft:#421a1c;
  --cash-a:#d97706; --cash-b:#8b2fe0; --cash-g:#3a4468; --sat:#3d3410;
  color-scheme:dark }
:root[data-theme="light"]{ color-scheme:light }

*{box-sizing:border-box}
body{background:var(--bg); color:var(--fg); font-family:var(--f-ui); font-size:15px; line-height:1.45}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:30; background:var(--surface)}
button,input,select,textarea{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.wrap{padding-left:max(16px,env(safe-area-inset-left,0px)); padding-right:max(16px,env(safe-area-inset-right,0px))}

/* Horní lišta */
header.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:20; background:var(--surface); border-bottom:1px solid var(--line)}
.top-in{display:flex; flex-wrap:wrap; align-items:center; gap:10px 20px; padding-block:10px}
.brand{font-family:var(--f-display); font-weight:700; font-size:19px; letter-spacing:-.01em; display:flex; align-items:center; gap:8px}
.brand .dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.brand .dot.a{background:var(--fe3)} .brand .dot.b{background:var(--g35); margin-left:-4px}
nav.tabs{display:flex; flex-wrap:wrap; gap:2px}
nav.tabs a{padding:6px 12px; border-radius:var(--r); color:var(--muted); text-decoration:none; font-weight:600}
nav.tabs a:hover{background:var(--surface-2); color:var(--fg)}
nav.tabs a[aria-current="page"]{background:var(--accent); color:var(--accent-fg)}
.who{margin-left:auto; display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted)}
.who select{padding:4px 6px; border:1px solid var(--line-strong); border-radius:var(--r); background:var(--surface); max-width:220px}

main{padding-block:18px 48px}
h1{font-family:var(--f-display); font-size:24px; margin:0; letter-spacing:-.015em; text-wrap:balance}
h2{font-family:var(--f-display); font-size:18px; margin:0 0 8px; letter-spacing:-.01em}
.muted{color:var(--muted)}
.small{font-size:13px}
.bar{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin-bottom:14px}
.bar .grow{flex:1 1 auto}
.monthnav{display:flex; align-items:center; gap:4px}
.monthnav .lbl{font-family:var(--f-display); font-weight:600; font-size:20px; min-width:9.5em; text-align:center}
.btn{border:1px solid var(--line-strong); background:var(--surface); padding:6px 12px; border-radius:var(--r); cursor:pointer; font-weight:600; white-space:nowrap}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent); border-color:var(--accent); color:var(--accent-fg)}
.btn.ghost{border-color:transparent; background:transparent}
.btn.sm{padding:3px 8px; font-size:13px}
.btn.icon{padding:4px 10px; font-size:18px; line-height:1}
.btn:disabled{opacity:.45; cursor:not-allowed}
.seg{display:inline-flex; border:1px solid var(--line-strong); border-radius:var(--r); overflow:hidden}
.seg button{border:0; background:var(--surface); padding:6px 14px; font-weight:700; cursor:pointer}
.seg button + button{border-left:1px solid var(--line-strong)}
.seg button[aria-pressed="true"].FE3{background:var(--fe3); color:var(--accent-fg)}
.seg button[aria-pressed="true"].G35{background:var(--g35); color:var(--accent-fg)}
.legend{display:flex; flex-wrap:wrap; gap:6px 12px; font-size:12.5px; color:var(--muted); align-items:center}
.sw{display:inline-block; width:14px; height:14px; border-radius:3px; vertical-align:-2px; margin-right:4px; border:1px solid var(--line)}
.panel{background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:16px}
.note{font-size:13px; color:var(--muted); margin-top:10px}
.msg{padding:8px 12px; border-radius:var(--r); font-size:14px; margin:10px 0}
.msg.ok{background:var(--ok-soft); color:var(--ok)}
.msg.bad{background:var(--bad-soft); color:var(--bad)}
.msg.info{background:var(--surface-2); color:var(--fg)}

/* ===== Rozpis ===== */
.sheet{overflow:auto; max-height:calc(100vh - 210px); border:1px solid var(--line-strong); border-radius:8px; background:var(--surface)}
table.grid{border-collapse:separate; border-spacing:0; font-size:12.5px; font-variant-numeric:tabular-nums}
.grid th,.grid td{border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:0; height:26px; text-align:center; white-space:nowrap; background:var(--surface)}
.grid thead th{position:sticky; z-index:3; font-weight:700}
.grid thead tr:nth-child(1) th{top:0; height:30px}
.grid thead tr:nth-child(2) th{top:30px; height:38px}
.grid thead tr:nth-child(3) th{top:68px; height:22px; font-size:11px; color:var(--muted); font-weight:600}
.grid .day{position:sticky; left:0; z-index:2; text-align:left; padding:0 8px; min-width:74px; font-weight:600; border-right:1px solid var(--line-strong)}
.grid thead .day{z-index:4}
.grid .tagc{min-width:76px; max-width:120px; border-right:2px solid var(--line-strong)}
.grid th.st{color:var(--accent-fg); font-family:var(--f-display); font-size:14px; letter-spacing:.02em}
.grid th.st.FE3{background:var(--fe3)} .grid th.st.G35{background:var(--g35)}
.grid th.person{line-height:1.1; padding:2px 4px}
.grid th.person small{display:block; font-weight:400; color:var(--muted); font-size:10.5px}
.grid th.person.FE3{box-shadow:inset 0 3px 0 var(--fe3)} .grid th.person.G35{box-shadow:inset 0 3px 0 var(--g35)}
.grid .pend{border-right:2px solid var(--line-strong)}
.grid .storeend{border-right:3px solid var(--line-strong)}
.grid td.c{min-width:44px}
.grid td.c input{width:46px; height:25px; border:0; background:transparent; text-align:center; font-family:var(--f-mono); font-size:12px; padding:0}
.grid td.c input::placeholder{color:var(--pre-fg); font-style:italic; opacity:1}
.grid td.c input:focus{background:var(--surface); outline:2px solid var(--accent); outline-offset:-2px}
.grid td.c .ro{font-family:var(--f-mono); font-size:12px; display:block; padding:0 4px}
.grid td.h{min-width:40px}
.grid td.h button{width:100%; height:25px; border:0; background:transparent; font-family:var(--f-mono); font-size:12px; font-weight:600; cursor:pointer; padding:0 4px}
.grid td.h button:hover{background:var(--surface-2)}
.grid td.h button.empty{color:var(--line-strong); font-weight:400}
.grid tr.wk td,.grid tr.wk th.day{background:var(--wkend)}
.grid tr.hol td,.grid tr.hol th.day{background:var(--holi)}
.grid tr.hol th.day{color:var(--holi-fg)}
.grid tr.wk th.day{color:var(--wk-fg)}
.grid tr.mon > *{border-top:3px solid var(--line-strong)}
.cash tr.wk td.d{color:var(--wk-fg)}
sup.mt{font-family:var(--f-ui); font-size:9px; font-weight:700; background:var(--accent); color:var(--accent-fg); border-radius:3px; padding:0 3px; margin-left:3px; vertical-align:top; line-height:12px}
.themesw{display:inline-flex; border:1px solid var(--line-strong); border-radius:999px; overflow:hidden}
.themesw button{border:0; background:transparent; padding:4px 10px; font-size:13px; font-weight:600; cursor:pointer; color:var(--muted)}
.themesw button[aria-pressed="true"]{background:var(--accent); color:var(--accent-fg)}
.grid tr.today th.day{box-shadow:inset 4px 0 0 var(--accent)}
.grid td.abs{background:color-mix(in srgb,var(--cc) 45%,var(--surface)) !important; font-weight:700}
.grid td.cover-G35{background:var(--g35-soft) !important} .grid td.cover-FE3{background:var(--fe3-soft) !important}
.grid td.cover-G35.cfirst{box-shadow:inset 3px 0 0 var(--g35)} .grid td.cover-FE3.cfirst{box-shadow:inset 3px 0 0 var(--fe3)}
.grid td.pre{background:var(--pre) !important; color:var(--pre-fg)}
.grid td.svc{color:var(--pre-fg)}
.grid td.mine{box-shadow:inset 0 0 0 999px color-mix(in srgb,var(--accent) 7%,transparent)}
.grid td.dx select{border:0; background:transparent; font-size:12px; height:25px; max-width:84px}
.grid td.dx input{border:0; background:transparent; font-size:12px; height:25px; width:84px; padding:0 4px}
.grid td.dx.note input{width:140px}
.grid td.dx .ro{padding:0 6px; font-size:12px}
.grid td.tagc button{border:0; background:transparent; width:100%; min-height:25px; cursor:pointer; display:flex; flex-wrap:wrap; gap:2px; align-items:center; justify-content:center; padding:2px}
.chip{display:inline-block; padding:0 6px; border-radius:10px; font-size:11px; font-weight:600; line-height:17px; background:color-mix(in srgb,var(--cc,var(--accent)) 30%,var(--surface)); color:var(--fg); white-space:nowrap}
.grid tfoot td,.grid tfoot th{position:sticky; z-index:3; font-weight:700; font-family:var(--f-mono); background:var(--surface-2)}
.grid tfoot tr:nth-child(1) > *{bottom:52px; border-top:2px solid var(--line-strong)}
.grid tfoot tr:nth-child(2) > *{bottom:26px}
.grid tfoot tr:nth-child(3) > *{bottom:0}
.grid tfoot th.day{font-family:var(--f-ui); z-index:4}
.grid tfoot .neg{color:var(--bad)} .grid tfoot .pos{color:var(--ok)}
.grid tfoot .fixed{text-decoration:underline dotted; text-underline-offset:3px}

/* Popover */
#pop{position:fixed; z-index:50; background:var(--surface); border:1px solid var(--line-strong); border-radius:8px; box-shadow:0 10px 30px rgba(0,0,0,.18); padding:12px; width:min(330px,calc(100vw - 24px))}
#pop .ph{font-weight:700; margin-bottom:8px; display:flex; justify-content:space-between; gap:8px}
#pop .sec{font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:10px 0 4px; font-weight:700}
#pop .chips{display:flex; flex-wrap:wrap; gap:4px}
#pop .chips button{border:1px solid var(--line-strong); background:var(--surface); border-radius:var(--r); padding:3px 8px; cursor:pointer; font-size:13px}
#pop .chips button:hover{border-color:var(--accent)}
#pop .chips button.code{background:color-mix(in srgb,var(--cc) 40%,var(--surface)); border-color:transparent; font-weight:700}
#pop .chips button .m{font-family:var(--f-mono); font-size:12px}
#pop label.cb{display:flex; gap:6px; align-items:center; font-size:14px; margin-top:10px; cursor:pointer}
#pop .foot{display:flex; justify-content:space-between; gap:8px; margin-top:12px}
#pop .req{background:var(--pre); color:var(--fg); border-radius:var(--r); padding:6px 8px; font-size:13px; margin-top:8px}

/* Tabulky obecně */
.tbl-wrap{overflow-x:auto}
table.list{border-collapse:collapse; width:100%; font-size:14px; font-variant-numeric:tabular-nums}
.list th{text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; padding:8px; border-bottom:2px solid var(--line-strong); white-space:nowrap}
.list td{padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:middle}
.list td.num,.list th.num{text-align:right}
.list input[type=text],.list input[type=number],.list input[type=time],.list select{border:1px solid var(--line); border-radius:4px; padding:3px 6px; background:var(--surface); max-width:100%}
.list input.n{width:80px; text-align:right; font-family:var(--f-mono); font-size:13px}
.list input[type=color]{width:38px; height:26px; border:1px solid var(--line); padding:0; background:none}
.pill{display:inline-block; padding:1px 9px; border-radius:10px; font-size:12px; font-weight:700}
.pill.pending{background:var(--warn-soft); color:var(--warn)}
.pill.approved{background:var(--ok-soft); color:var(--ok)}
.pill.rejected{background:var(--bad-soft); color:var(--bad)}
.stb{display:inline-block; font-weight:700; font-size:12px; padding:0 6px; border-radius:4px; color:var(--accent-fg)}
.stb.FE3{background:var(--fe3)} .stb.G35{background:var(--g35)}

/* Formuláře */
.cols{display:grid; grid-template-columns:minmax(0,340px) minmax(0,1fr); gap:18px; align-items:start}
@media (max-width:860px){ .cols{grid-template-columns:minmax(0,1fr)} }
form.f{display:grid; gap:10px}
form.f label{display:grid; gap:3px; font-size:13px; font-weight:600; color:var(--muted)}
form.f input,form.f select,form.f textarea{border:1px solid var(--line-strong); border-radius:var(--r); padding:7px 9px; background:var(--surface); font-weight:400; color:var(--fg)}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:10px}
.deadline{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.deadline .big{font-family:var(--f-display); font-size:22px; font-weight:700}

/* Souhrn */
.list.sum td.sep,.list.sum th.sep{border-left:2px solid var(--line-strong)}
.list.sum tfoot td{font-weight:700; border-top:2px solid var(--line-strong); padding:8px}
.list .neg{color:var(--bad)} .list .pos{color:var(--ok)}
.list .fixed{text-decoration:underline dotted}
.seg button[aria-pressed="true"].ALL{background:var(--accent); color:var(--accent-fg)}

/* Odvody tržby */
.cash-wrap{border-radius:8px; border:2px solid var(--fg)}
table.cash{border-collapse:collapse; width:100%; min-width:980px; font-variant-numeric:tabular-nums; background:var(--surface)}
.cash th{color:#fff; font-weight:700; padding:8px 6px; border:1px solid var(--line-strong); line-height:1.15}
.cash th.ttl{background:var(--accent); color:var(--accent-fg); font-family:var(--f-display); font-size:20px; letter-spacing:.02em; padding:12px; text-transform:uppercase}
.cash th.hd{background:var(--cash-g)} .cash th.a{background:var(--cash-a)} .cash th.b{background:var(--cash-b)} .cash th.g{background:var(--cash-g)}
.cash td{border:1px solid var(--line-strong); padding:0; height:38px}
.cash td.d{font-weight:700; padding:0 12px; white-space:nowrap; text-align:center}
.cash td.in input,.cash td.in select{width:100%; height:37px; border:0; background:transparent; padding:0 10px; text-align:right; font-family:var(--f-mono); font-size:14px; color:var(--fg)}
.cash td.in input:focus,.cash td.in select:focus{outline:2px solid var(--accent); outline-offset:-2px; background:var(--surface)}
.cash td.cl select{text-align:left; font-family:var(--f-ui); min-width:7.5em}
.cash td.note input{text-align:left; font-family:var(--f-ui); min-width:14em}
.cash td.diff{text-align:center; font-family:var(--f-mono); font-weight:700; border-left:2px solid var(--fg); border-right:2px solid var(--fg); min-width:90px}
.cash tr.wk td{background:var(--sat)}
.cash tbody tr:not(.wk) td{background:var(--surface)}
.cash tfoot td{background:var(--accent); color:var(--accent-fg); font-weight:700; text-align:center; padding:10px 8px; font-family:var(--f-mono); border-top:2px solid var(--fg)}
.cash tfoot td:first-child{font-family:var(--f-ui); text-transform:uppercase; white-space:nowrap}
.cash tfoot .neg,.cash tfoot .pos{color:inherit}
.cash tfoot td.vs{font-family:var(--f-ui); white-space:nowrap}
.cash tfoot td.vs input{width:6em; border:1px solid currentColor; border-radius:4px; background:transparent; color:inherit; padding:2px 6px; font-family:var(--f-mono)}
.cash td.diff .neg{color:var(--bad)} .cash td.diff .pos{color:var(--ok)}

/* Nastavení */
.subtabs{display:flex; flex-wrap:wrap; gap:4px; margin-bottom:14px; border-bottom:1px solid var(--line)}
.subtabs button{border:0; background:transparent; padding:8px 12px; font-weight:600; color:var(--muted); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px}
.subtabs button[aria-pressed="true"]{color:var(--fg); border-bottom-color:var(--accent)}
.opt{display:flex; gap:8px; align-items:flex-start; padding:8px 0; cursor:pointer}
.opt input{margin-top:4px}

/* Předpoklady */
.qa{display:grid; gap:0; max-width:900px}
.qa .it{display:grid; grid-template-columns:2.2em minmax(0,1fr); gap:4px 10px; padding:12px 0; border-bottom:1px solid var(--line)}
.qa .no{font-family:var(--f-mono); color:var(--muted); font-size:13px; padding-top:2px}
.qa .q{font-weight:700}
.qa .a{color:var(--fg)}
.qa .a .tag{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:1px 6px; border-radius:4px; margin-right:6px}
.qa .tag.p{background:var(--warn-soft); color:var(--warn)}
.qa .tag.d{background:var(--ok-soft); color:var(--ok)}
.qa .tag.x{background:var(--bad-soft); color:var(--bad)}
.qa .where{font-size:13px; color:var(--muted)}
.qa h2{margin-top:22px}

details.hist{border-bottom:1px solid var(--line); padding:8px 0}
details.hist summary{cursor:pointer; display:flex; flex-wrap:wrap; gap:4px 12px; align-items:center}
details.hist summary .t{font-family:var(--f-mono); font-size:13px}
details.hist .tbl-wrap{margin-top:8px}

@media (max-width:600px){ .who{margin-left:0; width:100%} .monthnav .lbl{min-width:7.5em; font-size:17px} .sheet{max-height:none} }
@media (prefers-reduced-motion:reduce){ *{transition:none!important; animation:none!important} }

/* Přihlášení */
.auth{min-height:70vh; display:grid; place-items:center; padding-block:40px}
.auth .panel{width:min(400px,100%); padding:28px}
.auth h1{margin-bottom:4px}
.auth .brand{margin-bottom:18px}
.userbox{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted)}
.userbox b{color:var(--fg)}
.loading{padding:40px 0; color:var(--muted)}
.list input[type=password]{border:1px solid var(--line); border-radius:4px; padding:3px 6px; background:var(--surface); width:9em}
.okmark{color:var(--ok); font-weight:700; font-size:12px}
a.btn{text-decoration:none; color:inherit; display:inline-block}
