/* ── Tokens de diseño: Prensa Moderna ─────────────────────
   data-theme="light"  → modo claro explícito
   data-theme="dark"   → modo oscuro explícito
   :root               → valores por defecto (light)
──────────────────────────────────────────────────────────── */

/* ── Light mode (default + explícito) ──────────────────── */
:root,
[data-theme="light"] {
    /* Superficie */
    --c-bg:            #FFFFFF;
    --c-surface:       #FFFFFF;
    --c-surface-alt:   #F5F5F5;
    --c-border:        #E5E7EB;
    --c-border-strong: #D1D5DB;

    /* Header / Nav — siempre oscuro */
    --c-header-bg:   #111111;
    --c-nav-bg:      #111111;
    --c-nav-text:    #AAAAAA;
    --c-nav-hover:   #FFFFFF;

    /* Identidad */
    --c-accent:      #CC0000;
    --c-accent-h:    #990000;
    --c-gold:        #D4AF37;
    --c-heading:     #111111;

    /* Texto — máximo contraste */
    --c-text:        #111111;
    --c-text-sec:    #333333;
    --c-text-muted:  #6B7280;
    --c-text-inv:    #FFFFFF;

    /* Sombras */
    --shadow-sm:  0 1px 3px rgba(0,0,0,.08);
    --shadow-md:  0 4px 12px rgba(0,0,0,.1);
    --shadow-lg:  0 8px 24px rgba(0,0,0,.14);

    /* Tipografía */
    --f-serif: Georgia, 'Times New Roman', serif;
    --f-sans:  -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Radios */
    --r-sm:  2px;
    --r-md:  4px;
    --r-lg:  8px;
    --r-xl:  20px;

    /* Transiciones */
    --t-fast: .18s ease;
    --t-med:  .30s ease;
}

/* ── Dark mode explícito ────────────────────────────────── */
[data-theme="dark"] {
    --c-bg:            #0a0a0a;
    --c-surface:       #141414;
    --c-surface-alt:   #1e1e1e;
    --c-border:        #2a2a2a;
    --c-border-strong: #3a3a3a;

    --c-header-bg:   #0a0a0a;
    --c-nav-bg:      #0a0a0a;
    --c-nav-text:    #888888;
    --c-nav-hover:   #FFFFFF;

    --c-accent:      #E53E3E;
    --c-accent-h:    #FC8181;
    --c-gold:        #F0C040;
    --c-heading:     #FFFFFF;

    /* Texto — blanco puro para máximo contraste */
    --c-text:        #FFFFFF;
    --c-text-sec:    #CCCCCC;
    --c-text-muted:  #888888;
    --c-text-inv:    #111111;

    --shadow-sm:  0 1px 4px rgba(0,0,0,.5);
    --shadow-md:  0 4px 16px rgba(0,0,0,.7);
    --shadow-lg:  0 8px 32px rgba(0,0,0,.85);
}

/* ── Base global ────────────────────────────────────────── */
body {
    background-color: var(--c-bg) !important;
    color: var(--c-text);
    transition: background-color var(--t-med), color var(--t-med);
}

/* Reducir movimiento */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}