/* ============================================================
   Presidential Exteriors — COLOR TOKENS
   ------------------------------------------------------------
   The brand ships THREE coordinated palettes (per the playbook):
     • OG       — "when in doubt" — the default used here
     • Internal — bright + energetic (team-facing, hype, social)
     • External — muted + refined  (customer-facing, premium)
   Base hues below are the OG palette. The Internal / External
   palettes are exposed as raw tokens AND as drop-in theme
   scopes ([data-palette="internal"|"external"]).
   ============================================================ */

:root {
  /* --- OG palette (default · "when in doubt") --- */
  --prezi-navy:        #233251;
  --prezi-red:         #cc2228;
  --prezi-white:       #f6f7fa;
  --prezi-warm-white:  #f0ede6;

  /* --- Internal palette (bright + energetic) --- */
  --prezi-navy-internal:       #1b2f6e;
  --prezi-red-internal:        #cc2228;
  --prezi-white-internal:      #f6f7fa;
  --prezi-warm-white-internal: #f0ede6;

  /* --- External palette (muted + refined) --- */
  --prezi-navy-external:   #1e2b45;
  --prezi-red-external:    #8b2020;
  --prezi-white-external:  #eceef2;
  --prezi-slate-white:     #e2e4e9;

  /* --- Navy ramp (cool, architectural — tuned to the brand navy) --- */
  --navy-900: #11192c;   /* near-black brand ink            */
  --navy-800: #1a2740;
  --navy-700: #233251;   /* = OG navy / brand primary       */
  --navy-600: #2e4068;
  --navy-500: #3a5183;
  --navy-400: #5d7099;
  --navy-300: #93a1bb;
  --navy-200: #c3ccdb;
  --navy-100: #e2e6ef;
  --navy-50:  #eef1f6;

  /* --- Red ramp (brand accent) --- */
  --red-900: #6f1316;
  --red-700: #8b2020;    /* = External red (deep)           */
  --red-600: #b01e23;
  --red-500: #cc2228;    /* = OG / Internal red (signal)    */
  --red-400: #df4b50;
  --red-200: #f3b9bb;
  --red-50:  #fbe9ea;

  /* --- Neutral / slate ramp (warm-cool greys for surfaces & text) --- */
  --slate-950: #0e1117;
  --slate-900: #1c2230;
  --slate-700: #3c4456;
  --slate-600: #565f72;
  --slate-500: #717a8c;
  --slate-400: #98a0af;
  --slate-300: #c6ccd6;
  --slate-200: #dfe2e8;
  --slate-100: #eceef2;   /* = External white                */
  --slate-50:  #f6f7fa;   /* = OG / Internal white           */
  --warm-white: #f0ede6;  /* warm paper tone                 */
  --paper-edge: #e2e4e9;  /* slate-white divider tone        */
  --white: #ffffff;

  /* ===========================================================
     SEMANTIC ALIASES — reference THESE in components
     (defaults follow the OG palette)
     =========================================================== */

  /* Brand */
  --brand-primary:        var(--navy-700);
  --brand-primary-hover:  var(--navy-800);
  --brand-primary-active: var(--navy-900);
  --brand-accent:         var(--red-500);
  --brand-accent-hover:   var(--red-600);
  --brand-accent-active:  var(--red-700);
  --brand-on-primary:     var(--slate-50);
  --brand-on-accent:      #ffffff;

  /* Surfaces */
  --surface-page:    var(--slate-50);
  --surface-card:    var(--white);
  --surface-raised:  var(--white);
  --surface-sunken:  var(--slate-100);
  --surface-warm:    var(--warm-white);
  --surface-inverse: var(--navy-700);
  --surface-ink:     var(--navy-900);

  /* Text */
  --text-primary:   var(--navy-900);
  --text-secondary: var(--slate-700);
  --text-muted:     var(--slate-500);
  --text-inverse:   var(--slate-50);
  --text-on-accent: #ffffff;
  --text-accent:    var(--red-600);

  /* Borders & lines */
  --border-subtle:  var(--slate-200);
  --border-default: var(--slate-300);
  --border-strong:  var(--navy-700);
  --divider:        var(--paper-edge);

  /* Feedback */
  --success: #1f7a44;
  --warning: #c8801b;
  --danger:  var(--red-500);
  --info:    var(--navy-600);

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

/* ---- Theme scope: INTERNAL (bright + energetic) ---- */
[data-palette="internal"] {
  --brand-primary:        var(--prezi-navy-internal);
  --brand-primary-hover:  #16265a;
  --brand-primary-active: #101d46;
  --brand-accent:         var(--prezi-red-internal);
  --surface-page:         var(--prezi-white-internal);
  --surface-warm:         var(--prezi-warm-white-internal);
  --border-strong:        var(--prezi-navy-internal);
}

/* ---- Theme scope: EXTERNAL (muted + refined) ---- */
[data-palette="external"] {
  --brand-primary:        var(--prezi-navy-external);
  --brand-primary-hover:  #18233a;
  --brand-primary-active: #121b2d;
  --brand-accent:         var(--prezi-red-external);
  --brand-accent-hover:   #771b1b;
  --brand-accent-active:  #631616;
  --surface-page:         var(--prezi-white-external);
  --surface-sunken:       var(--prezi-slate-white);
  --border-subtle:        var(--prezi-slate-white);
  --text-accent:          var(--prezi-red-external);
}
