/* ============================================================
   RixART — Design Tokens v3.2
   Fuente de verdad de la identidad visual en toda la plataforma.
   05/09/2026: marca madre renombrada de "EJN ART"/"EJN Soft" a RixART
   (ver docs/ESTADO.md). Los 6 colores de módulo (Core/Poliza/Work/Care/
   Business/Finance) NO cambiaron -- alcance de este rebrand: sólo el
   nivel de plataforma/marca madre, mismo criterio que el rebrand v3 (ver
   docs/PENDIENTES_PLATAFORMA.md P-56/P-57).
   Uso: <link rel="stylesheet" href="ejn-tokens.css"> en el layout base.
   ============================================================ */

:root {
  /* ---------- Marca madre ---------- */
  --ejn-blue:        #0A2144;  /* RixART / plataforma (05/09/2026: aplicado el manual de marca RixART -- ver docs/ESTADO.md) */
  --ejn-blue-dark:   #051122;
  --ejn-blue-soft:   #E7EAF1;

  --ejn-navy:        #0A2144;  /* Tinta: wordmark, sidebar, texto de marca -- navy real de la placa RixART */
  --ejn-navy-dark:   #051122;
  --ejn-navy-soft:   #E7EAF1;

  /* Azul de acento (distinto del navy): la "A" del wordmark y el badge
     "Ingresar" de las tarjetas de módulo (pedido de Daniel, 06/09/2026,
     a partir de su mockup de referencia). */
  --ejn-azul-acento:      #5E5CFF;  /* 06/09/2026: paleta "Cristal / Vidrio Diurno" -- antes #2F6FEB (azul electrico). Cascada automatica a botones primarios, nav activo, foco, badges y grillas via --color-primary/--module-accent. */
  --ejn-azul-acento-dark: #4A47E0;  /* hover de botones/estados con este acento */
  --ejn-azul-acento-soft: #ECECFF;
  --ejn-azul-acento-mist: #F5F5FC;  /* sombreado muy tenue para superficies grandes (grillas) -- mas diluido que -soft */
  --cristal-blue-light:   #8FD9FF;  /* acento secundario claro del mockup -- fondo de login */

  /* ---------- Colores de módulo (de los logos oficiales) ---------- */
  --ejn-green:       #30A155;  /* EJN Core (núcleo + prevención) */
  --ejn-green-dark:  #268144;
  --ejn-green-soft:  #EAF6EE;

  --ejn-gold:        #F5B400;  /* EJN Poliza */
  --ejn-gold-dark:   #C49000;
  --ejn-gold-soft:   #FDF4DC;

  --ejn-orange:      #F57C00;  /* EJN Work (trabajador) */
  --ejn-orange-dark: #C46300;
  --ejn-orange-soft: #FDEEDD;

  --ejn-red:         #E2342E;  /* EJN Care */
  --ejn-red-dark:    #B52A25;
  --ejn-red-soft:    #FCE9E8;

  --ejn-teal:        #17B1A5;  /* EJN Business */
  --ejn-teal-dark:   #128E84;
  --ejn-teal-soft:   #E3F5F4;

  --ejn-purple:      #8E44AD;  /* EJN Finance */
  --ejn-purple-dark: #72378A;
  --ejn-purple-soft: #F2E9F6;

  /* Alias semánticos por módulo */
  /* ROJO EJN de marca: acciones destructivas y el punto del logo.
     No confundir con --ejn-red, que es el acento del módulo Care. */
  --ejn-brand-red:      #E01E2D;
  --ejn-brand-red-dark: #B41824;
  --ejn-brand-red-soft: #FCE8EA;

  --module-core:     var(--ejn-green);
  --module-poliza:   var(--ejn-gold);
  --module-work:     var(--ejn-orange);
  --module-care:     var(--ejn-red);
  --module-business: var(--ejn-teal);
  --module-finance:  var(--ejn-purple);

  /* ---------- Semánticos de UI ---------- */
  --color-primary:   var(--ejn-azul-acento);  /* 06/09/2026: antes var(--ejn-blue) (navy) -- el boton primario de toda la plataforma pasa al acento "Cristal" */
  --color-success:   var(--ejn-green);
  --color-warning:   var(--ejn-gold);
  --color-danger:    var(--ejn-brand-red);
  --color-info:      var(--ejn-navy);

  /* ---------- Neutros ---------- */
  --gray-900: #1F2937;  /* texto principal */
  --gray-700: #374151;
  --gray-600: #4B5563;  /* texto secundario */
  --gray-400: #9CA3AF;  /* placeholder / deshabilitado */
  --gray-300: #D1D5DB;
  --gray-200: #E2E8F0;  /* bordes */
  --gray-100: #F1F5F9;
  --gray-50:  #F3F3F6;  /* fondo de app -- 06/09/2026: gris calido "Cristal" (antes #F7F8FA) */
  --white:    #FFFFFF;
  --mono-ink: #130000;  /* versión monocromática del logo */

  /* ---------- Tipografía ---------- */
  --font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --fs-display: 32px;   /* 700 */
  --fs-h1: 24px;        /* 700 */
  --fs-h2: 20px;        /* 600 */
  --fs-h3: 16px;        /* 600 */
  --fs-body: 14px;      /* 400 — densidad ERP */
  --fs-small: 12px;     /* 400 */
  --fs-caption: 11px;   /* 500, uppercase, tracking 0.5px */

  --lh-tight: 1.25;
  --lh-normal: 1.5;

  /* ---------- Layout ---------- */
  --radius-sm: 8px;   /* 06/09/2026: +2px, esquinas mas "continuas" estilo macOS */
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 2px 8px rgba(29,29,31,.06);   /* 06/09/2026: "sombras suaves en vez de bordes duros" (Daniel) */
  --shadow-md: 0 6px 20px rgba(29,29,31,.08);
  --shadow-lg: 0 16px 40px rgba(29,29,31,.12);

  --space-1: 4px;  --space-2: 8px;  --space-3: 12px;
  --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;

  /* ---------- Barra lateral ----------
     Fondo claro: el ícono de marca es navy sobre transparente, así que
     sobre un fondo azul oscuro desaparecía. Con superficie blanca el
     logo se lee y los colores de módulo mantienen su valor real. */
  --sidebar-bg:     var(--cristal-glass-bg-strong);  /* 06/09/2026: vidrio (antes blanco solido) */
  --sidebar-borde:  var(--cristal-glass-border);
  --sidebar-texto:  var(--gray-700);
  --sidebar-activo: var(--ejn-navy-soft);
  --sidebar-width: 248px;
  --topbar-height: 56px;

  /* ---------- Cristal / Vidrio Diurno (pedido de Daniel, 06/09/2026) ----------
     Paneles translucidos con blur real, sombras suaves en vez de bordes
     duros -- lenguaje visual de macOS hoy (System Settings). */
  --cristal-glass-bg:        rgba(255,255,255,.66);
  --cristal-glass-bg-strong: rgba(255,255,255,.80);
  --cristal-glass-border:    rgba(255,255,255,.55);
  --cristal-blur: 20px;
  --font-mono: 'SF Mono', ui-monospace, 'Menlo', Consolas, monospace;  /* reservado para una 2da pasada en datos tabulares -- no aplicado aun, ver ESTADO.md */
}

