/**
 * NOVA — Overrides globales de tipografía
 *
 * Sistema de 3 niveles de jerarquía:
 *
 *   Primary   #0f172a  (slate-900)  → títulos, números importantes
 *   Secondary #334155  (slate-700)  → labels de campo, texto descriptivo
 *   Tertiary  #64748b  (slate-500)  → helper text, subtítulos contextuales
 *   Muted     #94a3b8  (slate-400)  → placeholders, dividers (no leíble)
 *
 * Paleta slate (azulada) para combinar con turquesa NOVA #39BBB9.
 * Usamos !important SOLO donde Filament tiene utility classes muy
 * específicas. En lo demás, dejamos que la cascada CSS funcione
 * naturalmente.
 */

/* ─── 1. Base: variables de color ─── */

:root {
    --nova-text-primary: #0f172a;
    --nova-text-secondary: #334155;
    --nova-text-tertiary: #64748b;
    --nova-text-muted: #94a3b8;
}

.dark {
    --nova-text-primary: #f8fafc;
    --nova-text-secondary: #cbd5e1;
    --nova-text-tertiary: #94a3b8;
    --nova-text-muted: #64748b;
}

/* ─── 2. Override de grises Filament (text-gray-X) ─── */

/* text-gray-400 → tertiary (era ilegible) */
.fi-body .text-gray-400 {
    color: var(--nova-text-tertiary) !important;
}

/* text-gray-500 → tertiary también (era el más usado y débil) */
.fi-body .text-gray-500 {
    color: var(--nova-text-tertiary) !important;
}

/* text-gray-600 → secondary */
.fi-body .text-gray-600 {
    color: var(--nova-text-secondary) !important;
}

/* text-gray-950 (texto fuerte) → primary nuevo */
.fi-body .text-gray-950 {
    color: var(--nova-text-primary) !important;
}

/* ─── 3. Form labels (Filament) — Secondary + semibold ─── */

.fi-fo-field-wrp-label {
    color: var(--nova-text-secondary) !important;
    font-weight: 600 !important;
}

/* Helper text de campos — Tertiary, peso normal */
.fi-fo-field-wrp-hint,
.fi-fo-field-wrp-helper-text {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
}

/* ─── 4. Headers de tabla — Secondary + semibold ─── */

.fi-ta-header-cell-label,
.fi-ta-header-cell {
    color: var(--nova-text-secondary) !important;
    font-weight: 600 !important;
    font-size: 0.8125rem;
    letter-spacing: 0.025em;
}

/* ─── 5. Sections (cards) — heading Primary, description Tertiary ─── */

.fi-section-header-heading {
    color: var(--nova-text-primary) !important;
    font-weight: 700 !important;
}

.fi-section-header-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
    font-size: 0.875rem;
}

/* ─── 6. Page headers — Primary + bold ─── */

.fi-header-heading {
    color: var(--nova-text-primary) !important;
    font-weight: 700 !important;
}

.fi-header-subheading {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
}

.fi-breadcrumbs-item-label {
    font-weight: 500;
}

/* ─── 7. Tabs — Secondary base, Primary cuando active ─── */

.fi-tabs-item:not(.fi-active) .fi-tabs-item-label {
    color: var(--nova-text-secondary);
    font-weight: 500;
}

.fi-tabs-item.fi-active .fi-tabs-item-label {
    color: var(--nova-text-primary) !important;
    font-weight: 600 !important;
}

/* ─── 8. Modals ─── */

.fi-modal-heading {
    color: var(--nova-text-primary) !important;
    font-weight: 700 !important;
}

.fi-modal-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
}

/* ─── 9. Notificaciones ─── */

.fi-no-notification-title {
    color: var(--nova-text-primary) !important;
    font-weight: 600 !important;
}

.fi-no-notification-body {
    color: var(--nova-text-secondary) !important;
    font-weight: 400;
}

/* ─── 10. Empty states ─── */

.fi-ta-empty-state-heading {
    color: var(--nova-text-primary) !important;
    font-weight: 600 !important;
}

.fi-ta-empty-state-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
}

/* ─── 11. Stats overview nativos ─── */

.fi-wi-stats-overview-stat-label {
    color: var(--nova-text-secondary) !important;
    font-weight: 500 !important;
}

