/* ==========================================================================
   POKESTATS ULTRA — TEMAS
   Cada tema sólo define 3 valores: --bg, --accent y --dx-accent-ink.
   Todas las superficies, bordes y textos se derivan en dex.css (body {}).
   Los temas claros añaden la clase .is-light (la pone setTheme()).
   Contraste comprobado: acento/fondo ≥ 4,6:1 y texto/acento ≥ 5:1 en todos.
   ========================================================================== */

body {
    color-scheme: dark;

    /* Compatibilidad con variables antiguas (main.css / estilos en línea) */
    --text: var(--dx-text);
    --text-muted: var(--dx-text-3);
    --primary: var(--accent);
    --card: var(--dx-surface-1);
    --card-border: var(--dx-border);
    --surface: var(--dx-surface-2);
}

/* ---------- Oscuros ---------- */
body.theme-dark     { --bg: #0b1120; --accent: #00e5ff; --dx-accent-ink: #00161a; }
body.theme-oled     { --bg: #000000; --accent: #22d3ee; --dx-accent-ink: #00161a; }
body.theme-forest   { --bg: #0a2e1f; --accent: #34d399; --dx-accent-ink: #00160d; }
body.theme-fire     { --bg: #1a0a0a; --accent: #fbbf24; --dx-accent-ink: #1a1000; }
body.theme-ocean    { --bg: #061a2e; --accent: #38bdf8; --dx-accent-ink: #00121f; }
body.theme-ghost    { --bg: #140d24; --accent: #c084fc; --dx-accent-ink: #16052a; }
body.theme-electric { --bg: #14130a; --accent: #facc15; --dx-accent-ink: #1a1500; }
body.theme-pokedex  { --bg: #2a0a0d; --accent: #ff6b6b; --dx-accent-ink: #2a0006; }
body.theme-gameboy  { --bg: #0f380f; --accent: #9bbc0f; --dx-accent-ink: #0f380f; }

/* Game Boy: el texto también se tiñe de verde DMG */
body.theme-gameboy {
    --dx-text: #e4f3bf;
    --dx-text-2: #bcd38a;
    --dx-text-3: #9cb66a;
}

/* ---------- Alto contraste (accesibilidad) ---------- */
body.theme-contrast {
    --bg: #000000;
    --accent: #ffff00;
    --dx-accent-ink: #000000;
    --dx-surface-1: #000000;
    --dx-surface-2: #0d0d0d;
    --dx-surface-3: #262626;
    --dx-border: #a3a3a3;
    --dx-border-strong: #ffffff;
    --dx-text: #ffffff;
    --dx-text-2: #ffffff;
    --dx-text-3: #e5e5e5;
    --dx-accent-soft: rgb(255 255 0 / .18);
}

body.theme-contrast .dx-card-pk,
body.theme-contrast .dx-box,
body.theme-contrast .dx-hero {
    background: var(--dx-surface-1);
    border-width: 2px;
}

/* ---------- Claros ---------- */
body.theme-light   { --bg: #f0f2f5; --accent: #0369a1; --dx-accent-ink: #ffffff; }
body.theme-sakura  { --bg: #fdf2f6; --accent: #be185d; --dx-accent-ink: #ffffff; }
body.theme-desert  { --bg: #f7f1e3; --accent: #9a3412; --dx-accent-ink: #ffffff; }
body.theme-glacier { --bg: #eef7fb; --accent: #0e7490; --dx-accent-ink: #ffffff; }
body.theme-meadow  { --bg: #f1f8ee; --accent: #15803d; --dx-accent-ink: #ffffff; }

body.is-light {
    color-scheme: light;
    /* Superficies teñidas con el fondo del tema (no blanco plano) */
    --dx-surface-1: color-mix(in srgb, var(--bg) 30%, #ffffff);
    --dx-surface-2: color-mix(in srgb, var(--bg) 94%, #0f172a);
    --dx-surface-3: color-mix(in srgb, var(--bg) 88%, #0f172a);
    --dx-border: color-mix(in srgb, var(--bg) 84%, #0f172a);
    --dx-border-strong: color-mix(in srgb, var(--bg) 72%, #0f172a);
    --dx-text: #0f172a;
    --dx-text-2: #3f4b5f;
    --dx-text-3: #5d6a80;
    --dx-good: #15803d;
    --dx-bad: #b91c1c;
    --dx-warn: #a16207;
    --st-3: #ca8a04;
    --st-4: #65a30d;
    --st-5: #16a34a;
    --st-6: #0891b2;
    --sh-1: 0 1px 2px rgb(15 23 42 / .08);
    --sh-2: 0 6px 20px rgb(15 23 42 / .10);
    --sh-3: 0 18px 48px rgb(15 23 42 / .18);
}

/* ---------- Preferencias ---------- */
html.dx-text-lg {
    font-size: 112.5%;
}

body.dx-calm *,
body.dx-calm *::before,
body.dx-calm *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
}