/* ---------- Tema de color por usuario (pedido de Daniel, 07/09/2026) ----------
   Cada usuario elige su acento desde "Mi cuenta" (ver CuentaController /
   CuentaRepo::TEMAS, misma lista de claves que estas reglas). El valor
   vive en sys_usuario.tema_color y llega acá como
   <body data-tema="...">, seteado en layouts/privado.php.

   Por qué alcanza con redefinir sólo estas 4 variables: --color-primary
   y [data-module] { --module-accent: ... } (mas abajo en este archivo)
   ya estaban escritas como var(--ejn-azul-acento) en vez de un valor
   fijo -- una propiedad custom de CSS se re-resuelve por elemento
   siguiendo la cascada, así que sobreescribir --ejn-azul-acento* en
   <body> alcanza para recolorear botones primarios, nav activo, foco,
   badges y grillas en toda la plataforma sin tocar ninguna otra regla.

   'lila' (el celeste-violeta de siempre, #5E5CFF) es el default: no
   tiene bloque acá porque ya son los valores base de :root, así que
   ningún usuario existente ve un cambio al salir esta feature.

   Paleta pastel estilo macOS (System Settings > Apariencia), con el
   mismo criterio que ya usa 'lila': el tono base tiene saturación media
   (para que el texto blanco de los botones se siga leyendo bien), y lo
   "pastel" se nota en los tonos -soft/-mist (fondos de badges, foco,
   grillas), igual que hoy. Se dejó afuera el rojo a propósito: ya está
   reservado como --color-danger/--ejn-red para acciones destructivas
   y badges de error -- usarlo también como acento de marca confundiría
   "elegiste este color" con "esto es un error". */