.fi-wi-stats-overview-stat-value {
    color: var(--nova-text-primary) !important;
    font-weight: 700 !important;
}

.fi-wi-stats-overview-stat-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 500;
}

/* ─── 12. Pagination ─── */

.fi-pagination-overview {
    color: var(--nova-text-secondary) !important;
    font-weight: 500;
}

/* ─── 13. Botones (label) ─── */

.fi-btn-label {
    font-weight: 600;
}

.fi-link {
    font-weight: 500;
}

/* ─── 14. Dropdowns ─── */

.fi-dropdown-list-item-label {
    color: var(--nova-text-primary);
    font-weight: 500;
}

/* ─── 15. Form section descriptions y similares ─── */

.fi-fo-section-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
}

/* Chart widgets descriptions (Filament 3 ChartWidget header) */
[class*="fi-wi-chart-header"] [class*="description"],
[class*="fi-section"] [class*="description"],
.fi-wi-chart-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
}

/* ─── 16. Sidebar — GRUPOS y ITEMS ─── */

/* Header de grupo del sidebar (Sistema, Costos, Logística, etc.) */
.fi-sidebar-group-label {
    color: var(--nova-text-secondary) !important;
    font-weight: 700 !important;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.dark .fi-sidebar-group-label {
    color: var(--nova-text-secondary) !important;
}

/* Items del sidebar (no activos) */
.fi-sidebar-item:not(.fi-active) .fi-sidebar-item-label,
.fi-sidebar-item:not(.fi-active) a {
    color: var(--nova-text-secondary) !important;
    font-weight: 500 !important;
}

/* Items del sidebar (activos) — bold + color marca */
.fi-sidebar-item.fi-active .fi-sidebar-item-label,
.fi-sidebar-item.fi-active a {
    color: #208b89 !important;
    font-weight: 600 !important;
}

/* Iconos del sidebar — tomar el color del item */
.fi-sidebar-item:not(.fi-active) svg {
    color: var(--nova-text-secondary) !important;
    opacity: 0.8;
}

.fi-sidebar-item.fi-active svg {
    color: #208b89 !important;
    opacity: 1;
}

.dark .fi-sidebar-item:not(.fi-active) .fi-sidebar-item-label,
.dark .fi-sidebar-item:not(.fi-active) a {
    color: #cbd5e1 !important;
}

.dark .fi-sidebar-item.fi-active .fi-sidebar-item-label,
.dark .fi-sidebar-item.fi-active a {
    color: #5eead4 !important;
}

/* ─── 17. Topbar / header del panel ─── */

.fi-topbar a,
.fi-topbar button {
    color: var(--nova-text-secondary);
    font-weight: 500;
}

/* ─── 18. Badges — Contraste alto ─── */

/* Filament badges base: subir contraste de texto */
.fi-badge {
    font-weight: 600 !important;
}

/* Badges color "primary" (turquesa NOVA): texto y fondo más contrastados */
.fi-badge.fi-color-primary,
.fi-badge[class*="fi-color-primary"] {
    background-color: #ccfbf6 !important;
    color: #0f5453 !important;
}

.dark .fi-badge.fi-color-primary,
.dark .fi-badge[class*="fi-color-primary"] {
    background-color: rgba(57, 187, 185, 0.2) !important;
    color: #5eead4 !important;
}

/* Badges color "success" (verde): contraste */
.fi-badge.fi-color-success,
.fi-badge[class*="fi-color-success"] {
    background-color: #d1fae5 !important;
    color: #065f46 !important;
}

.dark .fi-badge.fi-color-success {
    background-color: rgba(16, 185, 129, 0.2) !important;
    color: #6ee7b7 !important;
}

/* Badges color "warning" (amarillo/naranja): contraste */
.fi-badge.fi-color-warning,
.fi-badge[class*="fi-color-warning"] {
    background-color: #fef3c7 !important;
    color: #92400e !important;
}

.dark .fi-badge.fi-color-warning {
    background-color: rgba(245, 158, 11, 0.2) !important;
    color: #fcd34d !important;
}

/* Badges color "danger" (rojo): contraste */
.fi-badge.fi-color-danger,
.fi-badge[class*="fi-color-danger"] {
    background-color: #fee2e2 !important;
    color: #991b1b !important;
}

.dark .fi-badge.fi-color-danger {
    background-color: rgba(239, 68, 68, 0.2) !important;
    color: #fca5a5 !important;
}

/* Badges color "info" (azul): contraste */
.fi-badge.fi-color-info,
.fi-badge[class*="fi-color-info"] {
    background-color: #dbeafe !important;
    color: #1e3a8a !important;
}

.dark .fi-badge.fi-color-info {
    background-color: rgba(59, 130, 246, 0.2) !important;
    color: #93c5fd !important;
}

/* Badges color "gray" (default neutro): contraste */
.fi-badge.fi-color-gray,
.fi-badge[class*="fi-color-gray"] {
    background-color: #e5e7eb !important;
    color: #1f2937 !important;
}

.dark .fi-badge.fi-color-gray {
    background-color: rgba(148, 163, 184, 0.2) !important;
    color: #cbd5e1 !important;
}

/* ─── 19. Tablas: cells y datos ─── */

/* Texto general de celdas de tabla */
.fi-ta-cell,
.fi-ta-text-item-label {
    color: var(--nova-text-primary) !important;
    font-weight: 500;
}

/* Subtítulos / descripción dentro de celda */
.fi-ta-cell-description,
.fi-ta-text-item-description {
    color: var(--nova-text-tertiary) !important;
    font-weight: 400;
}

.dark .fi-ta-cell {
    color: var(--nova-text-primary) !important;
}

/* Footer de tabla "Se muestran de X a Y de Z resultados" */
.fi-ta-pagination,
.fi-pagination,
[class*="fi-ta-pagination"] {
    color: var(--nova-text-secondary) !important;
    font-weight: 500;
}

/* ─── 20. Action buttons en tablas ─── */

.fi-ac-action,
.fi-ac-btn {
    font-weight: 500;
}

/* ─── 21. Datepicker — distinción "hoy" vs "seleccionado" ─── */

/* "Hoy" sin selección: solo borde turquesa, fondo blanco */
.fi-fo-date-time-picker [class*="today"]:not([class*="selected"]):not([class*="active"]) {
    background-color: transparent !important;
    color: #208b89 !important;
    font-weight: 700 !important;
    border: 2px solid #39BBB9 !important;
}

/* Día seleccionado: fondo turquesa lleno, texto blanco */
.fi-fo-date-time-picker [class*="selected"],
.fi-fo-date-time-picker [class*="active"] {
    background-color: #39BBB9 !important;
    color: white !important;
    font-weight: 700 !important;
    border: 2px solid #39BBB9 !important;
}

/* Hover sobre día normal */
.fi-fo-date-time-picker button:not([class*="today"]):not([class*="selected"]):hover {
    background-color: #f0fdfd !important;
    color: #208b89 !important;
}

/* ─────────────────────────────────────────────────────────────────────
   22. Sistema de tabs custom del Dashboard analítico (Sesión 7.5 Fase 7.0)
   Identidad NOVA: turquesa #39BBB9 cuando active, gris suave inactivo.
   Mobile-friendly: 44px alto mínimo (área de tap).
───────────────────────────────────────────────────────────────────── */

.nova-tabs {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.nova-tab-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    min-height: 44px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
    border-radius: 6px 6px 0 0;
}

.nova-tab-button:hover:not(.active) {
    color: #208b89;
    background: #f0fdfd;
}

.nova-tab-button.active {
    color: #39BBB9;
    border-bottom-color: #39BBB9;
    font-weight: 700;
}

.nova-tab-button:focus-visible {
    outline: 2px solid #39BBB9;
    outline-offset: 2px;
}

.nova-tab-icon {
    font-size: 16px;
    line-height: 1;
}

.nova-tab-label {
    font-family: inherit;
}

/* Placeholder de tabs todavía no implementados (Logístico, Cobranza) */
.nova-tab-placeholder {
    background: white;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    padding: 64px 24px;
    text-align: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.nova-tab-placeholder-icon {
    font-size: 56px;
    line-height: 1;
    margin-bottom: 16px;
}

.nova-tab-placeholder-title {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 12px;
}

.nova-tab-placeholder-text {
    font-size: 14px;
    color: #64748b;
    line-height: 1.6;
    max-width: 480px;
    margin: 0 auto;
}

/* Dark mode (por consistencia con resto del panel) */
.dark .nova-tabs {
    border-bottom-color: #334155;
}

.dark .nova-tab-button {
    color: #94a3b8;
}

.dark .nova-tab-button:hover:not(.active) {
    color: #5eead4;
    background: rgba(57, 187, 185, 0.08);
}

.dark .nova-tab-placeholder {
    background: #1e293b;
    border-color: #475569;
}

.dark .nova-tab-placeholder-title {
    color: #f1f5f9;
}

.dark .nova-tab-placeholder-text {
    color: #94a3b8;
}

/* ─────────────────────────────────────────────────────────────────────
   23. Sticky bar de período del Dashboard analítico (Sesión 7.5 Fase 7.0.1)
   Mejora visual: turquesa NOVA, borde acento izquierdo, sombra cálida.
───────────────────────────────────────────────────────────────────── */

.nova-sticky-periodo-wrapper {
    position: sticky;
    top: 80px;
    z-index: 40;
    margin-bottom: 12px;
}

.nova-sticky-periodo-inner {
    background: #f0fdfd;
    border: 1px solid #39BBB9;
    border-left: 4px solid #39BBB9;
    border-radius: 12px;
    padding: 14px 20px;
    box-shadow:
        0 4px 12px -2px rgba(57, 187, 185, 0.15),
        0 2px 4px -1px rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.nova-sticky-periodo-info {
    display: flex;
    align-items: center;
    gap: 10px;
}

.nova-sticky-periodo-icon {
    width: 18px;
    height: 18px;
    color: #208b89;
    flex-shrink: 0;
}

.nova-sticky-periodo-label {
    font-size: 13px;
    font-weight: 700;
    color: #39BBB9;
}

.nova-sticky-periodo-fechas {
    font-size: 14px;
    font-weight: 500;
    color: #0f172a;
}

.nova-sticky-periodo-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 8px;
    background: #39BBB9;
    color: white;
    font-size: 13px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}

.nova-sticky-periodo-btn:hover {
    background: #208b89;
}

.nova-sticky-periodo-btn-icon {
    width: 14px;
    height: 14px;
}

/* Dark mode */
.dark .nova-sticky-periodo-inner {
    background: rgba(57, 187, 185, 0.08);
    border-color: #39BBB9;
    border-left-color: #39BBB9;
    box-shadow:
        0 4px 12px -2px rgba(0, 0, 0, 0.4),
        0 2px 4px -1px rgba(0, 0, 0, 0.2);
}

.dark .nova-sticky-periodo-fechas {
    color: #f1f5f9;
}

.dark .nova-sticky-periodo-icon {
    color: #5eead4;
}

/* ─────────────────────────────────────────────────────────────────────
   24. Sub-tabs del tab Cobranza (Sesión 7.5 Fase 7.1)
   Más compactos que los tabs principales: 32-36px, font 13px.
───────────────────────────────────────────────────────────────────── */

.nova-subtabs {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid #e2e8f0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.nova-subtab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    min-height: 36px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    font-size: 13px;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
    border-radius: 6px 6px 0 0;
}

.nova-subtab:hover:not(.active) {
    color: #208b89;
    background: #f0fdfd;
}

.nova-subtab.active {
    color: #39BBB9;
    border-bottom-color: #39BBB9;
    font-weight: 700;
}

.nova-subtab:focus-visible {
    outline: 2px solid #39BBB9;
    outline-offset: 2px;
}

/* Banner readonly de período en tab Cobranza */
.nova-cobranza-periodo-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 13px;
    color: #64748b;
    min-height: 36px;
}

.nova-cobranza-periodo-icon {
    font-size: 14px;
    line-height: 1;
}

.nova-cobranza-periodo-texto {
    flex: 1;
    color: #475569;
}

.nova-cobranza-periodo-texto strong {
    color: #0f172a;
    font-weight: 600;
}

.nova-cobranza-periodo-btn {
    background: transparent;
    border: 1px solid #cbd5e1;
    color: #475569;
    padding: 4px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.nova-cobranza-periodo-btn:hover {
    background: #39BBB9;
    border-color: #39BBB9;
    color: white;
}

/* KPIs Cobranza — 5 cards horizontales */
.nova-cobranza-kpis-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

@media (max-width: 1024px) {
    .nova-cobranza-kpis-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .nova-cobranza-kpis-grid {
        grid-template-columns: 1fr;
    }
}

.nova-cobranza-kpi-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    text-align: center;
}

.nova-cobranza-kpi-icon {
    font-size: 28px;
    line-height: 1;
    margin-bottom: 6px;
}

.nova-cobranza-kpi-label {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}

.nova-cobranza-kpi-valor {
    font-size: 18px;
    font-weight: 700;
}

/* Cuadre matemático — alerta verde/roja */
.nova-cobranza-cuadre {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-radius: 12px;
    border: 1px solid;
    background: white;
}

.nova-cobranza-cuadre.cuadra {
    background: #f0fdf4;
    border-color: #16a34a;
}

.nova-cobranza-cuadre.descuadra {
    background: #fef2f2;
    border-color: #dc2626;
}

.nova-cobranza-cuadre-icono {
    font-size: 32px;
    line-height: 1;
    flex-shrink: 0;
}

.nova-cobranza-cuadre-body {
    flex: 1;
}

.nova-cobranza-cuadre-titulo {
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 4px;
}

.nova-cobranza-cuadre.descuadra .nova-cobranza-cuadre-titulo {
    color: #991b1b;
}

.nova-cobranza-cuadre-formula {
    font-size: 13px;
    color: #475569;
    font-family: ui-monospace, SFMono-Regular, monospace;
    margin-bottom: 4px;
}

.nova-cobranza-cuadre-op {
    color: #94a3b8;
    margin: 0 4px;
}

.nova-cobranza-cuadre-meta {
    font-size: 12px;
    color: #64748b;
}

.nova-cobranza-cuadre-diff {
    color: #dc2626;
    font-weight: 600;
}

/* Tabla pendientes verificación */
.nova-cobranza-pendientes {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px 20px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.nova-cobranza-pendientes-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e5e7eb;
}

.nova-cobranza-pendientes-titulo {
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
}

.nova-cobranza-pendientes-count {
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    background: #f1f5f9;
    padding: 2px 8px;
    border-radius: 999px;
}

.nova-cobranza-pendientes-vacio {
    padding: 32px 12px;
    text-align: center;
    color: #16a34a;
    font-size: 14px;
    font-weight: 500;
}

.nova-cobranza-pendientes-tabla-wrapper {
    overflow-x: auto;
}

.nova-cobranza-pendientes-tabla {
    width: 100%;
    font-size: 13px;
    border-collapse: collapse;
}

.nova-cobranza-pendientes-tabla th {
    text-align: left;
    padding: 8px 10px;
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

.nova-cobranza-pendientes-tabla td {
    padding: 10px;
    border-bottom: 1px solid #f1f5f9;
    color: #0f172a;
}

.nova-cobranza-pendientes-tabla tbody tr:hover {
    background: #f8fafc;
}

.nova-cobranza-th-num,
.nova-cobranza-td-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.nova-cobranza-dias-amarillo { color: #d97706; }
.nova-cobranza-dias-rojo { color: #dc2626; }

.nova-cobranza-badge-ok,
.nova-cobranza-badge-falta,
.nova-cobranza-badge-observado,
.nova-cobranza-badge-verificar {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
}

.nova-cobranza-badge-ok { background: #dcfce7; color: #166534; }
.nova-cobranza-badge-falta { background: #fef3c7; color: #92400e; }
.nova-cobranza-badge-observado { background: #fee2e2; color: #991b1b; }
.nova-cobranza-badge-verificar { background: #e0f2fe; color: #075985; }

/* Dark mode */
.dark .nova-subtabs { border-bottom-color: #334155; }
.dark .nova-subtab { color: #94a3b8; }
.dark .nova-subtab:hover:not(.active) {
    color: #5eead4;
    background: rgba(57, 187, 185, 0.08);
}
.dark .nova-cobranza-periodo-banner {
    background: #1e293b;
    border-color: #334155;
    color: #94a3b8;
}
.dark .nova-cobranza-periodo-texto strong { color: #f1f5f9; }
.dark .nova-cobranza-kpi-card {
    background: #1e293b;
    border-color: #334155;
}
.dark .nova-cobranza-pendientes {
    background: #1e293b;
    border-color: #334155;
}
.dark .nova-cobranza-pendientes-tabla th {
    background: #0f172a;
    border-bottom-color: #334155;
    color: #94a3b8;
}
.dark .nova-cobranza-pendientes-tabla td {
    color: #f1f5f9;
    border-bottom-color: #334155;
}