/* Seller workspace: offline, system-font and SVG based. Keep status colours
   separate from brand colours so that returns, errors and decisions stand out. */
:root {
  color-scheme: light;
  --paper:#f5f6f1; --surface:#ffffff; --ink:#192d27; --muted:#52665e;
  --line:#d3dcd3; --forest:#193a31; --leaf:#e0ed9f; --tint:#ebf1e0;
  --radius:14px; --focus:#1c6d52; --accent:#216449;
  --bg:var(--paper); --bg2:#f4f6ef; --card:var(--surface); --card2:#eaf0e6;
  --panel:var(--surface); --border:var(--line); --text:var(--ink);
  --orange:var(--accent); --orange2:#14583e; --green:#17613f;
  --red:#a62a38; --yellow:#815008; --sidebar-w:220px;
  --ws-amber-bg:#fff4d9; --ws-amber-line:#d6b373;
  --ws-red-bg:#fff0ed; --ws-red-line:#d99a98;
  --ws-success-bg:#edf6ed; --ws-success-line:#a6c6ad;
  --ws-blue:#225779; --ws-blue-bg:#ecf4f8; --ws-blue-line:#afc9d6;
}
body { font-family:"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif; font-size:14px; line-height:1.45; background:var(--paper); color:var(--ink); }
::selection { color:#172a20; background:#dceaa9; }
.ui-icon { box-sizing:content-box; display:inline-block; width:1.1em; height:1.1em; min-width:0; flex:0 0 auto;
  fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.19em; pointer-events:none; }
a .ui-icon,button .ui-icon { width:1.02em; height:1.02em; }
a { color:var(--orange2); text-underline-offset:.15em; text-decoration-thickness:1px; }
a:hover { color:#0d402d; }
button,.button,input,select,textarea { font-family:inherit; }
button,.button { color:var(--ink); background:var(--surface); border:1px solid #becbc0; border-radius:8px; box-shadow:none; font-weight:550;
  transition:background-color 120ms ease,border-color 120ms ease,color 120ms ease; }
button:not(:disabled):hover,.button:hover { background:#edf2e9; border-color:#779783; color:var(--ink); }
button.primary,.button.primary { color:white; background:var(--forest); border:1px solid var(--forest); box-shadow:none; font-weight:650; }
button.primary:not(:disabled):hover,.button.primary:hover { background:#275241; border-color:#275241; color:white; filter:none; }
button:disabled { opacity:.55; }
input,select,textarea { color:var(--ink); background:var(--surface); border-color:#b8c6ba; border-radius:8px; }
input::placeholder,textarea::placeholder { color:#65776e; opacity:1; }
input:focus,select:focus,textarea:focus { border-color:var(--focus); }
:is(button,input,select,textarea,summary,a,[tabindex]):focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
input[type=date] { color-scheme:light; }
input[type=checkbox],input[type=radio] { accent-color:var(--accent); }
input[type=file] { max-width:100%; }
input[type=file]::file-selector-button { color:var(--forest); font:inherit; font-weight:600; border:1px solid #bdcbbb; border-radius:5px; background:#eef3e7; margin-right:8px; padding:4px 8px; }
textarea { line-height:1.45; }
code { color:var(--forest); background:var(--bg2); overflow-wrap:anywhere; }
h2,h3 { letter-spacing:-.018em; }
.lead { color:var(--muted); max-width:100ch; }
.hidden,[hidden] { display:none!important; }

/* Fixed header/footer within the rail; only the tab list should scroll. */
#sidebar { height:100dvh; max-height:100dvh; overflow:hidden; background:#1b332c; color:#edf4eb; border:0; }
#sidebar.hidden-menu { padding:0; border:0; }
.brand { min-height:74px; margin:0 10px; padding:13px 3px; gap:9px; border-bottom:1px solid #ffffff25; }
.logo { width:34px; height:37px; border-radius:9px; color:#19372a; background:var(--leaf); box-shadow:none; }
.logo .ui-icon { width:24px; height:24px; stroke-width:2; }
.brand-copy { min-width:0; }
.brand h1 { max-width:133px; font-size:16px; font-weight:680; letter-spacing:-.035em; overflow:hidden; text-overflow:ellipsis; }
.brand small { display:block; font-size:10.5px; color:#c1cfc5; }
#collapseBtn { flex-shrink:0; display:grid; place-items:center; min-width:26px; min-height:30px; border:0; color:#c3d3c8; background:transparent; }
#collapseBtn:hover { color:white; background:#ffffff16; }
#menuRestore { top:12px; left:10px; background:var(--forest); color:white; border:1px solid #456653; box-shadow:0 2px 5px #172a1c21; }
#menuRestore:not(:disabled):hover { background:#2b5040; color:white; filter:none; }
#menuRestore:focus-visible { outline:2px solid var(--focus); }
#sidebar nav { flex:1 1 0; overflow:auto; overflow-x:hidden; padding:10px 8px; gap:2px; scrollbar-color:#647b6b transparent; scrollbar-width:thin; }
#sidebar nav button,.sidefoot button { min-height:32px; padding:7px 9px; gap:11px; background:transparent; color:#d3e0d6; border:0; border-radius:7px; font-size:12.5px; font-weight:510; line-height:1.3; }
#sidebar nav button .ui-icon,.sidefoot .ui-icon { width:16px; height:16px; }
#sidebar nav button:hover,.sidefoot button:hover { color:white; background:#304b3f; }
#sidebar nav button.active { color:#f7faef; background:#395643; box-shadow:inset 3px 0 var(--leaf); font-weight:650; }
#sidebar :is(button,summary):focus-visible { outline-color:var(--leaf); outline-offset:-2px; }
#sidebar .sidefoot { flex:0 0 auto; position:relative; margin:0 10px; border-color:#ffffff25; padding:6px 0 9px; }
#sidebar .tools-subnav { margin:2px 0 5px 17px; padding:2px 0 2px 10px; border-left:1px solid #718777; flex-shrink:0; }
#sidebar .tools-subnav button { min-height:28px; color:#c8d7cb; font-size:11.5px; }
.badge { background:#e2ecb4; color:#233d2e; border-radius:6px; font-weight:750; }

/* Common surfaces and forms. Tables retain their original local paging,
   horizontal resizing/scrolling and keyboard controls. */
main>.tab { min-width:0; }
.tab .card,.stat,.scrollwrap,.thread-list,.thread-view,.order-panel { border-color:var(--line); border-radius:var(--radius); }
.tab .card,.stat { padding:16px; box-shadow:0 1px 2px #1a332607; }
.tab .card h2:first-child,.tab .card h3:first-child { color:var(--ink); }
.tab .form { background:white; color:var(--ink); border:1px solid var(--line); border-radius:var(--radius); padding:18px; margin-top:9px; }
.tab .form label { gap:6px; font-weight:600; }
.form button.primary { align-self:flex-start; }
.tab .form input:not([type=checkbox]):not([type=radio]),.tab .form select,.tab .form textarea { max-width:100%; font-weight:400; }
.toolbar { row-gap:8px; }
.toolbar label { color:var(--muted); }
.scrollwrap { background:var(--surface); overscroll-behavior-x:contain; }
th { background:#f1f4eb; font-size:10.5px; letter-spacing:.045em; color:#495d50; }
td { color:var(--ink); }
tr:hover td { background:#f0f4ed; }
.table-sort,.table-sort:hover { color:inherit; background:transparent; border:0; }
.table-sort:focus-visible { outline:2px solid var(--focus); outline-offset:-2px; }
.tag,.ctype { font-weight:550; }
.tag { background:#f2f5ee; }
.tag.ok { color:var(--green); border-color:var(--ws-success-line); background:var(--ws-success-bg); }
.tag.warn { color:var(--yellow); border-color:var(--ws-amber-line); background:var(--ws-amber-bg); }
.tag.bad,.ctype.claim { color:var(--red); border-color:var(--ws-red-line); background:var(--ws-red-bg); }
.ctype.dispute { color:var(--ws-blue); border-color:var(--ws-blue-line); background:var(--ws-blue-bg); }
.label-chip { color:var(--ink); border-color:color-mix(in srgb,var(--lc) 50%,#647366); opacity:1; background:white; }
.label-chip:hover,.label-chip.on { color:var(--ink); background:color-mix(in srgb,var(--lc) 26%,white); }
.label-chip.on { border-width:2px; padding:1px 8px; }
.stat { background:white; }
.stat .value { font-variant-numeric:tabular-nums; letter-spacing:-.035em; }
.stat.hl { background:var(--tint); border-color:#aec2a3; box-shadow:none; }
.stat.hl .value { color:var(--forest); }
dialog,.modal .card { color:var(--ink); background:var(--surface); border:1px solid #bfccc1; border-radius:16px; box-shadow:0 18px 65px #122c2529; }
dialog { margin:auto; }
dialog::backdrop,.modal { background:rgba(26,43,34,.39); backdrop-filter:blur(3px); }
#siteLock { background:radial-gradient(ellipse at 18% 25%,#edf0dd,transparent 58%),var(--paper); }
#siteUnlockForm { width:min(400px,calc(100vw - 32px)); padding:32px 28px; border:1px solid var(--line); }
#siteUnlockForm h2 { font-size:23px; letter-spacing:-.045em; }
#siteUnlockForm #siteUnlock { margin-top:17px!important; }
#loginModal .card { max-width:min(100vw - 32px,420px)!important; padding:22px; }
.handled-card { opacity:1; background:#f6f7f2; }
.placeholder { color:var(--muted); }

/* Health/urgency, read at a glance without relying on color alone. */
.ticket-sync-health { background:#f0f5eb; color:#34513b; border-color:#c9d6bd; font-size:12px; }
.ticket-sync-health.problem,.account-warning { color:#762636; border-color:#d6a8aa; background:#fff1ef; }
.ticket-sync-health .sync-account { border-top:1px solid #d2d6ca; }
.ticket-sync-health .sync-account .bad { color:#8a2330; }
.ticket-sync-health .muted { color:#536257; }
.purchase-duplicate-notice.has-duplicates,.inbox-attention-summary,.thread-attention {
  color:#65420b; background:var(--ws-amber-bg); border-color:var(--ws-amber-line); }
.inbox-attention-summary span:last-child,.thread-attention span:last-child { color:#6c531f; }
.thread-attention strong,.thread-item.unread .who { color:var(--ink); }
.thread-item:hover { background:#f0f4eb; }
.thread-item.selected { background:#e8f0dd; border-left-color:var(--accent); }
.thread-item.needs-reply { border-left-color:#b47a10; background:#fff9eb; }
.thread-item.needs-reply:hover,.thread-item.selected.needs-reply { border-left-color:#9b6207; background:#fff1cf; }
.thread-new { background:#922b3a; color:#fff; }
.thread-reply,.customer-message-label { color:#593900; background:#f5d78d; }
.msgs { background:#f8f9f5; }
.msg.in { background:white; border:1px solid var(--line); }
.msg.in.customer-latest { background:#fff9e8; color:var(--ink); border-color:#b5872e; box-shadow:none; }
.msg.out { color:#203c2b; background:#e6efdc; border-color:#c0cfb8; }
.replybox,.thread-head { background:white; border-radius:inherit; }
.copy-inline { color:var(--orange2); border-color:transparent; background:transparent; }
.copy-inline:not(:disabled):hover { color:#123e2a; background:#deebdc; }
.message-product,.copy-phone,.order-set-summary { background:var(--ws-blue-bg); color:var(--ws-blue); border-color:var(--ws-blue-line); }
.older-orders-separator { color:#654281; }
.older-orders-separator::before,.older-orders-separator::after { border-color:#b7a8c1; }
.processing-helper,.pickup,.recipient-details { border-color:#b6c7ad; background:#f0f4e8; }
.order-sections>.order-section,.order-products .oitem { background:var(--surface); }
.ocard.order-alert,.purchase-order-alert>td,tr.warn-bad td { color:var(--ink); background:var(--ws-red-bg); border-color:var(--ws-red-line); }
.ocard.order-processed:not(.order-alert) { background:var(--ws-success-bg); border-color:var(--ws-success-line); }
tr.warn-ok td { background:#fffaed; }
.allegro-price-line,.allegro-price-summary { color:#225a3a; background:#eaf5e9; border-color:#b1d1b6; }
.allegro-price-line b,.allegro-price-summary>b { color:#165232; }
.qty-2 { color:#225b80; background:#e8f2f9; }
.qty-3 { color:#13665d; background:#e7f3f0; }
.qty-4 { color:#805300; background:#fff3d6; }
.qty-5 { color:#704588; background:#f5eafa; }
.qty-6plus { color:#8c2c42; background:#fcecf0; }
.order-state-cancelled,.order-state-return { color:#902b3b; background:#fdebed; border-color:#d6a0a8; }
#tab-repricing .rp-switch { background:#75837a; }
#tab-repricing .rp-switch.on { background:#29664a; }
#tab-repricing .rp-error { color:var(--red); }
#tab-repricing [data-dirty] { color:#83500d; }
#tab-repricing .rp-warning { box-shadow:inset 3px 0 var(--red); }
@container order-details (max-width:530px) {
  .helper-purchase-item { grid-template-columns:minmax(0,1fr) auto; }
  .helper-purchase-item input { grid-column:1; }
  .helper-purchase-item .helperItemRemove { grid-column:2; grid-row:1 / span 3; }
}
@media(max-width:980px) { :root { --sidebar-w:185px; } }
@media(max-width:720px) {
  :root { --sidebar-w:60px; }
  #sidebar .brand { justify-content:center; flex-direction:column; gap:3px; padding:9px 0 6px; margin:0 6px; }
  #sidebar .brand-copy { display:none; }
  #sidebar nav { padding:7px 5px; }
  #sidebar nav>button,.sidefoot button { position:relative; min-height:37px; justify-content:center; padding:7px 3px; }
  #sidebar nav>button>span:not(.badge),#sidebar .sidefoot button>span { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; }
  #sidebar .badge { position:absolute; top:0; right:0; padding:0 2px; font-size:8px; }
  #sidebar .sidefoot { margin:0 5px; }
  #sidebar .tools-subnav { margin:0; padding:0; border:0; }
  #sidebar .tools-subnav button { display:block; font-size:9px; text-align:center; line-height:1.2; padding:3px; }
  main { padding:12px; }
  .tab .card { padding:12px; }
  .toolbar input:not([type=checkbox]):not([type=radio]),.toolbar select,.form label { max-width:100%; min-width:0; }
  .form { max-width:100%; }
  .tpl-row { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:0s!important; } }
