/* =====================================================================
   v3.32.0 BIZNISTAN BRAND LAYER for the Hub (staff app).
   Loaded after bizniya-theme.css (kit, unchanged) and hub.css. Points the Hub's own tokens at the
   --bz-* brand tokens, so every existing screen takes the Navy & Marigold look without touching
   its markup or logic, and restyles the shell (sidebar, top bar, phone bottom menu).
   ===================================================================== */
:root{
  --bg:var(--bz-bg); --surface:var(--bz-surface); --surface-2:var(--bz-navy-50); --border:var(--bz-border); --line:var(--bz-border);
  --ink:var(--bz-ink); --text:var(--bz-text); --muted:var(--bz-text-muted);
  --side:var(--bz-primary); --side-2:rgba(255,255,255,.08); --side-text:rgba(255,255,255,.8); --side-label:rgba(255,255,255,.6);
  --brand:var(--bz-primary); --brand-600:var(--bz-primary-hover); --brand-50:var(--bz-tint); --brand-100:var(--bz-navy-200);
  --ok:var(--bz-success); --ok-50:var(--bz-success-bg); --warn:var(--bz-warning); --warn-50:var(--bz-warning-bg);
  --bad:var(--bz-danger); --bad-50:var(--bz-danger-bg); --info:var(--bz-info); --info-50:var(--bz-info-bg);
  --radius:var(--bz-radius-xl); --radius-sm:var(--bz-radius-md);
  --shadow:var(--bz-shadow-sm);
  --font-head:var(--bz-font); --font-body:var(--bz-font);
}
body.hub.bz-app{font:400 15px/1.5 var(--bz-font);color:var(--bz-text);background:var(--bz-bg)}
.hub h1,.hub h2,.hub h3,.hub h4{font-family:var(--bz-font);font-weight:800;letter-spacing:-.01em}
.hub .money,.hub .num,.hub .tile strong,.hub td.num{font-variant-numeric:tabular-nums}

