:root{
  --paper:#F6F7F5; --surface:#FFF; --sunk:#F0F2EF; --rail:#FBFCFA;
  --ink:#141C24; --ink-2:#42525E; --ink-3:#72828E;
  --rule:#E2E5E1; --rule-2:#CBD0CB;
  --accent:#0B6FA4; --accent-soft:rgba(11,111,164,.10);
  --warn:#C05A00; --warn-soft:rgba(192,90,0,.10);
  --good:#1F6B4A; --good-soft:rgba(31,107,74,.11);
  --shadow:0 1px 2px rgba(20,28,36,.05), 0 6px 18px -12px rgba(20,28,36,.18);
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#111417; --surface:#191D20; --sunk:#20252A; --rail:#15191C;
    --ink:#E9ECE8; --ink-2:#B2BBC1; --ink-3:#7D8890;
    --rule:#282E33; --rule-2:#3A4248;
    --accent:#3E9AC9; --accent-soft:rgba(62,154,201,.14);
    --warn:#CC7A1E; --warn-soft:rgba(204,122,30,.15);
    --good:#4FA57C; --good-soft:rgba(79,165,124,.14);
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 6px 18px -12px rgba(0,0,0,.6);
  }
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:15px/1.5 "Segoe UI",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  display:grid; grid-template-columns:196px minmax(0,1fr) 292px;
  height:100vh; overflow:hidden; -webkit-font-smoothing:antialiased;
}
.n{font-family:"Cascadia Mono",Consolas,ui-monospace,monospace;font-variant-numeric:tabular-nums}
a{color:var(--accent);text-underline-offset:2px}
h1{font-size:1.35rem;margin:0;letter-spacing:-.015em}

/* ============ levá navigace ============ */
.nav{
  background:var(--rail); border-right:1px solid var(--rule);
  padding:18px 12px; display:flex; flex-direction:column; gap:16px; overflow:hidden;
}
.brand{padding:0 8px;display:flex;flex-direction:column;gap:1px}
.brand b{font-size:1rem;font-weight:650;letter-spacing:-.01em}
.brand span{font-size:.75rem;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-links{display:flex;flex-direction:column;gap:2px}
.nav-links a{
  padding:7px 10px;border-radius:6px;text-decoration:none;color:var(--ink-2);
  font-size:.9rem;font-weight:500;
}
.nav-links a:hover{background:var(--sunk);color:var(--ink)}
.nav-links a.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.nav-foot{margin-top:auto;padding:0 8px;font-size:.7rem;color:var(--ink-3);line-height:1.4}

/* ============ střed ============ */
main{overflow-y:auto;padding:22px 26px 40px;display:flex;flex-direction:column;gap:16px}
/* Položky flexboxu se ve výchozím stavu smršťují. U karet s overflow:hidden to
   ořízne obsah — v tabulce termínů mizel poslední řádek. */
main > *{flex:0 0 auto}
.head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.head .sub{color:var(--ink-3);font-size:.82rem;margin:2px 0 0}

/* ============ pravý panel ============ */
.rail{
  background:var(--rail); border-left:1px solid var(--rule);
  padding:16px 14px 24px; overflow-y:auto;
  display:flex; flex-direction:column; gap:14px;
}
.blk{display:flex;flex-direction:column;gap:7px}
.blk-h{
  font-size:.63rem;font-weight:700;text-transform:uppercase;letter-spacing:.11em;
  color:var(--ink-3);display:flex;justify-content:space-between;align-items:baseline;
}
.big{display:flex;flex-direction:column;gap:1px}
.big b{
  font-family:"Cascadia Mono",Consolas,monospace;font-variant-numeric:tabular-nums;
  font-size:1.72rem;font-weight:600;line-height:1.05;letter-spacing:-.025em;
}
.big b.warn{color:var(--warn)}
.big b.ok{color:var(--good)}
.cap{font-size:.7rem;color:var(--ink-3);line-height:1.35}
.lines{display:flex;flex-direction:column;gap:3px}
.ln{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.79rem}
.ln>span{color:var(--ink-2)}
.ln>b,.ln>i{
  font-family:"Cascadia Mono",Consolas,monospace;font-variant-numeric:tabular-nums;
  font-style:normal;font-weight:600;
}
.ln.dim>span,.ln.dim>i{color:var(--ink-3);font-weight:400}
.ln.tot{border-top:1px solid var(--rule);padding-top:5px;margin-top:2px;font-size:.85rem}
.ln.tot>b{font-size:.95rem}
.ln.hot>span,.ln.hot>b{color:var(--warn)}
.acct{font-family:"Cascadia Mono",Consolas,monospace;font-size:.63rem;color:var(--ink-3);margin-top:-1px}
.bar{height:5px;border-radius:3px;background:var(--sunk);border:1px solid var(--rule);overflow:hidden}
.bar>span{display:block;height:100%;background:var(--accent)}
.bar.over>span{background:var(--warn)}
.flag{
  font-size:.71rem;line-height:1.4;padding:7px 9px;border-radius:5px;
  background:var(--warn-soft);color:var(--warn);border-left:2px solid var(--warn);
}
hr.sep{border:none;border-top:1px solid var(--rule);margin:1px 0}

/* ============ prvky ============ */
.btn{
  display:inline-block;padding:7px 14px;border-radius:6px;border:1px solid var(--accent);
  background:var(--accent);color:#fff;font-size:.87rem;font-weight:600;cursor:pointer;
  text-decoration:none;font-family:inherit;white-space:nowrap;
}
.btn:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--accent)}
.btn.ghost:hover{background:var(--accent-soft);filter:none}
.btn.quiet{background:transparent;border-color:var(--rule-2);color:var(--ink-2)}
.btn.quiet:hover{background:var(--sunk);filter:none}
.btn.danger{background:transparent;border-color:var(--warn);color:var(--warn)}
.btn.danger:hover{background:var(--warn-soft);filter:none}
.btn.sm{padding:4px 10px;font-size:.79rem}
.btn:disabled{opacity:.45;cursor:not-allowed}

