/* Canalium theme tokens — light (default) and dark via html[data-theme="dark"] */

:root {
    --color-bg: #f8f9fa;
    --color-surface: #ffffff;
    --color-surface-elevated: #ffffff;
    --color-text: #212529;
    --color-text-secondary: #333333;
    --color-text-muted: #666666;
    --color-border: #e1e5e9;
    --color-border-light: #e8edf3;
    --color-primary: #1b68d8;
    --color-primary-dark: #2a5298;
    --color-primary-hover: #1859c0;
    --color-primary-light: #eaf2ff;
    --color-primary-subtle: #f0f5ff;
    --color-accent-pink: #e85aa8;
    --color-accent-teal: #4ab8a6;
    --color-gradient: linear-gradient(135deg, #1b68d8 0%, #2a5298 100%);
    --color-shadow: rgba(0, 0, 0, 0.1);
    --color-shadow-strong: rgba(0, 0, 0, 0.3);
    --color-input-bg: #ffffff;
    --color-input-border: #e1e5e9;
    --color-hover-bg: #f0f5ff;
    --color-navbar-bg: #ffffff;
    --color-sidebar-bg: #ffffff;
    --color-nav-text: #2d3748;
    --color-modal-overlay: rgba(0, 0, 0, 0.5);
    --color-scrollbar-thumb: #c8d0da;
    --color-scrollbar-track: transparent;
    --color-table-stripe: #f8f9fa;
    --color-table-hover: #f0f6ff;
    --color-warning-bg: #fff3cd;
    --color-autocomplete-hover: #f0f6ff;
    --color-i18n-overlay: rgba(248, 249, 250, 0.92);
}

[data-theme="dark"] {
    color-scheme: dark;

    /* Base — pila slate-navy (más oscura y uniforme) */
    --color-bg: #080c12;
    --color-surface: #0f141c;
    --color-surface-elevated: #161e2a;
    --color-input-bg: #121a26;

    /* Texto — grises fríos suaves */
    --color-text: #d4dae3;
    --color-text-secondary: #a8b2c0;
    --color-text-muted: #6e7a8a;

    /* Bordes — gris azulado sutil */
    --color-border: #222d3d;
    --color-border-light: #1a2330;
    --color-input-border: #2a3848;

    /* Marca — azul menos neón, armonizado con el fondo */
    --color-primary: #4a8fd4;
    --color-primary-dark: #3a7ab8;
    --color-primary-hover: #5da0e0;
    --color-primary-light: #152535;
    --color-primary-subtle: #121f30;

    /* Acentos — desaturados para convivir con la base */
    --color-accent-pink: #c46894;
    --color-accent-teal: #449a8c;

    /* Superficies y layout */
    --color-gradient: linear-gradient(145deg, #0a1220 0%, #060a10 55%, #04070c 100%);
    --color-hover-bg: #1a2433;
    --color-navbar-bg: #0c1018;
    --color-sidebar-bg: #0c1018;
    --color-nav-text: #b4beca;

    /* Efectos */
    --color-shadow: rgba(0, 0, 0, 0.5);
    --color-shadow-strong: rgba(0, 0, 0, 0.72);
    --color-modal-overlay: rgba(4, 8, 14, 0.85);

    /* Tablas y misc */
    --color-scrollbar-thumb: #344152;
    --color-scrollbar-track: #080c12;
    --color-table-stripe: #0d121a;
    --color-table-hover: #1a2433;
    --color-warning-bg: #241e14;
    --color-autocomplete-hover: #1a2433;
    --color-i18n-overlay: rgba(8, 12, 18, 0.94);
}

/* Armonía global en dark mode */
[data-theme="dark"] body {
    background: var(--color-gradient);
    color: var(--color-text);
}

[data-theme="dark"] .dashboard,
[data-theme="dark"] .main-content,
[data-theme="dark"] .app-with-sidebar {
    background: var(--color-bg);
}

[data-theme="dark"] .navbar {
    background: var(--color-navbar-bg);
    border-bottom: 1px solid var(--color-border-light);
    box-shadow: none;
}

[data-theme="dark"] .left-sidebar {
    background: var(--color-sidebar-bg);
    box-shadow: 2px 0 16px rgba(0, 0, 0, 0.45);
    border-right: 1px solid var(--color-border-light);
}

[data-theme="dark"] .sidebar-header {
    background: var(--color-sidebar-bg);
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border-light);
}

[data-theme="dark"] .sidebar-header:hover {
    background: var(--color-hover-bg);
}

[data-theme="dark"] .sidebar-header:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: -2px;
}

