:root{
  --orange:#ff5b14; --orange-soft:#ffece2;
  --green:#16a34a; --green-soft:#e9f8ef;
  --ink:#1c1d22; --muted:#8b8f99; --faint:#b9bcc6;
  --line:#edeef1; --line-2:#f3f4f6;
  --bg:#e7e8ea; --surface:#fff;
  --rail:60px; --nav:184px; --top:54px;
  --indigo:#4f46e5;
  --r:14px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink); font-size:13px; line-height:1.45;
  -webkit-font-smoothing:antialiased;
  padding:0;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
svg{display:block}

/* ---- App frame (full size) ---- */
.frame{
  width:100%; max-width:none; background:var(--surface);
  border-radius:0; overflow:hidden; box-shadow:none;
  display:grid; grid-template-rows:var(--top) 1fr; height:100vh;
}

/* ---- Topbar ---- */
.topbar{
  display:flex; align-items:center; gap:14px;
  padding:0 16px; border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:9px;font-weight:600}
.brand .mark{width:22px;height:22px;border-radius:6px;object-fit:cover;display:block}
.brand .chev{color:var(--faint)}
.sep{color:var(--line);font-size:16px}
.crumb{font-weight:600}
/* Quick search */
.qsearch{
  position:relative; flex:1; max-width:430px; margin:0 auto;
  display:flex;align-items:center;gap:9px;
  background:#f5f6f8;border:1px solid var(--line);border-radius:999px;
  padding:0 14px;height:34px;color:var(--muted);
  transition:border-color .15s ease,background .15s ease;
}
.qsearch.open{background:#fff;border-color:var(--orange)}
.qsearch__ico{display:inline-flex}
.qsearch__ico svg{width:15px;height:15px}
.qsearch__input{flex:1;border:none;outline:none;background:none;
  font-size:13px;color:var(--ink);height:100%}
.qsearch__input::placeholder{color:var(--muted)}
.qsearch__menu{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 14px 36px rgba(15,18,30,.16);padding:6px;
  max-height:64vh;overflow-y:auto;animation:qsearch-pop .14s ease}
@keyframes qsearch-pop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.qsearch__group{padding:8px 10px 4px;font-size:11px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}
.qsearch__status{padding:16px 12px;color:var(--muted);font-size:12.5px;text-align:center}
.qsearch__opt{display:flex;align-items:center;gap:10px;width:100%;
  padding:8px 10px;border-radius:8px;color:var(--ink);font-size:13px;text-align:left}
.qsearch__opt:hover{background:#f5f6f8}
.qsearch__opt-ico{display:inline-flex;color:var(--muted)}
.qsearch__opt-ico svg{width:16px;height:16px}
.qsearch__label{flex:1;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qsearch__type{color:var(--muted);font-size:11.5px;white-space:nowrap}
.top-actions{display:flex;align-items:center;gap:6px;margin-left:auto}
.tbtn{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--muted)}
.tbtn:hover{background:#f5f6f8;color:var(--ink)}
.tbtn svg{width:18px;height:18px}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--indigo);
  color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;margin-left:4px;overflow:hidden}
.avatar__img{width:100%;height:100%;object-fit:cover;display:block}

/* Language selector */
.lang{position:relative}
.lang__btn{font-size:11px;font-weight:700;color:var(--ink);letter-spacing:.03em}
.lang__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:150px;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 10px 28px rgba(20,22,40,.14);padding:5px}
.lang__opt{display:flex;align-items:center;gap:9px;width:100%;text-align:left;
  padding:8px 9px;border-radius:7px;font-size:12.5px;color:var(--ink);font-weight:500}
