/*
 * DS Tech — design tokens (Light Blueprint). Shared by the public site and the admin.
 * Components use these variables only; no colour literals outside this file.
 * Text/UI contrast is checked by tests/unit/ContrastTest.php.
 */
:root {
  color-scheme: light;

  /* Surfaces */
  --color-background: #F7FAFE;
  --color-surface: #FFFFFF;
  --color-surface-secondary: #F1F6FC;

  /* Brand */
  --color-primary: #1266CA;
  --color-primary-hover: #0A509F;
  --color-primary-light: #E6F1FF;
  --color-on-primary: #FFFFFF;
  --color-accent: #18A5E8;          /* decorative only (construction lines, nodes); never text */

  /* Text */
  --color-heading: #102D50;
  --color-text: #273B53;
  --color-muted: #5B6B80;           /* brief: #64748B — darkened to pass 4.5:1 on surface-secondary */

  /* Lines */
  --color-border: #DCE6F0;
  --color-border-strong: #B9CCDF;
  --color-border-input: #7A8CA3;    /* form-field boundary, >= 3:1 on every surface */

  /* Status (text on surfaces and on the matching tint) */
  --color-success: #147A57;         /* brief: #16845F — darkened for 4.5:1 */
  --color-success-bg: #E8F5EF;
  --color-error: #C73535;
  --color-error-bg: #FCEDED;
  --color-warning: #93600E;         /* brief: #A66A10 — darkened for 4.5:1 */
  --color-warning-bg: #FBF3E4;
  --color-highlight: #FFF0B3;       /* <mark> */

  /* Overlays (derived from heading navy, never pure black) */
  --color-backdrop: rgb(16 45 80 / 0.42);
  --color-scrim: rgb(16 45 80 / 0.82);
  --color-scrim-soft: rgb(16 45 80 / 0.6);
  --color-glass: rgb(247 250 254 / 0.86);
  --color-player: #0B1B30;          /* letterbox behind video frames */

  /* Blueprint drawing lines */
  --blueprint-grid: rgb(18 102 202 / 0.06);
  --blueprint-grid-major: rgb(18 102 202 / 0.11);
  --blueprint-line: rgb(24 165 232 / 0.55);

  /* Type */
  --font: "Heebo", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --step--2: clamp(0.74rem, 0.72rem + 0.08vw, 0.8rem);
  --step--1: clamp(0.84rem, 0.82rem + 0.1vw, 0.9rem);
  --step-0: clamp(1rem, 0.97rem + 0.15vw, 1.08rem);
  --step-1: clamp(1.18rem, 1.1rem + 0.4vw, 1.38rem);
  --step-2: clamp(1.42rem, 1.27rem + 0.75vw, 1.86rem);
  --step-3: clamp(1.75rem, 1.46rem + 1.45vw, 2.6rem);
  --step-4: clamp(2.15rem, 1.65rem + 2.5vw, 3.75rem);
  --step-5: clamp(2.6rem, 1.8rem + 4vw, 5.2rem);

  /* Space (4px base) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;

  /* Shape */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --shadow-1: 0 1px 2px rgb(16 45 80 / 0.06);
  --shadow-2: 0 1px 2px rgb(16 45 80 / 0.05), 0 6px 16px -4px rgb(16 45 80 / 0.08);
  --shadow-3: 0 2px 6px rgb(16 45 80 / 0.06), 0 24px 48px -12px rgb(16 45 80 / 0.18);
  --focus-ring: 0 0 0 2px var(--color-surface), 0 0 0 4px var(--color-primary);
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* "High contrast" option of the accessibility panel: same light theme, stronger ink and lines. */
html.a11y-contrast {
  --color-background: #FFFFFF;
  --color-surface-secondary: #FFFFFF;
  --color-primary: #0A4A93;
  --color-primary-hover: #06356C;
  --color-heading: #000000;
  --color-text: #0B1B30;
  --color-muted: #2E3D52;
  --color-border: #5B6B80;
  --color-border-strong: #2E3D52;
  --color-border-input: #2E3D52;
  --blueprint-grid: transparent;
  --blueprint-grid-major: transparent;
}