[data-theme="dark"] .sidebar-title {
    color: var(--color-primary);
}

[data-theme="dark"] .sidebar-header-logo {
    background: var(--color-primary-light);
}

[data-theme="dark"] .sidebar-header:hover .sidebar-header-logo {
    background: var(--color-hover-bg);
}

[data-theme="dark"] .sidebar-divider {
    background: var(--color-border-light);
}

[data-theme="dark"] .sidebar-nav-item:hover {
    background: var(--color-hover-bg);
    color: var(--color-primary);
}

[data-theme="dark"] .sidebar-icon {
    background: var(--color-primary-light);
    color: var(--color-primary);
}

[data-theme="dark"] .login-container {
    background: var(--color-surface);
    box-shadow: 0 24px 48px var(--color-shadow-strong);
    border: 1px solid var(--color-border-light);
}

[data-theme="dark"] .login-container h1 {
    color: var(--color-primary);
}

[data-theme="dark"] .contacts-header {
    background: var(--color-surface);
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border-light);
}

[data-theme="dark"] .contacts-header h3 {
    color: var(--color-text);
}

[data-theme="dark"] .conversations-container > .conversations-header {
    background: var(--color-surface);
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border-light);
}

[data-theme="dark"] .conversations-container > .conversations-header h3 {
    color: var(--color-text);
}

[data-theme="dark"] .conversations-list .conversations-header {
    background: var(--color-surface);
    color: var(--color-text);
}

[data-theme="dark"] .stat-card,
[data-theme="dark"] .feature-card {
    border: 1px solid var(--color-border-light);
    box-shadow: 0 2px 8px var(--color-shadow);
}

[data-theme="dark"] .admin-panel,
[data-theme="dark"] .conversations-container {
    border: 1px solid var(--color-border-light);
}

[data-theme="dark"] .contact-card,
[data-theme="dark"] .call-card,
[data-theme="dark"] .dialer-card {
    border: 1px solid var(--color-border-light);
    box-shadow: 0 2px 8px var(--color-shadow);
}

[data-theme="dark"] .tab.active {
    background: var(--color-bg);
}

[data-theme="dark"] .tab:hover {
    background: var(--color-hover-bg);
}

[data-theme="dark"] .chat-messages {
    background: var(--color-bg);
}

[data-theme="dark"] .message.client .message-content {
    background: var(--color-surface-elevated);
    border-color: var(--color-border);
}

[data-theme="dark"] .dialpad-btn {
    background: var(--color-input-bg);
    border-color: var(--color-border);
}

[data-theme="dark"] .dialpad-btn:hover {
    background: var(--color-hover-bg);
    border-color: var(--color-border);
}

[data-theme="dark"] .theme-toggle-btn {
    background: var(--color-input-bg);
    border-color: var(--color-border);
    color: var(--color-text-muted);
}

[data-theme="dark"] .theme-toggle-btn:hover {
    background: var(--color-hover-bg);
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.theme-toggle-btn--login {
    position: absolute;
    top: 12px;
    right: 12px;
}

.login-container {
    position: relative;
}

/* Theme toggle button */
.theme-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--color-border);
    border-radius: 5px;
    background: var(--color-surface);
    color: var(--color-text-muted);
    cursor: pointer;
    font-size: 0.95rem;
    line-height: 1;
    transition: background 0.2s, border-color 0.2s, color 0.2s;
    flex-shrink: 0;
}

