/* ============================================================ Aduanas Flex — Dark Mode Usa [data-theme="dark"] en para activar. Los tokens MD3 principales se sobreescriben en aduanaFlex.css. Este archivo maneja los overrides de componentes específicos. ============================================================ */ /* --- Tokens AI (ai.css usa prefijo --ai-*) --- */ [data-theme="dark"] { --ai-light: var(--surface-dim); --ai-dark: var(--on-surface); --ai-gray: var(--on-surface-variant); --ai-light-gray: var(--surface-container); --ai-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); color-scheme: dark; } /* --- Body & Page Background --- */ [data-theme="dark"] body { background-color: #1a1a2e !important; color: #e0e0e0 !important; } [data-theme="dark"] .body-background { background: #1a1a2e !important; } [data-theme="dark"] .body-background-white { background: #16213e !important; } /* --- Navbar --- */ [data-theme="dark"] .navbar { background-color: #16213e !important; border-bottom-color: #2d3748 !important; } [data-theme="dark"] .navbar-light .navbar-nav .nav-link { color: #e0e0e0 !important; } [data-theme="dark"] .navbar .dark-grey-text, [data-theme="dark"] .navbar .black-text, [data-theme="dark"] .navbar a { color: #e0e0e0 !important; } [data-theme="dark"] .navbar .breadcrumb-item a { color: #a0aec0 !important; } [data-theme="dark"] .navbar .breadcrumb-item:last-child a { color: #718096 !important; } [data-theme="dark"] .breadcrumb { background-color: transparent !important; } [data-theme="dark"] .white { background-color: #16213e !important; } /* --- Sidemenu / Sidebar --- */ [data-theme="dark"] .sidemenu { background: #16213e !important; border-right: 1px solid #2d3748 !important; } [data-theme="dark"] .sidemenu a, [data-theme="dark"] .sidemenu .menu-option { color: #c0c8d8 !important; } [data-theme="dark"] .menu-option:hover, [data-theme="dark"] .hover-grey:hover { background-color: #243352 !important; } [data-theme="dark"] .sidemenu .menu-option.active, [data-theme="dark"] .sidemenu a.active { background-color: #243352 !important; color: #e0e0e0 !important; } [data-theme="dark"] .student-side-menu { background-color: #16213e !important; } /* --- Cards --- */ [data-theme="dark"] .card { background-color: #16213e !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .card-header { background-color: #1f2b47 !important; border-bottom-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .card-footer { background-color: #1f2b47 !important; border-top-color: #2d3748 !important; } [data-theme="dark"] .card-body { color: #e0e0e0 !important; } [data-theme="dark"] .card-body a { color: #7eb4f5 !important; } [data-theme="dark"] .card-body p { color: #a0aec0 !important; } [data-theme="dark"] .glass-card { background: rgba(22, 33, 62, 0.95) !important; border-color: rgba(45, 55, 72, 0.5) !important; } [data-theme="dark"] .stat-card { background: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .rounded-card { border-color: #2d3748 !important; } /* --- Tables --- */ [data-theme="dark"] .table { color: #e0e0e0 !important; } [data-theme="dark"] .table thead th { background-color: #1f2b47 !important; color: #a0aec0 !important; border-bottom-color: #2d3748 !important; border-top-color: #2d3748 !important; } [data-theme="dark"] .table td, [data-theme="dark"] .table th { border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(31, 43, 71, 0.5) !important; } [data-theme="dark"] .table-hover tbody tr:hover { background-color: rgba(36, 51, 82, 0.7) !important; } [data-theme="dark"] .table-bordered { border-color: #2d3748 !important; } [data-theme="dark"] .table td a { color: #7eb4f5 !important; } [data-theme="dark"] .table td a:hover { color: #a8ccf7 !important; } /* --- Forms & Inputs --- */ [data-theme="dark"] .form-control, [data-theme="dark"] .custom-select, [data-theme="dark"] select, [data-theme="dark"] textarea, [data-theme="dark"] input[type="text"], [data-theme="dark"] input[type="email"], [data-theme="dark"] input[type="password"], [data-theme="dark"] input[type="number"], [data-theme="dark"] input[type="date"], [data-theme="dark"] input[type="tel"], [data-theme="dark"] input[type="search"] { background-color: #1f2b47 !important; color: #e0e0e0 !important; border-color: #2d3748 !important; } [data-theme="dark"] .form-control:focus, [data-theme="dark"] textarea:focus, [data-theme="dark"] select:focus { background-color: #243352 !important; color: #e0e0e0 !important; border-color: #5a7fe6 !important; box-shadow: 0 0 0 0.2rem rgba(90, 127, 230, 0.25) !important; } [data-theme="dark"] .form-control::placeholder, [data-theme="dark"] textarea::placeholder, [data-theme="dark"] input::placeholder { color: #718096 !important; } [data-theme="dark"] .form-control:disabled, [data-theme="dark"] .form-control[readonly] { background-color: #141c30 !important; color: #718096 !important; } [data-theme="dark"] label { color: #c0c8d8 !important; } [data-theme="dark"] .input-group-text { background-color: #1f2b47 !important; border-color: #2d3748 !important; color: #a0aec0 !important; } [data-theme="dark"] .input-container { background-color: #1f2b47 !important; } /* --- Modals --- */ [data-theme="dark"] .modal-content { background-color: #16213e !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .modal-header { border-bottom-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .modal-header .close, [data-theme="dark"] .modal-header .btn-close { color: #e0e0e0 !important; text-shadow: none !important; } [data-theme="dark"] .modal-footer { border-top-color: #2d3748 !important; } [data-theme="dark"] .modal-body { color: #e0e0e0 !important; } [data-theme="dark"] .modal-content h5 { color: #e0e0e0 !important; } /* --- Dropdowns --- */ [data-theme="dark"] .dropdown-menu { background-color: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .dropdown-item { color: #e0e0e0 !important; } [data-theme="dark"] .dropdown-item:hover, [data-theme="dark"] .dropdown-item:focus { background-color: #243352 !important; color: #e0e0e0 !important; } [data-theme="dark"] .dropdown-item.active, [data-theme="dark"] .dropdown-item:active { background-color: #2d4a7a !important; color: #ffffff !important; } [data-theme="dark"] .dropdown-divider { border-top-color: #2d3748 !important; } /* --- Filter Dropdowns & Sorting (dtaxStyle patterns) --- */ [data-theme="dark"] .filter-dropdown { background-color: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .filter-actions { background-color: #1a1a2e !important; border-top-color: #2d3748 !important; } [data-theme="dark"] .filter-search { border-color: #2d3748 !important; } [data-theme="dark"] .click-filter-stat:hover, [data-theme="dark"] .click-filter-user:hover, [data-theme="dark"] .sort-option:hover { background-color: #243352 !important; } [data-theme="dark"] .sort-option { color: #e0e0e0 !important; border-bottom-color: #2d3748 !important; } /* --- Alerts --- */ [data-theme="dark"] .alert-info { background-color: rgba(33, 150, 243, 0.15) !important; border-color: rgba(33, 150, 243, 0.3) !important; color: #7eb4f5 !important; } [data-theme="dark"] .alert-warning { background-color: rgba(255, 152, 0, 0.15) !important; border-color: rgba(255, 152, 0, 0.3) !important; color: #ffb74d !important; } [data-theme="dark"] .alert-danger { background-color: rgba(244, 67, 54, 0.15) !important; border-color: rgba(244, 67, 54, 0.3) !important; color: #ef9a9a !important; } [data-theme="dark"] .alert-success { background-color: rgba(76, 175, 80, 0.15) !important; border-color: rgba(76, 175, 80, 0.3) !important; color: #81c784 !important; } [data-theme="dark"] .alert-error { background-color: rgba(220, 53, 69, 0.15) !important; border-color: rgba(220, 53, 69, 0.3) !important; color: #ef9a9a !important; } /* --- Tabs / Nav --- */ [data-theme="dark"] .nav-tabs { border-bottom-color: #2d3748 !important; } [data-theme="dark"] .nav-tabs .nav-link { color: #a0aec0 !important; background-color: transparent !important; } [data-theme="dark"] .nav-tabs .nav-link:hover { border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .nav-tabs .nav-link.active { color: #ffffff !important; background-color: #3b82f6 !important; border-color: #3b82f6 !important; } /* --- Buttons (supplement, not override primary/accent buttons) --- */ [data-theme="dark"] .btn-outline-secondary { color: #a0aec0 !important; border-color: #2d3748 !important; } [data-theme="dark"] .btn-outline-secondary:hover { background-color: #243352 !important; color: #e0e0e0 !important; } [data-theme="dark"] .btn-light { background-color: #1f2b47 !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .btn-grey-outline { background-color: #1f2b47 !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } /* --- AI Chat (ai.css overrides) --- */ [data-theme="dark"] .ai-sidebar { background-color: #16213e !important; border-right-color: #2d3748 !important; } [data-theme="dark"] .ai-chat-header { background-color: #16213e !important; border-bottom-color: #2d3748 !important; } [data-theme="dark"] .ai-main { background-color: #1a1a2e !important; } [data-theme="dark"] .ai-input-area { background-color: #16213e !important; } [data-theme="dark"] .ai-textarea { background-color: #1f2b47 !important; color: #e0e0e0 !important; border-color: #2d3748 !important; } [data-theme="dark"] .ai-textarea:focus { border-color: #5a7fe6 !important; } [data-theme="dark"] .ai-textarea::placeholder { color: #718096 !important; } [data-theme="dark"] .ai-message.ai-assistant .ai-message-bubble { background-color: #1f2b47 !important; color: #e0e0e0 !important; } [data-theme="dark"] .ai-conversation-item { color: #e0e0e0 !important; } [data-theme="dark"] .ai-conversation-item:hover { background-color: #243352 !important; } [data-theme="dark"] .ai-conversation-item.ai-active { background-color: rgba(90, 127, 230, 0.15) !important; } [data-theme="dark"] .ai-suggestion { background-color: #16213e !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .ai-suggestion:hover { background-color: #243352 !important; } [data-theme="dark"] .ai-panel { background-color: #16213e !important; border-left-color: #2d3748 !important; } [data-theme="dark"] .ai-file-preview { background-color: #1f2b47 !important; } [data-theme="dark"] .ai-typing { background-color: #1f2b47 !important; } [data-theme="dark"] .disabledbox { background-color: #141c30 !important; color: #718096 !important; border-color: #2d3748 !important; } /* --- Chat (styleHome patterns) --- */ [data-theme="dark"] .chat-form, [data-theme="dark"] .chat-textarea-box { background-color: #1f2b47 !important; } [data-theme="dark"] .receiver-chat-bubble { background-color: #1f2b47 !important; color: #e0e0e0 !important; } [data-theme="dark"] .message-body { background-color: #1f2b47 !important; color: #e0e0e0 !important; } [data-theme="dark"] .thinking-message-bubble { background-color: #243352 !important; } /* --- Loading Overlay & Toast (already dark, minor tweaks) --- */ [data-theme="dark"] .loading-card { background-color: #16213e !important; color: #e0e0e0 !important; } [data-theme="dark"] .loading-text { color: #e0e0e0 !important; } /* Toast already dark (#323232), no override needed */ /* --- Text Utilities --- */ [data-theme="dark"] .text-muted { color: #718096 !important; } [data-theme="dark"] .text-dark, [data-theme="dark"] .dark-grey-text { color: #e0e0e0 !important; } [data-theme="dark"] .text-secondary { color: #a0aec0 !important; } [data-theme="dark"] .light-grey-text { color: #a0aec0 !important; } [data-theme="dark"] .blue-grey-text { color: #a0aec0 !important; } [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: #e0e0e0 !important; } [data-theme="dark"] p { color: #c0c8d8; } [data-theme="dark"] a { color: #7eb4f5; } [data-theme="dark"] a:hover { color: #a8ccf7; } /* --- Background Utilities --- */ [data-theme="dark"] .bg-white { background-color: #16213e !important; } [data-theme="dark"] .bg-light { background-color: #1a1a2e !important; } /* --- Borders --- */ [data-theme="dark"] .border { border-color: #2d3748 !important; } [data-theme="dark"] .border-top { border-top-color: #2d3748 !important; } [data-theme="dark"] .border-bottom { border-bottom-color: #2d3748 !important; } [data-theme="dark"] .border-end { border-right-color: #2d3748 !important; } [data-theme="dark"] hr { border-top-color: #2d3748 !important; } /* --- Pagination --- */ [data-theme="dark"] .page-item .page-link { background-color: #16213e !important; border-color: #2d3748 !important; color: #a0aec0 !important; } [data-theme="dark"] .page-item.active .page-link { background-color: #5a7fe6 !important; border-color: #5a7fe6 !important; color: #ffffff !important; } [data-theme="dark"] .page-item.disabled .page-link { background-color: #141c30 !important; border-color: #2d3748 !important; color: #718096 !important; } /* --- List Groups --- */ [data-theme="dark"] .list-group-item { background-color: #16213e !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .list-group-item:hover { background-color: #243352 !important; } /* --- Quill Editor --- */ [data-theme="dark"] .ql-toolbar { background-color: #1f2b47 !important; border-color: #2d3748 !important; } [data-theme="dark"] .ql-container { border-color: #2d3748 !important; } [data-theme="dark"] .ql-editor { background-color: #1f2b47 !important; color: #e0e0e0 !important; } [data-theme="dark"] .ql-toolbar .ql-stroke { stroke: #a0aec0 !important; } [data-theme="dark"] .ql-toolbar .ql-fill { fill: #a0aec0 !important; } [data-theme="dark"] .ql-toolbar .ql-picker-label { color: #a0aec0 !important; } [data-theme="dark"] .ql-toolbar .ql-picker-options { background-color: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .wysiwyg-toolbar { background-color: #1f2b47 !important; } /* --- Scrollbars --- */ [data-theme="dark"] ::-webkit-scrollbar { width: 8px; height: 8px; } [data-theme="dark"] ::-webkit-scrollbar-track { background: #1a1a2e; } [data-theme="dark"] ::-webkit-scrollbar-thumb { background: #2d3748; border-radius: 4px; } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #3d4f6f; } /* --- File Upload --- */ [data-theme="dark"] .fu-upload-area, [data-theme="dark"] .ag-file-upload-area { background-color: #1a1a2e !important; border-color: #2d3748 !important; } [data-theme="dark"] .ag-file-item { background-color: #1f2b47 !important; border-color: #2d3748 !important; } [data-theme="dark"] .ag-textarea { background-color: #1f2b47 !important; color: #e0e0e0 !important; } [data-theme="dark"] .ag-modal { background-color: #16213e !important; } /* --- Plan Selection / Classroom --- */ [data-theme="dark"] .plan-selection { background-color: #1a1a2e !important; } [data-theme="dark"] .classroom-body { background-color: #1a1a2e !important; } /* --- Steps / Progress --- */ [data-theme="dark"] .steps-status { border-top-color: #2d3748 !important; } [data-theme="dark"] .progress { background-color: #1f2b47 !important; } /* --- Popovers & Tooltips --- */ [data-theme="dark"] .popover { background-color: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .popover-body { color: #e0e0e0 !important; } [data-theme="dark"] .tooltip-inner { background-color: #1f2b47 !important; color: #e0e0e0 !important; } /* --- Toggle Button Styling --- */ [data-theme="dark"] .dark-mode-toggle { color: #e0e0e0 !important; } .dark-mode-toggle { background: transparent; border: none; cursor: pointer; padding: 0; margin: 0; width: 40px; height: 40px; font-size: 1.1rem; color: #7a7676; transition: color 0.2s ease, background-color 0.2s ease; display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; border-radius: 4px; line-height: 1; } .dark-mode-toggle:hover { color: #333; background-color: #E0E0E0; } [data-theme="dark"] .dark-mode-toggle:hover { color: #ffffff !important; background-color: #243352 !important; } .dark-mode-toggle .fa-sun { display: none; } [data-theme="dark"] .dark-mode-toggle .fa-moon { display: none; } [data-theme="dark"] .dark-mode-toggle .fa-sun { display: inline-block; color: #fbbf24; } /* --- Calendar --- */ [data-theme="dark"] .datepicker { background-color: #16213e !important; color: #e0e0e0 !important; } [data-theme="dark"] .datepicker table tr td, [data-theme="dark"] .datepicker table tr th { color: #e0e0e0 !important; } [data-theme="dark"] .datepicker table tr td:hover { background-color: #243352 !important; } /* --- MDB Specific Overrides --- */ [data-theme="dark"] .md-form input[type="text"], [data-theme="dark"] .md-form input[type="password"], [data-theme="dark"] .md-form input[type="email"], [data-theme="dark"] .md-form input[type="number"], [data-theme="dark"] .md-form textarea.md-textarea { color: #e0e0e0 !important; border-bottom-color: #2d3748 !important; } [data-theme="dark"] .md-form input:focus, [data-theme="dark"] .md-form textarea:focus { border-bottom-color: #5a7fe6 !important; box-shadow: 0 1px 0 0 #5a7fe6 !important; } [data-theme="dark"] .md-form label { color: #a0aec0 !important; } [data-theme="dark"] .md-form label.active { color: #5a7fe6 !important; } /* --- Shadows (soften for dark) --- */ [data-theme="dark"] .z-depth-1, [data-theme="dark"] .z-depth-1-half, [data-theme="dark"] .z-depth-2 { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3), 0 2px 10px rgba(0, 0, 0, 0.2) !important; } /* --- Inline Style Overrides (common patterns) --- */ [data-theme="dark"] [style*="background-color: white"], [data-theme="dark"] [style*="background-color:#fff"], [data-theme="dark"] [style*="background-color: #fff"], [data-theme="dark"] [style*="background-color: #ffffff"], [data-theme="dark"] [style*="background-color:#ffffff"] { background-color: #16213e !important; } [data-theme="dark"] [style*="background-color: #fafbfc"], [data-theme="dark"] [style*="background-color:#fafbfc"] { background-color: #16213e !important; } [data-theme="dark"] [style*="background-color: #eeeeee"], [data-theme="dark"] [style*="background-color:#eeeeee"] { background-color: #1a1a2e !important; } [data-theme="dark"] [style*="border-bottom: 1px solid #eeeeee"], [data-theme="dark"] [style*="border-bottom: 0px solid #eeeeee"] { border-bottom-color: #2d3748 !important; } [data-theme="dark"] [style*="color: #6c757d"] { color: #a0aec0 !important; } /* --- Ekho / Kids Specific --- */ [data-theme="dark"] .ekho-body { background-color: #1a1a2e !important; } [data-theme="dark"] #ekhoKidNavbar { background-color: #16213e !important; border-bottom-color: #2d3748 !important; } /* --- Badge Adjustments --- */ [data-theme="dark"] .badge-light { background-color: #1f2b47 !important; color: #e0e0e0 !important; } /* --- Log Container --- */ [data-theme="dark"] .log-container { background-color: #1f2b47 !important; color: #e0e0e0 !important; } /* --- Select2 / Custom Selects --- */ [data-theme="dark"] .select2-container--default .select2-selection--single { background-color: #1f2b47 !important; border-color: #2d3748 !important; color: #e0e0e0 !important; } [data-theme="dark"] .select2-dropdown { background-color: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .select2-results__option { color: #e0e0e0 !important; } [data-theme="dark"] .select2-results__option--highlighted { background-color: #243352 !important; } /* --- Home Dashboard / AITutor Cards --- */ [data-theme="dark"] .aitutor-container { color: #e0e0e0 !important; } [data-theme="dark"] .aitutor-header { background: #16213e !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important; } [data-theme="dark"] .aitutor-header-left h2 { color: #e0e0e0 !important; } [data-theme="dark"] .aitutor-header-left p { color: #a0aec0 !important; } [data-theme="dark"] .aitutor-action-card { background: #16213e !important; border-color: #2d3748 !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important; } [data-theme="dark"] .aitutor-action-card:hover { box-shadow: 0 8px 25px rgba(59, 130, 246, 0.2) !important; border-color: #3b5998 !important; } [data-theme="dark"] .aitutor-action-card:nth-child(2):hover { box-shadow: 0 8px 25px rgba(16, 185, 129, 0.2) !important; } [data-theme="dark"] .aitutor-action-card:nth-child(3):hover { box-shadow: 0 8px 25px rgba(185, 117, 16, 0.2) !important; } [data-theme="dark"] .aitutor-action-text h4 { color: #e0e0e0 !important; } [data-theme="dark"] .aitutor-action-text p { color: #a0aec0 !important; } [data-theme="dark"] .aitutor-action-badge { background: #1f2b47 !important; color: #a0aec0 !important; } [data-theme="dark"] .aitutor-action-card:nth-child(1) .aitutor-action-badge { background: rgba(59, 130, 246, 0.2) !important; color: #7eb4f5 !important; } [data-theme="dark"] .aitutor-action-card:nth-child(2) .aitutor-action-badge { background: rgba(16, 185, 129, 0.2) !important; color: #6ee7b7 !important; } [data-theme="dark"] .aitutor-action-card:nth-child(3) .aitutor-action-badge { background: rgba(185, 117, 16, 0.2) !important; color: #fbbf24 !important; } [data-theme="dark"] .aitutor-btn-secondary { background-color: #1f2b47 !important; color: #a0aec0 !important; border-color: #2d3748 !important; } [data-theme="dark"] .aitutor-btn-secondary:hover { background-color: #243352 !important; } [data-theme="dark"] .aitutor-child-card { background: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .aitutor-child-info h4 { color: #e0e0e0 !important; } [data-theme="dark"] .aitutor-section-header h3 { color: #e0e0e0 !important; } [data-theme="dark"] .aitutor-progress-bar { background-color: #1f2b47 !important; } [data-theme="dark"] .aitutor-progress-description { color: #a0aec0 !important; } /* --- Document Items (Income Tax Return Draft) --- */ [data-theme="dark"] .document-item { background: #1f2b47 !important; border-color: transparent !important; color: #e0e0e0 !important; } [data-theme="dark"] .document-item:hover { background: #243352 !important; border-color: #3b82f6 !important; } [data-theme="dark"] .document-name { color: #e0e0e0 !important; } [data-theme="dark"] .file-icon.pdf-icon { background: rgba(220, 38, 38, 0.15) !important; color: #f87171 !important; } [data-theme="dark"] .file-icon.xlsx-icon { background: rgba(5, 150, 105, 0.15) !important; color: #6ee7b7 !important; } [data-theme="dark"] .file-type-badge.badge-pdf { background: rgba(220, 38, 38, 0.2) !important; color: #fca5a5 !important; } [data-theme="dark"] .file-type-badge.badge-xlsx { background: rgba(5, 150, 105, 0.2) !important; color: #6ee7b7 !important; } [data-theme="dark"] .action-btn { background: #16213e !important; color: #a0aec0 !important; border-color: #2d3748 !important; } [data-theme="dark"] .action-btn:hover { background: #3b82f6 !important; color: white !important; border-color: #3b82f6 !important; } [data-theme="dark"] .info-item { color: #e0e0e0 !important; } /* --- Document Progress Component --- */ [data-theme="dark"] document-progress { color: #e0e0e0 !important; } /* --- MDB Grey / Lighten Utility Classes (used in table group rows) --- */ [data-theme="dark"] .grey { background-color: #1f2b47 !important; } [data-theme="dark"] .grey.lighten-1, [data-theme="dark"] .grey.lighten-2, [data-theme="dark"] .grey.lighten-3, [data-theme="dark"] .grey.lighten-4, [data-theme="dark"] .grey.lighten-5 { background-color: #1f2b47 !important; color: #e0e0e0 !important; } [data-theme="dark"] .blue-grey { background-color: #1f2b47 !important; } [data-theme="dark"] .blue-grey.lighten-1, [data-theme="dark"] .blue-grey.lighten-2, [data-theme="dark"] .blue-grey.lighten-3, [data-theme="dark"] .blue-grey.lighten-4, [data-theme="dark"] .blue-grey.lighten-5 { background-color: #1f2b47 !important; color: #e0e0e0 !important; } /* --- Sticky Table Headers (white class on thead/tr) --- */ [data-theme="dark"] .table thead .sticky-top, [data-theme="dark"] .table thead .sticky-top th, [data-theme="dark"] thead.white, [data-theme="dark"] tr.sticky-top.white { background-color: #1f2b47 !important; color: #a0aec0 !important; } /* --- Navbar Anchor (align toggle with other icons) --- */ [data-theme="dark"] .navbar-anchor { color: #a0aec0 !important; } [data-theme="dark"] .navbar-anchor:hover { background-color: #243352 !important; } /* --- File Input / Upload Styling --- */ [data-theme="dark"] .file-input-wrapper { color: #e0e0e0 !important; } [data-theme="dark"] .upload-file-form label { color: #a0aec0 !important; } /* --- Dashboard (dtx-dash) --- */ [data-theme="dark"] .dtx-dash-topbar { border-bottom-color: #2d3748 !important; } [data-theme="dark"] .dtx-dash-company { color: #e0e0e0 !important; } [data-theme="dark"] .dtx-dash-separator { color: #4a5568 !important; } [data-theme="dark"] .dtx-dash-plan { color: #7eb4f5 !important; background: rgba(59, 130, 246, 0.15) !important; } [data-theme="dark"] .dtx-dash-date { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-greeting { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-welcome h2 { color: #e0e0e0 !important; } [data-theme="dark"] .dtx-dash-user-badge { color: #b794f4 !important; background: rgba(124, 58, 237, 0.15) !important; border-color: rgba(124, 58, 237, 0.25) !important; } [data-theme="dark"] .dtx-dash-info-strip { background: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .dtx-dash-info-item { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-info-item i { color: #718096 !important; } [data-theme="dark"] .dtx-dash-section-title { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-action { background: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .dtx-dash-action:hover { border-color: #3b5998 !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25) !important; } [data-theme="dark"] .dtx-dash-action h4 { color: #e0e0e0 !important; } [data-theme="dark"] .dtx-dash-action p { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-action-go { color: #4a5568 !important; } [data-theme="dark"] .dtx-dash-action:hover .dtx-dash-action-go { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-action--blue .dtx-dash-action-icon { background: rgba(59, 130, 246, 0.15) !important; color: #7eb4f5 !important; } [data-theme="dark"] .dtx-dash-action--green .dtx-dash-action-icon { background: rgba(16, 185, 129, 0.15) !important; color: #6ee7b7 !important; } [data-theme="dark"] .dtx-dash-action--amber .dtx-dash-action-icon { background: rgba(245, 158, 11, 0.15) !important; color: #fbbf24 !important; } [data-theme="dark"] .dtx-dash-action--blue:hover .dtx-dash-action-icon { background: #3b82f6 !important; color: #fff !important; } [data-theme="dark"] .dtx-dash-action--green:hover .dtx-dash-action-icon { background: #10b981 !important; color: #fff !important; } [data-theme="dark"] .dtx-dash-action--amber:hover .dtx-dash-action-icon { background: #f59e0b !important; color: #fff !important; } [data-theme="dark"] .dtx-dash-action--blue:hover h4 { color: #7eb4f5 !important; } [data-theme="dark"] .dtx-dash-action--green:hover h4 { color: #6ee7b7 !important; } [data-theme="dark"] .dtx-dash-action--amber:hover h4 { color: #fbbf24 !important; } [data-theme="dark"] .dtx-dash-announcements { background: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .dtx-dash-announcements .dtx-dash-section-title { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-announcement { border-bottom-color: #2d3748 !important; } [data-theme="dark"] .dtx-dash-announcement-body strong { color: #e0e0e0 !important; } [data-theme="dark"] .dtx-dash-announcement-body p { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-support { background: #16213e !important; border-color: #2d3748 !important; } [data-theme="dark"] .dtx-dash-support .dtx-dash-section-title { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-support-card p { color: #a0aec0 !important; } [data-theme="dark"] .dtx-dash-support-link { color: #7eb4f5 !important; } [data-theme="dark"] .dtx-dash-support-link:hover { color: #a4cbf7 !important; } [data-theme="dark"] .dtx-dash-support-brand { border-top-color: #2d3748 !important; color: #718096 !important; } [data-theme="dark"] .dtx-dash-support-brand strong { color: #a0aec0 !important; } /* --- Smooth Transition for Theme Switching --- */ html[data-theme="dark"] body, html[data-theme="dark"] .navbar, html[data-theme="dark"] .sidemenu, html[data-theme="dark"] .card, html[data-theme="dark"] .modal-content, html[data-theme="dark"] .form-control, html[data-theme="dark"] .dropdown-menu, html[data-theme="dark"] .table { transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; }