/* ProfitLens design-system tokens (app-wide).
   Source: the ProfitLens design system on claude.ai/design — palette, semantic
   aliases, chart encoding and the demand heat ramp. Loaded before main.css on
   every page; main.css maps its legacy --color-* names onto these values so
   the whole app recolors from here.
   Chart encoding contract: teal = you/current, blue = market benchmark,
   dashed slate = history/baseline, gold = events, green/red = signed business
   deltas only. Hue never carries magnitude — the heat ramp is one hue ordered
   by lightness. */
:root {
  /* ---- Base palette ---- */
  --slate-25: #F6F8FB;
  --slate-50: #EAF0F4;
  --slate-100: #E1E8EF;
  --slate-200: #D6DEE8;
  --slate-300: #B6C2D1;
  --slate-400: #94A3B8;
  --slate-500: #6B7A8F;
  --slate-600: #526075;
  --slate-800: #2A374C;
  --slate-900: #172033;
  --white: #FFFFFF;

  --teal-700: #0F766E;
  --teal-800: #0C5F59;
  --teal-900: #094C47;
  --teal-100: #D7E8E6;
  --teal-50: #E9F3F2;

  --blue-700: #1D4ED8;
  --blue-100: #DDE5FB;
  --blue-50: #EDF1FD;

  --green-700: #15803D;
  --green-50: #ECF4EF;
  --amber-700: #B45309;
  --amber-50: #FBF2E6;
  --red-700: #B91C1C;
  --red-50: #FBECEC;
  --gold-700: #A16207;
  --gold-100: #F1E4C6;
  --gold-50: #F9F2E2;

  /* ---- Surfaces / text / lines ---- */
  --surface-base: var(--slate-25);
  --surface-raised: var(--white);
  --surface-muted: var(--slate-50);
  --surface-inset: #F1F4F8;
  --text-primary: var(--slate-900);
  --text-secondary: var(--slate-600);
  --border-subtle: var(--slate-200);
  --border-strong: var(--slate-300);
  --focus-ring: rgba(15, 118, 110, 0.28);

  /* ---- Brand / semantics ---- */
  --primary: var(--teal-700);
  --primary-hover: var(--teal-800);
  --primary-active: var(--teal-900);
  --primary-subtle: var(--teal-50);
  --primary-border: var(--teal-100);
  --success: var(--green-700);
  --warning: var(--amber-700);
  --danger: var(--red-700);
  --event: var(--gold-700);

  /* ---- Chart encoding ---- */
  --chart-primary: var(--teal-700);     /* you / current */
  --chart-baseline: var(--slate-400);   /* history, previous */
  --chart-forecast: var(--blue-700);    /* market benchmark / forward view */
  --chart-event: var(--gold-700);
  --chart-positive: var(--success);
  --chart-negative: var(--danger);
  --chart-grid: #E4EAF1;
  --chart-axis: var(--slate-500);
  --chart-band: rgba(29, 78, 216, 0.10);

  /* ---- Demand-intensity ramp (one hue, low → high) ---- */
  --heat-1: #EDF2F6;
  --heat-2: #C9DFDC;
  --heat-3: #92C4BE;
  --heat-4: #4E9E96;
  --heat-5: #0F766E;

  /* ---- Type ---- */
  --font-sans-ds: 'IBM Plex Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono-ds: 'IBM Plex Mono', ui-monospace, Consolas, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
}