/* ================================================================
   BuildCrex — Professional Dark Theme
   Loads last. Overrides everything.
   Navy + Gold design system.
================================================================ */

/* ── Variables ── */
:root {
    --dk-bg:        #0b1d3a;
    --dk-surface:   #111f38;
    --dk-card:      rgba(255,255,255,0.06);
    --dk-glass:     rgba(255,255,255,0.07);
    --dk-glass-2:   rgba(255,255,255,0.05);
    --dk-border:    rgba(255,255,255,0.07);
    --dk-border-md: rgba(255,255,255,0.11);
    --dk-gold:      #ffd700;
    --dk-gold-dim:  rgba(255,215,0,0.12);
    --dk-gold-glow: rgba(255,215,0,0.25);
    --dk-text:      #e8edf5;
    --dk-muted:     rgba(232,237,245,0.55);
    --dk-faint:     rgba(232,237,245,0.30);
    --dk-navy:      #0a1f3d;
    --dk-radius:    10px;
    --dk-radius-lg: 14px;
    --dk-trans:     all 0.2s ease;

    /* ── Override BuildCrex.css / style.css variables ── */
    --bc-white:         rgba(255,255,255,0.06);
    --bc-light:         rgba(255,255,255,0.025);
    --bc-border:        rgba(255,255,255,0.07);
    --bc-border-2:      rgba(255,255,255,0.05);
    --bc-gold-light:    rgba(255,215,0,0.08);
    --bc-body:          #e8edf5;
    --bc-muted:         rgba(232,237,245,0.55);
    --bs-body-bg:       #0b1d3a;
    --bs-body-color:    #e8edf5;
    --bs-border-color:  rgba(255,255,255,0.07);
    --bs-card-bg:       rgba(255,255,255,0.07);
    --bs-light-rgb:     17,31,56;
    --bs-white-rgb:     17,31,56;
    --bs-secondary-bg:  rgba(255,255,255,0.04);
    --brand-gold-light: rgba(255,215,0,0.08);
}

/* ================================================================
   SCROLLBAR
================================================================ */
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.12) transparent; }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.22); }

/* ================================================================
   BODY & GLOBAL RESET
================================================================ */
html {
    background: var(--dk-bg) !important;
}
body {
    background: linear-gradient(160deg, #0b1d3a 0%, #0d2347 40%, #091829 100%) !important;
    background-attachment: fixed !important;
    color: var(--dk-text) !important;
    font-family: 'Inter', 'Archivo', sans-serif !important;
    min-height: 100vh;
}

/* Kill every white / near-white background from style.css */
*[class] {
    --bs-body-color: var(--dk-text);
    --bs-body-bg: transparent;
}

/* Force headings light */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: var(--dk-text) !important;
    font-family: 'Inter', sans-serif !important;
}

p, li, span, label, small, caption, figcaption,
.form-text, .text-body {
    /* color: var(--dk-muted) !important; */
}

a { color: var(--dk-text); transition: color 0.2s ease; }
a:hover { color: var(--dk-gold); }
a.text-decoration-none:hover { color: var(--dk-gold); }

/* Override Archivo/dark text from style.css */
.text-dark, .text-body, [style*="color:#1d1d1d"],
[style*="color: #1d1d1d"], [style*="color:#333"],
[style*="color: #333"], [style*="color:#242"] {
    color: var(--dk-text) !important;
}
.text-muted, .text-muted-2, [class*="text-muted"] {
    color: var(--dk-muted) !important;
}
.text-white { color: var(--dk-text) !important; }
.text-white-50 { color: var(--dk-muted) !important; }

hr { border-color: var(--dk-border) !important; opacity: 1; }
.dropdown-divider { border-color: var(--dk-border) !important; }

/* Transparent structural containers */
.container, .container-fluid, .container-sm,
.container-md, .container-lg, .container-xl,
.row, [class^="col-"], [class*=" col-"] {
    background: transparent !important;
}

/* Pages / wrappers */
.page-wrapper    { background: transparent !important; }
.content         { background: transparent !important; }
.page-wrapper > .content { animation: bcFadeUp 0.35s ease both; }

@keyframes bcFadeUp {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ================================================================
   SECTION BACKGROUNDS — replace #fff / #f7f8fb / #f5f5f5 etc.
================================================================ */
section, .bc-section, .bc-section--tight { background: transparent !important; }

/* Sections that had var(--bc-light) light bg */
section[style*="background:var(--bc-light)"],
section[style*="background: var(--bc-light)"],
.py-4.py-lg-5[style*="background"],
.py-5[style*="background:var(--bc-light)"] {
    background: rgba(255,255,255,0.025) !important;
}

/* ================================================================
   BOOTSTRAP — CARDS
================================================================ */
.card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    border-radius: var(--dk-radius-lg) !important;
    color: var(--dk-text) !important;
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.30) !important;
}
.card:hover {
    border-color: rgba(255,215,0,0.25) !important;
    box-shadow: 0 16px 48px rgba(0,0,0,0.45) !important;
}
.card-header {
    background: rgba(255,255,255,0.025) !important;
    border-bottom: 1px solid var(--dk-border) !important;
    color: var(--dk-text) !important;
    font-weight: 600 !important;
}
.card-footer {
    background: rgba(255,255,255,0.02) !important;
    border-top: 1px solid var(--dk-border) !important;
}
.card-body  { color: var(--dk-text) !important; }
.card-title { color: var(--dk-text) !important; }
.card-text  { color: var(--dk-muted) !important; }

/* style.css card overrides */
.card.bg-white, .card[style*="background:#fff"],
.card[style*="background: #fff"] {
    background: var(--dk-card) !important;
}

/* ================================================================
   BOOTSTRAP — BUTTONS
================================================================ */
.btn { transition: var(--dk-trans) !important; border-radius: var(--dk-radius) !important; font-weight: 600 !important; }
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

.btn-primary {
    background: var(--dk-gold) !important;
    border-color: var(--dk-gold) !important;
    color: var(--dk-navy) !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 18px var(--dk-gold-glow) !important;
}
.btn-primary:hover, .btn-primary:focus {
    background: #e8c800 !important;
    border-color: #e8c800 !important;
    color: var(--dk-navy) !important;
    box-shadow: 0 6px 24px rgba(255,215,0,0.4) !important;
}

.btn-secondary {
    background: rgba(255,255,255,0.08) !important;
    border-color: var(--dk-border-md) !important;
    color: var(--dk-text) !important;
}
.btn-secondary:hover {
    background: rgba(255,255,255,0.13) !important;
    color: var(--dk-text) !important;
}

.btn-dark, .btn-navy {
    background: rgba(255,255,255,0.07) !important;
    border-color: var(--dk-border-md) !important;
    color: var(--dk-text) !important;
}
.btn-dark:hover, .btn-navy:hover {
    background: rgba(255,255,255,0.13) !important;
    border-color: rgba(255,215,0,0.25) !important;
    color: var(--dk-gold) !important;
}

.btn-light, .btn-white {
    background: rgba(255,255,255,0.07) !important;
    border-color: var(--dk-border-md) !important;
    color: var(--dk-text) !important;
}
.btn-light:hover { background: rgba(255,255,255,0.12) !important; }

.btn-outline-primary {
    background: transparent !important;
    border-color: var(--dk-gold) !important;
    color: var(--dk-gold) !important;
}
.btn-outline-primary:hover {
    background: var(--dk-gold-dim) !important;
    color: var(--dk-gold) !important;
}

.btn-outline-dark, .btn-outline-secondary, .btn-outline-light {
    background: transparent !important;
    border-color: var(--dk-border-md) !important;
    color: var(--dk-text) !important;
}
.btn-outline-dark:hover, .btn-outline-secondary:hover, .btn-outline-light:hover {
    background: rgba(255,255,255,0.06) !important;
    border-color: rgba(255,215,0,0.3) !important;
    color: var(--dk-gold) !important;
}