.theme-toggle-btn:hover {
    background: var(--color-hover-bg);
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.theme-toggle-btn:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.theme-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.theme-icon--dark {
    display: none;
}

[data-theme="dark"] .theme-icon--light {
    display: none;
}

[data-theme="dark"] .theme-icon--dark {
    display: inline-flex;
}

/* Dark overrides for components still using hardcoded light colors */
[data-theme="dark"] .stat-card,
[data-theme="dark"] .feature-card,
[data-theme="dark"] .admin-panel,
[data-theme="dark"] .panel-section,
[data-theme="dark"] .data-table-container,
[data-theme="dark"] .contacts-table-container,
[data-theme="dark"] .filter-panel,
[data-theme="dark"] .config-section,
[data-theme="dark"] .card,
[data-theme="dark"] .bot-card,
[data-theme="dark"] .report-card {
    background: var(--color-surface) !important;
    color: var(--color-text);
    box-shadow: 0 2px 10px var(--color-shadow);
}

[data-theme="dark"] .feature-card h3,
[data-theme="dark"] .stat-number,
[data-theme="dark"] .navbar-brand h2,
[data-theme="dark"] .navbar-brand-text {
    color: var(--color-primary);
}

[data-theme="dark"] .stat-label,
[data-theme="dark"] .feature-card p {
    color: var(--color-text-muted);
}

[data-theme="dark"] table,
[data-theme="dark"] .table {
    color: var(--color-text);
}

[data-theme="dark"] table thead th,
[data-theme="dark"] .table thead th {
    background: var(--color-surface-elevated);
    color: var(--color-text);
    border-color: var(--color-border);
}

[data-theme="dark"] table tbody tr,
[data-theme="dark"] .table tbody tr {
    border-color: var(--color-border);
}

[data-theme="dark"] table tbody tr:nth-child(even),
[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
    background: var(--color-table-stripe);
}

[data-theme="dark"] table tbody tr:hover,
[data-theme="dark"] .table-hover tbody tr:hover {
    background: var(--color-table-hover);
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="dark"] .form-control {
    background: var(--color-input-bg);
    color: var(--color-text);
    border-color: var(--color-input-border);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--color-text-muted);
}

[data-theme="dark"] .conversations-tv-grid .tv-column,
[data-theme="dark"] .conversations-tv-grid .tv-column-body,
[data-theme="dark"] .conversations-container {
    background: var(--color-surface);
    color: var(--color-text);
}

[data-theme="dark"] .conversations-tv-grid .tv-empty-column {
    color: var(--color-text-muted);
}

[data-theme="dark"] .modal-content {
    background: var(--color-surface) !important;
    color: var(--color-text);
    border: 1px solid var(--color-border-light);
    box-shadow: 0 16px 40px var(--color-shadow-strong);
}

[data-theme="dark"] .modal-actions,
[data-theme="dark"] .modal-actions--start-chat {
    background: var(--color-surface-elevated) !important;
    border-color: var(--color-border-light);
}

[data-theme="dark"] .modal .form-group label {
    color: var(--color-text-secondary);
}

[data-theme="dark"] .modal .form-group input,
[data-theme="dark"] .modal .form-group textarea {
    background: var(--color-input-bg);
    border-color: var(--color-input-border);
    color: var(--color-text);
}