/* ---------------- sidebar: navy, reversed logo, marigold bar on the open page ---------------- */
.hub-side{width:var(--bz-sidebar-w);padding:22px 14px;background:var(--bz-primary)}
.hub-brand{padding:4px 10px 20px;display:block}
.hub-brand .bz-wordmark{display:block;height:40px;width:auto;max-width:100%}
.hub-brand small{display:block;margin-top:10px;color:rgba(255,255,255,.75);font-size:12px;font-weight:600;letter-spacing:.2px}
#hubNav .nav-h{font-size:11px;font-weight:700;letter-spacing:.08em;color:rgba(255,255,255,.6);padding:16px 12px 6px}
#hubNav a{min-height:44px;padding:0 12px;border-radius:var(--bz-radius-md);color:rgba(255,255,255,.8);font-weight:600}
#hubNav a:hover{background:rgba(255,255,255,.08);color:#fff}
#hubNav a.on,#hubNav a[aria-current="page"]{background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 3px 0 0 var(--bz-accent)}
#hubNav a .badge{background:var(--bz-accent);color:var(--bz-on-accent);font-weight:800}
#hubNav a .soon{color:rgba(255,255,255,.6);border-color:rgba(255,255,255,.22)}
#hubNav a.ext{color:var(--bz-marigold-300)}
.hub-me{background:transparent;border-top:1px solid rgba(255,255,255,.12);border-radius:0;padding:16px 12px 4px;margin-top:10px}
.hub-me a{color:var(--bz-marigold-300)}
.hub-me button{border-color:rgba(255,255,255,.22);color:#fff}

/* ---------------- main + top bar ---------------- */
.hub-main{margin-left:var(--bz-sidebar-w)}
.hub-top{min-height:var(--bz-topbar-h);padding:12px 28px;background:rgba(247,246,242,.92);border-bottom:1px solid var(--bz-border)}
.hub-top h1{font:800 20px var(--bz-font);letter-spacing:-.02em;color:var(--bz-ink)}
.hub-top .bz-topmark{display:none;width:24px;height:auto}
.hub-top-co{border-radius:var(--bz-radius-pill,999px);font-weight:700}
.hub-top-co i{background:var(--bz-primary);border-radius:50%}
.hub-content{padding:24px 28px 64px;max-width:1440px}

/* ---------------- buttons, fields, cards, tabs, chips → Biznistan rules ---------------- */
.btn{min-height:40px;border-radius:var(--bz-radius-md);border:1.5px solid var(--bz-primary);color:var(--bz-primary);font-weight:700;font-size:14px}
.btn:hover{background:var(--bz-tint);border-color:var(--bz-primary)}
.btn.pri{background:var(--bz-primary);border-color:var(--bz-primary);color:#fff;box-shadow:none}.btn.pri:hover{background:var(--bz-primary-hover)}
.btn.accent{background:var(--bz-accent);border-color:var(--bz-accent);color:var(--bz-on-accent)}.btn.accent:hover{background:var(--bz-accent-hover)}
.btn.danger{color:var(--bz-danger);border-color:var(--bz-danger-border)}
.btn.sm{min-height:34px;font-size:13px;border-radius:var(--bz-radius-sm)}
.f-grid input,.f-grid select,.f-grid textarea,.f input,.f select,.f textarea,.h-tools input[type=search],.h-tools select{min-height:44px;border:1.5px solid var(--bz-border-strong);border-radius:var(--bz-radius-md)}
.f-grid input:focus,.f-grid select:focus,.f-grid textarea:focus,.f input:focus,.f select:focus,.f textarea:focus,.h-tools input:focus,.h-tools select:focus{outline:none;border-color:var(--bz-primary);box-shadow:0 0 0 3px var(--bz-navy-200)}
.h-card,.tile{border-radius:var(--bz-radius-xl);box-shadow:var(--bz-shadow-sm)}
.tile strong{font:800 28px var(--bz-font);letter-spacing:-.02em}
.o-tabs button.on,.seg button.on{background:var(--bz-primary)}
.o-tabs button.on b{color:var(--bz-marigold-300)}
.o-kind button.on,.dz-tabs a.on,.ci-views button.on{color:var(--bz-ink);border-bottom-color:var(--bz-accent)}
.o-subrow button.on{color:var(--bz-ink);border-bottom-color:var(--bz-accent)}
.chip.mute{background:var(--bz-neutral-bg);color:var(--bz-neutral)}
.chip.info{background:var(--bz-info-bg);color:var(--bz-info)}
.t thead th{background:var(--bz-navy-50);font-size:12px;font-weight:700;letter-spacing:.04em}
.modal .box{border-radius:var(--bz-radius-xl)}

/* ---------------- dashboard (v3.32.0 layout from the kit) ---------------- */
.bz-dash{display:flex;flex-direction:column;gap:24px}
.bz-dash .bz-kpi a{color:inherit}
.bz-dash .bz-kpi{text-decoration:none;min-width:0}
.bz-dash .bz-kpi--hero .bz-kpi__value.neg{color:#FFB4B4}
.bz-dash .seg{background:var(--bz-surface)}
.bz-dash .bz-card{padding:20px;box-shadow:var(--bz-shadow-sm)}
.bz-dash .bz-card__head a{font-size:13px;font-weight:700;color:var(--bz-ink)}
.bz-dash .bz-card__sub{font-size:12.5px;color:var(--bz-text-muted);margin:-10px 0 14px}
.bz-dash .att{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--bz-border);color:var(--bz-ink);text-decoration:none;font-size:14px}
.bz-dash .att:last-of-type{border-bottom:0}
.bz-dash .bz-empty{padding:18px 10px}
.bz-dash .bz-empty__icon img{width:30px;height:auto}
.bz-dash .bz-table td small{display:block;font-size:12px;color:var(--bz-text-muted);font-weight:500}
.bz-dash .bz-table tr[data-o]{cursor:pointer}
.bz-dash a.bz-kpi{transition:box-shadow .15s ease,transform .15s ease}
.bz-dash a.bz-kpi:hover{box-shadow:var(--bz-shadow-md,0 6px 18px rgba(22,33,62,.12));transform:translateY(-1px)}
.bz-dash a.bz-kpi:focus-visible{outline:3px solid var(--bz-accent);outline-offset:2px}
.bz-dash .bz-delta{font-weight:800}
.bz-dash .bz-delta.up{color:var(--bz-success)} .bz-dash .bz-delta.down{color:var(--bz-danger)} .bz-dash .bz-delta.flat{color:var(--bz-text-muted)}
.bz-dash .bz-kpi--hero .bz-delta.up{color:#9BE3BC} .bz-dash .bz-kpi--hero .bz-delta.down{color:#FFB4B4}
.bz-dash .bz-page-actions{align-items:center}
.bz-dash .bz-page-title{margin:0;font-size:26px;color:var(--bz-ink)}
.bz-dash .bars{width:100%;height:auto;display:block}
.bz-dash .bz-table td.money.neg{color:var(--bz-danger)}
.bz-dash .bz-table td .bz-empty{white-space:normal}

/* ---------------- phone (≤ 900px): sidebar slides in from "More", bottom menu ---------------- */
.bz-bottomnav{display:none}
@media (max-width:900px){
  .hub-side{transform:translateX(-100%);transition:transform .2s ease;width:280px}
  .hub-side.open{transform:none;box-shadow:12px 0 40px rgba(0,0,0,.25)}
  .hub-scrim.open{display:block;position:fixed;inset:0;background:rgba(11,18,38,.45);z-index:30}
  .hub-main{margin-left:0}
  .hub-menu{display:none!important}
  .hub-top{padding:10px 16px;min-height:56px}
  .hub-top .bz-topmark{display:block}
  .hub-top h1{font-size:18px}
  .hub-top-co{display:none}
  .hub-content{padding:16px 16px 100px}
  .bz-bottomnav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:35;background:var(--bz-surface);border-top:1px solid var(--bz-border);padding:6px 4px calc(8px + env(safe-area-inset-bottom))}
  .bz-bottomnav a,.bz-bottomnav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:48px;font:600 11px var(--bz-font);color:#5B6170;text-decoration:none;background:none;border:0;cursor:pointer;position:relative}
  .bz-bottomnav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .bz-bottomnav [aria-current="page"]{color:var(--bz-ink);font-weight:800}
  .bz-bottomnav .bz-bn-badge{position:absolute;top:2px;left:calc(50% + 6px);background:var(--bz-accent);color:var(--bz-on-accent);font-size:10px;font-weight:800;border-radius:999px;padding:0 5px;line-height:16px}
}

/* ---------------- staff sign-in (v3.34.0: bz-auth card on Paper) ---------------- */
.hub-login{margin:0;font:400 15px/1.5 var(--bz-font);color:var(--bz-text);background:var(--bz-bg)}
.hub-login .bz-auth__logo{align-self:center;height:44px;width:auto;max-width:100%}
.hub-login .bz-auth__head{text-align:center}
.hub-login .bz-auth__head h1{margin:0;font:800 22px var(--bz-font);color:var(--bz-ink);letter-spacing:-.01em}
.hub-login .bz-auth__head p{margin:6px 0 0;font-size:13.5px;color:var(--bz-text-muted)}
.hub-login form{display:flex;flex-direction:column;gap:16px;margin:0}
.hub-login .password-wrap{padding-right:6px}
.hub-login .password-wrap button{border:0;background:none;font:700 13px var(--bz-font);color:var(--bz-ink);min-height:36px;padding:0 10px;border-radius:var(--bz-radius-sm);cursor:pointer}
.hub-login .password-wrap button:hover{background:var(--bz-tint)}
.hub-login .login-field{display:flex;flex-direction:column;gap:6px}
.hub-login .login-field>span{font-size:13px;font-weight:700;color:var(--bz-ink)}
.hub-login .login-field>input{width:100%;min-height:44px;padding:10px 14px;border:1.5px solid var(--bz-border-strong);border-radius:var(--bz-radius-md);font:inherit;color:var(--bz-ink);background:var(--bz-surface);box-sizing:border-box}
.hub-login .login-field>input:focus{outline:none;border-color:var(--bz-primary);box-shadow:0 0 0 3px var(--bz-navy-200)}
.hub-login .primary-button{width:100%;min-height:52px;border:0;border-radius:var(--bz-radius-md);background:var(--bz-primary);color:#fff;font:700 16px var(--bz-font);cursor:pointer}
.hub-login .primary-button:hover{background:var(--bz-primary-hover)}
.hub-login .primary-button:disabled{opacity:.6;cursor:wait}
.hub-login .primary-button:focus-visible,.hub-login .link-button:focus-visible,.hub-login a:focus-visible{outline:3px solid var(--bz-accent);outline-offset:2px}
.hub-login .login-message{margin:0;font-size:13.5px;font-weight:600;min-height:0}
.hub-login .login-message:empty{display:none}
.hub-login .login-message{padding:10px 12px;border-radius:var(--bz-radius-md);background:var(--bz-danger-bg);color:var(--bz-danger);border:1px solid var(--bz-danger-border)}
.hub-login .login-message.success{background:var(--bz-success-bg);color:var(--bz-success);border-color:var(--bz-success-border)}
.hub-login .two-step-note{font-size:13.5px;line-height:1.6;margin:0;color:var(--bz-text)}
.hub-login .two-step-links{font-size:13px;margin:0;text-align:center;color:var(--bz-text-muted)}
.hub-login .link-button{border:0;background:none;color:var(--bz-ink);font:700 13px var(--bz-font);cursor:pointer;padding:4px 2px;text-decoration:underline}
.hub-login #two-step-code{letter-spacing:8px;font-size:20px;font-weight:800;text-align:center}
.hub-login .bz-auth__tagline{margin:0;text-align:center;font-size:13px;color:var(--bz-text-muted)}
.hub-login .hub-login-note{margin:0;padding-top:14px;border-top:1px solid var(--bz-border);text-align:center;font-size:13px;color:var(--bz-text-muted)}
.hub-login .hub-login-note a{color:var(--bz-ink);font-weight:700}
@media (max-width:480px){.hub-login .bz-auth{padding:16px;align-items:flex-start;padding-top:40px}.hub-login .bz-auth__card{padding:24px 20px}}

/* =====================================================================
   v3.34.0 COMPONENT LAYER for every Hub page (Orders, forms, tables, store pages, chat).
   ".hub" prefix on purpose: hub.css has ".hub button{font:inherit}", which beat the plain ".btn" rule above
   and left buttons at 400 weight. Markup and behaviour unchanged.
   ===================================================================== */
/* buttons: kit sizes (44px, 36px small), 700 weight, navy outline / navy fill / marigold accent */
.hub .btn{min-height:44px;padding:0 18px;font:700 14px/1 var(--bz-font);border:1.5px solid var(--bz-primary);border-radius:var(--bz-radius-md);color:var(--bz-primary);background:var(--bz-surface);box-shadow:none}
.hub .btn:hover{background:var(--bz-tint);border-color:var(--bz-primary)}
.hub .btn.pri{background:var(--bz-primary);color:#fff}.hub .btn.pri:hover{background:var(--bz-primary-hover)}
.hub .btn.accent{background:var(--bz-accent);border-color:var(--bz-accent);color:var(--bz-on-accent)}
.hub .btn.danger{color:var(--bz-danger);border-color:var(--bz-danger-border);background:var(--bz-surface)}.hub .btn.danger:hover{background:var(--bz-danger-bg)}
.hub .btn.sm{min-height:36px;padding:0 12px;font-size:13px;border-radius:var(--bz-radius-sm)}
.hub .btn:focus-visible,.hub button:focus-visible,.hub a:focus-visible,.hub [tabindex]:focus-visible{outline:3px solid var(--bz-accent);outline-offset:2px}
.hub .btn[disabled]{opacity:.45;cursor:not-allowed}

/* fields: 44px, 1.5px border, navy focus ring; labels ink 13px bold like bz-label */
.hub input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]),.hub select,.hub textarea{font-family:var(--bz-font);color:var(--bz-ink)}
.hub .f-grid input,.hub .f-grid select,.hub .f-grid textarea,.hub .f input,.hub .f select,.hub .f textarea,.hub .h-tools input,.hub .h-tools select,.hub .h-sel,.hub .o-bulk select,
.hub .ci-filters select,.hub .ci-filters input[type=search],.hub .ci-filters input[type=date],.hub .ci-tools select{min-height:44px;padding:0 14px;border:1.5px solid var(--bz-border-strong);border-radius:var(--bz-radius-md);background:var(--bz-surface);font-size:15px}
.hub .f-grid textarea,.hub .f textarea{padding:10px 14px;min-height:88px}
.hub .h-sel,.hub .o-bulk select{min-height:40px;font-size:14px}
.hub input:focus,.hub select:focus,.hub textarea:focus{outline:none;border-color:var(--bz-primary)!important;box-shadow:0 0 0 3px var(--bz-navy-200)}
.hub .f-grid label,.hub .f label{font-size:13px;font-weight:700;color:var(--bz-ink);gap:6px}
.hub .f-grid label small,.hub .f label small,.hub .f label em,.hub .hint{font-size:12px;font-weight:500;color:var(--bz-text-muted)}
.hub [aria-invalid="true"]{border-color:var(--bz-danger)!important}
.hub .msg{font-weight:700}.hub .msg.bad{color:var(--bz-danger)}.hub .msg.ok,.hub .msg:not(.bad){color:var(--bz-success)}

/* status chips → bz-badge (pill, border, dot) */
.hub .chip,.hub .pill.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.5;border:1px solid var(--bz-neutral-border);background:var(--bz-neutral-bg);color:var(--bz-neutral)}
.hub .chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.hub .chip.ok{background:var(--bz-success-bg);color:var(--bz-success);border-color:var(--bz-success-border)}
.hub .chip.warn{background:var(--bz-warning-bg);color:var(--bz-warning);border-color:var(--bz-warning-border)}
.hub .chip.bad{background:var(--bz-danger-bg);color:var(--bz-danger);border-color:var(--bz-danger-border)}
.hub .chip.info{background:var(--bz-info-bg);color:var(--bz-info);border-color:var(--bz-info-border)}
.hub .chip.mute{background:var(--bz-neutral-bg);color:var(--bz-neutral);border-color:var(--bz-neutral-border)}

/* notices → bz-alert */
.hub .notice{border-radius:var(--bz-radius-lg);padding:14px 16px;font-size:14px;line-height:1.55;color:var(--bz-ink);border:1px solid var(--bz-info-border);background:var(--bz-info-bg)}
.hub .notice b,.hub .notice strong{font-weight:800}
.hub .notice.warn{background:var(--bz-warning-bg);border-color:var(--bz-warning-border);color:var(--bz-ink)}
.hub .notice.ok{background:var(--bz-success-bg);border-color:var(--bz-success-border);color:var(--bz-ink)}
.hub .notice.bad{background:var(--bz-danger-bg);border-color:var(--bz-danger-border);color:var(--bz-ink)}
.hub .notice .btn{min-height:36px;font-size:13px}

/* tables → bz-table */
.hub .t-wrap{background:var(--bz-surface);border:1px solid var(--bz-border);border-radius:var(--bz-radius-xl);box-shadow:none}
.hub .t{font-size:14px}
.hub .t th{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--bz-text-muted);background:var(--bz-navy-50);padding:12px 16px;border-bottom:1px solid var(--bz-border)}
.hub .t td{padding:14px 16px;border-bottom:1px solid var(--bz-border);color:var(--bz-ink)}
.hub .t tbody tr:hover{background:var(--bz-navy-50)}
.hub .t td.num,.hub .t th.num{text-align:right;font-variant-numeric:tabular-nums}
.hub .t td small{color:var(--bz-text-muted);font-weight:500}
.hub .t .neg,.hub .neg{color:var(--bz-danger)}

