/*
 * theme.css — Variables de marca
 * ─────────────────────────────────────────────────────────────
 * Para crear una réplica con otro estilo, edita SOLO este archivo:
 *   · Cambia la paleta de colores
 *   · Cambia la fuente (@import + --font-serif / --font-sans)
 *   · Ajusta --radius y --sidebar-w si quieres
 * El resto de la aplicación se adapta solo.
 * ─────────────────────────────────────────────────────────────
 */

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@300;400;500&display=swap');

:root {
    /* ── Paleta principal ────────────────────────────────── */
    --bg:         #f5f0e8;   /* fondo general */
    --surface:    #fdfaf5;   /* tarjetas, sidebar claro, modales */
    --border:     #ddd5c4;   /* líneas divisorias */
    --text:       #1e1c18;   /* texto principal */
    --muted:      #8a7a9a;   /* texto secundario, labels */
    --accent:     #3d1f5e;   /* color de marca (púrpura) */
    --accent-lt:  #5a3480;   /* hover de accent */
    --coral:      #f4957a;   /* acento secundario (salmón) */
    --danger:     #e85d3a;   /* errores / acciones destructivas */

    /* ── Canales RGB — necesarios para rgba() ────────────── */
    /* Mantén estos sincronizados con los colores de arriba   */
    --accent-rgb:  61,  31,  94;
    --coral-rgb:  244, 149, 122;
    --danger-rgb: 232,  93,  58;
    --text-rgb:    30,  28,  24;
    --surface-rgb:253, 250, 245;

    /* ── Tipografía ──────────────────────────────────────── */
    --font-serif: 'DM Serif Display', serif;
    --font-sans:  'DM Sans', sans-serif;

    /* ── Forma ───────────────────────────────────────────── */
    --radius:    6px;
    --sidebar-w: 240px;
}