/**
 * Ephesus Academy — Dark Mode (EGW Diaspora system)
 *
 * Light-first theme. Dark mode flips the --ea-* design tokens (navy,
 * neutral and gold ramps invert; surfaces/text recolour) so the entire
 * token-driven UI re-themes automatically, Chrome-incognito-inspired.
 * A handful of components that hardcode light surfaces are overridden
 * explicitly at the end.
 *
 * Activated by:  @media (prefers-color-scheme: dark)  (system, no explicit choice)
 *                html[data-theme="dark"]               (user toggle)
 *
 * @package EphesusAcademy
 * @version 2.0.0
 */

/* ════════════════════════════════════════════════════════════════════════
   1. TOKEN FLIP — system preference (only when user hasn't chosen light)
   ════════════════════════════════════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ea-navy-50:#0E0E0E; --ea-navy-100:#171717; --ea-navy-200:#232323; --ea-navy-300:#333333;
    --ea-navy-400:#4A4A4A; --ea-navy-500:#6B6B6B; --ea-navy-600:#8A8A8A; --ea-navy-700:#A8A8A8;
    --ea-navy-800:#CFCFCF; --ea-navy-900:#F0F0F0;

    --ea-neutral-50:#1A1A1A; --ea-neutral-100:#242424; --ea-neutral-200:#2F2F2F; --ea-neutral-300:#3C3C3C;
    --ea-neutral-400:#5C5C5C; --ea-neutral-500:#8A8A8A; --ea-neutral-600:#B0B0B0; --ea-neutral-700:#D0D0D0;
    --ea-neutral-800:#F1F1F1; --ea-neutral-900:#FFFFFF;

    --ea-gold-50:#1C1C1C; --ea-gold-100:#242424; --ea-gold-200:#CFCFCF; --ea-gold-300:#BFBFBF;
    --ea-gold-400:#9E9E9E; --ea-gold-500:#9E9E9E; --ea-gold-600:#BFBFBF; --ea-gold-700:#E4E4E4;

    --ea-accent:#8fa6d9; --ea-accent-light:#a5b6e2; --ea-accent-lighter:#c2ccec; --ea-accent-dark:#7089c4;
    --ea-accent-bg:rgba(143,166,217,0.14);
    --ea-gold:#8fa6d9; --ea-gold-hover:#a5b6e2; --ea-gold-bg:rgba(143,166,217,0.14);
    --ea-green:#3DB88E; --ea-red:#E06A62; --ea-pink:#B0B0B0; --ea-warn:#E0B354;
  /* Gold, not brown: the light-mode wash was invisible on a dark card. */
  --ea-warn-soft:rgba(224,179,84,0.16);
  --ea-red-soft:rgba(224,106,98,0.14);
  --ea-green-soft:rgba(61,184,142,0.12);
  /* Category hover-bar accents. Light-mode values are near-black (visible on white);
     on a #2A2A2A card those were invisible (1.1-1.7:1). Light grays that read on dark. */
  --ea-cat-theology:#EDEDED; --ea-cat-leadership:#C4C4C4; --ea-cat-family:#D6D6D6; --ea-cat-ministry:#B0B0B0;

    --ea-bg:#1C1C1C; --ea-bg-alt:#2A2A2A; --ea-bg-muted:#232323;
    --ea-surface:#2A2A2A; --ea-surface-hover:#343434; --ea-card-bg:#2A2A2A;
    --ea-border:rgba(255,255,255,0.12); --ea-border-hover:rgba(255,255,255,0.22);
    --ea-footer-bg:#121212; --ea-stats-bg:#2A2A2A; --ea-nav-bg:rgba(26,26,26,0.90);

    --ea-text:#F5F5F5; --ea-text-secondary:#C2C2C2; --ea-text-muted:#8C8C8C; --ea-text-heading:#FFFFFF;

    --ea-shadow-sm:0 1px 2px rgba(0,0,0,0.35),0 2px 4px rgba(0,0,0,0.35);
    --ea-shadow:0 2px 4px rgba(0,0,0,0.30),0 6px 12px rgba(0,0,0,0.40);
    --ea-shadow-lg:0 4px 6px rgba(0,0,0,0.30),0 16px 32px rgba(0,0,0,0.45);
    --ea-shadow-xl:0 12px 24px rgba(0,0,0,0.35),0 32px 60px rgba(0,0,0,0.55);
    --ea-cta-ink:#1C1C1C; --ea-cta-ink-hover:#0A0A0A;
    --ea-cta-glow:rgba(255,255,255,0.14); --ea-cta-glow-strong:rgba(255,255,255,0.20);
    --ea-underline:rgba(143,166,217,0.34); --ea-accent-glow:rgba(143,166,217,0.20);
  }
}

/* ════════════════════════════════════════════════════════════════════════
   2. TOKEN FLIP — explicit user toggle
   ════════════════════════════════════════════════════════════════════════ */