.btn-success { background: #16a34a !important; border-color: #16a34a !important; color: #fff !important; }
.btn-danger  { background: #dc2626 !important; border-color: #dc2626 !important; color: #fff !important; }
.btn-warning { background: var(--dk-gold) !important; border-color: var(--dk-gold) !important; color: var(--dk-navy) !important; }
.btn-info    { background: #0ea5e9 !important; border-color: #0ea5e9 !important; color: #fff !important; }

/* bc-btn system */
.bc-btn { transition: var(--dk-trans) !important; border-radius: var(--dk-radius) !important; font-weight: 700 !important; }
.bc-btn:hover { transform: translateY(-1px); }
.bc-btn-primary { background: var(--dk-gold) !important; border-color: var(--dk-gold) !important; color: var(--dk-navy) !important; box-shadow: 0 4px 16px var(--dk-gold-glow) !important; }
.bc-btn-primary:hover { background: #e8c800 !important; box-shadow: 0 6px 22px rgba(255,215,0,0.4) !important; color: var(--dk-navy) !important; }
.bc-btn-navy { background: rgba(255,255,255,0.08) !important; border-color: var(--dk-border-md) !important; color: var(--dk-text) !important; }
.bc-btn-navy:hover { background: rgba(255,255,255,0.14) !important; color: var(--dk-gold) !important; }
.bc-btn-outline { border-color: var(--dk-border-md) !important; color: var(--dk-text) !important; background: transparent !important; }
.bc-btn-outline:hover { border-color: rgba(255,215,0,0.3) !important; color: var(--dk-gold) !important; background: var(--dk-gold-dim) !important; }
.bc-btn-ghost { background: rgba(255,255,255,0.05) !important; border-color: var(--dk-border) !important; color: var(--dk-muted) !important; }
.bc-btn-ghost:hover { background: rgba(255,255,255,0.1) !important; color: var(--dk-text) !important; }
.bc-btn-white-outline { background: transparent !important; border-color: rgba(255,255,255,0.3) !important; color: var(--dk-text) !important; }
.bc-btn-white-outline:hover { background: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.5) !important; }

/* Buildcrux / BuildCrex header buttons */
.buildcrux-btn, .BuildCrex-btn {
    background: var(--dk-gold) !important;
    border-color: var(--dk-gold) !important;
    color: var(--dk-navy) !important;
    font-weight: 700 !important;
}
.buildcrux-btn:hover, .BuildCrex-btn:hover {
    background: #e8c800 !important;
    color: var(--dk-navy) !important;
}
.buildcrux-btn-outline, .BuildCrex-btn-outline,
.buildcrux-header .buildcrux-btn-outline, .buildcrux-header .BuildCrex-btn-outline {
    border: 2px solid rgba(255,255,255,0.18) !important;
    color: var(--dk-text) !important;
    background: transparent !important;
}
.buildcrux-btn-outline:hover, .BuildCrex-btn-outline:hover,
.buildcrux-header .buildcrux-btn-outline:hover, .buildcrux-header .BuildCrex-btn-outline:hover {
    background: rgba(255,255,255,0.07) !important;
    border-color: rgba(255,255,255,0.32) !important;
}

/* btn-view service cards */
.btn-view {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid var(--dk-border-md) !important;
    color: var(--dk-text) !important;
    border-radius: var(--dk-radius) !important;
}
.btn-view:hover {
    background: var(--dk-gold-dim) !important;
    border-color: rgba(255,215,0,0.3) !important;
    color: var(--dk-gold) !important;
}

/* ================================================================
   BOOTSTRAP — FORMS
================================================================ */
.form-control, .form-select, textarea,
input[type="text"], input[type="email"],
input[type="password"], input[type="number"],
input[type="search"], input[type="tel"],
input[type="url"], input[type="date"],
input[type="time"], input[type="file"] {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-text) !important;
    border-radius: var(--dk-radius) !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
}
.form-control:focus, .form-select:focus,
textarea:focus, input:focus {
    background: rgba(255,255,255,0.07) !important;
    border-color: var(--dk-gold) !important;
    box-shadow: 0 0 0 3px rgba(255,215,0,0.13) !important;
    color: var(--dk-text) !important;
    outline: none !important;
}
.form-control::placeholder, textarea::placeholder,
input::placeholder { color: var(--dk-faint) !important; }
.form-select option, select option { background: #112040; color: var(--dk-text); }
.form-label  { color: var(--dk-muted) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .02em; }
.form-check-label { color: var(--dk-muted) !important; }
.form-text   { color: var(--dk-faint) !important; font-size: 12px; }
.form-check-input {
    background-color: rgba(255,255,255,0.04) !important;
    border-color: var(--dk-border-md) !important;
}
.form-check-input:checked {
    background-color: var(--dk-gold) !important;
    border-color: var(--dk-gold) !important;
}
.input-group-text {
    background: rgba(255,255,255,0.05) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-muted) !important;
}
.input-group-text:hover { color: var(--dk-gold) !important; }

/* ================================================================
   BOOTSTRAP — TABLES
================================================================ */
.table, .table > :not(caption) > * > * {
    background: transparent !important;
    color: var(--dk-text) !important;
    border-color: var(--dk-border) !important;
}
.table thead th {
    background: rgba(255,255,255,0.03) !important;
    color: var(--dk-faint) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    border-bottom: 1px solid var(--dk-border) !important;
}
.table tbody td { color: var(--dk-text) !important; border-color: var(--dk-border) !important; }
.table-hover tbody tr:hover > td { background: rgba(255,255,255,0.025) !important; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background: rgba(255,255,255,0.015) !important; }
tr.active > td {
    background: rgba(255,215,0,0.07) !important;
    border-left: 3px solid var(--dk-gold) !important;
}

/* ================================================================
   BOOTSTRAP — DROPDOWNS
================================================================ */
.dropdown-menu {
    background: rgba(14,28,56,0.97) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: var(--dk-radius-lg) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5) !important;
}
.dropdown-item {
    color: var(--dk-text) !important;
    border-radius: 7px !important;
    transition: all 0.15s ease !important;
    font-size: 14px !important;
}
.dropdown-item:hover, .dropdown-item:focus {
    background: rgba(255,255,255,0.05) !important;
    color: var(--dk-gold) !important;
}
.dropdown-item.active, .dropdown-item:active {
    background: var(--dk-gold-dim) !important;
    color: var(--dk-gold) !important;
}
.dropdown-item.text-danger { color: #f87171 !important; }
.dropdown-item.text-danger:hover { background: rgba(248,113,113,0.08) !important; }

/* ================================================================
   BOOTSTRAP — MODALS
================================================================ */
.modal-content {
    background: rgba(13,27,54,0.97) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 16px !important;
    color: var(--dk-text) !important;
    box-shadow: 0 30px 80px rgba(0,0,0,0.6) !important;
}
.modal-header {
    background: rgba(255,255,255,0.025) !important;
    border-color: var(--dk-border) !important;
}
.modal-title  { color: var(--dk-text) !important; font-weight: 700 !important; }
.modal-footer { background: rgba(255,255,255,0.015) !important; border-color: var(--dk-border) !important; }
.modal-body   { color: var(--dk-muted) !important; }
.modal-backdrop {
    background: rgba(6,15,36,0.88) !important;
    backdrop-filter: blur(4px) !important;
}
.btn-close { filter: invert(1) brightness(0.6); transition: filter 0.2s; }
.btn-close:hover { filter: invert(1) brightness(1); }

/* ================================================================
   BOOTSTRAP — NAV / TABS / PILLS
================================================================ */
.nav-link { color: var(--dk-muted) !important; transition: color 0.2s !important; }
.nav-link:hover, .nav-link.active { color: var(--dk-gold) !important; }
.nav-pills .nav-link { border-radius: 8px !important; padding: 8px 14px !important; }
.nav-pills .nav-link.active {
    background: var(--dk-gold-dim) !important;
    color: var(--dk-gold) !important;
}
.nav-tabs { border-color: var(--dk-border) !important; }
.nav-tabs .nav-link {
    border-color: transparent !important;
    color: var(--dk-muted) !important;
    border-radius: 8px 8px 0 0 !important;
}
.nav-tabs .nav-link.active {
    background: rgba(255,215,0,0.07) !important;
    border-color: var(--dk-border) var(--dk-border) transparent !important;
    color: var(--dk-gold) !important;
}

/* ================================================================
   BOOTSTRAP — PAGINATION
================================================================ */
.pagination { --bs-pagination-bg: transparent; }
.page-link {
    background: rgba(255,255,255,0.04) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
    transition: all 0.18s ease !important;
    border-radius: 8px !important;
}
.page-link:hover {
    background: rgba(255,255,255,0.09) !important;
    border-color: rgba(255,215,0,0.25) !important;
    color: var(--dk-gold) !important;
}
.page-item.active .page-link {
    background: var(--dk-gold) !important;
    border-color: var(--dk-gold) !important;
    color: var(--dk-navy) !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 14px var(--dk-gold-glow) !important;
}
.page-item.disabled .page-link { background: rgba(255,255,255,0.02) !important; color: var(--dk-faint) !important; }

/* ================================================================
   BOOTSTRAP — BADGES
================================================================ */
.badge { border-radius: 6px !important; font-weight: 600 !important; letter-spacing: .02em; }
.badge.bg-primary,   .badge.text-bg-primary,
.badge.bg-warning,   .badge.text-bg-warning  { background: rgba(255,215,0,0.14) !important; color: var(--dk-gold) !important; }
.badge.bg-success,   .badge.text-bg-success  { background: rgba(34,197,94,0.14) !important; color: #4ade80 !important; }
.badge.bg-danger,    .badge.text-bg-danger   { background: rgba(239,68,68,0.14) !important; color: #f87171 !important; }
.badge.bg-secondary, .badge.text-bg-secondary{ background: rgba(255,255,255,0.08) !important; color: var(--dk-muted) !important; }
.badge.bg-dark       { background: rgba(255,255,255,0.07) !important; color: var(--dk-text) !important; }
.badge.bg-info       { background: rgba(14,165,233,0.14) !important; color: #38bdf8 !important; }
.badge.bg-light      { background: rgba(255,255,255,0.08) !important; color: var(--dk-text) !important; }

/* bg-dark-subtle */
.bg-dark-subtle { background: rgba(255,255,255,0.06) !important; color: var(--dk-muted) !important; }

/* ================================================================
   BOOTSTRAP — ALERTS
================================================================ */
.alert {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    color: var(--dk-text) !important;
    backdrop-filter: blur(8px);
}
.alert-primary   { border-left: 4px solid var(--dk-gold) !important; }
.alert-success   { border-left: 4px solid #4ade80 !important; }
.alert-danger    { border-left: 4px solid #f87171 !important; }
.alert-warning   { border-left: 4px solid var(--dk-gold) !important; }
.alert-info      { border-left: 4px solid #38bdf8 !important; }
.alert-link      { color: var(--dk-gold) !important; font-weight: 700; }

/* ================================================================
   BOOTSTRAP — LIST GROUPS
================================================================ */
.list-group-item {
    background: rgba(255,255,255,0.03) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
    transition: background 0.15s ease;
}
.list-group-item:hover { background: rgba(255,255,255,0.05) !important; }
.list-group-item.active {
    background: var(--dk-gold-dim) !important;
    border-color: rgba(255,215,0,0.2) !important;
    color: var(--dk-gold) !important;
}

/* ================================================================
   BOOTSTRAP — ACCORDION
================================================================ */
.accordion-item {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    overflow: hidden;
    margin-bottom: 8px;
}
.accordion-button {
    background: transparent !important;
    color: var(--dk-text) !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    box-shadow: none !important;
}
.accordion-button:not(.collapsed) {
    background: rgba(255,215,0,0.05) !important;
    color: var(--dk-gold) !important;
}
.accordion-button::after { filter: invert(1) brightness(0.5); }
.accordion-button:not(.collapsed)::after { filter: invert(1) brightness(0.9); }
.accordion-body {
    background: transparent !important;
    color: var(--dk-muted) !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

/* ================================================================
   BOOTSTRAP — PROGRESS
================================================================ */
.progress {
    background: rgba(255,255,255,0.07) !important;
    height: 6px !important;
    border-radius: 999px !important;
    overflow: visible !important;
}
.progress-bar {
    background: var(--dk-gold) !important;
    border-radius: 999px !important;
    box-shadow: 0 0 8px var(--dk-gold-glow);
}

/* ================================================================
   BOOTSTRAP — BREADCRUMB
================================================================ */
.breadcrumb-bar {
    background: rgba(255,255,255,0.02) !important;
    border-bottom: 1px solid var(--dk-border) !important;
}
.breadcrumb-title { color: var(--dk-text) !important; }
.breadcrumb { background: transparent !important; }
.breadcrumb-item a { color: var(--dk-muted) !important; text-decoration: none; }
.breadcrumb-item a:hover { color: var(--dk-gold) !important; }
.breadcrumb-item.active { color: var(--dk-text) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--dk-faint) !important; }

/* ================================================================
   BOOTSTRAP — OFFCANVAS
================================================================ */
.offcanvas {
    background: rgba(11,25,58,0.97) !important;
    backdrop-filter: blur(20px) !important;
    border-color: var(--dk-border-md) !important;
    color: var(--dk-text) !important;
}
.offcanvas-header { border-color: var(--dk-border) !important; background: rgba(255,255,255,0.02) !important; }
.offcanvas-title  { color: var(--dk-text) !important; }

/* ================================================================
   HEADER
================================================================ */
.buildcrux-topbar { background: rgba(5,14,32,0.9) !important; border-bottom: 1px solid var(--dk-border) !important; }
.buildcrux-topbar a, .buildcrux-topbar span { color: rgba(232,237,245,0.7) !important; }
.buildcrux-topbar a:hover { color: var(--dk-gold) !important; }

.buildcrux-header {
    background: rgba(9,22,48,0.96) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid var(--dk-border) !important;
    box-shadow: 0 4px 28px rgba(0,0,0,0.35) !important;
}

.buildcrux-nav .nav-link {
    color: var(--dk-muted) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}
.buildcrux-nav .nav-link:hover,
.buildcrux-nav .nav-link.active {
    color: var(--dk-gold) !important;
    background: var(--dk-gold-dim) !important;
}

.buildcrux-dropdown .dropdown-menu {
    background: rgba(10,22,50,0.98) !important;
    border: 1px solid var(--dk-border-md) !important;
    box-shadow: 0 24px 60px rgba(0,0,0,0.55) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.buildcrux-dropdown .dropdown-item { color: var(--dk-muted) !important; font-size: 14px !important; }
.buildcrux-dropdown .dropdown-item:hover { background: rgba(255,255,255,0.05) !important; color: var(--dk-gold) !important; }

.header-icon-btn {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-muted) !important;
    transition: var(--dk-trans) !important;
}
.header-icon-btn:hover {
    background: var(--dk-gold-dim) !important;
    border-color: rgba(255,215,0,0.22) !important;
    color: var(--dk-gold) !important;
    transform: translateY(-1px);
}
.header-icon-badge { border-color: rgba(9,22,48,1) !important; }

.user-avatar { border: 2px solid rgba(255,215,0,0.35) !important; }
.user-menu .dropdown-menu { background: rgba(10,22,50,0.98) !important; }
.user-menu .dropdown-item { color: var(--dk-muted) !important; }
.user-menu .dropdown-item:hover { background: rgba(255,255,255,0.05) !important; color: var(--dk-gold) !important; }

/* Mobile nav */
.mobile-offcanvas { background: rgba(10,22,50,0.97) !important; }
.mobile-offcanvas .offcanvas-header { background: rgba(5,14,32,0.9) !important; }
.mobile-user-info { background: rgba(255,255,255,0.03) !important; border-bottom-color: var(--dk-border) !important; }
.mobile-user-info .name { color: var(--dk-text) !important; }
.mobile-user-info .role { color: var(--dk-muted) !important; }
.mobile-user-info img { border-color: rgba(255,215,0,0.3) !important; }
.mobile-menu-list > li { border-bottom-color: var(--dk-border) !important; }
.mobile-menu-link, .mobile-submenu a { color: var(--dk-muted) !important; background: transparent !important; }
.mobile-menu-link:hover, .mobile-menu-link.active,
.mobile-submenu a:hover, .mobile-submenu a.active {
    color: var(--dk-gold) !important;
    background: rgba(255,215,0,0.05) !important;
}
.mobile-has-submenu > .mobile-menu-link::after { border-color: var(--dk-faint) !important; }
.mobile-submenu { background: rgba(255,255,255,0.015) !important; }
.mobile-quick-actions {
    background: rgba(255,215,0,0.04) !important;
    border-top-color: rgba(255,215,0,0.08) !important;
}
.mobile-quick-actions a, .mobile-quick-actions span { color: var(--dk-muted) !important; }
.mobile-quick-actions a:hover { color: var(--dk-gold) !important; }

.hamburger-btn { background: rgba(255,255,255,0.06) !important; border: 1px solid var(--dk-border) !important; }
.hamburger-btn:hover { background: var(--dk-gold-dim) !important; }
.hamburger-btn span { background: var(--dk-text) !important; }

.mobile-bottom-bar {
    background: rgba(9,22,48,0.97) !important;
    backdrop-filter: blur(16px) !important;
    border-top: 1px solid var(--dk-border) !important;
    box-shadow: 0 -8px 30px rgba(0,0,0,0.4) !important;
}
.mobile-nav-item { color: var(--dk-faint) !important; }
.mobile-nav-item:hover, .mobile-nav-item.active {
    color: var(--dk-text) !important;
    background: rgba(255,215,0,0.06) !important;
}
.mobile-nav-item.active i { color: var(--dk-gold) !important; }
.mobile-nav-item-badge { border-color: rgba(9,22,48,1) !important; }

/* ================================================================
   FOOTER
================================================================ */
footer {
    background: rgba(7,18,40,0.97) !important;
    border-top: 1px solid var(--dk-border) !important;
    color: var(--dk-muted) !important;
}
footer .footer-top { background: transparent !important; padding: 48px 0 !important; }
footer .footer-bottom {
    background: rgba(0,0,0,0.18) !important;
    border-top: 1px solid var(--dk-border) !important;
    padding: 16px 0 !important;
}
footer h5 { color: var(--dk-text) !important; margin-bottom: 14px !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .03em; text-transform: uppercase; }
footer p  { color: var(--dk-muted) !important; font-size: 14px !important; }
footer a  { color: var(--dk-muted) !important; text-decoration: none; font-size: 14px; transition: color 0.18s ease; }
footer a:hover { color: var(--dk-gold) !important; }
footer .footer-menu { list-style: none !important; padding: 0 !important; margin: 0 !important; }
footer .footer-menu li { margin-bottom: 8px !important; }
footer .menu-links { list-style: none; padding: 0; margin: 0; display: flex; gap: 16px; }
footer .menu-links a { font-size: 13px; }
footer .card, footer [class*="bg-light"] {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
}
footer .form-control { background: rgba(255,255,255,0.05) !important; border-color: var(--dk-border) !important; color: var(--dk-text) !important; }
.bc-icon-btn {
    width: 36px !important; height: 36px !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    border-radius: 8px !important;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-muted) !important;
    transition: var(--dk-trans) !important;
    text-decoration: none !important;
}
.bc-icon-btn:hover {
    background: var(--dk-gold-dim) !important;
    border-color: rgba(255,215,0,0.22) !important;
    color: var(--dk-gold) !important;
    transform: translateY(-1px);
}

/* ================================================================
   PRELOADER
================================================================ */
#page-preloader {
    background: linear-gradient(135deg, #0a1f3d 0%, #0d2347 100%) !important;
}
.preloader-text { color: var(--dk-gold) !important; letter-spacing: .12em !important; }
.spinner-ring:nth-child(2) { border-top-color: rgba(255,255,255,0.15) !important; }

/* ================================================================
   PLUGIN — SELECT2
================================================================ */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
    min-height: 40px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--dk-text) !important; line-height: 38px !important; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--dk-faint) !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: var(--dk-muted) transparent transparent !important; }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--dk-gold) !important;
    box-shadow: 0 0 0 3px rgba(255,215,0,0.12) !important;
}
.select2-dropdown {
    background: rgba(11,25,58,0.99) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: var(--dk-radius-lg) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.55) !important;
}
.select2-container--default .select2-results__option { color: var(--dk-text) !important; font-size: 14px !important; border-radius: 6px; }
.select2-container--default .select2-results__option--highlighted { background: rgba(255,255,255,0.05) !important; color: var(--dk-gold) !important; }
.select2-container--default .select2-results__option--selected { background: var(--dk-gold-dim) !important; color: var(--dk-gold) !important; }
.select2-search--dropdown .select2-search__field {
    background: rgba(255,255,255,0.05) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
    border-radius: 7px !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--dk-gold-dim) !important;
    border-color: rgba(255,215,0,0.18) !important;
    color: var(--dk-gold) !important;
    border-radius: 5px !important;
}

