/* ============================================================
   ORBITEL (.Orbitel / MobilStation) — Design System "Ink & Ember".
   Světlý základ + tmavá vrstva (aktivace: <html class="theme-dark">).
   Generováno přes Claude Design, integrováno do FastAPI/Jinja appky.
   Všechny původní názvy tříd/id zachovány — markup i JS fungují beze změn.
   Pořadí: fonty -> tokeny -> semantic role -> komponenty -> dark override.
   ============================================================ */

/* ---- Inter, self-hosted subset (čeština vč. ů) -------------- */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("/static/fonts/Inter-Regular.woff2") format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("/static/fonts/Inter-Medium.woff2") format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("/static/fonts/Inter-SemiBold.woff2") format("woff2");}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url("/static/fonts/Inter-Bold.woff2") format("woff2");}

/* ============================================================
   COLORS — světlá paleta (dark ji přemapuje níže)
   ============================================================ */
:root{
  --white:#FFFFFF;
  --stone-50:#FAFAF9;
  --stone-100:#F5F5F4;
  --stone-200:#E7E5E4;
  --stone-300:#D6D3D1;
  --stone-400:#A8A29E;
  --stone-500:#78716C;
  --stone-600:#57534E;
  --stone-700:#44403C;
  --stone-800:#292524;
  --stone-900:#1C1917;
  --brand-50:#FEF1EB;
  --brand-100:#FDDCCE;
  --brand-200:#FBBDA1;
  --brand-500:#FA6432;
  --brand-600:#E24E1B;
  --brand-700:#B93C12;
  --ok-text:#15803D;   --ok-fill:#16A34A;   --ok-bg:#ECFDF3;
  --warn-text:#B45309; --warn-fill:#F59E0B; --warn-bg:#FEF6E7;
  --err-text:#C81E1E;  --err-fill:#DC2626;  --err-bg:#FEF0F0;
  --info-text:#1D4ED8; --info-fill:#2563EB; --info-bg:#EFF4FF;
  --on-warn:#1C1917;   --on-ok:#FFFFFF;
  --st-prijato-txt:#1E40AF;      --st-prijato-bg:#DBE7FE;
  --st-rozpracovano-txt:#9A3D08; --st-rozpracovano-bg:#FBEBCE;
  --st-cekadil-txt:#9A3D08;      --st-cekadil-bg:#FBEBCE;
  --st-externi-txt:#5B6B0A;      --st-externi-bg:#F1F7C9;
  --st-hotovo-txt:#0F6E33;       --st-hotovo-bg:#D6F3E0;
  --st-predano-txt:#7E22CE;      --st-predano-bg:#EFE0FE;
  --st-dokonceno-txt:#475569;    --st-dokonceno-bg:#E2E8F0;
  --st-storno-txt:#BC1C1C;       --st-storno-bg:#FCE1E1;
}

/* ============================================================
   TYPOGRAPHY — Inter, jedna škála
   ============================================================ */
:root{
  --font-sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;
  --text-xs-size:12px;   --text-xs-lh:16px;   --text-xs-weight:500;
  --text-sm-size:13px;   --text-sm-lh:18px;   --text-sm-weight:400;
  --text-base-size:15px; --text-base-lh:22px; --text-base-weight:400;
  --text-md-size:17px;   --text-md-lh:24px;   --text-md-weight:600;
  --text-lg-size:19px;   --text-lg-lh:26px;   --text-lg-weight:600;
  --text-xl-size:24px;   --text-xl-lh:30px;   --text-xl-weight:700;
  --text-2xl-size:32px;  --text-2xl-lh:38px;  --text-2xl-weight:700;
  --leading-body:1.5;
}
.num,.tnum{font-variant-numeric:tabular-nums;}
.t-xs{font-size:var(--text-xs-size);line-height:var(--text-xs-lh);font-weight:var(--text-xs-weight);}
.t-sm{font-size:var(--text-sm-size);line-height:var(--text-sm-lh);font-weight:var(--text-sm-weight);}
.t-base{font-size:var(--text-base-size);line-height:var(--text-base-lh);font-weight:var(--text-base-weight);}
.t-md{font-size:var(--text-md-size);line-height:var(--text-md-lh);font-weight:var(--text-md-weight);}
.t-lg{font-size:var(--text-lg-size);line-height:var(--text-lg-lh);font-weight:var(--text-lg-weight);}
.t-xl{font-size:var(--text-xl-size);line-height:var(--text-xl-lh);font-weight:var(--text-xl-weight);}
.t-2xl{font-size:var(--text-2xl-size);line-height:var(--text-2xl-lh);font-weight:var(--text-2xl-weight);}

/* ============================================================
   SPACING (4px), RADIUS, ELEVATION
   ============================================================ */
:root{
  --space-0:0; --space-0-5:2px; --space-1:4px; --space-2:8px; --space-3:12px;
  --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px;
  --space-12:48px; --space-16:64px;
  --radius-sm:7px; --radius-md:10px; --radius-lg:12px; --radius-pill:999px;
  --radius:var(--radius-lg);
  --shadow-sm:0 1px 2px rgba(28,25,23,.06), 0 1px 3px rgba(28,25,23,.09);
  --shadow-md:0 4px 12px rgba(28,25,23,.10);
  --shadow-lg:0 12px 32px rgba(28,25,23,.16);
  --touch-min:44px;
}

/* ============================================================
   SEMANTIC ROLES + BACK-COMPAT ALIASY
   ============================================================ */
:root{
  --surface:#FFFFFF;
  --surface-sunken:var(--stone-100);
  --sidebar:#FFFFFF;
  --bg:#FFFFFF;
  --ink:var(--stone-900);
  --text:var(--stone-900);
  --text-secondary:var(--stone-600);
  --text-muted:var(--stone-500);
  --text-on-ink:#FFFFFF;
  --border:var(--stone-200);
  --border-strong:var(--stone-300);
  --focus-ring:var(--brand-600);
  --focus-ring-shadow:0 0 0 3px rgba(226,78,27,.28);
  --selection-bg:var(--brand-50);
  --link:var(--brand-700);
  --link-hover:var(--brand-600);
  /* Legacy aliasy — původní style.css / inline JS názvy proměnných */
  --primary:var(--ink);
  --primary-d:var(--stone-800);
  --line:var(--border);
  --card:var(--surface);
  --card2:var(--surface-sunken);
  --side:var(--sidebar);
  --muted:var(--text-muted);
  --ok:var(--ok-fill);
  --warn:var(--warn-fill);
  --err:var(--err-fill);
  --danger:var(--err-fill);
}
::selection{background:var(--selection-bg);}

