/* SQE Color Tokens — Base & Semantic */

:root {
  /* Base & Text */
  --paper: #FFFFFF;
  --canvas: #F5F7FB;
  --hairline: #E4E8F0;
  --ink: #0E1116;
  --slate: #5B6473;
  --logo-ink: #2E2E35;

  /* Accents — Blue scale (from #0F47E0 primary; 100/300/400/900 anchored to the SQE Suite gradient stops) */
  --blue-50: #E3F7FF;
  --blue-100: #88D5F3;
  --blue-200: #80C0FD;
  --blue-300: #8DA6FF;
  --blue-400: #389EFF;
  --blue-500: #0F76F1;
  --blue-600: #0F47E0; /* primary */
  --blue-700: #1437BF;
  --blue-800: #15289F;
  --blue-900: #121A80;
  --blue-950: #050947;

  --azure: var(--blue-600);
  --azure-text: var(--blue-700);
  --purple: #714FBA;
  --purple-text: #5B36A8;

  /* Gradients */
  --grad-brand: linear-gradient(90deg, var(--blue-600), var(--purple)); /* @kind other */
  --grad-hero: linear-gradient(120deg, var(--blue-400), #7563DB, #A02CC7); /* @kind other */
  --grad-suite: linear-gradient(90deg, var(--blue-100) 18%, var(--blue-400) 34%, var(--blue-600) 58%, var(--blue-900) 85%, var(--blue-300) 100%); /* @kind other */

  /* Semantic Colors */
  --color-primary: var(--azure);
  --color-primary-text: var(--azure-text);
  --color-secondary: var(--purple);
  --color-secondary-text: var(--purple-text);

  --color-background: var(--paper);
  --color-surface: var(--canvas);
  --color-surface-raised: var(--paper);
  --color-border: var(--hairline);

  --color-text-primary: var(--ink);
  --color-text-secondary: var(--slate);

  /* Interaction States */
  --color-focus: var(--azure);
  --color-hover-bg: rgba(15, 71, 224, 0.08);
  --color-active-bg: rgba(15, 71, 224, 0.16);

  /* Status Colors */
  --color-success: #10b981;
  --color-warning: #f59e0b;
  --color-error: #ef4444;
  --color-info: var(--azure);

  /* Text on Dark / Inverse */
  --color-text-inverse: var(--paper);
  --color-text-secondary-inverse: rgba(255, 255, 255, 0.7);
}

/*
 * PRODUCT DARK MODE — NOT part of the brand identity.
 * The SQE brand guideline explicitly retires dark, moody product UI
 * ("#121516 is retired" — see brand essence §"SQE is not"). Brand surfaces
 * (marketing, logo lockups, decks) must stay bright/white per spec.
 * This layer exists only for operational product screens where a dark
 * console genuinely helps (control rooms, night-shift mining ops) and is
 * OPT-IN via [data-theme="dark"] — never the default, never applied to
 * marketing surfaces or the SQE mark. Flag to brand owners before shipping.
 */
[data-theme="dark"] {
  --color-background: #14171C;
  --color-surface: #1B1F26;
  --color-surface-raised: #21262E;
  --color-border: #2A303A;
  --color-text-primary: #F2F4F8;
  --color-text-secondary: #9AA3B2;
  --color-hover-bg: rgba(15, 71, 224, 0.12);
  --color-active-bg: rgba(15, 71, 224, 0.2);
  --color-text-inverse: var(--ink);
  --color-text-secondary-inverse: rgba(14, 17, 22, 0.7);
}