[data-theme="dark"] .i18n-loading-content {
    background: var(--color-surface);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .close-modal {
    color: var(--color-text-muted);
}

[data-theme="dark"] .main-content h1,
[data-theme="dark"] .main-content h2,
[data-theme="dark"] .main-content h3,
[data-theme="dark"] .main-content h4,
[data-theme="dark"] .admin-panel h2,
[data-theme="dark"] .admin-panel h3 {
    color: var(--color-text);
}

[data-theme="dark"] .search-box input,
[data-theme="dark"] .filter-input {
    background: var(--color-input-bg);
    color: var(--color-text);
    border-color: var(--color-input-border);
}

/* Agent panel */
[data-theme="dark"] .main-interface {
    background: var(--color-bg);
}

[data-theme="dark"] .main-header {
    background: var(--color-navbar-bg);
    border-bottom-color: var(--color-border);
}

[data-theme="dark"] .tabs-container {
    background: var(--color-surface);
    border-bottom-color: var(--color-border);
}

[data-theme="dark"] .tab {
    color: var(--color-text-muted);
}

[data-theme="dark"] .tab.active {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}

[data-theme="dark"] .conversations-list,
[data-theme="dark"] .chat-sidebar,
[data-theme="dark"] .conversation-list,
[data-theme="dark"] .chat-main,
[data-theme="dark"] .chat-input,
[data-theme="dark"] .chat-input-area {
    background: var(--color-surface);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .text-muted,
[data-theme="dark"] small {
    color: var(--color-text-muted);
}

[data-theme="dark"] .conversation-item.active {
    background: var(--color-primary-subtle);
    border-left-color: var(--color-primary);
    box-shadow: inset 0 0 0 1px var(--color-border-light);
}

[data-theme="dark"] .conversation-item.active .conversation-name {
    color: var(--color-primary-hover);
}

[data-theme="dark"] .conversation-item {
    border-bottom-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .conversation-item:hover {
    background: var(--color-hover-bg);
}

[data-theme="dark"] .chat-messages {
    background: var(--color-bg);
}

[data-theme="dark"] .conversations-tv-grid {
    background: var(--color-bg);
}

[data-theme="dark"] .conversations-tv-grid .tv-column {
    border: 1px solid var(--color-border-light);
    box-shadow: 0 2px 10px var(--color-shadow);
}

[data-theme="dark"] .conversations-tv-grid .tv-column-header {
    background: var(--color-surface-elevated);
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border-light);
}

[data-theme="dark"] .conversations-tv-grid .tv-column--queue .tv-column-header {
    background: var(--color-surface-elevated);
    color: var(--color-text);
}

[data-theme="dark"] .admin-panel .conversations-tv-grid .tv-column-header h2,
[data-theme="dark"] .admin-panel .conversations-tv-grid .tv-column-header h2 span {
    color: var(--color-text);
}

[data-theme="dark"] .conversations-container > .conversations-header h3 {
    color: var(--color-text);
}

[data-theme="dark"] .conversations-container > .conversations-header h3 i {
    color: var(--color-primary);
    opacity: 0.8;
}

[data-theme="dark"] .conversations-tabs .conv-tab.active {
    box-shadow: inset 0 0 0 1px var(--color-border-light);
}

[data-theme="dark"] .conversations-actions .form-control {
    background: var(--color-input-bg);
    border-color: var(--color-border-light);
    color: var(--color-text);
}

[data-theme="dark"] .conversations-actions .form-control::placeholder {
    color: var(--color-text-muted);
}

[data-theme="dark"] .conversations-tabs {
    background: var(--color-surface);
    border-bottom-color: var(--color-border-light);
}

[data-theme="dark"] .conversations-actions .btn-conversations-history,
[data-theme="dark"] .conversations-actions .btn-conversations-refresh {
    background: var(--color-input-bg);
    border-color: var(--color-border-light);
    color: var(--color-text-muted);
}

[data-theme="dark"] .conversations-actions .btn-conversations-history:hover,
[data-theme="dark"] .conversations-actions .btn-conversations-refresh:hover {
    background: var(--color-hover-bg);
    color: var(--color-text);
}

[data-theme="dark"] .conversations-actions .btn-conversations-history i {
    color: var(--color-accent-pink);
    opacity: 0.75;
}

[data-theme="dark"] .conversations-actions .btn-conversations-refresh i {
    color: var(--color-primary);
    opacity: 0.75;
}

[data-theme="dark"] .calls-interface,
[data-theme="dark"] .contacts-interface {
    background: var(--color-bg);
}

[data-theme="dark"] .call-card,
[data-theme="dark"] .dialer-card,
[data-theme="dark"] .contacts-container,
[data-theme="dark"] .contact-card,
[data-theme="dark"] .contacts-list-container {
    background: var(--color-surface);
    color: var(--color-text);
}

[data-theme="dark"] .contacts-search {
    background: var(--color-bg);
}

[data-theme="dark"] .call-header h3,
[data-theme="dark"] .contact-name {
    color: var(--color-text);
}

[data-theme="dark"] .notifications-permission-banner {
    background: linear-gradient(90deg, #121c2e 0%, #1a1528 100%);
    border-bottom-color: var(--color-border);
    color: var(--color-text-secondary);
}

[data-theme="dark"] .notifications-btn {
    background: var(--color-primary-light);
    color: var(--color-primary);
    border-color: var(--color-border);
}

[data-theme="dark"] #sip-status-container {
    background: var(--color-input-bg) !important;
    border: 1px solid var(--color-border-light);
}

[data-theme="dark"] #sip-status-text {
    color: var(--color-text-muted) !important;
}

[data-theme="dark"] .bots-body,
[data-theme="dark"] .bots-body .dashboard {
    background: var(--color-bg) !important;
}

[data-theme="dark"] .app-loading-text {
    color: var(--color-text-secondary);
}

[data-theme="dark"] .app-loading-screen {
    background: var(--color-bg);
}

[data-theme="dark"] .app-with-sidebar {
    background: var(--color-bg);
}

/* Bootstrap en dark — tonos acordes */
[data-theme="dark"] .dropdown-menu {
    background: var(--color-surface-elevated);
    border-color: var(--color-border);
    box-shadow: 0 8px 24px var(--color-shadow-strong);
}

[data-theme="dark"] .dropdown-item {
    color: var(--color-text);
}

[data-theme="dark"] .dropdown-item:hover,
[data-theme="dark"] .dropdown-item:focus {
    background: var(--color-hover-bg);
    color: var(--color-text);
}

[data-theme="dark"] .dropdown-divider {
    border-color: var(--color-border-light);
}

[data-theme="dark"] .actions-menu .dropdown-item {
    color: var(--color-text) !important;
}

[data-theme="dark"] .actions-menu .dropdown-item:hover {
    background: var(--color-hover-bg) !important;
    color: var(--color-text) !important;
}

/* Scrollbar (webkit) */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--color-scrollbar-thumb);
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--color-scrollbar-track);
}

