/* Dark Mode Override for Color Admin v2.1 Toggled via .dark-mode class on */ body.dark-mode, body.dark-mode #page-loader { background: #1a1d21; color: #c8c9cb; } body.dark-mode .logo-light { display: none; } body.dark-mode .logo-dark { display: block !important; } body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, body.dark-mode h4, body.dark-mode h5, body.dark-mode h6, body.dark-mode label { color: #e0e0e0; } body.dark-mode a:not(.btn):not(.label):not(.badge) { color: #d4d4d4; } body.dark-mode .header.navbar { background: #1f2226; border-bottom-color: #2d3035; } body.dark-mode .header.navbar .navbar-nav > li > a { color: #c8c9cb; } body.dark-mode .header.navbar .navbar-nav > li > a:hover, body.dark-mode .header.navbar .navbar-nav > li > a:focus { color: #fff; background: #2d3035; } body.dark-mode .navbar-default .navbar-nav > .open > a, body.dark-mode .navbar-default .navbar-nav > .open > a:hover, body.dark-mode .navbar-default .navbar-nav > .open > a:focus { background: #2d3035; color: #fff; } body.dark-mode .navbar-user .dropdown-menu { background: #2d3035; border-color: #3a3f45; } body.dark-mode .navbar-user .dropdown-menu > li > a { color: #c8c9cb; } body.dark-mode .navbar-user .dropdown-menu > li > a:hover { background: #1f2226; color: #fff; } body.dark-mode .navbar-user .dropdown-menu .arrow { border-bottom-color: #2d3035; } body.dark-mode .sidebar { background: #16191d; } body.dark-mode .sidebar .nav > li > a { color: #a0a5ab; } body.dark-mode .sidebar .nav > li > a:hover { background: #1f2226; color: #fff; } body.dark-mode .sidebar .nav > li.active > a, body.dark-mode .sidebar .nav > li.active > a:focus, body.dark-mode .sidebar .nav > li.active > a:hover { background: #f59c1a; color: #fff; } body.dark-mode .sidebar .sub-menu { background: #1a1d21; } body.dark-mode .sidebar .sub-menu > li > a { color: #8a8f95; } body.dark-mode .sidebar .sub-menu > li > a:hover { color: #fff; background: #1f2226; } body.dark-mode .sidebar .sub-menu > li.active > a { color: #f59c1a; } body.dark-mode .sidebar-bg { background: #16191d; } body.dark-mode #content { background: #1a1d21; } body.dark-mode .panel { background: #2d3035; border-color: #3a3f45; } body.dark-mode .panel-heading { background: #262a2e; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .panel-footer { background: #262a2e; border-color: #3a3f45; } body.dark-mode .panel-default > .panel-heading { background: #262a2e; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .table { color: #e0e0e0; } body.dark-mode .table > thead > tr > th { background: #1e2226; border-color: #4a5058; color: #e0e0e0; } body.dark-mode .table > tbody > tr > td, body.dark-mode .table > tbody > tr > th { border-color: #4a5058; background: #2d3035; } body.dark-mode .table > tbody > tr:hover > td { background: #3a3f45; } body.dark-mode .table-bordered, body.dark-mode .table-bordered > thead > tr > th, body.dark-mode .table-bordered > tbody > tr > td, body.dark-mode .table-bordered > tbody > tr > th, body.dark-mode .table-bordered > tfoot > tr > th, body.dark-mode .table-bordered > tfoot > tr > td { border-color: #4a5058; } body.dark-mode .table > tfoot > tr > th, body.dark-mode .table > tfoot > tr > td { background: #1e2226; border-color: #4a5058; color: #e0e0e0; } body.dark-mode .table-striped > tbody > tr:nth-child(odd) > td { background: #282b30; } body.dark-mode .table-striped.table-bordered > tbody > tr:nth-child(odd) > td { background: #282b30; } body.dark-mode .table > tbody > tr.active > td { background: #3a3f45; } body.dark-mode .form-control { background: #1e2226; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .form-control:focus { border-color: #5b6269; box-shadow: none; } body.dark-mode .input-group-addon { background: #262a2e; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .well { background: #1e2226; border-color: #3a3f45; } body.dark-mode .breadcrumb { background: #262a2e; } body.dark-mode .breadcrumb > li a { color: #d4d4d4; } body.dark-mode .breadcrumb > .active { color: #c8c9cb; } body.dark-mode .modal-content { background: #2d3035; border-color: #3a3f45; } body.dark-mode .modal-header { border-color: #3a3f45; } body.dark-mode .modal-footer { border-color: #3a3f45; } body.dark-mode .close { color: #fff; text-shadow: none; opacity: .6; } body.dark-mode .close:hover { opacity: 1; } body.dark-mode .text-muted { color: #8a8f95 !important; } body.dark-mode .text-inverse { color: #e0e0e0 !important; } body.dark-mode .page-header { border-color: #3a3f45; } body.dark-mode .dropdown-menu { background: #2d3035; border-color: #3a3f45; } body.dark-mode .dropdown-menu > li > a { color: #c8c9cb; } body.dark-mode .dropdown-menu > li > a:hover { background: #1f2226; color: #fff; } body.dark-mode .dropdown-divider { background: #3a3f45; } body.dark-mode .nav-tabs { border-color: #3a3f45; } body.dark-mode .nav-tabs > li > a { color: #c8c9cb; } body.dark-mode .nav-tabs > li > a:hover { background: #262a2e; border-color: #3a3f45; } body.dark-mode .nav-tabs > li.active > a, body.dark-mode .nav-tabs > li.active > a:focus, body.dark-mode .nav-tabs > li.active > a:hover { background: #2d3035; border-color: #3a3f45; border-bottom-color: #2d3035; color: #e0e0e0; } body.dark-mode .tab-content { background: #2d3035; border-color: #3a3f45; } body.dark-mode .pagination > li > a, body.dark-mode .pagination > li > span { background: #262a2e; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .pagination > li > a:hover { background: #34383e; } body.dark-mode .pagination > .active > a, body.dark-mode .pagination > .active > span { background: #f59c1a; border-color: #f59c1a; } body.dark-mode .btn-default { background: #34383e; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .btn-default:hover { background: #3e444b; border-color: #4a5058; color: #fff; } body.dark-mode .btn-white { background: #2d3035; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .btn-white:hover { background: #34383e; border-color: #4a5058; } body.dark-mode .progress { background: #1e2226; } body.dark-mode .alert { border-color: #3a3f45; } body.dark-mode .alert-success { background: #1e3a2a; color: #8bda9b; } body.dark-mode .alert-info { background: #1a3344; color: #8bc4ea; } body.dark-mode .alert-warning { background: #3a3220; color: #e8c97a; } body.dark-mode .alert-danger { background: #3a1e20; color: #e88a8a; } body.dark-mode .label-default { background: #3a3f45; } body.dark-mode .btn-primary { background: #3482c4; border-color: #2a6ea8; } body.dark-mode .btn-info { background: #2d8fa8; border-color: #24788d; } body.dark-mode .btn-success { background: #2d8f4d; border-color: #24783d; } body.dark-mode .btn-warning { background: #c49a34; border-color: #a8852a; } body.dark-mode .btn-danger { background: #c43e3e; border-color: #a82a2a; } body.dark-mode .list-group-item { background: #2d3035; border-color: #3a3f45; } body.dark-mode .list-group-item.active { background: #f59c1a; border-color: #f59c1a; } body.dark-mode .thumbnail { background: #2d3035; border-color: #3a3f45; } body.dark-mode .jumbotron { background: #262a2e; } body.dark-mode .bg-white { background: #2d3035 !important; } body.dark-mode .bg-silver { background: #262a2e !important; } body.dark-mode .bg-grey { background: #3a3f45 !important; } body.dark-mode hr { border-color: #3a3f45; } body.dark-mode .subscribe-bar { background: #1f2226; border-color: #2d3035; } body.dark-mode .footer { border-color: #2d3035; color: #8a8f95; } body.dark-mode .table > tbody > tr.info > td { background: #1a3344; } body.dark-mode .table > tbody > tr.success > td { background: #1e3a2a; } body.dark-mode .table > tbody > tr.warning > td { background: #3a3220; } body.dark-mode .table > tbody > tr.danger > td { background: #3a1e20; } body.dark-mode .switchery { background-color: #1e2226 !important; border-color: #3a3f45 !important; } body.dark-mode .select2-container--default .select2-selection--single, body.dark-mode .select2-container--default .select2-selection--multiple { background: #1e2226; border-color: #3a3f45; } body.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered { color: #e0e0e0; } body.dark-mode .select2-dropdown { background: #2d3035; border-color: #3a3f45; } body.dark-mode .select2-container--default .select2-results__option[aria-selected=true] { background: #1f2226; } body.dark-mode .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #f59c1a; color: #fff; } body.dark-mode .ui-widget-content { background: #2d3035; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .ui-widget-header { background: #262a2e; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .ui-state-default, body.dark-mode .ui-widget-content .ui-state-default { background: #34383e; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .ui-state-hover, body.dark-mode .ui-widget-content .ui-state-hover { background: #3e444b; } body.dark-mode .ui-datepicker table td span, body.dark-mode .ui-datepicker table td a { color: #c8c9cb; } body.dark-mode .ui-datepicker table td.ui-datepicker-today a { background: #f59c1a; color: #fff; } body.dark-mode td.ui-datepicker-unselectable.ui-state-disabled { background: #262a2e; } body.dark-mode .login { background: #2d3035; border-color: #3a3f45; } body.dark-mode .login-cover-bg { background: rgba(0,0,0,0.7); } body.dark-mode .login-header .icon { background: #34383e; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .login-header .brand { color: #e0e0e0; } body.dark-mode .introjs-overlay { background: #000 !important; } body.dark-mode .introjs-helperLayer { background: #2d3035 !important; border-color: #3a3f45 !important; } body.dark-mode .introjs-tooltip { background: #2d3035 !important; color: #c8c9cb !important; } body.dark-mode .introjs-tooltiptext { color: #c8c9cb !important; } body.dark-mode .introjs-button { background: #34383e !important; border-color: #3a3f45 !important; color: #e0e0e0 !important; text-shadow: none !important; } body.dark-mode .introjs-button:hover { background: #3e444b !important; } body.dark-mode #toast-container > div { opacity: 0.95 !important; } body.dark-mode .toast { background: #1f2226 !important; } body.dark-mode .popover { background: #2d3035; border-color: #3a3f45; } body.dark-mode .popover-title { background: #262a2e; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .popover > .arrow:after { border-color: #2d3035; } body.dark-mode .tooltip-inner { background: #1f2226; color: #e0e0e0; } body.dark-mode .table > tbody > tr.row-highlight > td { background: #34383e; } body.dark-mode .note-editor.note-frame { border-color: #3a3f45; } body.dark-mode .note-editor.note-frame .note-editing-area .note-editable { background: #1e2226; color: #c8c9cb; } body.dark-mode .note-editor.note-frame .note-statusbar { background: #262a2e; border-color: #3a3f45; } body.dark-mode .note-toolbar { background: #262a2e; border-color: #3a3f45; } body.dark-mode .btn-default.active, body.dark-mode .btn-default:active, body.dark-mode .btn-default.active:hover, body.dark-mode .btn-default:active:hover { background: #3e444b; border-color: #4a5058; color: #fff; } body.dark-mode .panel-title { color: #e0e0e0; } body.dark-mode .checkbox label::before { background: #1e2226; border-color: #3a3f45; } body.dark-mode .radio label::before { background: #1e2226; border-color: #3a3f45; } body.dark-mode .navbar-form .form-control { background: #1e2226; border-color: #3a3f45; } body.dark-mode .btn-search { color: #c8c9cb; background: #2d3035; border-left: 1px solid #4a5058; } body.dark-mode .btn-search:hover { color: #fff; background: #3a3f45; } body.dark-mode .btn-search:active { color: #fff; background: #4a5058; } body.dark-mode .sidebar .nav > li > a .badge, body.dark-mode .sidebar .nav > li > a .label { background: #f59c1a; } body.dark-mode .sidebar-minify-btn { background: #1f2226; color: #c8c9cb; } body.dark-mode .sidebar-minify-btn:hover { background: #2d3035; color: #fff; } body.dark-mode .btn-scroll-to-top { background: #f59c1a; } body.dark-mode .timeline:before { background: #3a3f45; } body.dark-mode .timeline .timeline-header .useruser { color: #c8c9cb; } /* ========== WIDGET STATS ========== */ body.dark-mode .widget { background: #2d3035; border-color: #3a3f45; } body.dark-mode .widget-stats { border-color: #3a3f45; } body.dark-mode .widget-stats .stats-icon { color: rgba(255,255,255,0.08); } body.dark-mode .widget-stats .stats-number { color: #e0e0e0; } body.dark-mode .widget-stats .stats-title { color: #8a8f95; } body.dark-mode .widget-stats .stats-link a { color: #8a8f95; } body.dark-mode .widget-stats .stats-link a:hover { color: #fff; } /* ========== BACKGROUND VARIANTS ========== */ body.dark-mode .bg-green { background: #1e3a2a !important; } body.dark-mode .bg-red { background: #3a1e20 !important; } body.dark-mode .bg-orange { background: #3a3220 !important; } body.dark-mode .bg-blue { background: #1a3344 !important; } body.dark-mode .bg-aqua { background: #1a3344 !important; } body.dark-mode .bg-black { background: #16191d !important; } body.dark-mode .bg-grey-darker { background: #262a2e !important; } /* ========== BUTTON INVERSE ========== */ body.dark-mode .btn-inverse { background: #34383e; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .btn-inverse:hover, body.dark-mode .btn-inverse:focus, body.dark-mode .btn-inverse:active, body.dark-mode .btn-inverse.active { background: #3e444b; border-color: #4a5058; color: #fff; } body.dark-mode .btn-link { color: #d4d4d4; } body.dark-mode .btn-link:hover { color: #f0f0f0; } body.dark-mode .btn-icon:not(.btn-scroll-to-top) { background: #34383e; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .btn-icon:not(.btn-scroll-to-top):hover { background: #3e444b; color: #fff; } /* ========== PANEL VARIANTS ========== */ body.dark-mode .panel-info > .panel-heading { background: #1a3344; border-color: #2a4a5e; color: #8bc4ea; } body.dark-mode .panel-primary > .panel-heading { background: #1a2d44; border-color: #2a4a6e; color: #8bb4ea; } body.dark-mode .panel-success > .panel-heading { background: #1e3a2a; border-color: #2a5a3e; color: #8bda9b; } body.dark-mode .panel-warning > .panel-heading { background: #3a3220; border-color: #5a4a2a; color: #e8c97a; } body.dark-mode .panel-danger > .panel-heading { background: #3a1e20; border-color: #5a2a2a; color: #e88a8a; } body.dark-mode .panel-inverse > .panel-heading { background: #16191d; border-color: #2d3035; color: #e0e0e0; } body.dark-mode .panel-with-tabs .panel-heading { background: #262a2e; } body.dark-mode .panel-heading-btn .btn-icon { background: #34383e; border-color: #3a3f45; } body.dark-mode .panel-form .panel-body { background: #2d3035; } /* ========== TABLE VARIANTS ========== */ body.dark-mode .table-hover > tbody > tr:hover > td, body.dark-mode .table-hover > tbody > tr:hover > th { background: #3a3f45 !important; } body.dark-mode .table-profile > tbody > tr > td { border-color: #4a5058; } body.dark-mode .table-profile > tbody > tr.highlight > td { background: #282b30; border-color: #4a5058; } body.dark-mode .table-profile > tbody > tr > td { color: #c8c9cb; } body.dark-mode .table-profile > tbody > tr > td.field { color: #8a8f95; } body.dark-mode .profile-container { background: #2d3035; } body.dark-mode .profile-section + .profile-section { border-top-color: #4a5058; } body.dark-mode .table-invoice { border-color: #4a5058; } body.dark-mode .table-invoice > thead > tr > th { background: #1e2226; border-color: #4a5058; color: #e0e0e0; } body.dark-mode .table-invoice > tbody > tr > td { border-color: #4a5058; background: #2d3035; } body.dark-mode table.dataTable tr.odd, body.dark-mode table.dataTable tr.odd td.sorting_1 { background: #282b30; } body.dark-mode table.dataTable tr.even, body.dark-mode table.dataTable tr.even td.sorting_1 { background: #2d3035; } body.dark-mode .dataTables_empty { color: #8a8f95; } body.dark-mode .table-responsive { border-color: #4a5058; } body.dark-mode .table tr.selected, body.dark-mode .table tr.selected > td { background: #2a3d4a !important; } /* ========== CODE TAGS ========== */ body.dark-mode code { background: #1a1d21; color: #e88a8a; border-color: #3a3f45; } /* ========== PAGINATION ========== */ body.dark-mode .pagination > li > a, body.dark-mode .pagination > li > span { background: #262a2e; border-color: #4a5058; color: #c8c9cb; } body.dark-mode .pagination > li > a:hover, body.dark-mode .pagination > li > span:hover { background: #3a3f45; color: #fff; } body.dark-mode .pagination > .active > a, body.dark-mode .pagination > .active > a:hover, body.dark-mode .pagination > .active > span { background: #f59c1a; border-color: #f59c1a; color: #fff; } body.dark-mode .pagination > .disabled > a, body.dark-mode .pagination > .disabled > a:hover, body.dark-mode .pagination > .disabled > span { background: #1e2226; border-color: #3a3f45; color: #5a5f65; } /* ========== CHECKBOX in dark mode ========== */ body.dark-mode input[type=checkbox] { -webkit-filter: invert(0.8) hue-rotate(180deg); filter: invert(0.8) hue-rotate(180deg); } body.dark-mode input[type=radio] { -webkit-filter: invert(0.8) hue-rotate(180deg); filter: invert(0.8) hue-rotate(180deg); } /* ========== NAV TABS VARIANTS ========== */ body.dark-mode .nav-tabs-inverse { background: #1f2226; border-color: #3a3f45; } body.dark-mode .nav-tabs.nav-tabs-inverse > li > a { background: #1f2226; color: #c8c9cb; } body.dark-mode .nav-tabs.nav-tabs-inverse > li > a:hover, body.dark-mode .nav-tabs.nav-tabs-inverse > li > a:focus { background: #2d3035; border-color: #3a3f45; color: #fff; } body.dark-mode .nav-tabs.nav-tabs-inverse > li.active > a, body.dark-mode .nav-tabs.nav-tabs-inverse > li.active > a:focus, body.dark-mode .nav-tabs.nav-tabs-inverse > li.active > a:hover { background: #2d3035; border-color: #3a3f45 #3a3f45 transparent; color: #e0e0e0; } body.dark-mode .tab-overflow .prev-button, body.dark-mode .tab-overflow .next-button { background: #262a2e; color: #c8c9cb; } body.dark-mode .tab-overflow .prev-button:hover, body.dark-mode .tab-overflow .next-button:hover { background: #34383e; color: #fff; } body.dark-mode .tab-overflow .prev-button a, body.dark-mode .tab-overflow .next-button a { background: #262a2e; color: #c8c9cb; } /* ========== INVOICE LAYOUT ========== */ body.dark-mode .invoice { background: #2d3035; border-color: #3a3f45; } body.dark-mode .invoice-company { color: #e0e0e0; border-color: #3a3f45; } body.dark-mode .invoice-header { background: #262a2e; border-color: #3a3f45; } body.dark-mode .invoice-from, body.dark-mode .invoice-to { color: #c8c9cb; } body.dark-mode .invoice-from a, body.dark-mode .invoice-to a { color: #8a8f95; } body.dark-mode .invoice-from a:hover, body.dark-mode .invoice-to a:hover { color: #fff; } body.dark-mode .invoice-from address, body.dark-mode .invoice-to address { color: #c8c9cb; } body.dark-mode .invoice-from address strong, body.dark-mode .invoice-to address strong { color: #e0e0e0; } body.dark-mode .invoice-date { color: #c8c9cb; } body.dark-mode .invoice-date .date { color: #c8c9cb; } body.dark-mode .invoice-date strong { color: #e0e0e0; } body.dark-mode .invoice-detail { color: #c8c9cb; } body.dark-mode .invoice-detail strong, body.dark-mode .invoice-detail b { color: #e0e0e0; } body.dark-mode .invoice-content { border-color: #3a3f45; } body.dark-mode .invoice-price { background: #1e2226; border-color: #3a3f45; } body.dark-mode .invoice-price-left { border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .invoice-price-right { background: #1e2226; color: #e0e0e0; } body.dark-mode .invoice-note { color: #8a8f95; } body.dark-mode .invoice-footer { border-color: #3a3f45; color: #8a8f95; } body.dark-mode .invoice-box { background: #2d3035; border-color: #3a3f45; } /* ========== BADGES ========== */ body.dark-mode .badge { background: #3a3f45; color: #c8c9cb; } body.dark-mode .badge-default { background: #3a3f45; color: #c8c9cb; } body.dark-mode .badge-primary { background: #3482c4; color: #fff; } body.dark-mode .badge-success { background: #2d8f4d; color: #fff; } body.dark-mode .badge-info { background: #2d8fa8; color: #fff; } body.dark-mode .badge-warning { background: #c49a34; color: #fff; } body.dark-mode .badge-danger { background: #c43e3e; color: #fff; } /* ========== PROGRESS BARS ========== */ body.dark-mode .progress-bar { background: #3482c4; } body.dark-mode .progress-bar-success { background: #2d8f4d; } body.dark-mode .progress-bar-info { background: #2d8fa8; } body.dark-mode .progress-bar-warning { background: #c49a34; } body.dark-mode .progress-bar-danger { background: #c43e3e; } body.dark-mode .progress-striped .progress-bar { background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent); } /* ========== TEXT COLOR UTILITIES ========== */ body.dark-mode .text-success { color: #8bda9b !important; } body.dark-mode .text-warning { color: #e8c97a !important; } body.dark-mode .text-danger { color: #e88a8a !important; } body.dark-mode .text-primary { color: #8bb4ea !important; } body.dark-mode .text-info { color: #8bc4ea !important; } /* ========== SIDEBAR PROFILE ========== */ body.dark-mode .sidebar .nav-profile { background: #1f2226; border-color: #2d3035; } body.dark-mode .sidebar .nav-profile .image img { border-color: #3a3f45; } body.dark-mode .sidebar .nav-profile .info { color: #c8c9cb; } body.dark-mode .sidebar .nav-profile .info small { color: #8a8f95; } body.dark-mode .sidebar .nav-header { color: #6a6f75; border-color: #2d3035; } /* ========== ACCORDION ========== */ body.dark-mode .accordion-toggle-styled { color: #c8c9cb; background: #262a2e; } body.dark-mode .accordion-toggle-styled.collapsed { background: #2d3035; color: #c8c9cb; } body.dark-mode .accordion-toggle-styled:hover { color: #fff; } body.dark-mode .panel-collapse > .panel-body { background: #2d3035; border-color: #3a3f45; } /* ========== LOGIN PAGE EXTRAS ========== */ body.dark-mode .login-content { color: #c8c9cb; } body.dark-mode .login-buttons .btn { color: #fff; } /* ========== SIDEBAR HAS-SUB ARROW ========== */ body.dark-mode .sidebar .nav > li.has-sub > a:before { color: #6a6f75; } body.dark-mode .sidebar .nav > li.has-sub > a:after { color: #5a5f65; } /* ========== MEDIA OBJECTS ========== */ body.dark-mode .media-list { border-color: #3a3f45; } body.dark-mode .media { border-color: #3a3f45; } body.dark-mode .media-heading { color: #e0e0e0; } body.dark-mode .media-left i { color: #c8c9cb; } /* ========== INPUT WHITE ========== */ body.dark-mode .input-white { background: #1e2226 !important; border-color: #3a3f45 !important; color: #e0e0e0 !important; } /* ========== MODAL DIALOG ========== */ body.dark-mode .modal-dialog { border-color: #3a3f45; } body.dark-mode .modal-backdrop { background: #000; } /* ========== SPINNER ========== */ body.dark-mode #page-loader .spinner { border-color: #3a3f45; border-top-color: #f59c1a; } /* ========== PAGE LOADER ========== */ body.dark-mode #page-loader { background: #1a1d21; } /* ========== DATATABLES PROCESSING ========== */ body.dark-mode .dataTables_processing { background: #2d3035; color: #c8c9cb; border-color: #3a3f45; } /* ========== ERROR DIV ========== */ body.dark-mode .errorDiv { background: #3a1e20; color: #e88a8a; border-color: #5a2a2a; } /* ========== CSS BORDERS ========== */ body.dark-mode .css-left { border-left-color: #3a3f45 !important; } body.dark-mode .css-bottom { border-bottom-color: #3a3f45 !important; } /* ========== FAQ / PANEL HELP ========== */ body.dark-mode .panel-help { border-color: #3a3f45; } body.dark-mode .panel-help > .panel-heading { background: #262a2e; border-color: #3a3f45; color: #e0e0e0; } /* ========== EMBED RESPONSIVE ========== */ body.dark-mode .embed-responsive { border-color: #3a3f45; } /* ========== SLIM SCROLL ========== */ body.dark-mode .slimScrollBar { background: #5a5f65 !important; } body.dark-mode .slimScrollRail { background: #2d3035 !important; } /* ========== FONT AWESOME STACK ========== */ body.dark-mode .fa-stack .fa-inverse { color: #16191d; } /* ========== OVERFLOW HIDDEN ========== */ body.dark-mode .overflow-hidden { background: transparent; } /* ========== DROPDOWN FOOTER ========== */ body.dark-mode .dropdown-footer { border-color: #3a3f45; } body.dark-mode .dropdown-footer a { color: #d4d4d4; } /* ========== jsTree ========== */ body.dark-mode .jstree-default .jstree-node { color: #c8c9cb; } body.dark-mode .jstree-default .jstree-hovered { background: #34383e; color: #fff; } body.dark-mode .jstree-default .jstree-clicked { background: #f59c1a; color: #fff; } body.dark-mode .jstree-default .jstree-anchor { color: #c8c9cb; } body.dark-mode .jstree-default .jstree-wholerow-hovered { background: #34383e; } body.dark-mode .jstree-default .jstree-wholerow-clicked { background: #f59c1a; } /* ========== X-EDITABLE ========== */ body.dark-mode .editable { color: #c8c9cb; } body.dark-mode .editable-click { color: #d4d4d4; border-color: #3a3f45; } body.dark-mode .editable-empty { color: #e88a8a; } body.dark-mode .editableform .form-control { background: #1e2226; border-color: #3a3f45; color: #e0e0e0; } /* ========== GRITTER NOTIFICATIONS ========== */ body.dark-mode .gritter-item { background: #1f2226 !important; color: #c8c9cb !important; } body.dark-mode .gritter-title { color: #e0e0e0 !important; text-shadow: none !important; } body.dark-mode .gritter-close { background: transparent !important; color: #c8c9cb !important; } /* ========== MORRIS CHARTS ========== */ body.dark-mode .morris-hover { background: #2d3035 !important; border-color: #3a3f45 !important; color: #c8c9cb !important; } body.dark-mode .morris-hover-row-label { color: #e0e0e0 !important; } /* ========== JVECTORMAP ========== */ body.dark-mode .jvectormap-container { background: #2d3035 !important; } body.dark-mode .jvectormap-tip { background: #1f2226 !important; color: #c8c9cb !important; border-color: #3a3f45 !important; } /* ========== DATERANGEPICKER ========== */ body.dark-mode .daterangepicker { background: #2d3035; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .daterangepicker .ranges li { background: #34383e; border-color: #3a3f45; color: #c8c9cb; } body.dark-mode .daterangepicker .ranges li.active, body.dark-mode .daterangepicker .ranges li:hover { background: #f59c1a; border-color: #f59c1a; color: #fff; } body.dark-mode .daterangepicker td.available:hover, body.dark-mode .daterangepicker th.available:hover { background: #34383e; } body.dark-mode .daterangepicker td.in-range { background: #1a3344; color: #c8c9cb; } body.dark-mode .daterangepicker td.active, body.dark-mode .daterangepicker td.active:hover { background: #f59c1a; color: #fff; } body.dark-mode .daterangepicker .calendar-table { background: #2d3035; border-color: #3a3f45; } body.dark-mode .daterangepicker .calendar-table th { color: #c8c9cb; } body.dark-mode .daterangepicker .calendar-table td { color: #c8c9cb; } body.dark-mode .daterangepicker td.off { background: transparent; color: #5a5f65; } body.dark-mode .daterangepicker .input-mini { background: #1e2226; border-color: #3a3f45; color: #e0e0e0; } body.dark-mode .daterangepicker .input-mini.active { border-color: #f59c1a; } body.dark-mode .daterangepicker .daterangepicker_input i { color: #8a8f95; } body.dark-mode .daterangepicker .drp-buttons { border-color: #3a3f45; } /* ========== BOOTSTRAP DATEPICKER (client birth date) ========== */ body.dark-mode .datepicker-dropdown { background: #2d3035; border-color: #3a3f45; } body.dark-mode .datepicker-dropdown:after { border-bottom-color: #2d3035; } body.dark-mode .datepicker table tr td.day:hover, body.dark-mode .datepicker table tr td.focused { background: #34383e; } body.dark-mode .datepicker table tr td.active, body.dark-mode .datepicker table tr td.active:hover, body.dark-mode .datepicker table tr td.active:focus { background: #f59c1a; color: #fff; text-shadow: none; } body.dark-mode .datepicker table tr td.old, body.dark-mode .datepicker table tr td.new { color: #5a5f65; } body.dark-mode .datepicker table tr td.today { color: #e0e0e0; background: #1a3344; } body.dark-mode .datepicker table tr td.today:hover { color: #fff; background: #2a4a5e; } body.dark-mode .datepicker table tr td.range { background: #1a3344; color: #c8c9cb; } body.dark-mode .datepicker table tr td.range:hover { background: #2a4a5e; } body.dark-mode .datepicker table tr td.highlighted { background: #262a2e; color: #c8c9cb; } body.dark-mode .datepicker table tr td.highlighted:hover { background: #34383e; } body.dark-mode .datepicker table tr td.disabled, body.dark-mode .datepicker table tr td.disabled:hover { color: #5a5f65; } body.dark-mode .datepicker table tr th.disabled, body.dark-mode .datepicker table tr th.disabled:hover { color: #5a5f65; } body.dark-mode .datepicker .datepicker-switch, body.dark-mode .datepicker .prev, body.dark-mode .datepicker .next { color: #c8c9cb; } body.dark-mode .datepicker .datepicker-switch:hover, body.dark-mode .datepicker .prev:hover, body.dark-mode .datepicker .next:hover { background: #34383e; } body.dark-mode .datepicker table tr th { color: #c8c9cb; } /* ========== EONASDAN DATETIMEPICKER (add/edit date fields) ========== */ body.dark-mode .bootstrap-datetimepicker-widget { background: #2d3035; border-color: #3a3f45; } body.dark-mode .bootstrap-datetimepicker-widget.dropdown-menu.bottom:after { border-bottom-color: #2d3035; } body.dark-mode .bootstrap-datetimepicker-widget.dropdown-menu.top:after { border-top-color: #2d3035; } body.dark-mode .bootstrap-datetimepicker-widget table td, body.dark-mode .bootstrap-datetimepicker-widget table th { color: #c8c9cb; } body.dark-mode .bootstrap-datetimepicker-widget table th.disabled, body.dark-mode .bootstrap-datetimepicker-widget table th.disabled:hover { color: #5a5f65; } body.dark-mode .bootstrap-datetimepicker-widget table thead tr:first-child th:hover { background: #34383e; } body.dark-mode .bootstrap-datetimepicker-widget table td.day:hover, body.dark-mode .bootstrap-datetimepicker-widget table td.hour:hover, body.dark-mode .bootstrap-datetimepicker-widget table td.minute:hover, body.dark-mode .bootstrap-datetimepicker-widget table td.second:hover { background: #34383e; } body.dark-mode .bootstrap-datetimepicker-widget table td.old, body.dark-mode .bootstrap-datetimepicker-widget table td.new { color: #5a5f65; } body.dark-mode .bootstrap-datetimepicker-widget table td.active, body.dark-mode .bootstrap-datetimepicker-widget table td.active:hover { background: #f59c1a; color: #fff; text-shadow: none; } body.dark-mode .bootstrap-datetimepicker-widget table td.active.today:before { border-bottom-color: #fff; } body.dark-mode .bootstrap-datetimepicker-widget table td.today:before { border-bottom-color: #f59c1a; } body.dark-mode .bootstrap-datetimepicker-widget table td span { color: #c8c9cb; } body.dark-mode .bootstrap-datetimepicker-widget table td span:hover { background: #34383e; } body.dark-mode .bootstrap-datetimepicker-widget table td span.active { background: #f59c1a; color: #fff; text-shadow: none; } body.dark-mode .bootstrap-datetimepicker-widget table td span.old { color: #5a5f65; } body.dark-mode .bootstrap-datetimepicker-widget table td span.disabled, body.dark-mode .bootstrap-datetimepicker-widget table td span.disabled:hover { color: #5a5f65; } body.dark-mode .bootstrap-datetimepicker-widget table td.cw { color: #5a5f65; } body.dark-mode .bootstrap-datetimepicker-widget table td.disabled, body.dark-mode .bootstrap-datetimepicker-widget table td.disabled:hover { color: #5a5f65; } /* ========== SELECTIZE ========== */ body.dark-mode .selectize-input { background: #1e2226 !important; border-color: #3a3f45 !important; color: #e0e0e0 !important; } body.dark-mode .selectize-input input { color: #e0e0e0 !important; } body.dark-mode .selectize-control.single .selectize-input:after { border-color: #c8c9cb transparent transparent transparent !important; } body.dark-mode .selectize-control.single .selectize-input.dropdown-active:after { border-color: transparent transparent #c8c9cb transparent !important; } body.dark-mode .selectize-dropdown { background: #2d3035 !important; border-color: #3a3f45 !important; color: #c8c9cb !important; } body.dark-mode .selectize-dropdown [data-selectable] { color: #e0e0e0 !important; } body.dark-mode .selectize-dropdown .active { background: #f59c1a !important; color: #fff !important; } body.dark-mode .selectize-dropdown .create { color: #c8c9cb !important; } body.dark-mode .selectize-dropdown .optgroup-header { color: #8a8f95 !important; background: #262a2e !important; } /* ========== BOOTSTRAP CALENDAR ========== */ body.dark-mode .calendar { background: #2d3035; border-color: #3a3f45; } body.dark-mode .calendar .calendar-header { background: #262a2e; border-color: #3a3f45; } body.dark-mode .calendar .calendar-header a { color: #c8c9cb; } body.dark-mode .calendar .calendar-header a:hover { color: #fff; } body.dark-mode .calendar .calendar-header .calendar-title { color: #e0e0e0; } /* ========== BTN-APP (inline style in dashboard) ========== */ body.dark-mode .btn-app { background: #262a2e !important; border-color: #3a3f45 !important; color: #c8c9cb !important; } body.dark-mode .btn-app:hover { background: #34383e !important; border-color: #4a5058 !important; color: #fff !important; } body.dark-mode .btn-app > .fa, body.dark-mode .btn-app > .glyphicon, body.dark-mode .btn-app > .ion { color: inherit; } /* ========== BADGE COLOR VARIANTS (dynamic via $status->color) ========== */ body.dark-mode .badge-success, body.dark-mode .badge-green { background: #2d8f4d; } body.dark-mode .badge-warning, body.dark-mode .badge-orange { background: #c49a34; } body.dark-mode .badge-danger, body.dark-mode .badge-red { background: #c43e3e; } body.dark-mode .badge-info, body.dark-mode .badge-aqua, body.dark-mode .badge-blue { background: #2d8fa8; } body.dark-mode .badge-default, body.dark-mode .badge-grey { background: #3a3f45; } body.dark-mode .badge-inverse, body.dark-mode .badge-black { background: #16191d; } /* ========== TABS (generic table class) ========== */ body.dark-mode .tables { color: #c8c9cb; }