/* =============================================================================
   CAPTA · tokens heredados — ahora ALIAS del sistema visual (Felipe, 22/10/2026)
   =============================================================================
   La fuente única de colores, tipografía y escala es `escala.css` (docs/SISTEMA_VISUAL.md). Estos nombres (--navy, --teal, --text, --font-serif…) los usan todavía las hojas
   de cada app y `componentes.css`; en vez de reescribirlas de golpe, apuntan al sistema: así toda la interfaz pasa a la paleta nueva (verde, azul oscuro, grises) y a
   DM Sans (--font-serif ya NO es serif). A medida que cada app se migra a las clases `es-*`, estos alias se van quedando sin uso. NO se agregan colores acá.
   Se carga después de escala.css y antes de componentes.css y de la hoja de la app.
   ============================================================================= */
:root {
  /* Paleta heredada → sistema */
  --navy:   var(--es-tinta);
  --cobalt: var(--es-tinta);
  --teal:   var(--es-verde);
  --bright: var(--es-verde);
  --dark:   var(--es-verde);
  --white:  var(--es-fondo);
  --text:   var(--es-tinta);
  --sub:    var(--es-nota);
  --muted:  var(--es-rotulo);

  --bg:        var(--es-gris-fondo);
  --surface:   var(--es-fondo);
  --border:    var(--es-linea);
  --border-strong: var(--es-borde);

  /* Estados: no hay rojo ni ámbar. Lo que pide acción va en azul oscuro; lo hecho, en verde. */
  --danger:        var(--es-tinta);
  --danger-bg:     var(--es-gris-fondo);
  --danger-border: var(--es-borde);
  --success:        var(--es-verde);
  --success-bg:     var(--es-verde-fondo);
  --success-border: var(--es-verde-borde);
  --warning:        var(--es-tinta);
  --warning-bg:     var(--es-gris-fondo);
  --warning-border: var(--es-borde);
  --overdue:        var(--es-tinta);
  --teal-soft:      var(--es-verde-fondo);

  /* Tipografía: DM Sans en todo. `--font-serif` se conserva como nombre, apunta a la misma. */
  --font-serif: var(--es-font);
  --font-sans:  var(--es-font);

  /* Medidas */
  --topbar-h:  64px;
  --sidenav-w: 240px;
  --radius:    10px;
  --radius-sm: 10px;
  --shadow-sm: none;
  --shadow:    0 4px 12px rgba(19, 32, 47, 0.08);
  --shadow-md: 0 8px 24px rgba(19, 32, 47, 0.18);

  /* Una sola densidad: todo lo que se toca mide 44 px y el texto base es el del sistema. */
  --control-h: var(--es-alto);
  --texto:     var(--es-t-detalle);
  --relleno-x: 16px;
  --titulo:    var(--es-t-pagina);

  --espacio-1: 4px;  --espacio-2: 8px;  --espacio-3: 12px;
  --espacio-4: 16px; --espacio-5: 24px;
  --texto-chico: var(--es-t-detalle);   /* el «texto chico» heredado ya no existe: es el detalle (15) */
  --agenda-hora-w: 48px;
  --resumen-w: 250px;
}