/* ===== Vistas restantes: admin, usuarios, config, historial, bots, reportes ===== */

[data-theme="dark"] .admin-card .admin-btn,
[data-theme="dark"] .admin-grid .card {
    background: var(--color-surface) !important;
    border: 1px solid var(--color-border-light);
    color: var(--color-text);
}

[data-theme="dark"] .users-manager-section,
[data-theme="dark"] .users-manager-section .users-manager-container,
[data-theme="dark"] .users-manager-section .user-card,
[data-theme="dark"] .users-list-container,
[data-theme="dark"] .companies-manager-section .users-manager-container,
[data-theme="dark"] .agents-manager-section,
[data-theme="dark"] .agents-manager-section .agents-manager-container,
[data-theme="dark"] .agents-manager-section .agent-card,
[data-theme="dark"] .agents-manager-section .agents-list-container {
    background: var(--color-surface) !important;
    color: var(--color-text);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .users-manager-section .users-search,
[data-theme="dark"] .users-manager-section .users-grid,
[data-theme="dark"] .agents-manager-section .agents-search,
[data-theme="dark"] .agents-manager-section .agents-grid,
[data-theme="dark"] .agents-manager-section .agents-list-container {
    background: var(--color-bg) !important;
}

[data-theme="dark"] .agents-manager-section .agents-header,
[data-theme="dark"] .users-manager-section .users-header {
    background: var(--color-surface-elevated);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .agents-manager-section .agents-header h3,
[data-theme="dark"] .agents-manager-section .agent-name,
[data-theme="dark"] .users-manager-section .users-header h3,
[data-theme="dark"] .users-manager-section .user-name {
    color: var(--color-text);
}

[data-theme="dark"] .agents-manager-section .agent-email,
[data-theme="dark"] .agents-manager-section .agent-department,
[data-theme="dark"] .agents-manager-section .agent-conversations,
[data-theme="dark"] .users-manager-section .user-email,
[data-theme="dark"] .users-manager-section .user-phone,
[data-theme="dark"] .users-manager-section .user-company {
    color: var(--color-text-muted);
}

[data-theme="dark"] .agents-manager-section .agents-search input,
[data-theme="dark"] .users-manager-section .users-search input {
    background: var(--color-input-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .view-toggle-btn {
    background: var(--color-input-bg);
    border-color: var(--color-border);
    color: var(--color-text-muted);
}

[data-theme="dark"] .view-toggle-btn--active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
}

[data-theme="dark"] .bots-no-match-box {
    background: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .bots-no-match-box label {
    color: var(--color-text);
}

[data-theme="dark"] .bots-no-match-help {
    color: var(--color-text-muted);
}

[data-theme="dark"] .agents-list-table,
[data-theme="dark"] .agents-list-table thead {
    background: var(--color-surface);
    color: var(--color-text);
}

[data-theme="dark"] .agents-list-table thead th {
    background: var(--color-surface-elevated);
    color: var(--color-primary);
    border-color: var(--color-border);
}

[data-theme="dark"] .agents-list-table tbody td {
    color: var(--color-text);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .agents-list-table tbody tr:hover {
    background: var(--color-hover-bg);
}

[data-theme="dark"] .users-list-table,
[data-theme="dark"] .users-list-table thead {
    background: var(--color-surface);
    color: var(--color-text);
}

[data-theme="dark"] .users-list-table thead th {
    background: var(--color-surface-elevated);
    color: var(--color-primary);
    border-color: var(--color-border);
}

[data-theme="dark"] .users-list-table tbody td {
    color: var(--color-text);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .users-list-table tbody tr:hover {
    background: var(--color-hover-bg);
}


[data-theme="dark"] .page-header h1,
[data-theme="dark"] .filters-section h3,
[data-theme="dark"] .results-header h3 {
    color: var(--color-primary);
}

[data-theme="dark"] .messages-header,
[data-theme="dark"] .message-item {
    background: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .message-bubble.agent {
    background: var(--color-primary);
}

[data-theme="dark"] .message-bubble.client {
    background: var(--color-surface-elevated);
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

[data-theme="dark"] .log-header {
    background: var(--color-surface-elevated) !important;
    color: var(--color-text) !important;
    border-bottom: 1px solid var(--color-border-light);
}

[data-theme="dark"] .tag-card-hover,
[data-theme="dark"] .template-card,
[data-theme="dark"] .campaign-card {
    background: var(--color-surface) !important;
    border-color: var(--color-border) !important;
    color: var(--color-text);
}

[data-theme="dark"] .dashboard-header,
[data-theme="dark"] .stats-card {
    background: var(--color-surface) !important;
    color: var(--color-text);
    border: 1px solid var(--color-border-light);
    box-shadow: 0 4px 16px var(--color-shadow);
}

[data-theme="dark"] .main-content .card,
[data-theme="dark"] .bootstrap-card {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .list-group-item {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .list-group-item:hover {
    background: var(--color-hover-bg);
}

[data-theme="dark"] .nav-tabs .nav-link {
    color: var(--color-text-muted);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .nav-tabs .nav-link.active {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border);
}

[data-theme="dark"] .table {
    --bs-table-bg: var(--color-surface);
    --bs-table-color: var(--color-text);
    --bs-table-border-color: var(--color-border-light);
    --bs-table-striped-bg: var(--color-table-stripe);
    --bs-table-hover-bg: var(--color-table-hover);
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background-color: var(--color-input-bg);
    border-color: var(--color-input-border);
    color: var(--color-text);
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
    background-color: var(--color-input-bg);
    border-color: var(--color-primary);
    color: var(--color-text);
}

[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer {
    background: var(--color-surface);
    border-color: var(--color-border-light);
    color: var(--color-text);
}

[data-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

[data-theme="dark"] .agent-campaign-check-item {
    background: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .agent-campaign-check-item:hover {
    background: var(--color-hover-bg);
    border-color: var(--color-primary);
}

[data-theme="dark"] .whatsapp-manager-modal .modal-content,
[data-theme="dark"] .whatsapp-manager-modal .wm-modal-body,
[data-theme="dark"] .whatsapp-manager-modal .wm-panel,
[data-theme="dark"] .whatsapp-manager-modal .wm-modal-footer {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border-light);
}

[data-theme="dark"] .whatsapp-manager-modal .wm-modal-body {
    background: var(--color-bg);
}

[data-theme="dark"] .whatsapp-manager-modal .wm-panel__head {
    background: var(--color-surface-elevated);
    border-color: var(--color-border-light);
    color: var(--color-primary);
}

[data-theme="dark"] .whatsapp-manager-modal .wm-panel .form-label {
    color: var(--color-text-secondary);
}

[data-theme="dark"] .whatsapp-manager-modal .wm-panel .form-control {
    background: var(--color-input-bg);
    border-color: var(--color-input-border);
    color: var(--color-text);
}

[data-theme="dark"] .conditional-row,
[data-theme="dark"] .bot-form-card,
[data-theme="dark"] .bots-transfer-picker-host {
    background: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] #massPage .form-control,
[data-theme="dark"] #massPage .form-select,
[data-theme="dark"] #massPage textarea.form-control {
    background-color: var(--color-input-bg) !important;
    border-color: var(--color-input-border) !important;
    color: var(--color-text) !important;
}

[data-theme="dark"] #massPage .form-control:disabled,
[data-theme="dark"] #massPage .form-select:disabled {
    background-color: var(--color-surface-elevated) !important;
    color: var(--color-text-muted) !important;
}

[data-theme="dark"] #massPage .form-check-label {
    color: var(--color-text);
}

[data-theme="dark"] #massPage .alert-secondary,
[data-theme="dark"] #massPage .alert-info,
[data-theme="dark"] #massPage .alert-warning,
[data-theme="dark"] #massPage .alert-danger {
    background: var(--color-surface-elevated);
    border-color: var(--color-border);
    color: var(--color-text);
}

[data-theme="dark"] .report-table th {
    background: var(--color-surface-elevated);
    color: var(--color-text);
}

[data-theme="dark"] .metric-card {
    opacity: 0.92;
}

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
    color: var(--color-text);
}

[data-theme="dark"] .main-content > h1,
[data-theme="dark"] .main-content > h2 {
    color: var(--color-primary);
}