/* ============================================================
   KOMPONENTY
   ============================================================ */
*{box-sizing:border-box;}
[hidden]{display:none!important;}
html,body{height:100%;max-width:100%;overflow-x:clip;}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font-sans);
  font-size:var(--text-base-size);line-height:var(--leading-body);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.muted{color:var(--text-muted);}
.spacer{flex:1;}
a{color:var(--link);text-decoration:none;}
a:hover{color:var(--link-hover);text-decoration:underline;}
.link{background:none;border:none;color:var(--link);cursor:pointer;font:inherit;font-size:var(--text-sm-size);padding:0;}
.link:hover{color:var(--link-hover);text-decoration:underline;}

/* --- ikony: inline Lucide, 1.5px currentColor ---------------- */
.icon,.ico svg,svg.icon{width:18px;height:18px;flex:none;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.ico{display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;flex:none;}

/* ---------- layout: sidebar + main ------------------------- */
.app{display:flex;min-height:100vh;}
.sidebar{
  width:236px;flex-shrink:0;background:var(--sidebar);border-right:1px solid var(--border);
  display:flex;flex-direction:column;padding:16px 12px;position:sticky;top:0;height:100vh;z-index:40;
}
.sidebar .brand{padding:6px 10px 18px;display:flex;align-items:center;gap:8px;}
.sidebar .brand img{height:26px;width:auto;display:block;}
.sidebar .brand .wordmark{font-size:21px;font-weight:800;letter-spacing:-.5px;color:var(--ink);}
.sidebar .brand .wordmark .em{color:var(--brand-500);}
.sidebar nav{display:flex;flex-direction:column;gap:2px;}
.sidebar nav a{
  display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:var(--radius-md);
  color:var(--text-secondary);font-weight:var(--fw-medium);font-size:14.5px;white-space:nowrap;
  border-left:3px solid transparent;position:relative;
}
.sidebar nav a .ico{color:var(--text-muted);}
.sidebar nav a:hover{background:var(--stone-50);color:var(--ink);}
.sidebar nav a:hover .ico{color:var(--ink);}
.sidebar nav a.on{background:var(--brand-50);color:var(--ink);font-weight:var(--fw-semibold);border-left-color:var(--brand-500);border-radius:0 var(--radius-md) var(--radius-md) 0;}
.sidebar nav a.on .ico{color:var(--brand-700);}
.side-foot{margin-top:auto;padding:12px 10px 4px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px;font-size:var(--text-sm-size);}
.ghost-dot{align-self:flex-end;color:var(--bg);font-size:20px;line-height:.4;text-decoration:none;padding:2px 8px;}
.ghost-dot:hover{color:var(--text-muted);}
.main{flex:1;min-width:0;display:flex;flex-direction:column;}

/* hamburger + scrim (off-canvas drawer na malých displejích) */
.hamburger{display:none;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--border-strong);background:var(--surface);border-radius:var(--radius-md);cursor:pointer;color:var(--ink);}
.scrim{display:none;position:fixed;inset:0;background:rgba(28,25,23,.4);z-index:39;}

/* ---------- page header ------------------------------------ */
.page-head{
  display:flex;align-items:center;gap:14px;padding:16px 24px;border-bottom:1px solid var(--border);
  position:sticky;top:0;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);z-index:20;
}
.page-head h1{font-size:var(--text-lg-size);line-height:var(--text-lg-lh);margin:0;font-weight:var(--fw-semibold);display:flex;align-items:center;gap:10px;}
.page-head h1 .icon{width:22px;height:22px;color:var(--brand-700);}
.page-body{padding:22px 24px;max-width:1180px;width:100%;}

/* ---------- tlačítka --------------------------------------- */
.btn,.btn-primary,.btn-ghost,.btn-sm,.btn-xs{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;
  font-family:inherit;font-weight:var(--fw-semibold);white-space:nowrap;border:1px solid transparent;
  transition:background .12s ease,border-color .12s ease,color .12s ease;
}
.btn-primary{background:var(--ink);color:var(--text-on-ink);border-radius:var(--radius-md);padding:10px 16px;font-size:var(--text-base-size);}
.btn-primary:hover{background:var(--stone-800);}
.btn-primary:active{background:var(--stone-700);}
.btn-primary:disabled{background:var(--stone-300);color:var(--white);cursor:not-allowed;}
.btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--border-strong);border-radius:var(--radius-md);padding:10px 16px;font-size:var(--text-base-size);}
.btn-ghost:hover{background:var(--stone-50);border-color:var(--stone-400);}
.btn-sm{background:var(--surface);color:var(--ink);border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:8px 13px;font-size:var(--text-sm-size);}
.btn-sm:hover{background:var(--stone-50);border-color:var(--stone-400);}
.btn-xs{background:var(--surface);color:var(--ink);border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:5px 10px;font-size:var(--text-xs-size);font-weight:var(--fw-medium);}
.btn-xs:hover{background:var(--stone-50);border-color:var(--stone-400);}
.primary{background:var(--ink);color:var(--text-on-ink);border:none;border-radius:var(--radius-md);font-weight:var(--fw-semibold);cursor:pointer;font-family:inherit;}
.primary:hover{background:var(--stone-800);}
button:disabled{cursor:not-allowed;opacity:.55;}

:focus-visible{outline:none;border-color:var(--focus-ring);box-shadow:var(--focus-ring-shadow);}
a:focus-visible,.sidebar nav a:focus-visible{box-shadow:var(--focus-ring-shadow);}

/* ---------- karty ------------------------------------------ */
.card{background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow-sm);}
.card h3{margin:0 0 6px;font-size:var(--text-md-size);line-height:var(--text-md-lh);font-weight:var(--fw-semibold);display:flex;align-items:center;gap:8px;}
.card h3 .muted{font-weight:var(--fw-regular);font-size:var(--text-sm-size);}

