/* ============================================================
   BITSTREAMING - CUSTOM DARK THEME FOR WHMCS
   Visual identity matching bitstreaming.net
   ============================================================ */

/* -- Design Tokens -- */
:root {
    --bs-dark-bg: #050814;
    --bs-dark-surface: #0B132B;
    --bs-dark-surface-hover: #131F3D;
    --bs-dark-surface-light: #1a2744;
    --bs-brand-orange: #FF6B35;
    --bs-brand-orange-glow: rgba(255, 107, 53, 0.6);
    --bs-brand-cyan: #00D4FF;
    --bs-brand-cyan-glow: rgba(0, 212, 255, 0.6);
    --bs-brand-green: #00E676;
    --bs-brand-green-glow: rgba(0, 230, 118, 0.5);
    --bs-brand-blue: #0080FF;
    --bs-brand-blue-glow: rgba(0, 128, 255, 0.5);
    --bs-text-primary: #ffffff;
    --bs-text-secondary: rgba(255, 255, 255, 0.7);
    --bs-text-muted: rgba(255, 255, 255, 0.4);
    --bs-border-subtle: rgba(255, 255, 255, 0.1);
    --bs-border-muted: rgba(255, 255, 255, 0.05);
}

/* -- Global Dark Theme -- */
html, body {
    background-color: #050814 !important;
    color: #ffffff !important;
}
body {
    font-family: "Maven Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* -- Layout Sections -- */
section#header {
    background-color: #0B132B !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 0 !important;
}
section#header .logo img {
    max-height: 42px !important;
}
section#header .logo-text {
    font-family: "Maven Pro", sans-serif !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}
section#main-menu {
    background-color: #0B132B !important;
}
section#main-body {
    background-color: #050814 !important;
    color: #ffffff !important;
}
section#main-content {
    background-color: transparent !important;
}
.main-content {
    background-color: transparent !important;
    color: #ffffff !important;
}
section#footer {
    background-color: #050814 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: rgba(255, 255, 255, 0.4) !important;
}
section#footer p {
    color: rgba(255, 255, 255, 0.4) !important;
}
section#footer a {
    color: rgba(255, 255, 255, 0.5) !important;
}
section#footer a:hover {
    color: #00D4FF !important;
}
section#footer .back-to-top i {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #00D4FF !important;
    border-radius: 8px !important;
}
section#footer .back-to-top i:hover {
    background-color: rgba(0, 212, 255, 0.15) !important;
}

/* -- Home Banner and Shortcuts -- */
section#home-banner {
    background-color: #0B132B !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
section#home-banner h2 {
    color: #ffffff !important;
}
section#home-banner .btn.search {
    background: linear-gradient(135deg, #00D4FF, #0080FF) !important;
    box-shadow: 0 0 20px rgba(0, 212, 255, 0.3) !important;
}
section#home-banner .btn.transfer {
    background: linear-gradient(135deg, #FF6B35, #FF8F00) !important;
    box-shadow: 0 0 20px rgba(255, 107, 53, 0.3) !important;
}
.home-shortcuts {
    background-color: #0B132B !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.home-shortcuts li {
    border-right-color: rgba(255, 255, 255, 0.05) !important;
    border-left-color: rgba(255, 255, 255, 0.05) !important;
}
.home-shortcuts li a {
    color: rgba(255, 255, 255, 0.7) !important;
}
.home-shortcuts li a:hover {
    color: #00D4FF !important;
}

/* -- General Links and Typography -- */
a {
    color: #00D4FF !important;
}
a:hover {
    color: #33ddff !important;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Maven Pro", -apple-system, sans-serif !important;
    font-weight: 700 !important;
    color: #ffffff !important;
}
.primary-bg-color {
    background-color: #050814 !important;
}

