/* ============================================================
   MAXIMA ERP — Dark Mode Global Overrides
   Cargado DESPUÉS de todos los estilos de componentes para
   que !important aquí gane sobre !important en scoped CSS.
   Paleta: Negro (#111) / Gris oscuro (#1C1C1C / #252525)
   ============================================================ */

/* ─────────────────────────────────────────
   1. UTILIDADES BOOTSTRAP QUE NO CAMBIAN
      automáticamente con data-bs-theme="dark"
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .bg-white {
    background-color: var(--bg-surface) !important;
}
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .bg-body-tertiary {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .text-dark {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .border,
[data-bs-theme="dark"] .border-top,
[data-bs-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-start,
[data-bs-theme="dark"] .border-end {
    border-color: var(--border-color) !important;
}

/* ─────────────────────────────────────────
   2. SCROLLBAR
   ───────────────────────────────────────── */
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #3A3A3A;
}
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #4A4A4A;
}

/* ─────────────────────────────────────────
   3. APP LOADER (inline style no puede
      sobreescribirse con CSS, se maneja con JS)
   ───────────────────────────────────────── */
[data-bs-theme="dark"] #app-loader .text-muted {
    color: var(--text-secondary) !important;
}

/* ─────────────────────────────────────────
   4. LAYOUT PRINCIPAL (MainLayout)
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .page {
    background-color: var(--bg-body) !important;
}
[data-bs-theme="dark"] .header-bar {
    background-color: var(--bg-surface) !important;
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .sidebar {
    background-color: var(--bg-surface) !important;
    border-right-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .main-content-area {
    background-color: var(--bg-body) !important;
}

/* ─────────────────────────────────────────
   5. CONTENEDORES DASHBOARD (Products, Home, Users)
      Estos tienen background-color: #ffffff hardcodeado
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .dashboard-container {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}

/* ─────────────────────────────────────────
   6. TARJETAS / CARDS
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .white-card {
    background-color: var(--bg-surface) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .dark-card {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .card-body {
    background-color: var(--bg-surface) !important;
}

/* ─────────────────────────────────────────
   7. TIPOGRAFÍA
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .card-title-dark {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .section-title-thin {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .section-header {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .stat-label {
    color: var(--text-secondary) !important;
}

/* ─────────────────────────────────────────
   8. TABLAS
      thead tiene !important hardcodeado en scoped CSS.
      Este archivo carga después, así que gana.
   ───────────────────────────────────────── */
