/* ==========================================================================
   tokens.css — 7SeaCorp WMS design tokens (Phase A)
   --------------------------------------------------------------------------
   Light is authoritative on :root.
   Dark override ships on [data-theme="dark"].

   NOTE ON THEME FALLBACK
   ----------------------
   There used to be a `@media (prefers-color-scheme: dark) :root:not([data-theme])`
   block here that duplicated every dark-mode token value as a defensive fallback
   for the case where the theme.js FOUC guard did not run. That block has been
   REMOVED to eliminate drift risk — several tokens had quietly desynced between
   the two dark blocks (--status-picked-bg, --status-packed-bg, --status-labeled-bg,
   --status-shipped-bg, --status-cancelled-bg all differed between the two).

   The invariant that makes removal safe: every overhaul HTML file
   (preview.html, pack-station.html, orders-pilot.html, order-detail.html)
   has a synchronous <script> in <head> that sets
   `document.documentElement.dataset.theme` BEFORE first paint. theme.js's
   initTheme() re-asserts it on module load. If that FOUC guard is ever
   removed from a new HTML entry point, this file needs the @media fallback
   restored (or the new page will flash-of-light on dark-preferring OSes).

   Status tokens are semantic (--status-*-bg / --status-*-fg) — consumed by
   primitives.css .chip component. See primitives.css Rosetta Stone for the
   migration map from legacy .ord-* / .badge / .status-chip classes.
   ========================================================================== */

:root {
  /* -- Surface / text ---------------------------------------------------- */
  --bg:             #ffffff;
  --bg-subtle:      #f8fafc;
  --surface:        #ffffff;
  --surface-hover:  #f1f5f9;
  --border:         #e2e8f0;
  --border-strong:  #cbd5e1;
  --text:           #0f172a;
  --text-muted:     #64748b;

  /* -- Brand / semantic -------------------------------------------------- */
  --accent:         #3b82f6;
  --accent-hover:   #2563eb;
  --accent-soft:    rgba(59,130,246,.12);
  --accent-ring:    rgba(59,130,246,.35);
  --success:        #16a34a;
  --success-soft:   #dcfce7;
  --warn:           #d97706;
  --warn-soft:      #fef3c7;
  --danger:         #dc2626;
  --danger-soft:    #fee2e2;

  /* -- Spacing (4/8/12/16/24/32/48/64) ----------------------------------- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;

  /* -- Radii ------------------------------------------------------------- */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 8px;
  --r-xl: 10px;

  /* -- Typography -------------------------------------------------------- */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --t-xs: 11px;
  --t-sm: 12px;
  --t-md: 13px;
  --t-lg: 15px;
  --t-xl: 18px;

  /* -- Motion ------------------------------------------------------------ */
  --motion-fast:   120ms ease-out;
  --motion-base:   160ms ease-out;
  --motion-slow:   200ms ease-out;

  /* -- Shadows (borders-over-shadows; reserve for floating overlays) ----- */
  --shadow-overlay: 0 20px 40px -12px rgba(15,23,42,.25), 0 2px 6px rgba(15,23,42,.08);
  --shadow-popover: 0 8px 24px -8px rgba(15,23,42,.18), 0 2px 4px rgba(15,23,42,.06);

  /* -- Overlay / backdrop / bulkbar -------------------------------------- */
  --backdrop:       rgba(15,23,42,.55);
  --bulkbar-bg:     #0f172a;
  --bulkbar-fg:     #f8fafc;
  --surface-muted:  #f1f5f9;  /* slightly tinted surface for input addons */

  /* -- Focus ring -------------------------------------------------------- */
  --focus-ring: 0 0 0 2px var(--bg), 0 0 0 4px var(--accent-ring);

  /* -- Status tokens (semantic, both modes) ------------------------------ */
  /* new / cancelled share a neutral slate palette; cancelled adds strikethrough in component */
  --status-new-bg:           #f1f5f9;
  --status-new-fg:           #475569;
  --status-allocated-bg:     #dbeafe;
  --status-allocated-fg:     #1e40af;
  --status-partial-bg:       #fef9c3;
  --status-partial-fg:       #854d0e;
  --status-out_of_stock-bg:  #fee2e2;
  --status-out_of_stock-fg:  #991b1b;
  --status-hold-bg:          #ffedd5;
  --status-hold-fg:          #9a3412;
  --status-picking-bg:       #e0e7ff;
  --status-picking-fg:       #3730a3;
  --status-picked-bg:        #dbeafe;
  --status-picked-fg:        #1e3a8a;
  --status-packing-bg:       #ccfbf1;
  --status-packing-fg:       #115e59;
  --status-packed-bg:        #bbf7d0;
  --status-packed-fg:        #14532d;
  --status-labeled-bg:       #d1fae5;
  --status-labeled-fg:       #065f46;
  --status-shipped-bg:       #16a34a;
  --status-shipped-fg:       #ffffff;
  --status-delivered-bg:     #047857;
  --status-delivered-fg:     #ffffff;
  --status-cancelled-bg:     #e2e8f0;
  --status-cancelled-fg:     #475569;

  /* Claims-workflow status tokens (draft/filed/under_review/approved/denied/paid) */
  --status-draft-bg:         #f1f5f9;
  --status-draft-fg:         #475569;
  --status-filed-bg:         #dbeafe;
  --status-filed-fg:         #1e40af;
  --status-under_review-bg:  #fef3c7;
  --status-under_review-fg:  #92400e;
  --status-approved-bg:      #dcfce7;
  --status-approved-fg:      #166534;
  --status-denied-bg:        #fee2e2;
  --status-denied-fg:        #991b1b;
  --status-paid-bg:          #047857;
  --status-paid-fg:          #ffffff;

  /* Generic semantic chip tints (success/info/warn/danger) */
  --chip-success-bg: #dcfce7; --chip-success-fg: #166534;
  --chip-info-bg:    #dbeafe; --chip-info-fg:    #1e40af;
  --chip-warn-bg:    #fef3c7; --chip-warn-fg:    #92400e;
  --chip-danger-bg:  #fee2e2; --chip-danger-fg:  #991b1b;
  --chip-neutral-bg: #f1f5f9; --chip-neutral-fg: #475569;
}