/* ================================================================
   PLUGIN — SWEETALERT2
================================================================ */
.swal2-popup {
    background: rgba(12,26,55,0.98) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 16px !important;
    color: var(--dk-text) !important;
}
.swal2-title  { color: var(--dk-text) !important; font-weight: 800 !important; }
.swal2-html-container { color: var(--dk-muted) !important; }
.swal2-confirm { background: var(--dk-gold) !important; color: var(--dk-navy) !important; font-weight: 700 !important; border: none !important; border-radius: 8px !important; }
.swal2-cancel  { background: rgba(255,255,255,0.07) !important; color: var(--dk-text) !important; border: none !important; border-radius: 8px !important; }
.swal2-deny    { background: rgba(239,68,68,0.15) !important; color: #f87171 !important; border: none !important; border-radius: 8px !important; }
.swal2-close   { color: var(--dk-muted) !important; }
.swal2-backdrop-show { background: rgba(5,13,32,0.88) !important; }
.swal2-icon.swal2-warning { border-color: var(--dk-gold) !important; color: var(--dk-gold) !important; }
.swal2-icon.swal2-success { border-color: #4ade80 !important; }
.swal2-icon.swal2-success [class^="swal2-success-line"] { background: #4ade80 !important; }
.swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(74,222,128,0.3) !important; }

/* ================================================================
   PLUGIN — INTL-TEL-INPUT
================================================================ */
.iti__selected-flag { background: rgba(255,255,255,0.04) !important; border-right: 1px solid var(--dk-border) !important; }
.iti__selected-flag:hover { background: rgba(255,255,255,0.08) !important; }
.iti__country-list {
    background: rgba(11,25,58,0.99) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 10px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.55) !important;
    color: var(--dk-text) !important;
}
.iti__country:hover, .iti__country.iti__highlight { background: rgba(255,255,255,0.05) !important; }
.iti__country.iti__active { background: var(--dk-gold-dim) !important; }
.iti__divider { border-bottom-color: var(--dk-border) !important; }
.iti__dial-code { color: var(--dk-faint) !important; }

/* ================================================================
   PLUGIN — SWIPER
================================================================ */
.swiper-pagination-bullet { background: rgba(255,255,255,0.2) !important; opacity: 1 !important; }
.swiper-pagination-bullet-active { background: var(--dk-gold) !important; box-shadow: 0 0 6px var(--dk-gold-glow); }
.swiper-button-next, .swiper-button-prev { color: var(--dk-gold) !important; }

/* ================================================================
   PLUGIN — OWL CAROUSEL
================================================================ */
.owl-dot span { background: rgba(255,255,255,0.18) !important; }
.owl-dot.active span { background: var(--dk-gold) !important; }

/* ================================================================
   CUSTOM bc-* COMPONENTS
================================================================ */

/* bc-badge eyebrow */
.bc-badge { background: rgba(255,215,0,0.1) !important; color: var(--dk-gold) !important; border-radius: 999px !important; }

/* bc-tab filter tabs */
.bc-tab {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-muted) !important;
    border-radius: 999px !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: var(--dk-trans) !important;
}
.bc-tab:hover { border-color: rgba(255,215,0,0.2) !important; color: var(--dk-text) !important; }
.bc-tab.is-active { background: var(--dk-gold-dim) !important; border-color: rgba(255,215,0,0.22) !important; color: var(--dk-gold) !important; }

/* bc-stars */
.bc-stars i { color: rgba(255,255,255,0.12) !important; }
.bc-stars i.active { color: var(--dk-gold) !important; }

/* bc-link */
.bc-link { color: var(--dk-text) !important; font-weight: 700; }
.bc-link:hover { color: var(--dk-gold) !important; }

/* ================================================================
   SERVICE CARDS (from service_home / service_index)
================================================================ */
.service-card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    backdrop-filter: blur(10px) !important;
    transition: var(--dk-trans) !important;
}
.service-card:hover {
    border-color: rgba(255,215,0,0.22) !important;
    box-shadow: 0 14px 42px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,215,0,0.08) !important;
    transform: translateY(-3px);
}
.service-image { display: block !important; }
.service-title { color: var(--dk-text) !important; }
.service-price { color: var(--dk-gold) !important; font-weight: 800 !important; }
.service-body  { padding: 14px !important; background: transparent !important; }

.provider-chip {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: 10px !important;
}
.provider-chip-link:hover {
    background: rgba(255,215,0,0.05) !important;
    border-color: rgba(255,215,0,0.15) !important;
}
.provider-arrow { color: var(--dk-faint) !important; }
.provider-chip-link:hover .provider-arrow { color: var(--dk-gold) !important; }

.pill {
    background: rgba(9,20,42,0.85) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: var(--dk-text) !important;
    backdrop-filter: blur(6px) !important;
}
.card-overlay { background: linear-gradient(180deg, transparent 45%, rgba(5,12,28,0.75) 100%) !important; }
.wishlist-btn {
    background: rgba(9,20,42,0.85) !important;
    border-color: rgba(255,255,255,0.1) !important;
    color: var(--dk-muted) !important;
    backdrop-filter: blur(6px) !important;
}
.wishlist-btn:hover { background: rgba(255,215,0,0.12) !important; color: var(--dk-gold) !important; }

