/* ═══════════════════════════════════════════════════════════════════
   ERP THEME VARIANTS — selectable colour themes (per-tenant)
   ═══════════════════════════════════════════════════════════════════
   Each theme is a set of --erp-* token overrides layered ON TOP of the
   base palette in erp-themes.css. It is scoped by a data-theme attribute
   on <html> (set server-side in the layout), so it never flashes.

   • Light variant  →  html[data-theme="<id>"]
   • Dark variant   →  html[data-theme="<id>"].dark   (wins over html.dark
                        by specificity: attribute + class)

   The DEFAULT theme has NO block here on purpose — it falls through to the
   base :root / html.dark palette, so the current look is unchanged. Only
   brand tokens (primary / accent / info / chart / surfaces / text / border)
   are re-skinned; the semantic success / warning / danger tokens stay shared
   so their traffic-light meaning is constant across themes.

   Catalog + validation live in config/themes.php (keys must match the
   data-theme ids below).
   ═══════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════════
   LUNAR — navy #092241 + teal #2DC0CB (from the Lunar Labs logo)
   ═══════════════════════════════════════════════════════════════════ */

/* ─── Lunar · LIGHT ─────────────────────────────────────────────── */
html[data-theme="lunar"] {
  /* RGB channels — feed shadows, rings, glass */
  --erp-primary-deep-rgb:   9, 34, 65;      /* #092241 navy */
  --erp-primary-glow-rgb:   45, 192, 203;   /* #2DC0CB teal */
  --erp-glass-tint-rgb:     214, 238, 241;  /* faint teal */
  --erp-glass-border-rgb:   9, 34, 65;

  /* Surfaces — cool, faint teal-gray */
  --erp-bg:             #ffffff;
  --erp-bg-page:        #eef3f6;
  --erp-bg-muted:       #e4edf1;
  --erp-bg-accent:      #d2e3e8;

  /* Text — navy family (top two; keep secondary/tertiary/faint for contrast) */
  --erp-text:           #0f2740;
  --erp-text-medium:    #092241;

  /* Borders — cool blue-gray */
  --erp-border:         #d3dee5;
  --erp-border-strong:  #b6c6d0;
  --erp-border-row:     #eaf0f3;

  /* Primary — deep navy, teal focus ring */
  --erp-primary:        #092241;
  --erp-primary-fg:     #ffffff;
  --erp-primary-hover:  #0e3057;
  --erp-primary-ring:   rgba(45, 192, 203, 0.35);
  --erp-primary-light:  #d6eef2;

  /* Info — brand teal / navy */
  --erp-info-bg:        #e3f6f8;
  --erp-info-bg-mid:    #cfeff2;
  --erp-info-bg-solid:  #2DC0CB;
  --erp-info-bg-dark:   #092241;
  --erp-info-border:    #a9e2e7;
  --erp-info-text:      #0b5a63;
  --erp-info-icon:      #17a2b0;
  --erp-info-light:     #5fd0d9;

  /* Accent — teal */
  --erp-accent-bg:      #e3f6f8;
  --erp-accent-bg-mid:  #d3eef1;
  --erp-accent-border:  #a9e2e7;
  --erp-accent-text:    #0b5a63;
  --erp-accent-icon:    #17a2b0;
  --erp-accent-light:   #5fd0d9;

  /* Gradient start */
  --erp-gradient-from:  #ffffff;

  /* Charts — lead with navy + teal */
  --erp-chart-1: #092241;
  --erp-chart-2: #2DC0CB;
  --erp-chart-3: #10b981;
  --erp-chart-4: #f59e0b;
  --erp-chart-5: #ef4444;
  --erp-chart-6: #17a2b0;
  --erp-chart-7: #06b6d4;
  --erp-chart-8: #6b8ba3;
  --erp-chart-1-light: #2DC0CB;
  --erp-chart-2-light: #7fd6de;
  --erp-chart-label: #6b8ba3;
}

/* ─── Lunar · DARK ──────────────────────────────────────────────── */
html[data-theme="lunar"].dark {
  /* RGB channels */
  --erp-primary-deep-rgb:   26, 166, 179;   /* teal */
  --erp-primary-glow-rgb:   45, 192, 203;
  --erp-shadow-tint-rgb:    6, 20, 36;
  --erp-glass-tint-rgb:     17, 42, 72;
  --erp-glass-border-rgb:   45, 192, 203;
  --erp-surface-glass-rgb:  18, 44, 74;

  /* Surfaces — deep navy */
  --erp-bg:             #122a48;
  --erp-bg-page:        #0a1f38;
  --erp-bg-muted:       #17334f;
  --erp-bg-accent:      #1f4160;

  /* Text — near-white, cool tint */
  --erp-text:           #eef6f8;
  --erp-text-medium:    #dbe8ee;
  --erp-text-secondary: #b9cbd6;
  --erp-text-tertiary:  #90a6b4;
  --erp-text-faint:     #6f8494;

  /* Borders */
  --erp-border:         #294a68;
  --erp-border-strong:  #38607f;
  --erp-border-row:     #1c3a58;

  /* Primary — teal (readable with white text, matches the app's dark bar) */
  --erp-primary:        #1aa6b3;
  --erp-primary-fg:     #ffffff;
  --erp-primary-hover:  #22c0cd;
  --erp-primary-ring:   rgba(45, 192, 203, 0.40);
  --erp-primary-light:  rgba(45, 192, 203, 0.22);

  /* Info — teal */
  --erp-info-bg:        rgba(45, 192, 203, 0.16);
  --erp-info-bg-mid:    rgba(45, 192, 203, 0.22);
  --erp-info-bg-solid:  #1aa6b3;
  --erp-info-bg-dark:   #14808b;
  --erp-info-border:    rgba(45, 192, 203, 0.40);
  --erp-info-text:      #8fe1e8;
  --erp-info-icon:      #34c6d1;
  --erp-info-light:     #5fd0d9;

  /* Accent — teal */
  --erp-accent-bg:      rgba(45, 192, 203, 0.10);
  --erp-accent-bg-mid:  rgba(45, 192, 203, 0.16);
  --erp-accent-border:  rgba(45, 192, 203, 0.28);
  --erp-accent-text:    #8fe1e8;
  --erp-accent-icon:    #34c6d1;
  --erp-accent-light:   #5fd0d9;

  /* Gradient start */
  --erp-gradient-from:  #122a48;

  /* Charts — brighter for dark navy */
  --erp-chart-1: #2DC0CB;
  --erp-chart-2: #5fd0d9;
  --erp-chart-3: #34d399;
  --erp-chart-4: #fbbf24;
  --erp-chart-5: #f87171;
  --erp-chart-6: #22d3ee;
  --erp-chart-7: #67e8f9;
  --erp-chart-8: #8fb2c4;
  --erp-chart-label: #8fb2c4;
  --erp-chart-border: #0a1f38;
}