/*
 * Shenmen · paleta
 * ---------------------------------------------------------------------------
 * Dorado sobre navy: la estética original de la casa, servida ahora por un
 * sistema de tokens. El color vive SOLO aquí; cambiar de gama es reasignar
 * estos valores, sin tocar una sola regla del resto del proyecto.
 *
 * Se carga DESPUÉS del resto de hojas: define los tokens --sh-* y redefine con
 * ellos las dos familias heredadas (--primary-* de styles.css y --pp-* de
 * pacientes-premium.css). Quitar el enlace de index.php revierte el color.
 *
 * Tema: oscuro por defecto. El claro entra con prefers-color-scheme, y
 * :root[data-theme] permite forzar uno u otro desde la interfaz (tema.js).
 */

:root {
    /* ── Papel ─────────────────────────────────────────────── */
    --sh-bg:          #0a0f1f;   /* navy profundo */
    --sh-bg-deep:     #06091a;   /* barra lateral y fondos por debajo */
    --sh-surface:     #16213e;   /* tarjetas y paneles */
    --sh-surface-2:   #1a274a;   /* hover, menús, modales */
    --sh-input:       #0f1a2e;
    --sh-border:      #2a3a5f;
    --sh-border-soft: rgba(255,255,255,.06);

    /* ── Tinta ─────────────────────────────────────────────── */
    --sh-text:        #ffffff;
    --sh-text-soft:   #e8ecf3;
    --sh-text-muted:  #8f9bb3;
    --sh-text-faint:  rgba(143,155,179,.6);

    /* ── Color ─────────────────────────────────────────────── */
    --sh-primary:        #d4af37;   /* dorado cálido: manda */
    --sh-primary-hover:  #e6c350;
    --sh-primary-soft:   rgba(212,175,55,.10);
    --sh-primary-border: rgba(212,175,55,.30);
    --sh-accent:         #e94560;   /* el segundo acento de los degradados */
    --sh-accent-hover:   #f4627a;
    --sh-premium:        #a78bfa;   /* contenido de pago, insignias */
    --sh-success:        #34d399;
    --sh-warning:        #f59e0b;
    --sh-danger:         #f87171;
    --sh-info:           #60a5fa;

    /* El texto sobre dorado va en tinta oscura, nunca en blanco. */
    --sh-on-color:    #1a1410;

    --sh-shadow:      0 10px 30px rgba(0,0,0,.4);
    --sh-shadow-sm:   0 2px 8px rgba(0,0,0,.25);
}

/* ═══ Puente con las variables heredadas ═══════════════════════
   Nada más abajo debería usar colores literales: al redefinir aquí
   las variables viejas, el resto del CSS cambia sin tocarlo. */
:root {
    /* styles.css */
    --primary-color:  var(--sh-primary);
    --primary-dark:   #c19b00;
    --primary-light:  #ffe8a3;
    --bg-dark:        var(--sh-bg);
    --bg-darker:      var(--sh-bg-deep);
    --bg-light:       var(--sh-surface);
    --bg-light-hover: var(--sh-surface-2);
    --text-primary:   var(--sh-text);
    --text-secondary: var(--sh-text-muted);
    --success:        var(--sh-success);
    --danger:         var(--sh-danger);
    --warning:        var(--sh-warning);
    --info:           var(--sh-info);

    /* pacientes-premium.css */
    --pp-accent:        var(--sh-primary);
    --pp-accent-hover:  var(--sh-primary-hover);
    --pp-accent-soft:   var(--sh-primary-soft);
    --pp-accent-border: var(--sh-primary-border);
    --pp-accent-text:   var(--sh-on-color);
    --pp-accent-pink:   var(--sh-accent);

    --pp-body-bg:   var(--sh-bg);
    --pp-bg-card:   var(--sh-surface);
    --pp-bg-card-2: var(--sh-surface-2);
    --pp-bg-hover:  rgba(212,175,55,.06);
    --pp-bg-input:  var(--sh-input);

    --pp-border:        var(--sh-border);
    --pp-border-strong: #38497a;
    --pp-border-hover:  var(--sh-primary-border);

    --pp-text:       var(--sh-text);
    --pp-text-soft:  var(--sh-text-soft);
    --pp-text-muted: var(--sh-text-muted);
    --pp-text-faint: var(--sh-text-faint);

    --pp-success: var(--sh-success);
    --pp-info:    var(--sh-info);
    --pp-warn:    var(--sh-warning);
    --pp-danger:  var(--sh-danger);

    --pp-shadow:    var(--sh-shadow);
    --pp-shadow-sm: var(--sh-shadow-sm);
}

/* ═══ Tema claro: papel cálido, no blanco clínico ═════════════ */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) {
        --sh-bg:          #f5f2ea;
        --sh-bg-deep:     #ebe5d8;
        --sh-surface:     #ffffff;
        --sh-surface-2:   #f2ede1;
        --sh-input:       #ffffff;
        --sh-border:      #ded5c4;
        --sh-border-soft: rgba(10,15,31,.10);

        --sh-text:        #131a2c;
        --sh-text-soft:   #1e2740;
        --sh-text-muted:  #5d6780;
        --sh-text-faint:  rgba(93,103,128,.6);

        --sh-primary:        #8a6d10;
        --sh-primary-hover:  #6f5708;
        --sh-primary-soft:   rgba(138,109,16,.10);
        --sh-primary-border: rgba(138,109,16,.30);
        --sh-accent:         #c2213c;
        --sh-accent-hover:   #a4152d;
        --sh-premium:        #6d4ed6;
        --sh-success:        #15855f;
        --sh-warning:        #9a6a10;
        --sh-danger:         #c0392b;
        --sh-info:           #1f5fa8;

        --sh-on-color:    #ffffff;

        --sh-shadow:      0 10px 30px rgba(10,15,31,.14);
        --sh-shadow-sm:   0 2px 8px rgba(10,15,31,.09);
    }
}

:root[data-theme="light"] {
    --sh-bg:          #f5f2ea;
    --sh-bg-deep:     #ebe5d8;
    --sh-surface:     #ffffff;
    --sh-surface-2:   #f2ede1;
    --sh-input:       #ffffff;
    --sh-border:      #ded5c4;
    --sh-border-soft: rgba(10,15,31,.10);

    --sh-text:        #131a2c;
    --sh-text-soft:   #1e2740;
    --sh-text-muted:  #5d6780;
    --sh-text-faint:  rgba(93,103,128,.6);

    --sh-primary:        #8a6d10;
    --sh-primary-hover:  #6f5708;
    --sh-primary-soft:   rgba(138,109,16,.10);
    --sh-primary-border: rgba(138,109,16,.30);
    --sh-accent:         #c2213c;
    --sh-accent-hover:   #a4152d;
    --sh-premium:        #6d4ed6;
    --sh-success:        #15855f;
    --sh-warning:        #9a6a10;
    --sh-danger:         #c0392b;
    --sh-info:           #1f5fa8;

    --sh-on-color:    #ffffff;

    --sh-shadow:      0 10px 30px rgba(10,15,31,.14);
    --sh-shadow-sm:   0 2px 8px rgba(10,15,31,.09);
}

/* ═══ Dorados literales que quedan sueltos ════════════════════
   Mientras no se barran de sus ficheros, aquí se neutralizan los
   que más se ven. La lista completa está en docs/PALETA.md. */
.c-fig img, .c-svg svg, .cur-lec-ilu, .cur-card-portada, .cur-curso-portada {
    background: var(--sh-surface);
}