/* ============================================================
   CISO Consulting — brand tokens
   ------------------------------------------------------------
   Sampled from the shield logo. Gold and blue are the two halves
   of the mark; white carries the light theme, black the dark.

   Gold is the primary accent — it reads as the brand at a glance
   and the blue half is close enough to a default UI blue that
   using it for links and buttons would look generic. Blue is kept
   for secondary emphasis and informational states.

   Gold on white fails contrast for text at any usable size, so the
   text tokens below step down to the darker gold stops. Never set
   body text to --brand-gold directly.
   ============================================================ */

:root {
  /* Gold — sampled #E5A833 mid, #754F14 shadow, #FEEF85 highlight */
  --gold-50:  #FDF6E3;
  --gold-100: #FAE9BC;
  --gold-200: #F5D888;
  --gold-300: #EDC155;
  --gold-400: #E5A833;   /* the mark */
  --gold-500: #C98E1F;
  --gold-600: #A5731A;
  --gold-700: #7D5715;
  --gold-800: #553B0E;
  --gold-900: #2E2007;

  /* Blue — sampled #013678 mid, #002353 shadow, #0068D7 highlight */
  --blue-50:  #E7F0FB;
  --blue-100: #C2DAF4;
  --blue-200: #8FBCEA;
  --blue-300: #4B92DE;
  --blue-400: #0068D7;   /* the mark */
  --blue-500: #0150A4;
  --blue-600: #013678;
  --blue-700: #002353;
  --blue-800: #001838;
  --blue-900: #000D1E;

  /* Neutrals — true white through true black, per your direction */
  --n-0:   #FFFFFF;
  --n-25:  #FCFCFD;
  --n-50:  #F7F8FA;
  --n-100: #EFF1F4;
  --n-200: #E2E5EA;
  --n-300: #C9CED6;
  --n-400: #9AA1AD;
  --n-500: #6B7280;
  --n-600: #4B5361;
  --n-700: #333A45;
  --n-800: #1F242C;
  --n-900: #12161B;
  --n-950: #0A0C0F;
  --n-1000: #000000;
}

/* ── Light theme — white base ───────────────────────────────── */
:root,
[data-theme="light"] {
  --c-bg:            var(--n-0);
  --c-surface:       var(--n-0);
  --c-surface-2:     var(--n-50);
  --c-surface-3:     var(--n-100);
  --c-border:        var(--n-200);
  --c-border-strong: var(--n-300);

  --c-text:          var(--n-900);
  --c-text-2:        var(--n-600);
  --c-text-3:        var(--n-500);
  --c-text-invert:   var(--n-0);

  --c-accent:        var(--gold-400);
  --c-accent-hover:  var(--gold-500);
  --c-accent-bg:     var(--gold-50);
  --c-accent-border: var(--gold-200);
  --c-accent-text:   var(--gold-700);   /* 5.9:1 on white — passes AA */
  --c-on-accent:     var(--n-900);      /* dark text on gold, never white */

  --c-info:          var(--blue-600);
  --c-info-bg:       var(--blue-50);
  --c-info-text:     var(--blue-700);
  --c-on-info:       var(--n-0);

  --c-success:       #12805C;
  --c-success-bg:    #E3F5EE;
  --c-warning:       #9A6300;
  --c-warning-bg:    #FDF3E0;
  --c-danger:        #B42318;
  --c-danger-bg:     #FEECEA;

  --c-shadow:        rgba(18, 22, 27, 0.08);
}

/* ── Dark theme — black base ────────────────────────────────── */
[data-theme="dark"] {
  --c-bg:            var(--n-1000);
  --c-surface:       var(--n-950);
  --c-surface-2:     var(--n-900);
  --c-surface-3:     var(--n-800);
  --c-border:        #23272E;
  --c-border-strong: #333A45;

  --c-text:          var(--n-50);
  --c-text-2:        var(--n-400);
  --c-text-3:        var(--n-500);
  --c-text-invert:   var(--n-1000);

  /* Gold lifts on black — the 400 stop is too heavy against pure
     black, so accents move a step lighter. */
  --c-accent:        var(--gold-300);
  --c-accent-hover:  var(--gold-200);
  --c-accent-bg:     rgba(229, 168, 51, 0.12);
  --c-accent-border: rgba(229, 168, 51, 0.30);
  --c-accent-text:   var(--gold-300);
  --c-on-accent:     var(--n-1000);

  --c-info:          var(--blue-300);
  --c-info-bg:       rgba(0, 104, 215, 0.14);
  --c-info-text:     var(--blue-200);
  --c-on-info:       var(--n-1000);

  --c-success:       #4ADE9B;
  --c-success-bg:    rgba(74, 222, 155, 0.12);
  --c-warning:       #F0B54A;
  --c-warning-bg:    rgba(240, 181, 74, 0.12);
  --c-danger:        #F87171;
  --c-danger-bg:     rgba(248, 113, 113, 0.12);

  --c-shadow:        rgba(0, 0, 0, 0.55);
}

/* Gold is a fill colour, not a text colour. These guard the two
   mistakes that follow from that: white text on gold, and gold
   text on white. */
.on-accent { color: var(--c-on-accent); }
.text-accent { color: var(--c-accent-text); }