[data-bs-theme="dark"] thead,
[data-bs-theme="dark"] thead th {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .custom-table th {
    background-color: var(--bg-elevated) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .table-hover tbody tr:hover,
[data-bs-theme="dark"] .table tbody tr:hover {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .table td,
[data-bs-theme="dark"] .table th {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.03) !important;
}

/* ─────────────────────────────────────────
   9. FORMULARIOS E INPUTS
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .bg-gray-input {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .filter-input {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .role-select {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background-color: var(--bg-elevated) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(99, 102, 241, 0.25) !important;
}
[data-bs-theme="dark"] .form-control::placeholder {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .input-group-text {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

/* ─────────────────────────────────────────
   10. SEARCH CONTAINER
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .search-container {
    border-color: var(--border-color) !important;
    background-color: var(--bg-elevated) !important;
}

/* ─────────────────────────────────────────
   11. PANEL DE ALERTAS (Products.razor)
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .alert-item-row {
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .alert-text {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .btn-manage-pill {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .btn-manage-pill:hover {
    background-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .section-header-dark {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}

/* ─────────────────────────────────────────
   12. TASK CENTER / HOME (TaskCenter.razor)
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .task-item:hover {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .task-item.active-task {
    background-color: rgba(79, 70, 229, 0.15) !important;
    border-left-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .chat-area {
    background-color: var(--bg-surface) !important;
}

/* ─────────────────────────────────────────
   13. AVATARS
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .avatar-circle {
    background-color: var(--primary-light) !important;
    border-color: var(--border-color) !important;
}

/* ─────────────────────────────────────────
   14. BOTONES
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .btn-light {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-outline-secondary {
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .btn-icon-circle:hover {
    background-color: var(--bg-elevated) !important;
}

/* ─────────────────────────────────────────
   15. MODALES
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .modal-header {
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .modal-footer {
    border-top-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .offcanvas {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .offcanvas-header {
    border-bottom-color: var(--border-color) !important;
}

/* ─────────────────────────────────────────
   16. DROPDOWNS
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .dropdown-item {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .dropdown-divider {
    border-color: var(--border-color) !important;
}

/* ─────────────────────────────────────────
   17. LISTAS Y NAV
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .list-group-item {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .list-group-item:hover {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .nav-tabs {
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) var(--border-color) var(--bg-surface) !important;
    color: var(--text-primary) !important;
}

/* ─────────────────────────────────────────
   18. BADGES Y STATUS PILLS
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .badge.bg-light {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}

/* ─────────────────────────────────────────
   19. SEPARADORES (hr, border-secondary)
   ───────────────────────────────────────── */
[data-bs-theme="dark"] hr {
    border-color: var(--border-color) !important;
    opacity: 1 !important;
}

/* ─────────────────────────────────────────
   20. TRANSICIÓN SUAVE AL CAMBIAR TEMA
   ───────────────────────────────────────── */
html {
    transition: background-color var(--transition-base), color var(--transition-base);
}
body,
.sidebar,
.header-bar,
.card,
.white-card,
.modal-content,
.form-control,
.form-select,
.dashboard-container {
    transition: background-color var(--transition-base),
                color var(--transition-base),
                border-color var(--transition-base);
}

/* ─────────────────────────────────────────
   21. DASHBOARDS BENTO (Ventas, Compras, Almacen)
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .ventas-dashboard,
[data-bs-theme="dark"] .compras-dashboard,
[data-bs-theme="dark"] .almacen-dashboard {
    background-color: var(--bg-body) !important;
}
[data-bs-theme="dark"] .bento-cell {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: var(--shadow-sm) !important;
}
[data-bs-theme="dark"] .stats-row {
    background: transparent !important;
}
[data-bs-theme="dark"] .stat-card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--shadow-sm) !important;
}
[data-bs-theme="dark"] .stat-value {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .cell-title {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .metric-val {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .metric-lbl,
[data-bs-theme="dark"] .bar-pct,
[data-bs-theme="dark"] .qa-divider ~ .qa-label {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .storage-metric {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .bar-label-h {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .bar-track {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .trend-axis {
    color: var(--text-secondary) !important;
    border-top-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .btn-cell-outline {
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    background: transparent !important;
}
[data-bs-theme="dark"] .btn-cell-outline:hover {
    background-color: var(--bg-elevated) !important;
    border-color: var(--text-secondary) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .bento-cell.admin-tools {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .admin-btn {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: var(--shadow-sm) !important;
}
[data-bs-theme="dark"] .admin-btn:hover {
    background-color: var(--border-color) !important;
    border-color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .admin-label {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .admin-divider {
    background: var(--border-color) !important;
}
[data-bs-theme="dark"] .admin-btn-title {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .admin-btn-sub {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .btn-action-dark {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-action-success {
    background: rgba(52, 211, 153, 0.12) !important;
    color: #34d399 !important;
}
[data-bs-theme="dark"] .btn-action-teal {
    background: rgba(56, 189, 248, 0.12) !important;
    color: #38bdf8 !important;
}
[data-bs-theme="dark"] .btn-action-purple {
    background: rgba(167, 139, 250, 0.12) !important;
    color: #a78bfa !important;
}
[data-bs-theme="dark"] .channel-row .progress {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .accent-blue .stat-icon  { background: rgba(59, 130, 246, 0.15) !important; }
[data-bs-theme="dark"] .accent-green .stat-icon { background: rgba(16, 185, 129, 0.15) !important; }
[data-bs-theme="dark"] .accent-purple .stat-icon{ background: rgba(139, 92, 246, 0.15) !important; }
[data-bs-theme="dark"] .accent-orange .stat-icon{ background: rgba(245, 158, 11, 0.15) !important; }
[data-bs-theme="dark"] .badge-up      { background: rgba(21, 128, 61, 0.2) !important; color: #4ade80 !important; }
[data-bs-theme="dark"] .badge-down    { background: rgba(220, 38, 38, 0.2) !important; color: #f87171 !important; }
[data-bs-theme="dark"] .badge-neutral { background: var(--bg-elevated) !important; color: var(--text-secondary) !important; }
[data-bs-theme="dark"] .icon-green  { background: rgba(16, 185, 129, 0.15) !important; }
[data-bs-theme="dark"] .icon-blue   { background: rgba(59, 130, 246, 0.15) !important; }
[data-bs-theme="dark"] .icon-teal   { background: rgba(3, 105, 161, 0.15) !important; }
[data-bs-theme="dark"] .icon-purple { background: rgba(124, 58, 237, 0.15) !important; }

/* ─────────────────────────────────────────
   22. VENTAS MODULE — NAV COMPARTIDA
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .sells-container,
[data-bs-theme="dark"] .ventas-reg-container {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .sells-container .page-title,
[data-bs-theme="dark"] .ventas-reg-container .page-title {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-back-dash {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-back-dash:hover {
    background-color: var(--border-color) !important;
    border-color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .breadcrumb-current {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .flow-hint {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .formtab-tabs {
    border-bottom-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .tab-btn {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .tab-btn:hover {
    color: var(--text-primary) !important;
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .tab-btn.active {
    color: var(--text-primary) !important;
    border-bottom-color: var(--primary-color) !important;
}

/* ─────────────────────────────────────────
   23. VENTAS REGISTRO — FORMULARIO
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .reg-form-card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--shadow-sm) !important;
}
[data-bs-theme="dark"] .field-label {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .dark-label {
    background-color: var(--bg-body) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .field-input {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .field-input:focus {
    background-color: var(--bg-surface) !important;
    border-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .fifo-panel {
    background-color: rgba(52, 211, 153, 0.06) !important;
    border-color: rgba(52, 211, 153, 0.25) !important;
    border-left-color: #34d399 !important;
}
[data-bs-theme="dark"] .fifo-label {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .fifo-val {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .reg-actions {
    border-top-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .btn-cancel {
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    background: transparent !important;
}
[data-bs-theme="dark"] .btn-cancel:hover {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-save {
    background-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .btn-save:hover {
    background-color: var(--primary-hover) !important;
}

/* ─────────────────────────────────────────
   24. FBA MANAGEMENT / REAL RESULTS
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .dashboard-card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .kpi-card {
    border-left-color: var(--primary-color) !important;
    background-color: var(--bg-surface) !important;
}
[data-bs-theme="dark"] .master-row:hover {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .details-panel {
    border-left-color: var(--border-color) !important;
}

/* ─────────────────────────────────────────
   25. HISTORICAL IMPORT
   ───────────────────────────────────────── */
[data-bs-theme="dark"] .drag-drop-area:hover {
    background-color: var(--bg-elevated) !important;
    border-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .hover-primary:hover {
    color: var(--primary-color) !important;
}

/* ─────────────────────────────────────────
   26. STORAGE MODULE — Arriving / KittingProcess / Labels_Print
   ───────────────────────────────────────── */

/* Contenedores principales */
[data-bs-theme="dark"] .arriving-container,
[data-bs-theme="dark"] .kitting-container {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .arriving-container .page-title,
[data-bs-theme="dark"] .kitting-container .page-title {
    color: var(--text-primary) !important;
}

/* Cards principales */
[data-bs-theme="dark"] .arriving-card,
[data-bs-theme="dark"] .kitting-card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--shadow-sm) !important;
}

/* Sidebars internos de ventanas */
[data-bs-theme="dark"] .arriving-sidebar,
[data-bs-theme="dark"] .kitting-sidebar,
[data-bs-theme="dark"] .labels-sidebar {
    background-color: var(--bg-elevated) !important;
    border-right-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .sidebar-btn {
    color: var(--text-primary) !important;
    border-bottom-color: var(--border-color) !important;
    background-color: transparent !important;
}
[data-bs-theme="dark"] .sidebar-btn:hover {
    background-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .sidebar-btn.active {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .sidebar-btn.active:hover {
    background-color: var(--bg-body) !important;
}
[data-bs-theme="dark"] .sidebar-module-label {
    color: var(--text-secondary) !important;
    border-bottom-color: var(--border-color) !important;
}

/* ── Arriving: filas de formulario ── */
[data-bs-theme="dark"] .form-row {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .light-label {
    background-color: transparent !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .arriving-container .dark-label {
    background-color: var(--bg-body) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .minimal-input {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .package-area {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .package-image {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .package-info-box {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-next {
    background-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .btn-next:hover {
    background-color: var(--primary-hover) !important;
}

/* ── KittingProcess: controles y tabla ── */
[data-bs-theme="dark"] .form-group-custom {
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .label-box {
    background-color: var(--bg-body) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .input-box {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .input-box:focus {
    background-color: var(--bg-surface) !important;
}
[data-bs-theme="dark"] .kitting-table {
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .kitting-table th {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .kitting-table td {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .btn-dark-action {
    background-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .btn-dark-action:hover {
    background-color: var(--primary-hover) !important;
}

/* ── Toggle switch (Arriving + KittingProcess) ── */
[data-bs-theme="dark"] .slider {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] input:checked + .slider {
    background-color: var(--primary-color) !important;
}

/* ── Labels_Print: fondos split ── */
[data-bs-theme="dark"] .labels-background-top {
    background-color: var(--bg-body) !important;
}
[data-bs-theme="dark"] .labels-background-bottom {
    background-color: var(--bg-surface) !important;
}
[data-bs-theme="dark"] .labels-content-layer .page-title {
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .labels-card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .labels-table {
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .labels-table th {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .labels-table td {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .scan-area {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--shadow-sm) !important;
}
[data-bs-theme="dark"] .scan-input-wrapper {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .scan-input-box {
    background-color: var(--bg-elevated) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .scan-right {
    background-color: var(--bg-elevated) !important;
}
[data-bs-theme="dark"] .detection-header {
    border-bottom-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .d-label {
    color: var(--text-secondary) !important;
}
[data-bs-theme="dark"] .config-card {
    background-color: var(--bg-surface) !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--shadow-sm) !important;
}
[data-bs-theme="dark"] .config-left {
    border-right-color: var(--border-color) !important;
}
[data-bs-theme="dark"] .generic-input,
[data-bs-theme="dark"] .hollow-input {
    background-color: var(--bg-elevated) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}
[data-bs-theme="dark"] .generic-btn-dark,
[data-bs-theme="dark"] .btn-imprimir,
[data-bs-theme="dark"] .btn-siguiente {
    background-color: var(--primary-color) !important;
}
[data-bs-theme="dark"] .tag-storage {
    background: rgba(3, 105, 161, 0.15) !important;
    color: #38bdf8 !important;
}