/* ============================================================================
   Luminous — Sistema de diseño compartido (aic-ui.css)
   Fuente única de la identidad visual del INTERIOR de la app.

   • Reutiliza los MISMOS nombres de variables que ya usan los módulos
     (--bg, --c1, --c2, --c3, --sn, --sd, --in, --bd, --ok, --warn, --err, --ln)
     para recolorear todo a la identidad índigo sin reescribir cada página.
   • Añade tema claro/oscuro con [data-theme] (default oscuro = identidad).
   • Cómo usarlo en una página del interior:
        <link rel="stylesheet" href="/static/css/aic-ui.css">
        y ELIMINAR el :root inline de esa página (este archivo manda).
   ============================================================================ */

/* ── Tema OSCURO (default, identidad de marca) ────────────────────────────── */
:root{
  /* Marca índigo (unificada con la landing) */
  --in:#8B5CF6; --inl:#A78BFA; --brand-d:#6D28D9; --brand-soft:rgba(139,92,246,.13);
  /* Fondos y superficies */
  --bg:#161618; --bg-2:#101011; --c1:#1C1C1F; --c2:#242427; --c3:#2D2D31;
  /* Texto */
  --sn:#EDEDEF; --sd:#A0A0A8; --sf:#74747E;
  /* Bordes */
  --bd:rgba(167,139,250,.16); --bd-2:rgba(237,237,239,.07);
  /* Semánticos */
  --ok:#3FB95A; --warn:#E0A555; --err:#E5615A; --info:#8B5CF6;
  --ln:#7BE0A3;                 /* antes lima #c1ff4e — ahora menta, armoniza con índigo */
  --sii:#E8431A;                /* rojo institucional SII */
  /* Sombras / acentos extra */
  --shadow:0 24px 55px -30px rgba(0,0,0,.7);
  --ring:0 0 0 3px rgba(139,92,246,.30);
  --honey:#F2B45B;
}

/* ── Tema CLARO (más cálido y luminoso, mismo índigo de marca) ─────────────── */
[data-theme="light"]{
  --in:#8B5CF6; --inl:#6D28D9; --brand-d:#6D28D9; --brand-soft:rgba(139,92,246,.10);
  --bg:#F6F6F7; --bg-2:#ECECEE; --c1:#FFFFFF; --c2:#F2F2F3; --c3:#E9E9EB;
  --sn:#1A1A1D; --sd:#5C5C66; --sf:#7C7C88;
  --bd:rgba(139,92,246,.18); --bd-2:rgba(26,26,29,.08);
  --ok:#2F9E4F; --warn:#C7891F; --err:#D2453B; --info:#6D28D9;
  --ln:#1F9E6A;
  --sii:#D23A14;
  --shadow:0 24px 50px -32px rgba(60,60,70,.35);
  --ring:0 0 0 3px rgba(139,92,246,.22);
  --honey:#D98A21;
}

/* ── Transición suave al cambiar de tema ──────────────────────────────────── */
body{transition:background-color .35s ease,color .35s ease}

/* ── Botón de cambio de tema (reutilizable en el nav del interior) ─────────── */
.aic-theme-btn{
  width:36px;height:36px;border-radius:10px;border:1px solid var(--bd);
  background:transparent;color:var(--sd);font-size:15px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;transition:.2s;flex-shrink:0;
}
.aic-theme-btn:hover{color:var(--sn);border-color:var(--in)}

/* ── Accesibilidad: foco visible coherente ────────────────────────────────── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none;box-shadow:var(--ring);border-radius:8px;
}

/* ── Scrollbar discreta acorde al tema ────────────────────────────────────── */
*{scrollbar-width:thin;scrollbar-color:var(--c3) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--c3);border-radius:6px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:var(--in);background-clip:content-box}

/* ============================================================================
   BOTONES — Estándar UNIFORME de toda la app (aprobado 2026-06-07)
   Radius 8px · primario índigo sólido · secundario contorno índigo (hover relleno).
   Se usa !important porque cada módulo define sus propios .btn* inline; esto los
   unifica sin reescribir el <style> de los 55 HTML. Amigable: redondeado, color,
   y resalta al pasar el mouse antes del click.
   ============================================================================ */
.btn,.btn-p,.btn-out,.btn-ok,.btn-err,.btn-warn,.btn-sm{
  border-radius:8px !important;
  cursor:pointer !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease,
             box-shadow .15s ease,transform .12s ease !important;
  font-weight:600;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  line-height:1.1;
}
.btn:hover,.btn-p:hover,.btn-out:hover,.btn-ok:hover,.btn-err:hover,.btn-warn:hover{
  transform:translateY(-1px);
}
.btn:active,.btn-p:active,.btn-out:active,.btn-ok:active,.btn-err:active,.btn-warn:active{
  transform:translateY(0);
}

/* Primario — índigo sólido */
.btn-p{
  background:var(--in) !important;
  color:#fff !important;
  border:1px solid var(--in) !important;
}
.btn-p:hover{
  background:var(--inl) !important;
  border-color:var(--inl) !important;
  box-shadow:0 4px 14px -4px rgba(139,92,246,.55) !important;
}

/* Secundario — contorno índigo, se rellena al hover */
.btn-out{
  background:transparent !important;
  color:var(--in) !important;
  border:1px solid var(--in) !important;
}
.btn-out:hover{
  background:var(--brand-soft) !important;
  color:var(--inl) !important;
  border-color:var(--inl) !important;
}

/* Semánticos — mismo radius/hover, su propio color (suave + borde) */
.btn-ok{ background:rgba(63,185,90,.14) !important;  color:var(--ok) !important;   border:1px solid rgba(63,185,90,.40) !important; }
.btn-ok:hover{ background:rgba(63,185,90,.24) !important; box-shadow:0 4px 14px -5px rgba(63,185,90,.5) !important; }
.btn-err{ background:rgba(229,97,90,.13) !important;  color:var(--err) !important;  border:1px solid rgba(229,97,90,.40) !important; }
.btn-err:hover{ background:rgba(229,97,90,.23) !important; box-shadow:0 4px 14px -5px rgba(229,97,90,.5) !important; }
.btn-warn{ background:rgba(224,165,85,.14) !important; color:var(--warn) !important; border:1px solid rgba(224,165,85,.40) !important; }
.btn-warn:hover{ background:rgba(224,165,85,.24) !important; box-shadow:0 4px 14px -5px rgba(224,165,85,.5) !important; }

/* Tamaño compacto (acciones de fila) — conserva el estándar, solo más chico */
.btn-sm{ padding:5px 12px !important; font-size:11px !important; }