/* ==========================================================================
   Platinumlist Design System — Color Tokens
   Two layers:
     1. PRIMITIVES  — named palettes (Aussie, Poodle, Corgi, Saluki).
                      Reference these ONLY when defining semantic tokens.
     2. SEMANTICS   — role-based (bg-*, content-*, interaction-*, accent-*,
                      link-*, form-*, focus-*). Components consume these.

   Theme switching:
     The default :root block declares each theme-aware semantic with
     `light-dark(light-value, dark-value)`. The active mode is driven by
     CSS `color-scheme`:
       - default       → "light dark" → follows OS prefers-color-scheme
       - explicit light → [data-theme="light"]  → color-scheme: light
       - explicit dark  → [data-theme="dark"]   → color-scheme: dark
     One definition per token, no duplicated override blocks.
   ========================================================================== */

:root {
  /* Lets light-dark() resolve correctly. Without setting color-scheme
     light-dark() defaults to the light branch regardless of OS preference. */
  color-scheme: light dark;

  /* ---------- PRIMITIVES — Aussie (neutrals) ---------- */
  --aussie-100:   #0F0F15;
  --aussie-95:    #24242E;
  --aussie-90:    #2C2C38;
  --aussie-80:    #3C3C4A;
  --aussie-70:    #6E6E81;
  --aussie-60:    #9999AC;
  --aussie-50:    #B3B3C3;
  --aussie-40:    #C8C6CE;
  --aussie-30:    #DCDCE0;
  --aussie-20:    #ECEDF2;
  --aussie-10:    #F5F5F8;
  --aussie-white: #FFFFFF;

  /* ---------- PRIMITIVES — Poodle (purples / promo) ---------- */
  --poodle-100:     #19002E;
  --poodle-90:      #32025C;
  --poodle-80:      #4B038B;
  --poodle-70:      #6404B9;
  --poodle-primary: #7E05E8;
  --poodle-50:      #9737EC;
  --poodle-40:      #B169F1;
  --poodle-30:      #CB9BF5;
  --poodle-20:      #E5CDFA;
  --poodle-10:      #F2E3FF;
  --poodle-0:       #F6ECFE;

  /* ---------- PRIMITIVES — Corgi (greens / brand accelerator) ---------- */
  --corgi-80:      #81D021;
  --corgi-70:      #9BE541;
  --corgi-60:      #B0F25E;
  --corgi-50:      #BCF773;
  --corgi-primary: #C7F88A;
  --corgi-40:      #D8FFA9;
  --corgi-30:      #E2FFC0;
  --corgi-20:      #E4F6CE;
  --corgi-10:      #EEFADF;

  /* ---------- PRIMITIVES — Saluki ---------- */
  --saluki-primary: #221327;

  /* ==========================================================================
     SEMANTIC TOKENS
     Single declaration per token. light-dark() resolves at use-time based on
     the inherited color-scheme.
     ========================================================================== */

  /* BG / Surface */
  --bg-default:       light-dark(var(--aussie-white),                var(--aussie-100));
  --bg-secondary:     light-dark(var(--aussie-20),                   var(--aussie-90));
  --bg-hover:         light-dark(var(--aussie-10),                   var(--aussie-95));
  --bg-floating:      light-dark(var(--aussie-white),                var(--aussie-95));
  --bg-wash:          light-dark(rgba(153, 153, 172, 0.16),          rgba(200, 198, 206, 0.16));
  --bg-border:        light-dark(var(--aussie-20),                   var(--aussie-80));
  --bg-border-hover:  light-dark(var(--aussie-30),                   var(--aussie-70));
  --bg-fade:          rgba(15, 15, 21, 0.54);

  /* Content */
  --content-primary:      light-dark(var(--aussie-100), var(--aussie-white));
  --content-secondary:    light-dark(var(--aussie-70),  var(--aussie-50));
  --content-pure:         light-dark(#000000,           #FFFFFF);
  --content-pure-inverse: light-dark(#FFFFFF,           #000000);
  --content-highlight:    light-dark(var(--aussie-50),  var(--aussie-70));
  --content-accelerator:  light-dark(var(--poodle-primary), var(--corgi-primary));

  /* Interaction / Primary */
  --interaction-primary-bg:            light-dark(var(--saluki-primary), var(--aussie-white));
  --interaction-primary-bg-hover:      light-dark(var(--aussie-80),      var(--aussie-30));
  --interaction-primary-content:       light-dark(var(--aussie-white),   var(--aussie-100));
  --interaction-primary-content-hover: light-dark(var(--aussie-20),      var(--aussie-90));

  /* Interaction / Secondary */
  --interaction-secondary-bg:            light-dark(var(--aussie-20),       var(--aussie-90));
  --interaction-secondary-bg-hover:      light-dark(var(--aussie-10),       var(--aussie-80));
  --interaction-secondary-content:       light-dark(var(--saluki-primary),  var(--aussie-white));
  --interaction-secondary-content-hover: light-dark(var(--aussie-70),       var(--aussie-20));

  /* Interaction / Outline (was "default" — used by .pl-btn-outline) */
  --interaction-outline-border:        light-dark(var(--saluki-primary), var(--aussie-90));
  --interaction-outline-border-hover:  light-dark(var(--aussie-80),      var(--aussie-80));
  --interaction-outline-content:       light-dark(var(--saluki-primary), var(--aussie-white));
  --interaction-outline-content-hover: light-dark(var(--aussie-80),      var(--aussie-10));

  /* Interaction / Disable */
  --interaction-disable-bg:      light-dark(var(--aussie-20), var(--aussie-95));
  --interaction-disable-content: light-dark(var(--aussie-50), var(--aussie-70));
  --interaction-disable-border:  light-dark(var(--aussie-30), var(--aussie-90));

  /* Focus */
  --focus-mouse:    light-dark(#3290D2, #5AAAE3);
  --focus-keyboard: light-dark(#99D5FF, #7DCAFF);

  /* Form (pure aliases — automatically follow their referents through theme switch) */
  --form-border:       var(--bg-border);
  --form-border-hover: var(--bg-border-hover);
  --form-placeholder:  var(--interaction-disable-content);
  --form-label:        var(--content-secondary);

  /* Accent — semantic status */
  --accent-success:        #30BB47;
  --accent-success-hover:  #33D64E;
  --accent-success-light:  light-dark(#DBF7DF, #113016);

  --accent-caution:        #F9C54B;
  --accent-caution-light:  light-dark(#FAEDCF, #41320F);

  --accent-warning:        #FF8300;
  --accent-warning-light:  light-dark(#FFEBD7, #5B2D00);

  --accent-alert:          light-dark(#F93643, #FF4E51);
  --accent-alert-light:    light-dark(#FFF0F0, #411919);

  /* Accent — promo (paid-promo surfaces only) */
  --accent-promo:             var(--poodle-primary);
  --accent-promo-light:       light-dark(var(--poodle-20), #481378);
  --accent-promo-normal:      var(--poodle-40);
  --accent-promo-super-light: light-dark(var(--poodle-0), var(--poodle-90));
  --accent-promocode:         var(--poodle-primary);
  --accent-discount:          light-dark(#FF4073, #F16F71);
  --accent-badge:             #79E2FF;

  /* Link */
  --link-base:  light-dark(#1A56FF, #5E88FF);
  --link-hover: light-dark(#124CEF, #557EF1);

  /* Static (mode-invariant text colors — used in always-on-dark contexts) */
  --static-text-primary:          var(--aussie-100);
  --static-text-secondary:        var(--aussie-70);
  --static-text-invert-primary:   var(--aussie-white);
  --static-text-invert-secondary: light-dark(var(--aussie-50), var(--aussie-70));

  /* Brand (logo / marketing only — never UI chrome) */
  --brand-poodle:        var(--poodle-primary);
  --brand-platinum-day:  var(--corgi-primary);

  /* ==========================================================================
     DEPRECATED ALIASES — kept for backward compatibility.
     New code should use the canonical token on the right-hand side.
     ========================================================================== */
  --bg-base:                            var(--bg-wash);    /* renamed */
  --bg-ghost:                           var(--bg-hover);   /* renamed */
  --interaction-default-border:         var(--interaction-outline-border);
  --interaction-default-border-hover:   var(--interaction-outline-border-hover);
  --interaction-default-content:        var(--interaction-outline-content);
  --interaction-default-content-hover:  var(--interaction-outline-content-hover);
}

/* Explicit theme override — wins over the OS preference resolved by light-dark(). */
[data-theme="light"] { color-scheme: light; }
[data-theme="dark"]  { color-scheme: dark;  }
