/* ============================================================
   CCSentry — Color tokens
   Blueprint direction: cool light paper + slate ink + indigo primary,
   with crisp earthy-but-cool compliance status. Lighter & technical.
   Base palette first, semantic aliases second.
   ============================================================ */

:root {
  /* ---- Cool paper neutrals (backgrounds, surfaces) ---- */
  --paper-50:  #F4F6FA;  /* page background */
  --paper-100: #EDF1F7;  /* sunken / subtle fill */
  --paper-200: #E3E8F0;  /* muted fill, hover */
  --paper-300: #CBD4E1;  /* borders strong, dividers */
  --paper-400: #AEBACB;  /* disabled fills */
  --white:     #FFFFFF;  /* raised card surface */

  /* ---- Slate ink (text, dark surfaces) ---- */
  --ink-900: #1B2533;  /* strongest text, dark nav */
  --ink-800: #25303F;
  --ink-700: #36414F;  /* body text */
  --ink-600: #515D6B;  /* secondary text */
  --ink-500: #7A879A;  /* muted text */
  --ink-400: #9BA7B6;  /* subtle / placeholder */
  --ink-300: #C0C9D5;  /* faint */

  /* ---- Indigo (primary brand — "blueprint") ---- */
  --blue-800: #1D2F7C;
  --blue-700: #2A43AB;
  --blue-600: #3B5BDB;  /* PRIMARY */
  --blue-500: #5A74E3;
  --blue-400: #7C93EA;
  --blue-300: #A6B8F0;
  --blue-200: #C7D2F7;
  --blue-100: #DEE6FB;
  --blue-50:  #EEF1FD;

  /* ---- Compliant (cool green) ---- */
  --green-700: #1F7A4D;
  --green-600: #2F9E68;
  --green-500: #46B07D;
  --green-100: #E6F4ED;
  --green-50:  #F0F8F4;

  /* ---- Review / warning (amber) ---- */
  --amber-700: #946312;
  --amber-600: #C98A1E;
  --amber-500: #DFA63C;
  --amber-100: #FBF1DC;
  --amber-50:  #FCF7EA;

  /* ---- Fail / withheld / danger (cool brick red) ---- */
  --red-700: #9E2E25;
  --red-600: #D2493C;
  --red-500: #DD6359;
  --red-100: #FCE7E4;
  --red-50:  #FEF1EF;

  /* ---- Unknown / neutral info (cool slate) ---- */
  --slate-700: #3E4C5A;
  --slate-600: #5C6B7A;
  --slate-500: #7E8C9B;
  --slate-100: #E5E9EE;
  --slate-50:  #F1F4F7;

  /* ---- Recovered / accent positive (teal, used sparingly) ---- */
  --teal-700: #176B66;
  --teal-600: #1E8A83;
  --teal-100: #D6ECEA;

  /* ============================================================
     SEMANTIC ALIASES — reference these in components
     ============================================================ */

  /* Surfaces & backgrounds */
  --bg-page:       var(--paper-50);
  --bg-surface:    var(--white);
  --bg-sunken:     var(--paper-100);
  --bg-muted:      var(--paper-200);
  --bg-inverse:    var(--ink-900);
  --bg-brand-tint: var(--blue-50);

  /* Text */
  --text-strong:  var(--ink-900);
  --text-body:    var(--ink-700);
  --text-muted:   var(--ink-600);
  --text-subtle:  var(--ink-500);
  --text-faint:   var(--ink-400);
  --text-inverse: var(--paper-50);
  --text-brand:   var(--blue-700);
  --text-link:    var(--blue-700);

  /* Borders */
  --border-subtle:  #E8ECF3;
  --border-default: var(--paper-200);
  --border-strong:  var(--paper-300);
  --border-brand:   var(--blue-400);

  /* Brand / primary action */
  --brand:         var(--blue-600);
  --brand-hover:   var(--blue-700);
  --brand-active:  var(--blue-800);
  --brand-tint:    var(--blue-100);
  --on-brand:      #FFFFFF;

  /* Status: pass / compliant */
  --status-pass:      var(--green-600);
  --status-pass-text: var(--green-700);
  --status-pass-bg:   var(--green-50);
  --status-pass-border: var(--green-100);

  /* Status: warning / review */
  --status-warn:      var(--amber-600);
  --status-warn-text: var(--amber-700);
  --status-warn-bg:   var(--amber-50);
  --status-warn-border: var(--amber-100);

  /* Status: fail / withheld / danger */
  --status-fail:      var(--red-600);
  --status-fail-text: var(--red-700);
  --status-fail-bg:   var(--red-50);
  --status-fail-border: var(--red-100);

  /* Status: unknown / neutral */
  --status-unknown:      var(--slate-600);
  --status-unknown-text: var(--slate-700);
  --status-unknown-bg:   var(--slate-50);
  --status-unknown-border: var(--slate-100);

  /* Status: recovered / positive accent */
  --status-recovered:    var(--teal-600);
  --status-recovered-bg: var(--teal-100);

  /* Focus ring */
  --focus-ring: var(--blue-500);
}
