:root{
  --bg:#f1f5f9; --card:#fff; --ink:#0f172a; --muted:#64748b; --line:#e2e8f0;
  --brand:#166534; --brand-2:#15803d; --brand-l:#dcfce7;
  --blue:#1d4ed8; --blue-l:#dbeafe;
  --green:#15803d; --green-l:#dcfce7;
  --red:#b91c1c; --red-l:#fee2e2;
  --amber:#b45309; --amber-l:#fef3c7;
  --violet:#6d28d9; --violet-l:#ede9fe;
  --grey:#94a3b8; --grey-l:#f1f5f9;
  --firma:#97c043; --firma-tm:#6f9130; --firma-l:#eef7df;   /* firemní zelená */
  --r:14px; --max:1100px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%;overscroll-behavior-y:none}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;line-height:1.4}
button{font:inherit;color:inherit;cursor:pointer;border:none;background:none}
input,textarea,select{font:inherit;color:inherit}
a{color:var(--brand)}
#app{display:flex;flex-direction:column;height:100dvh;overflow:hidden}

.top{background:#fff;border-bottom:1px solid var(--line);padding:10px 14px;display:flex;align-items:center;gap:10px;flex:none;min-height:56px;padding-top:calc(10px + env(safe-area-inset-top))}
.top .t{font-weight:700;font-size:16px;line-height:1.15}
.top .s{font-size:11.5px;color:var(--muted)}
.icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:17px;flex:none;background:var(--grey-l)}
.icon:active{background:#e2e8f0}
.body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}
.wrap{max-width:var(--max);margin:0 auto;padding:12px}
.tabs{display:flex;background:#fff;border-bottom:1px solid var(--line);flex:none;padding:0 8px;gap:2px;overflow:auto}
.tabs button{padding:11px 12px;font-size:13.5px;color:var(--muted);border-bottom:2.5px solid transparent;font-weight:600;white-space:nowrap}
.tabs button.on{color:var(--brand);border-color:var(--brand)}
.bottomnav{display:flex;background:#fff;border-top:1px solid var(--line);flex:none;padding:6px 4px calc(10px + env(safe-area-inset-bottom))}
.bottomnav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;color:var(--muted);padding:4px 0}
.bottomnav button .g{font-size:19px;line-height:1}
.bottomnav button.on{color:var(--brand);font-weight:700}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:13px;margin-bottom:10px}
.row{display:flex;align-items:center;gap:10px}
.spread{display:flex;align-items:center;justify-content:space-between;gap:10px}
.muted{color:var(--muted)} .xs{font-size:11.5px} .sm{font-size:13px} .b{font-weight:700}
.pill{display:inline-flex;align-items:center;gap:4px;padding:2.5px 8px;border-radius:99px;font-size:11px;font-weight:700;white-space:nowrap}
.p-grey{background:var(--grey-l);color:#475569} .p-blue{background:var(--blue-l);color:var(--blue)}
.p-green{background:var(--green-l);color:var(--green)} .p-red{background:var(--red-l);color:var(--red)}
.p-amber{background:var(--amber-l);color:var(--amber)} .p-violet{background:var(--violet-l);color:var(--violet)}
.bar{height:7px;border-radius:99px;background:#e2e8f0;overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px}
.f-grey i{background:var(--grey)} .f-blue i{background:var(--blue)}
.f-green i{background:var(--green)} .f-red i{background:var(--red)}
.btn{display:block;width:100%;text-align:center;background:var(--brand);color:#fff;font-weight:700;padding:14px;border-radius:12px}
.btn:active{background:var(--brand-2)} .btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.warn{background:var(--red)} .btn:disabled{opacity:.45;pointer-events:none}
.btn.sm{padding:10px;font-size:13.5px;border-radius:10px}
.field{width:100%;padding:12px;border:1px solid var(--line);border-radius:11px;background:#fff;margin-top:6px}
.search{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:#fff}
.chips{display:flex;gap:6px;overflow:auto;padding:2px 0 8px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{padding:7px 12px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:12.5px;white-space:nowrap;font-weight:600;color:#475569}
.chip.on{background:var(--firma);color:#fff;border-color:var(--firma);text-shadow:0 1px 1px rgba(0,0,0,.18)}
.chip .n{opacity:.6;margin-left:4px}
.kv{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:13.5px}
.kv:last-child{border:none}
.kod{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;background:#eef2f7;color:#475569;padding:1.5px 6px;border-radius:6px;margin-right:6px;font-weight:700;vertical-align:1.5px}
.stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px}
.stat .n{font-size:22px;font-weight:800;letter-spacing:-.5px}
.stat .l{font-size:11.5px;color:var(--muted);margin-top:1px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hr{height:1px;background:var(--line);margin:10px 0}

.item{background:#fff;border:1px solid var(--line);border-left:5px solid var(--grey);border-radius:12px;padding:11px 12px;margin-bottom:8px;display:block;width:100%;text-align:left}
.item:active{background:#f8fafc}
.item.s-blue{border-left-color:var(--blue)}
.item.s-green{border-left-color:var(--green);background:#f6fef9}
.item.s-red{border-left-color:var(--red);background:#fff8f8}
.item .nm{font-weight:650;font-size:14.5px;line-height:1.25}
.item .meta{display:flex;align-items:baseline;gap:6px;margin-top:7px;font-size:12.5px}
.item .qty{font-weight:800;font-size:15px}
.badges{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}

.scrim{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:20;animation:fade .15s}
@keyframes fade{from{opacity:0}}
.sheet{position:fixed;left:0;right:0;bottom:0;background:#fff;border-radius:20px 20px 0 0;z-index:21;max-height:94dvh;display:flex;flex-direction:column;animation:up .2s ease;max-width:var(--max);margin:0 auto}
@keyframes up{from{transform:translateY(100%)}}
.sheet .hd{padding:14px 16px 10px;border-bottom:1px solid var(--line)}
.grab{width:38px;height:4px;border-radius:9px;background:#cbd5e1;margin:0 auto 10px}
.sheet .bd{padding:14px 16px;overflow:auto}
.sheet .ft{padding:12px 16px calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
.stepper{display:flex;align-items:center;gap:10px;margin:10px 0}
.stepper button{width:56px;height:56px;border-radius:14px;background:var(--grey-l);font-size:26px;font-weight:700;display:grid;place-items:center}
.stepper .val{flex:1;text-align:center;font-size:34px;font-weight:800;border:2px solid var(--brand);border-radius:14px;padding:8px 4px;background:#f6fef9;min-width:0;overflow:hidden;text-overflow:ellipsis}
.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}
.keys button{padding:15px 0;border-radius:12px;background:#fff;border:1px solid var(--line);font-size:19px;font-weight:700}
.keys button:active{background:#f1f5f9}
.quick{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.quick button{padding:9px 13px;border-radius:99px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:700}
.quick button.max{background:var(--amber-l);border-color:#fde68a;color:var(--amber)}

.tl{position:relative;padding-left:22px}
.tl:before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--line)}
.tl .e{position:relative;padding:0 0 14px}
.tl .e:before{content:"";position:absolute;left:-20px;top:5px;width:10px;height:10px;border-radius:99px;background:#fff;border:2.5px solid var(--brand)}
.tl .e.sync:before,.tl .e.projekt:before{border-color:var(--amber)}
.tl .e.vydej:before{border-color:var(--blue)}
.tl .e.storno:before,.tl .e.archiv:before{border-color:var(--grey)}

.drop{border:2px dashed #cbd5e1;border-radius:var(--r);padding:26px 16px;text-align:center;background:#fff}
.drop.on{border-color:var(--brand);background:var(--brand-l)}
.toast{pointer-events:none;position:fixed;left:12px;right:12px;bottom:82px;max-width:520px;margin:0 auto;background:#0f172a;color:#fff;padding:12px 14px;border-radius:12px;font-size:13.5px;z-index:40;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.toast.err{background:var(--red)}
.fab{position:fixed;right:14px;bottom:calc(78px + env(safe-area-inset-bottom));background:var(--brand);color:#fff;border-radius:99px;padding:14px 19px;font-weight:700;box-shadow:0 8px 20px rgba(22,101,52,.35);z-index:10;font-size:14px}
.spinner{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--brand);border-radius:99px;animation:spin .7s linear infinite;margin:30px auto}
@keyframes spin{to{transform:rotate(360deg)}}
.offline{background:var(--amber);color:#fff;text-align:center;padding:5px;font-size:12px;font-weight:700}
.login{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(160deg,#166534,#0f172a);padding:22px}
.split{display:flex;flex-direction:column}
.split .col-l{order:2;margin-top:14px} .split .col-r{order:1;min-width:0}
@media(min-width:900px){
  .split{display:grid;grid-template-columns:320px 1fr;gap:14px;align-items:start}
  .split .col-l{order:0;margin-top:0;position:sticky;top:12px}
  .fab{display:none}
  .item .nm{font-size:15.5px}
}

/* nahrazená (uzavřená) položka */
.item.s-closed{border-left-color:var(--violet);background:#faf9ff;opacity:.85}
.f-closed i{background:var(--violet)}

/* ───────── tabulka položek ───────── */
.rp-hlavicka{display:grid;grid-template-columns:1fr 132px 62px;gap:8px;padding:8px 10px 6px;font-size:10.5px;
  text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.rp-hlavicka.kos{grid-template-columns:1fr 120px 92px;border-top:1px solid var(--line);background:#f8fafc}
.rp-hlavicka span:nth-child(2),.rp-hlavicka span:nth-child(3){text-align:right}
.rp-tabulka{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.rp{border-bottom:1px solid var(--line);border-left:4px solid var(--grey)}
.rp:last-child{border-bottom:none}
.rp.s-blue{border-left-color:var(--blue)} .rp.s-green{border-left-color:var(--green)}
.rp.s-red{border-left-color:var(--red)} .rp.s-mimo{border-left-color:#cbd5e1;opacity:.7}
.rp.open{background:#f8fafc}
.rp-hd{display:grid;grid-template-columns:16px 1fr 132px 62px;gap:8px;align-items:center;width:100%;
  text-align:left;padding:9px 10px;min-height:46px}
.rp-hd:active{background:#f1f5f9}
.rp-sip{color:var(--muted);font-size:12px}
.rp-nm{min-width:0}
.rp-nazev{display:block;font-size:13.5px;font-weight:600;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-meta{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.rp-meta:empty{display:none}
.rp-cis{text-align:right;font-size:12.5px;white-space:nowrap}
.rp-cis .qty{font-size:14px;font-weight:800}
.rp-bar{display:block;height:4px;margin-top:4px}
.rp-zb{text-align:right;white-space:nowrap}
.c-grey{color:var(--muted)} .c-blue{color:var(--blue)} .c-green{color:var(--green)} .c-red{color:var(--red)} .c-mimo{color:var(--muted)}
.f-mimo i{background:#cbd5e1}
.rp-bd{padding:0 10px 12px 30px}
.rp-info{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:11.5px;color:var(--muted);padding:2px 0 8px}
.pohyby{margin-top:8px;border-top:1px dashed var(--line)}
.poh{display:grid;grid-template-columns:88px 1fr auto;gap:8px;align-items:start;padding:7px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
.poh:last-child{border-bottom:none}
.poh.st{opacity:.5}
.poh.st .poh-q{text-decoration:line-through}
.poh-q{font-weight:800}
.lnk{color:var(--brand);font-weight:700;margin-left:6px}
.kod{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px;background:#eef2f7;color:#475569;
  padding:1px 5px;border-radius:5px;font-weight:700}
.kod.poz{background:var(--violet-l);color:var(--violet)}

/* ───────── koš ───────── */
.kos-hd{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 13px}
.kos-r{display:grid;grid-template-columns:auto 1fr 120px 92px;gap:8px;align-items:center;padding:8px 10px;border-top:1px solid var(--line)}
.kos-r input{width:18px;height:18px}
.kos-n{min-width:0}
.kos-p,.kos-m{text-align:right}
.kos-ft{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);background:#f8fafc}
.kos-ft .btn{margin:0}
@media(max-width:520px){
  .rp-hd{grid-template-columns:14px 1fr 104px}
  .rp-zb{display:none}
  .rp-hlavicka{grid-template-columns:1fr 104px}
  .rp-hlavicka span:nth-child(3){display:none}
  .kos-r{grid-template-columns:auto 1fr auto;row-gap:2px}
  .kos-n{grid-column:2;grid-row:1}
  .kos-m{grid-column:3;grid-row:1}
  .kos-p{grid-column:2/4;grid-row:2;text-align:left}
  .rp-hlavicka.kos span:nth-child(2){display:none}
}

/* ───────── ikony ───────── */
.ik{display:inline-flex;align-items:center;justify-content:center;flex:none;vertical-align:-3px}
.ik svg{width:100%;height:100%;display:block}
.bottomnav button .ik{margin-bottom:2px}
.btn .ik{vertical-align:-3px;margin-right:6px}
.icon .ik{width:19px;height:19px}
.top{gap:6px}
.logo{width:52px;height:52px;margin:0 auto;color:#bbf7d0}
.logo svg{width:100%;height:100%;stroke-width:1.4}
.rp-sip{display:inline-flex;color:var(--muted);transition:transform .15s}
.rp.open .rp-sip{transform:rotate(90deg)}
.rp-popis{display:block;font-size:11.5px;color:#92400e;background:var(--amber-l);border-radius:5px;
  padding:2px 6px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-popis b,.rp-popis-plny b{font-weight:800}
.rp-popis-plny{font-size:12.5px;color:#92400e;background:var(--amber-l);border-radius:6px;
  padding:6px 8px;margin:2px 0 8px;white-space:pre-wrap}
.prazdno{padding:22px 14px;text-align:center;color:var(--muted);font-size:13px}
.upoz{background:var(--grey-l);border:none;font-size:12.5px}
.upoz.amber{background:var(--amber-l)}

.pozadavky{padding:10px 12px;width:100%;text-align:left;display:block}
.poz-chip.vic{background:var(--grey-l);color:#475569;font-weight:700}
.jen-siroke{display:none}
@media(min-width:560px){.jen-siroke{display:inline}}
.poz-radek{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.poz-radek.kos-poz{padding:0 12px 10px;margin-top:0}
.poz-chip{display:inline-flex;align-items:center;gap:5px;background:var(--violet-l);color:var(--violet);
  border-radius:8px;padding:3px 8px;font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.poz-chip span{opacity:.75;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,sans-serif}
.odkaz-radek{display:block;width:100%;padding:12px;margin-top:4px;background:none;border:none;
  color:var(--muted);font-size:12.5px;font-weight:600;text-align:center;text-decoration:underline;text-underline-offset:3px}
.zak{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:800;
  background:var(--firma);color:#fff;padding:1px 7px;border-radius:6px;margin-right:7px;vertical-align:2px;
  letter-spacing:.2px;text-shadow:0 1px 1px rgba(0,0,0,.18)}
.kod .lbl{font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-weight:600;opacity:.7}

/* Rozpad po požadavcích v detailu položky */
.poz-rozpad{display:flex;flex-direction:column;gap:4px;margin:2px 0 4px}
.poz-r{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;
  border-left:3px solid var(--firma);padding:2px 0 2px 8px}
.poz-r b{font-variant-numeric:tabular-nums}
.poz-r.likv{border-left-color:#cbd5e1;opacity:.75}
.poz-r.likv b{text-decoration:line-through}

/* Koš – mezizáhlaví požadavku */
.kos-poz-hd{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:7px 12px;
  background:var(--firma-l);border-top:1px solid #e2e8f0;font-size:12px;color:#334155}
.kos-poz-hd b{color:var(--firma-tm)}
.kos-poz-hd .lnk{margin-left:auto}
.kod.vyd{background:#e0f2fe;color:#0369a1}

.kod.blok{background:#fef3c7;color:#92400e}

/* potvrzovací okno */
.dlg-obal .scrim{z-index:50}
.dlg{position:fixed;left:16px;right:16px;top:50%;transform:translateY(-50%);max-width:420px;margin:0 auto;background:#fff;border-radius:16px;padding:18px;z-index:51;box-shadow:0 20px 50px rgba(0,0,0,.3);animation:fade .15s}
.dlg-text{font-weight:700;font-size:15px;line-height:1.4}
.dlg-pole{display:block;margin-top:12px}
.dlg-pole .field{margin-top:4px}
.dlg-tl{display:flex;gap:8px;margin-top:16px}
.lnk.c-red{color:var(--red)}

/* bublina s počtem v dolním menu */
.nav-ik{position:relative;display:inline-flex}
.nav-bub{position:absolute;top:-6px;left:14px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--red);color:#fff;font-size:10.5px;font-weight:800;line-height:18px;text-align:center;box-shadow:0 0 0 2px #fff}
