// ============================================================
//  DARK MODE — Módulos y componentes Vue
//  Overrides de estilos scoped claros de los módulos de negocio
//  (contabilidad, RRHH, empresa, contactos, etc.) y de componentes
//  compartidos de resources/js/components. Los scoped de Vue
//  compilan sin !important, así que estas reglas centrales
//  con !important les ganan siempre.
//  Los gradientes/colores de MARCA (morado #667eea→#764ba2, violeta
//  #6f42c1→#e83e8c, rojo/naranja contable, amarillo ML) SE CONSERVAN.
//  Solo pantalla: al imprimir sale siempre el tema claro.
// ============================================================

@media screen {
:root[data-theme="dark"] {

  // ════════════════════════════════════════════════════════
  //  Patrón compartido: tablas taxes-* + secciones de formulario
  //  (usado por contabilidad, contactos, empresa/documentos, tesorería)
  // ════════════════════════════════════════════════════════
  .tab-content-wrapper { background: var(--dm-surface) !important; }
  .section-header {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .section-title { color: var(--dm-text) !important; }
  .form-label-modern { color: var(--dm-text) !important; }
  .taxes-table-header {
    // shorthand: varios .vue y new_css_2025 definen gradientes claros acá
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-th-modern {
    // shorthand necesario: los .vue definen el th con gradiente claro vía
    // "background:" y el core solo pisa background-color. El color del texto
    // lo fija el core (var(--dm-text)).
    background: var(--dm-surface-2) !important;
  }
  .taxes-td-modern {
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-table-row { border-color: var(--dm-border) !important; }
  .taxes-table-row:hover { background: rgba(255, 255, 255, .05) !important; }
  .taxes-table-modern tbody tr:last-child td {
    background: var(--dm-surface-2) !important;
    border-top-color: var(--dm-border) !important;
  }
  .taxes-subtotal-row {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-subtotal-row th { color: var(--dm-text) !important; }
  .taxes-table-footer {
    background-color: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-pagination-info { color: var(--dm-muted) !important; }
  .taxes-table-title { color: var(--dm-text) !important; }
  .taxes-table-header-actions {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-table-header-actions .form-group label { color: var(--dm-text) !important; }
  .taxes-main-form-container { background: var(--dm-bg) !important; }
  .taxes-main-form-container .card-body { background: var(--dm-surface) !important; }
  .taxes-empty-state {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  // El override global de modales no cubre .modal-title (varios componentes
  // lo fijan a #495057); en dark todo .modal-header queda surface-2 → texto claro.
  .modal-title { color: var(--dm-text) !important; }

  // ════════════════════════════════════════════════════════
  //  new_css_2025.css · Asientos contables (abm_asiento / ModalAsiento)
  // ════════════════════════════════════════════════════════
  .file-upload-group .file-upload-modern {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .file-upload-group .file-upload-modern:hover {
    background: var(--dm-surface-2) !important;
    border-color: #3b82f6 !important;
  }
  .asiento-contable-container { background: var(--dm-surface) !important; }
  .asiento-table { border-color: var(--dm-border) !important; }
  .asiento-thead { background: var(--dm-surface-2) !important; }
  .asiento-row:hover { background: rgba(255, 255, 255, .05) !important; }
  .totals-row {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .totals-label { color: var(--dm-text) !important; }
  .debe-column { color: #6ee7b7 !important; }
  .haber-column { color: #fca5a5 !important; }
  .money-input {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .money-input:focus { border-color: #3b82f6 !important; }
  .money-input:disabled { background: #171b21 !important; color: var(--dm-muted) !important; }
  .debe-input.active {
    background: rgba(16, 185, 129, .10) !important;
    border-color: #22c55e !important;
    color: #6ee7b7 !important;
  }
  .haber-input.active {
    background: rgba(239, 68, 68, .10) !important;
    border-color: #ef4444 !important;
    color: #fca5a5 !important;
  }
  .row-number { background: rgba(37, 99, 235, .18) !important; color: #93c5fd !important; }
  .account-code { color: #93c5fd !important; }
  .account-name { color: var(--dm-muted) !important; }
  .debe-total-amount {
    background: rgba(16, 185, 129, .15) !important;
    color: #6ee7b7 !important;
    border-color: rgba(16, 185, 129, .35) !important;
  }
  .haber-total-amount {
    background: rgba(239, 68, 68, .15) !important;
    color: #fca5a5 !important;
    border-color: rgba(239, 68, 68, .35) !important;
  }
  .empty-asiento { background: var(--dm-surface-2) !important; }

  // ════════════════════════════════════════════════════════
  //  new_css_2025.css · Dashboard hero + tablero de control
  // ════════════════════════════════════════════════════════
  // (scopeado a .dashboard-home-hero: .word/.hero-title también existen en landings públicas)
  .dashboard-home-hero .hero-title { color: var(--dm-text) !important; }
  .dashboard-home-hero .professional-words { border-color: var(--dm-border) !important; }
  .dashboard-home-hero .word { color: var(--dm-muted) !important; }
  .dashboard-home-hero .word:hover { color: var(--primary) !important; }
  .dashboard-home-hero .feature-item:hover { background: rgba(37, 99, 235, .15) !important; }
  .dashboard-home-hero .motivational-footer { border-color: var(--dm-border) !important; }
  .dashboard-home-hero .motivational-text { color: var(--dm-muted) !important; }

  .tablero-row-clickable:hover { background-color: rgba(255, 255, 255, .05) !important; }
  .tablero-nivel2 { background-color: rgba(255, 255, 255, .03) !important; }
  .tablero-nivel3 { background-color: rgba(255, 255, 255, .05) !important; }
  // refina el .bg-light global (surface) a surface-2 para conservar el resalte
  .table tr.bg-light { background-color: var(--dm-surface-2) !important; }
  .tablero-table-container { border-color: var(--dm-border) !important; }
  .tablero-sticky-header {
    background: var(--dm-surface-2) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .45) !important;
  }
  .tablero-data-table thead th { background: var(--dm-surface-2) !important; }

  // ════════════════════════════════════════════════════════
  //  Contabilidad (actas, mayor, plan de cuentas, sumas, libros)
  // ════════════════════════════════════════════════════════
  .taxes-text { color: var(--dm-text) !important; }
  .taxes-date-text { color: var(--dm-muted) !important; }
  .taxes-account-name { color: var(--dm-text) !important; }

  // reportes/mayor — el gradiente violeta #6f42c1→#e83e8c se conserva
  .mayor-reportes-container .modern-input {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .mayor-reportes-container .modern-input:focus { background: var(--dm-surface-2) !important; }
  .mayor-reportes-container .mayor-totales-footer { background: var(--dm-surface-2) !important; }
  .mayor-reportes-container .mayor-totales-footer th {
    background: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
  }
  .mayor-reportes-container .text-success-dark { color: #6ee7b7 !important; }
  .mayor-reportes-container .text-danger-dark { color: #fca5a5 !important; }
  // .bg-light scopeado: el .vue usa "background: linear-gradient(...) !important"
  // (shorthand) y el override central de .bg-light solo pisa background-color.
  .mayor-reportes-container .bg-light { background: var(--dm-surface-2) !important; }

  // plan_de_cuenta/nuevo
  .plan-cuenta-form-container .modern-input {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .plan-cuenta-form-container .modern-input:focus { background: var(--dm-surface-2) !important; }

  // reportes/sumas
  .sumas-saldos-container .modern-input {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .sumas-saldos-container .modern-input:focus { background: var(--dm-surface-2) !important; }
  .sumas-saldos-container .bg-light { background: var(--dm-surface-2) !important; }

  // reportes/libro + libros/diario (comparten .libro-diario-container)
  .libro-diario-container .modern-input {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .libro-diario-container .modern-input:focus { background: var(--dm-surface-2) !important; }
  .libro-diario-container .modern-datepicker {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .libro-diario-container .modern-datepicker:focus { background: var(--dm-surface-2) !important; }
  .libro-diario-container .bg-light { background: var(--dm-surface-2) !important; }

  // libros/iva
  .libro-iva-container .modern-input {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .libro-iva-container .modern-input:focus { background: var(--dm-surface-2) !important; }
  .libro-iva-container .bg-light { background: var(--dm-surface-2) !important; }

  // ════════════════════════════════════════════════════════
  //  RRHH + Sueldos
  // ════════════════════════════════════════════════════════
  // estructura/tab_departamentos
  .tax-dept-toolbar {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .tax-dept-toolbar-info { color: var(--dm-muted) !important; }
  .tax-dept-toolbar-info strong { color: var(--dm-text) !important; }
  .tax-dept-children { border-left-color: var(--dm-border) !important; }
  .tax-dept-children > .tax-dept-node::before { background: var(--dm-border) !important; }
  .tax-dept-row {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    border-left-color: var(--tax-dept-color) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
  }
  .tax-dept-row:hover {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    border-left-color: var(--tax-dept-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45) !important;
  }
  .tax-dept-row.es-raiz {
    background: rgba(37, 99, 235, 0.14) !important;
    border-color: rgba(37, 99, 235, 0.35) !important;
  }
  .tax-dept-row.es-raiz .tax-dept-name { color: #93c5fd !important; }
  .tax-dept-row.es-raiz .tax-dept-icon { color: #38bdf8 !important; background: var(--dm-surface) !important; }
  .tax-dept-row.es-deshabilitado { background: var(--dm-surface-2) !important; }
  .tax-dept-toggle, .tax-dept-toggle-empty { color: var(--dm-muted) !important; }
  .tax-dept-toggle:hover { background: var(--dm-surface-2) !important; color: var(--dm-text) !important; }
  .tax-dept-icon { background: var(--dm-surface-2) !important; color: var(--dm-muted) !important; }
  .tax-dept-name { color: var(--dm-text) !important; }
  .tax-dept-empleados { color: #93c5fd !important; background: rgba(37, 99, 235, 0.15) !important; }
  .tax-dept-empleados.sin-empleados { color: var(--dm-muted) !important; background: var(--dm-surface-2) !important; }
  .tax-dept-resp {
    color: var(--dm-muted) !important;
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }

  // picker de empleados compartido (tab_departamentos + tab_jornadas)
  .tax-emp-lista { background: var(--dm-bg) !important; border-color: var(--dm-border) !important; }
  .tax-emp-item { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
  .tax-emp-item:hover { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .tax-emp-item.asignado { border-left-color: #22c55e !important; }
  .tax-emp-item.disponible.en-otro {
    border-left-color: #f59e0b !important;
    background: rgba(245, 158, 11, 0.12) !important;
  }

  // empleados/control_horario (metric cards scopeadas para no pisar otros metric-card)
  .taxes-tabla-container .metric-card {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-tabla-container .metric-label { color: var(--dm-muted) !important; }
  .taxes-tabla-container .metric-value { color: var(--dm-text) !important; }
  .taxes-tabla-container .metric-extra { color: var(--dm-muted) !important; }
  .taxes-tabla-container .metric-saldo.pos {
    background: rgba(16, 185, 129, 0.14) !important;
    border-color: rgba(16, 185, 129, 0.35) !important;
  }
  .taxes-tabla-container .metric-saldo.pos .metric-value { color: #6ee7b7 !important; }
  .taxes-tabla-container .metric-saldo.neg {
    background: rgba(239, 68, 68, 0.14) !important;
    border-color: rgba(239, 68, 68, 0.35) !important;
  }
  .taxes-tabla-container .metric-saldo.neg .metric-value { color: #fca5a5 !important; }
  .taxes-tabla-container .metric-he {
    background: rgba(37, 99, 235, 0.14) !important;
    border-color: rgba(37, 99, 235, 0.35) !important;
  }
  .taxes-tabla-container .metric-he .metric-value { color: #93c5fd !important; }
  .taxes-tabla-container .metric-asistencia {
    background: rgba(245, 158, 11, 0.12) !important;
    border-color: rgba(245, 158, 11, 0.35) !important;
  }
  .taxes-tabla-container .metric-asistencia .metric-value { color: #fcd34d !important; }
  .ch-grid th {
    background: var(--dm-surface-2) !important;
    color: var(--dm-muted) !important;
    border-color: var(--dm-border) !important;
  }
  .ch-day { border-color: var(--dm-border) !important; background: var(--dm-surface) !important; }
  .ch-day:hover { background: var(--dm-surface-2) !important; }
  .ch-day.ch-empty { background: var(--dm-bg) !important; }
  .ch-day.ch-finde { background: var(--dm-surface-2) !important; }
  .ch-day.ch-state-presente_ok { background: rgba(16, 185, 129, 0.18) !important; }
  .ch-day.ch-state-presente_retraso { background: rgba(245, 158, 11, 0.18) !important; }
  .ch-day.ch-state-presente_he { background: rgba(37, 99, 235, 0.18) !important; }
  .ch-day.ch-state-feriado { background: rgba(239, 68, 68, 0.14) !important; }
  .ch-day.ch-state-feriado_trabajado { background: rgba(249, 115, 22, 0.18) !important; }
  .ch-day.ch-state-ausente_just { background: rgba(99, 102, 241, 0.18) !important; }
  .ch-day.ch-state-ausente_no_just { background: rgba(239, 68, 68, 0.22) !important; }
  .ch-day.ch-state-parcial { background: rgba(245, 158, 11, 0.22) !important; }
  .ch-day.ch-state-no_laboral { background: var(--dm-surface-2) !important; color: var(--dm-muted) !important; }
  .ch-day-num { color: var(--dm-text) !important; }
  .ch-day-min { color: var(--dm-muted) !important; }
  .ch-legend { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }

  // calendarios/tab_calendarios
  .cal-lista .cal-item { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
  .cal-lista .cal-item:hover {
    background: rgba(37, 99, 235, 0.1) !important;
    border-color: rgba(37, 99, 235, 0.35) !important;
  }
  .cal-lista .cal-item.active {
    background: rgba(37, 99, 235, 0.18) !important;
    border-color: #2563eb !important;
  }
  .cal-grid th {
    background: var(--dm-surface-2) !important;
    color: var(--dm-muted) !important;
    border-color: var(--dm-border) !important;
  }
  .cal-day { border-color: var(--dm-border) !important; background: var(--dm-surface) !important; }
  .cal-day:hover { background: var(--dm-surface-2) !important; }
  .cal-day.cal-out { background: var(--dm-bg) !important; color: var(--dm-muted) !important; }
  .cal-day.cal-out:hover { background: var(--dm-bg) !important; }
  .cal-day.cal-finde:not(.cal-excepcion):not(.cal-out) { background: var(--dm-surface-2) !important; }
  .cal-day.cal-hoy { background: rgba(245, 158, 11, 0.16) !important; }
  .cal-day.cal-no-laboral { background: rgba(239, 68, 68, 0.14) !important; }
  .cal-day.cal-laboral-exc { background: rgba(16, 185, 129, 0.16) !important; }
  .cal-day-num { color: var(--dm-text) !important; }
  .cal-out .cal-day-num { color: var(--dm-muted) !important; }
  .empleados-list { border-color: var(--dm-border) !important; background: var(--dm-bg) !important; }
  .empleados-list .empleado-row { border-color: var(--dm-border) !important; }

  // calendarios/tab_jornadas
  .dias-selector .dia-btn {
    border-color: var(--dm-border) !important;
    background: var(--dm-surface) !important;
    color: var(--dm-text) !important;
  }
  .dias-selector .dia-btn:hover { background: var(--dm-surface-2) !important; border-color: #4a5566 !important; }
  .dias-selector .dia-btn.active { background: #2563eb !important; border-color: #2563eb !important; color: #fff !important; }

  // calendarios/tab_empleados_config (grilla matriz)
  .chip-config { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .grilla-wrap { border-color: var(--dm-border) !important; }
  .grilla-matriz thead th { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .grilla-matriz .col-empleado {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    box-shadow: 2px 0 4px rgba(0, 0, 0, 0.35) !important;
  }
  .grilla-matriz thead .col-empleado { background: var(--dm-surface-2) !important; }
  .grilla-matriz .col-dia { color: var(--dm-muted) !important; }
  .grilla-matriz .col-dia.es-finde { background: var(--dm-surface-2) !important; }
  .grilla-matriz .col-dia .dia-label { color: var(--dm-muted) !important; }
  .grilla-matriz tbody tr:nth-child(odd) .col-empleado { background: var(--dm-surface-2) !important; }
  .grilla-matriz tbody tr:hover .col-empleado { background: #2b3340 !important; }
  .celda-dia { border-color: var(--dm-border) !important; }
  .celda-dia.estado-presente_ok,
  .celda-dia.estado-presente_he,
  .celda-dia.estado-feriado_trabajado,
  .celda-dia.estado-laboral_excepcion,
  .celda-dia.estado-laboral_excepcion_he { background: rgba(16, 185, 129, 0.4) !important; }
  .celda-dia.estado-presente_retraso { background: rgba(245, 158, 11, 0.4) !important; }
  .celda-dia.estado-ausente_just { background: rgba(139, 92, 246, 0.4) !important; }
  .celda-dia.estado-ausente_no_just,
  .celda-dia.estado-laboral_excepcion_ausente { background: rgba(239, 68, 68, 0.4) !important; }
  .celda-dia.estado-parcial { background: rgba(249, 115, 22, 0.4) !important; }
  .celda-dia.estado-feriado {
    background: repeating-linear-gradient(45deg, transparent, transparent 4px, var(--dm-border) 4px, var(--dm-border) 5px) var(--dm-surface-2) !important;
  }
  .celda-dia.estado-no_laboral { background: var(--dm-surface-2) !important; }
  .celda-dia.estado-futuro { background: var(--dm-surface) !important; }
  .leyenda { color: var(--dm-muted) !important; }
  .ley-chip { border-color: var(--dm-border) !important; }

  // config/index
  .estado-box { border-color: var(--dm-border) !important; }
  .estado-box.estado-ok {
    background: rgba(16, 185, 129, 0.14) !important;
    border-color: rgba(16, 185, 129, 0.35) !important;
  }
  .estado-box.estado-pendiente {
    background: rgba(245, 158, 11, 0.13) !important;
    border-color: rgba(245, 158, 11, 0.4) !important;
  }
  .estado-box.estado-sin { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .estado-box h5 { color: var(--dm-text) !important; }
  .init-banner { background: rgba(245, 158, 11, 0.14) !important; }
  .init-banner-header h5 { color: #fcd34d !important; }
  .init-banner-list li { color: var(--dm-text) !important; }
  .modulo-row { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .uso-stat { background: rgba(255, 255, 255, 0.06) !important; color: var(--dm-text) !important; }
  .uso-stat strong { color: #6ee7b7 !important; }
  .ayuda-toc { background: var(--dm-surface-2) !important; }
  .ayuda-section { border-color: var(--dm-border) !important; }
  .ayuda-section h4 { color: var(--dm-text) !important; }
  .ayuda-section h4 code { background: var(--dm-surface-2) !important; color: var(--dm-muted) !important; }
  .ayuda-section h6 { color: var(--dm-text) !important; }
  .ayuda-section code { background: var(--dm-surface-2) !important; color: #f472b6 !important; }
  .ayuda-regla { background: rgba(37, 99, 235, 0.12) !important; }
  .ayuda-regla.warning { background: rgba(245, 158, 11, 0.1) !important; }
  .ayuda-regla strong { color: var(--dm-text) !important; }
  .ayuda-footer { border-color: var(--dm-border) !important; }

  // rrhh/index (home del módulo) + _rrhh_gate
  .rrhh-cover-icon { background: rgba(37, 99, 235, 0.15) !important; color: #60a5fa !important; }
  .rrhh-cover-title { color: var(--dm-text) !important; }
  .rrhh-cover-lead { color: var(--dm-muted) !important; }
  .rrhh-cover-features li { border-color: var(--dm-border) !important; color: var(--dm-text) !important; }
  .rrhh-cover-trial { color: var(--dm-muted) !important; }
  .rrhh-modulo-card { border-color: var(--dm-border) !important; }
  .rrhh-modulo-card:hover {
    border-color: #414b5a !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45) !important;
  }
  .rrhh-landing-icon { background: rgba(37, 99, 235, 0.15) !important; color: #60a5fa !important; }
  .rrhh-landing-title { color: var(--dm-text) !important; }
  .rrhh-landing-lead { color: var(--dm-muted) !important; }
  .rrhh-landing-features li { color: var(--dm-text) !important; }
  .rrhh-pendiente h2 { color: #fcd34d !important; }

  // reportes/tab_anomalias + tab_para_liquidar + tab_antiguedades
  .anomalia-chip {
    border-color: var(--dm-border) !important;
    background: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
  }
  .anomalia-chip.chip-ausente_no_just {
    background: rgba(239, 68, 68, 0.15) !important;
    border-color: rgba(239, 68, 68, 0.4) !important;
    color: #fca5a5 !important;
  }
  .anomalia-chip.chip-parcial {
    background: rgba(245, 158, 11, 0.15) !important;
    border-color: rgba(245, 158, 11, 0.4) !important;
    color: #fcd34d !important;
  }
  .anomalia-chip.chip-presente_retraso {
    background: rgba(249, 115, 22, 0.15) !important;
    border-color: rgba(249, 115, 22, 0.4) !important;
    color: #fdba74 !important;
  }
  .fila-alerta { background: rgba(245, 158, 11, 0.1) !important; }
  .bucket-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35) !important;
  }
  .bucket-label { color: var(--dm-muted) !important; }
  .bucket-value { color: var(--dm-text) !important; }

  // sueldo/empleados/biometrico
  .capturas-thumb img { border-color: var(--dm-border) !important; }
  .capturas-thumb span { color: var(--dm-muted) !important; }
  .thumb-quitar { border-color: var(--dm-surface) !important; }
  .enrol-actual-grande {
    background: rgba(16, 185, 129, 0.12) !important;
    border-color: rgba(16, 185, 129, 0.35) !important;
  }
  .enrol-info h4 { color: #6ee7b7 !important; }
  .huella-agente-badge.badge-agente-ok {
    background: rgba(16, 185, 129, 0.15) !important;
    color: #6ee7b7 !important;
    border-color: rgba(16, 185, 129, 0.4) !important;
  }
  .huella-agente-badge.badge-agente-down {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #fca5a5 !important;
    border-color: rgba(239, 68, 68, 0.4) !important;
  }
  .huella-agente-badge.badge-agente-unknown {
    background: var(--dm-surface-2) !important;
    color: var(--dm-muted) !important;
    border-color: var(--dm-border) !important;
  }
  .huella-card { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .huella-card-foto { border-color: var(--dm-border) !important; }
  .huella-card-quitar:hover { background: rgba(239, 68, 68, 0.18) !important; color: #fca5a5 !important; }
  .huella-progress { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .huella-progress-paso {
    border-color: var(--dm-border) !important;
    color: var(--dm-muted) !important;
    background: var(--dm-surface) !important;
  }
  .huella-progress-paso.active { background: #2563eb !important; border-color: #2563eb !important; color: #fff !important; }
  .huella-imagen-preview { border-color: var(--dm-border) !important; }

  // ════════════════════════════════════════════════════════
  //  Empresa (tablero, MercadoLibre, documentos)
  // ════════════════════════════════════════════════════════
  // tablero (complementa los overrides dark propios del componente)
  .tablero-inner-tabs .nav-pills .nav-link { color: var(--dm-muted) !important; }
  .tablero-inner-tabs .nav-pills .nav-link:hover { color: #60a5fa !important; }
  .tablero-inner-tabs .nav-pills .nav-link.active { color: #ffffff !important; }
  .tablero-inner-tabs .card-header { border-color: var(--dm-border) !important; }
  .combo-card { background-color: var(--dm-surface) !important; }
  .combo-select { background-color: var(--dm-surface-2) !important; color: var(--dm-text) !important; }
  .combo-block-title, .combo-stat-label, .combo-cuentas-title { color: var(--dm-muted) !important; }
  .combo-stats { background-color: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .combo-stat-total, .combo-cuentas, .combo-cuenta-row { border-color: var(--dm-border) !important; }
  .combo-stat-value { color: var(--dm-text) !important; }
  .combo-fiscal .combo-stat-value, .combo-cobranza .combo-stat-value { color: #6ee7b7 !important; }
  .combo-no-fiscal .combo-stat-value, .combo-pagos .combo-stat-value { color: #fca5a5 !important; }
  .combo-a-y-b .combo-stat-value { color: #c4b5fd !important; }
  .combo-cuenta-nombre, .combo-cuenta-monto { color: var(--dm-text) !important; }
  .combo-divider {
    background: linear-gradient(90deg, transparent 0%, var(--dm-border) 50%, transparent 100%) !important;
  }
  .taxes-stat-card { background-color: var(--dm-surface) !important; }

  // .modern-tabs es global (~168 vistas): solo texto y hover con tint; NO se
  // pintan fondos de .active para no pisar los gradientes de marca por módulo.
  .modern-tabs .nav-pills .nav-link { color: var(--dm-muted) !important; }
  .modern-tabs .nav-pills .nav-link:hover:not(.active) {
    background-color: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
  }
  .modern-tabs .nav-pills .nav-link.active { color: #ffffff !important; }

  // taxes-tabs-modern (Tesorería: cobranzas/pagos, ctasctes). A diferencia de
  // .modern-tabs, ESTE define fondos claros propios (.nav-pills gray-50 y
  // .tab-content #fff en new_css_2025) que hay que llevar a superficie oscura.
  .taxes-tabs-modern .nav-pills {
    background-color: var(--dm-surface-2) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .taxes-tabs-modern .tab-content { background-color: var(--dm-surface) !important; }
  .taxes-tabs-modern .nav-pills .nav-link { color: var(--dm-muted) !important; }
  .taxes-tabs-modern .nav-pills .nav-link:hover:not(.active) {
    background-color: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
  }
  // .active mantiene el fondo --primary (azul) + texto blanco → OK en dark.

  // mercado_libre (amarillo ML #fff159/#ffe600 conservado)
  .mercadolibre-setup-container .setup-title { color: var(--dm-text) !important; }
  .mercadolibre-setup-container .setup-subtitle { color: var(--dm-muted) !important; }
  .mercadolibre-setup-container .benefit-card { background-color: var(--dm-surface) !important; }
  .mercadolibre-setup-container .benefit-icon-wrapper { background-color: var(--dm-surface-2) !important; }
  .mercadolibre-setup-container .benefit-card h5 { color: var(--dm-text) !important; }
  .mercadolibre-setup-container .benefit-card p { color: var(--dm-muted) !important; }
  .mercadolibre-setup-container .setup-steps-container { background-color: var(--dm-surface) !important; }
  .mercadolibre-setup-container .setup-step:not(:last-child)::after { background: var(--dm-border) !important; }
  .mercadolibre-setup-container .step-number {
    background-color: var(--dm-surface-2) !important;
    color: var(--dm-muted) !important;
  }
  .mercadolibre-setup-container .setup-step.active .step-number {
    background: linear-gradient(135deg, #fff159 0%, #ffe600 100%) !important;
    color: #2d3748 !important;
  }
  .mercadolibre-setup-container .step-content h5 { color: var(--dm-text) !important; }
  .mercadolibre-setup-container .step-content p { color: var(--dm-muted) !important; }
  .mercadolibre-setup-container .important-notes {
    background-color: rgba(37, 99, 235, 0.12) !important;
    border-color: rgba(37, 99, 235, 0.35) !important;
  }
  .mercadolibre-setup-container .important-notes li { color: #93c5fd !important; }

  // documentos/ordenes_de_compra (patrón taxes-* propio)
  .taxes-th { color: var(--dm-text) !important; border-color: var(--dm-border) !important; }
  .taxes-td { border-color: var(--dm-border) !important; }
  .taxes-date-badge, .taxes-numero-badge {
    background-color: rgba(37, 99, 235, 0.15) !important;
    color: #93c5fd !important;
  }
  .taxes-id-badge { background-color: var(--dm-surface-2) !important; color: var(--dm-text) !important; }
  .taxes-cotizacion { color: var(--dm-muted) !important; }
  .taxes-label { color: var(--dm-text) !important; }
  .taxes-form-select { border-color: var(--dm-border) !important; }
  .taxes-form-select:focus { border-color: var(--primary) !important; }

  // ════════════════════════════════════════════════════════
  //  Otros módulos (contactos, impuestos, ppc, padrón AFIP)
  // ════════════════════════════════════════════════════════
  // contactos
  .taxes-client-name { color: var(--dm-text) !important; }
  .taxes-phone-text, .taxes-email-text { color: var(--dm-muted) !important; }
  .formulario-wrapper .section-header {
    background: var(--dm-surface-2) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .formulario-wrapper .section-title,
  .formulario-wrapper .form-label-modern { color: var(--dm-text) !important; }
  .formulario-wrapper .input-compact,
  .formulario-wrapper .textarea-modern {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
  }
  .formulario-wrapper .input-compact:focus,
  .formulario-wrapper .textarea-modern:focus {
    background: var(--dm-surface-2) !important;
    border-color: var(--primary) !important;
  }

  // impuestos
  .tabs:has(.nav-tabs-custom) .tab-content { background-color: var(--dm-surface) !important; }

  // ppc/mostrar_legajos
  .legajos-container .legajo-item { border-bottom-color: var(--dm-border) !important; }
  .legajos-container .legajo-header { background: var(--dm-surface-2) !important; }
  .legajos-container .legajo-toggle-btn:hover { background: var(--dm-border) !important; }
  .legajos-container .legajo-date, .legajos-container .legajo-title { color: var(--dm-text) !important; }
  .legajos-container .legajo-content { background: var(--dm-surface) !important; }
  .legajos-container .content-title { color: var(--dm-text) !important; }
  .legajos-container .description-text { color: var(--dm-muted) !important; }
  .legajos-container .file-item {
    background: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .legajos-container .file-item:hover { background: var(--dm-border) !important; }
  .legajos-container .file-icon, .legajos-container .file-name { color: var(--dm-muted) !important; }
  .legajos-container .file-description { color: var(--dm-text) !important; }

  // data/afip/padron_afip
  .padron-header-card { background: var(--dm-surface) !important; }
  .padron-table th { background: var(--dm-surface-2) !important; color: var(--dm-muted) !important; }
  .padron-table tr { border-bottom-color: var(--dm-border) !important; }

  // ════════════════════════════════════════════════════════
  //  Componentes compartidos (resources/js/components)
  // ════════════════════════════════════════════════════════
  // path_of_file
  .process-results-container { background: var(--dm-surface) !important; }
  .process-results-container .header-section { background: var(--dm-surface) !important; }
  .process-results-container .main-title { color: var(--dm-text) !important; }
  .process-results-container .empty-state { background: var(--dm-surface) !important; }
  .process-results-container .empty-state h4 { color: var(--dm-text) !important; }
  .process-results-container .record-card { background: var(--dm-surface) !important; }
  .process-results-container .card-header {
    background: var(--dm-surface-2) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .process-results-container .id-label { color: var(--dm-muted) !important; }
  .process-results-container .id-value { color: var(--dm-text) !important; }
  .process-results-container .info-icon { color: var(--dm-muted) !important; }
  .process-results-container .info-text { color: var(--dm-text) !important; }
  .process-results-container .card-footer {
    background: var(--dm-surface-2) !important;
    border-top-color: var(--dm-border) !important;
  }
  .process-results-container .error-title { color: #fca5a5 !important; }
  .process-results-container .error-message { color: #fca5a5 !important; }

  // buscador (ComponentBuscador — complementa las reglas genéricas del core)
  .taxes-buscador-container .message-item-compact {
    background: rgba(37, 99, 235, 0.15) !important;
    color: #93c5fd !important;
  }
  .taxes-buscador-container .field-label { color: var(--dm-text) !important; }
  .taxes-buscador-container .tooltip-mini { color: var(--dm-muted) !important; }
  .taxes-buscador-container .input-compact:not(.person-search-wrapper) {
    background-color: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-buscador-container .slot-buttons-bottom { border-top-color: var(--dm-border) !important; }
  .taxes-buscador-container .pagination-modern { border-top-color: var(--dm-border) !important; }
  .taxes-buscador-container .pagination-info-modern { color: var(--dm-muted) !important; }
  .taxes-buscador-container .total-modern { color: var(--dm-text) !important; }
  .taxes-buscador-container .page-btn {
    background: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-buscador-container .page-btn:hover:not(:disabled) {
    background: rgba(37, 99, 235, 0.15) !important;
    border-color: #3b82f6 !important;
    color: #3b82f6 !important;
  }
  .taxes-buscador-container .page-btn:disabled { background: var(--dm-surface) !important; }
  .taxes-buscador-container .page-btn.active {
    background: #3b82f6 !important;
    border-color: #3b82f6 !important;
    color: #fff !important;
  }
  .taxes-buscador-container .page-btn.active:hover { background: #2563eb !important; border-color: #2563eb !important; }
  .taxes-buscador-container .btn-order-dir {
    background: var(--dm-surface-2) !important;
    color: var(--dm-text) !important;
    border-color: var(--dm-border) !important;
  }
  .taxes-buscador-container .btn-order-dir:hover {
    background: rgba(37, 99, 235, 0.15) !important;
    border-color: #3b82f6 !important;
    color: #3b82f6 !important;
  }

  // modal_facturar
  .fce-block { background: var(--dm-surface-2) !important; }
  .fce-block .fce-body { background: var(--dm-surface) !important; }
  .modal-content-wrapper .loading-overlay { background-color: rgba(20, 23, 28, 0.92) !important; }
  .modal-content-wrapper .loading-content p { color: var(--dm-muted) !important; }

  // ChangeCompanyButton
  .companies-list .company-item { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
  .companies-list .company-item:hover { background: var(--dm-surface-2) !important; border-color: #5a8dee !important; }
  .companies-list .company-item.active { background: rgba(37, 99, 235, 0.15) !important; border-color: #5a8dee !important; }
  .companies-list .company-item-name { color: var(--dm-text) !important; }
  .companies-list .company-item-details { color: var(--dm-muted) !important; }
  .companies-list::-webkit-scrollbar-track { background: var(--dm-surface-2) !important; }

  // DatePickerWrapper
  .date-picker-wrapper .mx-input {
    color: var(--dm-text) !important;
    background-color: var(--dm-surface-2) !important;
    border-color: var(--dm-border) !important;
  }
  .date-picker-wrapper .mx-input:focus {
    color: var(--dm-text) !important;
    background-color: var(--dm-surface-2) !important;
    border-color: #80bdff !important;
  }
  .date-picker-wrapper .mx-input:disabled { background-color: var(--dm-surface) !important; }

  // Periods / Persons (inputs con estados searching/disabled propios)
  .period-input.searching { background-color: var(--dm-surface-2) !important; }
  .period-input.disabled { background-color: var(--dm-surface) !important; }
  .person-input.searching { background-color: var(--dm-surface-2) !important; }
  .person-input.disabled { background-color: var(--dm-surface) !important; }

  // Persons/show (modal de detalle de persona)
  .person-show-modal .person-show-footer-slot { background: var(--dm-surface-2) !important; }
  .person-show-modal .ps-section { border-bottom-color: var(--dm-border) !important; }
  .person-show-modal .ps-tabs-section { background: var(--dm-surface-2) !important; }
  .person-show-modal .ps-section-title { color: var(--dm-text) !important; }
  .person-show-modal .ps-label { color: var(--dm-muted) !important; }
  .person-show-modal .ps-value { color: var(--dm-text) !important; }
  .person-show-modal .ps-comment { border-top-color: var(--dm-border) !important; }
  .person-show-modal .ps-empty { color: var(--dm-muted) !important; }
  .person-show-modal .ps-table tbody td { border-bottom-color: var(--dm-border) !important; }
  .person-show-modal .ps-table tbody tr:hover { background: var(--dm-surface-2) !important; }
  .person-show-modal .ps-card { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .person-show-modal .ps-card-title { color: var(--dm-text) !important; }

  // ComponentSendWsEmail
  .whatsapp-form .link-section { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .whatsapp-form .link-input { background-color: var(--dm-surface) !important; color: var(--dm-text) !important; }

  // TagInput
  .tag-container { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .tag-container .tag {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text) !important;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.4) !important;
  }
  .tag-container .tag i { color: var(--dm-muted) !important; }
  .tag-container input { background-color: transparent !important; color: var(--dm-text) !important; }

  // /taxes_admin/servicios (whatsapp.vue): tarjetas KPI con `background:#fff`
  // propio y textos oscuros. Fondo a superficie oscura; se conserva el borde
  // IZQUIERDO de color (accent por métrica) tocando solo top/right/bottom.
  .kpi-card {
    background: var(--dm-surface) !important;
    border-top-color: var(--dm-border) !important;
    border-right-color: var(--dm-border) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .kpi-card .kpi-label { color: var(--dm-muted) !important; }
  .kpi-card .kpi-value { color: var(--dm-text) !important; }
  .kpi-card .kpi-meta  { color: var(--dm-muted) !important; }
  .kpi-alerta { background: rgba(239, 68, 68, .12) !important; }

  // Widget de Videos (VideoWidget.vue): card `background:#fff` + textos oscuros
  // (#22303f/#6b7785/#98a4b0). El thumb/badge/botones ya son de color propio; solo
  // hay que oscurecer la card y aclarar los textos del cuerpo.
  .video-widget-mini {
    background: var(--dm-surface) !important;
    border: 1px solid var(--dm-border) !important;
  }
  .video-widget-titulo { color: var(--dm-text) !important; }
  .video-widget-desc,
  .video-widget-nomas,
  .video-widget-cola { color: var(--dm-muted) !important; }

  // Dropdown "Videos / novedades" del header (VideoMenu.vue): panel #fff +
  // textos oscuros + hover claro. El thumb, badge y "NUEVO" ya son de color propio.
  .video-menu-panel {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .video-menu-header {
    color: var(--dm-text) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .video-menu-titulo { color: var(--dm-text) !important; }
  .video-menu-desc,
  .video-menu-quitar-todos,
  .video-menu-quitar { color: var(--dm-muted) !important; }
  .video-menu-item { border-bottom-color: var(--dm-border) !important; }
  .video-menu-item:hover { background: var(--dm-surface-2) !important; }

  // Modal de estadísticas de popups (notificaciones/popups.vue): tarjetas
  // .stat-card con `background:#fff` + textos oscuros (#1a2235/#6c757d). Fondo a
  // superficie oscura y textos claros/muted; se conserva el borde IZQUIERDO de
  // color (accent primary/info/success/warning) tocando solo top/right/bottom.
  .stat-card {
    background: var(--dm-surface) !important;
    border-top-color: var(--dm-border) !important;
    border-right-color: var(--dm-border) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .stat-card-value { color: var(--dm-text) !important; }
  .stat-card-label,
  .stat-card-extra,
  .serie-fecha { color: var(--dm-muted) !important; }

  // Biblioteca de Media (campanas/media/biblioteca_media.vue): tarjetas de
  // archivo con `background:#fff`, thumb #f1f5f9 y textos oscuros.
  .media-card {
    background: var(--dm-surface) !important;
    border-color: var(--dm-border) !important;
  }
  .media-thumb { background: var(--dm-surface-2) !important; }
  .media-nombre { color: var(--dm-text) !important; }
  .media-meta { color: var(--dm-muted) !important; }

  // Detalle de ticket de Soporte (soporte/componentes/detalle.vue): las burbujas
  // de conversación usan fondos claros INLINE vía `:style` (Vue los normaliza a
  // rgb, así que los selectores [style*=hex] no los agarran). Por eso van por
  // clase: mío → verde dark, otro → surface, nota interna → ámbar dark. El
  // !important gana al inline (que no es !important).
  .soporte-msg-mine { background-color: #005c4b !important; border-color: #0a6b3a !important; }
  .soporte-msg-other { background-color: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .soporte-msg-mine, .soporte-msg-mine *,
  .soporte-msg-other, .soporte-msg-other * { color: var(--dm-text) !important; }
  .soporte-msg-mine .text-muted, .soporte-msg-other .text-muted { color: var(--dm-muted) !important; }
  .soporte-nota { background-color: rgba(245, 158, 11, .16) !important; border-color: #b45309 !important; }
  .soporte-nota, .soporte-nota * { color: #f1e7cf !important; }

  // Landing/gate de WhatsApp (whatsapp/_whatsapp_gate.vue): lista de features y
  // card "Planes y precios" con fondos/textos claros propios y verdes OSCUROS
  // (#166534) que en dark son invisibles → los pasamos a verde claro / superficie
  // oscura. Los acentos verdes (borde plan base, links) se conservan.
  .whatsapp-landing-title,
  .whatsapp-pricing-title,
  .whatsapp-pricing-card-price { color: #4ade80 !important; }
  .whatsapp-landing-lead { color: var(--dm-text) !important; }
  .whatsapp-landing-features li {
    color: var(--dm-text) !important;
    border-bottom-color: var(--dm-border) !important;
  }
  .whatsapp-pricing { background: var(--dm-surface) !important; border-color: var(--dm-border) !important; }
  .whatsapp-pricing-card { background: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; }
  .whatsapp-pricing-card--base { border-color: #22c55e !important; }
  .whatsapp-pricing-card-label,
  .whatsapp-pricing-card-price small,
  .whatsapp-pricing-card-detail,
  .whatsapp-pricing-note { color: var(--dm-muted) !important; }
}
} // fin @media screen