.lang__opt:hover{background:#f5f6f8}
.lang__opt.on{background:#f3f4f6;font-weight:600}
.lang__code{display:inline-grid;place-items:center;min-width:26px;height:20px;
  border-radius:6px;background:var(--orange-soft);color:var(--orange);font-size:10px;font-weight:700}

/* ---- Body columns ---- */
.body{display:grid;grid-template-columns:var(--rail) var(--nav) 1fr;min-height:0;
  transition:grid-template-columns .2s ease}
/* Collapsed mode — workspace nav hidden, rail + main only */
.frame.nav-collapsed .body{grid-template-columns:var(--rail) 0 1fr}
.frame.nav-collapsed .nav{opacity:0;pointer-events:none;padding-left:0;padding-right:0}
.rail button.ri.collapse-btn svg{transition:transform .2s ease}
.frame.nav-collapsed .rail button.ri.collapse-btn svg{transform:rotate(180deg)}
/* Section without a submenu — collapse the workspace column entirely */
.frame.nav-empty .body{grid-template-columns:var(--rail) 0 1fr}
.frame.nav-empty.rail-expanded .body{grid-template-columns:190px 0 1fr}
.frame.nav-empty .nav{opacity:0;pointer-events:none;padding-left:0;padding-right:0}
.frame.nav-empty .rail .collapse-btn{display:none}

/* Icon rail */
.rail{
  border-right:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  min-height:0;overflow:hidden;padding:14px 0;
}
.rail__scroll,.rail__footer{width:100%;display:flex;flex-direction:column;align-items:center;gap:6px}
.rail__scroll{min-height:0;flex:1 1 auto;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:1px 0 6px;scrollbar-width:thin;scrollbar-color:#c9cdd5 transparent}
.rail__scroll::-webkit-scrollbar{width:4px}
.rail__scroll::-webkit-scrollbar-thumb{border-radius:999px;background:#c9cdd5}
.rail__scroll::-webkit-scrollbar-track{background:transparent}
.rail__footer{flex:0 0 auto}
.rail .plus{width:34px;height:34px;border-radius:10px;background:var(--orange);
  color:#fff;display:grid;place-items:center;margin-bottom:8px;
  box-shadow:0 6px 14px rgba(255,91,20,.35)}
.rail .plus svg{width:18px;height:18px}
.rail button.ri{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:var(--faint);position:relative}
.rail button.ri:hover{background:#f5f6f8;color:var(--ink)}
.rail button.ri.on{background:var(--orange-soft);color:var(--orange)}
.rail button.ri svg{width:18px;height:18px}
.ri__badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;
  background:#ef4444;color:#fff;font-size:9.5px;font-weight:700;display:grid;place-items:center;
  box-shadow:0 0 0 2px #fff}
.rail .spacer{flex:1}

/* Rail icon labels (revealed when the rail is expanded) */
.ri-text{display:none;font-weight:500;font-size:13px;white-space:nowrap}

/* ---- Tooltips on rail icons (shown only while the rail is collapsed) ---- */
.rail [data-tip]{position:relative}
.rail [data-tip]::after{
  content:attr(data-tip);
  position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%) scale(.96);
  transform-origin:left center;
  background:var(--ink);color:#fff;font-size:11px;font-weight:600;letter-spacing:.01em;
  padding:5px 9px;border-radius:7px;white-space:nowrap;
  box-shadow:0 6px 16px rgba(20,22,40,.22);
  opacity:0;pointer-events:none;transition:opacity .12s ease,transform .12s ease;z-index:60}
.rail [data-tip]::before{
  content:"";position:absolute;left:calc(100% + 4px);top:50%;transform:translateY(-50%);
  border:5px solid transparent;border-right-color:var(--ink);
  opacity:0;pointer-events:none;transition:opacity .12s ease;z-index:60}
.rail [data-tip]:hover::after{opacity:1;transform:translateY(-50%) scale(1)}
.rail [data-tip]:hover::before{opacity:1}
/* No tooltips once the rail is expanded — labels are visible instead */
.frame.rail-expanded .rail [data-tip]::after,
.frame.rail-expanded .rail [data-tip]::before{display:none}

/* ---- Expanded rail (icons + labels) ---- */
.frame.rail-expanded .body{grid-template-columns:190px var(--nav) 1fr}
.frame.rail-expanded.nav-collapsed .body{grid-template-columns:190px 0 1fr}
.frame.rail-expanded .rail{align-items:stretch;padding-left:10px;padding-right:10px}
.frame.rail-expanded .rail__scroll,.frame.rail-expanded .rail__footer{align-items:stretch}
.frame.rail-expanded .rail .ri-text{display:inline}
.frame.rail-expanded .rail button.ri,
.frame.rail-expanded .rail .plus{
  width:100%;display:flex;align-items:center;justify-content:flex-start;gap:11px;padding:0 10px}
.frame.rail-expanded .rail button.ri{height:38px;border-radius:9px}
.frame.rail-expanded .rail .plus{height:38px;margin-bottom:8px}
.frame.rail-expanded .rail .collapse-btn{justify-content:flex-start}

/* Workspace nav */
.nav{border-right:1px solid var(--line);padding:14px 12px;display:flex;flex-direction:column;
  overflow:hidden;white-space:nowrap;transition:opacity .15s ease}
.nav__head{display:flex;align-items:center;justify-content:space-between;
  font-size:10px;letter-spacing:.08em;color:var(--faint);font-weight:700;padding:4px 6px 10px}
.nav__head .ic{display:flex;gap:8px}
.nav__head svg{width:14px;height:14px}
.nav-item{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:9px;
  color:var(--muted);font-weight:500;margin-bottom:2px;width:100%;text-align:left;font-size:13px}
.nav-item:hover{background:#f6f7f9;color:var(--ink)}
.nav-item.on{background:#f3f4f6;color:var(--ink);font-weight:600}
.nav-item .pill{margin-left:auto;background:var(--orange-soft);color:var(--orange);
  font-size:10px;font-weight:700;padding:1px 7px;border-radius:999px}
.nav__foot{margin-top:auto;padding:10px 6px}
.nav__foot p{margin:0;color:var(--muted);font-size:12px}
.nav__foot a{color:#2f6bff;font-weight:600;font-size:12px}

/* ---- Main ---- */
.main{min-width:0;overflow-y:auto;padding:20px 22px;background:#fcfcfd}
.main__head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.main__head h1{font-size:18px;font-weight:700;margin:0;display:flex;align-items:center;gap:8px}
.main__head h1 .chev,.main__head h1 .add{color:var(--faint)}
.main__head h1 svg{width:16px;height:16px}
.addbtn{margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  background:var(--orange);color:#fff;font-weight:600;height:36px;padding:0 16px;border-radius:9px;
  box-shadow:0 6px 14px rgba(255,91,20,.3)}
.addbtn svg{width:15px;height:15px}
.main__actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.main__actions .addbtn{margin-left:0}
.addbtn--support{background:var(--ink);box-shadow:0 6px 14px rgba(28,29,34,.2)}
.addbtn:disabled{opacity:.62;cursor:wait}
.addbtn--muted{background:var(--line-2);color:var(--muted);box-shadow:none;cursor:default;font-weight:600}

/* Administrator support session: always visible while acting as a reseller. */
.impersonation-banner{position:fixed;z-index:2147483000;top:8px;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;gap:10px;max-width:calc(100vw - 24px);padding:7px 8px 7px 14px;
  border:1px solid rgba(255,255,255,.28);border-radius:999px;background:var(--ink);color:#fff;
  box-shadow:0 8px 24px rgba(20,22,30,.28);font-size:12px;font-weight:650;white-space:nowrap}
.impersonation-banner__error{max-width:280px;color:#ffd6c4;overflow:hidden;text-overflow:ellipsis}
.impersonation-banner__return{height:30px;padding:0 12px;border-radius:999px;background:var(--orange);color:#fff;
  font-size:11.5px;font-weight:750;white-space:nowrap}
.impersonation-banner__return:hover:not(:disabled){filter:brightness(.96)}
.impersonation-banner__return:disabled{opacity:.7;cursor:wait}
@media (max-width:560px){
  .main__head{align-items:flex-start;flex-wrap:wrap}
  .main__actions{width:100%;margin-left:0}
  .main__actions .addbtn{flex:1;justify-content:center;padding:0 10px}
  .impersonation-banner{top:6px;max-width:calc(100vw - 12px);gap:7px;padding-left:10px;font-size:10.5px}
  .impersonation-banner__error{display:none}
  .impersonation-banner__return{padding:0 9px;font-size:10.5px}
}
/* Application status pill (reseller view of a sourced product) */
.applpill{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  padding:.15rem .55rem; border-radius:999px; }
.applpill--accepted{ background:#e9f8ef; color:#15803d; }
.applpill--pending{ background:#fff4e6; color:#b45309; }
.applpill--rejected{ background:#fdf3f3; color:#dc2626; }

/* Distributor dashboard greeting + application-breakdown KPI */
.muted-sub{ color:var(--muted); font-size:13px; margin:-4px 0 14px; }
.dash-greeting{ margin-bottom:14px; }
.dash-greeting__hi{ font-size:20px; font-weight:700; color:var(--ink); }
.dash-greeting__sub{ color:var(--muted); font-size:13px; margin-top:2px; }
.todo-panel{ margin:14px 0 20px; padding:18px; border:1px solid #fed7c2; border-radius:18px;
  background:linear-gradient(135deg,#fffaf7 0%,#fff 58%,#fff4ec 100%); box-shadow:0 8px 28px rgba(77,40,17,.06); }
.todo-panel__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:13px; }
.todo-panel__eyebrow{ display:block; color:var(--orange); font-size:10.5px; font-weight:800; letter-spacing:.11em; }
.todo-panel__head h2{ margin:3px 0 2px; color:var(--ink); font-size:18px; line-height:1.25; }
.todo-panel__head p{ margin:0; color:var(--muted); font-size:12.5px; }
.todo-panel__total{ flex:none; padding:5px 10px; border-radius:999px; color:#b83b0b; background:#ffeadf;
  font-size:11.5px; font-weight:750; white-space:nowrap; }
.todo-list{ display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.todo-item{ min-width:0; width:100%; padding:11px; border:1px solid var(--line); border-radius:13px; background:#fff;
  display:grid; grid-template-columns:38px minmax(0,1fr) 18px; align-items:center; gap:10px; color:var(--ink);
  font:inherit; text-align:left; text-decoration:none; cursor:pointer; transition:border-color .15s,transform .15s,box-shadow .15s; }
.todo-item:hover{ border-color:var(--orange); transform:translateY(-1px); box-shadow:0 6px 16px rgba(77,40,17,.08); }
.todo-item:disabled{ cursor:wait; opacity:.72; transform:none; box-shadow:none; }
.todo-item--urgent{ border-color:#fdba9b; }
.todo-item__count{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; color:#c2410c;
  background:#fff0e7; font-size:16px; font-weight:800; font-variant-numeric:tabular-nums; }
.todo-item--urgent .todo-item__count{ color:#fff; background:var(--orange); }
.todo-item__body{ min-width:0; display:flex; flex-direction:column; gap:2px; }
.todo-item__body strong{ font-size:12.5px; line-height:1.3; }
.todo-item__body small{ color:var(--muted); font-size:11px; line-height:1.35; }
.todo-item__body small b{ color:var(--orange); font-weight:800; }
.todo-item__arrow{ color:var(--orange); font-size:17px; font-weight:700; text-align:center; }
.todo-clear{ padding:11px 12px; border:1px solid #bbebcb; border-radius:13px; background:#f0fbf4;
  display:flex; align-items:center; gap:10px; color:#166534; }
.todo-clear__icon{ width:32px; height:32px; border-radius:50%; display:grid; place-items:center; color:#fff; background:#16a34a; font-weight:800; }
.todo-clear span:last-child{ display:flex; flex-direction:column; gap:1px; }
.todo-clear strong{ font-size:13px; }.todo-clear small{ color:#4b7c5c; font-size:11.5px; }
@media(max-width:600px){
  .todo-panel{ padding:14px; }.todo-panel__head{ flex-direction:column; gap:8px; }.todo-list{ grid-template-columns:1fr; }
}
.kpi--split{ align-items:flex-start; }
.appbreak{ display:flex; flex-direction:column; gap:5px; margin-top:8px; width:100%; }
.appbreak__row{ display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--muted); }
.appbreak__row b{ margin-left:auto; color:var(--ink); font-variant-numeric:tabular-nums; }
.appbreak .dot{ width:8px; height:8px; border-radius:50%; flex:none; }
.dot--pending{ background:#f59e0b; }
.dot--ok{ background:#16a34a; }
.dot--no{ background:#dc2626; }
.applpill--corner{ position:absolute; top:10px; right:10px; z-index:2; box-shadow:0 1px 3px rgba(0,0,0,.08); }
/* Approval status pill colours */
.applpill--appr-draft{ background:var(--line-2); color:var(--muted); }
.applpill--appr-pending{ background:#fff4e6; color:#b45309; }
.applpill--appr-approved{ background:#e9f8ef; color:#15803d; }
.applpill--appr-rejected{ background:#fdf3f3; color:#dc2626; }
.approvals__sku{ display:block; font-size:11px; color:var(--muted); }

/* Distributor dashboard: 50/50 approved vs under-approval lists */
.dash-split{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; align-items:start; }
.dprod{ display:flex; align-items:center; gap:10px; padding:8px 4px; border-top:1px solid var(--line); cursor:pointer; }
.dprod:first-of-type{ border-top:0; }
.dprod:hover{ background:var(--line-2); }
.dprod__thumb{ width:40px; height:40px; border-radius:8px; object-fit:cover; flex:none; background:var(--line-2); }
.dprod__thumb--ph{ display:flex; align-items:center; justify-content:center; color:var(--muted); }
.dprod__thumb--ph svg{ width:20px; height:20px; }
.dprod__main{ display:flex; flex-direction:column; min-width:0; flex:1; }
.dprod__name{ font-weight:600; font-size:13px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dprod__sub{ font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.dprod__stats{ display:flex; flex-direction:column; gap:1px; margin-top:3px; }
.dprod__stat{ display:flex; justify-content:space-between; gap:10px; font-size:11.5px; color:var(--muted); }
.dprod__stat b{ color:var(--ink); font-weight:600; font-variant-numeric:tabular-nums; }

/* --- Reseller catalog (rich marketplace cards) --- */
.ctoolbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.ctabs{ display:flex; gap:4px; flex-wrap:wrap; border-bottom:1px solid var(--line); }
.ctab{ padding:8px 14px; font-size:13px; font-weight:600; color:var(--muted); border-bottom:2px solid transparent; margin-bottom:-1px; }
.ctab:hover{ color:var(--ink); }
.ctab.on{ color:var(--orange); border-bottom-color:var(--orange); }
.ctoolbar__right{ display:flex; align-items:center; gap:10px; }

.cgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px; }
.ccard{ border:1px solid var(--line); border-radius:var(--r); background:var(--surface); overflow:hidden; display:flex; flex-direction:column; }
.ccard__media{ position:relative; height:180px; background:#f4f5f7; display:grid; place-items:center; cursor:pointer; overflow:hidden; }
.ccard__media img{ width:100%; height:100%; object-fit:cover; }
.ccard__ph{ color:var(--faint); } .ccard__ph svg{ width:48px; height:48px; }
.ccard__badge{ position:absolute; top:12px; left:12px; padding:5px 10px; border-radius:8px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.02em; }
.ccard__badge--new{ background:var(--green-soft); color:#15803d; }
.ccard__badge--pop{ background:var(--orange-soft); color:#b45309; }
.ccard__badge--us, .ccard__badge--cn{ background:#eaf1ff; color:#2f6bff; }
.ccard__fav{ position:absolute; top:10px; right:10px; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.92); display:grid; place-items:center; font-size:16px; color:#9aa0ab; box-shadow:0 1px 4px rgba(0,0,0,.1); }
.ccard__fav.on{ color:var(--orange); }
.ccard__fav--low{ top:auto; bottom:10px; }
.ccard__ribbon{ position:absolute; top:14px; right:-38px; transform:rotate(45deg); background:var(--green); color:#fff; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; padding:4px 44px; box-shadow:0 1px 3px rgba(0,0,0,.18); z-index:2; }
.ccard__seller--link{ cursor:pointer; }
.ccard__seller--link:hover strong{ text-decoration:underline; color:var(--orange); }
.ccard__body{ padding:14px; display:flex; flex-direction:column; gap:10px; }
.ccard__name{ margin:0; font-size:15px; font-weight:700; line-height:1.3; cursor:pointer; }
.ccard__seller{ font-size:12.5px; color:var(--muted); display:flex; align-items:center; gap:5px; }
.ccard__seller strong{ color:var(--ink); font-weight:600; }
.ccard__check{ display:inline-grid; place-items:center; width:16px; height:16px; border-radius:50%; background:#2f6bff; color:#fff; flex:none; }
.ccard__check svg{ width:10px; height:10px; }
.ccard__tags{ display:flex; flex-wrap:wrap; gap:6px; }
.tag--flag{ display:inline-flex; align-items:center; gap:5px; }
.tag--flag::before{ content:""; width:7px; height:7px; border-radius:50%; }
.tag--cn::before{ background:#dc2626; } .tag--us::before{ background:#2f6bff; }
.ccard__prices{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding-top:10px; border-top:1px solid var(--line); }
.ccard__price{ display:flex; flex-direction:column; gap:2px; }
.ccard__price span{ font-size:10.5px; color:var(--muted); }
.ccard__price b{ font-size:14px; color:var(--ink); font-variant-numeric:tabular-nums; }
.ccard__margin{ display:flex; align-items:center; justify-content:space-between; }
.ccard__margin-k{ font-size:12px; color:var(--muted); }
.ccard__margin-v{ font-size:15px; font-weight:700; display:flex; align-items:baseline; gap:5px; }
.ccard__margin-v.pos{ color:#15803d; } .ccard__margin-v.neg{ color:#dc2626; }
.ccard__margin-pct{ font-weight:500; color:var(--muted); font-size:12px; }
.ccard__stats{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ccard__stat{ display:flex; align-items:center; gap:8px; background:var(--line-2); border-radius:9px; padding:8px 10px; }
.ccard__stat-ico{ color:var(--muted); display:grid; place-items:center; flex:none; } .ccard__stat-ico svg{ width:16px; height:16px; }
.ccard__stat-body{ display:flex; flex-direction:column; min-width:0; }
.ccard__stat-k{ font-size:10.5px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ccard__stat-body b{ font-size:13px; color:var(--ink); } .ccard__stat-body b.pos{ color:#15803d; }
.ccard__actions{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:2px; }
.ccard__detail{ padding:9px; border:1px solid var(--line); border-radius:9px; font-weight:600; font-size:13px; color:var(--ink); }
.ccard__detail:hover{ background:var(--line-2); }
.ccard__apply{ padding:9px; border-radius:9px; font-weight:600; font-size:13px; background:var(--orange); color:#fff; }
.ccard__apply:hover{ filter:brightness(.96); }
.ccard__apply--dim{ background:var(--line-2); color:var(--muted); cursor:default; }
@media (max-width:560px){ .cgrid{ grid-template-columns:1fr; } .ctoolbar{ flex-direction:column; align-items:stretch; } .ctoolbar__right{ justify-content:space-between; } }
.dprod .applpill{ flex:none; }
@media (max-width:768px){ .dash-split{ grid-template-columns:1fr; } }

/* "Update available" banner */
.updatebar{ position:fixed; top:14px; left:50%; transform:translateX(-50%); z-index:300;
  display:flex; align-items:center; gap:14px; width:max-content; max-width:calc(100vw - 24px);
  background:#1c1d22; color:#fff; border-radius:12px; padding:11px 14px;
  box-shadow:0 12px 30px rgba(15,18,30,.3); animation:qsearch-pop .18s ease; }
.updatebar__body{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.updatebar__title{ display:flex; align-items:center; gap:7px; font-weight:700; font-size:13px; }
.updatebar__title svg{ width:15px; height:15px; }
.updatebar__desc{ font-size:11.5px; color:#c9ccd6; }
.updatebar__btn{ flex:none; height:34px; padding:0 14px; border-radius:9px; background:var(--orange);
  color:#fff; font-weight:600; }
.updatebar__btn:hover:not(:disabled){ filter:brightness(.97); }
.updatebar__btn:disabled{ opacity:.6; cursor:default; }

/* Tabs */
.tabs-row{display:flex;align-items:center;border-bottom:1px solid var(--line);margin-bottom:16px}
.tabs{display:flex;align-items:center;gap:2px}
.tab{position:relative;display:inline-flex;align-items:center;gap:6px;padding:9px 12px;
  color:var(--muted);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:color .2s ease}
/* Animated underline: grows from the centre when a tab becomes active */
.tab::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;
  background:var(--orange);transform:scaleX(0);transform-origin:center;
  transition:transform .28s cubic-bezier(.4,0,.2,1)}
/* Icons are collapsed by default and revealed on hover / when active */
.tab .ico{display:inline-flex;align-items:center;width:0;opacity:0;margin-right:-6px;
  overflow:hidden;transition:width .22s ease,opacity .22s ease,margin-right .22s ease}
.tab .ico svg{width:15px;height:15px}
.tab:hover{color:var(--ink)}
.tab:hover .ico,.tab.on .ico{width:15px;opacity:1;margin-right:0}
.tab.on{color:var(--ink);font-weight:600}
.tab.on::after{transform:scaleX(1)}
.tab.add{color:var(--muted)}
/* The "+View" action keeps its icon visible at all times */
.tab.add .ico{width:15px;opacity:1;margin-right:0}
.view-set{margin-left:auto;display:inline-flex;align-items:center;gap:6px;color:var(--muted);
  font-weight:500;font-size:12.5px}
.view-set svg{width:15px;height:15px}

/* Filter toolbar */
.filters{display:flex;align-items:center;gap:9px;margin-bottom:18px}
.f-search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);
  border-radius:9px;height:34px;padding:0 12px;width:210px;color:var(--muted)}
.f-search svg{width:14px;height:14px}
.f-search input{border:none;outline:none;background:none;font-size:12.5px;color:var(--ink);width:100%}
.fbtn{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;
  border:1px solid var(--line);border-radius:9px;color:var(--ink);font-weight:500;font-size:12.5px}
.fbtn svg{width:14px;height:14px;color:var(--muted)}
.fbtn.dark{border-color:var(--ink)}
.fbtn:hover{background:#f7f8fa}
.filters .grow{flex:1}
.fbadge{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 5px;border-radius:9px;
  background:var(--orange);color:#fff;font-size:10px;font-weight:700}

/* Advanced filters panel */
.filters-panel{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:16px;margin-bottom:18px}
.filters-panel__row{display:flex;flex-wrap:wrap;gap:24px}
.filter-group{display:flex;flex-direction:column;gap:8px;min-width:160px}
.filter-group__label{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.filter-chips{display:flex;flex-wrap:wrap;gap:6px}
.filter-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;
  border:1px solid var(--line);border-radius:7px;padding:5px 9px;color:var(--muted)}
.filter-chip:hover{background:#f7f8fa}
.filter-chip.on{border-color:var(--orange);background:var(--orange-soft);color:var(--orange)}
.filter-select{height:34px;border:1px solid var(--line);border-radius:9px;padding:0 10px;
  font-family:inherit;font-size:12.5px;color:var(--ink);background:#fff;outline:none}
.filter-select:focus{border-color:var(--orange)}
.filters-panel__foot{display:flex;justify-content:flex-end;margin-top:14px}
.btn-clear{height:32px;padding:0 14px;border:1px solid var(--line);border-radius:8px;
  font-weight:600;font-size:12px;color:var(--ink)}
.btn-clear:hover:not(:disabled){background:#f5f6f8}
.btn-clear:disabled{opacity:.45;cursor:not-allowed}
.toggle{display:flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.toggle button{width:34px;height:34px;display:grid;place-items:center;color:var(--faint)}
.toggle button.on{background:var(--orange-soft);color:var(--orange)}
.toggle button svg{width:16px;height:16px}

/* ---- Product grid ---- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pcard{border:1px solid var(--line);border-radius:var(--r);padding:15px;background:#fff;
  display:flex;flex-direction:column;transition:box-shadow .15s,border-color .15s;position:relative}
.pcard:hover{box-shadow:0 8px 22px rgba(20,22,40,.07);border-color:#e3e4e8}
.pcard__top{display:flex;gap:11px;align-items:flex-start}
.thumb{width:42px;height:42px;border-radius:9px;background:#f4f5f7;border:1px solid var(--line);
  display:grid;place-items:center;flex-shrink:0;color:var(--faint);overflow:hidden}
.thumb svg{width:22px;height:22px}
.thumb img{width:100%;height:100%;object-fit:cover;border-radius:9px}
.pcard__title{flex:1;min-width:0}
.pcard__title h4{margin:0;font-size:13px;font-weight:600;line-height:1.3}
.pcard__title .sku{color:var(--muted);font-size:11.5px;margin-top:2px}
.dots{color:var(--faint);width:26px;height:26px;border-radius:7px;display:grid;place-items:center;flex-shrink:0}
.dots:hover{background:#f5f6f8;color:var(--ink)}
.dots svg{width:16px;height:16px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.tag{font-size:11px;color:var(--muted);background:#f5f6f8;border-radius:6px;padding:2px 8px;font-weight:500}
.divide{height:1px;background:var(--line-2);margin:13px 0}

/* variant rows */
.vrow{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;
  gap:10px;padding:5px 0;font-size:12px}
.vrow .c1{color:var(--ink);font-weight:500}
.vrow .c2{color:var(--muted);justify-self:start}
.vrow .price{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.stock{display:inline-flex;align-items:center;gap:4px;font-weight:600;font-variant-numeric:tabular-nums;justify-self:end}
.stock svg{width:13px;height:13px}
.stock.g{color:var(--green)} .stock.r{color:#e0481f}
.more{color:var(--orange);font-weight:600;font-size:12px;margin-top:7px;display:inline-block}

/* retail/wholesale block */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kv .k{color:var(--muted);font-size:11px;margin-bottom:3px}
.kv .v{font-weight:700;font-variant-numeric:tabular-nums}
.stock-line{margin-top:11px}
.stock-line .k{color:var(--muted);font-size:11px;margin-bottom:4px}
.stock-pill{display:inline-flex;align-items:center;gap:5px;color:var(--green);font-weight:600}
.stock-pill svg{width:13px;height:13px}

/* footer badges */
.pcard__foot{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:13px}
.pcard__edit{margin-left:auto;border:1px solid var(--line)}
.pcard__edit:hover{background:#f5f6f8;color:var(--ink)}
.sbadge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;
  border-radius:7px;padding:4px 9px}
.sbadge.active{color:var(--green);background:var(--green-soft)}
.sbadge.draft{color:var(--muted);background:#f1f2f4}
.sbadge.dropship{color:var(--muted);background:#f5f6f8}
.sbadge svg{width:13px;height:13px}
.expand{margin-left:auto;width:30px;height:26px;border-radius:7px;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--muted)}
.expand:hover{background:#f5f6f8;color:var(--ink)}
.expand svg{width:14px;height:14px}

/* Placeholder views fill the main area and center their card */
.view.center{min-height:100%;display:flex;flex-direction:column}
.view.center .placeholder{margin:auto;width:100%;max-width:440px}

/* Generic placeholder view (Bundle, License Keys, Dropshipping) */
.placeholder{border:1px dashed var(--line);border-radius:var(--r);background:#fff;
  padding:48px 24px;text-align:center;color:var(--muted)}
.placeholder .ph-ico{width:46px;height:46px;border-radius:12px;background:var(--orange-soft);
  color:var(--orange);display:grid;place-items:center;margin:0 auto 14px}
.placeholder .ph-ico svg{width:22px;height:22px}
.placeholder h3{margin:0 0 6px;font-size:15px;color:var(--ink)}
.placeholder p{margin:0 auto;max-width:360px;font-size:12.5px}

/* No-results state */
.empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:40px 0;font-size:13px}

/* ---- Drawer (slide-in create panel) ---- */
.drawer-overlay{position:fixed;inset:0;background:rgba(20,22,40,.38);
  opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;z-index:50}
.drawer-overlay.open{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100vh;width:440px;max-width:92vw;
  background:#fff;box-shadow:-12px 0 40px rgba(20,22,40,.18);
  transform:translateX(100%);transition:transform .25s cubic-bezier(.4,0,.2,1);
  z-index:51;display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer__head{display:flex;align-items:center;gap:10px;padding:18px 20px;border-bottom:1px solid var(--line)}
.drawer__head h2{margin:0;font-size:16px;font-weight:700}
.drawer__head p{margin:2px 0 0;font-size:12px;color:var(--muted)}
.drawer__close{margin-left:auto;width:32px;height:32px;border-radius:8px;display:grid;
  place-items:center;color:var(--muted)}
.drawer__close:hover{background:#f5f6f8;color:var(--ink)}
.drawer__close svg{width:18px;height:18px}
.drawer__form{flex:1;display:flex;flex-direction:column;min-height:0}
.drawer__body{flex:1;overflow-y:auto;padding:20px}
.field{margin-bottom:15px}
.field label{display:block;font-weight:600;font-size:12px;margin-bottom:6px;color:var(--ink)}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:9px;
  height:38px;padding:0 12px;font-family:inherit;font-size:13px;color:var(--ink);outline:none;background:#fff}
.field textarea{height:auto;padding:10px 12px;resize:vertical;min-height:72px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--orange)}
.field .req{color:#e0481f;font-weight:700}
.field .validation-message{display:block;margin-top:5px;font-size:11.5px;font-weight:500;color:#e0481f}
.field__err{display:block;margin-top:5px;font-size:11.5px;font-weight:500;color:#e0481f}
.ai-title-row{display:flex;gap:8px;align-items:stretch}
.ai-title-row input{flex:1;min-width:0}
.ai-btn{flex:0 0 auto;width:42px;border:1px solid var(--orange);border-radius:9px;background:var(--orange-soft);color:var(--orange);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s,transform .1s}
.ai-btn svg{width:18px;height:18px}
.ai-btn:hover{background:var(--orange);color:#fff}
.ai-btn:active{transform:scale(.95)}
.ai-btn:disabled{cursor:default}
.ai-btn.is-busy svg{animation:ai-pulse 1s ease-in-out infinite}
@keyframes ai-pulse{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}
.field input.invalid,.field select.invalid,.field textarea.invalid{border-color:#e0481f}
.field input.invalid:focus,.field select.invalid:focus,.field textarea.invalid:focus{
  border-color:#e0481f;box-shadow:0 0 0 3px rgba(224,72,31,.12)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* Grouped sub-section header inside the product drawer */
.drawer__section{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);margin:6px 0 13px;padding-top:15px;border-top:1px solid var(--line)}
/* Inline checkbox field (label sits beside the box) */
.field--check{display:flex;align-items:center}
.field .check{display:flex;align-items:center;gap:8px;font-weight:600;font-size:13px;cursor:pointer;margin:0}
.field .check input{width:auto;height:auto;margin:0}
/* Read-only live margin box in the drawer */
.margin-readout{display:flex;align-items:center;height:38px;padding:0 12px;border:1px dashed var(--line);
  border-radius:9px;font-weight:700;font-variant-numeric:tabular-nums;background:#fafbfc;color:var(--muted)}
.margin-readout.pos{color:#15803d;border-color:#bbe6c8;background:#f1faf3}
.margin-readout.neg{color:#dc2626;border-color:#f0c5c5;background:#fdf3f3}
/* Coloured margin value on the detail page */
.kv .v.pos{color:#15803d}
.kv .v.neg{color:#dc2626}
/* Generic positive/negative amount text */
.txt-pos{color:#15803d}
.txt-neg{color:#dc2626}
.kv--wide{grid-column:1 / -1}
.detail__srclink{ color:var(--orange); word-break:break-all; text-decoration:none; }
.detail__srclink:hover{ text-decoration:underline; }
.order-source-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.order-source-btn{ margin-left:0; width:max-content; text-decoration:none; }
.srclist{ list-style:none; margin:0 0 6px; padding:0; display:flex; flex-direction:column; gap:8px; }
.srclist__item{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.srclist__meta{ font-size:12px; color:var(--muted); background:var(--line-2); padding:2px 8px; border-radius:999px; }
.srclist__default{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  color:var(--orange); background:var(--orange-soft); padding:2px 8px; border-radius:999px; flex:none; }
.srclist__actions{ display:inline-flex; gap:2px; margin-left:auto; }
.srclist__actions .dots svg{ width:14px; height:14px; }
.form-err{ color:#dc2626; font-size:12.5px; margin:4px 0 0; }
.drawer__foot{display:flex;gap:10px;padding:16px 20px;border-top:1px solid var(--line)}
.drawer__foot .btn-cancel{flex:0 0 auto;height:38px;padding:0 16px;border:1px solid var(--line);
  border-radius:9px;font-weight:600;color:var(--ink)}
.drawer__foot .btn-cancel:hover{background:#f5f6f8}
.drawer__foot .btn-save{flex:1;height:38px;border-radius:9px;background:var(--orange);color:#fff;
  font-weight:600;box-shadow:0 6px 14px rgba(255,91,20,.3)}

/* ---- Notes (product drawer) ---- */
.notes{margin-top:4px;border-top:1px solid var(--line);padding-top:15px}
.notes__head{display:flex;align-items:center;gap:7px;font-weight:700;font-size:12px;
  color:var(--ink);margin-bottom:11px}
.notes__head svg{width:14px;height:14px;color:var(--muted)}
.notes__loading{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12.5px;padding:10px 0}
.notes__empty{color:var(--muted);font-size:12.5px;padding:4px 0 12px}
/* ~3 notes tall, the rest scroll */
.notes__list{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-direction:column;gap:8px;
  max-height:192px;overflow-y:auto}
.notes__more{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;background:none;
  color:var(--orange);font-weight:600;font-size:12px;padding:2px 0;margin-bottom:12px}
.notes__more svg{width:13px;height:13px}
.notes__more:hover:not(:disabled){text-decoration:underline}
.notes__more:disabled{color:var(--muted);cursor:not-allowed}
.note{background:#f7f8fa;border:1px solid var(--line);border-radius:9px;padding:9px 11px}
.note__content{font-size:12.5px;color:var(--ink);white-space:pre-wrap;word-break:break-word}
.note__time{font-size:10.5px;color:var(--faint);margin-top:5px;font-variant-numeric:tabular-nums}
.notes__add{display:flex;flex-direction:column;gap:8px}
.notes__add textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 11px;
  font-family:inherit;font-size:12.5px;color:var(--ink);resize:vertical;min-height:54px;outline:none;background:#fff}
.notes__add textarea:focus{border-color:var(--orange)}
.btn-addnote{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;height:32px;
  padding:0 13px;border-radius:8px;background:var(--ink);color:#fff;font-weight:600;font-size:12px}
.btn-addnote svg{width:13px;height:13px}
.btn-addnote:hover:not(:disabled){background:#000}
.btn-addnote:disabled{opacity:.45;cursor:not-allowed}
.spinner{width:15px;height:15px;border:2px solid var(--line);border-top-color:var(--orange);
  border-radius:50%;display:inline-block;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---- Tag picker ---- */
.tagpicker{position:relative}
.tagpicker__control{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:38px;
  border:1px solid var(--line);border-radius:9px;padding:5px 8px;background:#fff;cursor:text}
.tagpicker__control:focus-within{border-color:var(--orange)}
.tagpicker__input{border:none;outline:none;flex:1;min-width:90px;height:26px;
  font-family:inherit;font-size:13px;color:var(--ink);background:none}
.tag-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;
  background:#f5f6f8;color:var(--ink);border-radius:7px;padding:3px 8px}
.tag-chip__x{font-size:15px;line-height:1;color:var(--muted);padding:0 1px}
.tag-chip__x:hover{color:var(--ink)}
.tag-dot{width:8px;height:8px;border-radius:50%;background:var(--c,#8b8f99);flex-shrink:0}
.tagpicker__menu{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:5;background:#fff;
  border:1px solid var(--line);border-radius:9px;box-shadow:0 10px 28px rgba(20,22,40,.12);
  padding:5px;max-height:230px;overflow-y:auto}
.tagpicker__opt{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  padding:7px 9px;border-radius:7px;font-size:12.5px;color:var(--ink)}
.tagpicker__opt:hover{background:#f5f6f8}
.tagpicker__type{margin-left:auto;font-size:10px;color:var(--faint);font-weight:700;
  text-transform:uppercase;letter-spacing:.04em}
.tagpicker__add{display:flex;align-items:center;gap:6px;width:100%;text-align:left;
  padding:7px 9px;border-radius:7px;font-size:12.5px;font-weight:600;color:var(--orange)}
.tagpicker__add svg{width:14px;height:14px}
.tagpicker__add:hover{background:var(--orange-soft)}
.tagpicker__empty{padding:10px;text-align:center;color:var(--muted);font-size:12px}

/* ---- Tags management grid ---- */
.tag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.tcard{border:1px solid var(--line);border-radius:var(--r);padding:13px 14px;background:#fff;
  display:flex;align-items:center;gap:12px;transition:box-shadow .15s,border-color .15s}
.tcard:hover{box-shadow:0 8px 22px rgba(20,22,40,.07);border-color:#e3e4e8}
.tcard__swatch{width:38px;height:38px;border-radius:10px;flex-shrink:0;border:1px solid rgba(20,22,40,.08)}
.tcard__body{flex:1;min-width:0}
.tcard__name{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tcard__type{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--faint);margin-top:3px}
.tcard__actions{display:flex;gap:4px;flex-shrink:0}
.tcard__btn{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:var(--muted)}
.tcard__btn:hover{background:#f5f6f8;color:var(--ink)}
.tcard__btn.danger:hover{background:#fdecea;color:#e0481f}
.tcard__btn svg{width:15px;height:15px}

/* ---- New tag modal ---- */
.tagmodal-overlay{position:fixed;inset:0;background:rgba(20,22,40,.3);z-index:60}
.tagmodal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:61;
  width:340px;max-width:92vw;background:#fff;border-radius:14px;
  box-shadow:0 24px 60px rgba(20,22,40,.28);display:flex;flex-direction:column}
.tagmodal__head{display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px;border-bottom:1px solid var(--line)}
.tagmodal__head h3{margin:0;font-size:15px;font-weight:700}
.tagmodal__body{padding:18px}
.tagmodal__foot{display:flex;gap:10px;padding:14px 18px;border-top:1px solid var(--line)}
.tagmodal__foot .btn-cancel{flex:0 0 auto;height:36px;padding:0 14px;border:1px solid var(--line);
  border-radius:9px;font-weight:600;color:var(--ink)}
.tagmodal__foot .btn-cancel:hover{background:#f5f6f8}
.tagmodal__foot .btn-save{flex:1;height:36px;border-radius:9px;background:var(--orange);
  color:#fff;font-weight:600}
.tagmodal__foot .btn-save:disabled{opacity:.5;cursor:not-allowed}
.tag-color{padding:2px!important;height:38px;width:100%;cursor:pointer}
.tag-preview{margin-top:4px}

@media(max-width:980px){ .grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:760px){ .body{grid-template-columns:var(--rail) 1fr} .nav{display:none}
  .grid{grid-template-columns:1fr} .qsearch{display:none} }

/* ---- Detail pages (product / tag) ---- */
/* ---- upgrade card (Free resellers): floating, pinned bottom-left above the rail ---- */
.upsell{ position:fixed; left:calc(var(--rail) + 12px); bottom:14px; width:200px; z-index:60;
  padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:0 8px 26px rgba(23,33,43,.16); }
.upsell__x{ position:absolute; top:8px; right:8px; width:22px; height:22px; border-radius:6px; display:grid; place-items:center; color:var(--faint); background:none; cursor:pointer; }
.upsell__x svg{ width:14px; height:14px; } .upsell__x:hover{ color:var(--ink); background:var(--line-2); }
.upsell__ico{ width:40px; height:40px; border-radius:11px; display:grid; place-items:center; background:var(--green-soft); color:var(--green); margin-bottom:10px; }
.upsell__ico svg{ width:20px; height:20px; }
.upsell__title{ font-weight:700; font-size:14px; color:var(--ink); }
.upsell__desc{ font-size:12px; color:var(--muted); line-height:1.4; margin:4px 0 12px; }
.upsell__btn{ width:100%; padding:10px; border-radius:10px; background:var(--ink); color:#fff; font-weight:600; font-size:13px; border:none; cursor:pointer; }
.upsell__btn:hover{ filter:brightness(1.08); }
@media (max-width:768px){ .upsell{ left:12px; right:12px; width:auto; bottom:76px; } }

/* ---- subscription plans ---- */
.tc-agree{ display:flex; align-items:flex-start; gap:9px; margin:4px 0 18px; font-size:13.5px; color:var(--text); cursor:pointer; }
.tc-agree input{ margin-top:2px; width:16px; height:16px; accent-color:var(--orange); flex:0 0 auto; cursor:pointer; }
.tc-agree a{ color:var(--orange); font-weight:600; text-decoration:none; }
.tc-agree a:hover{ text-decoration:underline; }
.plangrid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; margin-bottom:22px; }
.plan{ position:relative; border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:18px; box-shadow:var(--shadow); display:flex; flex-direction:column; }
.plan--current{ border-color:var(--orange); }
.plan__badge{ position:absolute; top:12px; right:12px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--orange); background:var(--orange-soft); padding:3px 8px; border-radius:999px; }
.plan__name{ font-size:15px; font-weight:800; }
.plan__price{ margin:6px 0 12px; display:flex; align-items:baseline; gap:5px; }
.plan__amt{ font-size:1.5rem; font-weight:800; }
.plan__per{ font-size:12px; color:var(--muted); }
.plan__features{ list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:7px; flex:1; }
.plan__features li{ display:flex; align-items:flex-start; gap:7px; font-size:12.5px; color:var(--ink); }
.plan__features li svg{ width:14px; height:14px; color:var(--green); flex:none; margin-top:1px; }
.plan__btn{ padding:10px; border-radius:10px; background:var(--orange); color:#fff; font-weight:700; font-size:13px; border:none; cursor:pointer; }
.plan__btn:hover:not(:disabled){ filter:brightness(.96); }
.plan__btn:disabled{ cursor:default; }
.plan__btn--muted{ background:var(--line-2); color:var(--muted); }
.plan__intro-note{ margin:8px 2px 0; color:var(--muted); font-size:11.5px; line-height:1.45; text-align:center; }
.billing-cancel{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 24px;padding:15px 17px;border:1px solid #fecaca;border-radius:12px;background:#fffafa}.billing-cancel strong{display:block;margin-bottom:3px;color:#991b1b;font-size:13px}.billing-cancel p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.billing-cancel .btn-delete{flex:none}
.billing-cancel-dialog{width:460px}.billing-cancel-dialog__effects{display:grid;gap:8px;margin:0 0 18px;padding:0;list-style:none}.billing-cancel-dialog__effects li{position:relative;padding-left:22px;color:var(--ink);font-size:12.5px;line-height:1.45}.billing-cancel-dialog__effects li::before{content:'✓';position:absolute;left:0;color:#b91c1c;font-weight:900}.billing-cancel-dialog .banner{margin:0 0 14px}
@media(max-width:620px){.billing-cancel{align-items:stretch;flex-direction:column}.billing-cancel .btn-delete{justify-content:center}}

/* ---- checkout banner ---- */
.banner{ padding:11px 14px; border-radius:10px; font-size:13px; margin-bottom:14px; border:1px solid var(--line); background:var(--line-2); color:var(--ink); }
.banner--ok{ background:var(--green-soft); border-color:#bbe6c8; color:#15803d; }
.banner--warn{ background:var(--orange-soft); border-color:#ffd9c7; color:#b45309; }

/* Full-page product editor */
.pform{ max-width:760px; }
.head-actions{ display:inline-flex; align-items:center; gap:8px; }
.btn-danger{ display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 12px;
  border:1px solid #f0c5c5; border-radius:9px; background:#fdf3f3; color:#dc2626;
  font-weight:600; font-size:13px; font-family:inherit; cursor:pointer; }
.btn-danger svg{ width:15px; height:15px; }
.btn-danger:hover{ background:#dc2626; color:#fff; border-color:#dc2626; }
.backbtn{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;
  color:var(--muted);margin-right:6px;vertical-align:middle}
.backbtn:hover{background:#f5f6f8;color:var(--ink)}
.backbtn svg{width:16px;height:16px;transform:rotate(180deg)}
.detail{display:flex;flex-direction:column;gap:18px;width:100%}
.detail__badges{display:flex;gap:8px;flex-wrap:wrap}
.detail__tags{display:flex;gap:6px;flex-wrap:wrap}
.detail__tags a.tag{cursor:pointer}
.detail__tags a.tag:hover{background:var(--orange);color:#fff}
.detail__meta{color:var(--muted);font-size:13px}
.detail__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;
  border:1px solid var(--line);border-radius:12px;padding:16px}
.detail__section{font-size:14px;font-weight:600;margin:4px 0 0}
.detail__list{display:flex;flex-direction:column;gap:6px}
.detail__row{display:flex;align-items:center;gap:12px;padding:10px 12px;
  border:1px solid var(--line);border-radius:10px;color:var(--ink);
  transition:border-color .12s ease,background .12s ease}
.detail__row:hover{background:#f5f6f8;border-color:var(--orange)}
.detail__row-ico{display:inline-flex;color:var(--muted)}
.detail__row-ico svg{width:18px;height:18px}
.detail__row-name{flex:1;font-weight:500}
.detail__variants{display:flex;flex-direction:column;gap:4px;
  border:1px solid var(--line);border-radius:12px;padding:8px 12px}

/* Blazor unhandled-error toast (markup lives in MainLayout). Global so it does not
   depend on a component-scoped stylesheet. */
#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* --- Shared form feedback + product detail --- */
.muted{ color:var(--muted); margin:.25rem 0 1rem; }
.import{ display:flex; gap:.5rem; margin-bottom:1rem; }
.import--stack{ flex-direction:column; align-items:stretch; }
.import--stack .addbtn{ justify-content:center; }
/* Activity-log filter + generic table pager. */
.logfilter{ padding:9px 12px; border:1px solid var(--line); border-radius:10px; font-size:13px;
  font-family:inherit; color:var(--ink); background:#fff; cursor:pointer; }
.logfilter:focus{ outline:none; border-color:var(--orange); }
.activity-details{position:relative;width:min(900px,calc(100vw - 40px));max-height:calc(100dvh - 40px);overflow:auto;background:#fff;border-radius:16px;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.activity-details__close{position:absolute;top:14px;right:14px;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--muted);cursor:pointer}.activity-details__close:hover{color:var(--ink);background:var(--line-2)}.activity-details__close svg{width:17px;height:17px}
.activity-details__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-right:42px;margin-bottom:18px}.activity-details__head h2{margin:0 0 4px;font-size:18px}.activity-details__head p{margin:0;color:var(--muted);font-size:12.5px}
.activity-details__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}.activity-details__grid>div{display:flex;flex-direction:column;gap:4px;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fafbfc}.activity-details__grid span{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}.activity-details__grid strong,.activity-details__grid code,.activity-details__grid a{font-size:12.5px;overflow-wrap:anywhere;white-space:normal}.activity-details__wide{grid-column:1/-1}
.activity-details h3{margin:0 0 8px;font-size:13px}.activity-details__json{max-height:360px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;padding:14px;border-radius:10px;background:#0f172a;color:#e2e8f0;font-size:12px}.activity-details__actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:16px}.activity-details__feedback{margin:0 0 12px;color:#15803d;font-weight:600}.activity-details__feedback--error{color:#dc2626}
@media(max-width:700px){.activity-details__grid{grid-template-columns:1fr}.activity-details__wide{grid-column:auto}}
.tpager{ display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:12px; }
.tpager__info{ font-size:12.5px; color:var(--muted); }
.import__url{ flex:1; padding:.6rem .75rem; border:1px solid var(--line); border-radius:8px; font-size:.95rem; }
.import__ok{ padding:.6rem .9rem; border-radius:8px; background:var(--green-soft); color:var(--green); margin-bottom:1rem; }
.import__error{ color:var(--orange); }
.import__after{ display:flex; gap:.5rem; margin-top:1rem; }
.detail__gallery{ display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0; }
.detail__img{ width:120px; height:120px; object-fit:cover; border:1px solid var(--line); border-radius:8px; background:#fff; }
.detail__desc{ width:calc(100% - 28px); margin:1rem 28px 1rem 0; line-height:1.5; color:var(--ink);
  max-height:640px; overflow-y:auto; scrollbar-gutter:stable; padding:.75rem 1rem;
  border:1px solid var(--line); border-radius:8px; background:#fff; }
.detail__desc img{ max-width:100%; height:auto; }
@media (max-width:560px){.detail__desc{width:calc(100% - 14px);margin-right:14px}}
.detail__specs-head{ font-weight:600; margin:1rem 0 .5rem; }
.detail__specs-head--row{ display:flex; align-items:center; gap:12px; }
.detail__specs-head--row .addbtn{ margin-left:0; }
.addbtn--sm{ height:30px; padding:0 12px; font-size:12px; }
.addbtn--sm svg{ width:13px; height:13px; }
.detail__specs{ border-collapse:collapse; width:100%; max-width:640px; }
.detail__specs th, .detail__specs td{ text-align:left; padding:.4rem .6rem; border-bottom:1px solid var(--line-2); vertical-align:top; }
.detail__specs th{ width:40%; color:var(--muted); font-weight:500; }

/* Product cards open their own detail page on click. */
.pcard--clickable{ cursor:pointer; }
.pcard--clickable:hover{ border-color:var(--faint); box-shadow:0 2px 10px rgba(0,0,0,.06); }

/* --- Product image slider --- */
.slider{ margin:1rem 0; max-width:50%; }
.slider__stage{ position:relative; display:flex; align-items:center; justify-content:center;
  background:var(--line-2); border:1px solid var(--line); border-radius:12px; padding:.5rem; min-height:200px; }
.slider__main{ max-width:100%; max-height:50vh; object-fit:contain; border-radius:8px; cursor:zoom-in; }
.slider__nav{ position:absolute; top:50%; transform:translateY(-50%); width:38px; height:38px;
  border:1px solid var(--line); background:#fff; border-radius:50%; font-size:1.4rem; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--ink); }
.slider__nav:hover{ border-color:var(--faint); }
.slider__nav--prev{ left:.6rem; }
.slider__nav--next{ right:.6rem; }
.slider__linked{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; margin:.6rem 0; }
.slider__linked-label{ color:var(--muted); font-size:.85rem; }
.vchip{ padding:.2rem .55rem; border:1px solid var(--line); border-radius:999px; font-size:.8rem; background:#fff; }
.slider__thumbs{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.6rem; }
.slider__thumb{ width:64px; height:64px; padding:0; border:2px solid transparent; border-radius:8px;
  overflow:hidden; cursor:pointer; background:#fff; }
.slider__thumb.on{ border-color:var(--orange); }
.slider__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

/* --- Lightbox preview --- */
.lightbox{ position:fixed; inset:0; background:rgba(0,0,0,.66); display:flex; align-items:center;
  justify-content:center; z-index:1000; padding:2rem; }
.lightbox__panel{ position:relative; background:#fff; border-radius:12px; padding:1rem;
  max-width:90vw; max-height:90vh; overflow:auto; display:flex; flex-direction:column; gap:.75rem; }
.lightbox__close{ position:absolute; top:.4rem; right:.6rem; border:none; background:transparent;
  font-size:1.8rem; line-height:1; cursor:pointer; color:var(--muted); }
.lightbox__img{ max-width:80vw; max-height:68vh; object-fit:contain; border-radius:8px; }
.vrow--click{ cursor:pointer; }
.vrow--click:hover{ background:var(--line-2); }
.lightbox__caption{ text-align:center; color:var(--ink); font-size:.95rem; }
.lightbox__caption strong{ color:var(--orange); }
.lightbox__variants-head{ font-weight:600; margin-bottom:.25rem; }
.lightbox__novariant{ color:var(--muted); font-size:.9rem; }

/* Variant card main-image thumbnail */
/* --- Order edit page form --- */
.oform{ max-width:820px; }
.oform__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem 1rem; margin-bottom:1rem; }
.oform__wide{ grid-column:1 / -1; }
.oform__foot{ display:flex; justify-content:flex-end; gap:.6rem; margin-top:1.2rem; }
.oform__foot .btn-cancel{ height:38px; padding:0 16px; border:1px solid var(--line); border-radius:9px; font-weight:600; color:var(--ink); }
.oform__foot .btn-cancel:hover{ background:#f5f6f8; }
.oform__foot .btn-save{ height:38px; padding:0 20px; border-radius:9px; background:var(--orange); color:#fff;
  font-weight:600; box-shadow:0 6px 14px rgba(255,91,20,.3); }
.oform__foot .btn-save:hover{ filter:brightness(.97); }
.oform__foot .btn-save:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; }
/* Read-only value box (e.g. profile distributor level) */
.readonly-box{ display:flex; align-items:center; gap:8px; min-height:38px; }
.readonly-box__empty{ color:var(--muted); }
/* Keep the row chevron in tables small */
.otable .chev{ color:var(--faint); display:inline-flex; }
.otable .chev svg{ width:16px; height:16px; }

/* Profile logo editor */
.logo-edit{ display:flex; align-items:center; gap:14px; }
.logo-edit__preview{ width:64px; height:64px; border-radius:14px; overflow:hidden; flex:none;
  background:var(--orange-soft); color:var(--orange); display:grid; place-items:center; font-weight:700; font-size:24px;
  border:1px solid var(--line); }
.logo-edit__preview img{ width:100%; height:100%; object-fit:cover; }
.logo-edit__actions{ display:flex; gap:8px; }
.logo-edit__btn{ height:34px; padding:0 13px; border-radius:9px; border:1px solid var(--line); background:#fff;
  font-weight:600; font-size:12.5px; color:var(--ink); display:inline-flex; align-items:center; cursor:pointer; }
.logo-edit__btn:hover{ background:#f5f6f8; }
.logo-edit__file{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.logo-edit__err{ color:#dc2626; }

/* Distributor details hero */
.dist-hero{ display:flex; gap:16px; align-items:flex-start; background:#fff; border:1px solid var(--line);
  border-radius:14px; padding:18px; margin-bottom:14px; }
.dist-hero__logo{ flex:none; width:72px; height:72px; border-radius:16px; overflow:hidden; background:var(--orange-soft);
  color:var(--orange); display:grid; place-items:center; font-weight:700; font-size:28px; border:1px solid var(--line); }
.dist-hero__logo img{ width:100%; height:100%; object-fit:cover; }
.dist-hero__info{ min-width:0; }
.dist-hero__top{ display:flex; align-items:center; gap:10px; }
.dist-hero__top h2{ margin:0; font-size:1.25rem; }
.dist-hero__meta{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; margin-top:6px;
  font-size:12.5px; color:var(--muted); }
.dist-hero__desc{ margin:.7rem 0 0; color:var(--ink); font-size:.95rem; }
.dist-stats{ margin-bottom:6px; }
.field__hint{ font-size:11px; color:var(--muted); margin-top:.2rem; }
.check{ display:inline-flex; align-items:center; gap:.4rem; cursor:pointer; }
.check input{ width:auto; }
@media(max-width:680px){ .oform__grid{ grid-template-columns:1fr; } }

/* --- Rich product editor (/sourced/new + /edit) --- */
.peditor{ max-width:1100px; }
.peditor__bar{ display:flex; align-items:center; justify-content:space-between; gap:1rem;
  background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px 18px; margin-bottom:16px; }
.peditor__bar-left{ display:flex; align-items:center; gap:12px; min-width:0; }
.peditor__title{ margin:0; font-size:1.15rem; font-weight:700; color:var(--ink); }
.peditor__sub{ margin:2px 0 0; font-size:11.5px; color:var(--muted); }
.peditor__bar-actions{ display:flex; align-items:center; gap:10px; flex:none; }

.peditor .iconbtn{ width:38px; height:38px; border-radius:10px; display:grid; place-items:center;
  border:1px solid var(--line); color:var(--muted); background:#fff; }
.peditor .iconbtn:hover:not(:disabled){ background:#f5f6f8; color:var(--ink); }
.peditor .iconbtn:disabled{ opacity:.45; cursor:not-allowed; }
.peditor .iconbtn svg{ width:16px; height:16px; }
.peditor .iconbtn--danger:hover{ color:#dc2626; border-color:#f0c5c5; background:#fdf3f3; }

.peditor .btn-ghost{ display:inline-flex; align-items:center; justify-content:center; height:38px; padding:0 16px;
  border-radius:10px; border:1px solid var(--line); background:#fff; font-weight:600; color:var(--ink); }
.peditor .btn-ghost:hover:not(:disabled){ background:#f5f6f8; }
.peditor .btn-ghost:disabled{ opacity:.5; cursor:not-allowed; }
.peditor .btn-ghost--sm{ height:36px; padding:0 12px; font-size:12.5px; }
.peditor .btn-ghost--block{ width:100%; }
.peditor .btn-primary{ height:38px; padding:0 18px; border-radius:10px; background:var(--orange); color:#fff;
  font-weight:600; box-shadow:0 6px 14px rgba(255,91,20,.3); }
.peditor .btn-primary:hover{ filter:brightness(.97); }

.peditor__body{ display:grid; grid-template-columns:340px 1fr; gap:16px; align-items:start; }
.peditor__left{ display:flex; flex-direction:column; gap:16px; }
.peditor__right{ min-width:0; }

.pcard2{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; }
.pcard2__title{ margin:0; font-size:.95rem; font-weight:700; color:var(--ink); }
.pcard2__desc{ margin:.3rem 0 .9rem; font-size:12px; color:var(--muted); }
.pcard2__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }

.gallery{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.gallery__main{ position:relative; aspect-ratio:1; border-radius:12px; overflow:hidden;
  background:var(--line-2); display:grid; place-items:center; }
.gallery__main img{ width:100%; height:100%; object-fit:cover; }
.gallery__ph{ color:var(--faint); }
.gallery__ph svg{ width:42px; height:42px; }
.gallery__tag{ position:absolute; left:8px; bottom:8px; background:rgba(28,29,34,.7); color:#fff;
  font-size:10px; font-weight:600; padding:2px 8px; border-radius:999px; }
.gallery__grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; align-content:start; }
.gallery__thumb{ position:relative; aspect-ratio:1; border-radius:10px; overflow:hidden; background:var(--line-2); }
.gallery__thumb img{ width:100%; height:100%; object-fit:cover; }
.gallery__add{ aspect-ratio:1; border-radius:10px; border:1.5px dashed var(--faint); color:var(--muted);
  display:grid; place-items:center; background:#fafbfc; }
.gallery__add:hover{ border-color:var(--orange); color:var(--orange); }
.gallery__add svg{ width:18px; height:18px; }
.gallery__del{ position:absolute; top:5px; right:5px; width:22px; height:22px; border-radius:50%;
  background:rgba(28,29,34,.6); color:#fff; display:grid; place-items:center; opacity:0; transition:opacity .15s; }
.gallery__main:hover .gallery__del, .gallery__thumb:hover .gallery__del{ opacity:1; }
.gallery__del svg{ width:11px; height:11px; }
.gallery__url{ display:flex; gap:8px; margin-top:12px; }
.gallery__url input{ flex:1; border:1px solid var(--line); border-radius:9px; height:36px; padding:0 12px;
  font-family:inherit; font-size:12.5px; color:var(--ink); outline:none; background:#fff; }
.gallery__url input:focus{ border-color:var(--orange); }
.gallery__file{ position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; }
.gallery__err{ margin-top:8px; font-size:11.5px; color:#dc2626; }

.switch{ display:inline-flex; align-items:center; gap:10px; cursor:pointer; }
.switch input{ position:absolute; opacity:0; width:0; height:0; }
.switch__track{ position:relative; width:40px; height:22px; border-radius:999px; background:var(--line);
  transition:background .2s; flex:none; }
.switch__track::after{ content:""; position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%;
  background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.2); transition:transform .2s; }
.switch input:checked + .switch__track{ background:var(--orange); }
.switch input:checked + .switch__track::after{ transform:translateX(18px); }
.switch__label{ font-size:13px; font-weight:600; color:var(--ink); }

.related__empty{ color:var(--muted); font-size:12.5px; padding:10px 0 2px; }

.details__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; }
.statuspill{ flex:none; font-size:11px; font-weight:700; padding:.2rem .6rem; border-radius:999px;
  background:var(--line-2); color:var(--muted); }
.statuspill--active{ background:#e9f8ef; color:#15803d; }
.statuspill--draft{ background:#fff4e6; color:#b45309; }
.statuspill--archived{ background:#f1f1f3; color:#6b7280; }

.ptabs{ display:grid; grid-template-columns:1fr 1fr; gap:6px; background:var(--line-2); border-radius:10px;
  padding:4px; margin-bottom:18px; }
.ptab{ height:34px; border-radius:8px; font-weight:600; font-size:13px; color:var(--muted); }
.ptab.on{ background:#fff; color:var(--ink); box-shadow:0 1px 3px rgba(0,0,0,.08); }

.pgrid{ display:grid; grid-template-columns:1fr 1fr; gap:.75rem 1rem; }

.description-templates{ display:flex; flex-direction:column; gap:12px; margin-top:4px; }
.description-templates__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.description-templates__head h4{ margin:0; font-size:13px; font-weight:700; color:var(--ink); }
.description-templates__head p{ margin:3px 0 0; font-size:11.5px; color:var(--muted); }
.description-templates__head .btn-ghost{ gap:6px; flex:none; }
.description-templates__head .btn-ghost svg{ width:14px; height:14px; }
.description-template{ padding:12px; border:1px solid var(--line); border-radius:12px; background:#fafbfc; }
.description-template__head{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-bottom:9px; color:var(--ink); font-size:12px; font-weight:700; }
.description-template__name{ min-width:0; flex:1; height:32px; padding:0 9px; border:1px solid transparent;
  border-radius:8px; background:transparent; color:var(--ink); font:inherit; outline:none; }
.description-template__name:hover{ border-color:var(--line); background:#fff; }
.description-template__name:focus{ border-color:var(--orange); background:#fff;
  box-shadow:0 0 0 3px rgba(255,91,20,.1); }
.description-template__remove{ width:30px; height:30px; display:grid; place-items:center; border-radius:8px;
  color:var(--muted); background:#fff; border:1px solid var(--line); }
.description-template__remove:hover:not(:disabled){ color:#dc2626; border-color:#f0c5c5; background:#fdf3f3; }
.description-template__remove:disabled{ opacity:.4; cursor:not-allowed; }
.description-template__remove svg{ width:14px; height:14px; }
.description-templates .validation-message{ margin:0; color:#dc2626; font-size:11.5px; }
.field--wide{ grid-column:1 / -1; }
.ebay-category-picker{ display:flex; flex-direction:column; gap:8px; }
.ebay-category-picker__search{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.ebay-category-picker__search input{ min-width:0; }
.ebay-category-picker__selected{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid #fdba74; border-radius:10px; background:#fff7ed; color:var(--ink); }
.ebay-category-picker__selected span{ display:flex; min-width:0; flex-direction:column; gap:2px; }
.ebay-category-picker__selected strong{ overflow-wrap:anywhere; font-size:12px; }
.ebay-category-picker__selected small{ color:var(--muted); font-size:10.5px; }
.ebay-category-picker__selected button{ border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:20px; }
.ebay-category-picker__results{ max-height:220px; overflow:auto; border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:0 10px 28px rgba(15,23,42,.1); }
.ebay-category-picker__results button{ display:flex; width:100%; align-items:flex-start; justify-content:space-between; gap:12px; padding:10px 12px; border:0; border-bottom:1px solid var(--line); background:#fff; color:var(--ink); text-align:left; cursor:pointer; }
.ebay-category-picker__results button:last-child{ border-bottom:0; }
.ebay-category-picker__results button:hover{ background:#fff7ed; }
.ebay-category-picker__results small{ flex:none; color:var(--muted); }
.field-error{ color:#dc2626; font-size:11.5px; }
.sourced-variants{ display:flex; flex-direction:column; gap:10px; margin:14px 0; padding-top:14px; border-top:1px solid var(--line); }
.sourced-variant{ padding:12px; border:1px solid var(--line); border-radius:12px; background:#fafbfc; }
.sourced-variant__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.sourced-variant__head strong{ font-size:12px; }
.sourced-variant__head strong span{ display:inline-flex; margin-left:7px; padding:3px 7px; border-radius:999px; background:#fff1eb; color:var(--orange); font-size:10px; font-weight:750; }
.sourced-variant__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.sourced-variant__grid .field{ margin:0; }
.shopify-variant-ids{ padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--surface-soft); }
.shopify-variant-id-row{ display:grid; grid-template-columns:minmax(150px,1fr) minmax(180px,1fr); align-items:center; gap:12px; margin-top:9px; }
.shopify-variant-id-row span{ font-weight:700; overflow-wrap:anywhere; }
.variant-image-picker{ position:relative; }
.variant-image-picker__trigger{ display:grid; width:100%; min-height:40px; grid-template-columns:30px minmax(0,1fr) auto; align-items:center; gap:8px; padding:4px 9px 4px 4px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); text-align:left; cursor:pointer; }
.variant-image-picker__trigger:hover:not(:disabled),.variant-image-picker__trigger[aria-expanded="true"]{ border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,91,20,.1); }
.variant-image-picker__trigger:disabled{ cursor:not-allowed; opacity:.65; }
.variant-image-picker__trigger img,.variant-image-picker__empty{ width:30px; height:30px; border-radius:6px; object-fit:cover; background:#f3f4f6; }
.variant-image-picker__empty{ display:grid; place-items:center; color:var(--muted); }
.variant-image-picker__empty svg{ width:15px; height:15px; }
.variant-image-picker__trigger span:not(.variant-image-picker__empty){ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:600; }
.variant-image-picker__trigger b{ display:grid; width:24px; height:30px; place-items:center; color:var(--muted); font-size:15px; line-height:1; }
.variant-image-picker__menu{ position:absolute; z-index:30; top:calc(100% + 6px); left:0; right:0; display:grid; max-height:220px; grid-template-columns:repeat(auto-fill,minmax(62px,1fr)); gap:6px; padding:7px; overflow:auto; border:1px solid var(--line); border-radius:11px; background:#fff; box-shadow:0 14px 35px rgba(15,23,42,.16); }
.variant-image-picker__menu button{ position:relative; display:flex; min-width:0; flex-direction:column; gap:5px; padding:5px; border:1px solid transparent; border-radius:8px; background:#f8fafc; color:var(--ink); cursor:pointer; }
.variant-image-picker__menu button:hover,.variant-image-picker__menu button.selected{ border-color:var(--orange); background:#fff7ed; }
.variant-image-picker__menu img{ width:100%; aspect-ratio:1; border-radius:6px; object-fit:cover; background:#fff; }
.variant-image-picker__menu span{ overflow:hidden; width:100%; text-overflow:ellipsis; white-space:nowrap; font-size:10.5px; text-align:center; }
.variant-image-picker__menu strong{ position:absolute; top:8px; right:8px; display:grid; width:20px; height:20px; place-items:center; border-radius:50%; background:var(--orange); color:#fff; font-size:11px; }
.field-hint{ display:block; margin-top:4px; color:var(--muted); font-size:10.5px; }
.sourced-specifications{ display:flex; flex-direction:column; gap:9px; margin:14px 0; padding-top:14px; border-top:1px solid var(--line); }
.sourced-specification{ display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr) 38px; align-items:center; gap:8px; }
.sourced-specification>input{ width:100%; min-width:0; height:38px; padding:0 11px; border:1px solid var(--line); border-radius:9px; outline:none; background:#fff; color:var(--ink); font:500 12.5px/1 system-ui,-apple-system,"Segoe UI",sans-serif; transition:border-color .15s ease,box-shadow .15s ease; }
.sourced-specification>input::placeholder{ color:#9ca3af; }
.sourced-specification>input:hover{ border-color:#cbd5e1; }
.sourced-specification>input:focus{ border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,91,20,.1); }
.sourced-specification>.description-template__remove{ width:38px; height:38px; border-radius:9px; }
.variation-attribute-modal{ position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:20px; background:rgba(15,23,42,.52); }
.variation-attribute-modal>section{ width:min(540px,100%); max-height:min(680px,90dvh); padding:22px; overflow:auto; border-radius:16px; background:#fff; box-shadow:0 24px 70px rgba(15,23,42,.28); }
.variation-attribute-modal h2{ margin:0; color:var(--ink); font-size:19px; }
.variation-attribute-modal>section>p{ margin:6px 0 16px; color:var(--muted); font-size:12px; }
.variation-attribute-modal__loading{ padding:28px; color:var(--muted); text-align:center; }
.variation-attribute-modal__list{ display:grid; max-height:300px; grid-template-columns:1fr 1fr; gap:7px; padding:10px; overflow:auto; border:1px solid var(--line); border-radius:10px; }
.variation-attribute-modal__list label,.variation-attribute-modal__custom-check{ display:flex; align-items:center; gap:8px; min-height:34px; color:var(--ink); font-size:12px; cursor:pointer; }
.variation-attribute-modal__list label{ padding:5px 8px; border-radius:7px; background:#f8fafc; }
.variation-attribute-modal__list label:hover{ background:#fff7ed; }
.variation-attribute-modal__list input,.variation-attribute-modal__custom-check input{ accent-color:var(--orange); }
.variation-attribute-modal__custom-check{ margin:12px 0; font-weight:650; }
.variation-attribute-modal__actions{ display:flex; align-items:center; gap:9px; margin-top:18px; }
.variation-attribute-modal__actions .btn-primary,.variation-attribute-modal__actions .btn-ghost{ display:inline-flex; min-width:96px; height:38px; align-items:center; justify-content:center; padding:0 17px; border:1px solid transparent; border-radius:10px; font:700 12.5px/1 system-ui,-apple-system,"Segoe UI",sans-serif; cursor:pointer; transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.variation-attribute-modal__actions .btn-primary{ background:var(--orange); color:#fff; box-shadow:0 5px 14px rgba(255,91,20,.2); }
.variation-attribute-modal__actions .btn-primary:hover:not(:disabled){ background:#ed4d0a; transform:translateY(-1px); }
.variation-attribute-modal__actions .btn-primary:disabled{ opacity:.55; cursor:not-allowed; box-shadow:none; }
.variation-attribute-modal__actions .btn-ghost{ border-color:var(--line); background:#fff; color:var(--ink); }
.variation-attribute-modal__actions .btn-ghost:hover{ border-color:#fdba74; background:#fff7ed; color:var(--orange); }
.detail__description-templates{ display:flex; width:75%; min-width:0; flex-direction:column; gap:12px; }
.detail__description-title{ font-size:13px; font-weight:700; color:var(--ink); }
.detail__description-template{ border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; }
.detail__description-label{ padding:8px 12px; border-bottom:1px solid var(--line); background:#fafbfc;
  color:var(--muted); font-size:11.5px; font-weight:700; }
.detail__description-template .detail__desc{ width:100%; min-width:0; border:0; border-radius:0; margin:0; overflow-wrap:anywhere; }
@media (max-width:760px){.detail__description-templates{width:100%;}}
.detail__variant-thumb{ display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; padding:2px;
  overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--muted); cursor:pointer; }
.detail__variant-thumb img{ display:block; width:100%; height:100%; border-radius:5px; object-fit:cover; }
.detail__variant-thumb:hover{ border-color:var(--orange); box-shadow:0 0 0 2px rgba(255,91,20,.1); }
.detail__variant-thumb--empty{ cursor:default; background:#f8fafc; }
.detail__variant-thumb--empty svg{ width:18px; height:18px; }
.detail__template-access{ padding:10px 12px; border-top:1px solid var(--line); background:#fafbfc; }
.detail__template-access-count{ color:var(--ink); font-size:11.5px; font-weight:700; }
.detail__template-access-empty{ margin-top:3px; color:var(--muted); font-size:11px; }
.detail__template-resellers{ display:flex; flex-wrap:wrap; gap:6px; margin-top:7px; }
.detail__template-reseller{ display:inline-flex; align-items:center; min-height:24px; padding:3px 9px;
  border:1px solid #bbf7d0; border-radius:999px; background:#ecfdf5; color:#15803d; font-size:11px; font-weight:650;
  text-decoration:none; transition:border-color .15s ease, background .15s ease; }
.detail__template-reseller:hover{ border-color:#4ade80; background:#dcfce7; color:#166534; }

/* --- 30-day store management ------------------------------------------------ */
.sm-page{ max-width:1280px; margin:0 auto; }
.sm-lead{ margin:5px 0 0; color:var(--muted); font-size:13px; font-weight:400; }
.sm-empty{ padding:48px 24px; border:1px dashed var(--line); border-radius:14px; color:var(--muted); text-align:center; background:#fff; }
.sm-empty--small{ padding:24px 12px; }
.sm-packages{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:stretch; gap:18px; margin-bottom:28px; }
.sm-package{ position:relative; display:flex; flex-direction:column; min-height:350px; padding:24px; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 10px 30px rgba(31,41,55,.06); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.sm-package::before{ content:""; position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,var(--orange),#ff8a52); opacity:0; }
.sm-package:hover{ transform:translateY(-3px); border-color:#ffd0bb; box-shadow:0 16px 36px rgba(31,41,55,.1); }
.sm-package--featured{ border-color:#ffc4a8; background:linear-gradient(180deg,#fff9f6 0,#fff 38%); }
.sm-package--featured::before{ opacity:1; }
.sm-package__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; }
.sm-package__eyebrow{ color:var(--orange); font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.sm-package h2{ margin:0 0 8px; color:var(--ink); font-size:20px; font-weight:750; line-height:1.3; }
.sm-package__intro{ margin:14px 0 16px; color:var(--muted); font-size:12.5px; line-height:1.55; }
.sm-package__days{ flex:none; padding:5px 10px; border-radius:999px; background:var(--orange-soft); color:var(--orange); font-size:10.5px; font-weight:750; }
.sm-package__price{ min-height:40px; color:var(--ink); font-size:28px; font-weight:800; letter-spacing:-.025em; line-height:1.25; }
.sm-package__features{ display:flex; flex:1; flex-direction:column; gap:9px; margin:0 0 22px; padding:0; color:#5f6470; font-size:12px; list-style:none; }
.sm-package__features li{ position:relative; padding-left:22px; }
.sm-package__features li::before{ content:"\2713"; position:absolute; top:-1px; left:0; display:grid; place-items:center; width:16px; height:16px; border-radius:50%; background:var(--orange-soft); color:var(--orange); font-size:10px; font-weight:900; }
.sm-package__action{ display:flex; align-items:center; justify-content:center; width:100%; min-height:42px; padding:10px 16px; border:1px solid transparent; border-radius:11px; font-size:12.5px; font-weight:750; text-align:center; text-decoration:none; transition:transform .15s ease,filter .15s ease,background .15s ease; }
.sm-package__action:hover{ transform:translateY(-1px); }
.sm-package__action--primary{ background:var(--orange); color:#fff; box-shadow:0 8px 18px rgba(255,91,20,.2); }
.sm-package__action--primary:hover{ color:#fff; filter:brightness(.96); }
.sm-package__action--secondary{ border-color:#ffc4a8; background:#fff7f2; color:var(--orange); }
.sm-package__action--secondary:hover{ background:var(--orange-soft); color:#e74904; }
.sm-period-list{ display:flex; flex-direction:column; gap:9px; }
.sm-period-card{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); text-align:left; text-decoration:none; }
.sm-period-card:hover,.sm-period-card.on{ border-color:#ffb28f; background:#fff9f6; }
.sm-period-card span:first-child{ display:flex; flex-direction:column; gap:3px; }
.sm-period-card small{ color:var(--muted); font-size:11px; }
.sm-status{ display:inline-flex; align-items:center; width:max-content; padding:4px 9px; border-radius:999px; font-size:10.5px; font-weight:750; text-transform:uppercase; letter-spacing:.035em; }
.sm-status--pending{ background:#fff7df; color:#9a6700; }
.sm-status--active{ background:#e9f8ef; color:#15803d; }
.sm-status--completed{ background:#eef2ff; color:#4f46e5; }
.sm-onboarding-head{ display:flex; justify-content:space-between; gap:20px; padding:18px 20px; margin-bottom:14px; border:1px solid #ffd5c2; border-radius:14px; background:#fff8f4; }
.sm-onboarding-head div{ display:flex; flex-direction:column; gap:4px; }
.sm-onboarding-head span{ color:var(--muted); font-size:12px; }
.sm-form{ display:flex; flex-direction:column; gap:14px; max-width:820px; }
.sm-form fieldset,.sm-panel{ margin:0; padding:18px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.sm-form legend{ padding:0 8px; color:var(--ink); font-size:14px; font-weight:750; }
.sm-form label{ display:flex; flex-direction:column; gap:5px; color:var(--muted); font-size:11.5px; font-weight:650; }
.sm-required{ color:var(--orange); font-size:13px; font-weight:800; }
.sm-form__submit{ display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:44px;
  padding:11px 18px; border-radius:11px; background:var(--orange); color:#fff; font-size:13px; font-weight:750;
  box-shadow:0 8px 18px rgba(255,91,20,.22); transition:transform .15s ease,filter .15s ease,opacity .15s ease; }
.sm-form__submit:hover:not(:disabled){ transform:translateY(-1px); filter:brightness(.96); }
.sm-form__submit:disabled{ cursor:not-allowed; opacity:.65; }
.sm-form__submit .spinner{ width:15px; height:15px; border-color:rgba(255,255,255,.4); border-top-color:#fff; }
.sm-form__footer{ position:sticky; z-index:5; bottom:-1px; display:flex; align-items:center; justify-content:space-between;
  gap:18px; margin-top:2px; padding:14px; border:1px solid #ffd3bf; border-radius:13px; background:rgba(255,250,247,.96);
  box-shadow:0 -8px 24px rgba(31,41,55,.08); backdrop-filter:blur(8px); }
.sm-form__footer-note{ max-width:360px; margin-left:auto; color:#5f6470; font-size:11.5px; font-weight:600; line-height:1.45; text-align:right; }
.sm-form__footer .sm-form__submit{ flex:none; width:auto; min-width:220px; }
.sm-form--checkout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; gap:22px; max-width:none; }
.sm-form--checkout>.sm-form__fields{ display:flex; flex-direction:column; gap:14px; min-width:0; }
.sm-checkout-card{ position:sticky; top:0; display:flex; flex-direction:column; gap:16px; min-width:0; padding:26px;
  border:1px solid #ffc9af; border-radius:18px; background:linear-gradient(145deg,#fff9f6 0%,#fff 58%);
  box-shadow:0 14px 36px rgba(31,41,55,.09); }
.sm-checkout-card__eyebrow{ color:var(--orange); font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.sm-checkout-card h2{ margin:0; color:var(--ink); font-size:21px; line-height:1.3; }
.sm-checkout-card__price{ display:flex; align-items:baseline; gap:7px; padding-bottom:17px; border-bottom:1px solid var(--line); }
.sm-checkout-card__price strong{ color:var(--ink); font-size:32px; line-height:1; letter-spacing:-.03em; }.sm-checkout-card__price span{ color:var(--muted); font-size:12px; }
.sm-checkout-card__features{ display:flex; flex-direction:column; gap:10px; margin:0; padding:0; color:#5f6470; font-size:12px; list-style:none; }
.sm-checkout-card__features li{ position:relative; padding-left:23px; }.sm-checkout-card__features li::before{ content:"\2713"; position:absolute; left:0; color:var(--green); font-weight:900; }
.sm-checkout-card .sm-terms{ margin:2px 0 0; }.sm-checkout-card .sm-form__submit{ width:100%; }.sm-checkout-card .sm-form__footer-note{ max-width:none; margin:0; text-align:center; }
.sm-form input,.sm-form textarea,.sm-form select{ width:100%; min-height:38px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); font:inherit; }
.sm-form textarea{ min-height:78px; resize:vertical; }
.sm-form fieldset{ display:flex; flex-direction:column; gap:13px; }
.sm-form .sm-check{ flex-direction:row; align-items:center; color:var(--ink); }
.sm-form .sm-check input{ width:16px; min-height:16px; }
.sm-form--compact{ gap:10px; margin-top:12px; }
.sm-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.sm-info,.sm-terms{ padding:12px 14px; border:1px solid #bae6fd; border-radius:10px; background:#f0f9ff; color:#075985; font-size:12px; line-height:1.55; }
.sm-terms{ border-color:var(--line); background:#fafbfc; color:var(--muted); }
.sm-actions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.sm-hero{ display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:16px; padding:22px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(135deg,#fff 0%,#fff8f4 100%); }
.sm-hero h2{ margin:10px 0 4px; font-size:24px; }
.sm-hero p{ margin:0; color:var(--muted); }
.sm-days{ display:flex; flex-direction:column; align-items:center; min-width:105px; padding:14px; border-radius:13px; background:var(--orange); color:#fff; }
.sm-days strong{ font-size:32px; line-height:1; }.sm-days span{ margin-top:4px; font-size:11px; }
.sm-counter-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:16px 0; }
.sm-counter-grid>div{ display:flex; flex-direction:column; gap:4px; padding:16px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.sm-counter-grid strong{ font-size:24px; }.sm-counter-grid span{ color:var(--muted); font-size:11px; }
.sm-financials{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:16px 0; }
.sm-financials>div{ display:flex; justify-content:space-between; gap:15px; padding:16px 18px; border-radius:12px; background:#121217; color:#fff; }
.fin-chart-card{ margin:18px 0 22px; padding:20px 22px 16px; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:var(--shadow-sm); }
.fin-chart-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.fin-chart-head h2{ margin:0; font-size:18px; }
.fin-chart-head p{ margin:4px 0 0; color:var(--muted); font-size:13px; }
.fin-chart-tools{ display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.fin-chart-toggle{ display:inline-flex; padding:3px; border:1px solid var(--line); border-radius:10px; background:#f7f8fa; }
.fin-chart-toggle button{ min-height:30px; padding:0 12px; border:0; border-radius:7px; background:transparent; color:var(--muted); font-size:11.5px; font-weight:800; cursor:pointer; }
.fin-chart-toggle button.active{ background:var(--orange); color:#fff; box-shadow:0 2px 7px rgba(241,79,31,.22); }
.fin-chart-legend{ display:flex; flex-wrap:wrap; gap:14px; color:var(--muted); font-size:12px; font-weight:700; }
.fin-chart-legend span{ display:inline-flex; align-items:center; gap:6px; }
.fin-chart-key{ width:10px; height:10px; border-radius:3px; }
.fin-chart-key--paid{ background:var(--orange); }
.fin-chart-key--expected{ background:#22a06b; }
.fin-chart{ display:grid; grid-template-columns:repeat(12,minmax(38px,1fr)); gap:10px; height:230px; margin-top:18px; overflow-x:auto; }
.fin-chart--weekly{ grid-template-columns:repeat(4,minmax(72px,1fr)); }
.fin-chart__month{ display:grid; grid-template-rows:18px 1fr 18px; align-items:end; justify-items:center; min-width:38px; }
.fin-chart__value{ color:var(--ink); font-size:10px; font-weight:800; white-space:nowrap; }
.fin-chart__track{ display:flex; align-items:flex-end; justify-content:center; gap:3px; width:100%; height:100%; border-bottom:1px solid var(--line); }
.fin-chart__bar{ width:38%; max-width:22px; min-height:3px; border-radius:6px 6px 2px 2px; transition:filter .2s,transform .2s; }
.fin-chart__month:hover .fin-chart__bar{ filter:saturate(1.15); transform:scaleX(1.08); }
.fin-chart__bar--paid{ background:linear-gradient(180deg,#ff9b6f,var(--orange)); }
.fin-chart__bar--expected{ background:linear-gradient(180deg,#6ee7b7,#16865b); }
.fin-chart__label{ align-self:end; color:var(--muted); font-size:11px; font-weight:700; text-transform:capitalize; }
.fin-failed-payments{ display:flex; flex-direction:column; align-items:flex-start; gap:3px; margin-top:7px; padding-top:7px; border-top:1px solid #fecaca; color:#b91c1c; font-size:10.5px; line-height:1.3; white-space:nowrap; }
.fin-failed-payments strong{ font-size:10px; letter-spacing:.02em; }
@media (max-width:640px){ .fin-chart-head{ flex-direction:column; }.fin-chart-tools{ width:100%; align-items:flex-start; } }
.sm-columns,.sm-workspace-grid,.sm-admin-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:16px; align-items:start; }
.sm-admin-grid{ grid-template-columns:minmax(280px,.75fr) minmax(440px,1.25fr); gap:20px; }
.sm-admin-packages{ display:flex; flex-direction:column; gap:9px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 8px 24px rgba(31,41,55,.04); }
.sm-admin-packages__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:3px; padding:0 2px 10px; border-bottom:1px solid var(--line); color:var(--ink); }
.sm-admin-packages__head>strong{ font-size:13px; }.sm-admin-packages__head>span{ min-width:24px; padding:3px 7px; border-radius:999px; background:var(--orange-soft); color:var(--orange); font-size:10.5px; font-weight:800; text-align:center; }
.sm-admin-package{ display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; min-height:68px; padding:12px 13px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); text-align:left; transition:border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.sm-admin-package:hover{ border-color:#ffc4a8; background:#fffaf7; }.sm-admin-package.on{ border-color:var(--orange); background:#fff7f2; box-shadow:0 0 0 3px rgba(255,91,20,.08); }
.sm-admin-package__copy,.sm-admin-package__aside{ display:flex; flex-direction:column; gap:4px; min-width:0; }.sm-admin-package__copy{ flex:1; }.sm-admin-package__copy strong{ overflow:hidden; font-size:12.5px; text-overflow:ellipsis; white-space:nowrap; }.sm-admin-package small{ color:var(--muted); font-size:10.5px; }
.sm-admin-package__aside{ flex:none; align-items:flex-end; }.sm-admin-package__aside>strong{ font-size:12px; }.sm-admin-package__aside small{ padding:3px 7px; border-radius:999px; font-size:9.5px; font-weight:750; }.sm-admin-package__aside .is-active{ background:var(--green-soft); color:#15803d; }.sm-admin-package__aside .is-inactive{ background:#f3f4f6; color:#6b7280; }
.sm-admin-editor{ padding:22px; border-radius:16px; box-shadow:0 8px 24px rgba(31,41,55,.04); }.sm-admin-editor__head{ display:flex; align-items:center; gap:11px; padding-bottom:15px; margin-bottom:2px; border-bottom:1px solid var(--line); }.sm-admin-editor__head h2{ margin:0 0 2px; font-size:16px; }.sm-admin-editor__head p{ margin:0; color:var(--muted); font-size:11.5px; }.sm-admin-editor__icon{ display:grid; place-items:center; flex:none; width:36px; height:36px; border-radius:10px; background:var(--orange-soft); color:var(--orange); font-size:17px; font-weight:800; }
.sm-panel h2{ margin:0 0 12px; font-size:16px; }.sm-panel__head{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.sm-instructions{ display:grid; grid-template-columns:minmax(130px,.55fr) 1fr; gap:0; margin:0; font-size:12px; }
.sm-instructions dt,.sm-instructions dd{ margin:0; padding:9px 0; border-bottom:1px solid var(--line); }
.sm-instructions dt{ color:var(--muted); }.sm-instructions dd{ color:var(--ink); font-weight:600; white-space:pre-wrap; }
.sm-activity{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.sm-activity li{ display:grid; grid-template-columns:10px 1fr; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); }
.sm-activity li>span{ width:8px; height:8px; margin-top:5px; border-radius:50%; background:var(--orange); }
.sm-activity li div{ display:flex; flex-direction:column; gap:3px; }.sm-activity strong{ font-size:11.5px; }.sm-activity small{ color:var(--muted); font-size:10.5px; }
.sm-disclaimer{ margin:20px 0 0; padding-top:15px; border-top:1px solid var(--line); color:var(--muted); font-size:10.5px; line-height:1.5; }
.sm-staff-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.sm-staff-card{ display:flex; flex-direction:column; gap:8px; padding:16px; border:1px solid var(--line); border-radius:13px; background:#fff; color:var(--ink); text-decoration:none; }
.sm-staff-card:hover{ border-color:#ffb28f; box-shadow:0 8px 20px rgba(31,41,55,.06); }
.sm-staff-card__top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }.sm-staff-card p{ margin:0; color:var(--muted); font-size:11.5px; }
.sm-staff-meta{ display:flex; flex-wrap:wrap; gap:8px; }.sm-staff-meta span{ padding:5px 7px; border-radius:7px; background:#f7f8fa; color:var(--muted); font-size:10px; }
.sm-staff-summary{ display:flex; align-items:center; flex-wrap:wrap; gap:13px; padding:12px 14px; border:1px solid var(--line); border-radius:11px; background:#fff; font-size:11.5px; }
.sm-instruction-panel{ margin-top:14px; }.sm-instruction-panel summary{ cursor:pointer; font-weight:750; }
.sm-order-list{ display:flex; flex-direction:column; gap:7px; margin-top:10px; }
.sm-order{ display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:10px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--ink); text-align:left; }
.sm-order:hover{ background:#fff8f4; }.sm-order span:first-child{ display:flex; flex-direction:column; gap:2px; }.sm-order small{ color:var(--muted); font-size:10px; }
.sm-task-section{ margin:15px 0 7px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.04em; }
.sm-task{ display:grid; grid-template-columns:1fr auto; gap:8px; padding:10px; margin-bottom:7px; border:1px solid var(--line); border-radius:10px; }
.sm-task>div{ display:flex; flex-direction:column; gap:3px; }.sm-task small{ color:var(--muted); font-size:10px; }.sm-task p{ grid-column:1/-1; margin:0; color:#9a6700; font-size:10.5px; }
.sm-task--blocked{ border-color:#f4d37c; background:#fffaf0; }.sm-task--done{ opacity:.7; }.sm-done{ color:#15803d; font-size:11px; font-weight:700; }
.sm-hard-block{ color:#b91c1c; font-size:11px; font-weight:700; }

@media(max-width:1000px){
  .sm-packages,.sm-staff-grid{ grid-template-columns:1fr 1fr; }
  .sm-counter-grid{ grid-template-columns:repeat(3,1fr); }
}
@media(max-width:720px){
  .sm-packages,.sm-staff-grid,.sm-columns,.sm-workspace-grid,.sm-admin-grid,.sm-financials{ grid-template-columns:1fr; }
  .sm-counter-grid{ grid-template-columns:1fr 1fr; }
  .sm-form-row{ grid-template-columns:1fr; }
  .sm-hero{ align-items:flex-start; }.sm-days{ min-width:82px; }
  .sm-form__footer{ align-items:stretch; flex-direction:column; gap:10px; }.sm-form__footer .sm-form__submit{ width:100%; }
  .sm-form__footer-note{ max-width:none; margin-left:0; text-align:center; }
  .sm-form--checkout{ grid-template-columns:1fr; }.sm-checkout-card{ position:static; }
}

@media print{
  .topbar,.rail,.nav,.upsell,.sm-no-print,.sm-actions,.impersonation-banner{ display:none !important; }
  .frame,.body,.main{ display:block !important; width:100% !important; height:auto !important; margin:0 !important; padding:0 !important; background:#fff !important; }
  .sm-report{ max-width:none; padding:0; }.sm-report .sm-panel,.sm-report .sm-counter-grid>div{ break-inside:avoid; box-shadow:none; }
  .sm-report__head{ border-bottom:2px solid #111; padding-bottom:14px; }
}

@media(max-width:900px){
  .peditor__body{ grid-template-columns:1fr; }
  .pgrid{ grid-template-columns:1fr; }
}

/* --- Messages / chat --- */
.chat{ display:grid; grid-template-columns:300px 1fr; gap:16px; height:calc(100dvh - 145px); min-height:420px; overflow:hidden; }
.chat__list{ background:#fff; border:1px solid var(--line); border-radius:14px; overflow-y:auto; padding:8px; }
.chat__new{ display:flex; align-items:center; justify-content:center; gap:6px; width:100%; height:38px; margin-bottom:6px;
  border-radius:10px; background:var(--orange-soft); color:var(--orange); font-weight:600; font-size:12.5px; }
.chat__new svg{ width:14px; height:14px; }
.chat__picker{ border:1px solid var(--line); border-radius:10px; padding:6px; margin-bottom:8px; background:#fafbfc; }
.chat__picker-head{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  color:var(--muted); padding:6px 8px; }
.chat__empty{ color:var(--muted); font-size:12.5px; text-align:center; padding:24px 12px; }
.contact{ display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:9px 10px;
  border-radius:10px; color:var(--ink); }
.contact:hover{ background:#f5f6f8; }
.contact.on{ background:var(--orange-soft); }
.contact__avatar{ flex:none; width:36px; height:36px; border-radius:50%; background:var(--indigo); color:#fff;
  display:grid; place-items:center; font-weight:700; font-size:13px; }
.contact__body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.contact__top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.contact__name{ font-weight:600; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.contact__time{ flex:none; font-size:10.5px; color:var(--muted); }
.contact__sub{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.contact__preview{ font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.contact__badge{ flex:none; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--orange);
  color:#fff; font-size:10.5px; font-weight:700; display:grid; place-items:center; }

.chat__main{ background:#fff; border:1px solid var(--line); border-radius:14px; display:flex; flex-direction:column; min-width:0; min-height:0; overflow:hidden; }
.chat__placeholder{ margin:auto; text-align:center; color:var(--muted); }
.chat__placeholder .ph-ico{ font-size:30px; opacity:.5; }
.chat__head{ display:flex; flex:none; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid var(--line); }
.chat__name{ font-weight:700; color:var(--ink); }
.user-profile-link{ color:var(--orange); cursor:pointer; text-decoration:none; outline:none; }
.user-profile-link:hover,.user-profile-link:focus-visible{ text-decoration:underline; }
.chat__role{ display:flex; align-items:center; gap:4px; margin-top:2px; }
.chat__thread{ flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:18px; display:flex; flex-direction:column; gap:10px; }
.bubble{ max-width:72%; padding:8px 12px; border-radius:14px; font-size:13px; line-height:1.4; }
.bubble__body{ white-space:pre-wrap; word-break:break-word; }
.bubble__time{ font-size:10px; margin-top:3px; opacity:.7; }
.bubble--theirs{ align-self:flex-start; background:var(--line-2); color:var(--ink); border-bottom-left-radius:4px; }
.bubble--mine{ align-self:flex-end; background:var(--orange); color:#fff; border-bottom-right-radius:4px; }
/* Attached product card inside a message bubble */
.bubble__product{ display:flex; align-items:center; gap:8px; margin-top:7px; padding:7px; border-radius:10px;
  background:rgba(255,255,255,.18); }
.bubble--theirs .bubble__product{ background:#fff; border:1px solid var(--line); }
.bubble__product:hover{ filter:brightness(.97); }
.bubble__product-thumb{ flex:none; width:38px; height:38px; border-radius:8px; overflow:hidden; background:#fff;
  display:grid; place-items:center; color:var(--muted); }
.bubble__product-thumb img{ width:100%; height:100%; object-fit:cover; }
.bubble__product-thumb svg{ width:18px; height:18px; }
.bubble__product-name{ font-size:12.5px; font-weight:600; line-height:1.25; }
.bubble--mine .bubble__product-name{ color:#fff; }
.bubble--theirs .bubble__product-name{ color:var(--ink); }
/* Application status + accept/reject inside a bubble */
.bubble__appl{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:7px; }
.appl-badge{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  padding:.15rem .5rem; border-radius:999px; background:rgba(255,255,255,.25); }
.bubble--theirs .appl-badge{ background:var(--line); color:var(--muted); }
.appl-badge--accepted{ background:#e9f8ef !important; color:#15803d; }
.appl-badge--rejected{ background:#fdf3f3 !important; color:#dc2626; }
.bubble__appl-actions{ display:flex; gap:6px; }
.bubble__template-choice{ flex:0 0 100%; display:flex; flex-direction:column; gap:3px; min-width:230px; }
.bubble__template-choice > span{ font-size:11.5px; font-weight:700; }
.bubble__template-choice > small{ font-size:10.5px; line-height:1.25; opacity:.75; }
.bubble__template-choice select{ width:100%; height:32px; padding:0 30px 0 9px; border-radius:8px;
  border:1px solid rgba(255,255,255,.55); background:#fff; color:var(--ink); font:600 11.5px var(--font); }
.bubble--theirs .bubble__template-choice select{ border-color:var(--line); }
.bubble__assigned-template{ flex:0 0 100%; font-size:10.5px; line-height:1.3; opacity:.8; }
.appl-btn{ height:26px; padding:0 12px; border-radius:8px; font-weight:600; font-size:11.5px; }
.appl-btn--accept{ background:#fff; color:#15803d; }
.appl-btn--reject{ background:rgba(255,255,255,.2); color:#fff; border:1px solid rgba(255,255,255,.5); }
.bubble--theirs .appl-btn--accept{ background:#15803d; color:#fff; }
.bubble--theirs .appl-btn--reject{ background:#fff; color:#dc2626; border:1px solid #f0c5c5; }

/* Resale links (reseller's listings for a product) */
.resale{ max-width:760px; }
.resale__empty{ color:var(--muted); font-size:12.5px; padding:6px 0 10px; }
.resale__list{ list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:8px; }
.resale__item{ display:flex; align-items:center; gap:10px; padding:8px 10px; border:1px solid var(--line);
  border-radius:10px; background:#fff; }
.resale__site{ flex:none; font-size:10.5px; font-weight:700; padding:.15rem .5rem; border-radius:999px;
  background:var(--line-2); color:var(--muted); }
.resale__site--aliexpress{ background:#fff1e9; color:#e0481f; }
.resale__site--ebay{ background:#eef3ff; color:#2f57c7; }
.resale__site--shopify{ background:#e9f8ef; color:#15803d; }
.resale__url{ flex:1; min-width:0; font-size:12.5px; color:var(--indigo); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.resale__url:hover{ text-decoration:underline; }
.resale__del{ flex:none; width:26px; height:26px; border-radius:7px; color:var(--muted); display:grid; place-items:center; }
.resale__del:hover{ color:#dc2626; background:#fdf3f3; }
.resale__del svg{ width:12px; height:12px; }
.resale__add{ display:flex; gap:8px; flex-wrap:wrap; }
.resale__select{ flex:none; height:38px; border:1px solid var(--line); border-radius:9px; padding:0 10px;
  font-family:inherit; font-size:12.5px; color:var(--ink); background:#fff; }
.resale__add input{ flex:1; min-width:180px; height:38px; border:1px solid var(--line); border-radius:9px; padding:0 12px;
  font-family:inherit; font-size:12.5px; color:var(--ink); outline:none; }
.resale__add input:focus{ border-color:var(--orange); }
.resale__add .btn-save{ flex:none; height:38px; display:inline-flex; align-items:center; gap:6px; padding:0 16px;
  border-radius:9px; background:var(--orange); color:#fff; font-weight:600; }
.resale__add .btn-save svg{ width:15px; height:15px; }
.resale__add .btn-save:disabled{ opacity:.5; cursor:not-allowed; }

/* Reseller-detail product block */
.rprod{ border:1px solid var(--line); border-radius:12px; padding:14px; margin-bottom:12px; background:#fff; max-width:760px; }
.rprod__head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; color:var(--ink); }
.rprod__thumb{ flex:none; width:40px; height:40px; border-radius:9px; overflow:hidden; background:var(--line-2);
  display:grid; place-items:center; color:var(--muted); }
.rprod__thumb img{ width:100%; height:100%; object-fit:cover; }
.rprod__thumb svg{ width:18px; height:18px; }
.rprod__name{ font-weight:700; }
.rprod__head:hover .rprod__name{ color:var(--orange); }

/* Identity cell: logo/avatar + name (reseller & distributor lists) */
.idcell{ display:flex; align-items:center; gap:10px; }
.idcell__logo{ flex:none; width:32px; height:32px; border-radius:8px; overflow:hidden; background:var(--orange-soft);
  color:var(--orange); display:grid; place-items:center; font-weight:700; font-size:13px; }
.idcell__logo img{ width:100%; height:100%; object-fit:cover; }
.chat__composer{ position:relative; z-index:2; display:flex; flex:none; gap:10px; padding:14px 18px; border-top:1px solid var(--line); background:#fff; box-shadow:0 -8px 20px rgba(31,41,55,.04); }
.chat__composer input{ flex:1; border:1px solid var(--line); border-radius:10px; height:40px; padding:0 14px;
  font-family:inherit; font-size:13px; color:var(--ink); outline:none; }
.chat__composer input:focus{ border-color:var(--orange); }
.chat__composer .btn-primary{ height:40px; padding:0 18px; border-radius:10px; background:var(--orange); color:#fff;
  font-weight:600; box-shadow:0 6px 14px rgba(255,91,20,.3); }
.chat__composer .btn-primary:disabled{ opacity:.5; box-shadow:none; cursor:not-allowed; }

@media(max-width:760px){
  .sourced-variant__grid{ grid-template-columns:1fr 1fr; }
  .ebay-category-picker__search{ grid-template-columns:1fr; }
  .chat{ grid-template-columns:1fr; height:calc(100dvh - 145px); min-height:520px; overflow:visible; }
  .chat__list{ max-height:190px; }
  .chat__main{ min-height:320px; }
  .chat__composer{ padding:10px; }
}

/* ============================================================
   Responsive — tablet & mobile
   ============================================================ */
@media (max-width:900px){
  .grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:768px){
  /* Collapse the 3-column frame to a single column; submenu hidden */
  .body{ grid-template-columns:1fr !important; }
  .nav{ display:none !important; }

  /* Icon rail becomes a fixed bottom navigation bar */
  .rail{
    position:fixed; left:0; right:0; bottom:0; top:auto; z-index:50;
    flex-direction:row; align-items:center; justify-content:space-around;
    gap:2px; height:56px; padding:6px 8px; overflow-x:auto;
    border-right:none; border-top:1px solid var(--line); background:#fff;
  }
  .rail .spacer,
  .rail .rail-toggle,
  .rail .collapse-btn{ display:none !important; }
  .rail__scroll,
  .rail__footer{ display:contents; }
  .rail .ri-text,
  .frame.rail-expanded .rail .ri-text{ display:none !important; }
  .rail button.ri,
  .frame.rail-expanded .rail button.ri{ width:42px; height:42px; padding:0; justify-content:center; flex:none; }
  .frame.rail-expanded .rail{ align-items:center; padding:6px 8px; }
  .rail [data-tip]::after,
  .rail [data-tip]::before{ display:none !important; }

  /* Main fills the width, with room for the bottom bar */
  .main{ padding:14px 14px calc(56px + 16px); }
  .main__head h1{ font-size:16px; }

  /* Topbar: drop the centred search, breadcrumb and name block */
  .topbar{ gap:8px; padding:0 12px; }
  .qsearch{ display:none; }
  .whoami{ display:none; }
  .sep, .crumb{ display:none; }

  /* Stack card / KPI grids */
  .grid{ grid-template-columns:1fr; }
  .kpis{ grid-template-columns:repeat(2,1fr); }

  /* Wide tables scroll horizontally instead of overflowing the page */
  .otable, .wtable{ display:block; overflow-x:auto; white-space:nowrap; }

  /* Side drawer takes the full screen width */
  .drawer{ width:100vw; max-width:100vw; }
}

@media (max-width:430px){
  .kpis{ grid-template-columns:1fr; }
}

/* --- Settings: API keys --- */
.keys__new{ display:flex; gap:10px; margin:14px 0 18px; }
.keys__new input{ flex:1; border:1px solid var(--line); border-radius:10px; height:40px; padding:0 14px;
  font-family:inherit; font-size:13px; color:var(--ink); outline:none; }
.keys__new input:focus{ border-color:var(--orange); }
.keys__new .btn-save{ flex:none; height:40px; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:0 16px; border-radius:10px; background:var(--orange); color:#fff; font-weight:600; white-space:nowrap;
  box-shadow:0 6px 14px rgba(255,91,20,.3); }
.keys__new .btn-save svg{ width:15px; height:15px; }
.keys__new .btn-save:hover:not(:disabled){ filter:brightness(.97); }
.keys__new .btn-save:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; }
.keys__reveal{ border:1px solid #bbe6c8; background:#f1faf3; border-radius:12px; padding:14px; margin-bottom:18px; }
.keys__reveal-notice{ display:flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:#15803d; margin-bottom:8px; }
.keys__reveal-notice svg{ width:14px; height:14px; }
.keys__reveal-value{ width:100%; border:1px solid var(--line); border-radius:8px; height:38px; padding:0 12px;
  font-family:ui-monospace, monospace; font-size:13px; color:var(--ink); background:#fff; }
.keys__prefix{ font-family:ui-monospace, monospace; font-size:12px; color:var(--muted); }
.keys__keycell{ display:inline-flex; align-items:center; gap:8px; }
.keys__keycell .dots{ width:26px; height:26px; border-radius:7px; display:inline-grid; place-items:center; color:var(--muted); flex:none; }
.keys__keycell .dots:hover{ background:var(--line-2); color:var(--ink); }
.keys__keycell .dots svg{ width:15px; height:15px; }
.keys__limit{ border:1px solid var(--line); background:var(--line-2); border-radius:10px;
  padding:10px 14px; margin:14px 0 18px; font-size:12.5px; color:var(--muted); }

/* Products: "Sold on eBay" ribbon + view-on-store link */
.pcard{ position:relative; }
.pribbon{ position:absolute; top:12px; right:-30px; transform:rotate(38deg); z-index:2;
  background:#16a34a; color:#fff; font-size:10px; font-weight:800; text-transform:uppercase;
  letter-spacing:.04em; padding:3px 34px; box-shadow:0 2px 8px rgba(22,163,74,.35); pointer-events:none; }
.pribbon--inline{ position:static; transform:none; padding:3px 10px; border-radius:999px; box-shadow:none; pointer-events:auto; }
.ebay-view{ display:inline-flex; align-items:center; margin-left:auto; padding:4px 12px; border-radius:999px;
  font-size:11.5px; font-weight:700; color:#16a34a; background:rgba(22,163,74,.1); text-decoration:none; }
.ebay-view:hover{ background:rgba(22,163,74,.18); }
.pcard__foot .ebay-view{ margin-left:auto; }

/* Order view: money-at-a-glance KPI tiles */
.okpis{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px; margin:16px 0 20px; }
.okpi{ border:1px solid var(--line); border-radius:14px; padding:14px 16px; background:#fff;
  display:flex; flex-direction:column; gap:4px; }
.okpi__label{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.okpi__value{ font-size:20px; font-weight:800; color:var(--ink); }
.okpi--profit{ border-width:2px; }
.okpi--pos{ border-color:#86dfa8; background:#f1faf3; }
.okpi--pos .okpi__value{ color:#15803d; }
.okpi--neg{ border-color:#f3a8a8; background:#fdf1f1; }
.okpi--neg .okpi__value{ color:#dc2626; }

.okpi--click{ cursor:pointer; text-align:left; font-family:inherit; }
.okpi--click:hover{ border-color:var(--orange); }
.okpi__delta{ font-size:11.5px; font-weight:700; }
.okpi__sub{ font-size:11.5px; color:var(--muted); font-weight:600; }

/* Reseller dashboard business KPIs: horizontal card with a soft-coloured icon tile */
.okpis--rich .okpi{ flex-direction:row; align-items:center; gap:13px; padding:15px 16px;
  box-shadow:0 1px 2px rgba(16,24,40,.05); }
.okpi__ico{ width:42px; height:42px; border-radius:12px; display:grid; place-items:center; flex:none; }
.okpi__ico svg{ width:19px; height:19px; }
.okpi__body{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.kpi__ico--red{ background:#fdecec; color:#dc2626; }
.kpi__ico--slate{ background:#eef1f5; color:#475569; }

/* Dashboard: monthly profit bar chart */
.mchart{ display:flex; gap:14px; align-items:stretch; padding:14px 6px 6px; height:190px; }
.mchart__col{ flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0; }
.mchart__col--link{ appearance:none; border:0; padding:0; background:transparent; color:inherit;
  font:inherit; cursor:pointer; border-radius:9px; }
.mchart__col--link:hover .mchart__bar{ filter:saturate(1.12) brightness(.96); transform:translateY(-2px); }
.mchart__col--link:hover .mchart__label{ color:var(--ink); }
.mchart__col--link:focus-visible{ outline:2px solid var(--accent); outline-offset:4px; }
.mchart__val{ font-size:11.5px; font-weight:700; color:var(--ink); }
.mchart__barwrap{ flex:1; width:100%; max-width:56px; display:flex; align-items:flex-end; }
.mchart__bar{ width:100%; border-radius:8px 8px 4px 4px; background:linear-gradient(180deg, #ff5b14, #f6a23c);
  min-height:2px; transition:height .3s ease, transform .18s ease, filter .18s ease; }
.mchart__bar--neg{ background:linear-gradient(180deg, #ef4444, #f87171); }
.mchart__label{ font-size:11px; font-weight:600; color:var(--muted); text-transform:capitalize; }

/* Order view: item cell with product thumbnail */
.oitem-prod{ display:inline-flex; align-items:center; gap:10px; }
.oitem-prod__thumb{ width:40px; height:40px; border-radius:8px; object-fit:cover; flex:none;
  border:1px solid var(--line); background:#f4f5f7; }
.oitem-prod__name{ font-weight:600; }
.oitem-nocat{ display:block; margin-top:3px; font-size:12px; font-weight:400; color:#b45309; }

/* Order view: side-by-side money panels (eBay earnings + AliExpress purchase) */
.opanels{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.opanel{ flex:1 1 300px; min-width:0; }
.opanel .detail__specs-head{ margin-top:0; }

/* Order view: eBay money receipt */
.oreceipt{ border:1px solid var(--line); border-radius:14px; background:#fff; padding:6px 18px; }
.oreceipt__row{ display:flex; justify-content:space-between; gap:16px; padding:9px 0;
  font-size:13.5px; border-bottom:1px dashed var(--line-2); }
.oreceipt__row:last-child{ border-bottom:none; }
.oreceipt__row--minus span:last-child{ color:var(--muted); }
.dispute-refund span:last-child{color:#15803d;font-weight:700}
.dispute-summary{display:inline-flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.dispute-chip{background:#fff7ed;color:#c2410c}
.oreceipt__row--total{ font-weight:700; border-top:1px solid var(--line); }
.oreceipt__row--profit{ font-weight:800; font-size:15px; }
.oreceipt__row--profit.profit-pos span:last-child{ color:#15803d; }
.oreceipt__row--profit.profit-neg span:last-child{ color:#dc2626; }
.oreceipt__linkcell{ display:inline-flex; align-items:center; gap:6px; }
.oreceipt__linkcell .dots{ width:22px; height:22px; }
.oreceipt__linkcell .dots svg{ width:13px; height:13px; }

/* Orders: per-item supplier source links (nested under the item row) */
.oitem-sources td{ background:var(--line-2); padding:8px 14px 12px !important; }
.oitem-sources__label{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  color:var(--muted); margin-bottom:6px; }

/* Orders: fulfilment pills + tracking history + fees */
.fpill{ display:inline-flex; align-items:center; justify-content:center; margin-left:6px;
  min-width:18px; height:18px; padding:0 5px; border-radius:999px; font-size:10px; font-weight:800; vertical-align:middle; }
.fpill svg{ width:11px; height:11px; }
.fpill--tracked{ background:#dcf5e4; color:#16a34a; }
.fpill--notrack{ background:#feecdc; color:#d97706; }
.fpill--delayed{ background:#fee2e2; color:#dc2626; text-transform:uppercase; letter-spacing:.03em; }
.tracklog{ list-style:none; margin:0; padding:6px 0; display:flex; flex-direction:column; gap:6px; }
.tracklog__item{ display:flex; gap:12px; align-items:baseline; font-size:12.5px; }
.tracklog__when{ flex:none; color:var(--muted); font-size:11.5px; min-width:130px; }
.tracklog__what code{ font-family:ui-monospace, monospace; font-size:11.5px; background:var(--line-2);
  padding:1px 6px; border-radius:6px; }
.ofees label{ display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--muted); }

/* Invoice detail drawer: download button */
.invoice__dl{ margin:18px 0 0; width:100%; justify-content:center; text-decoration:none; }
.invoice__dl svg{ width:15px; height:15px; }

/* --- Settings: saved messages (templates) --- */
.mtpl__editor{ border:1px solid var(--line); border-radius:12px; padding:14px; margin:14px 0 18px; }
.mtpl__editor .field{ margin-bottom:10px; }
.mtpl__editor .field:last-of-type{ margin-bottom:0; }
.mtpl__editor label{ display:block; font-size:12px; font-weight:600; color:var(--muted); margin-bottom:5px; }
.mtpl__editor input, .mtpl__editor textarea{ width:100%; border:1px solid var(--line); border-radius:10px; padding:9px 12px;
  font-family:inherit; font-size:13px; color:var(--ink); outline:none; resize:vertical; background:#fff; }
.mtpl__editor input:focus, .mtpl__editor textarea:focus{ border-color:var(--orange); }
.mtpl__placeholders{ display:block; margin-top:6px; font-size:11.5px; color:var(--muted); }
.ltpl__default{ display:flex; align-items:center; gap:8px; margin-top:10px; font-size:13px; color:var(--ink); cursor:pointer; }
.ltpl__default input{ accent-color:var(--orange); width:15px; height:15px; }
.ltpl__badge{ display:inline-block; margin-left:8px; padding:1px 8px; border-radius:999px; font-size:10.5px; font-weight:700;
  background:rgba(255,91,20,.12); color:var(--orange); vertical-align:middle; }
.ltpl__badge--global{ background:rgba(37,99,235,.12); color:#2563eb; }
.ltpl__limit{ align-self:center; margin-right:auto; font-size:12px; color:var(--muted); }
/* Inline editing on the order view's item lines. */
.oinline{ width:90px; padding:5px 8px; border:1px solid var(--line); border-radius:7px; font-size:12.5px;
  font-family:inherit; color:var(--ink); background:#fff; text-align:right; }
.oinline:focus{ outline:none; border-color:var(--orange); }
.oinline--qty{ width:58px; }
.oinline--track{ width:150px; text-align:left; }
.ostatus-select{ padding:4px 10px; border:1px solid var(--line); border-radius:999px; font-size:12px;
  font-weight:600; font-family:inherit; color:var(--ink); background:#fff; cursor:pointer; }
.ostatus-select:focus{ outline:none; border-color:var(--orange); }
.ltpl__preview{ list-style:none; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; }
.ltpl__preview iframe{ display:block; width:100%; height:320px; border:0; }

/* Templates page: editor + list on the left, live preview in the free right column */
.ltpl-layout{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.ltpl-layout__main{ flex:1 1 480px; min-width:0; max-width:860px; }
.ltpl-layout__side{ flex:1 1 380px; min-width:320px; position:sticky; top:16px; }
.ltpl-layout__side .detail__specs-head{ margin-top:0; }
.ltpl__preview--side iframe{ height:calc(100vh - 220px); min-height:420px; }
.mtpl__editor-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:12px; }
.mtpl__editor-actions .btn-save{ height:38px; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:0 16px; border-radius:10px; background:var(--orange); color:#fff; font-weight:600;
  box-shadow:0 6px 14px rgba(255,91,20,.3); }
.mtpl__editor-actions .btn-save svg{ width:15px; height:15px; }
.mtpl__editor-actions .btn-save:hover:not(:disabled){ filter:brightness(.97); }
.mtpl__editor-actions .btn-save:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; }
.mtpl__editor-actions .btn-cancel{ height:38px; padding:0 14px; border-radius:10px; border:1px solid var(--line);
  background:#fff; color:var(--muted); font-weight:600; }

.mtpl__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.mtpl__item{ display:flex; align-items:flex-start; gap:12px; border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.mtpl__item.editing{ border-color:var(--orange); background:var(--orange-soft); }
.mtpl__item-main{ flex:1; min-width:0; }
.mtpl__item-title{ font-size:13.5px; font-weight:600; color:var(--ink); }
.mtpl__item-body{ font-size:12.5px; color:var(--muted); margin-top:3px; white-space:pre-wrap;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.mtpl__item-actions{ flex:none; display:flex; gap:4px; }
.mtpl__item-actions .dots svg{ width:15px; height:15px; }

/* --- Settings: billing --- */
.plancard{ display:flex; align-items:center; justify-content:space-between; gap:12px; max-width:760px; margin-bottom:18px; }
.plancard__name{ font-size:1.3rem; font-weight:700; color:var(--ink); margin-top:2px; }
.planpill{ flex:none; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  padding:.25rem .7rem; border-radius:999px; background:var(--line-2); color:var(--muted); }
.planpill--pro{ background:var(--orange-soft); color:var(--orange); }
.planpill--enterprise{ background:#eef2ff; color:var(--indigo); }

.detail__badges{ display:flex; align-items:center; gap:.6rem; }
.status-select{ padding:.3rem .6rem; border:1px solid var(--line); border-radius:7px;
  background:#fff; font-size:12.5px; color:var(--ink); cursor:pointer; }

.pcard{ overflow:hidden; }
.pcard__img{ display:block; width:100%; max-width:100%; height:180px; object-fit:cover; border-radius:8px; flex:0 0 auto; }
.pcard__img--empty{ display:flex; align-items:center; justify-content:center; background:var(--line-2); color:var(--faint); }
.pcard__img--empty svg{ width:48px; height:48px; }

/* --- Rich text editor (description) --- */
.rte{ border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; }
.rte__toolbar{ display:flex; flex-wrap:wrap; align-items:center; gap:2px; padding:.35rem .5rem;
  border-bottom:1px solid var(--line); background:var(--line-2); }
.rte__toolbar button{ min-width:30px; height:28px; padding:0 .4rem; border:1px solid transparent;
  background:transparent; border-radius:5px; cursor:pointer; font-size:.85rem; color:var(--ink); }
.rte__toolbar button:hover{ background:#fff; border-color:var(--line); }
.rte__sep{ width:1px; height:18px; background:var(--line); margin:0 4px; }
.rte__editor{ min-height:200px; max-height:420px; overflow-y:auto; padding:.6rem .8rem; line-height:1.5; outline:none; }
.rte__editor:focus{ outline:none; }
.rte__editor h1{ font-size:1.4rem; margin:.4rem 0; }
.rte__editor h2{ font-size:1.2rem; margin:.4rem 0; }
.rte__editor h3{ font-size:1.05rem; margin:.4rem 0; }
.rte__upload{display:inline-flex;align-items:center;justify-content:center;min-width:48px;height:28px;padding:0 .5rem;
  border:1px solid transparent;border-radius:5px;background:transparent;font-size:12px;font-weight:600;cursor:pointer}
.rte__upload:hover{background:#fff;border-color:var(--line)}
.rte__upload input{display:none}
.rte__mode{margin-left:auto!important;font-weight:700;color:var(--orange)!important}
.rte__mode.on{background:var(--orange-soft)!important}
.rte__source{display:block;width:100%;min-height:300px;max-height:520px;padding:.8rem;border:0;outline:0;resize:vertical;
  background:#17181c;color:#f8fafc;font:12.5px/1.55 Consolas,'Courier New',monospace}
.rte__hidden{display:none!important}
.rte__hint,.rte__status{display:block;margin-top:5px;color:var(--muted);font-size:11.5px}
.rte__status{color:var(--green);font-weight:600}.rte__status--error{color:#dc2626}
.rte__editor .hb-card{margin:18px 0;padding:20px;border:1px solid #e5e7eb;border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(16,24,40,.08)}
.rte__editor .hb-card h3,.rte__editor .hb-callout p{margin-top:0}.rte__editor .hb-card p,.rte__editor .hb-callout p{margin-bottom:0}
.rte__editor .hb-callout{margin:18px 0;padding:15px 17px;border:1px solid;border-left-width:5px;border-radius:10px}.rte__editor .hb-callout strong{display:block;margin-bottom:4px}
.rte__editor .hb-callout--danger{color:#991b1b;background:#fef2f2;border-color:#fecaca}.rte__editor .hb-callout--warning{color:#92400e;background:#fffbeb;border-color:#fde68a}
.rte__editor .hb-callout--info{color:#075985;background:#f0f9ff;border-color:#bae6fd}.rte__editor .hb-callout--success{color:#166534;background:#f0fdf4;border-color:#bbf7d0}
.rte__editor .hb-button{display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;border-radius:9px;color:#fff!important;background:#f15a24;font-weight:750;text-decoration:none;box-shadow:0 5px 14px rgba(241,90,36,.25)}
.rte__editor .hb-table-wrap{max-width:100%;margin:18px 0;overflow-x:auto;border:1px solid #e5e7eb;border-radius:10px}.rte__editor .hb-table-wrap table{width:100%;border-collapse:collapse}.rte__editor .hb-table-wrap th,.rte__editor .hb-table-wrap td{padding:10px;border-bottom:1px solid #e5e7eb;text-align:left}.rte__editor .hb-table-wrap th{background:#f8fafc}
.rte__editor .hb-steps{counter-reset:hb-step;margin:18px 0;padding:0;list-style:none}.rte__editor .hb-steps li{position:relative;min-height:42px;margin:0 0 14px;padding-left:48px}.rte__editor .hb-steps li::before{counter-increment:hb-step;content:counter(hb-step);position:absolute;left:0;top:0;display:grid;width:32px;height:32px;place-items:center;border-radius:50%;color:#fff;background:#f15a24;font-weight:800}.rte__editor .hb-steps strong,.rte__editor .hb-steps span{display:block}
.rte__editor .hb-checklist{margin:18px 0;padding:0;list-style:none}.rte__editor .hb-checklist li{position:relative;margin:8px 0;padding-left:28px}.rte__editor .hb-checklist li::before{content:'✓';position:absolute;left:0;color:#15803d;font-weight:900}
.rte__editor .hb-quote{margin:18px 0;padding:16px 20px;border-left:4px solid #f15a24;border-radius:0 10px 10px 0;background:#fff7ed}.rte__editor .hb-quote p{margin-top:0;font-size:1.05em}.rte__editor .hb-quote cite{color:#64748b;font-size:.9em}
.rte__editor .hb-code{margin:18px 0;padding:16px;border-radius:10px;color:#f8fafc;background:#17181c;overflow:auto}.rte__editor .hb-faq{margin:12px 0;padding:13px 16px;border:1px solid #e5e7eb;border-radius:10px;background:#fff}.rte__editor .hb-faq summary{cursor:pointer;font-weight:750}.rte__editor .hb-faq p{margin-bottom:0}

/* --- Orders table --- */
/* Orders list: card-wrapped table with sticky header, zebra rows and sortable columns */
.tablecard{ border:1px solid var(--line); border-radius:14px; background:#fff; overflow:auto;
  max-height:calc(100vh - 240px); box-shadow:0 1px 2px rgba(16,24,40,.05); }
.tablecard .otable th{ position:sticky; top:0; z-index:1; background:#f8f9fb;
  text-transform:uppercase; font-size:10.5px; letter-spacing:.05em; color:var(--muted);
  padding:.7rem .9rem; }
.tablecard .otable td{ padding:.65rem .9rem; }
.tablecard .otable tbody tr:nth-child(even){ background:#fafbfc; }
.tablecard .otable tbody tr:hover{ background:#f3f6fc; }
.tablecard .otable tbody tr:last-child td{ border-bottom:none; }
.otable th.sortable{ cursor:pointer; user-select:none; }
.otable th.sortable:hover{ color:var(--ink); }
.th-sort{ display:inline-block; min-width:12px; margin-left:3px; font-size:9px; color:var(--orange); }

/* Orders list: date-range filter */
.f-dates{ display:flex; align-items:center; gap:6px; }
.f-dates__sep{ color:var(--faint); font-size:12px; }
.filter-date{ height:34px; border:1px solid var(--line); border-radius:9px; padding:0 10px;
  font-family:inherit; font-size:12.5px; color:var(--ink); background:#fff; outline:none; }
.filter-date:focus{ border-color:var(--orange); }

.otable{ width:100%; border-collapse:collapse; font-size:12.5px; }
.otable th{ text-align:left; padding:.55rem .6rem; color:var(--muted); font-weight:600;
  border-bottom:1px solid var(--line); white-space:nowrap; }
.otable td{ padding:.55rem .6rem; border-bottom:1px solid var(--line-2); vertical-align:middle; }
.otable th.num, .otable td.num{ text-align:right; }
.otable tbody tr:hover{ background:var(--line-2); }
.otable__product{ max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.otable__actions{ text-align:right; white-space:nowrap; }
.table-sub{margin-top:2px;color:var(--muted);font-size:11px}
.user-joined-date{white-space:nowrap;color:var(--muted)}
.users-filters{flex-wrap:wrap}
.users-filters .f-search{width:280px;max-width:100%}
.users-tablecard{max-height:calc(100vh - 230px)}
.registration-action{margin-right:4px;padding:4px 8px;border:1px solid transparent;border-radius:7px;background:#fff;font-size:11px;font-weight:700;cursor:pointer}
.registration-action--approve{border-color:#86d1ac;color:#18794e}
.registration-action--reject{border-color:#efb1b1;color:#c53030}
.registration-action--review{border-color:#b8c8ee;color:#315ba8}
.registration-action:disabled{opacity:.5;cursor:default}
.otable__actions .dots{ width:28px; height:28px; border-radius:7px; display:inline-grid; place-items:center; color:var(--muted); }
.otable__actions .dots:hover{ background:#fff; color:var(--ink); }

.src{ display:inline-block; padding:.12rem .5rem; border-radius:999px; font-size:11px; font-weight:600;
  background:var(--line-2); color:var(--ink); }
.src--aliexpress{ background:#fff0e8; color:#e0481f; }
.src--ebay{ background:#eaf1ff; color:#2f6bff; }

.ostatus{ display:inline-block; padding:.12rem .5rem; border-radius:999px; font-size:11px; font-weight:600; }
.ostatus--pending{ background:#fff7e6; color:#b7791f; }
.ostatus--processing{ background:#eef2ff; color:#4f46e5; }
.ostatus--shipped{ background:#eaf1ff; color:#2f6bff; }
.ostatus--delivered{ background:var(--green-soft); color:var(--green); }
.ostatus--cancelled{ background:#fdecec; color:#dc2626; }
.ostatus--refunded{ background:#f3f4f6; color:var(--muted); }
.registration-review{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px;padding:16px 18px;border:1px solid #f0c36c;border-radius:12px;background:#fff9eb}
.registration-review p{margin:4px 0 0;color:var(--muted);font-size:13px}
.registration-review__actions{display:flex;gap:8px;white-space:nowrap}
.registration-review__actions .registration-action{padding:7px 13px;background:#fff;font-size:12px}

/* --- Order line items (drawer) + profit colours --- */
.profit-pos{ color:var(--green); font-weight:600; }
.profit-neg{ color:#dc2626; font-weight:600; }
.addbtn--sm{ padding:.25rem .55rem; font-size:11.5px; }
.oitems{ margin-top:.5rem; border-top:1px solid var(--line); padding-top:.75rem; }
.oitems__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.5rem; font-weight:600; }
.oitems__empty{ color:var(--muted); font-size:12px; padding:.5rem 0; }
.oitem{ border:1px solid var(--line); border-radius:8px; padding:.6rem; margin-bottom:.6rem; background:#fff; }
.oitem__top{ display:flex; gap:.5rem; margin-bottom:.5rem; }
.oitem__name{ flex:1; padding:.4rem .55rem; border:1px solid var(--line); border-radius:6px; }
.oitem__remove{ width:30px; border:1px solid var(--line); border-radius:6px; color:var(--muted); }
.oitem__remove:hover{ color:#dc2626; border-color:#f0c5c5; }
.oitem__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:.45rem; }
.oitem__grid label{ display:flex; flex-direction:column; gap:.2rem; font-size:11px; color:var(--muted); }
.oitem__grid input{ padding:.35rem .45rem; border:1px solid var(--line); border-radius:6px; font-size:12.5px; color:var(--ink); }
.oitem__wide{ grid-column:1 / -1; }
.oitem__profit{ margin-top:.45rem; font-size:12px; text-align:right; }
.oitems__totals{ display:flex; gap:1.2rem; justify-content:flex-end; padding-top:.4rem; font-size:12.5px; }

/* --- Dashboard --- */
.kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:.75rem; margin-bottom:1rem; }
.kpi{ text-align:left; display:flex; flex-direction:column; gap:.2rem; padding:.85rem 1rem;
  border:1px solid var(--line); border-radius:12px; background:#fff; }
button.kpi{ cursor:pointer; }
button.kpi:hover{ border-color:var(--faint); }
.kpi__label{ font-size:11.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; }
.kpi__value{ font-size:1.5rem; font-weight:700; }
.kpi__sub{ font-size:11.5px; color:var(--muted); }
.kpi--warn .kpi__value{ color:#dc2626; }
.kpi--accent{ background:linear-gradient(135deg,#fff,#fff7f3); border-color:#ffd9c7; }
.kpi--accent .kpi__value{ color:var(--orange); }

.widgets{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:.9rem; }
.widget{ border:1px solid var(--line); border-radius:12px; background:#fff; padding:.9rem 1rem; }
.widget--wide{ grid-column:1 / -1; }
.widget__head{ font-weight:600; margin-bottom:.6rem; }
.widget__empty{ color:var(--muted); font-size:12.5px; padding:.4rem 0; }
.dashboard-widget-error { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.75rem; color:#9f1d1d; background:#fff4f4; border:1px solid #ffcaca; border-radius:9px; font-size:12.5px; }
.dashboard-widget-error .btn { flex:0 0 auto; }

.bar{ display:grid; grid-template-columns:120px 1fr 36px; align-items:center; gap:.5rem; margin:.3rem 0; font-size:12px; }
.bar__label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); }
.bar__track{ background:var(--line-2); border-radius:999px; height:10px; overflow:hidden; }
.bar__fill{ display:block; height:100%; background:var(--orange); border-radius:999px; }
.bar__fill--alt{ background:var(--indigo); }
.bar__count{ text-align:right; color:var(--muted); }

.toplist{ margin:0; padding-left:1.1rem; display:flex; flex-direction:column; gap:.4rem; }
.toplist li{ font-size:12.5px; }
.toplist__name{ font-weight:500; }
.toplist__meta{ display:block; color:var(--muted); font-size:11.5px; }

.wtable{ width:100%; border-collapse:collapse; font-size:12.5px; }
.wtable td{ padding:.45rem .5rem; border-bottom:1px solid var(--line-2); }
.wtable__click{ cursor:pointer; }
.wtable__click:hover{ background:var(--line-2); }
.late-badge{ background:#fdecec; color:#dc2626; border-radius:999px; padding:.1rem .5rem; font-weight:600; font-size:11px; }

/* --- Dashboard: trend chip, chart, recent txns, top product thumbs --- */
.trend{ font-size:10.5px; font-weight:600; padding:.05rem .35rem; border-radius:999px; }
.trend--lg{ font-size:12px; padding:.2rem .55rem; }
.trend--up{ background:var(--green-soft); color:var(--green); }
.trend--down{ background:#fdecec; color:#dc2626; }

/* KPI top-right icon */
.kpi{ position:relative; }
.kpi__ico{ position:absolute; top:.7rem; right:.8rem; color:var(--faint); }
.kpi__ico svg{ width:18px; height:18px; }
.kpi--accent .kpi__ico{ color:var(--orange); }

/* Distributor dashboard KPIs: horizontal card with a soft-coloured icon tile on the left. */
.kpis--tiles .kpi{ flex-direction:row; align-items:center; gap:14px; padding:1rem 1.05rem; }
.kpis--tiles .kpi__ico{ position:static; top:auto; right:auto; width:46px; height:46px; border-radius:13px; display:grid; place-items:center; flex:none; }
.kpis--tiles .kpi__ico svg{ width:22px; height:22px; }
.kpis--tiles .kpi__body{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.kpis--tiles .kpi__value{ font-size:1.6rem; line-height:1.1; }
.kpi__ico--indigo{ background:#ecebfe; color:#6d5efc; }
.kpi__ico--green{ background:var(--green-soft); color:var(--green); }
.kpi__ico--orange{ background:var(--orange-soft); color:var(--orange); }
.kpi__ico--blue{ background:#e9f1ff; color:#2f6bff; }

/* Profit overview hero */
.overview__head{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:.75rem; }
.overview__big{ font-size:1.8rem; font-weight:700; line-height:1.1; }
.overview__sub{ font-size:12px; color:var(--muted); margin-top:.15rem; }

.chart{ display:flex; align-items:flex-end; gap:.4rem; height:200px; padding-top:.5rem; }
.chart__col{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:.35rem; height:100%; }
.chart__bar{ width:70%; max-width:34px; background:linear-gradient(180deg,#ffb38f,var(--orange));
  border-radius:6px 6px 0 0; transition:height .3s ease; }
.chart__col:hover .chart__bar{ background:linear-gradient(180deg,var(--orange),#d8430a); }
.chart__x{ font-size:10.5px; color:var(--muted); }

.txn{ display:flex; align-items:center; gap:.6rem; padding:.45rem 0; border-bottom:1px solid var(--line-2); cursor:pointer; }
.txn:hover{ background:var(--line-2); }
.txn__avatar{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
  font-size:12px; font-weight:700; background:var(--line-2); color:var(--ink); flex:0 0 auto; }
.txn__main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.txn__name{ font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.txn__sub{ font-size:11px; color:var(--muted); }
.txn__amt{ font-weight:600; }

.topitem{ display:flex; align-items:center; gap:.6rem; padding:.35rem 0; }
.topitem__img{ width:40px; height:40px; border-radius:8px; object-fit:cover; flex:0 0 auto; border:1px solid var(--line); }
.topitem__img--empty{ display:grid; place-items:center; background:var(--line-2); color:var(--faint); }
.topitem__img--empty svg{ width:20px; height:20px; }
.topitem__body{ display:flex; flex-direction:column; min-width:0; }
.toplist{ list-style:none; margin:0; padding:0; }

/* --- Categories view --- */
.cat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:.9rem; }
.cat-card{ border:1px solid var(--line); border-radius:12px; background:#fff; padding:.5rem; }
.cat-card__head{ display:flex; align-items:center; justify-content:space-between; width:100%;
  padding:.5rem .65rem; border-radius:8px; cursor:pointer; }
.cat-card__head:hover{ background:var(--line-2); }
.cat-card__name{ font-weight:600; }
.cat-card__count{ background:var(--orange-soft); color:var(--orange); border-radius:999px;
  padding:.05rem .5rem; font-size:11px; font-weight:700; }
.cat-card__subs{ display:flex; flex-wrap:wrap; gap:.35rem; padding:.4rem .65rem .55rem; }
.cat-card__subs-label{ width:100%; font-size:10.5px; text-transform:uppercase; letter-spacing:.03em; color:var(--faint); }
.cat-sub{ display:inline-flex; align-items:center; gap:.3rem; padding:.15rem .5rem; border:1px solid var(--line);
  border-radius:999px; font-size:11.5px; background:#fff; }
.cat-sub__count{ color:var(--muted); font-size:10.5px; }

/* --- Category detail editing --- */
.cat-card--link{ text-align:left; cursor:pointer; }
.cat-card--link:hover{ border-color:var(--faint); box-shadow:0 2px 10px rgba(0,0,0,.06); }
.catedit{ display:flex; gap:.5rem; align-items:center; margin-bottom:1rem; }
.catedit__name{ flex:1; max-width:360px; padding:.5rem .65rem; border:1px solid var(--line); border-radius:8px; font-size:14px; font-weight:600; }
.fbtn--danger{ color:#dc2626; }
.fbtn--danger:hover{ border-color:#f0c5c5; }
.sublist{ display:flex; flex-direction:column; gap:.4rem; max-width:520px; margin-bottom:1rem; }
.subrow{ display:flex; gap:.5rem; align-items:center; }
.subrow__name{ flex:1; padding:.4rem .6rem; border:1px solid var(--line); border-radius:7px; }
.subrow__del{ width:32px; height:32px; border:1px solid var(--line); border-radius:7px; color:var(--muted); }
.subrow__del:hover{ color:#dc2626; border-color:#f0c5c5; }

/* --- Order view: clickable row + status timeline --- */
.otable__row--click{ cursor:pointer; }
.timeline{ list-style:none; margin:.5rem 0 0; padding:0 0 0 .25rem; max-width:520px; }
.timeline__item{ display:flex; gap:.7rem; position:relative; padding:0 0 1rem 1rem; border-left:2px solid var(--line); }
.timeline__item:last-child{ border-left-color:transparent; padding-bottom:0; }
.timeline__dot{ position:absolute; left:-7px; top:2px; width:12px; height:12px; border-radius:50%;
  background:var(--faint); box-shadow:0 0 0 3px #fff; }
.timeline__item--current .timeline__dot{ background:var(--orange); }
.timeline__body{ display:flex; flex-direction:column; }
.timeline__status{ font-weight:600; font-size:12.5px; }
.timeline__date{ font-size:11.5px; color:var(--muted); }
.dot--mini{ }
/* colour the dot by status */
.timeline__dot.ostatus--pending{ background:#b7791f; }
.timeline__dot.ostatus--processing{ background:#4f46e5; }
.timeline__dot.ostatus--shipped{ background:#2f6bff; }
.timeline__dot.ostatus--delivered{ background:var(--green); }
.timeline__dot.ostatus--cancelled{ background:#dc2626; }
.timeline__dot.ostatus--refunded{ background:var(--muted); }

/* --- Access control: acting-as switcher, roles & permission matrix --- */
.actas{ display:inline-flex; align-items:center; gap:.4rem; font-size:11.5px; color:var(--muted); }
.actas__label{ text-transform:uppercase; letter-spacing:.03em; }
.actas__select{ padding:.25rem .5rem; border:1px solid var(--line); border-radius:7px; background:#fff; font-size:12px; color:var(--ink); max-width:200px; }

.rolechip{ display:inline-block; padding:.1rem .55rem; border-radius:999px; background:#eef2ff; color:var(--indigo); font-size:11px; font-weight:600; }
.planchip{ display:inline-block; padding:.1rem .55rem; border-radius:999px; background:#f1f5f9; color:#64748b; font-size:11px; font-weight:600; }
.planchip--starter{ background:rgba(255,91,20,.12); color:var(--orange); }
.planchip--premium{ background:#fef3c7; color:#b45309; }
.planchip--trial{ background:rgba(37,99,235,.12); color:#2563eb; margin-left:6px; }
.planchip--trialend{ background:rgba(220,38,38,.12); color:#dc2626; margin-left:6px; }
/* Trial-over paywall + trial button. */
.modal-backdrop{ position:fixed; inset:0; width:100vw; height:100dvh; padding:20px;
  background:rgba(15,23,42,.45); display:flex; align-items:center; justify-content:center;
  overflow-y:auto; z-index:2000; }
.trialend{ position:relative; width:380px; max-width:calc(100vw - 40px); background:#fff; border-radius:16px;
  max-height:calc(100dvh - 40px); overflow-y:auto; flex:none; padding:30px 26px; text-align:center;
  color:var(--ink); box-shadow:0 20px 60px rgba(0,0,0,.25); }
.trialend .upsell__x{ z-index:2; }
.trialend__ico{ font-size:28px; margin-bottom:10px; }
.trialend__title{ font-size:17px; font-weight:800; color:var(--ink); margin-bottom:8px; }
.trialend__desc{ font-size:13px; color:var(--muted); margin-bottom:18px; line-height:1.5; }
/* Generic confirmation dialog (destructive actions). */
.confirmbox{ position:relative; width:380px; max-width:calc(100vw - 40px); background:#fff; border-radius:14px;
  padding:22px; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.confirmbox__title{ font-size:15px; font-weight:800; color:var(--ink); margin-bottom:8px; }
.confirmbox__body{ font-size:13px; color:var(--muted); margin-bottom:16px; line-height:1.5; }
.confirmbox__actions{ display:flex; justify-content:flex-end; gap:8px; }
.supplier-queue-native{ display:none; text-decoration:none; }
html[data-bookwy-supplier-tracking-queue="1"] .supplier-queue-native{ display:inline-flex; }
html[data-bookwy-supplier-tracking-queue="1"] .supplier-queue-legacy{ display:none; }
.otable__actions .btn-clear{margin-left:6px}.otable__actions .user-cleanup{color:#b42318;border-color:#f2b8b5}.otable__actions .user-cleanup:hover:not(:disabled){background:#fff1f0}.cleanup-confirm-label{display:block;margin:14px 0 6px;font-size:12px;font-weight:700;color:var(--ink)}.confirmbox>.input{width:100%;margin-bottom:16px}
.banner--actions{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
/* Section head with an inline pencil toggle: title left, pencil on the same line, right-aligned. */
.specs-head--edit{ display:flex; align-items:center; gap:8px; }
.opanel__editbtn{ flex:none; margin-left:auto; }
/* Card save button (edit mode of the AliExpress / eBay cards). */
.oreceipt__row--save{ border-top:1px solid var(--line); margin-top:8px; padding-top:12px; }
.card-save{ display:inline-flex; align-items:center; justify-content:center; gap:7px; width:100%; height:38px;
  border:none; border-radius:10px; background:var(--orange); color:#fff; font-weight:700; font-size:13px;
  font-family:inherit; cursor:pointer; box-shadow:0 6px 16px rgba(255,91,20,.28); transition:filter .15s ease; }
.card-save:hover{ filter:brightness(1.08); }
.card-save:disabled{ opacity:.6; cursor:default; box-shadow:none; }
.card-save svg{ width:15px; height:15px; }
.oitems-save{ display:flex; justify-content:flex-end; margin-top:10px; }
.oreceipt__feehead{ margin-top:6px; padding-top:8px; border-top:1px dashed var(--line);
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.oreceipt__row--fee{ font-size:12.5px; color:var(--muted); }
.okpi__sub{ display:block; margin-top:2px; font-size:11px; color:var(--muted); }
.fulfillment-order-card{margin:16px 0;padding:18px;border:1px solid #ffd0bf;border-radius:16px;background:linear-gradient(135deg,#fff8f4,#fff);box-shadow:0 8px 24px rgba(255,76,22,.06)}
.fulfillment-order-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}.fulfillment-order-card__head h2{margin:3px 0 0;font-size:18px}.fulfillment-order-card__eyebrow{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--orange)}
.fulfillment-order-lines{display:grid;gap:7px;margin:12px 0}.fulfillment-order-lines>div{display:flex;justify-content:space-between;gap:12px;padding:9px 11px;border-radius:9px;background:#fff;border:1px solid var(--line)}.fulfillment-order-lines small{color:var(--muted)}
.fulfillment-tracking{padding:10px 12px;background:#effaf3;border:1px solid #b8e4c5;border-radius:10px}.fulfillment-proof{display:flex;gap:8px;margin:12px 0;overflow:auto}.fulfillment-proof img{width:72px;height:72px;object-fit:cover;border-radius:9px;border:1px solid var(--line)}
.fulfillment-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.fulfillment-page .fulfillment-actions--client-terms{justify-content:flex-start}.fulfillment-page .client-terms-feedback{margin-top:10px;padding:9px 12px;border-radius:9px;font-size:.88rem;font-weight:700}.fulfillment-page .client-terms-feedback--success{border:1px solid #86d1ac;background:#eefaf4;color:#18794e}.fulfillment-page .client-terms-feedback--error{border:1px solid #f5b7b1;background:#fff1f0;color:#b42318}.fulfillment-confirm{display:grid;gap:9px;margin-top:12px;padding:12px;border-radius:10px;background:#fff;border:1px solid var(--line)}.fulfillment-confirm input,.fulfillment-confirm textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:10px}.fulfillment-errors{margin:8px 0 0;padding-left:20px;color:#b42318}
.fulfillment-costs{display:flex;flex-wrap:wrap;gap:8px 20px;margin:10px 0;color:var(--muted);font-size:13px}.fulfillment-costs strong{color:var(--ink);margin-left:4px}.fulfillment-timeline{display:grid;gap:7px;margin:12px 0;padding:0;list-style:none}.fulfillment-timeline li{display:flex;justify-content:space-between;gap:12px;border-left:3px solid #ff5b22;padding:4px 0 4px 10px;font-size:12px}.fulfillment-timeline span{color:var(--muted);text-align:right}
.okpi__month-total{ display:block; margin-top:5px; padding-top:5px; border-top:1px solid var(--line); color:var(--ink); font-size:11px; }
.okpi__sub strong,.okpi__month-total strong{ font-weight:800; }
.oreceipt__row--sub{ margin-top:-6px; font-size:11.5px; color:var(--muted); }
.plan__btn--trial{ margin-top:8px; background:transparent; border:1px dashed var(--orange); color:var(--orange); }
.plan__btn--trial:hover{ background:rgba(255,91,20,.08); }
/* Distributor tier star (New = grey, Verified = green, Premium = gold) */
.diststar{ display:inline-flex; align-items:center; gap:4px; margin-left:.4rem; font-size:12px; font-weight:700; vertical-align:middle; }
.diststar__icon{ font-size:13px; line-height:1; }
.diststar--new{ color:#94a3b8; }
.diststar--verified{ color:#16a34a; }
.diststar--premium{ color:#f59e0b; }
.permchips{ display:flex; flex-wrap:wrap; gap:.4rem; }
.permchip{ padding:.15rem .55rem; border:1px solid var(--line); border-radius:999px; font-size:11.5px; background:#fff; }

.roles{ display:grid; grid-template-columns:260px 1fr; gap:1rem; align-items:start; }
@media(max-width:760px){ .roles{ grid-template-columns:1fr; } }
.roles__list{ display:flex; flex-direction:column; gap:.35rem; }
.rolebtn{ display:flex; align-items:center; gap:.5rem; width:100%; text-align:left; padding:.55rem .7rem;
  border:1px solid var(--line); border-radius:9px; background:#fff; cursor:pointer; }
.rolebtn:hover{ border-color:var(--faint); }
.rolebtn.on{ border-color:var(--orange); background:var(--orange-soft); }
.rolebtn__name{ font-weight:600; flex:1; }
.rolebtn__tag{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--muted);
  background:var(--line-2); border-radius:999px; padding:.05rem .4rem; }
.rolebtn__count{ font-size:11px; color:var(--muted); }
.roles__editor{ border:1px solid var(--line); border-radius:12px; background:#fff; padding:1rem; }
.roles__head{ display:flex; align-items:center; gap:.5rem; margin-bottom:1rem; }
.matrix{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; }
.matrix__group{ border:1px solid var(--line-2); border-radius:10px; padding:.6rem .75rem; }
.matrix__area{ display:flex; align-items:center; justify-content:space-between; font-weight:600; font-size:12px;
  text-transform:uppercase; letter-spacing:.03em; color:var(--muted); margin-bottom:.5rem; }
.matrix__all{ font-size:10.5px; font-weight:600; color:var(--orange); background:none; cursor:pointer; }
.matrix__row{ display:flex; align-items:center; gap:.5rem; padding:.25rem 0; font-size:12.5px; cursor:pointer; }
.matrix__row--locked{ cursor:default; color:var(--muted); }
.matrix__row input{ width:auto; }
.matrix__key{ margin-left:auto; font-size:10.5px; color:var(--faint); }
.permission-overrides__intro{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:16px;padding:18px 20px;border:1px solid var(--line-2);border-radius:12px;background:#fff}
.permission-overrides__intro p{margin:6px 0 0;color:var(--muted);font-size:13px;max-width:680px}
.permission-overrides__roles{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:12px;color:var(--muted);text-align:right}
.permission-overrides__roles strong{color:var(--text);font-size:13px}
.permission-overrides.matrix{grid-template-columns:repeat(auto-fit,minmax(min(620px,100%),1fr));align-items:start}
.permission-overrides .matrix__group{min-width:0;background:#fff}
.permission-overrides__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,170px) auto;align-items:center;gap:10px;min-width:0;padding:10px 0;border-top:1px solid var(--line-2)}
.permission-overrides__definition{display:flex;align-items:center;flex-wrap:wrap;gap:3px 10px;min-width:0;font-size:12.5px}
.permission-overrides__definition strong{flex:1 1 180px;min-width:0;overflow-wrap:anywhere}
.permission-overrides__definition .matrix__key{flex:0 1 auto;max-width:100%;margin-left:0;overflow-wrap:anywhere}
.permission-source{flex:0 0 100%;color:var(--faint);font-size:10.5px}
.permission-source--role{color:#2563eb}
.permission-overrides__select{display:block;width:100%;min-width:0;min-height:36px;padding:5px 30px 5px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text);font:inherit}
.permission-effective{justify-self:end;white-space:nowrap;padding:4px 8px;border-radius:999px;background:#f3f4f6;color:#6b7280;font-size:10.5px;font-weight:700}
.permission-effective--allowed{background:#ecfdf3;color:#15803d}
.permission-effective--denied{background:#fff1f2;color:#be123c}
.permission-manage-link{width:max-content;display:inline-flex;align-items:center;gap:6px}
@media(max-width:760px){.permission-overrides__intro{flex-direction:column;padding:15px}.permission-overrides__roles{align-items:flex-start;text-align:left}.permission-overrides.matrix{grid-template-columns:1fr}.permission-overrides__row{grid-template-columns:1fr;gap:8px}.permission-effective{justify-self:start}.permission-overrides__definition strong{flex-basis:100%}.permission-overrides__definition .matrix__key{flex-basis:100%}}

/* --- Auth: login screen, signed-in badge, boot --- */
.boot{display:grid;place-items:center;height:100vh;color:var(--muted);font-size:14px}
.login{min-height:100vh;display:grid;place-items:center;padding:24px;
  background:radial-gradient(80% 60% at 50% -10%,var(--orange-soft),transparent 60%),var(--bg)}
.login__card{position:relative;width:100%;max-width:380px;background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:32px;box-shadow:0 24px 60px rgba(20,22,40,.12)}
.login__card--register{max-width:680px}
.login__brand{display:flex;align-items:center;gap:9px;font-weight:700;margin:0 48px 22px 0}
.login__language{position:absolute;z-index:3;top:26px;right:26px}
.login__language .lang__btn{border:1px solid var(--line);background:var(--bg)}
.login__language .lang__btn:hover{border-color:#ffd4c0;background:var(--orange-soft);color:var(--orange)}
.login__mark{width:28px;height:28px;border-radius:8px;object-fit:cover;display:block}
.login__card h1{font-size:1.5rem;margin:0}
.login__sub{color:var(--muted);font-size:.9rem;margin:.3rem 0 1.4rem}
.login__label{display:block;font-size:.8rem;font-weight:600;color:var(--muted);margin:.7rem 0 .3rem}
.login__label-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:.7rem 0 .3rem}
.login__label-row .login__label{margin:0}
.login__text-button,.login__back-link{padding:0;border:0;background:transparent;color:var(--orange);font-size:.78rem;font-weight:650;cursor:pointer;text-decoration:none}
.login__text-button:hover,.login__back-link:hover{text-decoration:underline}
.login__text-button:focus-visible,.login__back-link:focus-visible{outline:2px solid rgba(255,91,20,.3);outline-offset:3px;border-radius:3px}
.login__back-link{display:block;margin:14px auto 0}
.login__input{width:100%;padding:.6rem .7rem;border:1px solid var(--line);border-radius:9px;font-size:.95rem}
.login__input:focus{outline:none;border-color:var(--orange)}
.login__tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin:0 0 22px;background:var(--bg);border-radius:11px}
.login__tabs button{padding:.55rem .7rem;border:0;border-radius:8px;background:transparent;color:var(--muted);font-weight:650;cursor:pointer}
.login__tabs button.is-active{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(20,22,40,.12)}
.login__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.login__card .validation-message{display:block;margin-top:4px;color:#dc2626;font-size:.72rem}
.login__promo{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.login__promo button{padding:0 18px;border:1px solid var(--orange);border-radius:9px;background:#fff;color:var(--orange);font-weight:700;cursor:pointer}
.login__promo button:hover{background:var(--orange-soft)}
.login__promo button:disabled{opacity:.55;cursor:default}
.login__price{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--muted);font-size:.8rem}
.login__price strong{color:var(--ink);font-size:1.05rem;margin-right:4px}
.login__price--promo{border-color:#86d1ac;background:#eefaf4;color:#18794e}
.login__price--promo strong{color:#12663f}
.login__price--invalid{border-color:#f5a5a5;background:#fff1f1;color:#b42318}
.login__price--invalid strong{color:#b42318}
.login__error{margin-top:.8rem;color:#dc2626;font-size:.85rem;background:#fdecec;border-radius:8px;padding:.5rem .7rem}
.login__success{display:flex;flex-direction:column;gap:8px;padding:18px;border:1px solid #86d1ac;border-radius:12px;background:#eefaf4;color:#18794e;line-height:1.45}
.login__success strong{font-size:1.05rem;color:#12663f}
.login__btn{width:100%;margin-top:1.2rem;padding:.7rem;border:none;border-radius:9px;background:var(--orange);
  color:#fff;font-weight:700;font-size:.95rem;cursor:pointer}
.login__btn:hover{background:#e94e0a}
.login__btn:disabled{opacity:.6;cursor:default}
.login__footer{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);text-align:center;font-size:.8rem}
.login__footer a{color:var(--orange);font-weight:650;text-decoration:none}
.login__footer a:hover{text-decoration:underline}
.login__hint{margin-top:1.2rem;text-align:center;font-size:.75rem;color:var(--faint)}
@media(max-width:600px){
  .login{padding:12px}.login__card{padding:24px 18px}.login__grid{grid-template-columns:1fr}.login__price{align-items:flex-start;flex-direction:column;gap:4px}
}

/* Split auth shell: BookwyDrop treatment inspired by the marketing site's clean two-panel flow. */
.auth-shell.login{
  min-height:100vh;display:grid;grid-template-columns:minmax(390px,.9fr) minmax(560px,1.1fr);
  place-items:stretch;padding:0;background:#f7f7f9;
}
.auth-showcase{
  position:sticky;top:0;min-height:100vh;overflow:hidden;padding:48px;
  display:flex;flex-direction:column;justify-content:space-between;color:#fff;
  background:
    radial-gradient(circle at 50% 32%,rgba(255,91,20,.22),transparent 30%),
    radial-gradient(circle at 82% 86%,rgba(255,91,20,.14),transparent 34%),
    linear-gradient(145deg,#16181f 0%,#11131a 48%,#24130d 100%);
}
.auth-showcase::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 78%);
}
.auth-showcase::after{
  content:"";position:absolute;width:360px;height:360px;right:-190px;bottom:-170px;border-radius:50%;
  border:1px solid rgba(255,137,83,.22);box-shadow:0 0 90px rgba(255,91,20,.14);
}
.auth-showcase__brand{position:relative;z-index:2;display:flex;align-items:center;gap:12px;font-size:1.05rem;font-weight:800;letter-spacing:.01em}
.auth-showcase__brand img,.auth-mobile-brand img{width:38px;height:38px;border-radius:11px;object-fit:cover;box-shadow:0 8px 24px rgba(0,0,0,.24)}
.auth-showcase__art{position:relative;z-index:1;align-self:center;width:min(32vw,390px);aspect-ratio:1;margin:-12px 0 -30px;opacity:.96}
.auth-showcase__ring{position:absolute;inset:17%;border:1px solid rgba(255,255,255,.14);border-radius:50%;animation:auth-spin 22s linear infinite}
.auth-showcase__ring::before,.auth-showcase__ring::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 18px rgba(255,91,20,.9)}
.auth-showcase__ring::before{top:13%;left:12%}.auth-showcase__ring::after{right:-4px;top:48%}
.auth-showcase__ring--two{inset:31%;border-color:rgba(255,137,83,.28);animation-duration:15s;animation-direction:reverse}
.auth-showcase__ring--two::before{top:auto;bottom:7%;left:14%;background:#fff;box-shadow:0 0 16px rgba(255,255,255,.55)}
.auth-showcase__ring--two::after{display:none}
.auth-showcase__hub{position:absolute;inset:39%;display:grid;place-items:center;border-radius:24px;background:rgba(255,255,255,.96);box-shadow:0 22px 64px rgba(0,0,0,.32),0 0 45px rgba(255,91,20,.16);transform:rotate(-4deg)}
.auth-showcase__hub img{width:64%;height:64%;object-fit:cover;border-radius:16px;transform:rotate(4deg)}
.auth-showcase__node{position:absolute;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.9);box-shadow:0 0 0 7px rgba(255,255,255,.06);animation:auth-pulse 2.8s ease-in-out infinite}
.auth-showcase__node--one{top:20%;right:18%}.auth-showcase__node--two{bottom:24%;left:13%;animation-delay:.8s}.auth-showcase__node--three{right:9%;bottom:31%;width:8px;height:8px;background:var(--orange);animation-delay:1.4s}
.auth-showcase__content{position:relative;z-index:2;max-width:560px}
.auth-showcase__kicker{display:block;margin-bottom:16px;color:#ff8a55;font-size:.7rem;font-weight:800;letter-spacing:.18em}
.auth-showcase__content h2{max-width:520px;margin:0;font-size:clamp(2rem,3.5vw,3.6rem);line-height:1.06;letter-spacing:-.045em;color:#fff}
.auth-showcase__content p{max-width:510px;margin:18px 0 28px;color:#aeb1bb;font-size:.98rem;line-height:1.7}
.auth-showcase__features{display:flex;flex-wrap:wrap;gap:10px}
.auth-showcase__features span{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.045);color:#d8d9de;font-size:.72rem;font-weight:650}
.auth-showcase__features i{width:6px;height:6px;border-radius:50%;background:var(--orange);box-shadow:0 0 10px rgba(255,91,20,.7)}
.auth-main{position:relative;min-width:0;min-height:100vh;display:grid;place-items:center;padding:72px 48px 44px;overflow:hidden}
.auth-shell--register .auth-main{align-items:start;padding-top:54px;padding-bottom:54px}
.auth-shell .login__language{position:absolute;z-index:5;top:26px;right:30px}
.auth-shell .login__language .lang__btn{min-height:34px;padding:0 10px;border:1px solid #e0e1e5;border-radius:9px;background:#fff;box-shadow:0 3px 10px rgba(20,22,40,.04)}
.auth-shell .login__card{width:100%;max-width:448px;padding:36px 34px;border:1px solid #ebebee;border-radius:17px;box-shadow:0 22px 58px rgba(20,22,40,.11);background:rgba(255,255,255,.98)}
.auth-shell .login__card--register{max-width:760px}
.auth-shell .login__card h1{font-size:1.8rem;line-height:1.15;letter-spacing:-.025em;color:#171920}
.auth-shell .login__sub{margin:.45rem 0 1.7rem;color:#70747f;font-size:.9rem;line-height:1.55}
.auth-shell .login__label{margin:.85rem 0 .38rem;color:#343740;font-size:.76rem;font-weight:700}
.auth-shell .login__label-row{margin:.85rem 0 .38rem}
.auth-shell .login__input{min-height:45px;padding:.68rem .78rem;border:1px solid #d8dae0;border-radius:10px;background:#fff;color:var(--ink);transition:border-color .15s ease,box-shadow .15s ease}
.auth-shell .login__input::placeholder{color:#a7aab3}
.auth-shell .login__input:hover{border-color:#c6c8cf}
.auth-shell .login__input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,91,20,.12)}
.auth-shell .login__password{ position:relative; }
.auth-shell .login__password .login__input{ width:100%; padding-right:44px; }
.auth-shell .login__password-toggle{ position:absolute; top:50%; right:6px; display:inline-flex; width:34px; height:34px;
  align-items:center; justify-content:center; padding:0; transform:translateY(-50%); border:0; border-radius:8px;
  background:transparent; color:#777b86; cursor:pointer; }
.auth-shell .login__password-toggle:hover{ background:#fff3ed; color:var(--orange); }
.auth-shell .login__password-toggle:focus-visible{ outline:2px solid var(--orange); outline-offset:1px; }
.auth-shell .login__password-toggle svg{ width:18px; height:18px; }
.auth-shell .login__text-button{font-size:.75rem}
.auth-shell .login__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.auth-shell .login__promo{gap:9px}
.auth-shell .login__promo button{min-width:112px;border-radius:10px;background:#fff}
.auth-shell .login__price{margin-top:16px;border-radius:10px}
.auth-shell .login__price strong{font-size:.84rem}
.auth-shell .login__btn{min-height:46px;margin-top:1.25rem;padding:.72rem 1rem;border-radius:10px;box-shadow:0 8px 20px rgba(255,91,20,.23);transition:transform .15s ease,background .15s ease,box-shadow .15s ease}
.auth-shell .login__btn:hover:not(:disabled){background:#ea4e0b;box-shadow:0 10px 24px rgba(255,91,20,.28);transform:translateY(-1px)}
.login__switch{display:flex;align-items:center;justify-content:center;gap:5px;flex-wrap:wrap;margin-top:18px;color:#777b85;font-size:.78rem}
.login__switch button{padding:2px 0;color:var(--orange);font-size:inherit;font-weight:750}
.login__switch button:hover{text-decoration:underline}
.auth-shell .login__footer{margin-top:18px;padding-top:14px}
.auth-mobile-brand{display:none;align-items:center;gap:10px;margin-bottom:22px;color:#22242b;font-size:1rem;font-weight:800}
@keyframes auth-spin{to{transform:rotate(360deg)}}
@keyframes auth-pulse{0%,100%{transform:scale(.86);opacity:.55}50%{transform:scale(1.14);opacity:1}}
@media(max-width:1080px){
  .auth-shell.login{grid-template-columns:minmax(340px,.78fr) minmax(520px,1.22fr)}
  .auth-showcase{padding:38px}.auth-showcase__art{width:min(34vw,330px)}
  .auth-showcase__content h2{font-size:2.45rem}.auth-showcase__features{gap:7px}
  .auth-main{padding-left:36px;padding-right:36px}
}
@media(max-width:900px){
  .auth-shell.login{display:block;background:radial-gradient(circle at 50% 0,rgba(255,91,20,.09),transparent 34%),#f7f7f9}
  .auth-showcase{display:none}.auth-main{min-height:100vh;padding:78px 24px 34px;overflow:visible}
  .auth-shell--register .auth-main{padding-top:78px;padding-bottom:34px}
  .auth-mobile-brand{display:flex}.auth-shell .login__card{max-width:520px}.auth-shell .login__card--register{max-width:760px}
}
@media(max-width:650px){
  .auth-main,.auth-shell--register .auth-main{padding:70px 14px 22px}
  .auth-shell .login__language{top:18px;right:16px}
  .auth-shell .login__card,.auth-shell .login__card--register{padding:27px 20px;border-radius:14px}
  .auth-shell .login__grid{grid-template-columns:1fr;gap:0}
  .auth-shell .login__promo{grid-template-columns:1fr}.auth-shell .login__promo button{min-height:42px}
  .auth-shell .login__price{align-items:flex-start;flex-direction:column;gap:4px}
}
@media(prefers-reduced-motion:reduce){.auth-showcase__ring,.auth-showcase__node{animation:none}}
.whoami{display:flex;flex-direction:column;line-height:1.1;margin-left:6px;text-align:right}
.whoami__name{font-size:12px;font-weight:600;color:var(--ink)}
.whoami__role{font-size:10.5px;color:var(--muted)}

/* --- Apps & integrations --- */
.appcard{display:flex;gap:18px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:22px;max-width:640px}
.appcard__icon{width:54px;height:54px;border-radius:13px;flex:none;display:grid;place-items:center;
  background:linear-gradient(160deg,var(--orange-soft),#fff);border:1px solid var(--line);color:var(--orange)}
.appcard__icon svg{width:26px;height:26px}
.appcard__body{flex:1;min-width:0}
.appcard__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.appcard__top h3{margin:0;font-size:1.15rem}
.appcard__tag{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);
  background:var(--line-2);border-radius:999px;padding:.1rem .5rem}
.appcard__desc{color:var(--muted);margin:.5rem 0 1rem;font-size:.95rem}
.appcard__actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.appcard__actions .addbtn{margin-left:0}
.storelink{font-size:.9rem;font-weight:600;color:var(--orange)}
.storelink:hover{text-decoration:underline}
.appcard__install{margin-top:1.1rem}
.appsteps{margin:.4rem 0 0;padding-left:1.2rem;color:var(--ink);font-size:.9rem;display:flex;flex-direction:column;gap:.4rem}

/* --- Profitability analytics --- */
.analytics-head{align-items:flex-start}
.analytics-head h1{margin-bottom:2px}
.analytics-head__sub{margin:0;color:var(--muted);font-size:13px;max-width:760px;line-height:1.45}
.analytics-filters{flex-wrap:wrap}
.analytics-empty{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;border:1px dashed var(--line);border-radius:16px;background:#fff;padding:36px}
.analytics-empty__icon{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;
  color:var(--orange);background:var(--orange-soft);margin-bottom:12px}
.analytics-empty__icon svg{width:26px;height:26px}
.analytics-empty h2{font-size:18px;margin:0 0 6px}
.analytics-empty p{color:var(--muted);max-width:520px;margin:0 0 18px}
.analytics-empty .addbtn{margin-left:0}

.quality{display:flex;align-items:center;gap:14px;padding:13px 15px;border:1px solid var(--line);
  border-radius:13px;background:#fff;margin-bottom:16px}
.quality--good{border-color:#9bd9b2;background:#f3fbf5}
.quality--warn{border-color:#f2cf8f;background:#fffbef}
.quality__meter{width:88px;height:9px;border-radius:999px;background:rgba(15,23,42,.1);overflow:hidden;flex:none}
.quality__meter span{display:block;height:100%;background:var(--orange);border-radius:inherit}
.quality--good .quality__meter span{background:var(--green)}
.quality__body{display:flex;flex-direction:column;gap:1px;font-size:12px;min-width:0}
.quality__body strong{font-size:13px}
.quality__body span{color:var(--muted)}
.quality__note{margin-left:auto;color:#9a5b00;font-size:11.5px;font-weight:600;text-align:right}
.okpis--analytics{grid-template-columns:repeat(5,minmax(150px,1fr))}

/* start-aligned so a short trend list doesn't leave a huge empty box next to the cost panel */
.analytics-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:14px;margin-bottom:22px;align-items:start}
.analytics-panel{min-width:0}
.analytics-panel__meta{font-size:10.5px;color:var(--muted);font-weight:600}
.profit-trend{display:flex;flex-direction:column;gap:8px}
.profit-trend__row{display:grid;grid-template-columns:72px minmax(80px,1fr) 100px 58px;gap:9px;align-items:center;font-size:11.5px}
.profit-trend__month{color:var(--muted);white-space:nowrap}
.profit-trend__track{height:11px;border-radius:999px;background:var(--line-2);overflow:hidden}
.profit-trend__fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#74d49a,var(--green))}
.profit-trend__fill--neg{background:linear-gradient(90deg,#f0a0a0,#dc2626)}
.profit-trend__value{text-align:right;white-space:nowrap}
.profit-trend__orders{text-align:right;color:var(--faint)}

.cost-stack{display:flex;flex-direction:column;gap:14px}
.cost-stack__row{display:flex;flex-direction:column;gap:5px}
.cost-stack__label{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted)}
.cost-stack__label strong{color:var(--ink);font-weight:700}
.cost-stack__track{display:block;height:9px;border-radius:999px;background:var(--line-2);overflow:hidden}
.cost-stack__track span{display:block;height:100%;border-radius:inherit;background:var(--indigo)}
.cost-stack__track--refund span{background:#dc2626}
.missing-box{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:11.5px}
.missing-box>strong{display:block;margin-bottom:7px}
.missing-box__chips,.data-missing{display:flex;flex-wrap:wrap;gap:5px}
.missing-box__chips span,.data-missing span{padding:2px 7px;border-radius:999px;background:#fff3d7;color:#925500;
  border:1px solid #efd59a;font-size:10.5px;font-weight:600}

.analytics-section{margin-top:22px}
.analytics-section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:10px}
.analytics-section__head h2{font-size:15px;margin:0 0 2px}
.analytics-section__head p{font-size:11.5px;color:var(--muted);margin:0}
.data-state{display:inline-flex;padding:2px 7px;border-radius:999px;font-size:10.5px;font-weight:700;white-space:nowrap}
.data-state--complete{background:#e7f8ec;color:#15763a;border:1px solid #b8e5c7}
.data-state--partial{background:#fff3d7;color:#925500;border:1px solid #f3ddaa;cursor:help}
/* Unknown values: a quiet dash instead of a wall of bold em-dashes. */
.num-dash{color:var(--faint);font-weight:400}
.num-approx{color:var(--muted);cursor:help}
/* Incomplete rows recede so complete data carries the table. */
.arow--partial td{opacity:.62}
.arow--partial:hover td{opacity:1}
.a-toggle{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap}
.a-toggle input{width:14px;height:14px;accent-color:var(--orange);cursor:pointer}
.analytics-footnote{font-size:11px;color:var(--faint);line-height:1.45;margin:14px 0 0}

@media(max-width:1050px){
  .okpis--analytics{grid-template-columns:repeat(3,minmax(150px,1fr))}
  .analytics-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .okpis--analytics{grid-template-columns:1fr 1fr}
  .quality{align-items:flex-start;flex-wrap:wrap}
  .quality__note{width:100%;margin-left:102px;text-align:left}
  .profit-trend__row{grid-template-columns:62px minmax(60px,1fr) 88px}
  .profit-trend__orders{display:none}
}
@media(max-width:460px){
  .okpis--analytics{grid-template-columns:1fr}
  .quality__meter{width:60px}
  .quality__note{margin-left:74px}
}

/* Guided reseller onboarding and API-free eBay listing-report import. */
.onboarding-head{align-items:flex-end}
.onboarding-head h1{margin-bottom:4px}
.onboarding-head p{margin:0;color:var(--muted);font-size:12.5px;max-width:720px}
.onboarding-progress__value{font-size:24px;font-weight:800;color:var(--green);letter-spacing:-.04em}
.onboarding-progress{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px 17px;margin-bottom:16px}
.onboarding-progress__copy{display:flex;justify-content:space-between;gap:16px;margin-bottom:10px;font-size:12px}
.onboarding-progress__copy span{color:var(--muted)}
.onboarding-progress__track{height:9px;border-radius:999px;background:var(--line-2);overflow:hidden}
.onboarding-progress__track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#6fd491,var(--green))}
.onboarding-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.onboarding-main{min-width:0}
.onboarding-steps{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.onboarding-step{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);background:#fff;border-radius:12px}
.onboarding-step--complete{border-color:#b8e5c7;background:#f5fcf7}
.onboarding-step__number{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:50%;background:var(--line-2);font-weight:800;font-size:12px;color:var(--muted)}
.onboarding-step--complete .onboarding-step__number{background:var(--green);color:#fff}
.onboarding-step__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.onboarding-step__body strong{font-size:12.5px}
.onboarding-step__body span{font-size:11px;color:var(--muted)}
.onboarding-step .fbtn{margin-left:auto;flex:none}
.listing-import{padding:17px}
.listing-import__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.listing-import__head h2{font-size:16px;margin:0 0 3px}
.listing-import__head p{font-size:11.5px;color:var(--muted);margin:0}
.api-free-badge{font-size:10.5px;font-weight:700;white-space:nowrap;padding:4px 8px;border-radius:999px;color:#315f99;background:#eaf3ff;border:1px solid #c8def8}
.listing-import__guide{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-left:3px solid var(--orange);background:var(--orange-soft);font-size:11.5px;margin-bottom:12px}
.listing-import__guide span{color:var(--muted)}
.csv-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:128px;border:1.5px dashed #bdc7d4;border-radius:13px;background:#fafbfd;cursor:pointer;text-align:center;padding:18px;transition:.15s}
.csv-drop:hover{border-color:var(--orange);background:#fffaf6}
.csv-drop__icon{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#fff;border:1px solid var(--line);color:var(--orange);margin-bottom:3px}
.csv-drop__icon svg{width:17px;height:17px}
.csv-drop strong{font-size:12.5px}
.csv-drop span:last-child{font-size:10.5px;color:var(--muted)}
.csv-drop__input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.listing-import>.empty,.listing-import>.banner{margin-top:12px;margin-bottom:0}
.banner--error{background:#fff1f1;border-color:#f1bcbc;color:#a82323}
.csv-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}
.csv-summary__item{display:flex;flex-direction:column;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#fafbfd}
.csv-summary__item strong{font-size:17px}
.csv-summary__item span{font-size:10.5px;color:var(--muted)}
.csv-summary__item--new{border-color:#b8e5c7;background:#f3fbf5}
.csv-summary__item--update{border-color:#f2cf8f;background:#fffbef}
.csv-summary__item--skip{border-color:#efc1c1;background:#fff6f6}
.listing-preview-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:16px 0 9px}
.listing-preview-head h3{font-size:14px;margin:0 0 2px}
.listing-preview-head p{margin:0;color:var(--muted);font-size:11px}
.listing-preview-head .addbtn{margin-left:0}

/* ---- Helpbook: admin authoring and user reading ---- */
.helpbook__lead{margin:4px 0 0;color:var(--muted);font-size:12.5px}
.helpbook__head{align-items:flex-end}
.helpbook__search{display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border:1px solid var(--line);
  border-radius:10px;background:#fff;color:var(--muted)}
.helpbook__search:focus-within{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,91,20,.08)}
.helpbook__search svg{width:16px;height:16px;flex:none}.helpbook__search input{width:100%;border:0;outline:0;background:transparent;color:var(--ink)}
.helpbook__head .helpbook__search{width:min(360px,42vw);margin-left:auto}
.helpbook__layout{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:18px;min-height:calc(100vh - 145px)}
.helpbook__toc{padding:10px;border:1px solid var(--line);border-radius:14px;background:#fff;overflow:auto}
.helpbook__chapter+.helpbook__chapter{margin-top:14px}.helpbook__chapter-title{padding:7px 10px;color:var(--faint);font-size:10.5px;
  font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.helpbook__link{display:flex;align-items:center;gap:8px;width:100%;padding:9px 10px;border-radius:9px;text-align:left;color:var(--ink)}
.helpbook__link span{flex:1}.helpbook__link svg{width:13px;height:13px;transform:rotate(-90deg);color:var(--faint)}
.helpbook__link:hover{background:var(--line-2)}.helpbook__link.on{background:var(--orange-soft);color:var(--orange);font-weight:650}
.helpbook__article{min-width:0;padding:24px 28px;border:1px solid var(--line);border-radius:14px;background:#fff}
.helpbook__article-head{padding-bottom:18px;border-bottom:1px solid var(--line)}
.helpbook__eyebrow{color:var(--orange);font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.helpbook__article-head h2{margin:7px 0 4px;font-size:26px;line-height:1.25}.helpbook__article-head p{margin:0;color:var(--muted);font-size:14px}
.helpbook__document{display:block;width:100%;height:62vh;min-height:460px;margin-top:20px;border:0;background:#fff}
.helpbook__pager{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;padding-top:16px;border-top:1px solid var(--line)}
.helpbook__pager button{padding:8px 10px;border:1px solid var(--line);border-radius:9px;color:var(--ink);font-weight:600;text-align:left}
.helpbook__pager button:last-child{text-align:right}.helpbook__pager button:hover{border-color:var(--orange);color:var(--orange)}
.helpbook__empty{display:grid;place-items:center;min-height:55vh;text-align:center;color:var(--muted)}
.helpbook__empty>span{display:grid;place-items:center;width:54px;height:54px;border-radius:15px;background:var(--orange-soft);color:var(--orange)}
.helpbook__empty svg{width:25px;height:25px}.helpbook__empty h2{margin:14px 0 0;color:var(--ink)}.helpbook__empty p{margin:4px 0}

.helpadmin .main__head{align-items:flex-end}.helpadmin .main__head .addbtn{margin-left:auto}
.helpadmin>.banner{margin-bottom:12px}.banner--success{background:var(--green-soft);border-color:#bbf7d0;color:#166534}
.banner--error{background:#fef2f2;border-color:#fecaca;color:#b91c1c}
.helpadmin__layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}
.helpadmin__list,.helpadmin__editor{border:1px solid var(--line);border-radius:14px;background:#fff}
.helpadmin__list{position:sticky;top:0;max-height:calc(100vh - 100px);padding:10px;overflow:auto}
.helpadmin__list .helpbook__search{margin-bottom:8px}
.helpadmin__section{padding:10px 8px 5px;color:var(--faint);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.helpadmin__article{display:block;width:100%;padding:9px 10px;border-radius:9px;text-align:left}
.helpadmin__article span,.helpadmin__article small{display:block}.helpadmin__article span{font-weight:600}.helpadmin__article small{margin-top:2px;color:var(--muted);font-size:10.5px}
.helpadmin__article:hover{background:var(--line-2)}.helpadmin__article.on{background:var(--orange-soft);color:var(--orange)}
.helpadmin__editor{padding:18px}.helpadmin__formrow{display:grid;grid-template-columns:minmax(0,1.4fr) 80px minmax(0,1fr) 80px;gap:12px}
.helpadmin__snippets{margin:0 0 9px;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fafbfc}.helpadmin__snippets-head{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.helpadmin__snippets-head strong{font-size:12px}.helpadmin__snippets-head span{color:var(--muted);font-size:11px}
.helpadmin__snippet-list{display:flex;flex-wrap:wrap;gap:5px}.helpadmin__snippet{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font-size:11.5px;font-weight:650;cursor:pointer}.helpadmin__snippet:hover{border-color:#fdba74;background:#fff7ed}.helpadmin__snippet i{display:block;width:7px;height:7px;border-radius:50%;background:#94a3b8}.helpadmin__snippet--danger i{background:#dc2626}.helpadmin__snippet--warning i{background:#d97706}.helpadmin__snippet--info i{background:#0284c7}.helpadmin__snippet--success i{background:#16a34a}.helpadmin__snippet--action i{background:var(--orange)}.helpadmin__snippet--dark i{background:#17181c}
.helpadmin__link-dialog{width:440px}.helpadmin__link-dialog .field{margin-bottom:12px}.helpadmin__link-dialog .confirmbox__actions{margin-top:18px}.helpadmin__link-dialog .addbtn{margin-left:0}.helpadmin__link-error{display:block;margin-top:5px;color:#b91c1c;font-size:11px;font-weight:600}
.helpadmin__footer{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.helpadmin__publish{display:flex;align-items:center;gap:9px;margin-right:auto;cursor:pointer}.helpadmin__publish input{width:17px;height:17px;accent-color:var(--orange)}
.helpadmin__publish span,.helpadmin__publish small{display:block}.helpadmin__publish small{color:var(--muted);font-weight:400}
.helpadmin__footer .addbtn{margin-left:0}.btn-delete{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border-radius:9px;color:#b91c1c;background:#fef2f2;font-weight:650}
.btn-delete svg{width:14px;height:14px}.helpadmin__confirm{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:12px;padding:10px;border-radius:9px;background:#fff7ed;color:#9a3412}
.helpadmin__confirm span{margin-right:auto;font-weight:600}.helpadmin__confirm .btn-cancel{padding:8px 11px;border:1px solid var(--line);border-radius:9px;background:#fff}

@media(max-width:900px){
  .helpbook__layout,.helpadmin__layout{grid-template-columns:1fr}.helpbook__toc,.helpadmin__list{position:static;max-height:300px}
  .helpadmin__formrow{grid-template-columns:1fr 1fr}.helpadmin__order{grid-column:1/-1}.helpbook__article{padding:18px}
}
@media(max-width:620px){
  .helpbook__head{align-items:stretch}.helpbook__head .helpbook__search{width:100%;margin-left:0}.helpadmin__formrow{grid-template-columns:1fr}
  .helpadmin__order{grid-column:auto}.helpadmin__footer{align-items:flex-start;flex-wrap:wrap}.helpadmin__publish{width:100%}
  .helpbook__pager button span{display:none}
}
.listing-preview{max-height:440px;overflow:auto}
.listing-preview .otable{min-width:820px}
.listing-preview .otable th{position:sticky;top:0;background:#fff;z-index:1}
.listing-title{display:block;max-width:300px}
.listing-error{display:block;color:#b42318;font-size:10px;margin-top:2px;max-width:320px}
.import-action{display:inline-flex;padding:2px 7px;border-radius:999px;font-size:10px;font-weight:700;white-space:nowrap;background:var(--line-2);color:var(--muted)}
.import-action--create{background:#e7f8ec;color:#15763a}
.import-action--update{background:#fff3d7;color:#925500}
.import-action--skip{background:#ffeaea;color:#a82323}
.listing-preview__limit,.listing-import__confirm-note{font-size:10.5px;color:var(--muted);margin:8px 0 0;line-height:1.45}
.integration-health{padding:0;overflow:hidden}
.integration-health .widget__head{padding:14px 15px;border-bottom:1px solid var(--line)}
.health-row{display:flex;align-items:flex-start;gap:10px;padding:12px 15px;border-bottom:1px solid var(--line)}
.health-dot{width:9px;height:9px;flex:none;border-radius:50%;margin-top:3px;background:#dba72a;box-shadow:0 0 0 3px #fff4cf}
.health-dot--ok{background:var(--green);box-shadow:0 0 0 3px #ddf5e5}
.health-row div{display:flex;flex-direction:column;gap:2px}
.health-row strong{font-size:11.5px}
.health-row span:last-child{font-size:10.5px;color:var(--muted)}
.integration-health__note{padding:14px 15px;background:#f7f9fc}
.integration-health__note strong{font-size:11.5px}
.integration-health__note p{font-size:10.5px;line-height:1.5;color:var(--muted);margin:4px 0 0}

@media(max-width:1000px){
  .onboarding-layout{grid-template-columns:1fr}
  .integration-health{order:-1}
}
@media(max-width:650px){
  .onboarding-head{align-items:flex-start}
  .onboarding-progress__copy{flex-direction:column;gap:2px}
  .onboarding-step{align-items:flex-start;flex-wrap:wrap}
  .onboarding-step .fbtn{margin-left:42px}
  .csv-summary{grid-template-columns:1fr 1fr}
  .listing-import__head{flex-direction:column}
}
.profile-extension-toggle{ display:flex; align-items:center; gap:9px; min-height:40px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fafbfc; color:var(--ink); font-size:12.5px; font-weight:600; cursor:pointer; }
.profile-extension-toggle input{ flex:none; width:16px; height:16px; accent-color:var(--orange); }
.profile-extension-toggle small{ display:block; margin-top:3px; font-weight:400; }
.keys-settings__wide{ grid-column:1 / -1; }
.keys-settings__wide dd{ white-space:normal; overflow-wrap:anywhere; }

/* Fulfillment shared controls */
.fulfillment-page .fulfillment-card{margin-top:16px;padding:20px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(20,25,38,.04)}
.fulfillment-page .oform{width:100%;max-width:none}
.fulfillment-page .fulfillment-card:first-child{margin-top:0}
.fulfillment-page .fulfillment-card h2{margin:0 0 14px;font-size:18px}
.fulfillment-page .btn{display:inline-flex;min-height:40px;align-items:center;justify-content:center;gap:7px;padding:9px 15px;border:1px solid #dfe2e8;border-radius:10px;color:var(--ink);background:#fff;font:700 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}
.fulfillment-page .btn:hover:not(:disabled){color:var(--orange);border-color:#fdba74;background:#fff7ed;transform:translateY(-1px)}
.fulfillment-page .btn:focus-visible{outline:3px solid rgba(255,91,20,.2);outline-offset:2px}
.fulfillment-page .btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}
.fulfillment-page .btn.btn--primary{color:#fff;border-color:var(--orange);background:var(--orange);box-shadow:0 6px 16px rgba(255,91,20,.22)}
.fulfillment-page .btn.btn--primary:hover:not(:disabled){color:#fff;border-color:#e94713;background:#e94713}
.fulfillment-page .btn.btn--small{min-height:32px;padding:6px 10px;border-radius:8px;font-size:12px}
.fulfillment-page .fulfillment-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.fulfillment-page .check-field{min-height:42px;align-self:end}
.fulfillment-page .check-field label{display:flex;min-height:40px;align-items:center;gap:10px;margin:0;font-size:13px;font-weight:650;cursor:pointer}
.fulfillment-page .field input[type=checkbox],.fulfillment-page .check-field input[type=checkbox]{width:19px!important;height:19px!important;min-height:19px!important;flex:0 0 19px;margin:0;padding:0!important;border-radius:5px!important;accent-color:var(--orange);cursor:pointer}
.fulfillment-page .bulk-file{position:relative;overflow:hidden}
.fulfillment-page .bulk-file input[type=file]{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;margin:0!important;padding:0!important;opacity:0!important;cursor:pointer}
.fulfillment-page .scan-row input,.fulfillment-page .parcel-row input,.fulfillment-page .webhook-row input,.fulfillment-page .receive-grid input,.fulfillment-page .receive-grid select{min-height:40px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);outline:0}
.fulfillment-page .scan-row input:focus,.fulfillment-page .parcel-row input:focus,.fulfillment-page .webhook-row input:focus,.fulfillment-page .receive-grid input:focus,.fulfillment-page .receive-grid select:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,91,20,.1)}
.fulfillment-page .fulfillment-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid #ffd2bf;border-radius:12px;background:#fff3ed}
.fulfillment-page .status-badge{color:#e94713;font-weight:700}
.fulfillment-page .fulfillment-stack.is-provider-tab-unavailable>[role="tabpanel"]:not([hidden]){display:none!important}
.fulfillment-page .fulfillment-tab-state{display:flex;align-items:center;gap:14px;min-height:96px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(20,25,38,.04)}
.fulfillment-page .fulfillment-tab-state>div{display:grid;gap:4px}.fulfillment-page .fulfillment-tab-state small{color:var(--muted)}
.fulfillment-page .fulfillment-tab-state.is-error{justify-content:space-between;border-color:#ffc9c9;background:#fff7f7}
.fulfillment-page .fulfillment-tab-spinner{width:24px;height:24px;flex:0 0 24px;border:3px solid #ffe0d4;border-top-color:var(--orange);border-radius:50%;animation:fulfillment-tab-spin .75s linear infinite}
@keyframes fulfillment-tab-spin{to{transform:rotate(360deg)}}
@media(max-width:680px){.fulfillment-page .fulfillment-actions{align-items:stretch;flex-direction:column}.fulfillment-page .fulfillment-actions .btn{width:100%}}
/* Fulfillment setup steps and warehouses (global because provider workspace is rendered from a RenderFragment) */
.fulfillment-page .setup-card .card-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.fulfillment-page .setup-card .card-section-head>div{min-width:0}
.fulfillment-page .setup-card .card-section-head h2{margin:0 0 4px}
.fulfillment-page .setup-card .card-section-head p{margin:0}
.fulfillment-page .setup-card .card-section-head>strong{display:inline-flex;min-width:54px;height:32px;align-items:center;justify-content:center;flex:none;padding:0 11px;border:1px solid #fed7c7;border-radius:999px;color:#d94312;background:#fff7f3;font-size:13px;font-weight:800}
.fulfillment-page .setup-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}
.fulfillment-page .setup-steps button{display:flex;min-width:0;min-height:64px;align-items:center;gap:11px;width:100%;padding:12px 14px;border:1px solid #e4e7ec;border-radius:12px;color:#4f5665;background:#f8f9fb;text-align:left;font:700 13px/1.3 system-ui,-apple-system,"Segoe UI",sans-serif;cursor:pointer;transition:border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}
.fulfillment-page .setup-steps button:hover{border-color:#ffb398;background:#fff7f3;transform:translateY(-1px)}
.fulfillment-page .setup-steps button:focus-visible{outline:3px solid rgba(255,91,20,.18);outline-offset:2px}
.fulfillment-page .setup-steps button>span{display:grid;width:30px;height:30px;place-items:center;flex:0 0 30px;border-radius:50%;color:#555b69;background:#e2e5ea;font-size:13px;font-weight:900}
.fulfillment-page .setup-steps button.is-complete{color:#126a42;border-color:#bfead3;background:#edfbf4}
.fulfillment-page .setup-steps button.is-complete>span{color:#fff;background:#15975d}
.fulfillment-page .setup-steps button.is-active{color:#d94312;border-color:#ff5a24;background:#fff7f3;box-shadow:0 7px 18px rgba(255,79,24,.13)}
.fulfillment-page .setup-steps button.is-active>span,.fulfillment-page .setup-steps button.is-active.is-complete>span{color:#fff;background:#ff4f18}
.fulfillment-page .setup-steps button.is-active::after{content:"";width:8px;height:8px;margin-left:auto;flex:0 0 8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.fulfillment-page .fulfillment-form-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fulfillment-page .warehouse-list{display:grid;gap:10px;margin-top:20px;padding-top:18px;border-top:1px solid #eceef2}
.fulfillment-page .warehouse-list h3{margin:0 0 2px;color:#343846;font-size:14px}
.fulfillment-page .warehouse-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 14px;border:1px solid #e5e7ec;border-radius:11px;background:#fafbfc;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.fulfillment-page .warehouse-item:hover{border-color:#ffb398;background:#fff}
.fulfillment-page .warehouse-item.is-editing{border-color:#ff5a24;background:#fff7f3;box-shadow:0 5px 14px rgba(255,79,24,.1)}
.fulfillment-page .warehouse-item__details{display:grid;gap:3px;min-width:0}
.fulfillment-page .warehouse-item__details strong{color:#171923;font-size:14px}
.fulfillment-page .warehouse-item__details small{color:#7b8090;font-size:12px;line-height:1.35}
@media(max-width:820px){.fulfillment-page .setup-steps{grid-template-columns:1fr}.fulfillment-page .setup-steps button{min-height:54px}}
@media(max-width:600px){.fulfillment-page .setup-card .card-section-head{align-items:stretch;flex-direction:column}.fulfillment-page .setup-card .card-section-head>strong{align-self:flex-start}.fulfillment-page .warehouse-item{align-items:stretch;flex-direction:column}.fulfillment-page .warehouse-item .btn{width:100%}}
/* Fulfillment warehouse delete actions */
.fulfillment-page .warehouse-item__actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:none}
.fulfillment-page .btn.btn--danger{color:#b42318;border-color:#f2b8b5;background:#fff}
.fulfillment-page .btn.btn--danger:hover:not(:disabled){color:#fff;border-color:#dc2626;background:#dc2626;box-shadow:0 6px 16px rgba(220,38,38,.2)}
.fulfillment-page .fulfillment-delete-dialog .confirmbox__body strong{color:var(--ink)}
@media(max-width:600px){.fulfillment-page .warehouse-item__actions{width:100%}.fulfillment-page .warehouse-item__actions .btn{flex:1}}
/* Admin fulfillment submission preview */
.fulfillment-page .admin-review-empty{margin-top:18px}
.fulfillment-page .admin-review-list{display:grid;gap:14px;margin-top:18px}
.fulfillment-page .admin-review-card{overflow:hidden;border:1px solid #e4e7ec;border-radius:14px;background:#fff;transition:border-color .15s ease,box-shadow .15s ease}
.fulfillment-page .admin-review-card.is-expanded{border-color:#ffb398;box-shadow:0 10px 28px rgba(20,25,38,.07)}
.fulfillment-page .admin-review-card__summary{display:grid;grid-template-columns:minmax(240px,1fr) auto auto;align-items:center;gap:18px;padding:16px}
.fulfillment-page .admin-review-identity{display:flex;min-width:0;align-items:center;gap:12px}
.fulfillment-page .admin-review-identity img,.fulfillment-page .admin-review-avatar{width:48px;height:48px;flex:0 0 48px;border-radius:12px}
.fulfillment-page .admin-review-identity img{object-fit:cover;border:1px solid #e4e7ec}
.fulfillment-page .admin-review-avatar{display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#ff6a32,#e94713);font-size:14px;font-weight:900}
.fulfillment-page .admin-review-identity>div{display:grid;gap:3px;min-width:0}
.fulfillment-page .admin-review-identity strong{overflow:hidden;color:#171923;font-size:15px;text-overflow:ellipsis;white-space:nowrap}
.fulfillment-page .admin-review-identity small,.fulfillment-page .admin-review-meta small{color:#7b8090;font-size:12px}
.fulfillment-page .admin-review-meta{display:grid;justify-items:end;gap:5px}
.fulfillment-page .admin-review-pending{padding:5px 9px;border-radius:999px;color:#9a4b00;background:#fff4dd;font-size:11px;font-weight:800}
.fulfillment-page .admin-review-summary-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.fulfillment-page .admin-review-details{display:grid;gap:16px;padding:18px;border-top:1px solid #eceef2;background:#fafbfc}
.fulfillment-page .admin-review-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.fulfillment-page .admin-review-kpis>div{padding:12px 14px;border:1px solid #e6e8ed;border-radius:11px;background:#fff}
.fulfillment-page .admin-review-kpis small,.fulfillment-page .admin-review-kpis strong{display:block}
.fulfillment-page .admin-review-kpis small{color:#7b8090;font-size:11px}
.fulfillment-page .admin-review-kpis strong{margin-top:4px;color:#171923;font-size:19px}
.fulfillment-page .admin-review-section-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.fulfillment-page .admin-review-section{padding:16px;border:1px solid #e4e7ec;border-radius:12px;background:#fff}
.fulfillment-page .admin-review-section h3{margin:0 0 13px;color:#242731;font-size:14px}
.fulfillment-page .admin-review-section__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}
.fulfillment-page .admin-review-section__head h3{margin:0}
.fulfillment-page .admin-review-section__head>span{padding:4px 8px;border-radius:999px;color:#5d6472;background:#f0f2f5;font-size:11px;font-weight:800}
.fulfillment-page .admin-review-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}
.fulfillment-page .admin-review-facts>div{min-width:0;padding-bottom:9px;border-bottom:1px solid #f0f1f3}
.fulfillment-page .admin-review-facts>div.is-wide{grid-column:1/-1}
.fulfillment-page .admin-review-facts dt{margin-bottom:4px;color:#7b8090;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.fulfillment-page .admin-review-facts dd{margin:0;color:#262a35;font-size:12.5px;line-height:1.45;overflow-wrap:anywhere}
.fulfillment-page .admin-review-facts a{color:#d94312;text-decoration:none}
.fulfillment-page .admin-review-description,.fulfillment-page .admin-review-policy{margin:13px 0 0;padding:11px 12px;border-radius:9px;color:#555b69;background:#f7f8fa;font-size:12px;line-height:1.5;white-space:pre-wrap}
.fulfillment-page .admin-review-policy strong{display:block;margin-bottom:4px;color:#343846}
.fulfillment-page .admin-review-policy p{margin:0}
.fulfillment-page .admin-review-capabilities{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.fulfillment-page .admin-review-capabilities span{padding:5px 8px;border-radius:999px;font-size:11px;font-weight:750}
.fulfillment-page .admin-review-capabilities .is-supported{color:#126a42;background:#e8f8ef}
.fulfillment-page .admin-review-capabilities .is-not-supported{color:#7b8090;background:#eff1f4;text-decoration:line-through}
.fulfillment-page .admin-review-warehouses{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px}
.fulfillment-page .admin-review-warehouses article{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px;border:1px solid #e7e9ed;border-radius:10px;background:#fafbfc}
.fulfillment-page .admin-review-warehouses article>div:first-child{display:grid;gap:3px}
.fulfillment-page .admin-review-warehouses small{color:#7b8090;font-size:11px;line-height:1.4}
.fulfillment-page .admin-review-warehouse-meta{display:grid;justify-items:end;gap:5px;text-align:right}
.fulfillment-page .admin-review-warehouse-meta span{padding:4px 7px;border-radius:999px;font-size:10.5px;font-weight:800}
.fulfillment-page .admin-review-warehouse-meta .is-active{color:#126a42;background:#e8f8ef}
.fulfillment-page .admin-review-warehouse-meta .is-inactive{color:#7b8090;background:#eff1f4}
.fulfillment-page .admin-review-rate-table-wrap{overflow:auto;border:1px solid #e7e9ed;border-radius:10px}
.fulfillment-page .admin-review-rate-table{width:100%;min-width:760px;border-collapse:collapse;font-size:12px}
.fulfillment-page .admin-review-rate-table th{padding:10px 11px;color:#6b7280;background:#f7f8fa;text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.03em}
.fulfillment-page .admin-review-rate-table td{padding:11px;border-top:1px solid #eceef2;color:#4f5665;vertical-align:top}
.fulfillment-page .admin-review-rate-table td strong{color:#242731}
.fulfillment-page .admin-review-decision{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 16px;border:1px solid #ffd2bf;border-radius:12px;background:#fff7f3}
.fulfillment-page .admin-review-decision>div:first-child{display:grid;gap:3px}
.fulfillment-page .admin-review-decision small{color:#7b8090;font-size:12px}
@media(max-width:980px){.fulfillment-page .admin-review-card__summary{grid-template-columns:1fr auto}.fulfillment-page .admin-review-meta{grid-column:1/-1;grid-row:2;justify-items:start}.fulfillment-page .admin-review-summary-actions{grid-column:2;grid-row:1}.fulfillment-page .admin-review-section-grid{grid-template-columns:1fr}}
@media(max-width:720px){.fulfillment-page .admin-review-card__summary{grid-template-columns:1fr}.fulfillment-page .admin-review-meta,.fulfillment-page .admin-review-summary-actions{grid-column:auto;grid-row:auto;justify-items:start;justify-content:flex-start}.fulfillment-page .admin-review-summary-actions{width:100%;flex-wrap:wrap}.fulfillment-page .admin-review-summary-actions .btn{flex:1}.fulfillment-page .admin-review-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.fulfillment-page .admin-review-decision{align-items:stretch;flex-direction:column}.fulfillment-page .admin-review-decision .fulfillment-actions{justify-content:stretch}.fulfillment-page .admin-review-decision .btn{flex:1}}
@media(max-width:500px){.fulfillment-page .admin-review-facts{grid-template-columns:1fr}.fulfillment-page .admin-review-facts>div.is-wide{grid-column:auto}.fulfillment-page .admin-review-kpis{grid-template-columns:1fr 1fr}.fulfillment-page .admin-review-warehouses article{flex-direction:column}.fulfillment-page .admin-review-warehouse-meta{justify-items:start;text-align:left}}
/* Reliable full-height application scrolling */
.frame{height:100dvh;min-height:0}
.frame>.body{height:100%;min-height:0;overflow:hidden}
.frame>.body>.main{height:100%;min-height:0;max-height:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding-bottom:64px}
.fulfillment-page{min-height:min-content;overflow:visible;padding-bottom:24px}
.fulfillment-page .admin-fulfillment-reviews,.fulfillment-page .admin-review-list,.fulfillment-page .admin-review-card,.fulfillment-page .admin-review-details{max-height:none;overflow:visible}
.fulfillment-page .admin-review-card{overflow:clip}
.fulfillment-page .admin-review-decision{scroll-margin-bottom:72px}
.fulfillment-page .admin-review-list>.admin-review-card:last-child{margin-bottom:24px}
@supports not (height:100dvh){.frame{height:100vh}}
/* Fulfillment review comments */
.fulfillment-page .fulfillment-review-note{display:flex;align-items:flex-start;gap:13px;padding:15px 16px;border:1px solid #f7c66b;border-radius:13px;background:#fff9eb;color:#6f4700}
.fulfillment-page .fulfillment-review-note__icon{display:grid;width:32px;height:32px;place-items:center;flex:0 0 32px;border-radius:50%;color:#fff;background:#e58a00;font-size:17px;font-weight:900}
.fulfillment-page .fulfillment-review-note__content{display:grid;gap:5px;min-width:0}
.fulfillment-page .fulfillment-review-note__content>strong{color:#7a4800;font-size:14px}
.fulfillment-page .fulfillment-review-note__content p{margin:2px 0;color:#5f430d;font-size:13px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.fulfillment-page .fulfillment-review-note__content>small{color:#8a672a;font-size:11.5px}
.fulfillment-page .fulfillment-review-note__actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px}
.fulfillment-page .fulfillment-review-note__actions .btn{color:#714500;border-color:#e9c275;background:#fff}
.fulfillment-page .fulfillment-review-note__actions .btn:hover{color:#fff;border-color:#d47d00;background:#d47d00}
.fulfillment-page .fulfillment-review-dialog{width:min(560px,calc(100vw - 32px))}
.fulfillment-page .fulfillment-review-dialog .confirmbox__body strong{color:var(--ink)}
.fulfillment-page .fulfillment-review-dialog__field{margin:15px 0 18px}
.fulfillment-page .fulfillment-review-dialog__field label{display:block;margin-bottom:7px;color:#343846;font-size:12px;font-weight:750}
.fulfillment-page .fulfillment-review-dialog__field textarea{display:block;width:100%;min-height:135px;resize:vertical;padding:11px 12px;border:1px solid #dfe2e8;border-radius:10px;background:#fff;color:var(--ink);font:13px/1.5 inherit;outline:none}
.fulfillment-page .fulfillment-review-dialog__field textarea:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,91,20,.12)}
.fulfillment-page .fulfillment-review-dialog__counter{display:flex;justify-content:flex-end;margin-top:5px;color:#8b8f99;font-size:10.5px}
.fulfillment-page .fulfillment-review-dialog__error{display:block;margin-top:7px;color:#b42318;font-size:11.5px;font-weight:650}
@media(max-width:600px){.fulfillment-page .fulfillment-review-note{flex-direction:column}.fulfillment-page .fulfillment-review-note__actions .btn{width:100%}.fulfillment-page .fulfillment-review-dialog .confirmbox__actions{align-items:stretch;flex-direction:column-reverse}.fulfillment-page .fulfillment-review-dialog .btn{width:100%}}
.fulfillment-page .fulfillment-action-error{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 16px;color:#9f1d1d;background:#fff4f4;border:1px solid #ffcaca;border-radius:12px}
.fulfillment-page .fulfillment-action-error button{appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;font-size:22px;line-height:1}
.fulfillment-page .fulfillment-submit-panel{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.fulfillment-page .fulfillment-submit-panel[hidden]{display:none!important}.fulfillment-page .fulfillment-submit-panel small{color:var(--muted)}
.fulfillment-page .fulfillment-logo-field{margin-bottom:20px}.fulfillment-page .fulfillment-logo-preview{width:82px;height:82px;background:#fff}.fulfillment-page .fulfillment-logo-preview img{object-fit:contain;padding:5px}

/* Fulfillment product approval review */
.fulfillment-page .product-approvals>.card-section-head{margin-bottom:16px}.fulfillment-page .product-approval-list{display:grid;gap:12px}.fulfillment-page .product-approval-card{overflow:hidden;border:1px solid #e4e7ec;border-radius:14px;background:#fff;transition:border-color .15s,box-shadow .15s}.fulfillment-page .product-approval-card.is-expanded{border-color:#ffad8f;box-shadow:0 10px 28px rgba(20,25,38,.07)}.fulfillment-page .product-approval-card__summary{display:grid;grid-template-columns:62px minmax(190px,1fr) auto auto;align-items:center;gap:15px;padding:14px}.fulfillment-page .product-approval-card__summary>img,.fulfillment-page .product-approval-card__placeholder{width:62px;height:62px;border-radius:11px;background:#f3f4f6}.fulfillment-page .product-approval-card__summary>img{object-fit:cover}.fulfillment-page .product-approval-card__placeholder{display:grid;place-items:center;color:#9ca3af;font-size:26px}.fulfillment-page .product-approval-card__identity{display:grid;gap:3px;min-width:0}.fulfillment-page .product-approval-card__identity>strong{overflow:hidden;color:#20232c;text-overflow:ellipsis;white-space:nowrap}.fulfillment-page .product-approval-card__identity small{color:#7b8090;font-size:11.5px}.fulfillment-page .product-approval-card__metrics{display:flex;align-items:stretch;gap:8px}.fulfillment-page .product-approval-card__metrics>span{display:grid;min-width:82px;gap:3px;padding:8px 10px;border-radius:9px;background:#f7f8fa}.fulfillment-page .product-approval-card__metrics small{color:#7b8090;font-size:10px}.fulfillment-page .product-approval-card__metrics strong{color:#252832;font-size:13px}.fulfillment-page .product-approval-card__actions{display:grid;justify-items:end;gap:8px}.fulfillment-page .product-approval-card__details{display:grid;gap:16px;padding:16px;border-top:1px solid #eceef2;background:#fafbfc}.fulfillment-page .product-approval-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.fulfillment-page .product-approval-facts>div{display:grid;align-content:start;gap:4px;min-height:94px;padding:12px;border:1px solid #e6e8ed;border-radius:10px;background:#fff}.fulfillment-page .product-approval-facts small{color:#7b8090;font-size:10.5px;font-weight:750;text-transform:uppercase}.fulfillment-page .product-approval-facts strong{color:#252832;font-size:14px}.fulfillment-page .product-approval-facts span{color:#6b7280;font-size:11.5px;overflow-wrap:anywhere}.fulfillment-page .product-approval-facts>div>div{display:flex;gap:10px;margin-top:5px}.fulfillment-page .product-approval-facts a,.fulfillment-page .product-approval-facts button{padding:0;border:0;background:none;color:#dd4512;font:700 11.5px/1.3 inherit;text-decoration:none;cursor:pointer}.fulfillment-page .product-approval-facts a:hover,.fulfillment-page .product-approval-facts button:hover{text-decoration:underline}.fulfillment-page .product-approval-variants{display:grid;gap:9px}.fulfillment-page .product-approval-variants h3{margin:0;font-size:14px}.fulfillment-page .product-approval-variants__table-wrap{overflow:auto;border:1px solid #e5e7eb;border-radius:10px;background:#fff}.fulfillment-page .product-approval-variants table{width:100%;min-width:620px;border-collapse:collapse;font-size:12px}.fulfillment-page .product-approval-variants th{padding:9px 11px;color:#6b7280;background:#f7f8fa;text-align:left;font-size:10.5px;text-transform:uppercase}.fulfillment-page .product-approval-variants td{padding:9px 11px;border-top:1px solid #eceef2}.fulfillment-page .product-approval-variants td img{width:42px;height:42px;border-radius:7px;object-fit:cover}.fulfillment-page .product-approval-reason{display:grid;gap:4px;padding:11px 13px;border:1px solid #f2cf8c;border-radius:10px;background:#fff9eb;color:#704800}.fulfillment-page .product-approval-decision{margin-top:0;padding-top:14px;border-top:1px solid #e5e7eb}@media(max-width:1050px){.fulfillment-page .product-approval-card__summary{grid-template-columns:62px 1fr auto}.fulfillment-page .product-approval-card__metrics{grid-column:2/-1;grid-row:2}.fulfillment-page .product-approval-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.fulfillment-page .product-approval-card__summary{grid-template-columns:52px 1fr}.fulfillment-page .product-approval-card__summary>img,.fulfillment-page .product-approval-card__placeholder{width:52px;height:52px}.fulfillment-page .product-approval-card__metrics,.fulfillment-page .product-approval-card__actions{grid-column:1/-1;grid-row:auto;width:100%}.fulfillment-page .product-approval-card__metrics{display:grid;grid-template-columns:repeat(3,1fr)}.fulfillment-page .product-approval-card__actions{justify-items:stretch}.fulfillment-page .product-approval-facts{grid-template-columns:1fr}}
/* Fulfillment inbound receiving details and evidence upload */
.fulfillment-page .inbound-receiving>.card-section-head{margin-bottom:16px}.fulfillment-page .inbound-block{display:grid;gap:0;margin-top:13px;overflow:hidden;border:1px solid #e4e7ec;border-radius:14px;background:#fff}.fulfillment-page .inbound-block__head{display:grid;grid-template-columns:58px minmax(200px,1.25fr) minmax(180px,.8fr) auto;align-items:center;gap:14px;padding:14px 16px;background:#fafbfc}.fulfillment-page .inbound-block__head>img,.fulfillment-page .inbound-product-placeholder{width:58px;height:58px;border-radius:10px;background:#f0f2f5}.fulfillment-page .inbound-block__head>img{object-fit:cover}.fulfillment-page .inbound-product-placeholder{display:grid;place-items:center;color:#9ca3af;font-size:24px}.fulfillment-page .inbound-block__head>div{display:grid;gap:3px;min-width:0}.fulfillment-page .inbound-block__head small,.fulfillment-page .inbound-variant small{color:#7b8090;font-size:10.5px;font-weight:750;text-transform:uppercase}.fulfillment-page .inbound-block__head strong{overflow:hidden;color:#252832;text-overflow:ellipsis;white-space:nowrap}.fulfillment-page .inbound-block__head span{color:#7b8090;font-size:11.5px}.fulfillment-page .inbound-block__total{justify-items:end;text-align:right}.fulfillment-page .inbound-block__total strong{font-size:22px}.fulfillment-page .inbound-receive-line{display:grid;gap:13px;padding:14px 16px;border-top:1px solid #e8eaee}.fulfillment-page .inbound-variant{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:11px}.fulfillment-page .inbound-variant>img,.fulfillment-page .inbound-variant__placeholder{width:48px;height:48px;border-radius:9px;background:#f3f4f6}.fulfillment-page .inbound-variant>img{object-fit:cover}.fulfillment-page .inbound-variant__placeholder{display:grid;place-items:center;color:#9ca3af}.fulfillment-page .inbound-variant>div{display:grid;gap:3px;min-width:0}.fulfillment-page .inbound-variant span{color:#7b8090;font-size:11.5px}.fulfillment-page .inbound-variant__progress{justify-items:end}.fulfillment-page .inbound-variant__progress strong{font-size:16px}.fulfillment-page .receive-grid{display:grid;grid-template-columns:minmax(170px,1fr) repeat(2,minmax(115px,.65fr)) minmax(170px,1fr) minmax(230px,1.35fr) auto;align-items:end;gap:10px}.fulfillment-page .receive-grid .field{display:grid;gap:6px;margin:0}.fulfillment-page .receive-grid .field label{color:#555b69;font-size:10.5px;font-weight:750}.fulfillment-page .receive-grid input,.fulfillment-page .receive-grid select{width:100%;min-height:42px}.fulfillment-page .evidence-field{min-width:0}.fulfillment-page .evidence-upload{display:flex;align-items:center;gap:7px;min-width:0}.fulfillment-page .evidence-dropzone{position:relative;display:flex;min-width:0;min-height:58px;flex:1;align-items:center;justify-content:center;gap:9px;padding:7px 10px;overflow:hidden;border:1.5px dashed #ff9f7c;border-radius:10px;background:#fff8f5;color:#5f6470;cursor:pointer;transition:border-color .15s,background .15s}.fulfillment-page .evidence-dropzone:hover{border-color:var(--orange);background:#fff1eb}.fulfillment-page .evidence-dropzone>img{width:42px;height:42px;flex:0 0 42px;border-radius:7px;object-fit:cover}.fulfillment-page .evidence-dropzone>span:not(.evidence-dropzone__spinner):not(.evidence-dropzone__icon){display:grid;gap:2px;min-width:0}.fulfillment-page .evidence-dropzone strong{font-size:11.5px}.fulfillment-page .evidence-dropzone small{overflow:hidden;color:#7b8090;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.fulfillment-page .evidence-dropzone__icon{display:grid;width:30px;height:30px;place-items:center;flex:0 0 30px;border-radius:50%;background:#ffe8df;color:var(--orange);font-size:20px}.fulfillment-page .evidence-dropzone__spinner{width:20px;height:20px;border:3px solid #ffd7c8;border-top-color:var(--orange);border-radius:50%;animation:fulfillment-tab-spin .75s linear infinite}.fulfillment-page .evidence-dropzone input[type=file]{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;padding:0!important;opacity:0!important;cursor:pointer}.fulfillment-page .evidence-remove{padding:0;border:0;background:transparent;color:#b42318;font-size:10.5px;font-weight:750;cursor:pointer}.fulfillment-page .receive-action{min-height:42px}.fulfillment-page .field-error{color:#b42318;font-size:10.5px}@media(max-width:1250px){.fulfillment-page .receive-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.fulfillment-page .evidence-field{grid-column:1/-2}.fulfillment-page .receive-action{grid-column:-2/-1}}@media(max-width:760px){.fulfillment-page .inbound-block__head{grid-template-columns:50px 1fr}.fulfillment-page .inbound-block__head>img,.fulfillment-page .inbound-product-placeholder{width:50px;height:50px}.fulfillment-page .inbound-block__head>div:nth-child(3),.fulfillment-page .inbound-block__total{grid-column:1/-1;justify-items:start;text-align:left}.fulfillment-page .receive-grid{grid-template-columns:1fr 1fr}.fulfillment-page .receive-grid .field:first-child,.fulfillment-page .receive-grid .field:nth-child(4),.fulfillment-page .evidence-field,.fulfillment-page .receive-action{grid-column:1/-1}.fulfillment-page .inbound-variant{grid-template-columns:44px 1fr}.fulfillment-page .inbound-variant__progress{grid-column:1/-1;justify-items:start}}
/* Administrator-requested PayPal plan migration */
.plan-change-dialog { width: min(560px, calc(100vw - 32px)); }
.plan-change-dialog .fieldlabel { display: block; margin: 18px 0 7px; font-weight: 700; }
.plan-change-dialog .input { width: 100%; min-height: 44px; }
.plan-change-dialog__notice { margin-top: 14px; padding: 12px 14px; border: 1px solid #ffd1bd; border-radius: 10px; background: #fff5ef; color: #6d3520; line-height: 1.45; }
.user-plan-change { white-space: nowrap; }
.plan-change-flow { margin: 22px 0; padding: 24px; border: 1px solid #ffd1bd; border-radius: 16px; background: linear-gradient(135deg, #fffaf7, #fff); box-shadow: 0 10px 30px rgba(39, 24, 17, .06); }
.plan-change-flow__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.plan-change-flow__head h2, .plan-change-history h2 { margin: 0 0 7px; font-size: 20px; }
.plan-change-flow__head p { margin: 0; color: #77717c; }
.plan-change-flow__price { flex: 0 0 auto; padding: 9px 13px; border-radius: 999px; background: #ff5b14; color: #fff; font-weight: 800; }
.plan-change-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.plan-change-step { display: flex; gap: 12px; min-height: 180px; padding: 18px; border: 1px solid #e7e2df; border-radius: 13px; background: #f9f8f8; opacity: .68; }
.plan-change-step.is-active { border-color: #ff5b14; background: #fff; opacity: 1; box-shadow: 0 8px 24px rgba(255, 91, 20, .12); }
.plan-change-step.is-done { border-color: #9fd9ba; background: #f0fbf5; opacity: 1; }
.plan-change-step__number { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; background: #e8e5e4; color: #4d4745; font-weight: 800; }
.plan-change-step.is-active .plan-change-step__number { background: #ff5b14; color: #fff; }
.plan-change-step.is-done .plan-change-step__number { background: #138a4f; color: #fff; }
.plan-change-step strong { display: block; margin: 4px 0 8px; }
.plan-change-step p { margin: 0 0 15px; color: #77717c; line-height: 1.45; }
.plan-change-history { margin: 28px 0 20px; }
@media (max-width: 850px) {
  .plan-change-flow__head { flex-direction: column; }
  .plan-change-steps { grid-template-columns: 1fr; }
  .plan-change-step { min-height: 0; }
}
.plan-change-dialog__history { margin-top: 18px; padding-top: 16px; border-top: 1px solid #e7e2df; }
.plan-change-dialog__history-row { display: grid; grid-template-columns: 110px 1fr auto; gap: 10px; padding: 8px 0; border-bottom: 1px solid #f0edeb; font-size: 12px; color: #66616b; }

/* Dashboard progressive loading ------------------------------------------------ */
.dashboard-page-shimmer {
    display: grid;
    gap: 18px;
    padding: 8px 0;
}

.dashboard-shimmer-grid,
.dashboard-shimmer-panels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.dashboard-shimmer-panels {
    grid-template-columns: 2fr 1fr;
}

.dashboard-shimmer,
.dashboard-widget-loading::after {
    background: linear-gradient(100deg, #eef0f4 20%, #f8f9fb 40%, #eef0f4 60%);
    background-size: 220% 100%;
    animation: dashboard-shimmer 1.35s ease-in-out infinite;
}

.dashboard-shimmer {
    display: block;
    border-radius: 14px;
}

.dashboard-shimmer--title { width: 220px; height: 24px; }
.dashboard-shimmer--card { min-height: 118px; }
.dashboard-shimmer--panel { min-height: 270px; }

.dashboard-widget-loading {
    position: relative;
    min-height: 118px;
    overflow: hidden;
    pointer-events: none;
}

.dashboard-widget-loading > * {
    visibility: hidden;
}

.dashboard-widget-loading::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
}

.widget.dashboard-widget-loading {
    min-height: 270px;
}

@keyframes dashboard-shimmer {
    from { background-position: 100% 0; }
    to { background-position: -100% 0; }
}

@media (max-width: 900px) {
    .dashboard-shimmer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-shimmer-panels { grid-template-columns: 1fr; }
}

/* Duplicate AliExpress order protection -------------------------------------- */
.order-save-error {
    margin: 0 0 16px;
    padding: 12px 14px;
    border: 1px solid #f3b6b0;
    border-radius: 11px;
    background: #fff4f3;
    color: #9f1d1d;
    font-size: 12.5px;
    font-weight: 650;
}

.supplier-duplicate-dialog {
    width: min(500px, calc(100vw - 40px));
    padding: 28px;
    text-align: center;
}

.supplier-duplicate-dialog__icon {
    display: grid;
    width: 48px;
    height: 48px;
    margin: 0 auto 14px;
    place-items: center;
    border-radius: 50%;
    background: #fff0e8;
    color: var(--orange);
    font-size: 25px;
    font-weight: 900;
}

.supplier-duplicate-dialog .confirmbox__title {
    font-size: 18px;
}

.supplier-duplicate-dialog .confirmbox__body {
    margin: 10px 0 22px;
}

.supplier-duplicate-dialog__customer {
    display: block;
    margin-top: 10px;
    color: var(--ink);
    font-weight: 700;
}

.supplier-duplicate-dialog .confirmbox__actions {
    justify-content: center;
}

@media (max-width: 560px) {
    .supplier-duplicate-dialog .confirmbox__actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .supplier-duplicate-dialog .confirmbox__actions > button {
        width: 100%;
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-shimmer,
    .dashboard-widget-loading::after { animation: none; }
}