/* ============================================ DARK MODE - Global Theme Override Activated by [data-bs-theme="dark"] on ============================================ */ /* Completed status badge – same in light and dark */ .badge-completed { background-color: #22c55e !important; color: #ffffff !important; } /* ---- Core Bootstrap Dark Overrides ---- */ [data-bs-theme="dark"] { --bs-body-bg: #1a1d21; --bs-body-color: #d1d5db; --bs-border-color: #2d3238; --bs-secondary-bg: #22262b; --bs-tertiary-bg: #1e2227; --bs-emphasis-color: #f3f4f6; --bs-emphasis-color-rgb: 243, 244, 246; --bs-link-color: #6ea8fe; --bs-link-hover-color: #8bb9fe; --bs-code-color: #e685b5; color-scheme: dark; } /* ---- Body ---- */ [data-bs-theme="dark"] body { background-color: #1a1d21; color: #d1d5db; } /* ---- Sidebar ---- */ [data-bs-theme="dark"] .sidebar { background: linear-gradient(to bottom, #1e2227, #1a2332) !important; } [data-bs-theme="dark"] .sidebar .sidebar-brand-wrapper { background: transparent; } [data-bs-theme="dark"] .sidebar .nav .nav-item .nav-link { color: #9ca3af !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item .nav-link:hover { color: #f3f4f6 !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item .nav-link .menu-title { color: inherit !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item .nav-link .menu-icon { color: #6b7280 !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item .nav-link:hover .menu-icon { color: #9ca3af !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item.active > .nav-link { color: #fff !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item.active > .nav-link .menu-icon { color: #fff !important; } [data-bs-theme="dark"] .sidebar .nav .nav-item .nav-link .menu-arrow::before { color: #6b7280 !important; } [data-bs-theme="dark"] .sidebar .nav.sub-menu .nav-item .nav-link { color: #8b95a2 !important; } [data-bs-theme="dark"] .sidebar .nav.sub-menu .nav-item .nav-link:hover { color: #d1d5db !important; } [data-bs-theme="dark"] .sidebar .nav-profile .nav-profile-text span { color: #d1d5db !important; } [data-bs-theme="dark"] .sidebar .nav-profile .nav-link { border-bottom-color: #2d3238 !important; } /* ---- Navbar ---- */ [data-bs-theme="dark"] .navbar .navbar-menu-wrapper { background: #1a1d21 !important; border-bottom: 1px solid #2d3238; } [data-bs-theme="dark"] .navbar .navbar-menu-wrapper .navbar-toggler { color: #9ca3af !important; } [data-bs-theme="dark"] .navbar .navbar-nav .nav-link { color: #9ca3af !important; } [data-bs-theme="dark"] .navbar .navbar-nav .nav-link:hover { color: #f3f4f6 !important; } [data-bs-theme="dark"] .navbar .profile-name { color: #d1d5db !important; } /* ---- Page Body & Content ---- */ [data-bs-theme="dark"] .page-body-wrapper { background: #1a1d21 !important; } [data-bs-theme="dark"] .content-wrapper { background: #1a1d21 !important; } /* ---- Cards ---- */ [data-bs-theme="dark"] .card { background: #22262b !important; border-color: #2d3238 !important; color: #d1d5db; } [data-bs-theme="dark"] .card .card-body { color: #d1d5db; } [data-bs-theme="dark"] .card .card-title { color: #f3f4f6 !important; } [data-bs-theme="dark"] .card .card-description { color: #9ca3af !important; } [data-bs-theme="dark"] .card-header { background: #262a30 !important; border-bottom-color: #2d3238 !important; color: #d1d5db; } /* ---- Footer ---- */ [data-bs-theme="dark"] .footer { background: #1e2227 !important; border-top: 1px solid #2d3238; color: #6b7280 !important; } [data-bs-theme="dark"] .footer a { color: #6ea8fe !important; } /* ---- Forms ---- */ [data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select { background-color: #2a2e34 !important; border-color: #3d4249 !important; color: #d1d5db !important; } [data-bs-theme="dark"] .form-control::placeholder { color: #6b7280 !important; } [data-bs-theme="dark"] .form-control:focus, [data-bs-theme="dark"] .form-select:focus { background-color: #2a2e34 !important; border-color: #4a7dbd !important; color: #f3f4f6 !important; box-shadow: 0 0 0 0.2rem rgba(74, 125, 189, 0.25) !important; } [data-bs-theme="dark"] .form-control:disabled, [data-bs-theme="dark"] .form-control[readonly] { background-color: #1e2227 !important; color: #6b7280 !important; } [data-bs-theme="dark"] .form-check-input { background-color: #2a2e34; border-color: #3d4249; } [data-bs-theme="dark"] .form-check-input:checked { background-color: #4B49AC; border-color: #4B49AC; } [data-bs-theme="dark"] .input-group-text { background-color: #2a2e34 !important; border-color: #3d4249 !important; color: #9ca3af !important; } [data-bs-theme="dark"] label, [data-bs-theme="dark"] .form-label { color: #d1d5db !important; } [data-bs-theme="dark"] .form-text, [data-bs-theme="dark"] .text-muted { color: #8b95a2 !important; } /* ---- Tables ---- */ [data-bs-theme="dark"] .table { --bs-table-bg: transparent; --bs-table-color: #d1d5db; --bs-table-border-color: #2d3238; --bs-table-striped-bg: #262a30; --bs-table-hover-bg: #2a2e34; color: #d1d5db; border-color: #2d3238; } [data-bs-theme="dark"] .table thead th { background-color: #262a30 !important; color: #9ca3af !important; border-color: #2d3238 !important; } [data-bs-theme="dark"] .table td { border-color: #2d3238 !important; color: #d1d5db; } [data-bs-theme="dark"] .table-hover tbody tr:hover { background-color: #2a2e34 !important; color: #f3f4f6; } [data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: #262a30; } /* ---- Buttons ---- */ [data-bs-theme="dark"] .btn-outline-primary { color: #6ea8fe; border-color: #6ea8fe; } [data-bs-theme="dark"] .btn-outline-secondary { color: #9ca3af; border-color: #4b5563; } [data-bs-theme="dark"] .btn-outline-danger { color: #f87171; border-color: #f87171; } [data-bs-theme="dark"] .btn-outline-success { color: #34d399; border-color: #34d399; } [data-bs-theme="dark"] .btn-outline-warning { color: #fbbf24; border-color: #fbbf24; } [data-bs-theme="dark"] .btn-outline-info { color: #38bdf8; border-color: #38bdf8; } [data-bs-theme="dark"] .btn-light { background-color: #2a2e34 !important; border-color: #3d4249 !important; color: #d1d5db !important; } [data-bs-theme="dark"] .btn-light:hover { background-color: #343a40 !important; color: #f3f4f6 !important; } [data-bs-theme="dark"] .btn-inverse-primary { background-color: rgba(75, 73, 172, 0.2) !important; color: #8b89d6 !important; } [data-bs-theme="dark"] .btn-inverse-success { background-color: rgba(0, 204, 205, 0.2) !important; color: #00cccd !important; } [data-bs-theme="dark"] .btn-inverse-danger { background-color: rgba(248, 113, 113, 0.2) !important; color: #f87171 !important; } [data-bs-theme="dark"] .btn-inverse-warning { background-color: rgba(251, 191, 36, 0.2) !important; color: #fbbf24 !important; } /* Support tickets: New ticket / Back to tickets – ensure text visible in dark mode */ [data-bs-theme="dark"] .btn-support-nav { color: #f3f4f6 !important; } [data-bs-theme="dark"] .btn-support-nav:hover { color: #fff !important; } [data-bs-theme="dark"] .btn-primary.btn-support-nav { color: #fff !important; } [data-bs-theme="dark"] .btn-secondary.btn-support-nav { background-color: #3d4249 !important; border-color: #4b5563 !important; color: #e5e7eb !important; } [data-bs-theme="dark"] .btn-secondary.btn-support-nav:hover { background-color: #4b5563 !important; border-color: #6b7280 !important; color: #fff !important; } /* Live trades / table action buttons – ensure text visible in dark mode */ [data-bs-theme="dark"] .btn-info, [data-bs-theme="dark"] .btn-sm.btn-info { color: #fff !important; } [data-bs-theme="dark"] .btn-info:hover { color: #fff !important; } /* ---- Dropdowns ---- */ [data-bs-theme="dark"] .dropdown-menu { background-color: #22262b !important; border-color: #2d3238 !important; color: #d1d5db; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); } [data-bs-theme="dark"] .dropdown-item { color: #d1d5db !important; } [data-bs-theme="dark"] .dropdown-item:hover, [data-bs-theme="dark"] .dropdown-item:focus { background-color: #2a2e34 !important; color: #f3f4f6 !important; } [data-bs-theme="dark"] .dropdown-divider { border-color: #2d3238; } [data-bs-theme="dark"] .dropdown-header { color: #6b7280; } /* ---- Modals ---- */ [data-bs-theme="dark"] .modal-content { background-color: #22262b !important; border-color: #2d3238 !important; color: #d1d5db; } [data-bs-theme="dark"] .modal-header { border-bottom-color: #2d3238 !important; color: #f3f4f6; } [data-bs-theme="dark"] .modal-header .btn-close { filter: invert(1) grayscale(100%) brightness(200%); } [data-bs-theme="dark"] .modal-footer { border-top-color: #2d3238 !important; } [data-bs-theme="dark"] .modal-title { color: #f3f4f6 !important; } /* ---- Alerts ---- */ [data-bs-theme="dark"] .alert-info { background-color: rgba(56, 189, 248, 0.15) !important; border-color: rgba(56, 189, 248, 0.25) !important; color: #7dd3fc !important; } [data-bs-theme="dark"] .alert-warning { background-color: rgba(251, 191, 36, 0.15) !important; border-color: rgba(251, 191, 36, 0.25) !important; color: #fcd34d !important; } [data-bs-theme="dark"] .alert-danger { background-color: rgba(248, 113, 113, 0.15) !important; border-color: rgba(248, 113, 113, 0.25) !important; color: #fca5a5 !important; } [data-bs-theme="dark"] .alert-success { background-color: rgba(52, 211, 153, 0.15) !important; border-color: rgba(52, 211, 153, 0.25) !important; color: #6ee7b7 !important; } /* ---- Badges ---- */ [data-bs-theme="dark"] .badge-pill, [data-bs-theme="dark"] .badge { color: inherit; } [data-bs-theme="dark"] .badge.badge-warning, [data-bs-theme="dark"] .badge.bg-warning { color: #1a1d21 !important; } [data-bs-theme="dark"] .badge.badge-secondary, [data-bs-theme="dark"] .badge.bg-secondary { background-color: #4b5563 !important; color: #d1d5db !important; } /* Profile page: Active status badge – green background, black text in dark mode */ [data-bs-theme="dark"] .profile-status-badge.bg-success { background-color: #22c55e !important; color: #0f172a !important; } [data-bs-theme="dark"] .profile-status-badge.bg-danger { background-color: #dc2626 !important; color: #fff !important; } /* ---- Pagination ---- */ [data-bs-theme="dark"] .page-link { background-color: #22262b !important; border-color: #2d3238 !important; color: #9ca3af !important; } [data-bs-theme="dark"] .page-link:hover { background-color: #2a2e34 !important; color: #f3f4f6 !important; } [data-bs-theme="dark"] .page-item.active .page-link { background-color: #4B49AC !important; border-color: #4B49AC !important; color: #fff !important; } [data-bs-theme="dark"] .page-item.disabled .page-link { background-color: #1e2227 !important; border-color: #2d3238 !important; color: #4b5563 !important; } /* ---- Breadcrumbs ---- */ [data-bs-theme="dark"] .breadcrumb { background: transparent; } [data-bs-theme="dark"] .breadcrumb-item a { color: #6ea8fe !important; } [data-bs-theme="dark"] .breadcrumb-item.active { color: #9ca3af !important; } [data-bs-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { color: #6b7280; } /* ---- Nav Tabs ---- */ [data-bs-theme="dark"] .nav-tabs { border-bottom-color: #2d3238; } [data-bs-theme="dark"] .nav-tabs .nav-link { color: #9ca3af; } [data-bs-theme="dark"] .nav-tabs .nav-link:hover { border-color: #3d4249; color: #d1d5db; } [data-bs-theme="dark"] .nav-tabs .nav-link.active { background-color: #22262b; border-color: #2d3238 #2d3238 #22262b; color: #f3f4f6; } /* ---- Toast Notifications ---- */ [data-bs-theme="dark"] .toast-notification { background: #22262b !important; color: #d1d5db !important; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) !important; border-left-color: #3d4249; } [data-bs-theme="dark"] .toast-notification h6 { color: #f3f4f6 !important; } [data-bs-theme="dark"] .toast-success { border-left-color: #34d399 !important; } [data-bs-theme="dark"] .toast-error { border-left-color: #f87171 !important; } [data-bs-theme="dark"] .toast-info { border-left-color: #38bdf8 !important; } [data-bs-theme="dark"] .toast-warning { border-left-color: #fbbf24 !important; } /* ---- Text & Headings ---- */ [data-bs-theme="dark"] h1, [data-bs-theme="dark"] h2, [data-bs-theme="dark"] h3, [data-bs-theme="dark"] h4, [data-bs-theme="dark"] h5, [data-bs-theme="dark"] h6, [data-bs-theme="dark"] .h1, [data-bs-theme="dark"] .h2, [data-bs-theme="dark"] .h3, [data-bs-theme="dark"] .h4, [data-bs-theme="dark"] .h5, [data-bs-theme="dark"] .h6 { color: #f3f4f6; } [data-bs-theme="dark"] .page-title { color: #f3f4f6 !important; } [data-bs-theme="dark"] p { color: #d1d5db; } [data-bs-theme="dark"] .text-black { color: #d1d5db !important; } [data-bs-theme="dark"] .text-dark { color: #d1d5db !important; } [data-bs-theme="dark"] a { color: #6ea8fe; } [data-bs-theme="dark"] a:hover { color: #8bb9fe; } /* ---- Borders & Backgrounds ---- */ [data-bs-theme="dark"] .border { border-color: #2d3238 !important; } [data-bs-theme="dark"] .border-bottom { border-bottom-color: #2d3238 !important; } [data-bs-theme="dark"] .border-top { border-top-color: #2d3238 !important; } [data-bs-theme="dark"] .bg-light { background-color: #262a30 !important; } [data-bs-theme="dark"] .bg-white { background-color: #22262b !important; } [data-bs-theme="dark"] hr { border-color: #2d3238; opacity: 0.3; } /* ---- Auth Pages (Guest Layout) ---- */ [data-bs-theme="dark"] .auth-form-light { background: #22262b !important; color: #d1d5db; } [data-bs-theme="dark"] .auth-form-light h4 { color: #f3f4f6 !important; } [data-bs-theme="dark"] .auth-form-light h6 { color: #9ca3af !important; } [data-bs-theme="dark"] .auth .auth-form-light select { color: #d1d5db; } /* ---- Full Page Wrapper (Login/Register) ---- */ [data-bs-theme="dark"] .full-page-wrapper .content-wrapper { background: #1a1d21 !important; } /* ---- Notification Dropdown ---- */ [data-bs-theme="dark"] .notification-dropdown .dropdown-menu { background-color: #22262b !important; } [data-bs-theme="dark"] .notification-dropdown .preview-item { border-bottom-color: #2d3238 !important; } [data-bs-theme="dark"] .notification-dropdown .preview-item .preview-subject { color: #d1d5db !important; } [data-bs-theme="dark"] .notification-dropdown .preview-item .text-gray { color: #8b95a2 !important; } [data-bs-theme="dark"] .notification-dropdown .bg-light { background-color: #2a2e34 !important; } /* ---- Language Selector ---- */ [data-bs-theme="dark"] .lang-dropdown, [data-bs-theme="dark"] .lang-pill-dropdown { background: #22262b !important; border-color: #2d3238 !important; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4) !important; } [data-bs-theme="dark"] .lang-option, [data-bs-theme="dark"] .lang-pill-option { color: #d1d5db !important; } [data-bs-theme="dark"] .lang-option:hover, [data-bs-theme="dark"] .lang-pill-option:hover { background: #2a2e34 !important; color: #f3f4f6 !important; } [data-bs-theme="dark"] .lang-option.active, [data-bs-theme="dark"] .lang-pill-option.active { background: rgba(75, 73, 172, 0.15) !important; } [data-bs-theme="dark"] .lang-selector .nav-link:hover { background: #2a2e34 !important; } [data-bs-theme="dark"] .lang-pill-toggle { background: #22262b !important; border-color: #2d3238 !important; color: #9ca3af !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important; } /* ---- Support Widget Label ---- */ [data-bs-theme="dark"] .support-float-label { background: #22262b !important; color: #d1d5db !important; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important; } /* ---- KYC Page ---- */ [data-bs-theme="dark"] .kyc-step { color: #d1d5db; } [data-bs-theme="dark"] .upload-zone { background-color: #2a2e34 !important; border-color: #3d4249 !important; color: #9ca3af !important; } [data-bs-theme="dark"] .upload-zone:hover { border-color: #4B49AC !important; background-color: rgba(75, 73, 172, 0.1) !important; } /* ---- Page Header ---- */ [data-bs-theme="dark"] .page-header h3 { color: #f3f4f6 !important; } /* ---- Dashboard Cards ---- */ [data-bs-theme="dark"] .premium-card { background: #22262b !important; border-color: #2d3238 !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important; } [data-bs-theme="dark"] .stat-value { color: #f3f4f6 !important; } [data-bs-theme="dark"] .color-card h2 { color: #f3f4f6 !important; } [data-bs-theme="dark"] .color-card p, [data-bs-theme="dark"] .color-card-head, [data-bs-theme="dark"] .premium-card .text-muted { color: #9ca3af !important; } [data-bs-theme="dark"] .progress { background-color: #2a2e34 !important; } [data-bs-theme="dark"] .signal-strength-card { background: #22262b !important; border-color: #2d3238 !important; } [data-bs-theme="dark"] .signal-strength-card .progress { background: rgba(255, 255, 255, 0.1) !important; } [data-bs-theme="dark"] .signal-strength-card .progress-bar { background-color: #28a745 !important; } [data-bs-theme="dark"] .signal-strength-card h2, [data-bs-theme="dark"] .signal-strength-card h6, [data-bs-theme="dark"] .signal-strength-card p, [data-bs-theme="dark"] .signal-strength-card .color-card-head { color: #fff !important; } [data-bs-theme="dark"] .signal-strength-card .card-icon-indicator { background: rgba(40, 167, 69, 0.15) !important; color: #28a745 !important; } [data-bs-theme="dark"] .nav-tabs.nav-justified .nav-link { color: #9ca3af; background: transparent; } [data-bs-theme="dark"] .nav-tabs.nav-justified .nav-link:hover { color: #d1d5db; } [data-bs-theme="dark"] .nav-tabs.nav-justified .nav-link.active { color: #f3f4f6; background: #2a2e34; border-color: #2d3238; } [data-bs-theme="dark"] .carousel-item { background: transparent !important; } /* ---- Account Suspended Banner ---- */ [data-bs-theme="dark"] .alert-danger[style*="background: linear-gradient"] { background: rgba(248, 113, 113, 0.15) !important; } /* ---- TradingView Widget ---- */ [data-bs-theme="dark"] .tradingview-widget-container { filter: none; } /* ---- Miscellaneous ---- */ [data-bs-theme="dark"] .font-weight-light { color: #9ca3af !important; } [data-bs-theme="dark"] .sidebar-brand-wrapper { border-bottom-color: #2d3238 !important; } [data-bs-theme="dark"] .list-group-item { background-color: #22262b; border-color: #2d3238; color: #d1d5db; } [data-bs-theme="dark"] .form-check-label { color: #d1d5db !important; } [data-bs-theme="dark"] small, [data-bs-theme="dark"] .small { color: #8b95a2; } [data-bs-theme="dark"] .preview-list .preview-item { border-bottom-color: #2d3238 !important; } [data-bs-theme="dark"] ::selection { background: #4B49AC; color: #fff; } /* ---- Admin Alert Container ---- */ [data-bs-theme="dark"] #alert-container .alert { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } [data-bs-theme="dark"] #settings-alert-container .alert { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } /* ---- Settings Tabs (Admin) – inactive: light grey bg, dark grey text; active: dark bg, white text ---- */ [data-bs-theme="dark"] .settings-tabs .nav-link { border: none; border-radius: 5px; margin-right: 5px; } [data-bs-theme="dark"] .settings-tabs .nav-link:not(.active) { background-color: #c8c8c8 !important; color: #666666 !important; } [data-bs-theme="dark"] .settings-tabs .nav-link:not(.active):hover { background-color: #d1d1d1 !important; color: #555 !important; } [data-bs-theme="dark"] .settings-tabs .nav-link.active { background-color: #2d3035 !important; color: #ffffff !important; } /* ---- Plans Tabs (Admin /kingsoffice/plans) – same as settings ---- */ [data-bs-theme="dark"] #planTabs.nav-tabs .nav-link { border: none; border-radius: 5px; } [data-bs-theme="dark"] #planTabs.nav-tabs .nav-link:not(.active) { background-color: #c8c8c8 !important; color: #666666 !important; } [data-bs-theme="dark"] #planTabs.nav-tabs .nav-link:not(.active):hover { background-color: #d1d1d1 !important; color: #555 !important; } [data-bs-theme="dark"] #planTabs.nav-tabs .nav-link.active { background-color: #2d3035 !important; color: #ffffff !important; } /* ---- Deposit Tabs (Client /deposit) – same inactive look ---- */ [data-bs-theme="dark"] #depositTabs.nav-tabs .nav-link { border: none; border-radius: 5px; } [data-bs-theme="dark"] #depositTabs.nav-tabs .nav-link:not(.active) { background-color: #c8c8c8 !important; color: #666666 !important; } [data-bs-theme="dark"] #depositTabs.nav-tabs .nav-link:not(.active):hover { background-color: #d1d1d1 !important; color: #555 !important; } [data-bs-theme="dark"] #depositTabs.nav-tabs .nav-link.active { background-color: #2d3035 !important; color: #ffffff !important; } /* ---- Dark Mode Toggle Button ---- */ .dark-mode-toggle { display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 8px; border-radius: 6px; transition: background 0.2s ease; color: #6c7293; } .dark-mode-toggle:hover { background: rgba(255, 255, 255, 0.08); } .dark-mode-toggle .mdi { font-size: 22px; transition: transform 0.3s ease; } [data-bs-theme="dark"] .dark-mode-toggle { color: #fbbf24; } [data-bs-theme="dark"] .dark-mode-toggle:hover { background: #2a2e34; } /* ---- Select / Option elements ---- */ [data-bs-theme="dark"] select option { background-color: #2a2e34; color: #d1d5db; } /* ---- Accordion / Collapse ---- */ [data-bs-theme="dark"] .accordion-item { background-color: #22262b; border-color: #2d3238; } [data-bs-theme="dark"] .accordion-button { background-color: #22262b; color: #d1d5db; } [data-bs-theme="dark"] .accordion-button:not(.collapsed) { background-color: #2a2e34; color: #f3f4f6; } /* ---- Popover / Tooltip ---- */ [data-bs-theme="dark"] .popover { background-color: #22262b; border-color: #2d3238; } [data-bs-theme="dark"] .tooltip-inner { background-color: #2a2e34; color: #d1d5db; } /* ---- Scrollbar ---- */ [data-bs-theme="dark"] ::-webkit-scrollbar { width: 8px; height: 8px; } [data-bs-theme="dark"] ::-webkit-scrollbar-track { background: #1a1d21; } [data-bs-theme="dark"] ::-webkit-scrollbar-thumb { background: #3d4249; border-radius: 4px; } [data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4b5563; } /* ---- Image & Logo Adaptations ---- */ [data-bs-theme="dark"] .sidebar-brand-wrapper { background-color: transparent !important; } /* ---- Chart.js Canvas (keep readable) ---- */ [data-bs-theme="dark"] canvas { filter: brightness(0.9); } /* ---- Smooth Transitions ---- */ body, .sidebar, .navbar .navbar-menu-wrapper, .content-wrapper, .page-body-wrapper, .footer, .card, .form-control, .form-select, .dropdown-menu, .modal-content, .table, .btn, .auth-form-light { transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }