/* ---------------------------------------------------------------------------
   Design tokens. The only file that names a colour, a font, a radius or a
   shadow. Rebranding for VCFO / VCHRO / VCLO / Academy is done by swapping the
   brand block below and changing nothing else.

   Palette taken from the Virtual CxO profile deck, and matching the Backup
   Vault and Task Platform already running on this server.
--------------------------------------------------------------------------- */

:root {
  /* -------------------------------------------------------------- brand */
  --navy:        #002060;
  --navy-deep:   #001845;
  --navy-soft:   #e8edf6;
  --blue:        #1b75bc;
  --blue-link:   #0170b9;
  --blue-soft:   #e7f1fa;
  --cyan:        #00aeef;
  --burgundy:    #6e1d2d;
  --burgundy-soft: #f7ebed;
  --teal:        #35877e;
  --teal-soft:   #e6f2f0;

  --brand-primary: var(--navy);
  --brand-accent:  var(--blue);

  /* ---------------------------------------------------------- neutrals */
  --ink:       #2d2d2d;
  --body:      #4b4f58;
  --muted:     #7a7a7a;
  --line:      #e3e8ee;
  --line-soft: #eef2f7;
  --bg:        #f7f9fc;
  --card:      #ffffff;

  /* ------------------------------------------------------ traffic light
     Used identically on the dashboard, the checklist, every export and every
     email. Each one is paired with an icon and a text label in the markup:
     colour is never the only signal, so this survives printing, colour
     blindness and a black-and-white PDF. */
  --status-expired:      #b42318;   /* red    - past its expiry date       */
  --status-expired-bg:   #fdecea;
  --status-due-soon:     #c2410c;   /* amber  - 30 days or fewer           */
  --status-due-soon-bg:  #fdf0e6;
  --status-upcoming:     #a16207;   /* yellow - 90 days or fewer           */
  --status-upcoming-bg:  #fdf8e3;
  --status-valid:        #1f5f58;   /* green  - valid                      */
  --status-valid-bg:     var(--teal-soft);
  --status-missing:      #5b6270;   /* grey   - missing or not applicable  */
  --status-missing-bg:   #eef1f5;

  /* ------------------------------------------------------------- type */
  /* System stack while the UI is English-only. When Arabic ships, add an
     Arabic-capable face (IBM Plex Sans Arabic or Cairo) in front of it here
     and nowhere else. */
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
          Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Consolas, monospace;

  --text-xs:  12px;
  --text-sm:  13px;
  --text-base: 14px;
  --text-lg:  16px;
  --text-xl:  20px;
  --text-2xl: 26px;

  --weight-normal: 400;
  --weight-medium: 600;
  --weight-bold:   700;

  /* ---------------------------------------------------------- geometry */
  --radius-sm: 4px;
  --radius:    6px;
  --radius-lg: 10px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;

  --shadow-sm: 0 1px 2px rgba(0, 32, 96, 0.06);
  --shadow:    0 2px 8px rgba(0, 32, 96, 0.08);

  --sidebar-width: 232px;
}