[data-tema="celeste"] {
  --ejn-azul-acento:      #3E9BE0;
  --ejn-azul-acento-dark: #2E7BB8;
  --ejn-azul-acento-soft: #E3F3FC;
  --ejn-azul-acento-mist: #F3FAFE;
}
[data-tema="menta"] {
  --ejn-azul-acento:      #2FBF9C;
  --ejn-azul-acento-dark: #239E80;
  --ejn-azul-acento-soft: #E1F7F1;
  --ejn-azul-acento-mist: #F1FCF9;
}
[data-tema="rosa"] {
  --ejn-azul-acento:      #F0629A;
  --ejn-azul-acento-dark: #D14A80;
  --ejn-azul-acento-soft: #FDE7F0;
  --ejn-azul-acento-mist: #FEF4F8;
}
[data-tema="durazno"] {
  --ejn-azul-acento:      #F0985A;
  --ejn-azul-acento-dark: #D67A3C;
  --ejn-azul-acento-soft: #FDECDF;
  --ejn-azul-acento-mist: #FEF6F0;
}
[data-tema="grafito"] {
  --ejn-azul-acento:      #64748B;
  --ejn-azul-acento-dark: #4B5768;
  --ejn-azul-acento-soft: #EEF1F5;
  --ejn-azul-acento-mist: #F7F9FB;
}

/* ---------- Símbolo de marca ----------
   Los logos v4 son planos, sin degradado ni sombra (manual v4 §7:
   no alterar colores ni agregar efectos). PNG con transparencia,
   servidos a 3x para pantallas de alta densidad. */
.marca-escudo { display: block; flex-shrink: 0; }
.ico--escudo  { flex-shrink: 0; }

/* ---------- Base ---------- */
body.ejn {
  font-family: var(--font-family);
  font-size: var(--fs-body);
  color: var(--gray-900);
  /* 12/09/2026: el fondo tornasolado (probado mas arriba en este mismo
     dia) no convencio a Daniel en la app real -- pidio volver a fondo
     blanco plano y en cambio usar sombra en tarjetas/formularios para
     dar sensacion de profundidad (ver .tarjeta en ejn-erp.css). .app
     (ejn-app.css) es el que realmente pinta el fondo visible (cubre
     100vh encima de body), asi que ahi esta el valor que manda; esta
     copia queda como respaldo por si algun navegador llega a mostrar
     el body (ej. rebote de scroll en iOS). */
  background: var(--white);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
}

/* ---------- Botones ---------- */
.btn {
  display: inline-flex; align-items: center; gap: var(--space-2);
  font: var(--fw-semibold) var(--fs-body)/1 var(--font-family);
  padding: 10px 16px; border-radius: var(--radius-sm);
  border: 1px solid transparent; cursor: pointer; transition: background .15s;
}
/* 11/09/2026 (pedido de Daniel, RAR Expuestos Task #97): no existía ningún
   estilo para .btn:disabled -- un botón deshabilitado por JS (ej.
   ejn-rar-expuestos.js seteando btn.disabled) se veía idéntico a uno
   habilitado, sin ninguna señal visual. pointer-events: none además evita
   que el hover de variantes como .btn-modulo (filter: brightness) se vea
   al pasar el mouse por encima estando disabled. Global y aditivo: aplica
   a cualquier .btn de cualquier módulo que use el atributo disabled, no
   sólo a RAR. */