html[data-theme="dark"] {
  --ea-navy-50:#0E0E0E; --ea-navy-100:#171717; --ea-navy-200:#232323; --ea-navy-300:#333333;
  --ea-navy-400:#4A4A4A; --ea-navy-500:#6B6B6B; --ea-navy-600:#8A8A8A; --ea-navy-700:#A8A8A8;
  --ea-navy-800:#CFCFCF; --ea-navy-900:#F0F0F0;

  --ea-neutral-50:#1A1A1A; --ea-neutral-100:#242424; --ea-neutral-200:#2F2F2F; --ea-neutral-300:#3C3C3C;
  --ea-neutral-400:#5C5C5C; --ea-neutral-500:#8A8A8A; --ea-neutral-600:#B0B0B0; --ea-neutral-700:#D0D0D0;
  --ea-neutral-800:#F1F1F1; --ea-neutral-900:#FFFFFF;

  --ea-gold-50:#1C1C1C; --ea-gold-100:#242424; --ea-gold-200:#CFCFCF; --ea-gold-300:#BFBFBF;
  --ea-gold-400:#9E9E9E; --ea-gold-500:#9E9E9E; --ea-gold-600:#BFBFBF; --ea-gold-700:#E4E4E4;

  --ea-accent:#8fa6d9; --ea-accent-light:#a5b6e2; --ea-accent-lighter:#c2ccec; --ea-accent-dark:#7089c4;
  --ea-accent-bg:rgba(143,166,217,0.14);
  --ea-gold:#8fa6d9; --ea-gold-hover:#a5b6e2; --ea-gold-bg:rgba(143,166,217,0.14);
  --ea-green:#3DB88E; --ea-red:#E06A62; --ea-pink:#B0B0B0; --ea-warn:#E0B354;
  /* Gold, not brown: the light-mode wash was invisible on a dark card. */
  --ea-warn-soft:rgba(224,179,84,0.16);
  --ea-red-soft:rgba(224,106,98,0.14);
  --ea-green-soft:rgba(61,184,142,0.12);
  /* Category hover-bar accents. Light-mode values are near-black (visible on white);
     on a #2A2A2A card those were invisible (1.1-1.7:1). Light grays that read on dark. */
  --ea-cat-theology:#EDEDED; --ea-cat-leadership:#C4C4C4; --ea-cat-family:#D6D6D6; --ea-cat-ministry:#B0B0B0;

  --ea-bg:#1C1C1C; --ea-bg-alt:#2A2A2A; --ea-bg-muted:#232323;
  --ea-surface:#2A2A2A; --ea-surface-hover:#343434; --ea-card-bg:#2A2A2A;
  --ea-border:rgba(255,255,255,0.12); --ea-border-hover:rgba(255,255,255,0.22);
  --ea-footer-bg:#121212; --ea-stats-bg:#2A2A2A; --ea-nav-bg:rgba(26,26,26,0.90);

  --ea-text:#F5F5F5; --ea-text-secondary:#C2C2C2; --ea-text-muted:#8C8C8C; --ea-text-heading:#FFFFFF;

  --ea-shadow-sm:0 1px 2px rgba(0,0,0,0.35),0 2px 4px rgba(0,0,0,0.35);
  --ea-shadow:0 2px 4px rgba(0,0,0,0.30),0 6px 12px rgba(0,0,0,0.40);
  --ea-shadow-lg:0 4px 6px rgba(0,0,0,0.30),0 16px 32px rgba(0,0,0,0.45);
  --ea-shadow-xl:0 12px 24px rgba(0,0,0,0.35),0 32px 60px rgba(0,0,0,0.55);
    --ea-cta-ink:#1C1C1C; --ea-cta-ink-hover:#0A0A0A;
    --ea-cta-glow:rgba(255,255,255,0.14); --ea-cta-glow-strong:rgba(255,255,255,0.20);
    --ea-underline:rgba(143,166,217,0.34); --ea-accent-glow:rgba(143,166,217,0.20);
}

/* ════════════════════════════════════════════════════════════════════════
   3. COMPONENT OVERRIDES — for surfaces that hardcode light values
   ════════════════════════════════════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ea-header--sticky { background: rgba(26,26,26,0.96); }
  :root:not([data-theme="light"]) .ea-search-overlay { background: rgba(26,26,26,0.96); }
  :root:not([data-theme="light"]) .ea-header__dropdown,
  :root:not([data-theme="light"]) .ea-mobile-nav { background: #2A2A2A; }
  :root:not([data-theme="light"]) .ea-header__dropdown-link--danger:hover { background: rgba(224,106,98,0.14); }
}
html[data-theme="dark"] .ea-header--sticky { background: rgba(26,26,26,0.96); }
html[data-theme="dark"] .ea-search-overlay { background: rgba(26,26,26,0.96); }
html[data-theme="dark"] .ea-header__dropdown,
html[data-theme="dark"] .ea-mobile-nav { background: #2A2A2A; }
html[data-theme="dark"] .ea-header__dropdown-link--danger:hover { background: rgba(224,106,98,0.14); }

/* Category tint pills/icons that hardcode light pastel fills → dark-tinted */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ea-badge--pink { background:#242424; color:#C2C2C2; }
  :root:not([data-theme="light"]) .ea-badge--green { background:#242424; color:#C2C2C2; }
  :root:not([data-theme="light"]) .ea-category-card--pink .ea-category-card__icon { background:#242424; color:#C2C2C2; }
  :root:not([data-theme="light"]) .ea-category-card--green .ea-category-card__icon { background:#242424; color:#C2C2C2; }
  :root:not([data-theme="light"]) .ea-expect__icon--green { background:#242424; color:#C2C2C2; }
}
html[data-theme="dark"] .ea-badge--pink { background:#242424; color:#C2C2C2; }
html[data-theme="dark"] .ea-badge--green { background:#242424; color:#C2C2C2; }
html[data-theme="dark"] .ea-category-card--pink .ea-category-card__icon { background:#242424; color:#C2C2C2; }
html[data-theme="dark"] .ea-category-card--green .ea-category-card__icon { background:#242424; color:#C2C2C2; }
html[data-theme="dark"] .ea-expect__icon--green { background:#242424; color:#C2C2C2; }