/* ================================================================
   PROVIDER CARDS
================================================================ */
.provider-card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    backdrop-filter: blur(10px) !important;
}
.provider-card:hover {
    border-color: rgba(255,215,0,0.2) !important;
    box-shadow: 0 14px 42px rgba(0,0,0,0.4) !important;
    transform: translateY(-3px);
}
.provider-bio-box {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-muted) !important;
    border-radius: 10px !important;
}
.provider-name-fea, .provider-name-link { color: var(--dk-text) !important; }
.provider-name-link:hover .provider-name-fea { color: var(--dk-gold) !important; }
.provider-username, .provider-location { color: var(--dk-faint) !important; }
.chip {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-text) !important;
    border-radius: 999px !important;
}
.verified-dot { background: rgba(34,197,94,0.15) !important; color: #4ade80 !important; border-color: rgba(34,197,94,0.2) !important; }
.pill-verified { background: rgba(34,197,94,0.1) !important; color: #4ade80 !important; border-color: rgba(34,197,94,0.2) !important; }
.provider-cta {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.provider-cta h4 { color: var(--dk-text) !important; }

/* ================================================================
   MARKETPLACE CARDS
================================================================ */
.mp-card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    backdrop-filter: blur(10px) !important;
}
.mp-card:hover { border-color: rgba(255,215,0,0.2) !important; transform: translateY(-3px); }
.mp-media { background: rgba(255,255,255,0.03) !important; }
.mp-cat-card { background: rgba(255,255,255,0.06) !important; border: 1px solid var(--dk-border) !important; }
.mp-seller-card { background: rgba(255,255,255,0.06) !important; border: 1px solid var(--dk-border) !important; }

/* ================================================================
   STEP / TRUST / TESTIMONIAL / PRICE CARDS
================================================================ */
.bc-step-card {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    backdrop-filter: blur(10px) !important;
}
.bc-step-card:hover { border-color: rgba(255,215,0,0.2) !important; transform: translateY(-3px); }
.bc-step-featured { border-color: rgba(255,215,0,0.2) !important; }
.bc-step-icon { background: rgba(255,215,0,0.1) !important; color: var(--dk-gold) !important; }
.bc-step-title h6 { color: var(--dk-text) !important; }

.bc-trust-item {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.bc-trust-item:hover { border-color: rgba(255,215,0,0.16) !important; }
.bc-trust-icon  { background: rgba(255,215,0,0.08) !important; color: var(--dk-gold) !important; }

.bc-safety-card {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.bc-safety-highlight { background: rgba(255,215,0,0.04) !important; }
.bc-safety-badge { background: rgba(255,215,0,0.08) !important; color: var(--dk-gold) !important; }

.bc-testimonial-card {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.bc-testimonial-card:hover { border-color: rgba(255,215,0,0.16) !important; transform: translateY(-2px); }
.bc-review-title { color: var(--dk-gold) !important; }

.bc-price-card {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    backdrop-filter: blur(10px) !important;
}
.bc-price-card:hover { border-color: rgba(255,215,0,0.18) !important; transform: translateY(-2px); }
.bc-price-highlight { background: rgba(255,215,0,0.04) !important; }
.bc-price-icon { background: rgba(255,215,0,0.1) !important; color: var(--dk-gold) !important; }
.bc-price-list li { color: var(--dk-muted) !important; }
.bc-price-list i { color: #4ade80 !important; }
.bc-price-footer { border-top-color: var(--dk-border) !important; }
.bc-price-free   { color: #4ade80 !important; }
.bc-price-accent { color: var(--dk-text) !important; }

.bc-join-card {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.bc-join-card:hover { border-color: rgba(255,215,0,0.16) !important; transform: translateY(-2px); }
.bc-join-icon { background: rgba(255,215,0,0.1) !important; color: var(--dk-gold) !important; }

.bc-steps-wrap {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.bc-step-row { border-bottom-color: var(--dk-border) !important; }
.bc-step-highlight { background: rgba(255,215,0,0.04) !important; border-radius: var(--dk-radius) !important; }
.bc-step-dot { background: rgba(255,215,0,0.1) !important; color: var(--dk-gold) !important; border: 1px solid rgba(255,215,0,0.15); }

/* ================================================================
   CTA BANNER
================================================================ */
.bc-cta-banner {
    border-color: rgba(255,255,255,0.05) !important;
    /* gradient is inline so keep it, just ensure text is light */
}
.bc-cta-trust { color: var(--dk-muted) !important; }
.bc-cta-trust i { color: var(--dk-gold) !important; }

/* ================================================================
   SEARCH / HERO ELEMENTS
================================================================ */
.search-card {
    background: rgba(10,25,55,0.92) !important;
    border: 1px solid var(--dk-border-md) !important;
    backdrop-filter: blur(14px) !important;
}
.hero-badge { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.12) !important; }
.trust-pill { background: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.1) !important; color: var(--dk-text) !important; }

/* ================================================================
   CATEGORIES
================================================================ */
.category-mini {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
    backdrop-filter: blur(8px) !important;
}
.category-mini:hover { border-color: rgba(255,215,0,0.2) !important; transform: translateY(-2px); }
.category-thumb-wrap { background: rgba(255,215,0,0.08) !important; border-color: var(--dk-border) !important; }

/* ================================================================
   FILTER CHIPS & SIDEBAR FILTERS
================================================================ */
.filter-chip {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-muted) !important;
    border-radius: 999px !important;
}
.filter-chip .x { background: rgba(255,255,255,0.05) !important; border-color: var(--dk-border) !important; color: var(--dk-muted) !important; }
.filter-chip:hover { border-color: rgba(255,215,0,0.22) !important; color: var(--dk-gold) !important; }

.filters-card-mobile, .theiaStickySidebar .card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid var(--dk-border) !important;
    backdrop-filter: blur(10px) !important;
}

/* ================================================================
   CUSTOM COMPONENTS
================================================================ */

/* Glass containers */
.glass-panel {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.glass-card {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}

/* Status badges */
.status-badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 11px; border-radius: 999px;
    font-size: 12px; font-weight: 600; letter-spacing: .02em;
}
.status-badge::before { content:''; width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.status-badge.active    { background: rgba(255,215,0,0.12);  color: var(--dk-gold); }
.status-badge.active::before { background: var(--dk-gold); box-shadow: 0 0 5px var(--dk-gold-glow); }
.status-badge.pending   { background: rgba(255,255,255,0.06); color: var(--dk-muted); }
.status-badge.pending::before { background: var(--dk-muted); }
.status-badge.completed { background: rgba(74,222,128,0.12); color: #4ade80; }
.status-badge.completed::before { background: #4ade80; }
.status-badge.rejected  { background: rgba(248,113,113,0.12); color: #f87171; }
.status-badge.rejected::before  { background: #f87171; }

/* Vertical nav menu */
.dark-nav-menu { display: flex; flex-direction: column; gap: 3px; }
.dark-nav-menu a {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 12px; border-radius: 8px;
    color: var(--dk-muted); text-decoration: none;
    font-size: 14px; font-weight: 500;
    transition: var(--dk-trans);
}
.dark-nav-menu a:hover { background: rgba(255,255,255,0.04); color: var(--dk-text); }
.dark-nav-menu a.active { background: var(--dk-gold-dim); color: var(--dk-gold); border-left: 3px solid var(--dk-gold); }
.dark-nav-menu a i { width: 18px; text-align: center; font-size: 16px; }

/* Toast */
.dark-toast {
    position: fixed; bottom: 24px; right: 24px; z-index: 9999;
    background: rgba(14,28,58,0.97);
    backdrop-filter: blur(12px);
    border: 1px solid var(--dk-border-md);
    border-left: 4px solid var(--dk-gold);
    border-radius: 10px; padding: 14px 18px;
    color: var(--dk-text);
    box-shadow: 0 12px 40px rgba(0,0,0,0.5);
    min-width: 260px; max-width: 360px;
    animation: toastIn 0.3s ease;
}
@keyframes toastIn { from { transform: translateX(110%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

/* Empty state */
.empty-state { text-align: center; padding: 52px 24px; }
.empty-state i { font-size: 48px; color: var(--dk-faint); display: block; margin-bottom: 16px; }
.empty-state h5 { color: var(--dk-text) !important; margin-bottom: 8px; }
.empty-state p  { color: var(--dk-muted) !important; margin-bottom: 20px; }

/* Skeleton shimmer */
@keyframes bcShimmer {
    0%   { background-position: -600px 0; }
    100% { background-position:  600px 0; }
}
.bc-skel, .bc-skel-layer {
    background: linear-gradient(90deg,
        rgba(255,255,255,0.03) 25%,
        rgba(255,255,255,0.07) 50%,
        rgba(255,255,255,0.03) 75%
    ) !important;
    background-size: 1200px 100% !important;
    animation: bcShimmer 1.5s ease-in-out infinite !important;
}
.bc-skel-layer.loaded { opacity: 0 !important; background: transparent !important; animation: none !important; }

/* ================================================================
   GLOBAL BACKGROUND KILLERS
   — target the most common white/light bg classes from style.css
================================================================ */
.bg-white  { background: rgba(255,255,255,0.03) !important; }
.bg-light  { background: rgba(255,255,255,0.03) !important; }
.bg-body   { background: var(--dk-bg) !important; }
.bg-light-200 { background: rgba(255,255,255,0.03) !important; }

/* Kill solid white from style.css inline & class combos */
[style*="background:#fff"]           { background: rgba(255,255,255,0.06) !important; }
[style*="background: #fff"]          { background: rgba(255,255,255,0.06) !important; }
[style*="background:#ffffff"]        { background: rgba(255,255,255,0.06) !important; }
[style*="background: #ffffff"]       { background: rgba(255,255,255,0.06) !important; }
[style*="background:white"]          { background: rgba(255,255,255,0.06) !important; }
[style*="background-color:#fff"]     { background-color: rgba(255,255,255,0.06) !important; }
[style*="background-color: #fff"]    { background-color: rgba(255,255,255,0.06) !important; }
[style*="background-color:#ffffff"]  { background-color: rgba(255,255,255,0.06) !important; }
[style*="background-color: white"]   { background-color: rgba(255,255,255,0.06) !important; }

/* Kill black backgrounds from style.css */
[style*="background:#000"],
[style*="background: #000"],
[style*="background:black"],
[style*="background:#0f1535"],
[style*="background: #0f1535"] {
    background: var(--dk-surface) !important;
}

/* ================================================================
   MISC UTILITIES
================================================================ */
.border        { border-color: var(--dk-border) !important; }
.border-top    { border-top-color: var(--dk-border) !important; }
.border-bottom { border-bottom-color: var(--dk-border) !important; }
.border-start  { border-left-color:   var(--dk-border) !important; }
.border-end    { border-right-color:  var(--dk-border) !important; }
.shadow, .shadow-sm { box-shadow: 0 6px 28px rgba(0,0,0,0.3) !important; }
.shadow-lg      { box-shadow: 0 16px 50px rgba(0,0,0,0.4) !important; }

.text-primary { color: var(--dk-gold) !important; }
.text-success { color: #4ade80 !important; }
.text-danger  { color: #f87171 !important; }
.text-warning { color: var(--dk-gold) !important; }
.text-info    { color: #38bdf8 !important; }

/* accordion in service pages */
.bc-accordion .accordion-item { background: rgba(255,255,255,0.05) !important; }
.bc-accordion .accordion-button { color: var(--dk-text) !important; background: transparent !important; }
.bc-accordion .accordion-button:not(.collapsed) { background: rgba(255,215,0,0.04) !important; color: var(--dk-gold) !important; }
.bc-accordion .accordion-body { color: var(--dk-muted) !important; }

/* Provider / Vendor btn aliases */
.provider-btn-secondary {
    background: rgba(255,255,255,0.05) !important;
    border-color: var(--dk-border-md) !important;
    color: var(--dk-text) !important;
    border-radius: var(--dk-radius) !important;
}
.provider-btn-secondary:hover { border-color: rgba(255,215,0,0.25) !important; color: var(--dk-gold) !important; }

/* Swiper custom buttons from service_home */
.bc-swiper-btn {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid var(--dk-border-md) !important;
    color: var(--dk-text) !important;
    backdrop-filter: blur(8px) !important;
}
.bc-swiper-btn:hover { background: var(--dk-gold-dim) !important; color: var(--dk-gold) !important; border-color: rgba(255,215,0,0.2) !important; }
.bc-swiper-pagination .swiper-pagination-bullet { background: rgba(255,255,255,0.18) !important; }
.bc-swiper-pagination .swiper-pagination-bullet-active { background: var(--dk-gold) !important; }

/* Section heading accent line */
.bc-section-header { border-bottom: 1px solid var(--dk-border) !important; }

/* pill-soft (provider verified etc) */
.pill-soft { background: rgba(255,255,255,0.05) !important; border-color: var(--dk-border) !important; color: var(--dk-muted) !important; }

/* ================================================================
   AUTH PAGES  (login / register / verify / forgot / reset)
================================================================ */

/* .muted is a custom class used in auth pages (not .text-muted) */
.muted { color: var(--dk-muted) !important; }

/* Main auth card wrapper */
.auth-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5) !important;
    overflow: hidden !important;
}

/* Left panel of auth card */
.auth-left {
    background: rgba(255,215,0,0.05) !important;
    border-right: 1px solid var(--dk-border) !important;
}

/* The dark-navy illustration box inside auth-left */
.auth-ill {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 16px !important;
    color: var(--dk-text) !important;
}

/* Chip elements in auth pages */
.chip {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--dk-border) !important;
    color: var(--dk-text) !important;
    border-radius: 999px !important;
}

/* Register / soft card */
.soft-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5) !important;
}

/* Hint / info boxes in register */
.hint, .username-box {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: 14px !important;
    color: var(--dk-muted) !important;
}

/* Username suggestion chips */
.username-chip {
    background: rgba(255,215,0,0.08) !important;
    border: 1px solid rgba(255,215,0,0.2) !important;
    color: var(--dk-gold) !important;
    border-radius: 999px !important;
}

/* Linear primary button variant used in auth forms */
.btn-linear-primary {
    background: linear-gradient(90deg, var(--dk-gold) 0%, #c9a800 100%) !important;
    color: var(--dk-navy) !important;
    border: none !important;
    font-weight: 800 !important;
}
.btn-linear-primary:hover { filter: brightness(1.06) !important; color: var(--dk-navy) !important; }

/* Bottom email-info note in login page */
.auth-note-box {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
    color: var(--dk-muted) !important;
}

/* ================================================================
   SERVICE DETAILS PAGE — AVAILABILITY NOTICES
================================================================ */
.availability-notice {
    background: rgba(255,215,0,0.08) !important;
    border: 1px solid rgba(255,215,0,0.18) !important;
    border-radius: 8px !important;
    color: var(--dk-gold) !important;
}
.date-blocked-warning {
    background: rgba(255,193,7,0.10) !important;
    border: 1px solid rgba(255,193,7,0.22) !important;
    border-radius: 6px !important;
    color: var(--dk-gold) !important;
}

/* ================================================================
   BREADCRUMB BAR — ensure dark glass, not white
================================================================ */
.breadcrumb-bar {
    background: rgba(9,22,48,0.80) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid var(--dk-border) !important;
    color: var(--dk-text) !important;
}
.breadcrumb-bar .breadcrumb-title { color: var(--dk-text) !important; }

/* ================================================================
   EXTENDED INLINE STYLE KILLERS
   Catch near-white & light-grey backgrounds not covered above
================================================================ */
[style*="background:#f6f7fb"],  [style*="background: #f6f7fb"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#f7f8fb"],  [style*="background: #f7f8fb"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#fafafa"],  [style*="background: #fafafa"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#f0f0f0"],  [style*="background: #f0f0f0"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#fbfcfe"],  [style*="background: #fbfcfe"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#f5f5f5"],  [style*="background: #f5f5f5"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#eeeff2"],  [style*="background: #eeeff2"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background:#eef0f4"],  [style*="background: #eef0f4"]  { background: rgba(255,255,255,0.04) !important; }
[style*="background-color:#f6f7fb"] { background-color: rgba(255,255,255,0.04) !important; }
[style*="background-color:#f7f8fb"] { background-color: rgba(255,255,255,0.04) !important; }
[style*="background-color:#fafafa"] { background-color: rgba(255,255,255,0.04) !important; }
[style*="background-color:#f5f5f5"] { background-color: rgba(255,255,255,0.04) !important; }

/* Kill light text colors used in auth pages as inline styles */
[style*="color:#667085"], [style*="color: #667085"] { color: var(--dk-muted) !important; }
[style*="color:#7a4f00"], [style*="color: #7a4f00"] { color: var(--dk-gold) !important; }
[style*="color:#856404"], [style*="color: #856404"] { color: var(--dk-gold) !important; }
[style*="color:#7c5700"], [style*="color: #7c5700"] { color: var(--dk-gold) !important; }
[style*="color:#1d1d1d"], [style*="color: #1d1d1d"] { color: var(--dk-text) !important; }
[style*="color:#1f2937"], [style*="color: #1f2937"] { color: var(--dk-text) !important; }
[style*="color:#333"],    [style*="color: #333"]    { color: var(--dk-text) !important; }

/* ================================================================
   MARKETPLACE SCOPE — carry dark theme into .marketplace-scope
================================================================ */
.marketplace-scope { background: transparent !important; }
.mp-hero {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.mp-hero-inner { background: transparent !important; }
.mp-stat { color: var(--dk-text) !important; }
.mp-stat-k { color: var(--dk-muted) !important; font-size: 12px !important; }
.mp-stat-v { color: var(--dk-text) !important; font-weight: 700 !important; }

/* ================================================================
   PROVIDERS PAGE
================================================================ */
.providers-hero {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}

/* ================================================================
   CONTACT / STATIC PAGES
================================================================ */
.contact-card, .static-card, .policy-card {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    color: var(--dk-text) !important;
}

/* ================================================================
   DARK SECTION VARIANTS — remove any hard backgrounds
================================================================ */
.section-dark, .bg-dark, .bg-navy {
    background: rgba(9,22,48,0.85) !important;
    backdrop-filter: blur(10px) !important;
}
.section-light, .bg-light-100, .bg-light-50 {
    background: rgba(255,255,255,0.025) !important;
}

/* ================================================================
   GENERIC LIGHT BACKGROUND KILLERS — breadth-first catch
================================================================ */
.bg-gray-100, .bg-gray-50, .bg-neutral-50,
.bg-white-smoke, .bg-off-white {
    background: rgba(255,255,255,0.03) !important;
}

/* Inline style: border-color light values */
[style*="border-color:#eef0f4"]  { border-color: var(--dk-border) !important; }
[style*="border-color:#f0f0f0"]  { border-color: var(--dk-border) !important; }
[style*="border-color:#e2e8f0"]  { border-color: var(--dk-border) !important; }
[style*="border:1px solid #eef0f4"]  { border-color: var(--dk-border) !important; }
[style*="border:1px solid #f0f0f0"]  { border-color: var(--dk-border) !important; }

/* ================================================================
   HEADER OVERRIDES — bulletproof the nav against inline style blocks
   These carry higher !important weight by being more specific
================================================================ */
.buildcrux-header .buildcrux-nav .nav-link {
    color: var(--dk-muted) !important;
}
.buildcrux-header .buildcrux-nav .nav-link:hover,
.buildcrux-header .buildcrux-nav .nav-link.active {
    color: var(--dk-gold) !important;
    background: var(--dk-gold-dim) !important;
}
.buildcrux-header .mobile-user-info {
    background: rgba(255,255,255,0.03) !important;
    border-bottom-color: var(--dk-border) !important;
}
.buildcrux-header .mobile-user-info .name  { color: var(--dk-text) !important; }
.buildcrux-header .mobile-user-info .role  { color: var(--dk-muted) !important; }
.mobile-submenu { background: rgba(255,255,255,0.02) !important; }
.mobile-submenu a { color: var(--dk-muted) !important; background: transparent !important; }
.mobile-submenu a:hover, .mobile-submenu a.active {
    color: var(--dk-gold) !important;
    background: rgba(255,215,0,0.05) !important;
}
.mobile-quick-actions {
    background: rgba(255,215,0,0.04) !important;
    border-top-color: rgba(255,215,0,0.08) !important;
}
.mobile-quick-actions a, .mobile-quick-actions span { color: var(--dk-muted) !important; }
.mobile-quick-actions a:hover { color: var(--dk-gold) !important; }
.mobile-bottom-bar {
    background: rgba(9,22,48,0.97) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-top: 1px solid var(--dk-border) !important;
}
.mobile-nav-item { color: var(--dk-faint) !important; }
.mobile-nav-item:hover, .mobile-nav-item.active {
    color: var(--dk-text) !important;
    background: rgba(255,215,0,0.06) !important;
}
.mobile-nav-item.active i { color: var(--dk-gold) !important; }
.hamburger-btn {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid var(--dk-border) !important;
}
.hamburger-btn:hover { background: var(--dk-gold-dim) !important; }
.hamburger-btn span  { background: var(--dk-text) !important; }
.buildcrux-btn-outline {
    border: 2px solid rgba(255,255,255,0.2) !important;
    color: var(--dk-text) !important;
    background: transparent !important;
}
.buildcrux-btn-outline:hover {
    background: rgba(255,255,255,0.07) !important;
    border-color: rgba(255,255,255,0.35) !important;
}

/* ================================================================
   HERO SEARCH CARD — force glass on white search card
================================================================ */
.search-card,
.hero-section .search-card {
    background: rgba(13,27,56,0.92) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 50px rgba(0,0,0,0.5) !important;
    color: var(--dk-text) !important;
}
.search-card h5, .hero-section .search-card h5 { color: var(--dk-text) !important; }
.search-card .text-muted, .hero-section .search-card .text-muted { color: var(--dk-muted) !important; }

/* ================================================================
   GENERIC  .page-wrapper .content   —  remove any lingering white
================================================================ */
.page-wrapper {
    background: transparent !important;
    min-height: 60vh;
}
.page-wrapper .content { background: transparent !important; }

/* ================================================================
   sd-* SERVICE DETAIL CLASSES (from BuildCrex.css)
================================================================ */
.sd-card {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
    color: var(--dk-text) !important;
}
.sd-sidebar {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.sd-section-title { color: var(--dk-text) !important; font-weight: 700 !important; }
.sd-section-title::after { background: var(--dk-gold) !important; }
.sd-seller-box {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.sd-price-box {
    background: rgba(255,215,0,0.06) !important;
    border: 1px solid rgba(255,215,0,0.12) !important;
    border-radius: var(--dk-radius) !important;
}
.sd-price-amount { color: var(--dk-gold) !important; font-weight: 800 !important; }
.sd-gallery-thumb {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: 8px !important;
    overflow: hidden;
}
.sd-gallery-thumb.active { border-color: var(--dk-gold) !important; }
.sd-badge { background: rgba(255,215,0,0.10) !important; color: var(--dk-gold) !important; border-radius: 999px !important; }
.sd-tag  { background: rgba(255,255,255,0.05) !important; color: var(--dk-muted) !important; border-radius: 999px !important; }
.sd-review-item {
    border-bottom: 1px solid var(--dk-border) !important;
    padding-bottom: 16px !important;
}
.sd-provider-chip {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.sd-stat-pill {
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: 999px !important;
    color: var(--dk-muted) !important;
}

/* ================================================================
   SELLER / STORE PAGES
================================================================ */
.seller-card, .store-card, .store-hero {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.store-cover-wrap { background: rgba(9,22,48,0.6) !important; }
.seller-badge { background: rgba(255,215,0,0.10) !important; color: var(--dk-gold) !important; }

/* ================================================================
   CART / CHECKOUT PAGES
================================================================ */
.cart-table-wrapper, .checkout-card, .order-summary-card {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius-lg) !important;
}
.cart-item-row { border-bottom: 1px solid var(--dk-border) !important; }
.order-total-row { border-top: 2px solid var(--dk-border-md) !important; }
.order-total-amount { color: var(--dk-gold) !important; font-weight: 800 !important; }

/* ================================================================
   PROVIDER PROFILE PAGE
================================================================ */
.provider-profile-hero {
    background: rgba(9,22,48,0.85) !important;
    backdrop-filter: blur(14px) !important;
    border-bottom: 1px solid var(--dk-border) !important;
}
.provider-cover-bg { background: rgba(9,22,48,0.6) !important; }
.provider-stats-bar {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: var(--dk-radius) !important;
}
.provider-stat-item { border-right: 1px solid var(--dk-border) !important; }
.provider-stat-label { color: var(--dk-faint) !important; font-size: 11px !important; }
.provider-stat-value { color: var(--dk-text) !important; font-weight: 700 !important; }

/* ================================================================
   MISC INLINE BACKGROUND KILLERS — catch the rest
================================================================ */

/* Near-white transparent backgrounds used in some sections */
[style*="background:rgba(255,255,255,0.9"],
[style*="background: rgba(255,255,255,0.9"],
[style*="background:rgba(255,255,255,.9"],
[style*="background: rgba(255,255,255,.9"] {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(12px) !important;
}

/* High-opacity white backgrounds */
[style*="background:rgba(255,255,255,0.8"],
[style*="background: rgba(255,255,255,0.8"],
[style*="background:rgba(255,255,255,.8"],
[style*="background: rgba(255,255,255,.8"] {
    background: rgba(255,255,255,0.07) !important;
    backdrop-filter: blur(10px) !important;
}

/* Semi-transparent white (common light-theme overlays) */
[style*="background:rgba(255,255,255,0.7"],
[style*="background: rgba(255,255,255,0.7"],
[style*="background:rgba(255,255,255,.7"],
[style*="background: rgba(255,255,255,.7"] {
    background: rgba(255,255,255,0.05) !important;
    backdrop-filter: blur(8px) !important;
}

/* Very opaque black used sometimes as overlay/section background */
[style*="background:rgba(0,0,0,0.9"],
[style*="background: rgba(0,0,0,0.9"],
[style*="background:rgba(0,0,0,.9"],
[style*="background: rgba(0,0,0,.9"] {
    background: rgba(9,22,48,0.95) !important;
    backdrop-filter: blur(14px) !important;
}
[style*="background:rgba(0,0,0,0.8"],
[style*="background: rgba(0,0,0,0.8"],
[style*="background:rgba(0,0,0,.8"],
[style*="background: rgba(0,0,0,.8"] {
    background: rgba(9,22,48,0.88) !important;
    backdrop-filter: blur(12px) !important;
}

/* ================================================================
   REGISTER PAGE SPECIFICS
================================================================ */
.error-summary {
    background: rgba(248,113,113,0.08) !important;
    border: 1px solid rgba(248,113,113,0.18) !important;
    border-radius: 16px !important;
}
.error-summary h6 { color: #f87171 !important; }
.error-summary li { color: #f87171 !important; }

.password-box {
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid var(--dk-border) !important;
    border-radius: 14px !important;
}
.password-rule { color: var(--dk-muted) !important; }
.password-rule.met { color: #4ade80 !important; }
.password-rule i { color: var(--dk-faint) !important; }
.password-rule.met i { color: #4ade80 !important; }

.username-prefix { color: var(--dk-faint) !important; }
.username-status.ok   { color: #4ade80 !important; }
.username-status.bad  { color: #f87171 !important; }
.username-status.muted { color: var(--dk-muted) !important; }

/* ================================================================
   FINAL SAFETY NET — any remaining bg-white / bg-light not caught
================================================================ */
.bg-white  { background: rgba(255,255,255,0.03) !important; }
.bg-light  { background: rgba(255,255,255,0.03) !important; }
.bg-light-100, .bg-gray, .bg-grey { background: rgba(255,255,255,0.03) !important; }

/* Ensure text inside any bg-white/bg-light is still readable */
.bg-white *, .bg-light * { color: var(--dk-text); }
.bg-white h1, .bg-white h2, .bg-white h3,
.bg-white h4, .bg-white h5, .bg-white h6,
.bg-light h1, .bg-light h2, .bg-light h3,
.bg-light h4, .bg-light h5, .bg-light h6 {
    color: var(--dk-text) !important;
}

/* ================================================================
   BuildCrex.CSS TEXT COLOR FIXES
   bc-navy (#0a1f3d) used as text on dark backgrounds = invisible
================================================================ */

/* Heading utility classes */
.bc-h1, .bc-h2, .bc-h3, .bc-h4 { color: var(--dk-text) !important; }
.bc-lead   { color: var(--dk-muted) !important; }
.bc-text-sm{ color: var(--dk-muted) !important; }
.bc-page   { color: var(--dk-text) !important; }

/* Ghost / soft buttons — transparent bg, need light text */
.mp-btn-ghost, .mp-btn-soft {
    color: var(--dk-muted) !important;
    border-color: var(--dk-border-md) !important;
    background: rgba(255,255,255,0.04) !important;
}
.mp-btn-ghost:hover, .mp-btn-soft:hover {
    color: var(--dk-gold) !important;
    border-color: rgba(255,215,0,0.25) !important;
    background: var(--dk-gold-dim) !important;
}

/* bc-btn-white and similar light variants */
.bc-btn-white {
    background: rgba(255,255,255,0.08) !important;
    color: var(--dk-text) !important;
    border-color: var(--dk-border-md) !important;
}
.bc-btn-white:hover {
    background: rgba(255,255,255,0.13) !important;
    color: var(--dk-gold) !important;
}

/* btn-soft — gold tinted soft button */
.btn-soft {
    background: rgba(255,215,0,0.08) !important;
    color: var(--dk-gold) !important;
    border-color: rgba(255,215,0,0.2) !important;
}
.btn-soft:hover {
    background: rgba(255,215,0,0.14) !important;
    color: var(--dk-gold) !important;
}

/* Provider / marketplace button that use bc-navy text */
.provider-btn-primary, .mp-btn-primary, .bc-btn-brand {
    color: var(--dk-navy) !important;
}

/* Section headers in service_home */
.bc-section-eyebrow { color: var(--dk-gold) !important; }
.bc-section-title   { color: var(--dk-text) !important; }
.bc-section-lead    { color: var(--dk-muted) !important; }

/* ================================================================
   BREADCRUMB TEXT — ensure white text on dark bg
================================================================ */
.breadcrumb-item a  { color: var(--dk-muted) !important; }
.breadcrumb-item.active { color: var(--dk-text) !important; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--dk-faint) !important; }

/* ================================================================
   MOBILE QUICK ACTIONS TEXT FIX
================================================================ */
.mobile-quick-actions a[style*="color"] { color: var(--dk-muted) !important; }
.mobile-quick-actions a:hover { color: var(--dk-gold) !important; }

/* ================================================================
   SOFT-CARD — frosted glass (used across auth, FAQ, pricing, etc.)
================================================================ */
.soft-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.35) !important;
    color: var(--dk-text) !important;
}
.soft-card:hover {
    border-color: rgba(255,215,0,0.22) !important;
    box-shadow: 0 16px 48px rgba(0,0,0,0.45) !important;
}

/* ================================================================
   FAQ PAGE — tab nav, accordion, category pills
================================================================ */
.tab-nav .nav-link {
    color: var(--dk-muted) !important;
    border-color: var(--dk-border) !important;
    border-radius: 12px !important;
}
.tab-nav .nav-link.active, .tab-nav .nav-link:hover {
    background: var(--dk-gold-dim) !important;
    color: var(--dk-gold) !important;
    border-color: rgba(255,215,0,0.22) !important;
}
.category-pill {
    background: rgba(255,215,0,0.10) !important;
    color: var(--dk-gold) !important;
    border-color: rgba(255,215,0,0.25) !important;
    border-radius: 999px !important;
}

/* ================================================================
   PRICING PAGE — pricing cards, check-list, compare table
================================================================ */
.pricing-card {
    background: rgba(255,255,255,0.06) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    border-radius: 22px !important;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,0.30) !important;
}
.pricing-card:hover, .pricing-card.featured {
    border-color: rgba(255,215,0,0.30) !important;
    box-shadow: 0 16px 48px rgba(0,0,0,0.45) !important;
}
.pricing-card .card-header-band {
    background: rgba(255,255,255,0.04) !important;
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.pricing-card.featured .card-header-band {
    background: rgba(255,215,0,0.08) !important;
    border-bottom-color: rgba(255,215,0,0.15) !important;
}
.pricing-card .price { color: var(--dk-text) !important; }
.pricing-card.featured .price { color: var(--dk-gold) !important; }

.check-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.check-list li {
    color: var(--dk-text) !important;
    border-bottom: 1px solid var(--dk-border) !important;
    padding: .45rem 0 !important;
}
.check-list li:last-child { border-bottom: 0 !important; }
.check-list .icon-yes { color: #4ade80 !important; }
.check-list .icon-no  { color: var(--dk-faint) !important; }

.section-title { color: var(--dk-text) !important; font-weight: 900 !important; }

.compare-table th {
    background: rgba(255,215,0,0.10) !important;
    color: var(--dk-gold) !important;
    border-color: rgba(255,215,0,0.15) !important;
}
.compare-table td {
    color: var(--dk-text) !important;
    border-color: var(--dk-border) !important;
    vertical-align: middle;
}
.compare-table tr:nth-child(even) td {
    background: rgba(255,255,255,0.03) !important;
}
.compare-table .yes { color: #4ade80 !important; font-weight: 700 !important; }
.compare-table .no  { color: var(--dk-faint) !important; }

/* ================================================================
   CONTACT PAGE — link-soft, mini-note, icon-tile, map
================================================================ */
.link-soft { color: var(--dk-text) !important; text-decoration: none; }
.link-soft:hover { color: var(--dk-gold) !important; }
.mini-note { color: var(--dk-muted) !important; }
.icon-tile {
    background: rgba(255,215,0,0.12) !important;
    color: var(--dk-gold) !important;
    border-radius: 14px !important;
}
.contact-map { border: 1px solid var(--dk-border) !important; border-radius: 18px !important; }

/* ================================================================
   BECOME-PROVIDER / STATIC HERO PAGES
================================================================ */
.become-hero, .pricing-hero, .faq-hero, .contact-hero, .page-hero {
    background:
        radial-gradient(900px 380px at 20% 0%, rgba(255,215,0,.12), transparent 55%),
        radial-gradient(900px 380px at 85% 0%, rgba(14,120,255,.10), transparent 55%),
        var(--dk-bg) !important;
}

/* ================================================================
   INLINE STYLE AMBER / WARM COLOR KILLERS
================================================================ */
[style*="color:#92400e"], [style*="color: #92400e"] { color: var(--dk-gold) !important; }
[style*="color:#7c5700"], [style*="color: #7c5700"] { color: var(--dk-gold) !important; }
[style*="color:#d97706"], [style*="color: #d97706"] { color: var(--dk-gold) !important; }
[style*="color:#344054"], [style*="color: #344054"] { color: var(--dk-text) !important; }
[style*="color:#111827"], [style*="color: #111827"] { color: var(--dk-text) !important; }
[style*="color:#0a1f3d"], [style*="color: #0a1f3d"] { color: var(--dk-text) !important; }
[style*="color:#2c3547"], [style*="color: #2c3547"] { color: var(--dk-text) !important; }
[style*="color:#6b7280"], [style*="color: #6b7280"] { color: var(--dk-muted) !important; }
[style*="color:#98A2B3"], [style*="color: #98a2b3"] { color: var(--dk-faint) !important; }

/* Warm light backgrounds in inline styles */
[style*="background:linear-gradient(135deg,#fffbeb"],
[style*="background: linear-gradient(135deg, #fffbeb"],
[style*="background:linear-gradient(135deg, #fffbeb"] {
    background: rgba(255,215,0,0.06) !important;
    border-color: rgba(255,215,0,0.15) !important;
}
[style*="border-color:#fde68a"], [style*="border-color: #fde68a"] {
    border-color: rgba(255,215,0,0.20) !important;
}

/* ================================================================
   BOOTSTRAP — ADDITIONAL OVERRIDES
   Form validation, tooltips, popovers, spinners
================================================================ */

/* Validation feedback */
.valid-feedback   { color: #4ade80 !important; }
.invalid-feedback { color: #f87171 !important; }
.form-control.is-valid, .form-select.is-valid {
    border-color: #4ade80 !important;
    box-shadow: 0 0 0 3px rgba(74,222,128,0.12) !important;
}
.form-control.is-invalid, .form-select.is-invalid {
    border-color: #f87171 !important;
    box-shadow: 0 0 0 3px rgba(248,113,113,0.12) !important;
}

/* Tooltip */
.tooltip-inner {
    background: rgba(10,25,55,0.97) !important;
    color: var(--dk-text) !important;
    border: 1px solid var(--dk-border-md) !important;
    border-radius: 8px !important;
    backdrop-filter: blur(10px) !important;
}
.tooltip .tooltip-arrow::before { border-color: transparent !important; }

/* Popover */
.popover {
    background: rgba(10,25,55,0.97) !important;
    border: 1px solid var(--dk-border-md) !important;
    backdrop-filter: blur(14px) !important;
}
.popover-header {
    background: rgba(255,255,255,0.03) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}
.popover-body { color: var(--dk-muted) !important; }

/* Spinner */
.spinner-border { color: var(--dk-gold) !important; }
.spinner-grow   { color: var(--dk-gold) !important; }

/* Toast (Bootstrap) */
.toast {
    background: rgba(10,25,55,0.97) !important;
    border-color: var(--dk-border-md) !important;
    backdrop-filter: blur(14px) !important;
    color: var(--dk-text) !important;
}
.toast-header {
    background: rgba(255,255,255,0.03) !important;
    color: var(--dk-text) !important;
    border-color: var(--dk-border) !important;
}

/* Form floating labels */
.form-floating > label { color: var(--dk-faint) !important; }
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label {
    color: var(--dk-gold) !important;
}

/* Range input */
input[type="range"] { accent-color: var(--dk-gold); }

/* Input group addon borders */
.input-group > .form-control,
.input-group > .form-select,
.input-group > .input-group-text {
    border-color: var(--dk-border) !important;
}
.input-group > .form-control:focus { border-color: var(--dk-gold) !important; }

/* Custom select arrow - override the background shorthand that resets image to none */
.form-select,
.form-select:focus {
    background-color: rgba(255,255,255,0.04) !important;
    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='%23e8edf5' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
    padding-right: 2.25rem !important;
}
.form-select:focus {
    background-color: rgba(255,255,255,0.07) !important;
}

/* ================================================================
   PROVIDER / VENDOR DASHBOARD — table, card, badge overrides
================================================================ */
body.bc-dark .table {
    --bs-table-bg: transparent !important;
    --bs-table-border-color: rgba(255,255,255,0.08) !important;
    --bs-table-striped-bg: rgba(255,255,255,0.03) !important;
    --bs-table-hover-bg: rgba(255,255,255,0.05) !important;
    color: var(--dk-text) !important;
}
body.bc-dark .table th,
body.bc-dark .table td { border-color: rgba(255,255,255,0.08) !important; }
body.bc-dark thead tr { background: rgba(255,255,255,0.06) !important; }
body.bc-dark .table-light { background: rgba(255,255,255,0.06) !important; color: var(--dk-text) !important; }

/* Kill leftover white backgrounds on provider/vendor pages */
body.bc-dark .bg-white { background: rgba(255,255,255,0.04) !important; }
body.bc-dark .bg-light  { background: rgba(255,255,255,0.06) !important; color: var(--dk-text) !important; }
body.bc-dark .input-group-text { background: rgba(255,255,255,0.06) !important; border-color: rgba(255,255,255,0.12) !important; color: var(--dk-text) !important; }

/* Text colours that disappear on dark */
body.bc-dark .text-dark { color: var(--dk-text) !important; }
body.bc-dark .text-body { color: var(--dk-text) !important; }

/* Bootstrap 5 subtle badges (success-subtle etc.) look awful on dark */
body.bc-dark .bg-success-subtle  { background: rgba(22,163,74,.20)  !important; }
body.bc-dark .bg-danger-subtle   { background: rgba(239,68,68,.20)   !important; }
body.bc-dark .bg-warning-subtle  { background: rgba(245,158,11,.20)  !important; }
body.bc-dark .bg-secondary-subtle{ background: rgba(255,255,255,.10) !important; }
body.bc-dark .bg-dark-subtle     { background: rgba(255,255,255,.10) !important; }
body.bc-dark .text-success { color: #4ade80 !important; }
body.bc-dark .text-danger  { color: #f87171 !important; }
body.bc-dark .text-warning { color: #fbbf24 !important; }
body.bc-dark .text-secondary { color: rgba(232,237,245,0.55) !important; }

/* Dropdown menus */
body.bc-dark .dropdown-menu {
    background: #0f2040 !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,0.40) !important;
}
body.bc-dark .dropdown-item { color: var(--dk-text) !important; }
body.bc-dark .dropdown-item:hover, body.bc-dark .dropdown-item:focus {
    background: rgba(255,255,255,0.08) !important;
    color: #ffd700 !important;
}
body.bc-dark .dropdown-divider { border-color: rgba(255,255,255,0.10) !important; }

/* Button overrides */
body.bc-dark .btn-light  { background: rgba(255,255,255,0.08) !important; border-color: rgba(255,255,255,0.15) !important; color: var(--dk-text) !important; }
body.bc-dark .btn-outline-dark { border-color: rgba(255,255,255,0.25) !important; color: var(--dk-text) !important; }
body.bc-dark .btn-outline-dark:hover { background: rgba(255,255,255,0.10) !important; }

/* Nav pills active in dark */
body.bc-dark .nav-pills .nav-link { color: rgba(232,237,245,0.70) !important; }
body.bc-dark .nav-pills .nav-link.active { background: #ffd700 !important; color: #0a1f3d !important; }
body.bc-dark .nav-pills .nav-link:hover:not(.active) { background: rgba(255,255,255,0.08) !important; color: var(--dk-text) !important; }

/* Alert boxes */
body.bc-dark .alert-warning { background: rgba(245,158,11,.15) !important; border-color: rgba(245,158,11,.30) !important; color: #fbbf24 !important; }
body.bc-dark .alert-success { background: rgba(22,163,74,.15)  !important; border-color: rgba(22,163,74,.30)  !important; color: #4ade80 !important; }
body.bc-dark .alert-danger  { background: rgba(239,68,68,.15)  !important; border-color: rgba(239,68,68,.30)  !important; color: #f87171 !important; }

/* ================================================================
   TEXT UTILITY CATCH-ALL — dark text classes often missed
================================================================ */
.text-dark         { color: var(--dk-text) !important; }
.text-black        { color: var(--dk-text) !important; }
.text-secondary    { color: var(--dk-muted) !important; }
.fw-bold, .fw-semibold, strong, b { color: inherit; }

/* Headings inside card/soft-card get forced light */
.soft-card h1, .soft-card h2, .soft-card h3,
.soft-card h4, .soft-card h5, .soft-card h6,
.auth-card h1, .auth-card h2, .auth-card h3,
.auth-card h4, .auth-card h5, .auth-card h6,
.pricing-card h1, .pricing-card h2, .pricing-card h3,
.pricing-card h4, .pricing-card h5, .pricing-card h6 {
    color: var(--dk-text) !important;
}
.soft-card p, .soft-card li,
.auth-card p, .auth-card li,
.pricing-card p, .pricing-card li {
    color: var(--dk-muted);
}

/* ================================================================
   SMALL / MISC TEXT
================================================================ */
small, .small { color: var(--dk-muted) !important; }
.text-sm-muted { color: var(--dk-muted) !important; }
abbr[title] { text-decoration-color: var(--dk-muted); color: var(--dk-muted) !important; }

/* ================================================================
   MISSING PARTIAL CLASSES — not covered elsewhere
================================================================ */

/* Step media (image wrapper in how-it-works partial) */
.bc-step-media {
    background: rgba(255,255,255,0.04) !important;
    border-color: rgba(255,255,255,0.08) !important;
}

/* Realtime jobs */
.bc-job-card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}
.bc-job-card:hover { border-color: rgba(255,215,0,0.22) !important; transform: translateY(-2px); }
.bc-job-thumb { background: rgba(255,255,255,0.04) !important; }

/* Provider avatar */
.provider-avatar-fea {
    background: rgba(255,255,255,0.08) !important;
    border-color: rgba(255,255,255,0.15) !important;
}

/* Category / service pills */
.pill-light {
    background: rgba(255,255,255,0.06) !important;
    border-color: rgba(255,255,255,0.10) !important;
    color: var(--dk-muted) !important;
}
.pill-category { color: var(--dk-muted) !important; }
.bc-arrow-pill { color: var(--dk-muted) !important; }

/* ================================================================
   MARKETPLACE TOOLBAR & CARD CONTAINERS — not covered above
================================================================ */
.mp-toolbar, .sellers-toolbar {
    background: rgba(255,255,255,0.06) !important;
    border-color: rgba(255,255,255,0.10) !important;
    backdrop-filter: blur(12px) !important;
}
.mp-toolbar .count, .sellers-toolbar .count { color: var(--dk-text) !important; }
.mp-toolbar .sub, .sellers-toolbar .sub { color: var(--dk-muted) !important; }

.filters-card {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    backdrop-filter: blur(12px) !important;
}

.card-s {
    background: rgba(255,255,255,0.06) !important;
    border-color: rgba(255,255,255,0.10) !important;
    backdrop-filter: blur(12px) !important;
}

.cart-item {
    background: rgba(255,255,255,0.06) !important;
    border-color: rgba(255,255,255,0.10) !important;
}

/* store-scope text color override — var(--mcx-dark) is light-theme value */
.store-scope { color: var(--dk-text) !important; }
.store-scope .text-dark, .store-scope h1, .store-scope h2,
.store-scope h3, .store-scope h4, .store-scope h5, .store-scope h6 {
    color: var(--dk-text) !important;
}

/* Marketplace btn-filter-toggle */
.btn-filter-toggle {
    background: rgba(255,255,255,0.06) !important;
    border-color: rgba(255,255,255,0.10) !important;
    color: var(--dk-text) !important;
}

/* ================================================================
   DESIGN SYSTEM v2 — BuildCrex NAVY + GOLD
   All sections below were consolidated here.
================================================================ */

/* ── Body: radial depth gradient ── */
body {
    background:
        radial-gradient(ellipse at 55% 0%, rgba(21,43,74,0.52) 0%, transparent 62%),
        linear-gradient(160deg, #0b1d3a 0%, #0d2347 40%, #091829 100%) !important;
    background-attachment: fixed !important;
}

/* ── 1. Elevated navy cards (visible on body background) ── */
.card {
    background: #152b4a !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
.card:hover {
    box-shadow: 0 12px 36px rgba(0,0,0,0.40), inset 0 -2px 0 rgba(255,215,0,0.40) !important;
}

/* ── 2. Service / product / store / job cards ── */
.service-card, .mp-card, .store-card, .bc-job-card {
    background: #152b4a !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    box-shadow: 0 4px 18px rgba(0,0,0,.28) !important;
}
.service-card:hover {
    box-shadow: 0 16px 34px rgba(255,215,0,.14), inset 0 -2px 0 rgba(255,215,0,.50) !important;
    border-color: rgba(255,215,0,.22) !important;
}
.service-media, .mp-media, .store-cover { background: #0f2240 !important; }

/* ── 3. Ghost-gold "View" / "btn-view" ── */
.btn-view {
    background: transparent !important;
    border: 1.5px solid rgba(255,215,0,.42) !important;
    color: #ffd700 !important;
    font-weight: 600 !important;
}
.btn-view:hover {
    background: rgba(255,215,0,.10) !important;
    border-color: rgba(255,215,0,.70) !important;
    color: #ffd700 !important;
    transform: none !important;
}

/* ── 4. Gold micro-interactions — icons on cards ── */
.service-card .ti-map-pin,
.service-card .ti-bolt,
.service-card .ti-star-filled,
.mp-card .ti-map-pin,
.mp-card .ti-star-filled { color: var(--dk-gold) !important; }

/* ── 5. Dashboard KPI widgets ── */
.dash-widget {
    background: #152b4a !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.25) !important;
}
.prov-widget {
    background: #152b4a !important;
    border: 1px solid rgba(255,255,255,.08) !important;
}
.dash-widget h5, .dash-widget .fs-14,
.dash-widget span:not(.badge) { color: var(--dk-text) !important; }
.dash-icon, .prov-icon {
    background: rgba(255,255,255,.08) !important;
    color: var(--dk-gold) !important;
    border-radius: 10px !important;
}

/* bg-*-transparent widget icon pills */
.bg-primary-transparent   { background: rgba(255,215,0,.14) !important; color: var(--dk-gold) !important; }
.bg-secondary-transparent { background: rgba(255,255,255,.08) !important; color: var(--dk-muted) !important; }
.bg-success-transparent   { background: rgba(74,222,128,.12) !important; color: #4ade80 !important; }
.bg-danger-transparent    { background: rgba(248,113,113,.12) !important; color: #f87171 !important; }
.bg-warning-transparent   { background: rgba(255,215,0,.12) !important; color: var(--dk-gold) !important; }
.bg-info-transparent      { background: rgba(56,189,248,.12) !important; color: #38bdf8 !important; }
.bg-dark-transparent      { background: rgba(255,255,255,.06) !important; color: var(--dk-muted) !important; }
.bg-info.prov-icon        { background: rgba(56,189,248,.14) !important; color: #38bdf8 !important; }
.bg-success.prov-icon     { background: rgba(74,222,128,.14) !important; color: #4ade80 !important; }
.bg-danger.prov-icon      { background: rgba(248,113,113,.14) !important; color: #f87171 !important; }

/* ── 6. Client sidebar nav ── */
.client-nav a { color: var(--dk-muted) !important; }
.client-nav a:hover {
    background: rgba(255,255,255,.06) !important;
    color: var(--dk-text) !important;
}
.client-nav a.active {
    background: rgba(255,215,0,.12) !important;
    color: #ffd700 !important;
    font-weight: 600 !important;
}
.dash-head { border-bottom: 1px solid rgba(255,255,255,.07); padding-bottom: 14px; margin-bottom: 18px !important; }
.dash-sub  { color: var(--dk-muted) !important; }

/* ── 7. Provider + Vendor dashboard layout ── */
.provider-page .main-sidebar,
.provider-page .sidebar,
.provider-page .sidebar-inner,
.provider-page .side-menu {
    background: #0e2040 !important;
    border-right: 1px solid rgba(255,255,255,.06) !important;
}
.provider-page .sidebar-logo,
.provider-page .logo-box {
    background: #0a1a35 !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
.provider-page .sidebar .menu-title { color: var(--dk-faint) !important; }
.provider-page .sidebar a,
.provider-page .sidebar .nav-link { color: var(--dk-muted) !important; }
.provider-page .sidebar a:hover,
.provider-page .sidebar a.active,
.provider-page .sidebar .nav-link:hover,
.provider-page .sidebar .nav-link.active {
    background: rgba(255,215,0,.10) !important;
    color: var(--dk-gold) !important;
}

/* ── 7b. Provider header ── */
.provider-header,
.provider-page .header,
.provider-page header {
    background: rgba(9,18,38,.97) !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    backdrop-filter: blur(20px) !important;
    box-shadow: 0 2px 16px rgba(0,0,0,.35) !important;
}
.provider-page .header-left {
    background: transparent !important;
    border-right: 1px solid rgba(255,255,255,.06) !important;
}
.provider-page #toggle_btn i { color: var(--dk-muted) !important; }
.provider-page .bar-icon span { background-color: var(--dk-text) !important; }
.provider-page .header-user .provider-head-links a,
.provider-page .header-user .notify-link,
.provider-page .header-user .dark-mode-toggle,
.provider-page .header-user .site-link a { color: var(--dk-muted) !important; }
.provider-page .header-user .provider-head-links a:hover,
.provider-page .header-user .notify-link:hover,
.provider-page .header-user .dark-mode-toggle:hover { color: var(--dk-text) !important; }
.provider-page .header .user-img img,
.provider-page .header .booking-user img { border: 2px solid rgba(255,215,0,.30) !important; }
.provider-page .mobile-user-menu .nav-link { color: var(--dk-muted) !important; }
.provider-page .progress-bar { background: linear-gradient(90deg,#ffd700,#c9a800) !important; }
.provider-page .progress { background: rgba(255,255,255,.08) !important; }

/* ── 7c. Notification dropdown ── */
.provider-page .notification-dropdown,
.provider-page .header .dropdown-menu {
    background: #0d2040 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.55) !important;
    color: var(--dk-text) !important;
}
.provider-page .notification-dropdown .border-bottom { border-color: rgba(255,255,255,.08) !important; }
.provider-page .notification-dropdown p,
.provider-page .notification-dropdown .text-dark,
.provider-page .notification-dropdown .notification-title { color: var(--dk-text) !important; }
.provider-page .notification-dropdown .text-muted { color: var(--dk-muted) !important; }
.provider-page .notification-dropdown .text-gray { color: var(--dk-faint) !important; }
.provider-page .notification-dropdown .btn-link { color: var(--dk-gold) !important; }
.provider-page .header .dropdown-menu .dropdown-item { color: var(--dk-text) !important; }
.provider-page .header .dropdown-menu .dropdown-item:hover {
    background: rgba(255,255,255,.07) !important;
    color: var(--dk-gold) !important;
}

/* ── 7d. View All btn in notification footer ── */
.btn-notif-all {
    background: transparent !important;
    border: 1.5px solid rgba(255,215,0,.42) !important;
    color: #ffd700 !important;
    font-weight: 600 !important;
}
.btn-notif-all:hover {
    background: rgba(255,215,0,.10) !important;
    border-color: rgba(255,215,0,.70) !important;
    color: #ffd700 !important;
}

/* ── 7e. Noti-badge border ── */
.noti-badge { border-color: rgba(9,18,38,.97) !important; }

/* ── 8. PWA install banner ── */
.bcx-banner-inner {
    background: #0e2040 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
}
.bcx-banner-copy strong { color: #e8edf5 !important; }
.bcx-banner-copy span   { color: rgba(232,237,245,.55) !important; }
.bcx-btn-install {
    background: #ffd700 !important;
    color: #0a1f3d !important;
    border-radius: 10px !important;
}
.bcx-btn-close { color: rgba(232,237,245,.55) !important; }

/* ── 9. Marketplace aggregate card backgrounds ── */
.filters-card, .card-s, .cart-item, .cardx, .cardx-soft,
.pdp-summary { background: #152b4a !important; }
.mp-seller, .store-stats { border-color: rgba(255,255,255,.07) !important; }
.cat-head-inner { background: #152b4a !important; border-color: rgba(255,255,255,.08) !important; }
.spec-table td:first-child,
.mcx-soft, .tab-soft { background: #0f2240 !important; }

/* ── 10. Frontend header icon buttons (visibility fix) ── */
.header-icon-btn {
    background: rgba(255,255,255,0.10) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    color: var(--dk-text) !important;
}
.header-icon-btn:hover {
    background: rgba(255,215,0,0.16) !important;
    border-color: rgba(255,215,0,0.32) !important;
    color: var(--dk-gold) !important;
}
.header-icon-badge { border-color: rgba(9,22,48,1) !important; }

/* ── 11. Frontend header dropdown toggle: fix muted span text ── */
.dropdown-toggle span,
a.dropdown-toggle span,
.user-menu .dropdown-toggle span,
.user-menu .dropdown-toggle .fw-medium { color: var(--dk-text) !important; }

/* Dropdown caret arrow */
.dropdown-toggle::after {
    border-top-color: rgba(232,237,245,0.55) !important;
    vertical-align: .2em;
}

/* ── 12. Badge opacity — more readable on dark backgrounds ── */
.badge.bg-warning, .badge.text-bg-warning {
    background: rgba(255,215,0,0.22) !important;
    color: var(--dk-gold) !important;
}
.badge.bg-success, .badge.text-bg-success {
    background: rgba(34,197,94,0.22) !important;
    color: #4ade80 !important;
}
.badge.bg-danger, .badge.text-bg-danger {
    background: rgba(239,68,68,0.22) !important;
    color: #f87171 !important;
}
.badge.bg-info, .badge.text-bg-info {
    background: rgba(14,165,233,0.22) !important;
    color: #38bdf8 !important;
}
.badge.bg-primary, .badge.text-bg-primary {
    background: rgba(255,215,0,0.22) !important;
    color: var(--dk-gold) !important;
}

/* ── 13. Alerts on dark background ── */
.alert-light, .alert-secondary {
    background: rgba(255,255,255,.04) !important;
    border-color: rgba(255,255,255,.10) !important;
    color: var(--dk-muted) !important;
}
.alert-light a, .alert-secondary a { color: var(--dk-gold) !important; }
.alert-info {
    background: rgba(14,165,233,.10) !important;
    border-color: rgba(14,165,233,.22) !important;
    color: #7dd3fc !important;
}

/* ── 14. Table thead readability (30% → 55%) ── */
.table thead th { color: var(--dk-muted) !important; }

/* ── 15. Generic border-only btn ── */
.btn.border {
    background: transparent !important;
    border-color: rgba(255,255,255,.15) !important;
    color: var(--dk-muted) !important;
}
.btn.border:hover {
    border-color: rgba(255,215,0,.40) !important;
    color: var(--dk-gold) !important;
}

/* ── 16. My Performance card: inline light-theme style overrides ── */
[style*="background:#f0fdf4"] {
    background: rgba(74,222,128,0.10) !important;
    border-color: rgba(74,222,128,0.22) !important;
}
[style*="color:#15803d"] { color: #4ade80 !important; }
[style*="color:#166534"] { color: #86efac !important; }

[style*="background:#eff6ff"] {
    background: rgba(56,189,248,0.10) !important;
    border-color: rgba(56,189,248,0.22) !important;
}
[style*="color:#1d4ed8"] { color: #38bdf8 !important; }
[style*="color:#1e40af"] { color: #7dd3fc !important; }

[style*="background:#fff7ed"] {
    background: rgba(251,146,60,0.10) !important;
    border-color: rgba(251,146,60,0.22) !important;
}
[style*="color:#c2410c"] { color: #fb923c !important; }
[style*="color:#9a3412"] { color: #fdba74 !important; }

[style*="background:#fefce8"] {
    background: rgba(255,215,0,0.10) !important;
    border-color: rgba(255,215,0,0.22) !important;
}
[style*="color:#a16207"] { color: var(--dk-gold) !important; }
[style*="color:#854d0e"] { color: #fbbf24 !important; }

/* ── 17. Profile Completeness: inline light-theme style overrides ── */
[style*="background:#f5f3ff"] { background: rgba(139,92,246,0.12) !important; }
[style*="color:#5b21b6"]     { color: #a78bfa !important; }
[style*="color:#6366f1"]     { color: #818cf8 !important; }
[style*="background:#6366f1"] { background: #818cf8 !important; }
[style*="border-left:4px solid #6366f1"] { border-left-color: #818cf8 !important; }
