/* Dark Mode Styles - Prioritize data-theme over system preference */ html[data-theme="dark"] { /* * Bootstrap 5 variables must live on so they inherit app-wide. * A nested ":root { }" block here compiled to "html[data-theme=dark] :root", which never * matches (root is not a descendant of html), so --bs-body-bg etc. stayed Bootstrap defaults. */ --bs-body-bg: #2e3435 !important; --bs-body-color: #fff !important; --bs-emphasis-color: #fff !important; --bs-secondary-color: #adb5bd !important; --bs-tertiary-color: rgba(255, 255, 255, 0.55) !important; --bs-border-color: #404040 !important; --bs-border-color-translucent: rgba(255, 255, 255, 0.15) !important; --bs-link-color: #6ea8fe !important; --bs-link-hover-color: #9ec5fe !important; --bs-secondary-bg: #343a40 !important; --bs-tertiary-bg: #2d3748 !important; --bs-card-bg: #181a1b !important; --bs-card-color: #fff !important; --bs-card-cap-bg: rgba(255, 255, 255, 0.06) !important; --bs-card-border-color: #404040 !important; --bs-table-bg: #181a1b !important; --bs-table-color: #fff !important; --bs-input-bg: rgba(24, 26, 27, 0.8) !important; --bs-input-color: #fff !important; --bs-input-border-color: rgba(79, 196, 219, 0.2) !important; --bs-input-focus-bg: rgba(24, 26, 27, 0.9) !important; --bs-input-focus-color: #fff !important; --bs-input-focus-border-color: #4fc4db !important; --bs-modal-bg: #2d3748 !important; --bs-modal-color: #e2e8f0 !important; --bs-modal-border-color: #4a5568 !important; /* Modal specific fixes for dark mode */ .modal-content { background-color: #2d3748 !important; color: #e2e8f0 !important; border-color: #4a5568 !important; } .modal-header { background-color: #2d3748 !important; border-bottom-color: #4a5568 !important; } .modal-footer { background-color: #2d3748 !important; border-top-color: #4a5568 !important; } .modal-body { background-color: #2d3748 !important; color: #e2e8f0 !important; } /* Body and HTML background - Ultra high specificity to override initial */ html[data-theme="dark"] body, html[data-theme="dark"] html, body, html { background-color: #2E3435 !important; background: linear-gradient(180deg, #181A1B 125px, #627174 300%) !important; background-image: linear-gradient(180deg, #181A1B 125px, #627174 300%) !important; background-repeat: no-repeat !important; color: #fff !important; } /* Maximum specificity override for initial declarations */ html[data-theme="dark"] body.d-flex.flex-column.h-100, html[data-theme="dark"] html.h-100 { background-color: #2E3435 !important; background: linear-gradient(180deg, #181A1B 125px, #627174 300%) !important; background-image: linear-gradient(180deg, #181A1B 125px, #627174 300%) !important; background-repeat: no-repeat !important; } /* Specific override for h-100 class causing the white background */ html[data-theme="dark"] .h-100 { background-color: #2E3435 !important; background: linear-gradient(180deg, #181A1B 125px, #627174 300%) !important; background-image: linear-gradient(180deg, #181A1B 125px, #627174 300%) !important; background-repeat: no-repeat !important; } /* Main content container */ .container { background-color: transparent !important; } .container-fluid { background-color: transparent !important; } /* Navigation */ .navbar { background-color: #27447e !important; color: #ffffff !important; } .nav-link { color: #ffffff !important; } nav, nav div { color: #ffffff !important; } nav a { color: #ffffff !important; } /* Navbar utility icons (bug, quick report, help) - ensure visible on dark bar */ .navbar .btn-link.text-muted, .navbar .container .btn-link.text-muted { color: rgba(255, 255, 255, 0.95) !important; } .navbar .btn-link.text-muted:hover { color: #ffffff !important; } .navbar .btn-link.text-muted i { color: inherit !important; } /* Dropdown menus */ .dropdown-menu { background-color: #27447e !important; background: #27447e !important; opacity: 1 !important; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important; color: #ffffff !important; } .dropdown-item { background-color: transparent !important; color: #ffffff !important; } .dropdown-item:hover { background-color: rgba(255, 255, 255, 0.1) !important; color: #ffffff !important; } /* Ultra-specific dropdown text overrides */ html[data-theme="dark"] .dropdown-menu .dropdown-item, html[data-theme="dark"] .dropdown-item, html[data-theme="dark"] .navbar .dropdown-menu .dropdown-item { background-color: transparent !important; color: #ffffff !important; } html[data-theme="dark"] .dropdown-menu .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .navbar .dropdown-menu .dropdown-item:hover { background-color: rgba(255, 255, 255, 0.1) !important; color: #ffffff !important; } /* Form Elements */ .form-control, .form-select { background-color: rgba(24, 26, 27, 0.8) !important; border-color: rgba(79, 196, 219, 0.2) !important; color: #fff !important; } .form-control:focus, .form-select:focus { background-color: rgba(24, 26, 27, 0.9) !important; border-color: #4FC4DB !important; color: #fff !important; box-shadow: 0 0 0 0.25rem rgba(79, 196, 219, 0.25) !important; } .form-control::placeholder { color: rgba(255, 255, 255, 0.5) !important; } .form-select option { background-color: #181A1B !important; color: #fff !important; } /* Select2 dark mode */ .select2-container--default .select2-selection--single { background-color: rgba(24, 26, 27, 0.8) !important; border: 1px solid rgba(79, 196, 219, 0.2) !important; color: #fff !important; height: 28px !important; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #fff !important; line-height: 28px !important; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: rgba(255,255,255,0.5) !important; } .select2-container--default .select2-results__option { background-color: #181A1B !important; color: #fff !important; white-space: nowrap !important; } .select2-container--default .select2-results__option--highlighted { background-color: #27447e !important; color: #fff !important; white-space: nowrap !important; } .select2-container--default .select2-dropdown { background-color: #181A1B !important; border: 1px solid rgba(79, 196, 219, 0.2) !important; border-radius: 0.375rem !important; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.5) !important; } /* Tables */ .table { background-color: #181A1B !important; color: #fff !important; } .table tbody tr { background-color: #181A1B !important; color: #fff !important; } .table tbody td { background-color: #181A1B !important; color: #fff !important; border-color: #404040 !important; } .table thead th { background-color: #181A1B !important; color: #fff !important; border-color: #404040 !important; } .table tbody tr:hover { background-color: #333 !important; } /* Cards */ .card { background-color: #181A1B !important; border-color: #404040 !important; color: #ffffff !important; } .card-header.bg-dark { background-color: #181A1B !important; color: #ffffff !important; } .card-header.bg-light, .card-header.bg-white { background-color: #2d3748 !important; color: #e2e8f0 !important; border-color: #4a5568 !important; } .bg-light { background-color: #2d3748 !important; color: #e2e8f0 !important; } /* WO / forms: label columns often use bg-white while global color is light — invisible text */ .bg-white { background-color: #2d3748 !important; color: #e2e8f0 !important; } /* Buttons */ .btn-outline-light { color: #fff !important; border-color: #fff !important; background-color: rgba(255, 255, 255, 0.15) !important; } .btn-outline-light:hover { color: #2c3e50 !important; background-color: #ffffff !important; border-color: #ffffff !important; } .btn:disabled, .btn.disabled { background-color: #23272b !important; color: #888 !important; border-color: #444 !important; opacity: 1 !important; } /* Progress bars */ .progress { background-color: #404040 !important; } .progress-bar { background-color: #0d6efd !important; } /* Pay period overall bar: always success (green); do not use default progress bar blue */ #payPeriodOverallProgressBar.progress-bar { background-color: #198754 !important; } /* Badges */ .badge.bg-success { background-color: #198754 !important; color: #ffffff !important; } .badge.bg-warning { background-color: #ffc107 !important; color: #000000 !important; } .badge.bg-info { background-color: #0dcaf0 !important; color: #ffffff !important; } /* List groups */ .list-group-item { background-color: #2d2d2d !important; border-color: #404040 !important; color: #ffffff !important; } /* Account settings */ .employee-settings-page { padding-bottom: 2rem !important; } .account-settings { background-color: #2E3435 !important; border: 1px solid #454d55 !important; color: #ffffff !important; padding: 2rem 2.25rem !important; } .account-settings-title { color: #ffffff !important; border-bottom: 2px solid #454d55 !important; margin-bottom: 1.75rem !important; padding-bottom: 1rem !important; } .account-settings-form .settings-section { background-color: #181A1B !important; border: 1px solid #454d55 !important; border-radius: 0.375rem !important; padding: 1.25rem 1.5rem !important; margin-bottom: 1.5rem !important; } .account-settings-form .settings-section > .form-label { color: #ffffff !important; font-weight: 600 !important; } .account-settings-form .form-check-label { color: #e9ecef !important; } .account-settings-form .grants-section .grant-code { color: #6ea8fe !important; background-color: transparent !important; } .account-settings-form .prefs-tree-node { border: 1px solid #454d55 !important; border-radius: 0.375rem !important; background-color: #2E3435 !important; padding: 0.5rem 0.75rem !important; } .account-settings-form .prefs-tree-node.prefs-tree-nested { background-color: #181A1B !important; } .account-settings-form .prefs-tree-summary { cursor: pointer !important; display: flex !important; justify-content: space-between !important; align-items: center !important; color: #ffffff !important; font-weight: 600 !important; list-style: none !important; } .account-settings-form .prefs-tree-summary::-webkit-details-marker { display: none !important; } .account-settings-form .prefs-tree-label { color: #ffffff !important; } .account-settings-form .prefs-tree-children { border-color: #6c757d !important; } .account-settings-form .pref-key { color: #adb5bd !important; font-family: monospace !important; margin-right: 0.5rem !important; } .account-settings-form .pref-value { color: #6ea8fe !important; background-color: transparent !important; font-size: 0.8rem !important; } .account-settings-form .prefs-tree-type { color: #adb5bd !important; font-size: 0.75rem !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0.02em !important; } .account-settings-form .subordinate-name { color: #ffffff !important; } .account-settings-form .subordinate-tree-tier { border-color: #6c757d !important; } /* Employee profile */ .employee-profile { background-color: transparent !important; border: none !important; } .employee-profile h2 { color: #ffffff !important; padding-bottom: 0.5rem !important; } .employee-profile h3 { color: #ffffff !important; padding-bottom: 0.5rem !important; } .entra-info-section .alert { margin-top: 1rem !important; padding: 1.25rem !important; } .profile-field { background-color: #181A1B !important; border: 1px solid #454d55 !important; margin-bottom: 1.5rem !important; padding: 1rem !important; border-radius: 0.375rem !important; } .profile-field label { color: #ffffff !important; margin-bottom: 0.5rem !important; display: block !important; font-weight: 500 !important; } .profile-field input { background-color: #2E3435 !important; border: 1px solid #454d55 !important; color: #ffffff !important; margin-top: 0.25rem !important; } .profile-field input:disabled { background-color: #1a1d1e !important; color: #6c757d !important; } .profile-overview { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: 1.25rem 1.5rem !important; background: transparent !important; border: 1px solid #4d565f !important; border-left: 4px solid #4FC4DB !important; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35) !important; margin-bottom: 1.5rem !important; padding: 1.5rem 1.75rem !important; border-radius: 0.5rem !important; } .profile-overview-main { flex: 1 1 16rem !important; min-width: 0 !important; } .profile-overview-icon { flex: 0 0 auto !important; width: 100px !important; height: 100px !important; display: flex !important; align-items: center !important; justify-content: center !important; } .profile-overview-icon--empty { display: none !important; } .profile-name { color: #ffffff !important; font-weight: 700 !important; letter-spacing: 0.01em !important; } .profile-location { color: #d9e2ea !important; margin-top: 0 !important; margin-bottom: 0 !important; padding-bottom: 0.6rem !important; } .profile-line { color: #eef2f6 !important; font-size: 1rem !important; margin: 0 0 0.65rem 0 !important; line-height: 1.45 !important; } .profile-label { font-weight: 600 !important; text-transform: uppercase !important; font-size: 0.82rem !important; letter-spacing: 0.05em !important; color: #a3b2c2 !important; margin-right: 0.35rem !important; } .profile-manager-link, .profile-manager-link:hover, .profile-manager-link:focus, .profile-manager-link:visited { color: #ffffff !important; text-decoration: none !important; font-weight: 400 !important; } .profile-overview-icon .billing-class-icon { width: 100px !important; height: 100px !important; font-size: 100px !important; line-height: 1 !important; margin: 0 !important; vertical-align: middle !important; } .profile-overview-icon .billing-class-icon[data-level]::after { font-size: 22px !important; min-width: 26px !important; height: 26px !important; line-height: 26px !important; bottom: 2px !important; right: 2px !important; } .profile-overview .profile-line:last-child { margin-bottom: 0 !important; } .profile-overview-diagnostics { flex: 1 1 100% !important; margin-top: 0.25rem !important; padding-top: 0.75rem !important; border-top: 1px solid #4d565f !important; } .profile-diagnostics-report { display: block !important; white-space: pre-wrap !important; word-break: break-word !important; max-height: 55vh !important; overflow: auto !important; padding: 0.75rem 1rem !important; border-radius: 0.375rem !important; background-color: #1a1d1e !important; border: 1px solid #454d55 !important; color: #eef2f6 !important; } /* Navigation tabs */ .sub-nav .nav-tabs { border-bottom-color: #404040 !important; } .sub-nav .nav-link { color: #b0b0b0 !important; background-color: transparent !important; border: 1px solid transparent !important; } .sub-nav .nav-link:hover { color: #ffffff !important; border-color: #404040 !important; background-color: rgba(255, 255, 255, 0.1) !important; } .sub-nav .nav-link.active { color: #ffffff !important; background-color: #27447e !important; border-color: #27447e !important; } .nav-tabs .nav-link.active { color: #fff !important; background-color: #0d6efd !important; border-color: #0d6efd !important; } /* ComboBox */ .combo-box-container .combo-box-input { background-color: rgba(24, 26, 27, 0.8) !important; color: #fff !important; border-color: rgba(79, 196, 219, 0.2) !important; } .combo-box-container .combo-box-input:focus { background-color: rgba(24, 26, 27, 0.9) !important; color: #fff !important; border-color: #4FC4DB !important; box-shadow: 0 0 0 0.25rem rgba(79, 196, 219, 0.25) !important; } .combo-box-container .combo-box-dropdown { background-color: #181A1B !important; color: #fff !important; border-color: #404040 !important; z-index: 1050 !important; } .combo-box-container .combo-box-dropdown .combo-box-item { background-color: #181A1B !important; color: #fff !important; } .combo-box-container .combo-box-dropdown .combo-box-item:hover, .combo-box-container .combo-box-dropdown .combo-box-item:focus, .combo-box-container .combo-box-dropdown .combo-box-active { background-color: #27447e !important; color: #fff !important; } /* Pikaday Date Picker */ .pika-single { background-color: #0f0f0f !important; color: #ffffff !important; border-color: #2a2a2a !important; box-shadow: 0 5px 15px -5px rgba(0,0,0,0.9) !important; z-index: 100060 !important; } .pika-single .pika-title { background-color: #0f0f0f !important; color: #ffffff !important; } .pika-single .pika-table th { color: #d4d4d4 !important; background-color: #1a1a1a !important; } .pika-single .pika-table td { background-color: #0f0f0f !important; } .pika-single .pika-button { background-color: #0f0f0f !important; color: #ffffff !important; } .pika-single .pika-button:hover { background-color: #1e3a5f !important; color: #ffffff !important; } .pika-single .is-today .pika-button { color: #3db8d1 !important; font-weight: bold !important; } .pika-single .is-selected .pika-button, .pika-single .has-event .pika-button { background-color: #1e3a5f !important; color: #ffffff !important; } .pika-single .is-outside-current-month .pika-button { color: #4d4d4d !important; opacity: 0.6 !important; } .pika-single .is-disabled .pika-button { background-color: #1a1a1a !important; color: #4d4d4d !important; opacity: 0.7 !important; } /* Scrollbar */ ::-webkit-scrollbar-track { background: rgba(24, 26, 27, 0.8) !important; } ::-webkit-scrollbar-thumb { background: rgba(79, 196, 219, 0.3) !important; } ::-webkit-scrollbar-thumb:hover { background: rgba(79, 196, 219, 0.5) !important; } /* Footer */ .footer { background-color: #2E3435 !important; color: rgba(255, 255, 255, 0.5) !important; } /* Shortcuts section - dark surfaces, light text/icons */ .shortcuts-section .fw-bold { color: #ffffff !important; font-weight: 700 !important; } .shortcuts-section .btn-outline-light { color: #e2e8f0 !important; border-color: #4a5568 !important; background-color: #2d3748 !important; font-weight: 600 !important; } .shortcuts-section .btn-outline-light i { color: inherit !important; } .shortcuts-section .btn-outline-light:hover { color: #ffffff !important; background-color: #1e3a5f !important; border-color: #63b3ed !important; } /* Chart containers */ .chart-container canvas { background-color: #181A1B !important; } /* Table header styling */ .table thead th, .filter-label { color: #fff !important; font-weight: 600 !important; } /* Reserve space for entries table */ .entries-placeholder { min-height: 180px !important; } /* Global muted text - readable on dark backgrounds */ .text-muted { color: rgba(255, 255, 255, 0.78) !important; } /* Timesheet approvals legend - dark card, readable text */ #timesheetGlyphLegend { background-color: #2d3748 !important; border-color: #4a5568 !important; color: rgba(255, 255, 255, 0.9) !important; } #timesheetGlyphLegend .text-secondary { color: rgba(255, 255, 255, 0.75) !important; } /* Timesheet table: work order description subtext (small under WO number) */ .table td small.text-muted, .table td .text-muted { color: rgba(255, 255, 255, 0.82) !important; } .table td a + small.text-muted { color: rgba(255, 255, 255, 0.82) !important; } /* Dashboard: View as label and drill placeholder */ .sticky-date-bar .text-muted.small, .dashboard-welcome-block .text-muted { color: rgba(255, 255, 255, 0.85) !important; } .dashboard-drill-placeholder { color: rgba(255, 255, 255, 0.8) !important; } .dashboard-drill-panel.bg-light { background-color: #2d3748 !important; color: #e2e8f0 !important; border-color: #4a5568 !important; } /* Work order detail: customer name header (top right) */ .container-fluid .text-end.text-muted, .container-fluid .text-end.text-muted a.text-dark { color: rgba(255, 255, 255, 0.9) !important; } .container-fluid .text-end.text-muted a.text-dark:hover { color: #63b3ed !important; } /* Form controls (textarea/input) - force dark when Bootstrap or inline overrides */ textarea.form-control, .form-control[readonly] { background-color: rgba(24, 26, 27, 0.9) !important; border-color: rgba(79, 196, 219, 0.25) !important; color: #fff !important; } /* Work order tasks: summary cards and empty/alert boxes */ .wo-task-summary-card { background-color: #2d3748 !important; border-color: #4a5568 !important; } .wo-task-summary-label { color: rgba(255, 255, 255, 0.75) !important; } .wo-task-summary-value { color: #e2e8f0 !important; } .wo-task-card { background-color: #2d3748 !important; border-color: #4a5568 !important; } .wo-task-card-header { border-bottom-color: #4a5568 !important; } .wo-task-card-title { color: #e2e8f0 !important; } .wo-task-card-subtitle { color: rgba(255, 255, 255, 0.7) !important; } .wo-task-empty { background-color: #2d3748 !important; border-color: #4a5568 !important; color: rgba(255, 255, 255, 0.85) !important; } .wo-task-status.alert-secondary { background-color: #2d3748 !important; border-color: #4a5568 !important; color: rgba(255, 255, 255, 0.85) !important; } /* Work order margin tab */ .wo-margin-project-header .text-muted, .wo-margin-project-header .text-dark { color: rgba(255, 255, 255, 0.9) !important; } .wo-margin-basic-info .card-header { background: #2d3748 !important; border-bottom-color: #4a5568 !important; } .wo-margin-label { color: rgba(255, 255, 255, 0.75) !important; } .wo-margin-value { color: #e2e8f0 !important; } .card .card-header.bg-light { background-color: #2d3748 !important; color: #e2e8f0 !important; border-color: #4a5568 !important; } .wo-margin-card { background-color: #2d3748 !important; border-color: #4a5568 !important; color: #e2e8f0 !important; } .wo-margin-card .wo-margin-card-icon.text-secondary, .wo-margin-card .wo-margin-card-icon.text-dark { color: rgba(255, 255, 255, 0.85) !important; } .wo-margin-card .wo-margin-card-icon.text-primary { color: #63b3ed !important; } .wo-margin-card .wo-margin-card-icon.text-info { color: #63b3ed !important; } .wo-margin-card small.text-muted { color: rgba(255, 255, 255, 0.75) !important; } .wo-margin-card .fw-bold.fs-5 { color: #a0d468 !important; } .wo-margin-card.border-success .fw-bold.fs-5, .wo-margin-card.border-success .wo-margin-card-icon { color: #68d391 !important; } .wo-margin-card.border-danger .fw-bold.fs-5, .wo-margin-card.border-danger .wo-margin-card-icon { color: #fc8181 !important; } .wo-margin-gauge { background-color: #2d3748 !important; border-color: #4a5568 !important; color: #e2e8f0 !important; } .wo-margin-gauge .text-muted { color: rgba(255, 255, 255, 0.75) !important; } #wo-detail-margin-placeholder { color: rgba(255, 255, 255, 0.78) !important; } /* Timesheet page: date input, notes textarea, hour type dropdowns (force dark; overrides inline vars) */ #date.datepicker, #date, #notes, #regularForm .form-control, #regularForm .form-select, #regularForm textarea, #timeEntriesTable .form-control, #timeEntriesTable .form-select { background-color: rgba(24, 26, 27, 0.9) !important; border-color: rgba(79, 196, 219, 0.25) !important; color: #fff !important; } #regularForm .form-control::placeholder, #notes::placeholder { color: rgba(255, 255, 255, 0.5) !important; } #regularForm .form-select option, #timeEntriesTable .form-select option { background-color: #181A1B !important; color: #fff !important; } /* Timeslice Details modal: Memo box (bg-light) and inputs */ #timesliceSystemNotesModal #time-details .bg-light.border, #timesliceSystemNotesModal #time-details .p-2.bg-light { background-color: #2d3748 !important; border-color: #4a5568 !important; color: #e2e8f0 !important; } #timesliceSystemNotesModal .form-control, #timesliceSystemNotesModal input, #timesliceSystemNotesModal textarea { background-color: rgba(24, 26, 27, 0.9) !important; border-color: rgba(79, 196, 219, 0.25) !important; color: #fff !important; } /* Sync Criteria: list-group and code (NetSuite ID etc.) readable on dark */ #timesliceSystemNotesModal .list-group-item { background-color: #1a202c !important; border-color: #4a5568 !important; color: #e2e8f0 !important; } #timesliceSystemNotesModal .list-group-item .text-muted { color: rgba(255, 255, 255, 0.75) !important; } #timesliceSystemNotesModal .list-group-item code { background-color: #2d3748 !important; color: #63b3ed !important; padding: 0.2rem 0.4rem !important; border-radius: 0.25rem !important; } /* Users table: dark hover/selected row (avoid light gray + dark text) */ #users-table tbody tr:hover td, #users-table tbody tr.odd:hover td, #users-table tbody tr.even:hover td { background-color: #3d4a5c !important; color: #e2e8f0 !important; } #users-table .user-table-filter-link { color: #63b3ed !important; } /* DataTables sort icons in headers - visible on dark */ .dataTables_wrapper thead th.sorting:before, .dataTables_wrapper thead th.sorting:after, .dataTables_wrapper thead th.sorting_asc:before, .dataTables_wrapper thead th.sorting_asc:after, .dataTables_wrapper thead th.sorting_desc:before, .dataTables_wrapper thead th.sorting_desc:after { opacity: 0.9 !important; } .dataTables_wrapper thead th { color: #fff !important; } /* Search label next to DataTables filter input */ .dataTables_wrapper .dataTables_filter label, .dataTables_wrapper .dataTables_length label { color: rgba(255, 255, 255, 0.9) !important; } /* Edit User modal: left nav and content */ #editUserModal .modal-body { background-color: #2d3748 !important; color: #e2e8f0 !important; } #editUserModal #editUserTabs { background-color: #1a202c !important; border-right-color: #4a5568 !important; } #editUserModal #editUserTabs .nav-link { color: rgba(255, 255, 255, 0.85) !important; border-bottom-color: #4a5568 !important; } #editUserModal #editUserTabs .nav-link:hover { background-color: #2d3748 !important; color: #fff !important; } #editUserModal #editUserTabs .nav-link.active { background-color: #0d6efd !important; color: #fff !important; border-right-color: #0d6efd !important; } #editUserModal .tab-content, #editUserModal .tab-pane { background-color: #2d3748 !important; color: #e2e8f0 !important; } #editUserModal .tab-pane .form-label { color: #e2e8f0 !important; } #editUserModal .field-subtext { background-color: #1a202c !important; border-color: #4a5568 !important; color: rgba(255, 255, 255, 0.9) !important; padding: 0.25rem 0.5rem !important; } #editUserModal .field-subtext.text-info { color: #63b3ed !important; border-left: 3px solid #63b3ed !important; } #editUserModal .field-subtext.text-warning { color: #ecc94b !important; border-left: 3px solid #ecc94b !important; } #editUserModal .form-check-label { color: #e2e8f0 !important; } #editUserModal .form-check-input { background-color: #2d3748 !important; border-color: #63b3ed !important; } #editUserModal .form-check-input:checked { background-color: #0d6efd !important; border-color: #0d6efd !important; } }