/* ---------- inputy ----------------------------------------- */
label.fld{display:block;font-size:var(--text-xs-size);color:var(--text-secondary);margin:14px 0 5px;font-weight:var(--fw-medium);}
input,textarea,select{
  width:100%;padding:10px 12px;background:var(--surface-sunken);color:var(--ink);
  border:1px solid var(--border-strong);border-radius:var(--radius-md);
  font-size:var(--text-base-size);font-family:inherit;line-height:1.4;
}
input::placeholder,textarea::placeholder{color:var(--stone-400);}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--focus-ring);box-shadow:var(--focus-ring-shadow);background:var(--surface);}
textarea{resize:vertical;}
input:disabled,select:disabled{color:var(--text-muted);background:var(--stone-100);cursor:not-allowed;}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.chk{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:var(--text-base-size);}
.chk input{width:auto;accent-color:var(--ink);width:18px;height:18px;}

.seg{display:inline-flex;background:var(--surface-sunken);border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:3px;gap:2px;}
.seg label{display:flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--text-base-size);color:var(--text-secondary);font-weight:var(--fw-medium);}
.seg input{display:none;}
.seg label:has(input:checked){background:var(--ink);color:var(--text-on-ink);}

.input-group{display:flex;align-items:stretch;gap:8px;}
.input-group select{max-width:92px;}
.price-input{display:flex;align-items:center;gap:8px;position:relative;}
.price-input input{text-align:right;font-variant-numeric:tabular-nums;font-weight:var(--fw-semibold);}
.price-input .suffix{color:var(--text-muted);font-weight:var(--fw-medium);flex:none;}

/* ---------- tabulky ---------------------------------------- */
.tablecard{background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);}
.tablecard--scroll{overflow-x:auto;}
table.grid{width:100%;border-collapse:collapse;}
table.grid th{text-align:left;padding:11px 14px;font-size:var(--text-xs-size);text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);font-weight:var(--fw-semibold);border-bottom:1px solid var(--border);background:var(--surface-sunken);white-space:nowrap;}
table.grid td{padding:12px 14px;border-bottom:1px solid var(--border);font-size:var(--text-base-size);vertical-align:middle;}
table.grid tr:last-child td{border-bottom:none;}
table.grid tr.clickable{cursor:pointer;}
table.grid tr.clickable:hover td{background:var(--stone-50);}
table.grid tr.urgent td:first-child,table.grid tr.missing-part td:first-child{box-shadow:inset 3px 0 0 var(--err-fill);}
td.cut{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
td.right,th.right{text-align:right;}
td.num,td.right{font-variant-numeric:tabular-nums;}

/* ---------- stavový slovník (JEDEN systém) ----------------- */
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:var(--radius-pill);font-size:var(--text-xs-size);font-weight:var(--fw-semibold);white-space:nowrap;line-height:1.2;}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;}
.badge.s-donese{background:var(--st-donese-bg,#DDF4F8);color:var(--st-donese-txt,#0B6577);}
.badge.s-prijato{background:var(--st-prijato-bg);color:var(--st-prijato-txt);}
.badge.s-rozpracovano{background:var(--st-rozpracovano-bg);color:var(--st-rozpracovano-txt);}
.badge.s-ceka_dil{background:var(--st-cekadil-bg);color:var(--st-cekadil-txt);}
.badge.s-externi_servis{background:var(--st-externi-bg);color:var(--st-externi-txt);}
.badge.s-hotovo{background:var(--st-hotovo-bg);color:var(--st-hotovo-txt);}
.badge.s-predano{background:var(--st-predano-bg);color:var(--st-predano-txt);}
.badge.s-dokonceno{background:var(--st-dokonceno-bg);color:var(--st-dokonceno-txt);}
.badge.s-storno{background:var(--st-storno-bg);color:var(--st-storno-txt);}
.badge.ok{background:var(--ok-bg);color:var(--ok-text);}
.badge.warn{background:var(--warn-bg);color:var(--warn-text);}
.badge.err{background:var(--err-bg);color:var(--err-text);}
.badge.info{background:var(--info-bg);color:var(--info-text);}
.badge.ok::before,.badge.warn::before,.badge.err::before,.badge.info::before{display:none;}

.warn-part{color:var(--err-text);font-size:var(--text-xs-size);font-weight:var(--fw-semibold);margin-top:4px;display:flex;align-items:center;gap:4px;}

.msg{font-size:var(--text-sm-size);}
.msg.ok{color:var(--ok-text);}
.msg.err{color:var(--err-text);}
.error{color:var(--err-text);margin:6px 0 0;font-size:var(--text-sm-size);}

.status{min-height:22px;margin-top:12px;font-size:var(--text-base-size);}
.status.ok,.status.err,.status.warn,.status.info{
  display:flex;align-items:center;gap:10px;padding:14px 16px;border-radius:var(--radius-md);
  font-size:var(--text-md-size);font-weight:var(--fw-semibold);border:1px solid transparent;
}
.status.ok{background:var(--ok-bg);color:var(--ok-text);border-color:var(--ok-fill);}
.status.err{background:var(--err-bg);color:var(--err-text);border-color:var(--err-fill);}
.status.warn{background:var(--warn-bg);color:var(--on-warn);border-color:var(--warn-fill);}
.status.info{background:var(--info-bg);color:var(--info-text);border-color:var(--info-fill);}
.status .icon{width:22px;height:22px;}

.banner{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--radius-md);font-size:var(--text-base-size);border:1px solid transparent;}
.banner .icon{margin-top:1px;}
.banner.warn{background:var(--warn-bg);color:var(--on-warn);border-color:var(--warn-fill);}
.banner.err{background:var(--err-bg);color:var(--err-text);border-color:var(--err-fill);}
.banner.info{background:var(--info-bg);color:var(--info-text);border-color:var(--info-fill);}
.banner.ok{background:var(--ok-bg);color:var(--ok-text);border-color:var(--ok-fill);}

/* ---------- KPI / stat ------------------------------------- */
.stat{display:flex;flex-direction:column;gap:2px;}
.stat .stat-label{font-size:var(--text-xs-size);text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);font-weight:var(--fw-semibold);}
.stat .stat-value{font-size:var(--text-xl-size);line-height:var(--text-xl-lh);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;}
.stat .stat-detail{font-size:var(--text-sm-size);color:var(--text-muted);}

/* ---------- toolbar ---------------------------------------- */
.toolbar{display:flex;gap:12px;margin-bottom:16px;}
.toolbar input{flex:1;}
.toolbar select{width:auto;min-width:170px;}

