/* ============================================================================ GrowthPath CRM — Dark Theme Applied via body.dark-theme class, toggled by localStorage('GrowthPathTheme') ============================================================================ */ /* Pre-paint rule: set by inline script before DOMContentLoaded so navigations/reloads don't flash light before JS can add body.dark-theme. */ html.dark-theme-preload, html.dark-theme-preload body { background-color: #121212; color: #f8f9fa; } /* ── Base ── */ body.dark-theme { background-color: #121212; color: #f8f9fa; } body.dark-theme a { color: #9ecbff; } /* ── Navbar (used by _LayoutPublic and mobile top bar) ── */ body.dark-theme .navbar { background-color: #1f1f1f !important; color: #f8f9fa; border-color: #333 !important; } body.dark-theme .navbar .nav-link, body.dark-theme .navbar-brand { color: #f8f9fa !important; } body.dark-theme .navbar .nav-link:hover { color: #ffc107 !important; } body.dark-theme .dropdown-menu { background-color: #222 !important; border-color: #333 !important; } body.dark-theme .dropdown-item { color: #f8f9fa !important; } body.dark-theme .dropdown-item:hover { background-color: #333 !important; color: #ffc107 !important; } /* ── Cards & Modals ── */ body.dark-theme .card, body.dark-theme .modal-content { background-color: #1e1e1e; color: #f8f9fa; border-color: #333; } body.dark-theme .card-header { background-color: #252525 !important; border-color: #333 !important; } /* ── Forms ── */ body.dark-theme .form-control, body.dark-theme .form-select { background-color: #222; color: #f8f9fa; border-color: #555; } body.dark-theme .form-control:focus, body.dark-theme .form-select:focus { background-color: #262626; color: #fff; border-color: #007bff; } body.dark-theme .form-control:disabled, body.dark-theme .form-control[readonly] { background-color: #1a1a1a; color: #adb5bd; } body.dark-theme .form-check-input { background-color: #333; border-color: #555; } body.dark-theme .form-check-input:checked { background-color: #0d6efd; border-color: #0d6efd; } body.dark-theme .input-group-text { background-color: #2a2a2a; color: #f8f9fa; border-color: #555; } /* ── Footer ── */ body.dark-theme footer { background-color: #1a1a1a; color: #aaa; } /* ── Text Overrides ── */ body.dark-theme .text-dark { color: #f8f9fa !important; } body.dark-theme .text-muted { color: #adb5bd !important; } body.dark-theme .text-black { color: #f8f9fa !important; } /* ── Tables ── */ body.dark-theme .table { color: #f8f9fa !important; --bs-table-bg: #1e1e1e; --bs-table-hover-bg: #2a2a2a; --bs-table-striped-bg: #232323; --bs-table-hover-color: #f8f9fa; --bs-table-color: #f8f9fa; } body.dark-theme .table th, body.dark-theme .table td { color: #f8f9fa !important; } body.dark-theme .table-light { --bs-table-bg: #252525; --bs-table-color: #f8f9fa; } body.dark-theme .table-light th, body.dark-theme .table-light td { color: #f8f9fa !important; } body.dark-theme .table-dark { --bs-table-bg: #1a1a1a; --bs-table-color: #f8f9fa; } body.dark-theme .table-warning { --bs-table-bg: #3d3520; --bs-table-color: #f8f9fa; } body.dark-theme .table-warning td { color: #f8f9fa !important; } body.dark-theme .table-danger { --bs-table-bg: #3d2020; --bs-table-color: #f8f9fa; } body.dark-theme .table-danger td { color: #f8f9fa !important; } body.dark-theme .table-hover > tbody > tr:hover > * { color: #f8f9fa !important; --bs-table-hover-color: #f8f9fa; } /* ── Lists ── */ body.dark-theme .list-group-item { background-color: #1e1e1e; color: #f8f9fa !important; border-color: #333; } body.dark-theme .list-group-item:hover { background-color: #2a2a2a; } body.dark-theme .list-group-item-action { color: #f8f9fa !important; } body.dark-theme .list-group-item-action:hover, body.dark-theme .list-group-item-action:focus { background-color: #2a2a2a; color: #f8f9fa !important; } body.dark-theme .list-group-item .fw-semibold { color: #f8f9fa !important; } /* ── Background Overrides ── */ body.dark-theme .bg-light { background-color: #252525 !important; } body.dark-theme .bg-white { background-color: #1e1e1e !important; } body.dark-theme .bg-body { background-color: #121212 !important; } /* ── Alerts ── */ body.dark-theme .alert-success { background-color: #1a3d2a; border-color: #2a5a3a; color: #a3d9b1; } body.dark-theme .alert-danger { background-color: #3d1a1a; border-color: #5a2a2a; color: #d9a3a3; } body.dark-theme .alert-warning { background-color: #3d351a; border-color: #5a4a2a; color: #d9cfa3; } body.dark-theme .alert-info { background-color: #1a2d3d; border-color: #2a4a5a; color: #a3c8d9; } /* ── Badges ── */ body.dark-theme .badge.bg-info { background-color: #0dcaf0 !important; color: #000 !important; } body.dark-theme .badge.bg-warning { background-color: #ffc107 !important; color: #000 !important; } body.dark-theme .badge.bg-light { background-color: #333 !important; color: #f8f9fa !important; } /* ── Borders ── */ body.dark-theme .border { border-color: #333 !important; } body.dark-theme .border-bottom { border-color: #333 !important; } body.dark-theme hr { border-color: #444; opacity: 0.5; } /* ── Focus States ── */ body.dark-theme .btn:focus, body.dark-theme .form-control:focus, body.dark-theme .form-check-input:focus { box-shadow: 0 0 0 0.1rem #333, 0 0 0 0.25rem #258cfb; } /* ── Breadcrumb / Pagination ── */ body.dark-theme .breadcrumb { background-color: #1e1e1e; } body.dark-theme .page-link { background-color: #222; color: #9ecbff; border-color: #333; } body.dark-theme .page-item.active .page-link { background-color: #0d6efd; border-color: #0d6efd; } /* ── Accordion ── */ body.dark-theme .accordion-button { background-color: #252525; color: #f8f9fa; } body.dark-theme .accordion-button:not(.collapsed) { background-color: #2a2a2a; color: #9ecbff; } body.dark-theme .accordion-body { background-color: #1e1e1e; } /* ── Sidebar (added for sidebar nav redesign) ── */ body.dark-theme .gp-sidebar { background-color: #1a1a1a !important; border-color: #333 !important; } body.dark-theme .gp-sidebar-header { border-color: #333 !important; } body.dark-theme .gp-sidebar-nav .nav-link { color: #adb5bd; } body.dark-theme .gp-sidebar-nav .nav-link:hover { color: #f8f9fa; background-color: #252525; } body.dark-theme .gp-sidebar-nav .nav-link.active { color: #fff; background-color: #2a2a2a; border-left-color: #0d6efd; } body.dark-theme .gp-sidebar-section-label { color: #6c757d; } body.dark-theme .gp-sidebar-footer { border-color: #333 !important; } body.dark-theme .gp-mobile-topbar { background-color: #1a1a1a !important; border-color: #333 !important; } /* ── Tab Bar ── */ body.dark-theme .gp-tabbar { background-color: #1a1a1a; border-color: #333; } body.dark-theme .gp-tab { color: #adb5bd; border-right-color: #333; } body.dark-theme .gp-tab:hover { background-color: #252525; color: #f8f9fa; } body.dark-theme .gp-tab.active { background-color: #1e1e1e; color: #9ecbff; box-shadow: inset 0 -2px 0 0 #0d6efd; } body.dark-theme .gp-tab-close { color: #6c757d; } body.dark-theme .gp-tab-close:hover { background: #dc3545; color: #fff; } body.dark-theme .gp-breadcrumb { background-color: #1a1a1a; border-color: #333; } body.dark-theme .gp-breadcrumb .gp-crumb-current { color: #e0e0e0; }