/* ── Design tokens (fase 0 migración UI) ──────────────────────────────────────
   Fuente de verdad: design-front/migracion.md §1. Única hoja con variables:
   toda hoja nueva o migrada debe consumir estos tokens en lugar de colores
   hardcodeados. Cargar SIEMPRE antes que la hoja de la vista. */

:root {
	/* Marca */
	--blue: #1565C0;        /* acción primaria, énfasis numérico */
	--blue-hover: #0D47A1;  /* hover/active de botones primarios */
	--blue-050: #E8F0FB;    /* fondo de chips, avatares, estados seleccionados */
	--blue-soft: #C9DCF4;   /* barras de gráfica inactivas */
	--navy: #0D2B4E;        /* sidebar, tarjetas oscuras, texto de marca */
	--navy-2: #123C6B;      /* segundo tono para degradados de superficie oscura */
	--gold: #FFC107;        /* acento: prueba gratis, ruta, CTA sobre oscuro */

	/* Superficies */
	--bg: #F4F6FA;          /* fondo de aplicación */
	--surface: #FFFFFF;     /* tarjetas, tablas, modales */
	--surface-2: #F8FAFC;   /* inputs en reposo, filas hover */
	--surface-3: #FAFCFF;   /* cabeceras de tabla */
	--line: #E3E8F0;        /* borde de tarjeta y separador fuerte */
	--line-soft: #F1F5F9;   /* separador interno de listas */
	--line-input: #D8DFEA;  /* borde de campos de formulario */
	--line-card: #EDF1F7;   /* borde de sub-tarjeta / item de lista */

	/* Texto */
	--text: #10233B;
	--text-2: #334155;
	--text-3: #475569;
	--muted: #64748B;
	--muted-2: #94A3B8;

	/* Semántica */
	--ok: #16A34A;  --ok-text: #15803D;  --ok-bg: #ECFDF3;  --ok-line: #BBF7D0;
	--warn-bg: #FFF8E1; --warn-text: #8A6A00; --warn-strong: #B08000; --warn-line: #FFECB3;
	--danger: #DC2626; --danger-bg: #FEF2F2; --danger-line: #FEE2E2;
	--idle: #CBD5E1;        /* toggles apagados, cobrador sin actividad */

	/* Tipografía (los .woff2 los declara /fonts/fonts.css) */
	--font-display: 'Space Grotesk', 'Segoe UI', Tahoma, sans-serif;
	--font-ui: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;

	/* Elevación (la jerarquía es por borde; sombra sólo en hover/modal) */
	--sombra-hover: 0 6px 20px rgba(13, 43, 78, .08);
	--sombra-hoja: 0 8px 30px rgba(13, 43, 78, .07);
	--sombra-modal: 0 24px 60px rgba(0, 0, 0, .3);
}

/* Animaciones compartidas del rediseño */
@keyframes lcfade { from { opacity: 0; transform: translateY(8px) } to { opacity: 1; transform: none } }
@keyframes lcpop  { from { opacity: 0; transform: scale(.96) }      to { opacity: 1; transform: none } }
@keyframes lcgrow { from { transform: scaleY(.05) }                 to { transform: scaleY(1) } }
@keyframes lcpulse { 0%, 100% { opacity: .35 } 50% { opacity: .9 } }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation: none !important;
		transition: none !important;
	}
}