/* -------- Dark theme ------------------------------------------------------ */
:root[data-theme="dark"] {
  --bg:             #0a0f1a;
  --bg-subtle:      #0f172a;
  --surface:        #111827;
  --surface-hover:  #1e293b;
  --border:         #1f2937;
  --border-strong:  #334155;
  --text:           #f1f5f9;
  --text-muted:     #94a3b8;

  --accent:         #60a5fa;
  --accent-hover:   #3b82f6;
  --accent-soft:    rgba(96,165,250,.18);
  --accent-ring:    rgba(96,165,250,.45);
  --success:        #22c55e;
  --success-soft:   rgba(34,197,94,.15);
  --warn:           #f59e0b;
  --warn-soft:      rgba(245,158,11,.18);
  --danger:         #ef4444;
  --danger-soft:    rgba(239,68,68,.18);

  --shadow-overlay: 0 20px 40px -12px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.4);
  --shadow-popover: 0 8px 24px -8px rgba(0,0,0,.5), 0 2px 4px rgba(0,0,0,.3);

  --backdrop:       rgba(0,0,0,.70);
  --bulkbar-bg:     #334155;
  --bulkbar-fg:     #f8fafc;
  --surface-muted:  #1e293b;

  /* Dark-mode status chips: low-sat tinted backgrounds on dark surface.
     Packed/shipped use solid fills to stand out vs. the in-progress tints. */
  --status-new-bg:           rgba(148,163,184,.18);
  --status-new-fg:           #cbd5e1;
  --status-allocated-bg:     rgba(96,165,250,.20);
  --status-allocated-fg:     #93c5fd;
  --status-partial-bg:       rgba(234,179,8,.20);
  --status-partial-fg:       #fde68a;
  --status-out_of_stock-bg:  rgba(239,68,68,.22);
  --status-out_of_stock-fg:  #fca5a5;
  --status-hold-bg:          rgba(249,115,22,.22);
  --status-hold-fg:          #fdba74;
  --status-picking-bg:       rgba(99,102,241,.24);
  --status-picking-fg:       #a5b4fc;
  --status-picked-bg:        rgba(59,130,246,.26);
  --status-picked-fg:        #bfdbfe;
  --status-packing-bg:       rgba(20,184,166,.22);
  --status-packing-fg:       #5eead4;
  --status-packed-bg:        rgba(34,197,94,.24);
  --status-packed-fg:        #bbf7d0;
  --status-labeled-bg:       rgba(34,197,94,.18);
  --status-labeled-fg:       #86efac;
  --status-shipped-bg:       #16a34a;
  --status-shipped-fg:       #ffffff;
  --status-delivered-bg:     #047857;
  --status-delivered-fg:     #ffffff;
  --status-cancelled-bg:     rgba(148,163,184,.18);
  --status-cancelled-fg:     #94a3b8;

  /* Claims-workflow status tokens (dark) */
  --status-draft-bg:         rgba(148,163,184,.18);
  --status-draft-fg:         #cbd5e1;
  --status-filed-bg:         rgba(96,165,250,.20);
  --status-filed-fg:         #93c5fd;
  --status-under_review-bg:  rgba(234,179,8,.20);
  --status-under_review-fg:  #fde68a;
  --status-approved-bg:      rgba(34,197,94,.20);
  --status-approved-fg:      #86efac;
  --status-denied-bg:        rgba(239,68,68,.22);
  --status-denied-fg:        #fca5a5;
  --status-paid-bg:          #047857;
  --status-paid-fg:          #ffffff;

  --chip-success-bg: rgba(34,197,94,.20);  --chip-success-fg: #86efac;
  --chip-info-bg:    rgba(96,165,250,.22); --chip-info-fg:    #93c5fd;
  --chip-warn-bg:    rgba(245,158,11,.22); --chip-warn-fg:    #fcd34d;
  --chip-danger-bg:  rgba(239,68,68,.22);  --chip-danger-fg:  #fca5a5;
  --chip-neutral-bg: rgba(148,163,184,.16);--chip-neutral-fg: #cbd5e1;
}
