/* * Dark Mode — TradeWindow Dashboard * Activated via [data-theme="dark"] on * Palette: body #080808 | surface #101010 | elevated #181818 | border #2a2000 | text #f0e8d0 | muted #9c8860 | accent #d4a017 */ /* ─── Base ─────────────────────────────────────────────────── */ [data-theme="dark"] body { background-color: #080808; color: #f0e8d0; } [data-theme="dark"] a { color: #d4a017; } [data-theme="dark"] a:hover { color: #f0c030; } [data-theme="dark"] hr { border-color: #2a2000; } [data-theme="dark"] pre, [data-theme="dark"] code, [data-theme="dark"] blockquote { background: #101010; border-color: #2a2000; color: #f0e8d0; } /* ─── Layout: content area ──────────────────────────────────── */ [data-theme="dark"] .right-side { background-color: #080808; } [data-theme="dark"] .skin-josh .right-side > .content-header { background: linear-gradient(90deg, #0e0900 0%, #1a1000 100%); border-bottom: 1px solid #2a2000; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5); } [data-theme="dark"] .skin-josh .right-side > .content-header h1 { color: #f0e8d0; } [data-theme="dark"] .right-side > .content-header > .breadcrumb { background: transparent; } [data-theme="dark"] .right-side > .content-header > .breadcrumb > li > a { color: #d4a017; } [data-theme="dark"] .right-side > .content-header > .breadcrumb > li + li:before { color: #9c8860; } [data-theme="dark"] .right-side > .content-header > .breadcrumb > .active { color: #9c8860; } /* ─── Bootstrap Cards ───────────────────────────────────────── */ [data-theme="dark"] .card { background-color: #101010; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .card-header { background-color: #181818; border-bottom-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .card-footer { background-color: #181818; border-top-color: #2a2000; } [data-theme="dark"] .card-body { color: #f0e8d0; } [data-theme="dark"] .card-title, [data-theme="dark"] .card-subtitle { color: #f0e8d0; } /* ─── Bootstrap Panels ──────────────────────────────────────── */ [data-theme="dark"] .panel { background-color: #101010; border-color: #2a2000; } [data-theme="dark"] .panel-default { border-color: #2a2000; } [data-theme="dark"] .panel-default > .panel-heading { background-color: #181818; border-bottom-color: #2a2000; border-left: 3px solid #d4a017; color: #f0e8d0; } [data-theme="dark"] .panel-body { background-color: #101010; color: #f0e8d0; } [data-theme="dark"] .panel-footer { background-color: #181818; border-top-color: #2a2000; } [data-theme="dark"] .panel-primary > .panel-heading { background-color: #b8860b; border-color: #b8860b; } [data-theme="dark"] .panel-border { border-color: #2a2000; } [data-theme="dark"] .panel-border .panel-heading { border-bottom-color: #2a2000; } /* ─── Portlets ──────────────────────────────────────────────── */ [data-theme="dark"] .portlet.box > .portlet-body { background-color: #101010; color: #f0e8d0; } [data-theme="dark"] .portlet.box > .portlet-title { border-bottom-color: #2a2000; } /* ─── Dropdown Menus ────────────────────────────────────────── */ [data-theme="dark"] .dropdown-menu { background-color: #101010; border-color: #2a2000; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(212, 160, 23, 0.08); } [data-theme="dark"] .dropdown-menu > li > a { color: #f0e8d0; } [data-theme="dark"] .dropdown-menu > li > a:hover, [data-theme="dark"] .dropdown-menu > li > a:focus { background-color: #181818; color: #d4a017; } [data-theme="dark"] .dropdown-menu .divider, [data-theme="dark"] .dropdown-divider { background-color: #2a2000; } [data-theme="dark"] .dropdown-menu .header { background: #181818 !important; color: #f0e8d0 !important; border-bottom-color: #2a2000; } /* Notification / message dropdowns */ [data-theme="dark"] .navbar-nav > .notifications-menu > .dropdown-menu > li.header, [data-theme="dark"] .navbar-nav > .messages-menu > .dropdown-menu > li.header, [data-theme="dark"] .navbar-nav > .tasks-menu > .dropdown-menu > li.header { background-color: #181818 !important; color: #f0e8d0; border-bottom-color: #2a2000; } [data-theme="dark"] .navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a, [data-theme="dark"] .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a, [data-theme="dark"] .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a { background-color: #181818; color: #9c8860; } [data-theme="dark"] .navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a:hover, [data-theme="dark"] .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a:hover { background-color: #2a2000; } [data-theme="dark"] .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a, [data-theme="dark"] .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a { color: #f0e8d0; border-bottom-color: #2a2000; } [data-theme="dark"] .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a:hover, [data-theme="dark"] .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover { background-color: #181818; text-decoration: none; } /* User menu dropdown */ [data-theme="dark"] .navbar-nav > .user-menu > .dropdown-menu { background-color: #101010; border-color: #2a2000; } [data-theme="dark"] .navbar-nav > .user-menu > .dropdown-menu > li.user-body { border-top-color: #2a2000; border-bottom-color: #2a2000; } [data-theme="dark"] .navbar-nav > .user-menu > .dropdown-menu > li.user-footer { background-color: #181818; } [data-theme="dark"] .navbar-nav > .user-menu > .dropdown-menu > li.user-footer .btn-default { color: #f0e8d0; border-color: #2a2000; background-color: #2a2000; } [data-theme="dark"] .dropdown-menu > li.user-menu > a, [data-theme="dark"] .dropdown-menu li > a { color: #f0e8d0; } [data-theme="dark"] li.dropdown-title, [data-theme="dark"] li.dropdown-footer { background: #181818; border-color: #2a2000; color: #9c8860; } [data-theme="dark"] .dropdown-menu .message:hover { background: #181818 !important; } /* ─── Form Controls ─────────────────────────────────────────── */ [data-theme="dark"] .form-control { background-color: #101010; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .form-control:focus { background-color: #181818; border-color: #d4a017; color: #f0e8d0; box-shadow: 0 0 0 0.2rem rgba(212, 160, 23, 0.25); } [data-theme="dark"] .form-control::placeholder { color: #9c8860; } [data-theme="dark"] .form-control[disabled], [data-theme="dark"] .form-control[readonly], [data-theme="dark"] fieldset[disabled] .form-control { background-color: #181818; color: #9c8860; } [data-theme="dark"] .input-group-text, [data-theme="dark"] .input-group-addon { background-color: #181818; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .checkbox label, [data-theme="dark"] .radio label { color: #f0e8d0; } [data-theme="dark"] select.form-control option { background-color: #101010; color: #f0e8d0; } /* ─── Tables ────────────────────────────────────────────────── */ [data-theme="dark"] .table { color: #f0e8d0; } [data-theme="dark"] .table > thead > tr > th, [data-theme="dark"] .table > tbody > tr > th, [data-theme="dark"] .table > tfoot > tr > th, [data-theme="dark"] .table > thead > tr > td, [data-theme="dark"] .table > tbody > tr > td, [data-theme="dark"] .table > tfoot > tr > td, [data-theme="dark"] .table th, [data-theme="dark"] .table td { border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .table > thead > tr > th { background-color: #181818; border-bottom-color: #d4a017; } [data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) { background-color: rgba(212, 160, 23, 0.04); } [data-theme="dark"] .table-hover > tbody > tr:hover { background-color: rgba(212, 160, 23, 0.08); color: #f0e8d0; } [data-theme="dark"] .table-bordered, [data-theme="dark"] .table-bordered th, [data-theme="dark"] .table-bordered td { border-color: #2a2000; } [data-theme="dark"] .table-responsive { border-color: #2a2000; } /* ─── DataTables ────────────────────────────────────────────── */ [data-theme="dark"] .dataTables_wrapper .dataTables_filter input, [data-theme="dark"] .dataTables_wrapper .dataTables_length select { background-color: #101010; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .dataTables_wrapper .dataTables_info { color: #9c8860; } /* DataTables pagination - Bootstrap rendering */ [data-theme="dark"] .dataTables_wrapper .dataTables_paginate ul.pagination .page-link, [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.page-item .page-link, [data-theme="dark"] .pagination .page-link { background-color: #101010 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .dataTables_wrapper .dataTables_paginate ul.pagination .page-link:hover, [data-theme="dark"] .pagination .page-link:hover { background-color: #181818 !important; border-color: #d4a017 !important; color: #d4a017 !important; } [data-theme="dark"] .dataTables_wrapper .dataTables_paginate ul.pagination .page-item.active .page-link, [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.page-item.active .page-link, [data-theme="dark"] .pagination .page-item.active .page-link { background-color: #d4a017 !important; border-color: #d4a017 !important; color: #080808 !important; } [data-theme="dark"] .dataTables_wrapper .dataTables_paginate ul.pagination .page-item.disabled .page-link, [data-theme="dark"] .pagination .page-item.disabled .page-link { background-color: #0c0900 !important; border-color: #2a2000 !important; color: #9c8860 !important; } /* DataTables pagination - non-Bootstrap (simple) rendering */ [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button { background: #101010 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: #181818 !important; border-color: #d4a017 !important; color: #d4a017 !important; } [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current, [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background: #d4a017 !important; border-color: #d4a017 !important; color: #080808 !important; } [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, [data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover { background: #0c0900 !important; border-color: #2a2000 !important; color: #9c8860 !important; } /* DataTables checkboxes — gold when checked */ [data-theme="dark"] input[type="checkbox"], [data-theme="dark"] table.dataTable input[type="checkbox"], [data-theme="dark"] .dataTables_wrapper input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 16px; height: 16px; border: 2px solid rgba(212, 160, 23, 0.6); border-radius: 3px; background-color: rgba(8, 8, 8, 0.8); cursor: pointer; vertical-align: middle; flex-shrink: 0; transition: border-color 0.15s, background-color 0.15s; } [data-theme="dark"] input[type="checkbox"]:checked, [data-theme="dark"] table.dataTable input[type="checkbox"]:checked { background-color: #d4a017; border-color: #d4a017; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23080808' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M3 8l3.5 3.5 6.5-7'/%3E%3C/svg%3E"); background-size: 11px 11px; background-position: center; background-repeat: no-repeat; } [data-theme="dark"] input[type="checkbox"]:indeterminate, [data-theme="dark"] table.dataTable input[type="checkbox"]:indeterminate { background-color: #d4a017; border-color: #d4a017; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23080808' stroke-width='2.5' stroke-linecap='round' d='M4 8h8'/%3E%3C/svg%3E"); background-size: 11px 11px; background-position: center; background-repeat: no-repeat; } [data-theme="dark"] input[type="checkbox"]:hover { border-color: #f0c030; } /* ─── Modals ────────────────────────────────────────────────── */ [data-theme="dark"] .modal-content { background-color: #101010; border-color: #2a2000; border-top: 2px solid #d4a017; color: #f0e8d0; } [data-theme="dark"] .modal-header { border-bottom-color: #2a2000; } [data-theme="dark"] .modal-footer { border-top-color: #2a2000; background-color: #181818; } [data-theme="dark"] .modal-title { color: #f0e8d0; } [data-theme="dark"] .close { color: #9c8860; text-shadow: none; } [data-theme="dark"] .close:hover { color: #f0e8d0; } /* ─── Nav tabs ──────────────────────────────────────────────── */ [data-theme="dark"] .nav-tabs { border-bottom-color: #2a2000; } [data-theme="dark"] .nav-tabs > li > a, [data-theme="dark"] .nav-tabs .nav-link { color: #9c8860; border-color: transparent; } [data-theme="dark"] .nav-tabs > li > a:hover, [data-theme="dark"] .nav-tabs .nav-link:hover { color: #f0e8d0; border-color: #2a2000 #2a2000 transparent; } [data-theme="dark"] .nav-tabs > li.active > a, [data-theme="dark"] .nav-tabs > li.active > a:hover, [data-theme="dark"] .nav-tabs > li.active > a:focus, [data-theme="dark"] .nav-tabs .nav-link.active { background-color: #101010; border-color: #d4a017 #d4a017 #101010; color: #d4a017; } [data-theme="dark"] .tab-content { background-color: #101010; border-color: #2a2000; } [data-theme="dark"] .tab-content > .tab-pane { color: #f0e8d0; } /* ─── Nav pills ─────────────────────────────────────────────── */ [data-theme="dark"] .nav-pills > li > a { color: #9c8860; } [data-theme="dark"] .nav-pills > li.active > a, [data-theme="dark"] .nav-pills > li.active > a:hover, [data-theme="dark"] .nav-pills > li.active > a:focus { background-color: #d4a017; color: #080808; } /* ─── List groups ───────────────────────────────────────────── */ [data-theme="dark"] .list-group-item { background-color: #101010; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .list-group-item:hover, [data-theme="dark"] .list-group-item:focus { background-color: #181818; color: #f0e8d0; } [data-theme="dark"] a.list-group-item { color: #d4a017; } [data-theme="dark"] .list1 { background: #101010; border-bottom-color: #2a2000; color: #f0e8d0; } /* ─── Alerts ────────────────────────────────────────────────── */ [data-theme="dark"] .alert-default, [data-theme="dark"] .alert { border-color: #2a2000; } /* ─── Wells ─────────────────────────────────────────────────── */ [data-theme="dark"] .well { background-color: #101010; border-color: #2a2000; color: #f0e8d0; } /* ─── Select2 ───────────────────────────────────────────────── */ [data-theme="dark"] .select2-container--default .select2-selection--single, [data-theme="dark"] .select2-container--default .select2-selection--multiple { background-color: #101010; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered { color: #f0e8d0; } [data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #9c8860 transparent transparent transparent; } [data-theme="dark"] .select2-dropdown { background-color: #101010; border-color: #2a2000; } [data-theme="dark"] .select2-container--default .select2-results__option { color: #f0e8d0; } [data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #d4a017; color: #080808; } [data-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field { background-color: #181818; border-color: #2a2000; color: #f0e8d0; } /* Chosen */ [data-theme="dark"] .chosen-container .chosen-single, [data-theme="dark"] .chosen-container-multi .chosen-choices { background: #101010; border-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .chosen-container .chosen-drop { background: #101010; border-color: #2a2000; } [data-theme="dark"] .chosen-container .chosen-results li { color: #f0e8d0; } [data-theme="dark"] .chosen-container .chosen-results li.highlighted { background: #d4a017; color: #080808; } /* ─── Toastr notifications ──────────────────────────────────── */ [data-theme="dark"] #toast-container > .toast-info { background-color: #b8860b; } [data-theme="dark"] #toast-container > .toast-success { background-color: #16a34a; } [data-theme="dark"] #toast-container > .toast-warning { background-color: #b45309; } [data-theme="dark"] #toast-container > .toast-error { background-color: #dc2626; } /* ─── Headings and text helpers ─────────────────────────────── */ [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: #f0e8d0; } [data-theme="dark"] .text-muted { color: #9c8860 !important; } [data-theme="dark"] .panel-default > .panel-heading { color: #f0e8d0; } /* ─── Misc UI elements ──────────────────────────────────────── */ [data-theme="dark"] .page-header { border-bottom-color: #2a2000; color: #f0e8d0; } [data-theme="dark"] .progress { background-color: #181818; } [data-theme="dark"] .badge { background-color: #2a2000; color: #f0e8d0; } /* Bootstrap badge color variants */ [data-theme="dark"] .badge-primary, [data-theme="dark"] .label-primary { background-color: #b8860b !important; color: #080808 !important; } [data-theme="dark"] .badge-success, [data-theme="dark"] .label-success { background-color: #16a34a !important; color: #fff !important; } [data-theme="dark"] .badge-danger, [data-theme="dark"] .label-danger { background-color: #dc2626 !important; color: #fff !important; } [data-theme="dark"] .badge-warning, [data-theme="dark"] .label-warning { background-color: #d97706 !important; color: #fff !important; } [data-theme="dark"] .badge-info, [data-theme="dark"] .label-info { background-color: #0891b2 !important; color: #fff !important; } [data-theme="dark"] .badge-secondary { background-color: #3a3000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .badge-light { background-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .badge-dark { background-color: #080808 !important; color: #f0e8d0 !important; } [data-theme="dark"] a.badge-primary:hover, [data-theme="dark"] a.badge-primary:focus { background-color: #d4a017 !important; } [data-theme="dark"] a.badge-success:hover, [data-theme="dark"] a.badge-success:focus { background-color: #15803d !important; } [data-theme="dark"] a.badge-danger:hover, [data-theme="dark"] a.badge-danger:focus { background-color: #b91c1c !important; } [data-theme="dark"] a.badge-warning:hover, [data-theme="dark"] a.badge-warning:focus { background-color: #b45309 !important; } [data-theme="dark"] a.badge-info:hover, [data-theme="dark"] a.badge-info:focus { background-color: #0e7490 !important; } [data-theme="dark"] .label-default { background-color: #2a2000; } [data-theme="dark"] .thumbnail { background-color: #101010; border-color: #2a2000; } [data-theme="dark"] .jumbotron { background-color: #101010; color: #f0e8d0; } [data-theme="dark"] .bg-white, [data-theme="dark"] .bg-light { background-color: #101010 !important; } [data-theme="dark"] .border, [data-theme="dark"] .border-top, [data-theme="dark"] .border-bottom, [data-theme="dark"] .border-left, [data-theme="dark"] .border-right { border-color: #2a2000 !important; } [data-theme="dark"] .ccc_border { border-color: #2a2000; } [data-theme="dark"] .panel-border { border-color: #2a2000; } [data-theme="dark"] .panel-border .panel-heading { border-bottom-color: #2a2000; } /* Header wrapper */ [data-theme="dark"] body > .header { background: linear-gradient(180deg, #0a0800 0%, #120d00 100%); border-bottom: 1px solid rgba(212, 160, 23, 0.2); } /* ─── Metis menu (sidebar sub-items) ────────────────────────── */ [data-theme="dark"] .metismenu .collapse, [data-theme="dark"] .metismenu .collapsing { background: #050400; } /* ─── Toggle button ─────────────────────────────────────────── */ #dark-mode-toggle { display: flex; align-items: center; justify-content: center; height: 60px !important; padding: 0 16px !important; color: #d4a017 !important; font-size: 18px; cursor: pointer; transition: background 0.2s, opacity 0.2s; } #dark-mode-toggle:hover { background: rgba(212, 160, 23, 0.12) !important; opacity: 1; } /* ─── Sidebar toggle button (hamburger) ─────────────────────── */ [data-theme="dark"] a.navbar-btn.sidebar-toggle, [data-theme="dark"] .navbar-btn.sidebar-toggle { background: #291e03 !important; border: 1px solid #3a3000 !important; color: #d4a017 !important; box-shadow: none !important; } [data-theme="dark"] .navbar-btn.sidebar-toggle:hover { background: #2a2000 !important; border-color: #d4a017 !important; } /* The hamburger bars inside sidebar-toggle */ /*[data-theme="dark"] .navbar-btn.sidebar-toggle .responsive_nav,*/ /*[data-theme="dark"] .navbar-btn.sidebar-toggle .icon-bar {*/ /* background-color: #d4a017 !important;*/ /*}*/ [data-theme="dark"] .navbar-nav > .user-menu > .dropdown-menu > li.user-header { background: linear-gradient(135deg, #a57c09 20%, #65572e 80%) !important; } [data-theme="dark"] .text-secondary { color: #d4a017 !important; } [data-theme="dark"] .navbar-btn.sidebar-toggle .responsive_nav:before, [data-theme="dark"] .navbar-btn.sidebar-toggle .responsive_nav:after { background-color: #d4a017 !important; } /* ─── bg-light-blue (AdminLTE user dropdown header) ─────────── */ [data-theme="dark"] .bg-light-blue, [data-theme="dark"] .user-header.bg-light-blue { background: linear-gradient(135deg, #0a1200 0%, #1a1800 100%) !important; background-image: none !important; border-bottom: 1px solid #d4a017 !important; } /* ─── Navbar & Sidebar Modernization ────────────────────────── */ /* Navbar: jet black with gold shimmer */ [data-theme="dark"] .skin-josh .navbar { background: linear-gradient(266deg, #2a1e04 0%, #1a1200 100%) !important; background-image: none !important; box-shadow: 0 1px 0 rgba(212, 160, 23, 0.3), 0 2px 16px rgba(0, 0, 0, 0.7) !important; } /* Dark mode toggle icon in header navbar */ [data-theme="dark"] .header .navbar #dark-mode-toggle { color: #d4a017 !important; } [data-theme="dark"] .header .navbar #dark-mode-toggle:hover { color: #f0c030 !important; background: rgba(212, 160, 23, 0.12) !important; } /* Sidebar: deep black with subtle warm tint */ [data-theme="dark"] .skin-josh .left-side { background: linear-gradient(180deg, #2f1f0d 0%, #080600 60%, #0c0900 100%) !important; border-right: 1px solid #1a1200 !important; } /*!* Sidebar nav container - transparent *!*/ /*[data-theme="dark"] .sidebar-nav {*/ /* background: transparent !important;*/ /*}*/ /* Sidebar item hover: gold shimmer */ [data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu > li:hover { background: rgba(212, 160, 23, 0.08) !important; background-image: none !important; box-shadow: none !important; transition: background 0.2s ease !important; } /* Sidebar item active: gold left bar + warm highlight */ [data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu > li.active { background: rgba(212, 160, 23, 0.14) !important; background-image: none !important; box-shadow: inset 3px 0 0 #d4a017 !important; } /* Sidebar sub-menu (child items) */ [data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu ul, [data-theme="dark"] .sidebar .page-sidebar-menu ul, [data-theme="dark"] .metismenu ul { background: linear-gradient(135deg, #3d2616 30%, #251508 70%) !important; border-top: 0.08em solid #9b7a00 !important; } /*[data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu ul > li > a,*/ /*[data-theme="dark"] .sidebar .page-sidebar-menu ul li a {*/ /* color: #9c8860 !important;*/ /* background: transparent !important;*/ /* background-image: none !important;*/ /*}*/ [data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu ul > li > a:hover, [data-theme="dark"] .sidebar .page-sidebar-menu ul li a:hover { color: #d4a017 !important; background: rgba(212, 160, 23, 0.08) !important; } [data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu ul > li.active, [data-theme="dark"] .sidebar .page-sidebar-menu ul li.active { background: rgba(212, 160, 23, 0.12) !important; background-image: none !important; box-shadow: inset 3px 0 0 #d4a017 !important; } [data-theme="dark"] .skin-josh .sidebar .page-sidebar-menu ul > li.active > a, [data-theme="dark"] .sidebar .page-sidebar-menu ul li.active a { color: #d4a017 !important; background: transparent !important; } /* Navbar right nav hover: gold highlight */ [data-theme="dark"] .navbar-right .nav .open > a, [data-theme="dark"] .navbar-right .nav .open > a:hover, [data-theme="dark"] .navbar-right .nav .open > a:focus, [data-theme="dark"] .navbar-right .nav > li > a:hover, [data-theme="dark"] .navbar-right .nav > li > a:focus { background: rgba(212, 160, 23, 0.12) !important; background-image: none !important; } /* ─── DataTables: select-checkbox pseudo-element ─────────────── */ [data-theme="dark"] table.dataTable tbody td.select-checkbox::before, [data-theme="dark"] table.dataTable thead th.select-checkbox::before { border: 2px solid rgba(212, 160, 23, 0.6) !important; border-radius: 3px !important; background: rgba(8, 8, 8, 0.5) !important; } [data-theme="dark"] table.dataTable tbody tr.selected td.select-checkbox::before, [data-theme="dark"] table.dataTable thead th.select-checkbox::before.selected { border-color: #d4a017 !important; background: rgba(212, 160, 23, 0.15) !important; } [data-theme="dark"] table.dataTable tbody tr.selected td.select-checkbox::after { color: #d4a017 !important; text-shadow: none !important; } /* ─── DataTables: tfoot column filter inputs ──── */ [data-theme="dark"] table.dataTable tfoot input, [data-theme="dark"] table.dataTable tfoot select, [data-theme="dark"] .dataTables_wrapper tfoot input { background-color: #101010 !important; border: 1px solid #2a2000 !important; color: #f0e8d0 !important; border-radius: 3px; padding: 4px 8px; width: 100%; outline: none; } [data-theme="dark"] table.dataTable tfoot input::placeholder { color: #6b5c3a; } [data-theme="dark"] table.dataTable tfoot input:focus { border-color: #d4a017 !important; box-shadow: 0 0 0 2px rgba(212, 160, 23, 0.2) !important; } /* ─── All bare inputs without Bootstrap class ────────────────── */ [data-theme="dark"] input[type="text"]:not(.form-control):not([class]), [data-theme="dark"] input[type="email"]:not(.form-control):not([class]), [data-theme="dark"] input[type="number"]:not(.form-control):not([class]), [data-theme="dark"] input[type="tel"]:not(.form-control):not([class]), [data-theme="dark"] input[type="password"]:not(.form-control):not([class]), [data-theme="dark"] input[type="search"]:not(.form-control):not([class]), [data-theme="dark"] textarea:not(.form-control):not([class]) { background-color: #101010 !important; border: 1px solid #2a2000 !important; color: #f0e8d0 !important; } /* ─── Select elements ────────────────────────────────────────── */ [data-theme="dark"] select, [data-theme="dark"] select.form-control { background-color: #101010 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } /* ─── Buttons ────────────────────────────────────────────────── */ /* Neutral: btn-default / btn-light / btn-white */ [data-theme="dark"] .btn-default, [data-theme="dark"] .btn-light, [data-theme="dark"] .btn-white { background-color: #181818 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .btn-default:hover, [data-theme="dark"] .btn-light:hover, [data-theme="dark"] .btn-white:hover { background-color: #2a2000 !important; border-color: #3a3000 !important; color: #f0e8d0 !important; } /* btn-secondary: subtle warm dark */ [data-theme="dark"] .btn-secondary { background-color: #1e1800 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .btn-secondary:hover, [data-theme="dark"] .btn-secondary:focus { background-color: #2a2000 !important; border-color: #3a3000 !important; color: #f0c030 !important; } /* btn-primary: rich gold with dark text — premium feel */ [data-theme="dark"] .btn-primary { background-color: #d4a017 !important; border-color: #d4a017 !important; color: #080808 !important; font-weight: 600 !important; } [data-theme="dark"] .btn-primary:hover, [data-theme="dark"] .btn-primary:focus, [data-theme="dark"] .btn-primary:active, [data-theme="dark"] .btn-primary:not(:disabled):not(.disabled):active, [data-theme="dark"] .show > .btn-primary.dropdown-toggle { background-color: #f0c030 !important; border-color: #f0c030 !important; color: #080808 !important; box-shadow: 0 0 0 0.2rem rgba(212, 160, 23, 0.4) !important; } /* btn-success: emerald green */ [data-theme="dark"] .btn-success { background-color: #16a34a !important; border-color: #16a34a !important; color: #fff !important; } [data-theme="dark"] .btn-success:hover, [data-theme="dark"] .btn-success:focus, [data-theme="dark"] .btn-success:active, [data-theme="dark"] .btn-success:not(:disabled):not(.disabled):active, [data-theme="dark"] .show > .btn-success.dropdown-toggle { background-color: #15803d !important; border-color: #15803d !important; color: #fff !important; box-shadow: 0 0 0 0.2rem rgba(22, 163, 74, 0.35) !important; } /* btn-danger: red */ [data-theme="dark"] .btn-danger { background-color: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important; } [data-theme="dark"] .btn-danger:hover, [data-theme="dark"] .btn-danger:focus, [data-theme="dark"] .btn-danger:active, [data-theme="dark"] .btn-danger:not(:disabled):not(.disabled):active, [data-theme="dark"] .show > .btn-danger.dropdown-toggle { background-color: #b91c1c !important; border-color: #b91c1c !important; color: #fff !important; box-shadow: 0 0 0 0.2rem rgba(220, 38, 38, 0.35) !important; } /* btn-warning: amber */ [data-theme="dark"] .btn-warning { background-color: #d97706 !important; border-color: #d97706 !important; color: #fff !important; } [data-theme="dark"] .btn-warning:hover, [data-theme="dark"] .btn-warning:focus, [data-theme="dark"] .btn-warning:active, [data-theme="dark"] .btn-warning:not(:disabled):not(.disabled):active, [data-theme="dark"] .show > .btn-warning.dropdown-toggle { background-color: #b45309 !important; border-color: #b45309 !important; color: #fff !important; box-shadow: 0 0 0 0.2rem rgba(217, 119, 6, 0.35) !important; } /* btn-info: cyan */ [data-theme="dark"] .btn-info { background-color: #0891b2 !important; border-color: #0891b2 !important; color: #fff !important; } [data-theme="dark"] .btn-info:hover, [data-theme="dark"] .btn-info:focus, [data-theme="dark"] .btn-info:active, [data-theme="dark"] .btn-info:not(:disabled):not(.disabled):active, [data-theme="dark"] .show > .btn-info.dropdown-toggle { background-color: #0e7490 !important; border-color: #0e7490 !important; color: #fff !important; box-shadow: 0 0 0 0.2rem rgba(8, 145, 178, 0.35) !important; } /* btn-dark: deep black */ [data-theme="dark"] .btn-dark { background-color: #101010 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .btn-dark:hover, [data-theme="dark"] .btn-dark:focus { background-color: #080808 !important; border-color: #3a3000 !important; color: #f0c030 !important; } /* btn-link: gold accent */ [data-theme="dark"] .btn-link { color: #d4a017 !important; } [data-theme="dark"] .btn-link:hover, [data-theme="dark"] .btn-link:focus { color: #f0c030 !important; } /* Outline buttons */ [data-theme="dark"] .btn-outline-primary { color: #d4a017 !important; border-color: #d4a017 !important; background-color: transparent !important; } [data-theme="dark"] .btn-outline-primary:hover, [data-theme="dark"] .btn-outline-primary:focus { background-color: #d4a017 !important; border-color: #d4a017 !important; color: #080808 !important; } [data-theme="dark"] .btn-outline-success { color: #4ade80 !important; border-color: #16a34a !important; background-color: transparent !important; } [data-theme="dark"] .btn-outline-success:hover, [data-theme="dark"] .btn-outline-success:focus { background-color: #16a34a !important; border-color: #16a34a !important; color: #fff !important; } [data-theme="dark"] .btn-outline-danger { color: #f87171 !important; border-color: #dc2626 !important; background-color: transparent !important; } [data-theme="dark"] .btn-outline-danger:hover, [data-theme="dark"] .btn-outline-danger:focus { background-color: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important; } [data-theme="dark"] .btn-outline-warning { color: #fbbf24 !important; border-color: #d97706 !important; background-color: transparent !important; } [data-theme="dark"] .btn-outline-warning:hover, [data-theme="dark"] .btn-outline-warning:focus { background-color: #d97706 !important; border-color: #d97706 !important; color: #fff !important; } [data-theme="dark"] .btn-outline-info { color: #22d3ee !important; border-color: #0891b2 !important; background-color: transparent !important; } [data-theme="dark"] .btn-outline-info:hover, [data-theme="dark"] .btn-outline-info:focus { background-color: #0891b2 !important; border-color: #0891b2 !important; color: #fff !important; } [data-theme="dark"] .btn-outline-secondary { color: #9c8860 !important; border-color: #2a2000 !important; background-color: transparent !important; } [data-theme="dark"] .btn-outline-secondary:hover { background-color: #2a2000 !important; color: #f0e8d0 !important; } /* Disabled buttons */ [data-theme="dark"] .btn:disabled, [data-theme="dark"] .btn.disabled { opacity: 0.55 !important; cursor: not-allowed !important; } /* ─── DataTables selected row ────────────────────────────────── */ [data-theme="dark"] table.dataTable tbody tr.selected, [data-theme="dark"] table.dataTable tbody tr.selected > td { background-color: rgba(212, 160, 23, 0.15) !important; color: #f0e8d0 !important; } [data-theme="dark"] table.dataTable tbody tr.selected:hover > td { background-color: rgba(212, 160, 23, 0.22) !important; } /* ─── DataTables Editor (DTE) modal ─────────────────────────── */ [data-theme="dark"] .DTED_Lightbox_Background { background: rgba(0, 0, 0, 0.85) !important; } [data-theme="dark"] .DTED_Lightbox_Wrapper .DTE { background: #101010 !important; color: #f0e8d0 !important; border-top: 2px solid #d4a017 !important; } [data-theme="dark"] .DTE_Header, [data-theme="dark"] .DTE_Header_Content { background: #181818 !important; color: #f0e8d0 !important; border-bottom-color: #2a2000 !important; } [data-theme="dark"] .DTE_Footer { background: #181818 !important; border-top-color: #2a2000 !important; } [data-theme="dark"] .DTE_Form_Content { background: #101010 !important; } [data-theme="dark"] .DTE_Field_Info, [data-theme="dark"] .DTE_Label { color: #9c8860 !important; } [data-theme="dark"] .DTE_Field input, [data-theme="dark"] .DTE_Field select, [data-theme="dark"] .DTE_Field textarea { background-color: #080808 !important; border-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .DTE_Field input:focus, [data-theme="dark"] .DTE_Field select:focus, [data-theme="dark"] .DTE_Field textarea:focus { border-color: #d4a017 !important; box-shadow: 0 0 0 2px rgba(212, 160, 23, 0.2) !important; } /* ─── Chosen.js: text color inside single selection ─────────── */ [data-theme="dark"] .chosen-container-single .chosen-single span { color: #f0e8d0 !important; } [data-theme="dark"] .chosen-container .chosen-single div b { filter: invert(1) brightness(2); } [data-theme="dark"] .chosen-container .chosen-results li.no-results { background: #181818 !important; color: #9c8860 !important; } /* ─── Table row hover ────────────────────────────────────────── */ [data-theme="dark"] table.dataTable tbody tr:hover > td { background-color: rgba(212, 160, 23, 0.06) !important; } /* ─── Dashboard stat cards ─────── */ /* lightbluebg: deep navy — distinct from goldbg */ [data-theme="dark"] .lightbluebg { background: linear-gradient(135deg, #0a1628 0%, #102040 100%) !important; border: 1px solid rgba(96, 165, 250, 0.2) !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(96, 165, 250, 0.06) !important; color: #c8deff !important; } [data-theme="dark"] .redbg { background: linear-gradient(135deg, #7f1d1d 0%, #b91c1c 100%) !important; border: 1px solid rgba(248, 113, 113, 0.22) !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important; color: #fecaca !important; } [data-theme="dark"] .goldbg { background: linear-gradient(135deg, #3a2800 0%, #6b4a00 100%) !important; border: 1px solid rgba(212, 160, 23, 0.35) !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), 0 0 20px rgba(212, 160, 23, 0.08) !important; color: #fde68a !important; } [data-theme="dark"] .palebluecolorbg, [data-theme="dark"] .greenbgs { background: linear-gradient(135deg, #14532d 0%, #166534 100%) !important; border: 1px solid rgba(74, 222, 128, 0.22) !important; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important; color: #bbf7d0 !important; } [data-theme="dark"] .bluebg { background: linear-gradient(135deg, #101010 0%, #1a1800 100%) !important; border: 1px solid rgba(156, 136, 96, 0.22) !important; color: #f0e8d0 !important; } [data-theme="dark"] .palered { background: linear-gradient(135deg, #7f1d1d 0%, #991b1b 100%) !important; color: #fecaca !important; } /* keep the inner numbers/labels readable */ [data-theme="dark"] .lightbluebg .number, [data-theme="dark"] .redbg .number, [data-theme="dark"] .goldbg .number, [data-theme="dark"] .palebluecolorbg .number, [data-theme="dark"] .greenbgs .number, [data-theme="dark"] .lightbluebg span, [data-theme="dark"] .redbg span, [data-theme="dark"] .goldbg span, [data-theme="dark"] .palebluecolorbg span { color: #fff !important; } [data-theme="dark"] .lightbluebg a, [data-theme="dark"] .lightbluebg, [data-theme="dark"] .lightbluebg span, [data-theme="dark"] .lightbluebg .number { color: #c8deff !important; } [data-theme="dark"] .redbg a, [data-theme="dark"] .goldbg a { color: #fff !important; } /* ─── Back-to-top button ────────────────────────────────────── */ [data-theme="dark"] #back-to-top.btn-primary { background-color: #2a2000 !important; border-color: #d4a017 !important; color: #d4a017 !important; } [data-theme="dark"] #back-to-top.btn-primary:hover { background-color: #d4a017 !important; color: #080808 !important; } /* ─── Bootstrap bg-* utility overrides ─────────────────────── */ [data-theme="dark"] .text-primary { color: #d4a017 !important; } [data-theme="dark"] a.text-primary:hover { color: #f0c030 !important; } [data-theme="dark"] .bg-primary { background-color: #b8860b !important; color: #080808 !important; } [data-theme="dark"] .bg-secondary { background-color: #2a2000 !important; color: #f0e8d0 !important; } [data-theme="dark"] .bg-success { background-color: #15803d !important; color: #fff !important; } [data-theme="dark"] .bg-danger { background-color: #b91c1c !important; color: #fff !important; } [data-theme="dark"] .bg-warning { background-color: #b45309 !important; color: #fff !important; } [data-theme="dark"] .bg-info { background-color: #0e7490 !important; color: #fff !important; } [data-theme="dark"] .bg-dark { background-color: #080808 !important; color: #f0e8d0 !important; } /* card-heading with bg-* still needs text contrast */ [data-theme="dark"] .card-heading.bg-primary, [data-theme="dark"] .card-header.bg-primary { background-color: #1a1200 !important; border-bottom: 1px solid #d4a017 !important; color: #d4a017 !important; } /* ─── Chart canvases ────────────────────────────────────────── */ [data-theme="dark"] canvas { filter: brightness(1.05); } /* ─── Livicon (SVG): breadcrumb icon ────────────────────────── */ [data-theme="dark"] .breadcrumb .livicon svg path, [data-theme="dark"] .breadcrumb .livicon svg g, [data-theme="dark"] .breadcrumb-item .livicon svg path, [data-theme="dark"] .breadcrumb-item .livicon svg g, [data-theme="dark"] .breadcrumb a .livicon svg path, [data-theme="dark"] .breadcrumb a .livicon svg g { fill: #9c8860 !important; stroke: #9c8860 !important; } [data-theme="dark"] .value_button { background: #080808 !important; } [data-theme="dark"] .breadcrumb a:hover .livicon svg path, [data-theme="dark"] .breadcrumb a:hover .livicon svg g { fill: #d4a017 !important; stroke: #d4a017 !important; }