/**
 * SpareCrew Operator Request Desk — design tokens
 * Slate Clear dark console. Eng may map 1:1 to CSS / design-system vars.
 * Brand locked 2026-09-27.
 */

:root {
  /* —— Colour —— */
  --sc-bg: #0E1116;
  --sc-bg-elevated: #151A21;
  --sc-surface: #1A2028;
  --sc-primary: #3D4F5F;
  --sc-accent: #007A96;
  --sc-accent-hover: #0090b0;
  --sc-text: #F7F8FA;
  --sc-text-muted: #A8B0BA;
  --sc-danger: #B85C5C;
  --sc-success: #3D7A5A;
  --sc-warning: #A8843A;
  --sc-border: rgba(247, 248, 250, 0.08);
  --sc-border-strong: rgba(247, 248, 250, 0.16);
  --sc-overlay: rgba(14, 17, 22, 0.72);

  /* —— Status badge colours —— */
  --sc-status-new-bg: rgba(0, 122, 150, 0.18);
  --sc-status-new-fg: #5EB8CC;
  --sc-status-matching-bg: rgba(168, 132, 58, 0.22);
  --sc-status-matching-fg: #D4B46A;
  --sc-status-offered-bg: rgba(61, 79, 95, 0.55);
  --sc-status-offered-fg: #C5D0DA;
  --sc-status-filled-bg: rgba(61, 122, 90, 0.28);
  --sc-status-filled-fg: #7CBC9A;
  --sc-status-unfilled-bg: rgba(184, 92, 92, 0.22);
  --sc-status-unfilled-fg: #D48A8A;
  --sc-status-cancelled-bg: rgba(168, 176, 186, 0.14);
  --sc-status-cancelled-fg: #A8B0BA;

  /* —— Type —— */
  --sc-font: "Barlow", "Inter", system-ui, -apple-system, sans-serif;
  --sc-fs-xs: 0.75rem;    /* 12 */
  --sc-fs-sm: 0.8125rem;  /* 13 */
  --sc-fs-md: 0.875rem;   /* 14 */
  --sc-fs-base: 1rem;     /* 16 */
  --sc-fs-lg: 1.125rem;   /* 18 */
  --sc-fs-xl: 1.375rem;   /* 22 */
  --sc-fs-2xl: 1.75rem;   /* 28 */
  --sc-fw-regular: 400;
  --sc-fw-semibold: 600;
  --sc-fw-extrabold: 800;
  --sc-lh-tight: 1.25;
  --sc-lh-body: 1.5;

  /* —— Spacing (4/8 scale) —— */
  --sc-space-1: 0.25rem;  /* 4 */
  --sc-space-2: 0.5rem;   /* 8 */
  --sc-space-3: 0.75rem;  /* 12 */
  --sc-space-4: 1rem;     /* 16 */
  --sc-space-5: 1.5rem;   /* 24 */
  --sc-space-6: 2rem;     /* 32 */
  --sc-space-7: 2.5rem;   /* 40 */
  --sc-space-8: 3rem;     /* 48 */

  /* —— Layout —— */
  --sc-content-max: 1280px;
  --sc-sidebar-w: 220px;
  --sc-topbar-h: 56px;
  --sc-banner-h: auto;

  /* —— Radii —— */
  --sc-radius-sm: 6px;
  --sc-radius-md: 10px;
  --sc-radius-lg: 14px;
  --sc-radius-pill: 999px;

  /* —— Shadows —— */
  --sc-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --sc-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --sc-shadow-focus: 0 0 0 3px rgba(0, 122, 150, 0.45);

  /* —— Focus —— */
  --sc-focus-ring: var(--sc-shadow-focus);
  --sc-focus-outline: 2px solid var(--sc-accent);

  /* —— Banner (synthetic / env) —— */
  --sc-banner-bg: rgba(168, 132, 58, 0.16);
  --sc-banner-border: rgba(168, 132, 58, 0.35);
  --sc-banner-fg: #E8D5A3;
  --sc-banner-muted: #B8A878;

  /* —— Form —— */
  --sc-input-bg: #12161C;
  --sc-input-border: var(--sc-border-strong);
  --sc-input-h: 40px;
}

/* —— Product enums (document for Eng; not CSS values) ——
 * status: new | matching | offered | filled | unfilled | cancelled
 * settle_path: none_pre_launch | offline_manual  (only)
 * Auth: Cloudflare Access preferred; Access gate mock has no password form
 */