/* ============================================================================
   Luminous — Temas de color por usuario: ACENTO + ESQUEMA DE FONDO (estilo SAP).
   Inyectado por app.py en páginas de la APP cliente. Solo aplica con data-brand;
   sin atributo (incl. "neutro") = look neutro de hoy. Tarjetas (--c1) y texto de
   área (--sn/--sd) quedan neutros (invierten por data-theme). Sidebar = color
   fuerte con texto claro. El color es ortogonal al claro/oscuro.
   ============================================================================ */

/* Defaults (sin data-brand): acento violeta, fondos sin tocar = hoy. */
:root{ --in:#8B5CF6; --brand-l:#A78BFA; --brand-d:#6D28D9; --brand-rgb:139,92,246; }

/* ── Sidebar con CUALQUIER color de tema (no aplica a neutro, que no setea
      data-brand). Jerarquía: los ENCABEZADOS de categoría se mezclan con el COLOR
      del sidebar (sin fondo) y cada MÓDULO es un chip con FONDO PASTEL (tono claro
      de la misma familia); el hover/activo intensifican el chip. ──────────────── */
/* Encabezados = color del sidebar (sin fondo propio, se funden con el panel). */
html[data-brand] aside .sb-cat-hd,
html[data-brand] aside .al            { background: transparent !important; }
html[data-brand] aside .al,
html[data-brand] aside .sb-cat-lbl,
html[data-brand] aside .sb-cat-emo,
html[data-brand] aside .al-group-arrow,
html[data-brand] aside .sb-cat-arr    { color: rgba(255,255,255,.82) !important; }
/* Módulos = chip con fondo pastel (blanco translúcido sobre el color = tono claro
   de la familia). Esquinas redondeadas + pequeño margen para separarlos. */
html[data-brand] aside .al-link,
html[data-brand] aside .al-group-btn  { background: rgba(255,255,255,.15) !important;
                                        color: rgba(255,255,255,.96) !important;
                                        border-radius: 8px !important;
                                        margin: 2px 8px !important;
                                        border-left-color: transparent !important; }
html[data-brand] aside .al-ico,
html[data-brand] aside .al-group-label { color: rgba(255,255,255,.96) !important; }
/* Hover/activo: el chip pastel se intensifica → marca dónde se hará click. */
html[data-brand] aside .al-link:hover,
html[data-brand] aside .al-group-btn:hover { background: rgba(255,255,255,.26) !important;
                                        color:#fff !important; }
html[data-brand] aside .al-link.act   { background: rgba(255,255,255,.34) !important;
                                        color:#fff !important; border-left-color: transparent !important; }

/* ── VIOLETA ─────────────────────────────────────────────────────────────── */
html[data-brand="violeta"]{ --in:#8B5CF6; --brand-l:#A78BFA; --brand-d:#6D28D9; --brand-rgb:139,92,246; --bg:#F5F3FF; }
html[data-brand="violeta"][data-theme="dark"]{ --bg:#17141f; }
html[data-brand="violeta"] aside{ background:#7C3AED !important; }
html[data-brand="violeta"][data-theme="dark"] aside{ background:#3b1d8f !important; }

/* ── AZUL ────────────────────────────────────────────────────────────────── */
html[data-brand="azul"]{ --in:#3B82F6; --brand-l:#60A5FA; --brand-d:#2563EB; --brand-rgb:59,130,246; --bg:#EFF6FF; }
html[data-brand="azul"][data-theme="dark"]{ --bg:#10151f; }
html[data-brand="azul"] aside{ background:#2563EB !important; }
html[data-brand="azul"][data-theme="dark"] aside{ background:#1b3a78 !important; }

/* ── ESMERALDA ───────────────────────────────────────────────────────────── */
html[data-brand="esmeralda"]{ --in:#10B981; --brand-l:#34D399; --brand-d:#059669; --brand-rgb:16,185,129; --bg:#ECFDF5; }
html[data-brand="esmeralda"][data-theme="dark"]{ --bg:#0e1714; }
html[data-brand="esmeralda"] aside{ background:#059669 !important; }
html[data-brand="esmeralda"][data-theme="dark"] aside{ background:#0c4a3a !important; }

/* ── ÁMBAR ───────────────────────────────────────────────────────────────── */
html[data-brand="ambar"]{ --in:#F59E0B; --brand-l:#FBBF24; --brand-d:#D97706; --brand-rgb:245,158,11; --bg:#FFFBEB; }
html[data-brand="ambar"][data-theme="dark"]{ --bg:#191510; }
html[data-brand="ambar"] aside{ background:#D97706 !important; }
html[data-brand="ambar"][data-theme="dark"] aside{ background:#5c3a0e !important; }

/* ── ROSA ────────────────────────────────────────────────────────────────── */
html[data-brand="rosa"]{ --in:#EC4899; --brand-l:#F472B6; --brand-d:#DB2777; --brand-rgb:236,72,153; --bg:#FDF2F8; }
html[data-brand="rosa"][data-theme="dark"]{ --bg:#1a1014; }
html[data-brand="rosa"] aside{ background:#DB2777 !important; }
html[data-brand="rosa"][data-theme="dark"] aside{ background:#6d1b3e !important; }

/* ── CIAN ────────────────────────────────────────────────────────────────── */
html[data-brand="cian"]{ --in:#06B6D4; --brand-l:#22D3EE; --brand-d:#0891B2; --brand-rgb:6,182,212; --bg:#ECFEFF; }
html[data-brand="cian"][data-theme="dark"]{ --bg:#0d1719; }
html[data-brand="cian"] aside{ background:#0891B2 !important; }
html[data-brand="cian"][data-theme="dark"] aside{ background:#0b4654 !important; }