/* empty text → muted, centred like bz-empty (one sentence) */
.hub .empty{color:var(--bz-text-muted);font-size:14px;padding:18px 8px;text-align:center}
.hub td.empty{padding:28px 16px}

/* cards */
.hub .h-card,.hub .oc,.hub .och-card,.hub .ost-card,.hub .ch-card,.hub .cn-card,.hub .cr-card,.hub .dz-store,.hub .rt-card{border:1px solid var(--bz-border);border-radius:var(--bz-radius-xl);box-shadow:var(--bz-shadow-sm);background:var(--bz-surface)}
.hub .card-h h3,.hub .h-card h3{font-weight:800;color:var(--bz-ink)}
.hub .card-h .ico{background:var(--bz-tint);color:var(--bz-primary)}
.hub .och-card.on,.hub .ost-card.on,.hub .och-card[aria-pressed="true"]{border-color:var(--bz-primary);box-shadow:0 0 0 2px var(--bz-primary)}
.hub .h-intro{color:var(--bz-text-muted);font-size:14.5px}

/* tabs, first line → bz-tabs (underline, marigold bar, count pill) */
.hub .o-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:2px;background:none;border:0;border-bottom:1px solid var(--bz-border);border-radius:0;padding:0;margin-bottom:16px;scrollbar-width:thin}
.hub .o-tabs button{flex:none;min-height:44px;padding:0 14px;border-radius:0;border-bottom:3px solid transparent;margin-bottom:-1px;font:600 14px var(--bz-font);color:var(--bz-text-muted);white-space:nowrap;display:inline-flex;align-items:center;gap:8px;background:none}
.hub .o-tabs button:hover{color:var(--bz-ink)}
.hub .o-tabs button b{margin:0;font-size:11px;font-weight:800;background:var(--bz-tint);color:var(--bz-ink);padding:1px 7px;border-radius:999px}
.hub .o-tabs button.on{background:none;color:var(--bz-ink);font-weight:800;border-bottom-color:var(--bz-accent)}
.hub .o-tabs button.on b{background:var(--bz-primary);color:#fff}
.hub .o-tabs button.has-nest{border-radius:0}
.hub .o-tabs:has(+ .o-subrow){margin-bottom:0}
/* second line (the section inside a tab) → pills directly under the open tab */
.hub .o-subrow{display:flex;gap:8px;flex-wrap:wrap;width:auto;margin:0 0 16px;padding:10px 0 0 14px;background:none;border:0;border-radius:0;position:relative}
.hub .o-subrow::before{content:"";position:absolute;left:4px;top:0;bottom:8px;width:2px;background:var(--bz-accent);border-radius:2px}
.hub .o-subrow button{min-height:36px;padding:0 12px;border:1px solid var(--bz-border);border-radius:999px;background:var(--bz-surface);font:700 13px var(--bz-font);color:var(--bz-ink);display:inline-flex;align-items:center;gap:6px}
.hub .o-subrow button b{margin:0;font-size:11px;font-weight:800;color:var(--bz-text-muted)}
.hub .o-subrow button.on{background:var(--bz-primary);border-color:var(--bz-primary);color:#fff}
.hub .o-subrow button.on b{color:var(--bz-marigold-300)}
.hub .o-tabs.o-sub{border-bottom:0;margin:0 0 16px;gap:8px;padding-left:14px}
.hub .o-tabs.o-sub button{min-height:36px;border:1px solid var(--bz-border);border-radius:999px;margin:0;font-size:13px;color:var(--bz-ink);background:var(--bz-surface)}
.hub .o-tabs.o-sub button.on{background:var(--bz-primary);border-color:var(--bz-primary);color:#fff;box-shadow:none}
/* other underline tab rows */
.hub .o-kind button,.hub .dz-tabs a,.hub .ci-views button{font-family:var(--bz-font);min-height:44px}
.hub .o-kind button.on,.hub .dz-tabs a.on,.hub .ci-views button.on{color:var(--bz-ink);font-weight:800;border-bottom-color:var(--bz-accent)}
.hub .o-kind button b,.hub .ci-views button b{font-size:11px;font-weight:800;background:var(--bz-tint);color:var(--bz-ink);padding:1px 7px;border-radius:999px}
/* period / small segmented switches */
.hub .seg{border:1px solid var(--bz-border);border-radius:var(--bz-radius-md);background:var(--bz-surface)}
.hub .seg button{min-height:36px;font:600 13px var(--bz-font);border-radius:var(--bz-radius-sm)}
.hub .seg button.on{background:var(--bz-primary);color:#fff;font-weight:700}

/* modal */
.hub .modal{background:rgba(11,18,38,.5)}
.hub .modal .box{border-radius:var(--bz-radius-2xl);box-shadow:var(--bz-shadow-lg);padding:28px}
.hub .modal h3{font:800 20px var(--bz-font);color:var(--bz-ink)}
.hub .modal .acts{gap:10px}
@media (max-width:560px){.hub .modal{place-items:end center;padding:0}.hub .modal .box{border-radius:var(--bz-radius-2xl) var(--bz-radius-2xl) 0 0;max-height:94vh;padding:22px 16px calc(22px + env(safe-area-inset-bottom))}.hub .modal .acts .btn{flex:1}}

/* links inside content */
.hub .link,.hub .link-button{color:var(--bz-ink)!important;font-weight:700}
/* v3.34.0 fixes after the first look */
.hub input,.hub select,.hub textarea{font-weight:500}
.hub .h-tools{gap:8px}
.hub .h-tools .btn{padding:0 14px}
.hub .h-tools input[type=date]{width:150px;padding:0 10px;min-width:0}
.hub .h-tools input[type=search]{min-width:180px}
.hub .h-card>h3:first-child,.hub .h-card>h2:first-child{margin-top:0;margin-bottom:12px}
@media (max-width:900px){
  .hub table.t.stack td{padding:5px 14px;align-items:baseline}
  .hub table.t.stack td::before{margin-right:auto;font-weight:600;color:var(--bz-text-muted)}
  .hub table.t.stack td>small{margin-left:4px}
  .hub table.t.stack td.first{padding-top:12px;font-weight:800;color:var(--bz-ink)}
  .hub table.t.stack tr{padding:4px 0 10px}
  .hub .o-tabs{margin-left:-16px;margin-right:-16px;padding:0 8px}
}

/* v3.36.0 staff form: tick one or more roles */
.hub .st-roles{border:1.5px solid var(--bz-border-strong);border-radius:var(--bz-radius-md);padding:6px 12px 10px;margin:0;display:grid;gap:2px}
.hub .st-roles legend{font-size:13px;font-weight:700;color:var(--bz-ink);padding:0 4px}
.hub .st-roles legend em{font-style:normal;font-weight:500;color:var(--bz-text-muted);margin-left:4px}
.hub .modal .f .st-role,.hub .st-role{display:flex!important;grid-template-columns:none;align-items:flex-start;gap:12px;min-height:44px;padding:8px 4px;border-bottom:1px solid var(--bz-border);cursor:pointer;font-weight:500}
.hub .modal .f .st-role:last-child,.hub .st-role:last-child{border-bottom:0}
.hub .st-role input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--bz-primary);flex:none}
.hub .st-role b{display:block;font-size:14px;color:var(--bz-ink)}
.hub .st-role small{display:block;font-size:12.5px;color:var(--bz-text-muted);font-weight:500}

/* v3.38.0 printer mark: this order's Daraz label has been printed */
.hub .oc-st{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.hub .oc-printed{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--bz-tint);color:var(--bz-primary);border:1px solid var(--bz-navy-200);flex:none}
.hub .oc-printed svg{width:16px;height:16px}
/* selection bar */
.hub .o-bulk{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;margin:0 0 6px;background:var(--bz-surface);border:1px solid var(--bz-border);border-radius:var(--bz-radius-lg)}
.hub .o-bulk label{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--bz-ink);min-height:44px}
.hub .o-bulk input[type=checkbox],.hub .oc-sel input{width:20px;height:20px;accent-color:var(--bz-primary)}
.hub .o-bulk #oSelN{font-weight:800;color:var(--bz-ink)}
.hub .o-bulk small{flex-basis:100%;color:var(--bz-text-muted);font-size:12.5px}
.hub .oc-sel{display:inline-flex;align-items:center;min-width:32px;min-height:32px;cursor:pointer}

/* v3.40.0 product type: Single / Kit / Combo */
.hub .mk-kind{display:inline-flex;gap:6px;flex-wrap:wrap}
.hub .mk-kind .btn{min-height:32px;padding:0 10px}
.hub .mk-ask-card{border-color:var(--bz-accent);box-shadow:0 0 0 2px var(--bz-marigold-200)}
.hub .mk-ask .btn{margin-left:6px}

/* v3.42.0 Stock */
.hub .st-kpis{margin-bottom:16px}
.hub .st-table td.num strong{font-weight:800;color:var(--bz-ink)}
.hub .ci-items-chk{margin:4px 0 8px}
.hub .ci-items-chk input{width:72px;min-height:40px;text-align:right}
.hub .ci-items-chk td small{display:block;color:var(--bz-text-muted)}

/* =====================================================================
   v3.44.0 COMPACT DATA (owner, 21 Oct 2026): screens with many rows and numbers use a smaller font and tighter rows
   and tabs, so most items fit on one screen — still readable (13px text, 12px secondary, 36px+ touch targets).
   ===================================================================== */
.hub .h-intro{font-size:13.5px;line-height:1.55;margin:2px 0 14px}
.hub .t{font-size:13px}
.hub .t th{font-size:11px;padding:8px 12px;letter-spacing:.05em}
.hub .t td{padding:7px 12px;line-height:1.35}
.hub .t td small,.hub .t td .is-sub{font-size:11.5px;line-height:1.3}
.hub .t td.num,.hub .t th.num{white-space:nowrap}
.hub .t .t-acts{gap:4px;flex-wrap:nowrap}
.hub .t .btn.sm,.hub .t-acts .btn.sm{min-height:30px;padding:0 9px;font-size:12px;border-radius:8px;border-width:1.25px}
.hub .t .chip{font-size:11px;padding:2px 8px}
.hub .t .chip::before{width:5px;height:5px}
/* tabs: narrower and smaller */
.hub .o-tabs{margin-bottom:12px}
.hub .o-tabs button{min-height:38px;padding:0 10px;font-size:13px;gap:6px}
.hub .o-tabs button b{font-size:10.5px;padding:0 6px}
.hub .o-subrow{gap:6px;margin-bottom:12px;padding-top:8px}
.hub .o-subrow button{min-height:30px;padding:0 10px;font-size:12px}
.hub .o-subrow button b{font-size:10.5px}
.hub .dz-tabs a,.hub .o-kind button{min-height:38px;padding:8px 11px;font-size:13px}
/* KPI cards on data screens */
.hub .mk-kpis .bz-kpi,.hub .st-kpis .bz-kpi{padding:12px 14px;gap:2px}
.hub .mk-kpis .bz-kpi__value,.hub .st-kpis .bz-kpi__value{font-size:20px}
.hub .mk-kpis .bz-kpi__label,.hub .st-kpis .bz-kpi__label{font-size:11.5px}
.hub .mk-kpis .bz-kpi__meta,.hub .st-kpis .bz-kpi__meta{font-size:11.5px}
.hub .mk-kpis,.hub .st-kpis{gap:10px;margin-bottom:12px}
/* toolbars */
.hub .h-tools{margin-bottom:10px}
.hub .h-tools input[type=search],.hub .h-tools select{height:38px;min-height:38px;font-size:13.5px}
.hub .h-tools .btn{min-height:38px;font-size:13px}
.hub .mk-kind .btn{min-height:28px;padding:0 8px;font-size:11.5px}
/* phones: stacked rows stay compact */
@media (max-width:900px){
  .hub table.t.stack td{padding:3px 12px;font-size:13px}
  .hub table.t.stack td.first{padding-top:9px}
  .hub table.t.stack tr{padding:2px 0 8px}
  .hub .t .t-acts{flex-wrap:wrap}
}

/* v3.45.0 stock dashboard, purchase orders, ledger */
.hub .st-dash{margin-bottom:12px;gap:12px}
.hub .st-dash .bz-card{padding:14px}
.hub .st-dash .bz-card__head{margin-bottom:8px}
.hub .st-dash .bz-card__title{font-size:14.5px;display:flex;align-items:center;gap:8px}
.hub .st-code{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
.hub .st-code a{color:var(--bz-ink)}
.hub .st-onorder{color:var(--bz-info)!important;font-weight:600}
.hub .st-sup select{min-width:260px}
.hub .st-qty{width:96px;min-height:34px!important;padding:0 8px!important;text-align:right;font-size:13px!important}
.hub .st-unit{min-height:34px!important;padding:0 6px!important;font-size:13px!important}
.hub .st-po-acts{margin-top:10px;gap:8px;flex-wrap:wrap}
.hub .st-po-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-start}
.hub .st-slip{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.hub .st-lh{max-width:100%;max-height:360px;border:1px solid var(--bz-border);border-radius:8px;margin-top:8px}
.hub .st-lg-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px;margin-bottom:10px}
.hub .st-lg-bal{text-align:right}.hub .st-lg-bal span{display:block;font-size:11.5px;color:var(--bz-text-muted)}.hub .st-lg-bal strong{font-size:20px;color:var(--bz-ink)}
.hub .st-dash .bz-card__sub{font-size:12.5px;margin:-4px 0 8px}

/* v3.46.0 stock to Daraz */
.hub .ds-head { display: flex; gap: 12px 20px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; margin: 10px 0 4px; }
.hub .ds-head .sub { flex: 1 1 420px; font-size: 12.5px; }
.hub .ds-head .btn.sm { margin-left: 6px; vertical-align: baseline; }
.hub .ds-auto { display: inline-flex; gap: 8px; align-items: center; font-weight: 600; font-size: 13px; white-space: nowrap; padding: 6px 10px; border: 1px solid var(--line, #e3e6ee); border-radius: 10px; background: var(--card, #fff); }
.hub .ds-auto small { font-weight: 500; color: var(--mute, #6b7280); }
.hub .ds-t td small, .hub .ds-t td .chip + small { display: block; }
.hub .ds-new { color: var(--bz-primary, #2b59c3); }
.hub .t th.ck, .hub .t td.ck { width: 34px; text-align: center; }
.hub .ds-sum .tile strong.neg { color: var(--bad, #c0392b); }
.hub .ds-sum { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
.hub .ds-sum .tile { padding: 10px 12px; min-height: 0; }
.hub .ds-sum .tile strong { font-size: 20px; margin-top: 2px; }

/* v3.48.0 Daraz Finance & Profit */
.hub .f-tools { margin: 10px 0 6px; align-items: center; }
.hub .f-kpi { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.hub .f-kpi .tile { padding: 10px 12px; min-height: 0; }
.hub .f-kpi .tile strong { font-size: 20px; margin-top: 2px; }
.hub .f-kpi .tile.hl-ok strong { color: var(--ok, #1e7b4f); }
.hub .t tr.tot td { border-top: 2px solid var(--line, #e3e6ee); }
.hub .t td.pos { color: var(--ok, #1e7b4f); }

/* v3.49.0 WhatsApp dispatch message */
.hub .linkbtn { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; color: var(--bz-primary, #2b59c3); text-decoration: underline; cursor: pointer; }
.hub .wa-hint { display: inline; color: var(--mute, #6b7280); font-size: 12px; }
.hub .wa-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 4px 12px; }
.hub #waT { width: 100%; font: inherit; font-size: 13px; line-height: 1.45; }

/* v3.50.0 Daraz reviews */
.hub .rv-stars { color: var(--bz-accent, #F5A524); letter-spacing: 1px; white-space: nowrap; font-size: 15px; }
.hub .rv-stars i { font-style: normal; color: var(--line, #d9dde6); }
.hub .rv-head { display: grid; grid-template-columns: auto minmax(200px, 1fr) auto; gap: 14px 24px; align-items: center; margin: 12px 0; padding: 12px 14px; border: 1px solid var(--line, #e3e6ee); border-radius: 12px; background: var(--card, #fff); }
.hub .rv-avg { display: grid; justify-items: start; gap: 2px; }
.hub .rv-avg strong { font-size: 28px; line-height: 1; }
.hub .rv-avg small, .hub .rv-side small { color: var(--mute, #6b7280); font-size: 12px; }
.hub .rv-side { display: grid; justify-items: end; gap: 4px; }
.hub .rv-bars { display: grid; gap: 3px; }
.hub .rv-bars button { display: grid; grid-template-columns: 34px 1fr 32px; gap: 8px; align-items: center; background: none; border: 0; padding: 2px 4px; border-radius: 6px; cursor: pointer; font: inherit; font-size: 12px; color: inherit; }
.hub .rv-bars button.on { background: var(--bz-primary-soft, #eef2fb); font-weight: 700; }
.hub .rv-bars i { height: 7px; border-radius: 4px; background: var(--line, #e9ecf2); overflow: hidden; display: block; }
.hub .rv-bars i b { display: block; height: 100%; background: var(--bz-accent, #F5A524); }
.hub .rv-bars em { font-style: normal; text-align: right; color: var(--mute, #6b7280); }
.hub .rv-list { display: grid; gap: 10px; }
.hub .rv-card { border: 1px solid var(--line, #e3e6ee); border-radius: 12px; padding: 12px 14px; background: var(--card, #fff); }
.hub .rv-card.low { border-left: 4px solid var(--bad, #c0392b); }
.hub .rv-card header { display: flex; gap: 10px; align-items: center; }
.hub .rv-card header img, .hub .rv-card header .rt-ph { width: 40px; height: 40px; border-radius: 8px; object-fit: cover; flex: none; }
.hub .rv-card header .pr-h { flex: 1; min-width: 0; }
.hub .rv-text { margin: 8px 0; font-size: 14px; white-space: pre-wrap; }
.hub .rv-imgs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.hub .rv-imgs img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; }
.hub .rv-reply { background: var(--bz-primary-soft, #f3f5fa); border-radius: 8px; padding: 8px 10px; font-size: 13px; }
.hub .rv-reply p { margin: 4px 0 0; white-space: pre-wrap; }
.hub .rv-box { display: grid; grid-template-columns: 1fr auto; gap: 6px 8px; align-items: start; }
.hub .rv-box select { grid-column: 1 / -1; max-width: 280px; }
.hub .rv-box textarea { width: 100%; font: inherit; font-size: 13px; }
.hub .rv-box .msg { grid-column: 1 / -1; margin: 0; }
.hub .rv-quote { margin: 8px 0; padding: 8px 12px; border-left: 3px solid var(--bz-accent, #F5A524); background: var(--bz-primary-soft, #f3f5fa); white-space: pre-wrap; }
@media (max-width: 700px) { .hub .rv-head { grid-template-columns: 1fr; } .hub .rv-side { justify-items: start; } .hub .rv-box { grid-template-columns: 1fr; } }

/* v3.51.0 Daraz store health */
.hub .hl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.hub .hl-card { border: 1px solid var(--line, #e3e6ee); border-radius: 12px; padding: 10px 12px; background: var(--card, #fff); display: grid; gap: 2px; }
.hub .hl-card.warn { border-color: var(--bad, #c0392b); box-shadow: inset 3px 0 0 var(--bad, #c0392b); }
.hub .hl-card strong { font-size: 22px; }
.hub .hl-card small { color: var(--mute, #6b7280); font-size: 12px; }
.hub .hl-sp { width: 100%; height: 54px; margin-top: 4px; }
.hub p.hl-sp { height: auto; font-size: 12px; margin: 6px 0 0; }
.hub .hl-line { fill: none; stroke: var(--bz-primary, #16213E); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.hub .hl-card.warn .hl-line { stroke: var(--bad, #c0392b); }
.hub .hl-dot { fill: var(--bz-accent, #F5A524); }
.hub .hl-warn { stroke: var(--bad, #c0392b); stroke-width: 1; stroke-dasharray: 4 3; opacity: .7; }
.hub .hl-levels { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 4px 12px; }

/* v3.52.0 Daraz promotions + campaigns */
.hub .modal .box.wide { max-width: 720px; width: min(720px, 100%); }
.hub .p-acts { white-space: nowrap; }
.hub .p-acts .btn { margin: 2px 4px 2px 0; }
@media (max-width: 700px) { .hub .p-acts { white-space: normal; } }
.hub .sp-list { display: grid; gap: 2px; max-height: 240px; overflow: auto; border: 1px solid var(--line, #e3e6ee); border-radius: 10px; padding: 6px; margin: 6px 0; }
.hub .sp-row { display: flex; gap: 8px; align-items: flex-start; padding: 4px 6px; border-radius: 6px; font-size: 13px; cursor: pointer; }
.hub .sp-row:hover { background: var(--bz-primary-soft, #f3f5fa); }
.hub .sp-row small { display: block; color: var(--mute, #6b7280); }
.hub .sp-q { width: 100%; }
.hub .pf-ck { display: inline-flex; gap: 6px; align-items: center; font-weight: 500; font-size: 13px; margin-right: 12px; }
.hub .pf-tiers .g2 { margin-bottom: 0; }
.hub .pc-res { margin: 8px 0; padding-left: 18px; font-size: 13px; }
.hub .cp-rem ul { margin: 4px 0 0; padding-left: 18px; }
.hub .cp-list { display: grid; gap: 12px; }
.hub .cp-card { border: 1px solid var(--line, #e3e6ee); border-radius: 12px; padding: 12px 14px; background: var(--card, #fff); }
.hub .cp-card.cp-finished { opacity: .8; }
.hub .cp-card header { display: flex; gap: 12px; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; }
.hub .cp-card h3 { margin: 0 0 2px; font-size: 16px; }
.hub .cp-card .sub { margin: 0; }
.hub .cp-join { white-space: nowrap; }
.hub .cp-pr { margin: 8px 0 4px; font-size: 13px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.hub .cp-perf { margin-top: 6px; }
.hub .cp-kpi { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; margin: 6px 0; }
.hub .cp-own { margin-top: 8px; font-size: 12px; }
.hub .pf-ck, .hub .f .pf-ck { display: inline-flex; width: auto; gap: 6px; align-items: center; font-weight: 500; margin: 4px 14px 4px 0; }
.hub .pf-ck input[type="radio"], .hub .pf-ck input[type="checkbox"], .hub .sp-row input, .hub .cp-join input { width: 16px; height: 16px; min-height: 0; padding: 0; margin: 0; flex: none; box-shadow: none; }
.hub .sp-q { padding: 8px 10px; border: 1px solid var(--line, #d9dde6); border-radius: 10px; font: inherit; font-size: 13px; }

/* v3.53.0 Daraz overview */
.hub .ov-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 4px 0 10px; }
.hub .ov-head h3 { margin: 0; font-size: 17px; }
.hub .ov-kpi { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.hub .ov-kpi .tile { padding: 10px 12px; min-height: 0; }
.hub .ov-kpi .tile strong { font-size: 20px; margin-top: 2px; }
.hub .ov-todo { margin-top: 14px; }
.hub .ov-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.hub .ov-list li { padding: 7px 10px 7px 12px; border-radius: 8px; border-left: 4px solid var(--line, #d9dde6); background: var(--bz-primary-soft, #f5f7fb); font-size: 13px; }
.hub .ov-list li.ov-bad { border-left-color: var(--bad, #c0392b); }
.hub .ov-list li.ov-warn { border-left-color: var(--bz-accent, #F5A524); }
.hub .ov-list li a { color: inherit; text-decoration: none; display: block; }
.hub .ov-list li a:hover { text-decoration: underline; }
.hub .ov-t { margin-top: 14px; }

/* v3.54.0 courier performance */
.hub .cq-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px; margin: 10px 0; }
.hub .cq-c strong { font-size: 22px; }
.hub .cq-c small { display: block; margin-top: 2px; }
.hub .cq-t td small, .hub .t td.cq-best small { display: block; }
.hub .t td.cq-best { background: var(--ok-soft, #e8f6ee); font-weight: 700; }
.hub .cq-form { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 4px 12px; }
.hub .ch-hint { display: block; margin-top: 3px; padding: 2px 6px; border-radius: 6px; background: var(--bz-primary-soft, #eef2fb); font-size: 11.5px; }
.hub .ch-hint.ch-warn { background: #fff4e0; color: #8a5a00; }
.hub .ch-hint.ch-good { background: #e8f6ee; color: #1e6b45; }

/* v3.55.0 (owner): the menu in sections that open and close */
#hubNav .nav-g{margin:2px 0}
#hubNav .nav-gh{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:0 12px;border:0;border-radius:var(--bz-radius-md);background:none;color:rgba(255,255,255,.62);font:inherit;font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;cursor:pointer;text-align:left}
#hubNav .nav-gh:hover{background:rgba(255,255,255,.06);color:#fff}
#hubNav .nav-gh svg:first-child{width:18px;height:18px;flex:none;opacity:.85}
#hubNav .nav-gh .nav-l{flex:1}
#hubNav .nav-gh .badge{background:var(--bz-accent);color:var(--bz-on-accent);font-weight:800;font-size:11px;border-radius:999px;padding:0 6px;line-height:18px;letter-spacing:0}
#hubNav .nav-chev{width:14px;height:14px;flex:none;transition:transform .18s ease}
#hubNav .nav-g.open .nav-chev{transform:rotate(90deg)}
#hubNav .nav-g.here>.nav-gh{color:#fff}
#hubNav .nav-items{display:none;padding-left:10px;margin-left:12px;border-left:1px solid rgba(255,255,255,.12)}
#hubNav .nav-g.open .nav-items{display:block}
#hubNav .nav-items a{min-height:38px;font-size:14px}
#hubNav .nav-sep{height:1px;background:rgba(255,255,255,.12);margin:10px 8px}
#hubNav a .nav-l{flex:1}

/* v3.55.0 (owner): on computer screens everything was a size too big — the whole app is drawn at 90% from 1100 px wide;
   phones and tablets stay as they are */
@media (min-width:1100px){body.hub{zoom:.9}}

/* v3.56.0 PostEx booking box */
.hub .modal .px-t { max-height: 46vh; overflow: auto; margin: 10px 0; }
.hub .modal .px-t select { min-width: 150px; max-width: 220px; }
.hub .modal .px-t tr.px-no td { opacity: .62; }
.hub .modal .px-t td small { display: block; }
.hub .modal .px-t select { padding: 5px 8px; border: 1px solid #d9d5e0; border-radius: 8px; font: inherit; font-size: 13px; background: #fff; }

/* v3.57.0 choose the courier */
.hub .modal .cc-list { display: grid; gap: 8px; margin: 12px 0; }
.hub .modal .cc-opt { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid #e3e0e8; border-radius: 12px; cursor: pointer; }
.hub .modal .cc-opt:has(input:checked) { border-color: #0d1b2a; box-shadow: 0 0 0 1px #0d1b2a inset; }
.hub .modal .cc-opt.off { opacity: .6; cursor: default; }
.hub .modal .cc-opt input { margin-top: 3px; flex: 0 0 auto; width: auto; }
.hub .modal .cc-b { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.hub .modal .cc-b small { flex-basis: 100%; color: #6b6577; }

/* v3.58.0 batch numbers */
.hub .bt-no { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 600; letter-spacing: .02em; }
.hub td .linkbtn.bt-no { padding: 0; }
.hub .modal .smap-box { max-height: 60vh; overflow: auto; margin: 10px 0; }

/* v3.58.2 product picker (by category, with pictures) */
.hub .pp-btn { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 5px 10px; border: 1px solid #d9d5e0; border-radius: 10px; background: #fff; font: inherit; text-align: left; cursor: pointer; }
.hub .pp-btn:disabled { cursor: default; background: #f6f5f8; }
.hub .pp-btn img, .hub .pp-btn .pp-noimg { width: 32px; height: 32px; border-radius: 6px; object-fit: cover; flex: 0 0 32px; background: #eceaf0; }
.hub .pp-t { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.hub .pp-t b { font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hub .pp-t small { color: #6b6577; font-size: 12px; }
.hub .pp-ph { flex: 1; color: #6b6577; }
.hub .pp-caret { font-style: normal; color: #6b6577; }
.hub .n-line { display: grid; grid-template-columns: 1fr 80px auto; gap: 8px; align-items: center; margin-bottom: 8px; }
.hub .modal .box.pp-box { display: flex; flex-direction: column; max-height: 88vh; }
.hub .modal .pp-q { width: 100%; margin: 8px 0; }
.hub .modal .pp-cats { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.hub .modal .pp-cat { border: 1px solid #d9d5e0; background: #fff; border-radius: 999px; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; }
.hub .modal .pp-cat b { color: #6b6577; font-weight: 600; margin-left: 2px; }
.hub .modal .pp-list { overflow: auto; flex: 1; min-height: 120px; border-top: 1px solid #eceaf0; }
.hub .modal .pp-g h4 { position: sticky; top: 0; margin: 0; padding: 8px 4px 6px; background: #fff; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #0d1b2a; z-index: 1; border-bottom: 1px solid #eceaf0; }
.hub .modal .pp-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 4px; border: 0; border-bottom: 1px solid #f2f0f5; background: none; font: inherit; text-align: left; cursor: pointer; }
.hub .modal .pp-item:hover, .hub .modal .pp-item:focus-visible { background: #f6f5f8; }
.hub .modal .pp-item.on { background: #fff6e3; }
.hub .modal .pp-item img, .hub .modal .pp-item .pp-noimg { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; flex: 0 0 44px; background: #eceaf0; }
.hub .modal input.pp-q { padding: 10px 12px; border: 1px solid #d9d5e0; border-radius: 10px; font: inherit; font-size: 14px; background: #fff; }
.hub .modal .pp-item img { background: #eceaf0; color: transparent; }

/* v3.59.0 Distribution (DMS) */
.hub .ds-tile { text-decoration: none; color: inherit; }
.hub .ds-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
@media (max-width: 900px) { .hub .ds-two { grid-template-columns: 1fr; } }
.hub .ds-todo { list-style: none; margin: 0; padding: 0; }
.hub .ds-todo li { padding: 8px 10px; border-left: 3px solid #c9c4d3; margin-bottom: 6px; background: #faf9fb; border-radius: 6px; }
.hub .ds-todo li.warn { border-left-color: #e0a019; } .hub .ds-todo li.bad { border-left-color: #c0392b; }
.hub .ds-todo a { color: inherit; text-decoration: none; }
.hub .ds-row { cursor: pointer; }
.hub .ds-row:hover td { background: #faf9fb; }
.hub .ds-f { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 14px; }
.hub .ds-f label, .hub .ds-tg label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.hub .ds-f input, .hub .ds-f select, .hub .ds-tg input, .hub .ds-tg select, .hub .ds-hs, .hub .ds-s { padding: 8px 10px; border: 1px solid #d9d5e0; border-radius: 8px; font: inherit; font-size: 14px; background: #fff; min-width: 0; }
.hub .ds-hs { width: 130px; } .hub .ds-s { width: 110px; }
.hub .ds-branch { color: #a9a3b4; margin-right: 6px; }
.hub .ds-lists { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.hub .ds-list { text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 4px; font: inherit; border: 1px solid #e3e0e8; }
.hub .ds-list:hover { border-color: #0d1b2a; }
.hub .ds-pct { font-size: 24px; font-weight: 700; color: #0d1b2a; }
.hub .ds-ph { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.hub .ds-pt tr.ds-cat td { background: #f4f2f5; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #0d1b2a; }
.hub .ds-prod { display: flex; align-items: center; gap: 10px; }
.hub .ds-prod img, .hub .ds-prod .pp-noimg { width: 36px; height: 36px; border-radius: 6px; object-fit: cover; background: #eceaf0; flex: 0 0 36px; color: transparent; }
.hub .ds-prod span { display: flex; flex-direction: column; }
.hub .ds-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.hub .ds-head h2 { margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hub .ds-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; margin: 10px 0 0; }
.hub .ds-dl3 { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.hub .ds-dl dt { font-size: 12px; color: #6b6577; } .hub .ds-dl dd { margin: 2px 0 0; }
@media (max-width: 600px) { .hub .ds-dl { grid-template-columns: 1fr; } }
.hub .ds-ck { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.hub .ds-hist { list-style: none; margin: 0; padding: 0; }
.hub .ds-hist li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #f0eef3; }
.hub .ds-hist small { color: #6b6577; white-space: nowrap; }
.hub .ds-tg { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin-bottom: 10px; }
.hub .ds-tm-g { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 8px 0; }
.hub .ds-tm-g h4 { margin: 0 0 6px; font-size: 13px; }
@media (max-width: 700px) { .hub .ds-tm-g { grid-template-columns: 1fr; } }
.hub .ds-soon { max-width: 640px; }
.hub #plQ { padding: 9px 12px; border: 1px solid #d9d5e0; border-radius: 10px; font: inherit; font-size: 14px; background: #fff; }

/* v3.64.0 Control room */
.hub .o-subrow a{min-height:36px;padding:0 12px;border:1px solid var(--bz-border);border-radius:999px;background:var(--bz-surface);font:700 13px var(--bz-font);color:var(--bz-ink);display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.hub .o-subrow a b{margin:0;font-size:11px;font-weight:800;color:var(--bz-text-muted)}
.hub .o-subrow a.on{background:var(--bz-primary);border-color:var(--bz-primary);color:#fff}
.hub .o-subrow a.on b{color:var(--bz-marigold-300)}
.hub .ctl-bar{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.hub .ctl-bar .h-intro{flex:1 1 320px;margin-bottom:8px}
.hub .ctl-acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hub .ctl-inline{display:inline-flex;gap:6px;align-items:center;font-size:13px;font-weight:700}
.hub .ctl-inline select{min-height:36px;border:1px solid var(--bz-border);border-radius:var(--bz-radius-md, 8px);padding:0 8px;background:var(--bz-surface);font:600 13px var(--bz-font)}
.hub .ctl-note{font-size:12.5px;color:var(--bz-text-muted);margin:0 0 12px;padding:8px 12px;border-left:3px solid var(--bz-accent);background:var(--bz-neutral-bg);border-radius:4px}
.hub .ctl-sum{margin:0 0 10px;font-size:14px}
.hub .ctl-row-acts{white-space:nowrap}
.hub .ctl-row-acts .btn+.btn{margin-left:6px}
.hub tr.ctl-off td{color:var(--bz-text-muted)}
.hub .modal .ctl-2,.hub .modal .ctl-3{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hub .modal .ctl-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hub .modal .ctl-check{display:flex!important;flex-direction:row;align-items:center;gap:8px;font-weight:600}
.hub .modal .ctl-check input{width:auto;min-height:0}
@media (max-width:560px){.hub .modal .ctl-2,.hub .modal .ctl-3{grid-template-columns:1fr}.hub .ctl-row-acts{white-space:normal}.hub .ctl-row-acts .btn+.btn{margin:6px 0 0}}