/* ============================================================================
   TIER 1 — PRIMITIVES
   Source: design-system/DESIGN.md §4.1 (colour), §5.1 (type), §6 (dimension), §8 (elevation)

   NEVER reference anything in this file from component code.
   Primitives exist so the Brand and Semantic tiers have something to alias.
   See CLAUDE.md non-negotiable #2.
   ========================================================================== */

:root {
  /* --- Primitives/Color → --palette-* ----------------------------------- */

  /* Neutral — 16 steps. 450 / 750 / 950 are custom additions for Dark. */
  --palette-neutral-100: #ffffff;
  --palette-neutral-200: #fafafa;
  --palette-neutral-300: #f5f5f5;
  --palette-neutral-400: #f0f0f0;
  --palette-neutral-450: #e6e6e6;
  --palette-neutral-500: #d9d9d9;
  --palette-neutral-600: #bfbfbf;
  --palette-neutral-700: #8c8c8c;
  --palette-neutral-750: #666666;
  --palette-neutral-800: #595959;
  --palette-neutral-900: #434343;
  --palette-neutral-950: #2f2f2f;
  --palette-neutral-1000: #262626;
  --palette-neutral-1100: #1f1f1f;
  --palette-neutral-1200: #141414;
  --palette-neutral-1300: #000000;

  /* Status ramps — identical role pattern per step. */
  --palette-red-100: #fff1f0;
  --palette-red-200: #ffccc7;
  --palette-red-300: #ffa39e;
  --palette-red-400: #ff7875;
  --palette-red-500: #ff4d4f;
  --palette-red-600: #f5222d;
  --palette-red-700: #cf1322;
  --palette-red-800: #a8071a;
  --palette-red-900: #820014;
  --palette-red-1000: #5c0011;

  --palette-gold-100: #fffbe6;
  --palette-gold-200: #fff1b8;
  --palette-gold-300: #ffe58f;
  --palette-gold-400: #ffd666;
  --palette-gold-500: #ffc53d;
  --palette-gold-600: #faad14;
  --palette-gold-700: #d48806;
  --palette-gold-800: #ad6800;
  --palette-gold-900: #874d00;
  --palette-gold-1000: #613400;

  --palette-green-100: #f6ffed;
  --palette-green-200: #d9f7be;
  --palette-green-300: #b7eb8f;
  --palette-green-400: #95de64;
  --palette-green-500: #73d13d;
  --palette-green-600: #52c41a;
  --palette-green-700: #389e0d;
  --palette-green-800: #237804;
  --palette-green-900: #135200;
  --palette-green-1000: #092b00;

  --palette-blue-100: #e6f4ff;
  --palette-blue-200: #bae0ff;
  --palette-blue-300: #91caff;
  --palette-blue-400: #69b1ff;
  --palette-blue-500: #4096ff;
  --palette-blue-600: #1677ff;
  --palette-blue-700: #0958d9;
  --palette-blue-800: #003eb3;
  --palette-blue-900: #002c8c;
  --palette-blue-1000: #001d66;

  /* Brand ramp — BigHeart. 350 is a custom half-step (Dark solid hover). */
  --palette-bigheart-100: #d7cce0;
  --palette-bigheart-200: #b89fd4;
  --palette-bigheart-300: #9a75c7;
  --palette-bigheart-350: #8b63c1;
  --palette-bigheart-400: #7c50ba;
  --palette-bigheart-500: #5f2fad;
  --palette-bigheart-600: #4211a0; /* the brand seed */
  --palette-bigheart-700: #2c077a;
  --palette-bigheart-800: #180154;
  --palette-bigheart-900: #0b002e;
  --palette-bigheart-1000: #020008;

  /* Brand ramp — BWHI. 450 is a custom half-step (Dark solid hover). */
  --palette-bwhi-100: #ebdde3;
  --palette-bwhi-200: #debacb;
  --palette-bwhi-300: #d18eb0;
  --palette-bwhi-400: #c46698;
  --palette-bwhi-450: #bb4e8a;
  --palette-bwhi-500: #b84285;
  --palette-bwhi-600: #ac2376; /* the brand seed */
  --palette-bwhi-700: #85145b;
  --palette-bwhi-800: #5e0942;
  --palette-bwhi-900: #380328;
  --palette-bwhi-1000: #12010d;

  /* Brand soft surfaces — pre-flattened opaque values, not alpha layers.
     Light = seed at 6/10/16% over #fff. Dark = dark solid stop at 16/24/32% over #262626. */
  --palette-bigheart-soft-light: #f4f1f9;
  --palette-bigheart-soft-light-hover: #ece7f6;
  --palette-bigheart-soft-light-pressed: #e1d9f0;
  --palette-bigheart-soft-dark: #342d3e;
  --palette-bigheart-soft-dark-hover: #3b304a;
  --palette-bigheart-soft-dark-pressed: #413355;

  --palette-bwhi-soft-light: #faf2f7;
  --palette-bwhi-soft-light-hover: #f7e9f1;
  --palette-bwhi-soft-light-pressed: #f2dce9;
  --palette-bwhi-soft-dark: #3d2a35;
  --palette-bwhi-soft-dark-hover: #492d3d;
  --palette-bwhi-soft-dark-pressed: #552f44;

  /* Base — theme-independent. Scrim is the only primitive that carries alpha
     by intent; the Alpha/Black-* steps are shadow-only. */
  --palette-base-white: #ffffff;
  --palette-base-black: #000000;
  --palette-base-transparent: #00000000;
  --palette-base-scrim: #00000073;
  --palette-base-alpha-black-8: #00000014;
  --palette-base-alpha-black-12: #0000001f;
  --palette-base-alpha-black-16: #00000029;
  --palette-base-alpha-black-24: #0000003d;
  --palette-base-alpha-black-40: #00000066;

  /* --- Primitives/Dimension → --dimension-scale-* ----------------------- */
  --dimension-scale-0: 0px;
  --dimension-scale-1: 1px;
  --dimension-scale-2: 2px;
  --dimension-scale-4: 4px;
  --dimension-scale-8: 8px;
  --dimension-scale-12: 12px;
  --dimension-scale-16: 16px;
  --dimension-scale-24: 24px;
  --dimension-scale-32: 32px;
  --dimension-scale-40: 40px;
  --dimension-scale-48: 48px;
  --dimension-scale-64: 64px;
  --dimension-scale-80: 80px;
  --dimension-scale-96: 96px;
  --dimension-scale-full: 9999px;

  /* --- Primitives/Typography → --type-scale-* --------------------------- */
  --type-scale-size-10: 10px;
  --type-scale-size-12: 12px;
  --type-scale-size-14: 14px;
  --type-scale-size-16: 16px;
  --type-scale-size-18: 18px;
  --type-scale-size-20: 20px;
  --type-scale-size-24: 24px;
  --type-scale-size-30: 30px;

  --type-scale-weight-regular: 400;
  --type-scale-weight-medium: 500;
  --type-scale-weight-semibold: 600; /* not used by the semantic layer; kept for ramp completeness */
  --type-scale-weight-bold: 700;

  /* Figma binds letter spacing in PIXELS — it does not scale with font size. */
  --type-scale-letter-spacing-none: 0px;
  --type-scale-letter-spacing-tight: -0.3px;
  --type-scale-letter-spacing-wide: 0.4px; /* not currently used */

  --type-scale-family-roboto: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --type-scale-family-sf-text: -apple-system, "SF Pro Text", BlinkMacSystemFont, sans-serif;
  --type-scale-family-sf-display: -apple-system, "SF Pro Display", BlinkMacSystemFont, sans-serif;

  /* --- Primitives/Elevation → --elevation-shadow-* ----------------------
     Step values reused for offset OR blur. Spread is always 0. */
  --elevation-shadow-0: 0px;
  --elevation-shadow-1: 1px;
  --elevation-shadow-2: 2px;
  --elevation-shadow-3: 3px;
  --elevation-shadow-4: 4px;
  --elevation-shadow-6: 6px;
  --elevation-shadow-8: 8px;
  --elevation-shadow-12: 12px;
  --elevation-shadow-16: 16px;
  --elevation-shadow-24: 24px;
  --elevation-shadow-40: 40px;
}