/* ---------- taby ------------------------------------------- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:18px;}
.tab{background:none;border:none;padding:10px 14px;font-size:var(--text-base-size);font-weight:var(--fw-medium);color:var(--text-secondary);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;font-family:inherit;}
.tab:hover{color:var(--ink);}
.tab.active{color:var(--ink);font-weight:var(--fw-semibold);border-bottom-color:var(--ink);}

/* ---------- autocomplete ----------------------------------- */
.ac{position:relative;}
.ac-results{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:30;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-md);max-height:260px;overflow:auto;box-shadow:var(--shadow-lg);}
.ac-item{padding:10px 12px;cursor:pointer;font-size:var(--text-base-size);border-bottom:1px solid var(--border);}
.ac-item:last-child{border-bottom:none;}
.ac-item:hover,.ac-item.active{background:var(--brand-50);color:var(--ink);}
.ac-item:hover .muted{color:var(--text-secondary);}

/* ---------- form grid (zakázka) ---------------------------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;}
.form-grid .span2{grid-column:1 / -1;}

/* ---------- items / parts ---------------------------------- */
table.items{width:100%;border-collapse:collapse;margin-bottom:10px;}
table.items th{text-align:left;font-size:var(--text-xs-size);color:var(--text-secondary);padding:6px;font-weight:var(--fw-medium);text-transform:uppercase;letter-spacing:.03em;}
table.items td{padding:6px;border-bottom:1px solid var(--border);}
table.items input{padding:8px 10px;width:92px;}
table.items .i-name{width:100%;}
table.items .x{background:none;border:none;color:var(--err-text);font-size:20px;cursor:pointer;line-height:1;padding:2px 6px;border-radius:var(--radius-sm);}
table.items .x:hover{background:var(--err-bg);}
.totals{display:flex;gap:28px;margin-top:10px;font-size:var(--text-base-size);}
.totals strong{color:var(--ink);font-variant-numeric:tabular-nums;}
.loglist{list-style:none;margin:0;padding:0;}
.loglist li{padding:8px 0;border-bottom:1px solid var(--border);font-size:var(--text-base-size);}
.loglist li:last-child{border-bottom:none;}

.parts-subrow>td{background:var(--surface-sunken);padding:8px 14px!important;}
.parts-subrow .muted{font-size:var(--text-xs-size);margin-bottom:4px;}
.fk-part-btn{margin-left:4px;}

/* ---------- action bar ------------------------------------- */
.actionbar{position:sticky;bottom:0;display:flex;align-items:center;gap:10px;padding:14px 24px;background:var(--surface);border-top:1px solid var(--border);flex-wrap:wrap;box-shadow:0 -1px 2px rgba(28,25,23,.05);}

/* ---------- scanner (naskladňovač) ------------------------- */
.scan-wrap{max-width:900px;margin:0 auto;padding:24px;display:grid;gap:18px;grid-template-columns:minmax(0,1fr);width:100%;}
#ean{font-size:var(--text-2xl-size);line-height:1.1;padding:18px;text-align:center;letter-spacing:2px;font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;}
.product-main{display:flex;justify-content:space-between;gap:12px;}
.p-name{font-size:var(--text-lg-size);font-weight:var(--fw-semibold);}
.p-price{font-size:var(--text-md-size);font-weight:var(--fw-bold);white-space:nowrap;font-variant-numeric:tabular-nums;}
.price-row{margin-top:16px;}
.price-input input{height:50px;font-size:22px;}
.qty-row{display:flex;align-items:center;gap:8px;margin-top:16px;}
.qty-btn{width:46px;height:46px;font-size:22px;padding:0;}
#qty{width:84px;height:46px;text-align:center;font-size:20px;font-variant-numeric:tabular-nums;}
.scan-wrap .primary,#confirm{margin-left:auto;height:46px;padding:0 24px;}
.candidate-list,.history{list-style:none;margin:8px 0 0;padding:0;}
.candidate-list li{padding:12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);margin-bottom:8px;cursor:pointer;}
.candidate-list li:hover{border-color:var(--brand-600);background:var(--brand-50);}
.history li{padding:8px 0;border-bottom:1px solid var(--border);font-size:var(--text-base-size);display:flex;justify-content:space-between;gap:10px;}
.history li.err{color:var(--err-text);}
.hist-head{display:flex;justify-content:space-between;align-items:center;gap:8px;}

/* ---------- modal ------------------------------------------ */
.modal{position:fixed;inset:0;background:rgba(28,25,23,.5);display:flex;align-items:center;justify-content:center;padding:16px;z-index:50;backdrop-filter:blur(2px);}
.modal-card{width:100%;max-width:540px;max-height:92vh;overflow:auto;}
.modal-card.sm{max-width:420px;}
.modal-card.md{max-width:480px;}
.modal-card.lg{max-width:720px;}
.modal-card.xl{max-width:1000px;}
.modal-card h2,.modal-card h3{margin-top:0;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:18px;}

/* category picker */
.cat-picker{border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:8px;}
.cat-selected{padding:8px 10px;background:var(--surface-sunken);border-radius:var(--radius-sm);margin-bottom:8px;}
.cat-tree,.cat-results{max-height:220px;overflow:auto;margin-top:6px;}
.cat-node{display:flex;align-items:center;gap:6px;padding:3px 0;}
.cat-toggle{width:18px;text-align:center;color:var(--text-muted);user-select:none;}
.cat-toggle.clickable{cursor:pointer;color:var(--ink);}
.cat-name{cursor:pointer;padding:3px 8px;border-radius:var(--radius-sm);}
.cat-name:hover{background:var(--brand-50);color:var(--ink);}
.cat-children{margin-left:18px;border-left:1px solid var(--border);padding-left:6px;}
.cat-result{padding:9px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);margin-bottom:6px;cursor:pointer;}
.cat-result:hover{border-color:var(--brand-600);background:var(--brand-50);}

.grid-add{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end;}

/* ---------- login ------------------------------------------ */
.login-body{display:flex;min-height:100vh;align-items:center;justify-content:center;background:var(--stone-50);}
.login-card{width:100%;max-width:360px;display:grid;gap:12px;}
.login-card h1{margin:0;font-size:var(--text-xl-size);font-weight:var(--fw-bold);}
.login-card button{padding:12px;background:var(--ink);color:var(--text-on-ink);border:none;border-radius:var(--radius-md);font-weight:var(--fw-semibold);cursor:pointer;font-size:var(--text-base-size);font-family:inherit;}
.login-card button:hover{background:var(--stone-800);}

