/* EXA Infrastructure design tokens for the status page and the maintenance fallback.
   Names follow the live site's stylesheet (exa-staging.shared.*.min.css, 25 Sep 2026) verbatim,
   so design.md can show property, live token and Figma variable side by side.
   Only --status--info-on-dark and --status--error are new (see design.md, section 3 and 9).
   Both pages are dark-ground only. Everything is square: radius 0. */
:root {
  /* Brand primitives */
  --brand--exa-orange: #f58045;
  --brand--abyss: #030d1c;
  --brand--steel: #1d2840;
  --brand--atlantic: #1281b5;
  --brand--tide: #b2d5e5;
  --brand--shore: #39d080;
  --brand--amber: #ffbb44;
  --brand--teal: #0fa88a;
  --brand--white: #fff;
  --brand--black: #000;

  /* Scales (only the steps these pages use) */
  --steel--300: #a5aebf;
  --steel--400: #7f8ea8;
  --steel--500: #5e6f8c;
  --steel--600: #465574;
  --steel--700: #313d58;
  --steel--800: #1d2840;
  --steel--900: #0d1525;
  --neutral--50: #fff;
  --neutral--100: #f9fafb;
  --neutral--200: #f3f4f6;
  --neutral--300: #e5e7eb;
  --neutral--400: #d1d5db;
  --neutral--500: #a8aeba;
  --neutral--700: #545968;
  --neutral--900: #11131a;
  --orange--300: #ffa879;
  --orange--500: #d9622b;
  --orange--600: #b74918;
  --atlantic--300: #53b7ea;

  /* Surfaces */
  --surface--dark-primary: var(--brand--abyss);     /* page ground */
  --surface--dark-secondary: var(--steel--800);     /* live token; pill ground */
  --surface--dark-panel: var(--steel--900);         /* Figma Surface/Secondary (dark); NOC card panel */
  --surface--dark-tertiary: var(--steel--700);
  --surface--brand: var(--brand--exa-orange);

  /* Text and icons on dark */
  --text--on-dark-primary: var(--brand--white);
  --text--on-dark-secondary: var(--neutral--300);
  --text--on-dark-tertiary: var(--steel--300);     /* muted, timestamps, unknown state; 8.72:1 on abyss */
  --text--on-dark-disabled: var(--steel--500);     /* fails AA as text; decorative use only */
  --text--link-on-dark: var(--atlantic--300);
  --text--brand: var(--brand--exa-orange);
  --icon--on-dark: var(--brand--white);
  --icon--on-dark-muted: var(--steel--300);

  /* Borders */
  --border--on-dark: var(--steel--700);
  --border--on-dark-strong: var(--steel--600);
  --border--figma-default: rgba(255, 255, 255, 0.1); /* Figma Border/Default (dark): margin columns, grid lines */

  /* Interactive */
  --interactive--primary: var(--brand--exa-orange);
  --interactive--primary-hover: var(--orange--500);
  --interactive--primary-hover-on-dark: var(--orange--300);
  --interactive--primary-active: var(--orange--600);
  --interactive--focus-ring: var(--atlantic--300);

  /* Buttons */
  --button--primary-bg: var(--brand--exa-orange);
  --button--primary-bg-hover: var(--orange--500);
  --button--primary-bg-active: var(--orange--600);
  --button--primary-text: var(--neutral--900);     /* dark text on orange: 7.12:1 (white fails at 2.61) */
  --button--secondary-on-dark-border: var(--brand--white);
  --button--secondary-on-dark-text: var(--brand--white);

  /* Status */
  --status--success: var(--brand--shore);          /* All clear: icon only, white label */
  --status--warning: var(--brand--amber);          /* Degraded (Figma Status/Warning is #f59c15; live value kept, see design.md section 9) */
  --status--info: var(--brand--atlantic);          /* live token; 4.48:1 on abyss, never use as text on dark */
  --status--info-on-dark: var(--atlantic--300);    /* NEW alias: Planned maintenance */
  --status--error: #e72424;                        /* NEW: Outage icon only, white label; see design.md section 9 */
  --status--accent: var(--brand--teal);

  /* Light surfaces and text on light (the live NOC section on the contact page) */
  --tide--100: #e7f1f7;
  --surface--light-primary: var(--neutral--50);
  --surface--light-secondary: var(--neutral--100);
  --surface--light-tertiary: var(--tide--100);
  --surface--light-section: #f3f5f6;               /* live .section_contact-noc background */
  --text--on-light-primary: var(--neutral--900);
  --text--on-light-secondary: var(--neutral--700);
  --text--on-light-tertiary: var(--neutral--600);
  --text--link-on-light: var(--brand--atlantic);   /* 4.35:1 on white: large or bold 20px text only */
  --border--on-light: var(--neutral--300);
  --border--on-light-strong: var(--neutral--400);
  --icon--on-light: var(--neutral--900);

  /* Glass (live literal values on .navbar5_component and .footer_panel) */
  --glass--nav: #030d1c66;
  --glass--panel: #030d1c99;

  /* Opacities (live: --_primitives---opacity--white-NN) */
  --white-5: #ffffff0d;
  --white-10: #ffffff1a;
  --white-15: #ffffff26;
  --white-20: #ffffff33;
  --white-30: #ffffff4d;
  --white-40: #ffffff66;
  --white-60: #ffffff99;

  /* UI */
  --radius: 0px;
  --border-width: 1px;

  /* Type */
  --font-heading: "Cabinet Grotesk", Arial, sans-serif;
  --font-body: Outfit, Arial, sans-serif;
}