.btn:disabled, .btn[disabled] {
  opacity: .45; filter: grayscale(.35); cursor: not-allowed; pointer-events: none;
}
.btn-primary   { background: var(--color-primary); color: var(--white); }
.btn-primary:hover { background: var(--ejn-azul-acento-dark); }
.btn-secondary { background: var(--white); color: var(--gray-700); border-color: var(--gray-300); }
.btn-danger    { background: var(--color-danger); color: var(--white); }
.btn-danger:hover { background: var(--ejn-red-dark); }

/* ---------- Badges de estado ---------- */
.badge {
  display: inline-block; padding: 2px 10px; border-radius: 999px;
  font-size: var(--fs-small); font-weight: var(--fw-semibold);
}
.badge-success { background: var(--ejn-green-soft);  color: var(--ejn-green-dark); }
.badge-warning { background: var(--ejn-gold-soft);   color: var(--ejn-gold-dark); }
.badge-danger  { background: var(--ejn-red-soft);    color: var(--ejn-red-dark); }
.badge-info    { background: var(--ejn-azul-acento-soft);   color: var(--ejn-azul-acento); }
.badge-neutral { background: var(--ejn-azul-acento-mist); color: var(--gray-600); border: 1px solid var(--ejn-azul-acento-soft); }  /* 06/09/2026: antes gris plano -- pedido de Daniel de sombreado azulado/celeste tenue en todas las etiquetas, tomando como referencia .badge-modulo ("Ingresar"). Semanticos (success/warning/danger/info) sin tocar: su color es informacion. */

/* ---------- Acento por módulo (aplicar en <body data-module="...">) ---------- */
/* 06/09/2026 (pedido de Daniel): los 6 modulos dejan de tener cada uno
   su propio color -- ahora todos usan el mismo acento de marca (navy
   RixART), conforme al manual. --module-core/poliza/etc. (arriba) quedan
   definidas por compatibilidad pero ya no se usan aca. */
/* --module-accent pasa de navy a azul-acento (electrico) en los 6
   modulos -- pedido de Daniel (06/09/2026): el nombre de modulo, el
   item de menu activo y el resaltado de tablas/foco/wizard que dependen
   de --module-accent en toda la plataforma (ejn-app.css + ejn-erp.css)
   quedaban "grisaceos" con navy. Un solo azul unificado para los 6 --
   ya no hay paleta por modulo (gold/teal/etc) desde la unificacion
   anterior, asi que no hay riesgo de contraste dispar entre modulos. */
[data-module="core"]     { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }
[data-module="poliza"]   { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }
[data-module="work"]     { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }
[data-module="care"]     { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }
[data-module="business"] { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }
[data-module="finance"]  { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }
[data-module="sci"]      { --module-accent: var(--ejn-azul-acento); --module-accent-soft: var(--ejn-azul-acento-soft); }  /* 07/09/2026: faltaba -- SCI (migración 099) caía a los valores de reserva (navy/gris viejo) en vez del acento unificado en toda pantalla que usa --module-accent (nav activo, btn-modulo, foco, grillas, kpis, etc.) */

/* Paleta RixartNetwork (grafico animado del panel de inicio, pedido de
   Daniel 06/09/2026, spec de 28 puntos). Nombres tal cual los pidio,
   se usan solo en hub-network.css/.svg -- no reemplazan --ejn-azul-*
   que ya usa el resto del sitio (sidebar, badges, etc). */
:root {
  --rixart-blue: #145BEF;
  --rixart-blue-2: #2F80FF;
  --rixart-blue-light: #EAF3FF;
  --rixart-navy: #102A56;
  --rixart-text: #334155;
  --rixart-muted: #64748B;
  --rixart-border: #E5EBF5;
  --rixart-bg: #F7F9FC;
  --rixart-white: #FFFFFF;
}