/* ---------- naskladněné faktury ---------------------------- */
.fkt-card{background:var(--surface-sunken);border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:12px 13px;}
.fkt-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;}
.fkt-card-head strong{font-size:var(--text-sm-size);}
.fkt-chip{font-size:var(--text-xs-size);font-weight:var(--fw-semibold);padding:3px 9px;border-radius:var(--radius-pill);white-space:nowrap;}
.fkt-chip-ok{background:var(--ok-bg);color:var(--ok-text);}
.fkt-chip-muted{background:var(--surface);color:var(--text-muted);border:1px solid var(--border);}
.fkt-sub{font-size:var(--text-xs-size);text-transform:uppercase;letter-spacing:.04em;margin:4px 0 6px;color:var(--text-secondary);}
.fkt-empty{font-size:var(--text-sm-size);padding:6px 0;color:var(--text-muted);}
.fkt-inv-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid var(--border);font-size:var(--text-sm-size);}
.fkt-inv-row:first-of-type{border-top:none;}
.fkt-inv-l{min-width:0;}
.fkt-inv-r{font-size:var(--text-xs-size);white-space:nowrap;flex:none;font-variant-numeric:tabular-nums;}
.fkt-more{display:inline-block;margin-top:8px;font-size:var(--text-sm-size);}
.fkt-older .fkt-inv-row:first-of-type{border-top:1px solid var(--border);}

