/* Generated by npm run build:css; do not edit directly. */
/* source: src/styles/index.css */
/**
* LM Contable — Design System v3.0 — fuente del bundle core.css.
* `npm run build:css` resuelve estos imports manteniendo este archivo como
* fuente mantenible. Orden importa: tokens antes
* que componentes; temas despues de colors.css (para poder sobreescribir
* sus variables); brand.css al final (gana sobre light/dark si ambos aplican).
*/
/* source: src/styles/tokens.css */
:root {
/* Z-index: una sola escala para toda la app, evita guerras de z-index */
--ds-z-base: 1;
--ds-z-sidebar: 400;
--ds-z-header: 500;
--ds-z-dropdown: 900;
--ds-z-tooltip: 950;
--ds-z-modal: 1000;
--ds-z-toast: 1100;
/* Breakpoints (referencia — los @media siguen necesitando el literal,
CSS no permite var() dentro de la condicion de un @media) */
--ds-bp-mobile: 640px;
--ds-bp-tablet: 1024px;
--ds-content-max-width: 1440px;
--ds-control-xs: 28px;
--ds-control-sm: var(--ds-space-4);
--ds-control-md: var(--ds-space-5);
--ds-control-lg: var(--ds-space-6);
/* Estandarizacion global de iconos (referencia: Iconos-v2.png) -- 4
tramos segun el rol del icono en la interfaz, no por libreria/estilo
(todo sigue siendo Lucide, stroke uniforme ver ui.js/initLucideAutoRefresh):
- Botones y acciones de tabla: --ds-icon-action (16px)
- Inputs/filtros/navegacion secundaria: --ds-icon-control (16-18px)
- Sidebar/topbar: --ds-icon-nav (18-20px)
- Tarjetas/KPI/encabezados destacados: --ds-icon-feature (20-24px)
--ds-icon-xs se mantiene aparte para glifos auxiliares/decorativos
(cerrar modal, breadcrumb, badges) que no encajan en ninguno de los 4
tramos de arriba -- forzarlos a 16px+ se ve sobredimensionado en
contextos muy densos, por eso quedan como excepcion documentada (ver
auditoria en LM_CONTABLE_DESIGN_SYSTEM.md). */
--ds-icon-xs: 12px;
--ds-icon-action: 16px;
--ds-icon-control: 17px;
--ds-icon-nav: 19px;
--ds-icon-feature: 22px;
/* Alias retrocompatibles (mismo valor, distinto nombre semantico --
evita romper selectores existentes que ya consumian estos tokens). */
--ds-icon-sm: var(--ds-icon-control);
--ds-icon-md: var(--ds-icon-nav);
--ds-icon-lg: var(--ds-icon-feature);
--ds-table-row-compact: var(--ds-space-5);
--ds-table-row-comfortable: var(--ds-space-6);
--ds-focus-ring-width: 2px;
--ds-focus-ring-input-width: 4px;
--ds-focus-offset: 2px;
--ds-button-padding-y-sm: 7px; --ds-button-padding-x-sm: 14px;
--ds-button-padding-y-md: 10px; --ds-button-padding-x-md: 18px;
--ds-button-padding-y-lg: 12px; --ds-button-padding-x-lg: 20px;
--ds-button-icon-size-sm: var(--ds-icon-action); --ds-button-icon-size-md: var(--ds-icon-action); --ds-button-icon-size-lg: var(--ds-icon-control);
--ds-button-active-offset: 1px; --ds-button-loading-size: 15px;
--ds-button-loading-border-width: 2px; --ds-button-border-width: 1px;
--ds-button-disabled-opacity: 0.55; --ds-button-padding-none: 0px; --ds-button-block-width: 100%;
--ds-input-height-sm: var(--ds-control-sm); --ds-input-height-md: var(--ds-control-md); --ds-input-height-lg: var(--ds-control-lg);
--ds-input-legacy-height: var(--ds-control-lg); --ds-input-width: 100%; --ds-input-border-width: 1px;
--ds-input-padding-x-sm: 12px; --ds-input-padding-x-md: 14px; --ds-input-padding-x-lg: var(--ds-space-2);
--ds-input-addon-offset: 14px; --ds-input-decorated-padding: var(--ds-control-md); --ds-input-icon-size: var(--ds-icon-sm);
--ds-badge-padding-y-sm: 2px; --ds-badge-padding-x-sm: 10px;
--ds-badge-padding-y-md: var(--ds-space-half); --ds-badge-padding-x-md: 12px;
--ds-badge-font-size-sm: 11px; --ds-badge-font-size-md: var(--ds-fs-caption);
--ds-badge-border-width: 1px; --ds-badge-disabled-opacity: var(--ds-button-disabled-opacity);
--ds-modal-width-sm: 400px; --ds-modal-width-md: 480px; --ds-modal-width-lg: 720px;
--ds-modal-viewport-gap: var(--ds-space-3);
--ds-toast-width: 384px; --ds-toast-viewport-gap: var(--ds-space-3);
--ds-toast-enter-duration: 150ms; --ds-toast-exit-duration: 150ms;
}
/* source: src/styles/colors.css */
/**
* LM Contable — Design System v5.0 — Colores
* Paleta cruda (escala numerica) + tokens semanticos que la consumen.
* Ningun componente debe usar un valor hex/rgba literal: siempre var(--ds-*).
*
* v5.0: se elimina el dorado por completo. La referencia oficial
* (C:\Users\lmartinez\Documents\Mejora\portaladmin-cliente.png) define una
* paleta navy + azul + grises — el acento de marca pasa de
* --ds-gold-500/-400/-300 a --ds-blue-600/-500/-400, y el rol semantico
* "--ds-gold*" se renombra a "--ds-accent*" en todo el sistema (no se deja
* un alias con nombre "gold" apuntando a azul, seria confuso). Se agrega
* --ds-purple-500 como 5to color de graficas (azul ya es el acento de UI,
* hacia falta un tono mas para que las 5 series de --ds-chart-* sigan
* siendo distinguibles entre si). La escala de grises NO cambia: --ds-slate-100
* (#F1F5F9) y --ds-slate-500 (#64748B) ya coincidian exactamente con la
* referencia.
*/
:root {
/* Explicito: controles nativos del navegador (checkbox/radio/select/inputs
de fecha) en su variante clara por defecto. themes/dark.css sobreescribe
a "dark" cuando corresponde. */
color-scheme: light;
/* ---- Paleta cruda: Primary (navy/slate) ---- */
--ds-primary-950: #0D1117;
--ds-primary-900: #111827;
--ds-primary-800: #1F2937;
--ds-primary-700: #334155;
--ds-primary-600: #475569;
/* ---- Paleta cruda: Azul (acento de marca) ---- */
--ds-blue-700: #1D4ED8;
--ds-blue-600: #2563EB;
--ds-blue-500: #3B82F6;
--ds-blue-400: #93C5FD;
--ds-blue-100: #DBEAFE;
--ds-blue-50: #EFF6FF;
/* ---- Paleta cruda: Neutrales ---- */
--ds-slate-50: #F8FAFC;
--ds-slate-100: #F1F5F9;
--ds-slate-200: #E2E8F0;
--ds-slate-300: #CBD5E1;
--ds-slate-400: #94A3B8;
--ds-slate-500: #64748B;
--ds-slate-900: #0F172A;
--ds-white: #FFFFFF;
--ds-transparent: transparent;
/* ---- Paleta cruda: Estado ---- */
--ds-green-600: #10B981;
--ds-amber-500: #F59E0B;
--ds-red-600: #EF4444;
--ds-purple-500: #8B5CF6;
/* Variante clara de purple-500 -- misma logica que --ds-blue-400 (pastel
claro derivado del acento), usada como color de icono brillante sobre
fondos tonales oscuros (ver --ds-icon-tile-purple-fg en themes/dark.css)
donde --ds-purple-500 solo no tenia suficiente contraste. */
--ds-purple-400: #C4B5FD;
--ds-indigo-500: #6366F1;
/* ================= TOKENS SEMANTICOS ================= */
/* Superficies */
--ds-bg: var(--ds-slate-50);
--ds-bg-secondary: var(--ds-slate-100);
--ds-surface: var(--ds-white);
--ds-card-bg: var(--ds-white);
--ds-border: var(--ds-slate-200);
--ds-canvas: var(--ds-bg);
--ds-surface-subtle: var(--ds-bg-secondary);
/* Encabezado de tabla / hover de fila: en claro, igual que siempre (--ds-bg
es mas oscuro que --ds-surface blanco, da el contraste sutil correcto).
themes/dark.css los sobreescribe -- ver ese archivo para el porque. */
--ds-table-header-bg: var(--ds-bg);
--ds-table-row-hover-bg: var(--ds-bg-secondary);
--ds-table-divider: var(--ds-border);
/* Texto */
--ds-text: var(--ds-slate-900);
/* Sobre las superficies claras, los grises anteriores perdían contraste.
Se conserva la jerarquía usando tonos ya existentes de la paleta. */
--ds-text-secondary: var(--ds-primary-600);
--ds-text-muted: var(--ds-slate-500);
--ds-text-on-dark: #F8FAFC;
--ds-text-on-dark-muted: rgba(255, 255, 255, 0.75);
--ds-icon-on-dark: #94A3B8;
--ds-text-subtle: var(--ds-text-secondary);
--ds-text-inverse: var(--ds-text-on-dark);
/* Alias legados (superficies aun no migradas a v5.0) — mismos valores, otro nombre */
--ds-text-900: var(--ds-text);
--ds-text-600: var(--ds-text-secondary);
--ds-text-400: var(--ds-text-muted);
/* Marca */
--ds-navy: var(--ds-primary-900);
--ds-navy-dark: var(--ds-primary-950);
--ds-accent: var(--ds-blue-600);
--ds-accent-dark: var(--ds-blue-500);
--ds-accent-hover: var(--ds-blue-500);
--ds-accent-light: var(--ds-blue-400);
--ds-action: var(--ds-accent);
--ds-action-hover: var(--ds-accent-hover);
--ds-focus-ring-color: var(--ds-action);
--ds-focus-ring-input-color: rgba(37, 99, 235, 0.15);
--ds-input-border: var(--ds-slate-300);
--ds-input-hover-border: var(--ds-text-muted);
--ds-input-focus-border: var(--ds-action);
--ds-input-focus-ring: var(--ds-focus-ring-input-color);
--ds-input-error: var(--ds-danger);
--ds-input-success: var(--ds-success);
--ds-overlay: rgba(7, 17, 31, 0.6);
/* Puente de compatibilidad temporal: admin-shell.css/dashboard-shell.css/
portal-client-shell.css (Fase B, todavia sin migrar) referencian
--ds-gold* directo. Apuntan a los tonos azules nuevos para que nada se
vea dorado ni se rompa mientras se completa el renombrado fase a fase.
Se retiran cuando esos 3 archivos dejen de usar estos nombres. */
--ds-gold-500: var(--ds-blue-600);
--ds-gold-400: var(--ds-blue-500);
--ds-gold-300: var(--ds-blue-400);
--ds-gold: var(--ds-accent);
--ds-gold-dark: var(--ds-accent-dark);
--ds-gold-hover: var(--ds-accent-hover);
/* Estado (fondo suave derivado del propio color, nunca un hex inventado aparte) */
--ds-success: var(--ds-green-600);
--ds-success-bg: rgba(16, 185, 129, 0.12);
--ds-warning: var(--ds-amber-500);
--ds-warning-bg: rgba(245, 158, 11, 0.14);
--ds-danger: var(--ds-red-600);
--ds-danger-bg: rgba(239, 68, 68, 0.12);
--ds-danger-hover: #B91C1C;
--ds-info: var(--ds-blue-600);
--ds-info-bg: rgba(37, 99, 235, 0.12);
--ds-neutral: var(--ds-text-secondary);
--ds-neutral-bg: var(--ds-bg-secondary);
--ds-primary-badge-bg: var(--ds-action);
--ds-primary-badge-text: var(--ds-text-inverse);
--ds-success-badge-text: #065F46;
--ds-warning-badge-text: #92400E;
--ds-danger-badge-text: #991B1B;
--ds-info-badge-text: var(--ds-info);
--ds-neutral-badge-text: var(--ds-neutral);
--ds-success-badge-border: rgba(16, 185, 129, 0.24);
--ds-warning-badge-border: rgba(245, 158, 11, 0.26);
--ds-danger-badge-border: rgba(239, 68, 68, 0.22);
--ds-info-badge-border: rgba(37, 99, 235, 0.22);
--ds-neutral-badge-border: var(--ds-border);
/* --ds-purple-500 ya existia como 5to color de graficas; le falta su fondo
suave para poder usarse tambien como acento de icono/badge (ver Reportes). */
--ds-purple-bg: rgba(139, 92, 246, 0.14);
--ds-purple-badge-text: #6B21A8;
--ds-purple-badge-border: rgba(139, 92, 246, 0.26);
/* Paleta de Estados (ver themes/dark.css para el porque de los 3 estados
nuevos: Proximo a vencer/En revision/Informativo no tenian variante de
dsBadge propia, se resolvian pisando 'warning'/'info'/'neutral' sin
poder distinguirse entre si). Base clara con la misma formula que el
resto (fondo rgba muy suave del color crudo + texto en su tono oscuro
de contraste) -- el hex EXACTO de la referencia solo aplica en oscuro,
ver themes/dark.css. */
--ds-orange-bg: rgba(234, 88, 12, 0.14);
--ds-orange-badge-text: #9A3412;
--ds-orange-badge-border: rgba(234, 88, 12, 0.26);
--ds-cyan-bg: rgba(8, 145, 178, 0.12);
--ds-cyan-badge-text: #155E75;
--ds-cyan-badge-border: rgba(8, 145, 178, 0.22);
/* Rol "Administrador" (dsRoleBadge): clasificacion, no estado -- un azul
LM deliberadamente mas tenue que --ds-info-* (que representa el estado
"En proceso") para que un badge de ROL nunca se lea como un badge de
ESTADO. Mismo --ds-blue-600 de --ds-info pero con menos de la mitad de
opacidad de fondo/borde. */
--ds-role-admin-bg: rgba(37, 99, 235, 0.07);
--ds-role-admin-badge-text: var(--ds-blue-600);
--ds-role-admin-badge-border: rgba(37, 99, 235, 0.14);
/* Navegación (v6.1): un único rol cromático azul para TODO item de sidebar
(Admin, Portal Cliente y Dashboard Financiero). Antes cada categoria de
menu (operacion/proceso/finanzas/organizacion/administracion) tenia su
propio color (verde, ambar, indigo, morado, gris) -- eso dejaba verde/
ambar/rojo funcionando como simple "etiqueta de modulo" en vez de
reservarse exclusivamente para estados funcionales (exito/advertencia/
error). Referencia: mockup "OPCION 1 - AZUL LM". El atributo
data-nav-category se mantiene en el HTML para agrupar items pero ya no
selecciona color (ver admin-shell.css/portal-client-shell.css). */
--ds-nav-icon: var(--ds-blue-600);
--ds-nav-icon-bg: var(--ds-blue-50);
--ds-nav-hover-icon: var(--ds-blue-700);
--ds-nav-hover-bg: var(--ds-blue-100);
--ds-nav-active-icon: var(--ds-blue-600);
--ds-nav-active-bg: var(--ds-blue-50);
--ds-nav-focus: var(--ds-focus-ring-color);
--ds-success-hover: #15803D; --ds-warning-hover: #D97706;
--ds-warning-contrast: var(--ds-primary-950);
--ds-button-loading-track-inverse: rgba(255, 255, 255, 0.4); --ds-button-loading-track: rgba(15, 23, 42, 0.2);
/* Graficas — unicamente estos 5 colores, nunca aleatorios (ver charts.css).
Azul ya es el acento de UI, por eso la 3ra serie usa purpura en vez de
azul otra vez -- si no, 3 de las 5 series compartirian tonalidad. */
--ds-chart-primary: var(--ds-primary-700);
--ds-chart-secondary: var(--ds-blue-600);
--ds-chart-accent: var(--ds-purple-500);
--ds-chart-success: var(--ds-green-600);
--ds-chart-danger: var(--ds-red-600);
/* Sidebar (regla global del sistema, ver layout.css). Se mantiene oscuro;
el activo pasa de "borde izquierdo dorado" a una pildora azul solida. */
--ds-sidebar-bg: var(--ds-primary-900);
--ds-sidebar-text: rgba(255, 255, 255, 0.75);
--ds-sidebar-icon: #94A3B8;
--ds-sidebar-hover-bg: rgba(255, 255, 255, 0.06);
--ds-sidebar-active-bg: var(--ds-blue-600);
--ds-sidebar-active-border: var(--ds-blue-600);
--ds-sidebar-active-text: #FFFFFF;
--ds-sidebar-active-icon: #FFFFFF;
/* Header (regla global del sistema, ver layout.css). v5.0: el header pasa
de navy a blanco/claro -- unica superficie oscura que queda es el
sidebar. */
--ds-header-bg: var(--ds-white);
--ds-header-border: var(--ds-slate-200);
--ds-header-search-bg: var(--ds-slate-100);
--ds-header-search-placeholder: var(--ds-text-muted);
/* Header de .ds-modal (ver globals.css): en claro es --ds-navy fijo,
franja oscura de sobra de contraste sobre el cuerpo blanco del modal
(--ds-surface). En oscuro ese mismo --ds-navy se vuelve un token
independiente para que themes/dark.css lo pueda reemplazar por un gris
neutro -- ver ese archivo para el porque. */
--ds-modal-header-bg: var(--ds-navy);
}
/* [data-theme="light"] explicito: identico a :root (default), para que un
toggle futuro pueda alternar sin caso especial. Ver themes/light.css. */
/* source: src/styles/typography.css */
/**
* LM Contable — Design System v5.0 — Tipografia
* Unicamente Inter (pesos 300 Light/400/500/600/700 — sin 800), en toda la
* interfaz incluidos los titulos. La referencia oficial
* (portaladmin-cliente.png) solo muestra Inter con esa escala de pesos --
* Satoshi (adoptado en un rebrand anterior) se retira por completo.
*/
:root {
--ds-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--ds-fs-h1: 32px;
--ds-fs-h2: 24px;
--ds-fs-h3: 18px;
--ds-fs-subtitle: 15px;
--ds-fs-body: 14px;
--ds-fs-caption: 12px;
--ds-fs-button: 13px;
--ds-fs-table-header: 12px;
--ds-fs-input: 14px;
--ds-fw-light: 300;
--ds-fw-regular: 400;
--ds-fw-medium: 500;
--ds-fw-semibold: 600;
--ds-fw-bold: 700;
--ds-type-title-lg-size: var(--ds-fs-h1);
--ds-type-title-size: var(--ds-fs-h2);
--ds-type-subtitle-size: var(--ds-fs-h3);
--ds-type-body-size: var(--ds-fs-body);
--ds-type-label-size: var(--ds-fs-button);
--ds-type-caption-size: var(--ds-fs-caption);
--ds-type-control-compact-size: var(--ds-fs-caption);
--ds-type-financial-size: var(--ds-fs-body);
--ds-type-table-size: var(--ds-fs-caption);
--ds-type-table-head-size: var(--ds-fs-table-header);
--ds-type-kpi-size: 30px;
--ds-type-financial-variant: tabular-nums;
--ds-type-button-letter-spacing: 0.01em;
--ds-type-label-letter-spacing: 0.03em;
}
.ds-scope,
.ds-scope input,
.ds-scope select,
.ds-scope textarea,
.ds-scope button {
font-family: var(--ds-font);
}
.ds-h1 { font-size: var(--ds-fs-h1); font-weight: var(--ds-fw-bold); color: var(--ds-text); line-height: 1.2; margin: 0; letter-spacing: -0.01em; }
.ds-h2 { font-size: var(--ds-fs-h2); font-weight: var(--ds-fw-bold); color: var(--ds-text); line-height: 1.25; margin: 0; }
.ds-h3 { font-size: var(--ds-fs-h3); font-weight: var(--ds-fw-semibold); color: var(--ds-text); line-height: 1.3; margin: 0; }
.ds-subtitle { font-size: var(--ds-fs-subtitle); font-weight: var(--ds-fw-medium); color: var(--ds-text-secondary); margin: 0; }
.ds-text { font-size: var(--ds-fs-body); font-weight: var(--ds-fw-regular); color: var(--ds-text); }
.ds-caption { font-size: var(--ds-fs-caption); font-weight: var(--ds-fw-regular); color: var(--ds-text-muted); }
/* source: src/styles/spacing.css */
/**
* LM Contable — Design System v3.0 — Espaciado
* Escala de 8 puntos (8/16/24/32/40/48) con un unico medio-paso de 4px para
* micro-espaciado (gap icono-texto, padding de badges) — practica estandar
* en sistemas de 8pt (Material, etc.), no una excepcion arbitraria.
*/
:root {
--ds-space-half: 4px;
--ds-space-1: 8px;
--ds-space-2: 16px;
--ds-space-3: 24px;
--ds-space-4: 32px;
--ds-space-5: 40px;
--ds-space-6: 48px;
/* Pasos adicionales para layout de superficie completa (sidebars/paginas) */
--ds-space-7: 64px;
--ds-space-8: 80px;
--ds-space-control-x: var(--ds-space-2);
--ds-space-control-y: var(--ds-space-1);
--ds-space-card-compact: var(--ds-space-2);
--ds-space-card-comfortable: var(--ds-space-3);
--ds-space-toolbar-gap: var(--ds-space-2);
--ds-space-table-cell-compact: var(--ds-space-1);
--ds-space-table-cell-comfortable: var(--ds-space-2);
--ds-space-layout-gap: var(--ds-space-3);
}
/* source: src/styles/radius.css */
/**
* LM Contable — Design System v3.0 — Border radius
*/
:root {
--ds-radius-btn: 8px;
--ds-radius-input: 12px;
--ds-radius-card: 16px;
--ds-radius-modal: 20px;
--ds-radius-dropdown: 12px;
--ds-radius-badge: 999px;
--ds-radius-button: var(--ds-radius-btn);
--ds-radius-control: var(--ds-radius-input);
--ds-radius-pill: var(--ds-radius-badge);
}
/* source: src/styles/shadows.css */
/**
* LM Contable — Design System v3.0 — Sombras
* Solo 3 niveles.
* "sm"/"md" (ambiental, tarjetas/superficies en reposo y su estado
* elevado/hover) eliminadas -- armonizacion 2026-09-07, direccion
* "Combinada"/B (Linear): la jerarquia la da el borde + el tono de
* superficie, no la sombra. Reemplaza la sombra ambiental claramente
* visible pedida el 2026-08-23 (ver historial), que fue el punto de
* partida de esta armonizacion pero ya no es la direccion elegida -- se
* baja el token a un valor "cero" valido (no la palabra `none`: varias
* reglas componen --ds-shadow-sm en una lista con otra capa, ej.
* .admin-avatar, .admin-card.is-highlighted -- `none` ahi invalidaria
* toda la propiedad) en vez de sobreescribir cada selector, asi toda
* superficie que ya consume --ds-shadow-sm/-md (.ds-card, .admin-card,
* .card, tabs activos, filter-bar, etc., en los 3 portales) hereda el
* cambio sin tocar cada regla una por una. dark.css sobreescribe sm/md
* de la misma forma, sin cambios aca.
* "lg" (modales/toasts, overlay real sobre el resto de la pagina) sin
* tocar -- sigue siendo funcionalmente necesaria para separar ese
* contenido flotante del resto, a diferencia de la sombra decorativa de
* una tarjeta en reposo.
*/
:root {
--ds-shadow-sm: 0 0 0 0 rgba(2, 6, 23, 0);
--ds-shadow-md: 0 0 0 0 rgba(2, 6, 23, 0);
--ds-shadow-lg: 0 24px 60px rgba(2, 6, 23, 0.14);
--ds-shadow-rest: var(--ds-shadow-sm);
--ds-shadow-raised: var(--ds-shadow-md);
--ds-shadow-overlay: var(--ds-shadow-lg);
--ds-shadow-input-focus: 0 0 0 var(--ds-focus-ring-input-width) var(--ds-input-focus-ring);
}
/* source: src/styles/animations.css */
/**
* LM Contable — Design System v3.0 — Animaciones
* Una sola duracion/easing para toda transicion: 220ms ease. Sin efectos
* exagerados. Se mantienen 3 nombres (fast/base/slow) para no romper a los
* consumidores existentes, pero las tres valen lo mismo por diseno.
*/
:root {
--ds-ease: ease;
--ds-transition-fast: 0.22s var(--ds-ease);
--ds-transition-base: 0.22s var(--ds-ease);
--ds-transition-slow: 0.22s var(--ds-ease);
--ds-motion-fast: var(--ds-transition-fast);
--ds-motion-base: var(--ds-transition-base);
--ds-motion-slow: var(--ds-transition-slow);
--ds-button-loading-motion: 700ms linear;
}
@keyframes ds-spin { to { transform: rotate(360deg); } }
@keyframes ds-fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ds-slide-in { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: translateX(0); } }
@keyframes ds-skeleton-shimmer { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.ds-fade-in { animation: ds-fade-in var(--ds-transition-base); }
/* Icono "loader-circle" (Lucide) usado como spinner de carga suelto dentro de
un botón -- `Texto…`, sin ningún wrapper
propio -- en más de 10 lugares de la app (ej. "Conciliar" en
Conciliaciones, reportado en vivo: el ícono se quedaba estático). Lucide
conserva el atributo data-lucide en el