/* ============================================================
   Centrica · Color tokens
   shadcn/ui (New York) themed with the Centrica brand palette.
   Navy (#0F2067) is the hero colour — it serves as primary,
   the dark-mode background, and the default sidebar surface.
   ============================================================ */

:root {
  /* ---- Centrica brand palette (raw) ---- */
  --centrica-navy:        rgb(15, 32, 103);
  --centrica-lilac:       rgb(185, 153, 246);
  --centrica-lilac-light: rgb(222, 207, 255);
  --centrica-lilac-dark:  rgb(102, 79, 173);
  --centrica-green:       rgb(133, 219, 156);
  --centrica-green-mid:   rgb(41, 178, 99);
  --centrica-green-dark:  rgb(3, 97, 48);
  --centrica-blue:        rgb(54, 117, 194);
  --centrica-blue-light:  rgb(171, 201, 250);
  --centrica-plum:        rgb(208, 62, 157);
  --centrica-plum-light:  rgb(226, 137, 195);
  --centrica-plum-dark:   rgb(165, 0, 145);
  --centrica-slate:       rgb(123, 146, 163);
  --centrica-slate-mid:   rgb(195, 206, 213);
  --centrica-slate-light: rgb(222, 229, 235);
  --centrica-yellow:      rgb(255, 183, 51);
  --centrica-red:         rgb(255, 26, 33);

  /* ---- Neutral ramp (Tailwind neutral) ---- */
  --neutral-50:  rgb(250, 250, 250);
  --neutral-100: rgb(245, 245, 245);
  --neutral-200: rgb(229, 229, 229);
  --neutral-300: rgb(212, 212, 212);
  --neutral-400: rgb(163, 163, 163);
  --neutral-500: rgb(115, 115, 115);
  --neutral-600: rgb(82, 82, 82);
  --neutral-700: rgb(64, 64, 64);
  --neutral-800: rgb(38, 38, 38);
  --neutral-900: rgb(23, 23, 23);
  --neutral-950: rgb(10, 10, 10);
  --white: rgb(255, 255, 255);
  --black: rgb(0, 0, 0);

  /* ============================================================
     Semantic tokens — LIGHT (default)
     ============================================================ */
  --background:            var(--white);
  --foreground:            var(--centrica-navy);

  --card:                  var(--white);
  --card-foreground:       var(--centrica-navy);
  --popover:               var(--white);
  --popover-foreground:    var(--centrica-navy);

  --primary:               var(--centrica-navy);
  --primary-foreground:    var(--neutral-50);

  --secondary:             var(--neutral-100);
  --secondary-foreground:  var(--centrica-navy);

  --muted:                 var(--neutral-100);
  --muted-foreground:      var(--centrica-slate);

  --accent:                var(--neutral-100);
  --accent-foreground:     var(--centrica-navy);

  --destructive:           var(--centrica-red);
  --destructive-foreground: rgb(254, 242, 242);

  --border:                var(--neutral-200);
  --input:                 var(--neutral-200);
  --ring:                  var(--neutral-400);

  /* Brand signature: navy sidebar with white text */
  --sidebar:                       var(--centrica-navy);
  --sidebar-foreground:            var(--white);
  --sidebar-primary:               var(--white);
  --sidebar-primary-foreground:    var(--centrica-navy);
  --sidebar-accent:                rgba(255, 255, 255, 0.12);
  --sidebar-accent-foreground:     var(--white);
  --sidebar-border:                rgba(255, 255, 255, 0.12);
  --sidebar-ring:                  rgba(255, 255, 255, 0.30);

  /* Data-viz / chart ramp */
  --chart-1: var(--centrica-navy);
  --chart-2: var(--centrica-green-mid);
  --chart-3: var(--centrica-lilac);
  --chart-4: var(--centrica-blue);
  --chart-5: var(--centrica-plum);
}

/* ============================================================
   Semantic tokens — DARK
   Centrica dark mode lives on navy, not black.
   ============================================================ */
.dark {
  --background:            var(--centrica-navy);
  --foreground:            var(--white);

  --card:                  var(--centrica-navy);
  --card-foreground:       var(--neutral-50);
  --popover:               var(--neutral-800);
  --popover-foreground:    var(--neutral-50);

  --primary:               var(--neutral-200);
  --primary-foreground:    var(--centrica-navy);

  --secondary:             var(--centrica-lilac);
  --secondary-foreground:  var(--centrica-navy);

  --muted:                 var(--neutral-800);
  --muted-foreground:      var(--neutral-400);

  --accent:                var(--neutral-700);
  --accent-foreground:     var(--neutral-50);

  --destructive:           rgb(248, 113, 113);
  --destructive-foreground: rgb(254, 242, 242);

  --border:                rgba(255, 255, 255, 0.10);
  --input:                 rgba(255, 255, 255, 0.15);
  --ring:                  var(--neutral-500);

  --sidebar:                       var(--neutral-950);
  --sidebar-foreground:            var(--neutral-50);
  --sidebar-primary:               var(--centrica-lilac);
  --sidebar-primary-foreground:    var(--centrica-navy);
  --sidebar-accent:                var(--neutral-800);
  --sidebar-accent-foreground:     var(--neutral-50);
  --sidebar-border:                rgba(255, 255, 255, 0.10);
  --sidebar-ring:                  var(--neutral-600);
}