input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
input[type=number]{-moz-appearance:textfield;appearance:textfield;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:900px){
  .hamburger{display:inline-flex;}
  .sidebar{position:fixed;left:0;top:0;height:100vh;transform:translateX(-100%);transition:transform .22s ease;box-shadow:var(--shadow-lg);}
  .app.drawer-open .sidebar{transform:translateX(0);}
  .app.drawer-open .scrim{display:block;}
  .page-body{padding:18px 16px;}
  .page-head{padding-left:60px;}
  .form-grid{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .page-head{padding:14px 16px 14px 60px;}
  .grid2,.row2{grid-template-columns:1fr;}
  .grid-add{grid-template-columns:1fr 1fr;}
  .tablecard.stack table.grid thead{display:none;}
  .tablecard.stack table.grid,.tablecard.stack tbody,.tablecard.stack tr,.tablecard.stack td{display:block;width:100%;}
  .tablecard.stack tr{border-bottom:1px solid var(--border);padding:8px 4px;}
  .tablecard.stack td{border:none;padding:5px 14px;display:flex;justify-content:space-between;gap:12px;}
  .tablecard.stack td::before{content:attr(data-label);color:var(--text-secondary);font-size:var(--text-xs-size);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.03em;}
  .tablecard.stack td.cut{max-width:none;white-space:normal;text-align:right;}
}
@media (pointer:coarse){
  .btn-xs,.btn-sm{min-height:var(--touch-min);}
  .sidebar nav a,.tab,.ac-item,.seg label{min-height:var(--touch-min);}
  table.grid td{padding-top:14px;padding-bottom:14px;}
}

/* ============================================================
   MOBILSTATION NIGHT — tmavý vzhled v barvách webu mobilstation.cz
   Aktivace: třída .theme-dark na <html>. Paleta vychází z tokenů webu:
   brand #155eef, accent #2ea8e0, ink #0a2540, night #0a1c38, Inter 800.
   Vrstva 1 přemapuje tokeny, vrstva 2 doladí tvary komponent (zaoblení,
   kulatá tlačítka, tučné nadpisy) — názvy tříd a markup se nemění.
   ============================================================ */
html.theme-dark{color-scheme:dark;}
html.theme-dark:root{
  /* --- neutrální rampa (navy, invertováno) --- */
  --stone-50:#11284B;   /* hover wash */
  --stone-100:#081830;  /* sunken: inputy, th */
  --stone-200:#1A3056;  /* border */
  --stone-300:#27416D;  /* border-strong */
  --stone-400:#6680AC;  /* placeholder, disabled */
  --stone-500:#8FA5CA;  /* muted */
  --stone-600:#B9C8E4;  /* secondary */
  --stone-700:#D3DEF2;
  --stone-800:#E3EBF9;
  --stone-900:#EEF3FC;  /* ink (světlý text) */

  /* --- povrchy --- */
  --bg:#071428;
  --surface:#0C1F3D;
  --surface-sunken:#081830;
  --sidebar:#0A1C38;      /* „night" z webu */
  --text-on-ink:#FFFFFF;

  /* --- značková modrá na tmavé --- */
  --brand-50:#10295A;   /* aktivní nav / selection wash */
  --brand-100:#153570;  /* hover wash */
  --brand-200:#1D4796;
  --brand-500:#155EEF;  /* značková: primární tlačítka */
  --brand-600:#3B7BFF;  /* focus ring, UI strokes, hover primárního tlačítka */
  --brand-700:#7FB0FF;  /* modrý text / odkazy / ikony */
  --brand-press:#0F4FD0;
  --accent:#2EA8E0;     /* světle modrá z loga */
  --accent-ink:#62C4F2;
  --focus-ring:#3B7BFF;
  --primary:var(--brand-500); --primary-d:var(--brand-600);
  --focus-ring-shadow:0 0 0 3px rgba(59,123,255,.35);
  --selection-bg:#1D4796;

  /* --- stavové barvy (tmavé varianty) --- */
  --ok-text:#5FDB93;   --ok-fill:#22A854;   --ok-bg:#0E2E2A;
  --warn-text:#F6BE4F; --warn-fill:#D98B06; --warn-bg:#2C2718;
  --err-text:#FF8880;  --err-fill:#E5484D;  --err-bg:#32182A;
  --info-text:#8DBBFF; --info-fill:#3B82F6; --info-bg:#102A56;
  --on-warn:#F6C453;

  /* --- badge stavů oprav --- */
  --st-donese-txt:#7FDCEB;       --st-donese-bg:#0E3A48;
  --st-prijato-txt:#9CC2FF;      --st-prijato-bg:#143266;
  --st-rozpracovano-txt:#F3B26F; --st-rozpracovano-bg:#33291F;
  --st-cekadil-txt:#F3B26F;      --st-cekadil-bg:#33291F;
  --st-externi-txt:#D9E86B;      --st-externi-bg:#2E3311;
  --st-hotovo-txt:#67DB9A;       --st-hotovo-bg:#0F3330;
  --st-predano-txt:#D2ADFB;      --st-predano-bg:#2B2259;
  --st-dokonceno-txt:#A9BBD9;    --st-dokonceno-bg:#18294A;
  --st-storno-txt:#FF918B;       --st-storno-bg:#3A1B2C;

  /* --- tvary: zaoblení jako na webu (xl 12, 2xl 16) --- */
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px;
  --fw-heavy:800;

  /* --- elevace: plochý vzhled, stín jen u vrstev nad stránkou --- */
  --shadow-sm:none;
  --shadow-md:0 6px 18px rgba(2,8,20,.5);
  --shadow-lg:0 16px 40px rgba(2,8,20,.6);
}
/* komponenty s natvrdo zapsanou barvou v základním CSS */
html.theme-dark .page-head{background:rgba(7,20,40,.9);}
html.theme-dark .modal{background:rgba(2,8,20,.72);}
html.theme-dark .scrim{background:rgba(2,8,20,.6);}
html.theme-dark .actionbar{box-shadow:none;background:rgba(10,28,56,.96);backdrop-filter:blur(8px);}
html.theme-dark .login-body{background:var(--bg);}

/* ---- vrstva 2: komponenty ---------------------------------- */
/* nadpisy: Inter 800 se staženým prokladem jako na webu */
html.theme-dark .page-head h1{font-weight:var(--fw-heavy);font-size:21px;letter-spacing:-.02em;}
html.theme-dark .card h3,html.theme-dark .modal-card h2,html.theme-dark .modal-card h3{font-weight:700;letter-spacing:-.01em;}
html.theme-dark .login-card h1{font-weight:var(--fw-heavy);letter-spacing:-.02em;}

/* značka: pulz + nápis (stejný tvar jako logo webu) */
.ms-logo{display:inline-flex;align-items:center;gap:8px;font-weight:800;letter-spacing:-.03em;color:#fff;line-height:1;text-decoration:none!important;}
.ms-logo svg{height:1.05em;width:auto;flex:none;fill:none;stroke:var(--accent,#2EA8E0);stroke-width:6.5;stroke-linecap:round;stroke-linejoin:round;}
.ms-logo .em{color:#5B8CFF;}
.sidebar .brand .ms-logo{font-size:21px;}
.sidebar .brand{padding:8px 10px 16px;}

/* primární akce = značková modrá, kulaté jako CTA na webu */
html.theme-dark .btn-primary,html.theme-dark .primary,html.theme-dark .login-card button{
  background:var(--brand-500);color:#fff;border-radius:var(--radius-pill);font-weight:700;}
html.theme-dark .btn-primary{padding:10px 20px;}
html.theme-dark .btn-primary:hover,html.theme-dark .primary:hover,html.theme-dark .login-card button:hover{background:var(--brand-600);color:#fff;text-decoration:none;}
html.theme-dark .btn-primary:active,html.theme-dark .primary:active{background:var(--brand-press);}
html.theme-dark .btn-primary:disabled,html.theme-dark .primary:disabled{background:var(--stone-300);color:var(--stone-500);}
html.theme-dark .btn-ghost,html.theme-dark .btn-sm{border-radius:var(--radius-pill);background:transparent;border-color:var(--border-strong);}
html.theme-dark .btn-ghost{padding:10px 18px;}
html.theme-dark .btn-ghost:hover,html.theme-dark .btn-sm:hover,html.theme-dark .btn-xs:hover{background:var(--stone-50);border-color:var(--brand-600);color:#fff;text-decoration:none;}
html.theme-dark .btn-xs{background:transparent;}
html.theme-dark .seg label:has(input:checked){background:var(--brand-500);color:#fff;}
html.theme-dark .chk input{accent-color:var(--brand-500);}
html.theme-dark .tab.active{color:#fff;border-bottom-color:var(--brand-600);}
html.theme-dark a.btn-primary,html.theme-dark a.btn-ghost,html.theme-dark a.btn-sm{text-decoration:none;}

/* karty a tabulky: tenká linka, žádný stín */
html.theme-dark .card,html.theme-dark .tablecard{border-color:var(--border);}
html.theme-dark table.grid th{color:var(--text-muted);letter-spacing:.06em;}
html.theme-dark table.grid td{border-bottom-color:var(--border);}
html.theme-dark input,html.theme-dark textarea,html.theme-dark select{border-color:var(--border);}
html.theme-dark input:hover,html.theme-dark textarea:hover,html.theme-dark select:hover{border-color:var(--border-strong);}
html.theme-dark input:focus,html.theme-dark textarea:focus,html.theme-dark select:focus{border-color:var(--focus-ring);background:var(--surface-sunken);}
html.theme-dark .ac-item:hover,html.theme-dark .ac-item.active{background:var(--brand-100);color:#fff;}

/* menu: skupiny s linkou, aktivní položka jako modrá pilulka */
.sidebar nav{overflow-y:auto;flex:1;min-height:0;margin-right:-6px;padding-right:6px;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent;}
.sidebar .nav-sec{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:var(--stone-400);
  padding:16px 12px 8px;margin-top:12px;border-top:1px solid var(--border);}
.sidebar .nav-sec:first-child{border-top:none;margin-top:0;padding-top:4px;}
html.theme-dark .sidebar nav a{border-left:none;padding:10px 12px;border-radius:var(--radius-md);font-size:14.5px;line-height:22px;}
html.theme-dark .sidebar nav{gap:3px;}
html.theme-dark .sidebar nav a:hover{text-decoration:none;}
html.theme-dark .sidebar nav a.on{background:rgba(21,94,239,.24);color:#fff;font-weight:700;border-radius:var(--radius-md);}
html.theme-dark .sidebar nav a.on .ico{color:var(--accent-ink);}
html.theme-dark .side-foot{margin-top:8px;flex-direction:row;align-items:center;justify-content:space-between;padding:10px 10px 2px;position:relative;}
html.theme-dark .side-foot .ghost-dot{position:absolute;right:-6px;bottom:-10px;}
html.theme-dark .side-foot #side-user{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
html.theme-dark .ghost-dot{color:var(--sidebar);}

/* filtrovací čipy (kulaté jako výběr značky na webu) */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.chip{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);
  background:transparent;color:var(--text-secondary);font:inherit;font-size:var(--text-sm-size);font-weight:600;cursor:pointer;white-space:nowrap;
  transition:background .12s ease,border-color .12s ease,color .12s ease;}
.chip:hover{border-color:var(--brand-600);color:var(--ink);}
.chip.on{background:var(--brand-500);border-color:var(--brand-500);color:#fff;}
.chip .n{font-variant-numeric:tabular-nums;font-weight:500;opacity:.75;}
.chip.on .n{opacity:.9;}

/* hledání s ikonou a tlačítkem pro vymazání */
.searchbox{position:relative;flex:1;display:flex;}
.searchbox .icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--stone-400);pointer-events:none;}
.searchbox input{padding-left:42px;padding-right:40px;border-radius:var(--radius-pill);}
.searchbox .clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:none;border-radius:50%;
  background:transparent;color:var(--text-muted);cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;}
.searchbox .clear:hover{background:var(--stone-50);color:var(--ink);}
.list-meta{font-size:var(--text-sm-size);color:var(--text-muted);margin:0 2px 10px;min-height:18px;}
.empty{padding:34px 16px!important;text-align:center;color:var(--text-muted);}
.empty strong{display:block;color:var(--ink);font-weight:700;margin-bottom:4px;}
td.nowrap{white-space:nowrap;}
.warn-part .icon{width:14px;height:14px;}
.btn-primary .icon,.btn-ghost .icon,.btn-sm .icon,.primary .icon{width:17px;height:17px;}

/* --- detail použitého kusu (stránka /pouzite/{id}) --- */
.ud-wrap{max-width:1100px;display:flex;flex-direction:column;gap:16px;}
.ud-pill{display:inline-block;padding:4px 13px;border-radius:999px;
  font-size:.72rem;font-weight:var(--fw-semibold);letter-spacing:.01em;}
.ud-pill.prep{background:var(--st-rozpracovano-bg,#3A2812);color:var(--st-rozpracovano-txt,#F0A868);}
.ud-pill.stock{background:var(--st-hotovo-bg,#123320);color:var(--st-hotovo-txt,#63D592);}
.ud-pill.sold{background:var(--st-dokonceno-bg,#262F3A);color:var(--st-dokonceno-txt,#AAB7C4);}
.ud-card-title{font-size:1.05rem;font-weight:var(--fw-semibold);margin-bottom:2px;}
.ud-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 28px;}
.ud-stats .lbl{font-size:.68rem;font-weight:var(--fw-semibold);text-transform:uppercase;
  letter-spacing:.08em;color:var(--muted);margin-bottom:4px;}
.ud-stats .val{font-size:1.02em;font-weight:var(--fw-medium);overflow-wrap:anywhere;}
.ud-stats .sub{font-size:.82em;color:var(--muted);margin-top:2px;}
@media (max-width:760px){.ud-stats{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.ud-stats{grid-template-columns:1fr;}}
.ud-sell{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap;}
.ud-sell .btn-primary{height:50px;padding:0 26px;flex:none;}

/* --- badge počtu nových online objednávek v menu --- */
.nav-badge{margin-left:auto;min-width:19px;height:19px;padding:0 5px;border-radius:999px;
  background:var(--err-fill,#e5534b);color:#fff;font-size:.7rem;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;}
.nav-badge.vcas{background:var(--accent,#2EA8E0);}

/* nativní křížek u type=search schovat — máme vlastní */
input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;}
/* stránky bez hlavičky (mobilní přehled): místo pro tlačítko menu */
@media (max-width:900px){ .main > .page-body:first-child{padding-top:62px;} }
/* menu: pohodlné rozestupy; když se nevejde na výšku, posouvá se (spodek se ztrácí do ztracena) */
.sidebar nav{padding-bottom:22px;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 30px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 30px),transparent);}

/* kroky formuláře (výkup): 1 Prodávající → 2 Zařízení */
.steps{display:flex;gap:8px;margin:14px 0 2px;flex-wrap:wrap;}
.steps .step{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 7px;border-radius:var(--radius-pill);border:1px solid var(--border-strong);
  background:transparent;color:var(--text-muted);font:inherit;font-size:var(--text-sm-size);font-weight:600;cursor:pointer;}
.steps .step b{display:inline-flex;width:22px;height:22px;border-radius:50%;align-items:center;justify-content:center;background:var(--stone-50);font-size:12px;font-weight:700;}
.steps .step.on{border-color:var(--brand-500);color:#fff;background:rgba(21,94,239,.2);}
.steps .step.on b{background:var(--brand-500);color:#fff;}

/* drobný štítek pod číslem zakázky (Reklamace) — nízký, aby nezvětšoval řádek tabulky */
.tag-mini-wrap{line-height:1;margin-top:1px;}
.tag-mini{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.02em;line-height:1.3;padding:1px 7px;border-radius:var(--radius-pill);white-space:nowrap;}
.tag-mini.warn{background:var(--warn-bg);color:var(--warn-text);}

/* ---- detail zakázky (návrh B): pruh s fakty nahoře, poznámky vpravo ---- */
.detail-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start;max-width:1540px;}
.detail-layout > .detail-main{min-width:0;}
.detail-layout:has(> .detail-notes[hidden]){grid-template-columns:minmax(0,1fr);max-width:1180px;}
.fact-strip{background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-lg);overflow:hidden;}
/* dvě řady údajů vlevo, vpravo sloupec přes obě řady (vzor / heslo / termín) */
.fact-cells{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(180px,auto);}
/* oddělovače vpravo a dole; okraj pruhu je ořízne */
.fact-cell{padding:14px 18px;display:flex;flex-direction:column;gap:4px;min-width:0;box-shadow:1px 0 0 var(--border-strong),0 1px 0 var(--border-strong);}
.fact-side{grid-column:3;grid-row:1 / span 2;}
.fact-label{font-size:var(--text-xs-size);color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-weight:var(--fw-semibold);}
.fact-main{font-size:17px;font-weight:var(--fw-semibold);line-height:1.3;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;}
.fact-sub{font-size:var(--text-sm-size);color:var(--text-muted);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.fact-tel{text-decoration:none;font-size:15px;font-variant-numeric:tabular-nums;}
.fact-gesture{align-items:center;gap:8px;}
.fact-gesture .fact-label{align-self:stretch;}
.fact-gesture svg{width:112px;height:112px;flex:0 0 auto;}
.fact-seq{font-size:15px;font-weight:var(--fw-semibold);letter-spacing:.04em;font-variant-numeric:tabular-nums;}
@media (max-width:640px){
  .fact-cells{grid-template-columns:repeat(2,minmax(0,1fr));}
  .fact-side{grid-column:1 / -1;grid-row:auto;order:1;}
}
.detail-notes{position:sticky;top:16px;display:flex;flex-direction:column;max-height:calc(100vh - 150px);padding:0;overflow:hidden;}
.notes-head{display:flex;align-items:baseline;gap:8px;padding:16px 18px;border-bottom:1px solid var(--border);}
.notes-head h3{margin:0;}
.notes-count{font-size:var(--text-sm-size);}
.notes-list{flex:1 1 auto;overflow-y:auto;min-height:80px;padding:0 18px;}
.note{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);}
.note:last-child{border-bottom:none;}
.note-av{flex:0 0 32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:var(--fw-semibold);}
.note-body{display:flex;flex-direction:column;gap:2px;min-width:0;}
.note-head{display:flex;flex-wrap:wrap;gap:6px;align-items:baseline;font-size:var(--text-sm-size);}
.note-head b{font-weight:var(--fw-semibold);}
.note-time{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;}
.note-text{white-space:pre-wrap;word-break:break-word;}
.notes-empty{padding:14px 0;}
.notes-compose{display:flex;flex-direction:column;gap:8px;padding:14px 18px;border-top:1px solid var(--border);}
.notes-compose label{font-size:var(--text-sm-size);}
.notes-compose textarea{width:100%;resize:vertical;box-sizing:border-box;}
.notes-compose .btn-primary{width:100%;min-height:44px;justify-content:center;}
.notes-hint{font-size:var(--text-xs-size);}
.av1{background:#DBEAFE;color:#1E3A8A;} .av2{background:#DCFCE7;color:#14532D;} .av3{background:#FEF3C7;color:#78350F;}
.av4{background:#FCE7F3;color:#831843;} .av5{background:#EDE9FE;color:#4C1D95;}
html.theme-dark .av1{background:#1E2D52;color:#B9CCFF;} html.theme-dark .av2{background:#14382A;color:#86EFAC;}
html.theme-dark .av3{background:#3A2A1E;color:#FCD34D;} html.theme-dark .av4{background:#3D1A2E;color:#F9A8D4;}
html.theme-dark .av5{background:#2A2150;color:#C4B5FD;}
@media (max-width:1100px){
  .detail-layout{grid-template-columns:minmax(0,1fr);}
  .detail-notes{position:static;max-height:none;}
  .notes-list{max-height:380px;}
}
.detail-head{flex-wrap:wrap;row-gap:8px;}
/* stav použitého telefonu A/B v seznamu kusů */
.grade-badge{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:7px;font-weight:var(--fw-semibold);font-size:var(--text-sm-size);border:1.5px solid var(--border-strong);}
.grade-A{background:var(--ok-bg);color:var(--ok-text);border-color:transparent;}
.grade-B{background:var(--warn-bg);color:var(--warn-text);border-color:transparent;}
th.center,td.center{text-align:center;}
/* okno po podpisu zakázky: stav tisku účtenky a QR štítku + potvrzení */
.prijem-tisk{display:flex;flex-direction:column;gap:6px;margin:10px auto 0;max-width:320px;text-align:left;}
.pt-radek{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-md);}
.pt-nazev{font-weight:var(--fw-semibold);min-width:84px;}
.pt-stav{flex:1 1 auto;font-size:var(--text-sm-size);}
.pt-ok{color:var(--ok-text);}
.pt-err{color:var(--err-text);}
html.theme-dark .pt-ok{color:#7EE2A8;} html.theme-dark .pt-err{color:#FF9AA8;}
.prijem-potvrzeni{display:flex;flex-direction:column;gap:6px;margin:14px auto 0;max-width:320px;text-align:left;}

/* Výběr iPhonu z číselníku (iphone_vyber.js): model, paměť, barva, stav – zařazení na e-shop rovnou při zápisu */
.iv-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 14px;align-items:end;margin-top:10px;}
.iv-g label.fld{margin:0 0 5px;}
.iv-g select{width:100%;}
.iv-pozn{font-size:.85em;margin:6px 0 0;}

/* ---------- lišta akcí zakázky: hlavní akce, nabídky, storno stranou ---------- */
#status-actions{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px;}
#status-actions:empty{display:none;}
.am-wrap{position:relative;display:inline-flex;}
.am-btn{display:inline-flex;align-items:center;gap:6px;}
.am-sipka{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .12s;}
.am-btn[aria-expanded="true"] .am-sipka{transform:rotate(180deg);}
.am-menu{position:absolute;left:0;bottom:calc(100% + 8px);z-index:60;width:320px;max-width:calc(100vw - 32px);padding:6px;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-md);box-shadow:0 10px 30px rgba(0,0,0,.28);}
.am-menu[hidden]{display:none;}
.am-item{display:block;width:100%;padding:9px 11px;text-align:left;background:transparent;border:0;border-radius:var(--radius-sm);color:var(--ink);cursor:pointer;}
.am-item:hover,.am-item:focus-visible{background:var(--surface-2,rgba(127,127,127,.14));}
.am-item strong{display:block;font-size:var(--text-sm-size);font-weight:var(--fw-semibold);}
.am-item span{display:block;margin-top:2px;font-size:var(--text-xs-size);line-height:1.35;color:var(--muted);}
.am-info{font-size:var(--text-sm-size);margin:0 4px;}
.am-storno{margin-left:10px;padding:8px 10px;background:transparent;border:0;color:var(--err-text);font-size:var(--text-sm-size);cursor:pointer;}
.am-storno:hover{text-decoration:underline;}
@media (max-width:640px){
  .am-storno{margin-left:0;}
  .am-wrap{position:static;}
  .am-menu{left:16px;right:16px;width:auto;max-width:none;bottom:calc(100% + 4px);}
}

/* Seznam oprav: v užším okně zůstane cena vidět i při posunu tabulky do strany */
@media (min-width:641px) and (max-width:1400px){
  table.grid .col-celkem{position:sticky;right:0;background:var(--surface);border-left:1px solid var(--border);}
  table.grid th.col-celkem{background:var(--surface-sunken);}
}
