/* ============================================================
   TEMA AUREA · "Crema + celeste" (elegido por Oscar, 2026-09-30)
   Sustituye la paleta dorada original. Todo el color de acento de la
   plataforma sale de estos tokens (los nombres --gold* se mantienen por
   compatibilidad con el CSS existente, pero ya no son dorados).

   Modo claro: fondo crema suave + celeste.
   Modo noche: negro azulado + celeste luminoso.
   Acentos alternativos (Ajustes → Apariencia): azul Apple, verde, malva.
   ============================================================ */

/* ---------- Base clara ---------- */
:root, :root[data-theme="light"]{
  --bg-base:#F7F5EF;
  --gold:#1683D8; --gold-light:#5AB2F5; --gold-hover:#2A92E4;
  --accent-rgb:22, 131, 216; --accent-light-rgb:90, 178, 245;
  --gold-dim:rgba(var(--accent-rgb), 0.13); --gold-glow:rgba(var(--accent-rgb), 0.08);
  --gold-text:#0B6BBF; --on-accent:#FFFFFF;
  --body-gradient:
    radial-gradient(ellipse 90% 70% at 8% 0%, rgba(var(--accent-light-rgb),0.16) 0%, transparent 55%),
    radial-gradient(ellipse 70% 60% at 95% 95%, rgba(235,215,180,0.30) 0%, transparent 55%),
    linear-gradient(var(--bg-base), var(--bg-base));
}

/* ---------- Base noche ---------- */
:root[data-theme="dark"]{
  --bg-base:#05070B;
  --gold:#4DB2FF; --gold-light:#8CCBFF; --gold-hover:#6CC0FF;
  --accent-rgb:77, 178, 255; --accent-light-rgb:140, 203, 255;
  --gold-dim:rgba(var(--accent-rgb), 0.18); --gold-glow:rgba(var(--accent-rgb), 0.12);
  --gold-text:#6CC0FF; --on-accent:#04121F;
  --body-gradient:
    radial-gradient(ellipse 90% 70% at 8% 0%, rgba(var(--accent-rgb),0.15) 0%, transparent 55%),
    radial-gradient(ellipse 70% 60% at 95% 95%, rgba(30,80,190,0.14) 0%, transparent 55%),
    linear-gradient(var(--bg-base), var(--bg-base));
}

/* ---------- Acento: azul Apple ---------- */
:root[data-accent="azul"]:not([data-theme="dark"]){
  --gold:#0071E3; --gold-light:#2997FF; --gold-hover:#0077ED;
  --accent-rgb:0, 113, 227; --accent-light-rgb:41, 151, 255;
  --gold-text:#0066CC; --on-accent:#FFFFFF;
}
:root[data-accent="azul"][data-theme="dark"]{
  --gold:#0A84FF; --gold-light:#409CFF; --gold-hover:#409CFF;
  --accent-rgb:10, 132, 255; --accent-light-rgb:64, 156, 255;
  --gold-text:#2997FF; --on-accent:#FFFFFF;
}

/* ---------- Acento: verde ---------- */
:root[data-accent="verde"]:not([data-theme="dark"]){
  --gold:#248A52; --gold-light:#4CBF7E; --gold-hover:#2B9A5D;
  --accent-rgb:36, 138, 82; --accent-light-rgb:76, 191, 126;
  --gold-text:#1F7A48; --on-accent:#FFFFFF;
}
:root[data-accent="verde"][data-theme="dark"]{
  --gold:#30D158; --gold-light:#6BE08A; --gold-hover:#4ED872;
  --accent-rgb:48, 209, 88; --accent-light-rgb:107, 224, 138;
  --gold-text:#4ED872; --on-accent:#03140A;
}

/* ---------- Acento: malva ---------- */
:root[data-accent="malva"]:not([data-theme="dark"]){
  --gold:#7E57C2; --gold-light:#A688DB; --gold-hover:#8C66CE;
  --accent-rgb:126, 87, 194; --accent-light-rgb:166, 136, 219;
  --gold-text:#6A45B0; --on-accent:#FFFFFF;
}
:root[data-accent="malva"][data-theme="dark"]{
  --gold:#BF8BFF; --gold-light:#D6B3FF; --gold-hover:#CBA0FF;
  --accent-rgb:191, 139, 255; --accent-light-rgb:214, 179, 255;
  --gold-text:#C9A0FF; --on-accent:#140A24;
}