.card{background:var(--surface);border:1px solid var(--rule);border-radius:8px;box-shadow:var(--shadow);overflow:hidden}
table{width:100%;border-collapse:collapse;font-size:.87rem}
th,td{padding:8px 13px;text-align:left;border-bottom:1px solid var(--rule)}
th{font-size:.63rem;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-3);font-weight:700;background:var(--sunk);white-space:nowrap}
td.r,th.r{text-align:right}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--sunk)}
td a{text-decoration:none;font-weight:500}
td a:hover{text-decoration:underline}

.tag{display:inline-block;padding:1px 8px;border-radius:20px;font-size:.67rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.tag.koncept{background:var(--sunk);color:var(--ink-3);border:1px solid var(--rule-2)}
.tag.vystaveno{background:var(--accent-soft);color:var(--accent)}
.tag.zaplaceno{background:var(--good-soft);color:var(--good)}
.tag.storno{background:var(--warn-soft);color:var(--warn)}
.tag.eu{background:var(--warn-soft);color:var(--warn)}
.tag.po{background:var(--warn-soft);color:var(--warn)}

.empty{padding:46px 26px;text-align:center;color:var(--ink-3)}
.empty h2{color:var(--ink);margin:0 0 6px;font-size:1.05rem;font-weight:650}
.empty p{margin:0 auto 16px;max-width:46ch;font-size:.88rem}

/* ============ formuláře ============ */
form.form{display:flex;flex-direction:column;gap:14px}
fieldset{border:1px solid var(--rule);border-radius:8px;padding:14px 16px 16px;margin:0;background:var(--surface)}
legend{font-size:.63rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);padding:0 6px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:11px}
.f{display:flex;flex-direction:column;gap:3px;min-width:0}
.f.wide{grid-column:1/-1}
label{font-size:.75rem;font-weight:600;color:var(--ink-2)}
input,select,textarea{
  font:inherit;font-size:.88rem;padding:7px 9px;border:1px solid var(--rule-2);
  border-radius:5px;background:var(--paper);color:var(--ink);width:100%;
}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:transparent}
.f small{font-size:.7rem;color:var(--ink-3);line-height:1.35}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.actions .spacer{flex:1}
.ico-row{display:flex;gap:8px;align-items:flex-end;margin-bottom:6px}
.ico-row .f{flex:1}
#aresStav{font-size:.75rem;color:var(--ink-3);min-height:1.05em;margin:0 0 8px}
#aresStav.err{color:var(--warn)}
#aresStav.ok{color:var(--good)}

/* položky faktury */
table.items{font-size:.86rem}
table.items input{padding:6px 8px;font-size:.86rem}
table.items td{padding:5px 6px;border-bottom:none;vertical-align:middle}
table.items th{background:transparent;border-bottom:1px solid var(--rule);padding:4px 6px}
table.items tbody tr:hover{background:transparent}
.it-sum{text-align:right;font-family:"Cascadia Mono",Consolas,monospace;font-variant-numeric:tabular-nums;color:var(--ink-2);white-space:nowrap}
.celkem-box{
  display:flex;justify-content:flex-end;align-items:baseline;gap:12px;
  padding:11px 16px;border-top:1px solid var(--rule);
}
.celkem-box b{font-family:"Cascadia Mono",Consolas,monospace;font-variant-numeric:tabular-nums;font-size:1.4rem;font-weight:650;letter-spacing:-.02em}

/* detail faktury */
.detail{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;padding:14px 16px}
.dt{display:flex;flex-direction:column;gap:1px}
.dt span{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);font-weight:700}
.dt b{font-size:.92rem;font-weight:500}
.inline-form{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.inline-form .f{min-width:150px}

.msg{padding:9px 13px;border-radius:6px;font-size:.85rem;border-left:3px solid}
.msg.err{background:var(--warn-soft);color:var(--warn);border-color:var(--warn)}
.msg.ok{background:var(--good-soft);color:var(--good);border-color:var(--good)}

@media (max-width:1180px){
  body{grid-template-columns:180px minmax(0,1fr) 264px}
}
@media (max-width:960px){
  body{grid-template-columns:1fr;height:auto;overflow:auto}
  .nav{flex-direction:row;align-items:center;gap:14px;border-right:none;border-bottom:1px solid var(--rule);padding:10px 14px}
  .nav-links{flex-direction:row;gap:4px}
  .nav-foot{display:none}
  .rail{border-left:none;border-top:1px solid var(--rule)}
  main{padding:18px 16px 40px}
}