/* -- Header-Lined and Breadcrumbs -- */
div.header-lined h1 {
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    font-weight: 700 !important;
}
div.header-lined .breadcrumb li a {
    color: rgba(255, 255, 255, 0.4) !important;
}
div.header-lined .breadcrumb > .active {
    color: #00D4FF !important;
}

/* -- Top Nav -- */
ul.top-nav > li > a {
    color: rgba(255, 255, 255, 0.6) !important;
}
ul.top-nav > li:hover > a,
ul.top-nav > li > a:hover {
    color: #fff !important;
}
ul.top-nav > li.primary-action {
    border-left-color: rgba(255, 255, 255, 0.1) !important;
}
ul.top-nav > li.primary-action > a.btn {
    background: linear-gradient(135deg, #00D4FF, #0080FF) !important;
    color: #fff !important;
    border-radius: 8px !important;
    box-shadow: 0 0 15px rgba(0, 212, 255, 0.2) !important;
}

/* -- DataTable Info Bar -- */
.dataTables_wrapper .dataTables_info {
    background-color: #0B132B !important;
    color: rgba(255, 255, 255, 0.4) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.dataTables_wrapper .dataTables_length {
    background-color: #0B132B !important;
    color: rgba(255, 255, 255, 0.4) !important;
}

/* -- Tiles Dashboard -- */
.tiles .tile {
    background-color: #0B132B !important;
    border-right-color: rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
}
.tiles .tile:hover {
    background-color: #131F3D !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}
.tiles .tile .icon {
    color: rgba(255, 255, 255, 0.06) !important;
}
.tiles .tile .stat {
    color: #ffffff !important;
    font-weight: 700 !important;
}
.tiles .tile .title {
    color: rgba(255, 255, 255, 0.4) !important;
    font-weight: 600 !important;
}

/* -- Breadcrumb -- */
.breadcrumb {
    background-color: transparent !important;
}
.breadcrumb > li > a {
    color: rgba(255, 255, 255, 0.4) !important;
}
.breadcrumb > li + li:before {
    color: rgba(255, 255, 255, 0.3) !important;
}
.breadcrumb > .active {
    color: #00D4FF !important;
}

/* -- Scrollbar -- */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #050814;
}
::-webkit-scrollbar-thumb {
    background: rgba(0, 212, 255, 0.2);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 212, 255, 0.4);
}

/* -- Navbar Dark Overrides -- */
.navbar-main {
    background-color: #0B132B !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}
.navbar-main li.account {
    background-color: rgba(255, 255, 255, 0.08) !important;
}
.navbar-main .navbar-nav > li > a:hover,
.navbar-main .navbar-nav > li > a:focus,
.navbar-main .navbar-nav > .active > a,
.navbar-main .navbar-nav > .active > a:hover,
.navbar-main .navbar-nav > .active > a:focus,
.navbar-main .navbar-nav > .open > a,
.navbar-main .navbar-nav > .open > a:hover,
.navbar-main .navbar-nav > .open > a:focus {
    background-color: #131F3D !important;
    color: #00D4FF !important;
}
.navbar-main .dropdown-menu {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
}
.navbar-main .navbar-nav .dropdown-menu > li > a,
.navbar-main .dropdown-menu > li > a {
    color: rgba(255, 255, 255, 0.7) !important;
    transition: all 0.2s ease !important;
}
.navbar-main .navbar-nav .dropdown-menu > li > a:hover,
.navbar-main .navbar-nav .dropdown-menu > li > a:focus,
.navbar-main .navbar-nav .dropdown-menu > .active > a,
.navbar-main .navbar-nav .dropdown-menu > .active > a:hover,
.navbar-main .navbar-nav .dropdown-menu > .active > a:focus,
.navbar-main .dropdown-menu > li > a:hover,
.navbar-main .dropdown-menu > li > a:focus {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
}
.navbar-main .navbar-toggle .icon-bar {
    background-color: rgba(255, 255, 255, 0.7);
}
.navbar-main .navbar-toggle:focus,
.navbar-main .navbar-toggle:hover {
    background-color: rgba(255, 255, 255, 0.05);
}
.navbar-main .navbar-toggle:focus .icon-bar,
.navbar-main .navbar-toggle:hover .icon-bar {
    background-color: #fff;
}

/* -- Sidebar / Panels Dark -- */
.panel-default {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}
.panel-default > .panel-heading {
    background-color: #0B132B !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
    border-radius: 12px 12px 0 0 !important;
}
.panel-default > .panel-heading .panel-title,
.panel-default > .panel-heading .panel-title a {
    color: #ffffff !important;
    font-weight: 600 !important;
}
.panel-body {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.panel-footer {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 0 0 12px 12px !important;
}

/* Panel accent colors */
.panel.panel-accent-gold { border-top: 3px solid #FF6B35 !important; }
.panel.panel-accent-green { border-top: 3px solid #00E676 !important; }
.panel.panel-accent-red { border-top: 3px solid #FF4C4C !important; }
.panel.panel-accent-blue { border-top: 3px solid #00D4FF !important; }
.panel.panel-accent-orange { border-top: 3px solid #FF6B35 !important; }
.panel.panel-accent-pink { border-top: 3px solid #FF69B4 !important; }

/* -- List Group Dark -- */
.list-group-item {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    transition: all 0.2s ease !important;
}
.list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #fff !important;
}
a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus {
    background-color: rgba(0, 212, 255, 0.15) !important;
    border-color: rgba(0, 212, 255, 0.3) !important;
    color: #00D4FF !important;
}
.list-group-item .badge {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 10px !important;
}
.list-group-item > i.far.fa-circle {
    color: rgba(255, 255, 255, 0.3) !important;
}

/* -- Forms Dark -- */
.form-control {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}
.form-control:focus {
    background-color: #131F3D !important;
    border-color: #00D4FF !important;
    color: #fff !important;
    box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.15) !important;
}
.form-control::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
}
select.form-control {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2300D4FF' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    padding-right: 35px !important;
}
textarea.form-control {
    resize: vertical;
}
.input-group-addon {
    background-color: #131F3D !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
label, .control-label {
    color: rgba(255, 255, 255, 0.7) !important;
    font-weight: 500 !important;
}
.help-block {
    color: rgba(255, 255, 255, 0.4) !important;
}
.has-error .form-control {
    border-color: #FF4C4C !important;
}
.has-error .help-block,
.has-error .control-label {
    color: #FF4C4C !important;
}
.has-success .form-control {
    border-color: #00E676 !important;
}

/* -- Buttons Dark -- */
.btn-primary {
    background: linear-gradient(135deg, #00D4FF, #0080FF) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    box-shadow: 0 0 15px rgba(0, 212, 255, 0.2) !important;
    transition: all 0.3s ease !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: linear-gradient(135deg, #33ddff, #3399ff) !important;
    box-shadow: 0 0 25px rgba(0, 212, 255, 0.4) !important;
    transform: translateY(-1px) !important;
    color: #fff !important;
}
.btn-success {
    background: linear-gradient(135deg, #00E676, #00C853) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    box-shadow: 0 0 15px rgba(0, 230, 118, 0.2) !important;
}
.btn-success:hover {
    box-shadow: 0 0 25px rgba(0, 230, 118, 0.4) !important;
    color: #fff !important;
}
.btn-warning {
    background: linear-gradient(135deg, #FF6B35, #FF8F00) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.btn-danger {
    background: linear-gradient(135deg, #FF4C4C, #D32F2F) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.btn-default {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}
.btn-default:hover,
.btn-default:focus {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
}
.btn-info {
    background: linear-gradient(135deg, #00BCD4, #00D4FF) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.btn-link {
    color: #00D4FF !important;
    border: none !important;
}
.btn-link:hover {
    color: #33ddff !important;
    text-decoration: none !important;
}

/* -- Tables Dark -- */
.table {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.table > thead > tr > th {
    background-color: #0B132B !important;
    border-bottom: 2px solid rgba(0, 212, 255, 0.3) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 0.75em !important;
    letter-spacing: 0.05em !important;
}
.table > tbody > tr > td {
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.table > tbody > tr:hover > td {
    background-color: rgba(255, 255, 255, 0.03) !important;
}
.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.02) !important;
}

/* DataTable overrides */
.dataTables_wrapper .dataTables_info {
    background-color: #0B132B !important;
    color: rgba(255, 255, 255, 0.4) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.dataTables_wrapper table.table-list thead th,
table.table-list thead th {
    background-color: #0B132B !important;
    border-bottom: 4px solid rgba(0, 212, 255, 0.3) !important;
    color: #ffffff !important;
}
.dataTables_wrapper table.table-list thead th:nth-child(even) {
    border-bottom: 4px solid rgba(0, 128, 255, 0.3) !important;
}
.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc {
    background-color: #131F3D !important;
}
.table-list > tbody > tr > td {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.table-list > tbody > tr:nth-child(even) > td {
    background-color: rgba(255, 255, 255, 0.02) !important;
}
.dataTables_wrapper .dataTables_length {
    background-color: #0B132B !important;
    color: rgba(255, 255, 255, 0.4) !important;
}
.dataTables_wrapper .dataTables_filter label .form-control {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

/* -- Alerts Dark -- */
.alert {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.alert-success { border-left: 4px solid #00E676 !important; }
.alert-danger { border-left: 4px solid #FF4C4C !important; }
.alert-warning { border-left: 4px solid #FF6B35 !important; }
.alert-info { border-left: 4px solid #00D4FF !important; }
.alert .close {
    color: rgba(255, 255, 255, 0.4) !important;
    opacity: 0.7 !important;
    text-shadow: none !important;
}
.alert .close:hover { color: #fff !important; opacity: 1 !important; }

/* -- Modal Dark -- */
.modal-content {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 16px !important;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.6) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 16px 16px 0 0 !important;
}
.modal-header .modal-title { color: #ffffff !important; }
.modal-header .close {
    color: rgba(255, 255, 255, 0.4) !important;
    text-shadow: none !important;
    opacity: 0.7 !important;
}
.modal-header .close:hover { color: #fff !important; opacity: 1 !important; }
.modal-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 0 0 16px 16px !important;
}
.modal-backdrop { background-color: rgba(5, 8, 20, 0.8) !important; }
.panel-primary { border-color: rgba(255, 255, 255, 0.1) !important; }
.panel-primary > .panel-heading {
    background-color: #0B132B !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

/* -- Pagination Dark -- */
.pagination > li > a,
.pagination > li > span {
    background-color: #0B132B !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    transition: all 0.2s ease !important;
}
.pagination > li > a:hover,
.pagination > li > a:focus,
.pagination > li > span:hover,
.pagination > li > span:focus {
    background-color: #131F3D !important;
    border-color: rgba(0, 212, 255, 0.3) !important;
    color: #fff !important;
}
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    background-color: #00D4FF !important;
    border-color: #00D4FF !important;
    color: #000 !important;
    font-weight: 700 !important;
}
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > span,
.pagination > .disabled > span:hover {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
    color: rgba(255, 255, 255, 0.4) !important;
}

/* -- Tabs and Pills Dark -- */
.nav-tabs { border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; }
.nav-tabs > li > a {
    color: rgba(255, 255, 255, 0.4) !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    transition: all 0.2s ease !important;
}
.nav-tabs > li > a:hover {
    color: #fff !important;
    border-bottom-color: rgba(0, 212, 255, 0.3) !important;
    background-color: transparent !important;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    color: #00D4FF !important;
    background-color: transparent !important;
    border-bottom-color: #00D4FF !important;
}
.tab-content { color: rgba(255, 255, 255, 0.7) !important; }
.nav-pills > li > a {
    color: rgba(255, 255, 255, 0.7) !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}
.nav-pills > li > a:hover {
    color: #fff !important;
    background-color: rgba(255, 255, 255, 0.08) !important;
}
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
    background: linear-gradient(135deg, #00D4FF, #0080FF) !important;
    color: #fff !important;
}

/* -- Badges and Labels Dark -- */
.badge {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.label { border-radius: 6px !important; }
.label-default { background-color: rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.7) !important; }
.label-primary { background-color: rgba(0, 212, 255, 0.2) !important; color: #00D4FF !important; }
.label-success { background-color: rgba(0, 230, 118, 0.2) !important; color: #00E676 !important; }
.label-warning { background-color: rgba(255, 107, 53, 0.2) !important; color: #FF6B35 !important; }
.label-danger { background-color: rgba(255, 76, 76, 0.2) !important; color: #FF4C4C !important; }
.label-info { background-color: rgba(0, 212, 255, 0.15) !important; color: #00D4FF !important; }

/* -- Status Indicators Dark -- */
.status {
    background-color: #0B132B !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.status-active, .status-open, .status-completed { color: #00E676 !important; border-color: rgba(0, 230, 118, 0.3) !important; }
.status-pending { color: #FF6B35 !important; border-color: rgba(255, 107, 53, 0.3) !important; }
.status-suspended { color: #00D4FF !important; }
.status-cancelled, .status-terminated { color: rgba(255, 255, 255, 0.4) !important; }
.status-fraud { color: #FF4C4C !important; }
.status-paid { color: #00E676 !important; }
.status-unpaid { color: #FF4C4C !important; }
.status-refunded { color: #00D4FF !important; }
.status-customer-reply { color: #FF6B35 !important; }

/* -- Progress Bars Dark -- */
.progress { background-color: rgba(255, 255, 255, 0.05) !important; border-radius: 10px !important; box-shadow: none !important; }
.progress-bar { background: linear-gradient(90deg, #00D4FF, #0080FF) !important; border-radius: 10px !important; }
.progress-bar-success { background: linear-gradient(90deg, #00E676, #00C853) !important; }
.progress-bar-warning { background: linear-gradient(90deg, #FF6B35, #FF8F00) !important; }
.progress-bar-danger { background: linear-gradient(90deg, #FF4C4C, #D32F2F) !important; }

/* -- Well / Popover / Tooltip Dark -- */
.well { background-color: #0B132B !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 12px !important; box-shadow: none !important; color: rgba(255, 255, 255, 0.7) !important; }
.popover { background-color: #0B132B !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 12px !important; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important; color: rgba(255, 255, 255, 0.7) !important; }
.popover-title { background-color: rgba(255, 255, 255, 0.05) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; color: #ffffff !important; border-radius: 12px 12px 0 0 !important; }
.popover.right > .arrow:after { border-right-color: #0B132B !important; }
.popover.left > .arrow:after { border-left-color: #0B132B !important; }
.popover.top > .arrow:after { border-top-color: #0B132B !important; }
.popover.bottom > .arrow:after { border-bottom-color: #0B132B !important; }
.tooltip-inner { background-color: #1a2744 !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 8px !important; color: #ffffff !important; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important; }

/* -- Background Colors for Tiles -- */
.bg-color-gold { background-color: #FF6B35 !important; }
.bg-color-green { background-color: #00E676 !important; }
.bg-color-red { background-color: #FF4C4C !important; }
.bg-color-blue { background-color: #00D4FF !important; }
.bg-color-orange { background-color: #FF6B35 !important; }

/* -- Dashboard Tiles Dark -- */
.tiles { margin: 0 15px 15px 15px; }
.tiles .tile {
    padding: 16px 20px;
    background-color: #0B132B !important;
    border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 12px !important;
    margin-bottom: 8px;
    transition: all 0.3s ease !important;
}
.tiles .tile:hover {
    background-color: #131F3D !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
    transform: translateY(-2px) !important;
}
.tiles .tile a { color: #ffffff !important; text-decoration: none !important; }
.tiles .tile .highlight { height: 3px !important; border-radius: 3px !important; margin-top: 8px !important; }
.tiles .tile .icon { color: rgba(255, 255, 255, 0.08) !important; }
.tiles .tile .stat { color: #ffffff !important; font-weight: 700 !important; }
.tiles .tile .title { color: rgba(255, 255, 255, 0.4) !important; font-weight: 600 !important; text-transform: uppercase !important; font-size: 11px !important; letter-spacing: 0.05em !important; }

/* -- Client Home Panels Dark -- */
.client-home-panels .panel > .panel-heading { background-color: #0B132B !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; }
.client-home-panels .panel > .panel-heading .panel-title .btn { background-color: rgba(0, 212, 255, 0.15) !important; color: #00D4FF !important; border-radius: 6px !important; }
.client-home-panels .panel > .panel-heading .panel-title .btn:hover { color: #fff !important; background-color: rgba(0, 212, 255, 0.25) !important; }
.client-home-panels .panel small { color: rgba(255, 255, 255, 0.4) !important; }
.client-home-panels .panel > .list-group { border-top: 1px solid rgba(255, 255, 255, 0.05) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; }

/* -- Home KB Search Dark -- */
.home-kb-search .form-control { background-color: #0B132B !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; color: #ffffff !important; border-radius: 10px !important; padding-left: 50px !important; }
.home-kb-search .form-control:focus { border-color: #00D4FF !important; box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.15) !important; }
.home-kb-search i { color: rgba(255, 255, 255, 0.4) !important; }

/* -- Top Nav Dark -- */
ul.top-nav > li > a { color: rgba(255, 255, 255, 0.6) !important; }
ul.top-nav > li:active > a,
ul.top-nav > li:focus > a,
ul.top-nav > li:hover > a,
ul.top-nav > li > a:focus { color: #fff !important; background: transparent !important; }
ul.top-nav > li.primary-action { border-left: 1px solid rgba(255, 255, 255, 0.1) !important; }
ul.top-nav > li.primary-action > a.btn {
    background: linear-gradient(135deg, #00D4FF, #0080FF) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    box-shadow: 0 0 15px rgba(0, 212, 255, 0.2) !important;
}
ul.top-nav > li.primary-action > a.btn:hover { box-shadow: 0 0 25px rgba(0, 212, 255, 0.4) !important; }

/* -- Notifications Popover Dark -- */
.client-alerts { list-style: none; padding: 0; margin: 0; }
.client-alerts > li > a { color: rgba(255, 255, 255, 0.7) !important; padding: 10px 15px !important; display: block !important; border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; transition: background 0.2s ease !important; }
.client-alerts > li > a:hover { background-color: rgba(255, 255, 255, 0.05) !important; color: #fff !important; }

/* -- Fullpage Overlay -- */
#fullpage-overlay { background-color: rgba(5, 8, 20, 0.9) !important; color: #fff !important; }

/* -- Responsive Table (mobile) Dark -- */
.dtr-details { background-color: #0B132B !important; }
.dtr-details > li { border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; }

/* -- Misc Card-like Elements -- */
blockquote { border-left: 3px solid #00D4FF !important; color: rgba(255, 255, 255, 0.7) !important; }
hr { border-top: 1px solid rgba(255, 255, 255, 0.1) !important; }
.text-domain { color: #00D4FF !important; }
.affiliate-referral-link span { background-color: #0B132B !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.7) !important; border-radius: 10px !important; }
.product-details-tab-container { background-color: #0B132B !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 0 0 12px 12px !important; color: rgba(255, 255, 255, 0.7) !important; }
div.product-details div.product-icon { background-color: #0B132B !important; border-radius: 12px !important; color: #00D4FF !important; }

/* -- Announcement / KB -- */
.announcement-single .title { color: #ffffff !important; }
.announcement-single p { color: rgba(255, 255, 255, 0.7) !important; }
.announcement-single .article-items { color: rgba(255, 255, 255, 0.4) !important; }
.ticket-number { color: #00D4FF !important; }

/* -- Product Status Bars -- */
.product-status-active { background: linear-gradient(135deg, #00E676, #00C853) !important; }
.product-status-pending { background: linear-gradient(135deg, #FF6B35, #FF8F00) !important; }
.product-status-suspended { background: linear-gradient(135deg, #00D4FF, #0080FF) !important; }
.product-status-terminated, .product-status-cancelled { background-color: rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.4) !important; }

/* -- Selection color -- */
::selection { background: rgba(0, 212, 255, 0.3) !important; color: #fff !important; }

/* -- Login Container -- */
.logincontainer {
    color: rgba(255, 255, 255, 0.7) !important;
}
.logincontainer .login-form {
    border-right-color: rgba(255, 255, 255, 0.1) !important;
}
.logincontainer .social-signin-btns {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* -- Admin Return Bar -- */
.adminreturndiv {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}
.adminreturndiv .btn {
    background-color: rgba(0, 212, 255, 0.15) !important;
    color: #00D4FF !important;
}

/* -- Compact Control Bar -- */
.compact-control-bar {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 8px !important;
}

/* -- Form Control Feedback -- */
.has-feedback label ~ .form-control-feedback {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* -- Sidebar Layout -- */
div.col-md-3.sidebar,
div.col-md-3.sidebar-secondary {
    background-color: #050814 !important;
}
div.col-md-3.sidebar .panel,
div.col-md-3.sidebar-secondary .panel {
    background-color: #0B132B !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
/* Specificity battle: .panel-sidebar > .panel-heading in all.min.css has bg #f5eded */
.panel-sidebar,
.panel-sidebar > .panel-heading,
div.col-md-3.sidebar .panel .panel-heading,
div.col-md-3.sidebar-secondary .panel .panel-heading {
    background-color: #0B132B !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}
.panel-sidebar > .panel-heading .panel-title,
.panel-sidebar > .panel-heading .panel-title a,
div.col-md-3.sidebar .panel .panel-heading .panel-title,
div.col-md-3.sidebar-secondary .panel .panel-heading .panel-title {
    color: #ffffff !important;
}
.panel-sidebar > .panel-heading .panel-title a,
div.col-md-3.sidebar .panel .panel-heading .panel-title a,
div.col-md-3.sidebar-secondary .panel .panel-heading .panel-title a {
    color: #ffffff !important;
}
.panel-sidebar > .panel-body,
div.col-md-3.sidebar .panel .panel-body,
div.col-md-3.sidebar-secondary .panel .panel-body {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.panel-sidebar > .panel-footer,
div.col-md-3.sidebar .panel .panel-footer,
div.col-md-3.sidebar-secondary .panel .panel-footer {
    background-color: rgba(255, 255, 255, 0.02) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.panel-sidebar .list-group-item,
div.col-md-3.sidebar .panel .list-group-item,
div.col-md-3.sidebar-secondary .panel .list-group-item {
    background-color: #0B132B !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.panel-sidebar .list-group-item:hover,
div.col-md-3.sidebar .panel .list-group-item:hover,
div.col-md-3.sidebar-secondary .panel .list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}
.panel-sidebar .list-group-item.active,
div.col-md-3.sidebar .panel .list-group-item.active,
div.col-md-3.sidebar-secondary .panel .list-group-item.active {
    background-color: rgba(0, 212, 255, 0.15) !important;
    color: #00D4FF !important;
}

/* -- Responsive -- */
@media (max-width: 767px) {
    .tiles .tile { border-right: none !important; border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; }
    .tiles .tile:last-child { border-bottom: none !important; }
}