/* ============================================================
   SecDim — Color tokens
   Base palette is anchored to the four official brand colors:
     Primary  #55C1E2   Black/Ink  #394447
     Text Grey #8A8A8A   White  #FFFFFF
   Scales are harmonised extensions (tints/shades) of those anchors.
   ============================================================ */
:root {
  /* -- Brand anchors (verbatim from brand guidelines) -- */
  --sd-primary: #55C1E2;   /* SecDim cyan */
  --sd-ink: #394447;       /* SecDim "Black" — slate teal */
  --sd-grey: #8A8A8A;      /* text grey */
  --sd-white: #FFFFFF;

  /* -- Primary (cyan) scale -- */
  --sd-cyan-50:  #eef9fc;
  --sd-cyan-100: #d5f0f8;
  --sd-cyan-200: #ade1f1;
  --sd-cyan-300: #7fd0e9;
  --sd-cyan-400: #55c1e2;   /* = --sd-primary */
  --sd-cyan-500: #33a9cd;
  --sd-cyan-600: #2589ab;
  --sd-cyan-700: #226e8a;
  --sd-cyan-800: #235b72;
  --sd-cyan-900: #224c60;
  --sd-cyan-950: #123141;

  /* -- Neutral / slate scale (built around #394447 & #8A8A8A) -- */
  --sd-slate-0:   #ffffff;
  --sd-slate-25:  #fbfcfc;
  --sd-slate-50:  #f5f7f7;
  --sd-slate-100: #ebeeee;
  --sd-slate-200: #dbe0e1;
  --sd-slate-300: #c2caca;
  --sd-slate-400: #9aa2a3;
  --sd-slate-500: #8a8a8a;   /* = --sd-grey */
  --sd-slate-600: #5f6b6d;
  --sd-slate-700: #495456;
  --sd-slate-800: #394447;   /* = --sd-ink */
  --sd-slate-900: #2b3335;
  --sd-slate-950: #1b2123;

  /* -- Semantic status colors -- */
  --sd-success: #22a06b;
  --sd-success-fg: #0d5f3d;
  --sd-success-bg: #e5f6ee;
  --sd-warning: #e8912a;
  --sd-warning-fg: #8a5008;
  --sd-warning-bg: #fdf1e0;
  --sd-danger: #e5484d;
  --sd-danger-fg: #9c1c25;
  --sd-danger-bg: #fdeaea;
  --sd-info: var(--sd-cyan-500);
  --sd-info-fg: var(--sd-cyan-800);
  --sd-info-bg: var(--sd-cyan-50);

  /* -- Secondary / illustration accent (orange) --
     Used in the brand spot-illustration set for highlights,
     warnings, and the certification ribbon. Pair sparingly with cyan;
     never as a primary UI action color. */
  --sd-orange: #FA6400;
  --sd-orange-600: #d65500;
  --sd-orange-bg: #fff0e6;

  /* -- Vulnerability severity (security domain) -- */
  --sd-sev-critical: #b4232a;
  --sd-sev-high: #e5484d;
  --sd-sev-medium: #e8912a;
  --sd-sev-low: #3f8ae0;
  --sd-sev-info: var(--sd-slate-500);

  /* -- Difficulty (wargame challenges) -- */
  --sd-diff-easy: #22a06b;
  --sd-diff-medium: #e8912a;
  --sd-diff-hard: #e5484d;
  --sd-diff-insane: #7c3aed;

  /* ============================================================
     Semantic aliases — light surface (default)
     ============================================================ */
  --surface-page: var(--sd-slate-50);
  --surface-card: var(--sd-white);
  --surface-sunken: var(--sd-slate-100);
  --surface-raised: var(--sd-white);
  --surface-inverse: var(--sd-slate-900);
  --surface-primary: var(--sd-primary);
  --surface-primary-subtle: var(--sd-cyan-50);

  --text-strong: var(--sd-ink);
  --text-body: var(--sd-slate-700);
  --text-muted: var(--sd-slate-500);
  --text-subtle: var(--sd-slate-400);
  --text-on-primary: var(--sd-ink);       /* cyan is light — ink reads best on it */
  --text-on-inverse: var(--sd-slate-50);
  --text-link: var(--sd-cyan-600);
  --text-link-hover: var(--sd-cyan-700);

  --border-subtle: var(--sd-slate-200);
  --border-default: var(--sd-slate-300);
  --border-strong: var(--sd-slate-400);
  --border-focus: var(--sd-cyan-400);

  --accent: var(--sd-primary);
  --accent-hover: var(--sd-cyan-500);
  --accent-active: var(--sd-cyan-600);

  /* -- Terminal / code surface (developer platform) -- */
  --code-bg: var(--sd-slate-950);
  --code-fg: #d7e0e2;
  --code-muted: #7c8a8d;
  --code-line: #2b3335;
  --code-cyan: var(--sd-cyan-300);
  --code-green: #7ee0a6;
  --code-amber: #f0b866;
  --code-red: #f2868a;
  --code-purple: #c4a6f5;
}