/* =========================================================
   BastaPoosh — Global Frontend System
   Mobile-first / RTL / Premium dark UI
   ========================================================= */

:root {
    --bp-red: #c70525;
    --bp-red-dark: #8f031c;
    --bp-bg: #f4f1ea;
    --bp-panel: #fffdf8;
    --bp-panel-2: #f7f3ec;
    --bp-text: #17191d;
    --bp-muted: #626873;
    --bp-border: rgba(26,31,38,.12);
    --bp-radius: 22px;
}

html[data-theme="light"] {
    --bp-emerald-950:#032E25; --bp-emerald-900:#063F32; --bp-emerald-800:#064E3B; --bp-emerald-700:#075E4A;
    --bp-forest:#123C32; --bp-burgundy:#6E1627; --bp-burgundy-deep:#5B1020;
    --bp-gold:#B08D3B; --bp-gold-2:#C6A15B; --bp-gold-pale:#D4AF62;
    --bp-ivory:#F7F2E7; --bp-pearl:#FCF9F2;
    --bp-bg:#063F32; --bp-panel:rgba(4,65,49,.82); --bp-panel-2:rgba(7,82,62,.72);
    --bp-text:#F7F2E7; --bp-muted:#D8D0C1; --bp-border:rgba(212,175,98,.20);
}

html,
body {
    min-height: 100%;
    margin: 0;
}

html {
    direction: rtl;
    background: var(--bp-bg);
}

body {
    font-family: Vazirmatn, sans-serif;
    color: var(--bp-text);
    background: var(--bp-bg);
    overflow-x: hidden;
}

img,
svg,
video,
canvas {
    max-width: 100%;
}

button,
a,
input,
select,
textarea {
    font-family: inherit;
}

::selection {
    background: rgba(199,5,37,.85);
    color: #fff;
}

.wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.content {
    flex: 1 0 auto;
}

/* Shared glass surfaces */
.glass-header {
    background: rgba(6,8,13,.76);
    border-bottom: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 12px 40px rgba(0,0,0,.22);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
}

.glass-container,
.glass-background {
    background: rgba(16,20,29,.76);
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius);
    box-shadow: 0 20px 55px rgba(0,0,0,.24);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    color: #fff;
}

.service-box {
    background: rgba(16,20,29,.72);
    border: 1px solid var(--bp-border);
    border-radius: 18px;
    transition: transform .2s ease, border-color .2s ease, background-color .2s ease;
}

.service-box:hover {
    transform: translateY(-3px);
    background: rgba(23,29,40,.9);
    border-color: rgba(199,5,37,.48);
}

.service-box h5 {
    color: #e9ecf2;
}

.icon {
    font-size: 2rem;
    color: var(--bp-red);
}

/* Mobile bottom navigation */
.bottom-navbar {
    color: #fff;
}

.bottom-navbar .nav-link {
    color: #fff;
}

/* Modal */
.modal-content {
    background: rgba(13,17,25,.94);
    color: #fff;
    border: 1px solid rgba(199,5,37,.55);
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(0,0,0,.42);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}

.modal-header {
    border-bottom: 1px solid rgba(199,5,37,.4);
}

.modal-title {
    font-weight: 900;
}

.btn-close {
    filter: brightness(0) invert(1);
}

.glass-input {
    background: rgba(255,255,255,.065);
    color: #fff;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 12px;
    min-height: 46px;
}

.glass-input:focus {
    background: rgba(255,255,255,.09);
    color: #fff;
    border-color: rgba(199,5,37,.75);
    box-shadow: 0 0 0 .2rem rgba(199,5,37,.12);
}

.glass-input::placeholder {
    color: rgba(255,255,255,.58);
}

.btn-custom {
    background: var(--bp-red);
    color: #fff;
    border: 0;
    font-weight: 800;
    padding: 10px 20px;
    border-radius: 10px;
}

.btn-custom:hover {
    background: var(--bp-red);
    color: #fff;
    filter: brightness(1.08);
}

/* Timeline */
.timeline {
    position: relative;
    padding: 2rem 0;
    list-style: none;
}

.timeline::before {
    content: "";
    position: absolute;
    inset-block: 0;
    inset-inline-start: 20px;
    width: 4px;
    background: rgba(255,255,255,.18);
}

.timeline-item {
    position: relative;
    margin-inline-start: 40px;
    margin-bottom: 20px;
}

.timeline-item::before {
    content: "";
    position: absolute;
    top: 10px;
    inset-inline-start: -36px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--bp-red);
    box-shadow: 0 0 0 5px rgba(199,5,37,.14);
}

.timeline-content {
    background: #f8f9fa;
    color: #171a20;
    padding: 1rem;
    border-radius: .75rem;
    box-shadow: 0 8px 22px rgba(0,0,0,.12);
}

.timeline-time {
    font-size: .9rem;
    color: #6c757d;
}

/* Tabs */
.nav-tabs {
    border-color: var(--bp-border);
}

.nav-tabs .nav-link {
    color: #ff7f93;
    border: 0;
    border-radius: 10px;
    font-size: 1rem;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus-visible {
    background: rgba(199,5,37,.08);
}

.nav-tabs .nav-link.active {
    background: rgba(199,5,37,.16);
    color: #fff;
    border-radius: 10px;
}

.tab-content {
    padding: 20px;
    color: #fff;
}

/* Legacy timeline-1 component */
.timeline-1 {
    border-inline-start: 3px solid var(--bp-red);
    border-end-end-radius: 4px;
    border-start-end-radius: 4px;
    background: rgba(199,5,37,.045);
    margin: 0 auto;
    position: relative;
    padding: 50px;
    list-style: none;
    text-align: start;
    max-width: 50%;
}

.timeline-1 .event {
    border-bottom: 1px dashed rgba(255,255,255,.32);
    padding-bottom: 25px;
    margin-bottom: 25px;
    position: relative;
}

.timeline-1 .event:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border: 0;
}

.timeline-1 .event::before,
.timeline-1 .event::after {
    position: absolute;
    display: block;
    top: 0;
}

.timeline-1 .event::before {
    inset-inline-start: -207px;
    content: attr(data-date);
    text-align: end;
    font-weight: 400;
    font-size: .9em;
    min-width: 120px;
}

.timeline-1 .event::after {
    box-shadow: 0 0 0 3px var(--bp-red);
    inset-inline-start: -55.8px;
    background: #fff;
    border-radius: 50%;
    height: 9px;
    width: 9px;
    content: "";
    top: 5px;
}

/* Accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(255,255,255,.9);
    outline-offset: 3px;
}

@media (max-width: 767.98px) {
    .glass-container {
        margin: 20px;
        padding: 16px;
    }

    .nav-tabs .nav-link {
        font-size: .9rem;
    }

    .tab-content {
        padding: 15px;
    }

    .timeline-1 {
        max-width: 98%;
        padding: 25px;
    }

    .timeline-1 .event {
        padding-top: 30px;
    }

    .timeline-1 .event::before {
        inset-inline-start: 0;
        text-align: start;
    }

    .timeline-1 .event::after {
        inset-inline-start: -31.8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* Theme-ready overrides */
html[data-theme="dark"]{color-scheme:light}html[data-theme="light"]{color-scheme:dark}
body{color:var(--bp-text);background:var(--bp-bg)}
.glass-container,.glass-background,.service-box,.modal-content{color:var(--bp-text);border-color:var(--bp-border)}
.text-white,.text-light{color:var(--bp-text)!important}.text-muted{color:var(--bp-muted)!important}
.glass-input{background:var(--bp-panel-2);color:var(--bp-text);border-color:var(--bp-border)}
/* =========================================================
   LIGHT MODE — EMERALD ROYAL LUXURY DESIGN TOKENS
   Final visual layer is mirrored in app.blade.php so it wins
   over legacy inline component styles.
   ========================================================= */
html[data-theme="dark"]{
    --bp-emerald-950:#032E25;
    --bp-emerald-900:#063F32;
    --bp-emerald-800:#064E3B;
    --bp-emerald-700:#075E4A;
    --bp-forest:#123C32;
    --bp-burgundy:#6E1627;
    --bp-burgundy-deep:#5B1020;
    --bp-gold:#B08D3B;
    --bp-gold-2:#C6A15B;
    --bp-gold-pale:#D4AF62;
    --bp-ivory:#F7F2E7;
    --bp-pearl:#FCF9F2;
    --bp-cognac:#8A4F2A;
    --bp-charcoal:#24211E;
}


/* BASTAPOOSH DARK MODE — DEEP NAVY LUXURY OVERRIDE */
html[data-theme="dark"] {
    color-scheme: dark;

    --bp-red: #7A1730;
    --bp-red-dark: #5C1024;

    --bp-emerald-950: #050B1A;
    --bp-emerald-900: #071225;
    --bp-emerald-800: #08162E;
    --bp-emerald-700: #0A1935;
    --bp-forest: #0B1F3A;

    --bp-navy-950: #050B1A;
    --bp-navy-900: #071225;
    --bp-navy-800: #08162E;
    --bp-navy-700: #0A1935;
    --bp-navy-600: #0B1F3A;

    --bp-blue: #00A8FF;
    --bp-blue-2: #008CFF;
    --bp-blue-bright: #00C6FF;
    --bp-blue-soft: rgba(0,168,255,.18);

    --bp-burgundy: #7A1730;
    --bp-burgundy-deep: #4E0D20;

    --bp-gold: #B08D3B;
    --bp-gold-2: #C6A15B;
    --bp-gold-pale: #D4AF62;

    --bp-ivory: #F7F2E7;
    --bp-pearl: #FFFDF7;
    --bp-text: #F7F2E7;
    --bp-heading: #FFFDF7;
    --bp-muted: #B9C4D5;
    --bp-muted-strong: #D8DFEA;

    --bp-bg: #050B1A;
    --bp-panel: #071225;
    --bp-panel-2: #08162E;
    --bp-section: #061022;
    --bp-input: #0A1935;

    --bp-border: rgba(212,175,98,.18);
    --bp-border-strong: rgba(0,168,255,.34);
    --bp-glass: rgba(5,11,26,.78);
    --bp-glass-strong: rgba(7,18,37,.94);
    --bp-focus: rgba(0,168,255,.28);

    --bp-shadow: 0 24px 70px rgba(0,0,0,.38);
    --bp-shadow-soft: 0 12px 34px rgba(0,0,0,.28);
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    background:
        radial-gradient(900px 500px at 12% 8%, rgba(0,140,255,.07), transparent 68%),
        radial-gradient(760px 460px at 88% 30%, rgba(176,141,59,.055), transparent 70%),
        #050B1A !important;
    color: var(--bp-text) !important;
}

html[data-theme="dark"] body {
    position: relative;
    isolation: isolate;
}

html[data-theme="dark"] body::before,
html[data-theme="dark"] body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
}

html[data-theme="dark"] body::before {
    opacity: .42;
    background:
        radial-gradient(480px 180px at 12% 18%, transparent 0 47%, rgba(212,175,98,.16) 48%, transparent 50%),
        radial-gradient(620px 220px at 78% 72%, transparent 0 48%, rgba(212,175,98,.10) 49%, transparent 50%),
        radial-gradient(430px 160px at 56% 38%, transparent 0 47%, rgba(0,168,255,.12) 48%, transparent 50%);
    filter: blur(1.2px);
    transform: rotate(-7deg) scale(1.18);
}

html[data-theme="dark"] body::after {
    opacity: .34;
    background:
        radial-gradient(520px 210px at 82% 12%, transparent 0 47%, rgba(0,198,255,.13) 48%, transparent 50%),
        radial-gradient(700px 250px at 20% 82%, transparent 0 48%, rgba(176,141,59,.09) 49%, transparent 50%);
    filter: blur(2px);
    transform: rotate(8deg) scale(1.2);
}

html[data-theme="dark"] .wrapper,
html[data-theme="dark"] .site-main,
html[data-theme="dark"] .bp-home {
    background: transparent !important;
    color: var(--bp-text) !important;
}

/* Global surfaces */
html[data-theme="dark"] .glass-header,
html[data-theme="dark"] .site-header {
    background:
        linear-gradient(110deg, rgba(5,11,26,.97), rgba(7,18,37,.95) 58%, rgba(8,22,46,.96)) !important;
    border-bottom: 1px solid rgba(212,175,98,.24) !important;
    box-shadow: 0 18px 52px rgba(0,0,0,.38) !important;
    backdrop-filter: blur(20px) saturate(125%);
    -webkit-backdrop-filter: blur(20px) saturate(125%);
}

html[data-theme="dark"] .glass-container,
html[data-theme="dark"] .glass-background,
html[data-theme="dark"] .service-box,
html[data-theme="dark"] .card,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .modal-content {
    background: linear-gradient(145deg, rgba(8,22,46,.96), rgba(7,18,37,.96)) !important;
    color: var(--bp-text) !important;
    border-color: var(--bp-border) !important;
    box-shadow: var(--bp-shadow) !important;
}

html[data-theme="dark"] .service-box:hover,
html[data-theme="dark"] .card:hover {
    background: linear-gradient(145deg, #0A1935, #0B1F3A) !important;
    border-color: rgba(0,168,255,.34) !important;
    box-shadow: 0 26px 72px rgba(0,0,0,.44), 0 0 28px rgba(0,168,255,.06) !important;
}

/* Typography */
html[data-theme="dark"] .text-white,
html[data-theme="dark"] .text-light,
html[data-theme="dark"] .logo-text,
html[data-theme="dark"] .navbar,
html[data-theme="dark"] .navbar-brand,
html[data-theme="dark"] .header-right-section,
html[data-theme="dark"] .footer,
html[data-theme="dark"] .footer h3,
html[data-theme="dark"] .footer-title,
html[data-theme="dark"] .footer-description,
html[data-theme="dark"] .form-label,
html[data-theme="dark"] .form-check-label,
html[data-theme="dark"] label,
html[data-theme="dark"] .modal-title,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .accordion-button,
html[data-theme="dark"] .tab-content {
    color: var(--bp-ivory) !important;
}

html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .bp-home .bp-section-heading p,
html[data-theme="dark"] .bp-home .bp-hero-lead,
html[data-theme="dark"] .bp-home .bp-info-card p,
html[data-theme="dark"] .bp-home .bp-advantage-grid p {
    color: var(--bp-muted) !important;
}

/* Luxury accents */
html[data-theme="dark"] .bp-kicker,
html[data-theme="dark"] .bp-eyebrow,
html[data-theme="dark"] .bp-card-icon,
html[data-theme="dark"] .icon {
    color: var(--bp-gold-pale) !important;
}

html[data-theme="dark"] .bp-eyebrow::before,
html[data-theme="dark"] .bp-kicker::before {
    background: linear-gradient(90deg, var(--bp-gold), var(--bp-gold-pale)) !important;
    box-shadow: 0 0 14px rgba(212,175,98,.12) !important;
}

html[data-theme="dark"] a {
    color: var(--bp-blue-bright);
}
html[data-theme="dark"] a:hover {
    color: #65D6FF;
}

/* Buttons */
html[data-theme="dark"] .bp-btn-primary,
html[data-theme="dark"] .btn-custom,
html[data-theme="dark"] .custom-btn {
    background: linear-gradient(135deg, #008CFF, #00A8FF) !important;
    border: 1px solid rgba(0,198,255,.48) !important;
    color: #04101F !important;
    box-shadow: 0 12px 30px rgba(0,140,255,.18) !important;
}
html[data-theme="dark"] .bp-btn-primary:hover,
html[data-theme="dark"] .btn-custom:hover,
html[data-theme="dark"] .custom-btn:hover {
    background: linear-gradient(135deg, #00A8FF, #00C6FF) !important;
    border-color: rgba(0,198,255,.72) !important;
    box-shadow: 0 16px 34px rgba(0,168,255,.25) !important;
}
html[data-theme="dark"] .bp-btn-secondary,
html[data-theme="dark"] .bp-btn-light {
    color: var(--bp-ivory) !important;
    background: #08162E !important;
    border: 1px solid rgba(212,175,98,.34) !important;
}
html[data-theme="dark"] .bp-btn-secondary:hover,
html[data-theme="dark"] .bp-btn-light:hover {
    color: var(--bp-pearl) !important;
    border-color: rgba(0,168,255,.46) !important;
    background: #0A1935 !important;
}

/* Theme switch */
html[data-theme="dark"] .bp-theme-switcher {
    background: #071225 !important;
    border-color: rgba(212,175,98,.25) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.28) !important;
}
html[data-theme="dark"] .bp-theme-btn {
    color: var(--bp-muted) !important;
}
html[data-theme="dark"] .bp-theme-btn:hover {
    color: var(--bp-blue-bright) !important;
}
html[data-theme="dark"] .bp-theme-btn.active {
    background: linear-gradient(135deg, #008CFF, #00A8FF) !important;
    color: #04101F !important;
    box-shadow: 0 7px 20px rgba(0,168,255,.20) !important;
}

/* Home hero and premium sections */
html[data-theme="dark"] .bp-home .bp-hero,
html[data-theme="dark"] .bp-home .bp-premium,
html[data-theme="dark"] .bp-home .bp-featured,
html[data-theme="dark"] .bp-home .bp-cta {
    background:
        radial-gradient(700px 330px at 88% 12%, rgba(0,168,255,.075), transparent 70%),
        radial-gradient(620px 300px at 12% 86%, rgba(212,175,98,.055), transparent 72%),
        linear-gradient(135deg, #071225 0%, #050B1A 58%, #08162E 100%) !important;
    color: var(--bp-ivory) !important;
    border-color: rgba(212,175,98,.24) !important;
    box-shadow: 0 30px 90px rgba(0,0,0,.42) !important;
}

html[data-theme="dark"] .bp-home .bp-hero::after,
html[data-theme="dark"] .bp-home .bp-premium::after,
html[data-theme="dark"] .bp-home .bp-featured::after,
html[data-theme="dark"] .bp-home .bp-cta::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .26;
    background:
        radial-gradient(480px 130px at 18% 24%, transparent 0 48%, rgba(212,175,98,.16) 49%, transparent 51%),
        radial-gradient(520px 150px at 82% 74%, transparent 0 48%, rgba(0,198,255,.14) 49%, transparent 51%);
    filter: blur(1.5px);
    transform: rotate(-5deg) scale(1.1);
}

html[data-theme="dark"] .bp-hero h1,
html[data-theme="dark"] .bp-hero h2,
html[data-theme="dark"] .bp-hero .bp-eyebrow,
html[data-theme="dark"] .bp-hero .bp-hero-lead,
html[data-theme="dark"] .bp-hero .bp-trust-row {
    color: var(--bp-ivory) !important;
}

html[data-theme="dark"] .bp-trust-row span {
    background: rgba(8,22,46,.76) !important;
    border-color: rgba(212,175,98,.20) !important;
    color: var(--bp-muted-strong) !important;
}
html[data-theme="dark"] .bp-trust-row strong {
    color: var(--bp-blue-bright) !important;
}

/* Cards */
html[data-theme="dark"] .bp-info-card,
html[data-theme="dark"] .bp-products .bp-info-card {
    background:
        radial-gradient(260px 150px at 88% 0%, rgba(0,168,255,.07), transparent 70%),
        linear-gradient(145deg, #08162E, #071225 70%, #0A1935) !important;
    color: var(--bp-text) !important;
    border: 1px solid rgba(212,175,98,.18) !important;
    box-shadow: 0 18px 52px rgba(0,0,0,.34) !important;
}
html[data-theme="dark"] .bp-info-card:hover {
    border-color: rgba(0,168,255,.40) !important;
    box-shadow: 0 26px 64px rgba(0,0,0,.46), 0 0 30px rgba(0,168,255,.06) !important;
}
html[data-theme="dark"] .bp-card-featured {
    background:
        radial-gradient(300px 180px at 10% 100%, rgba(122,23,48,.18), transparent 70%),
        linear-gradient(145deg, #0A1935, #071225) !important;
    border-color: rgba(212,175,98,.30) !important;
}
html[data-theme="dark"] .bp-card-icon {
    background: rgba(212,175,98,.07) !important;
    border-color: rgba(212,175,98,.20) !important;
}
html[data-theme="dark"] .bp-info-card h3,
html[data-theme="dark"] .bp-info-card p,
html[data-theme="dark"] .bp-info-card a,
html[data-theme="dark"] .bp-text-link {
    color: var(--bp-ivory) !important;
}
html[data-theme="dark"] .bp-info-card a,
html[data-theme="dark"] .bp-text-link {
    color: var(--bp-blue-bright) !important;
}
html[data-theme="dark"] .bp-info-card a:hover,
html[data-theme="dark"] .bp-text-link:hover {
    color: var(--bp-gold-pale) !important;
}

/* Advantages / About / FAQ / CTA */
html[data-theme="dark"] .bp-advantages,
html[data-theme="dark"] .bp-services,
html[data-theme="dark"] .bp-about,
html[data-theme="dark"] .bp-faq {
    background:
        radial-gradient(720px 340px at 92% 10%, rgba(0,140,255,.055), transparent 70%),
        radial-gradient(560px 260px at 8% 88%, rgba(176,141,59,.045), transparent 72%),
        #050B1A !important;
    color: var(--bp-text) !important;
    border-block-color: rgba(212,175,98,.12) !important;
}
html[data-theme="dark"] .bp-advantages .bp-advantage-grid article {
    background: linear-gradient(145deg, #08162E, #071225) !important;
    color: var(--bp-ivory) !important;
    border-color: rgba(212,175,98,.20) !important;
    border-top-color: var(--bp-gold) !important;
    box-shadow: 0 18px 48px rgba(0,0,0,.30) !important;
}
html[data-theme="dark"] .bp-advantage-grid strong,
html[data-theme="dark"] .bp-about-stat strong {
    color: var(--bp-gold-pale) !important;
}
html[data-theme="dark"] .bp-about-grid > div:first-child {
    background:
        radial-gradient(circle at 90% 15%, rgba(122,23,48,.12), transparent 34%),
        linear-gradient(135deg, #08162E, #071225) !important;
    border-color: rgba(212,175,98,.18) !important;
}
html[data-theme="dark"] .bp-about h2,
html[data-theme="dark"] .bp-about p,
html[data-theme="dark"] .bp-about .bp-kicker,
html[data-theme="dark"] .bp-about-stat span,
html[data-theme="dark"] .bp-about-stat small,
html[data-theme="dark"] .bp-services h2,
html[data-theme="dark"] .bp-services p,
html[data-theme="dark"] .bp-services .bp-kicker {
    color: var(--bp-ivory) !important;
}
html[data-theme="dark"] .bp-about-stat {
    background: linear-gradient(145deg, #0B1F3A, #08162E) !important;
    border-color: rgba(212,175,98,.28) !important;
    box-shadow: 0 24px 62px rgba(0,0,0,.38) !important;
}
html[data-theme="dark"] .bp-accordion .accordion-item {
    background: #071225 !important;
    color: var(--bp-ivory) !important;
    border-color: rgba(212,175,98,.18) !important;
}
html[data-theme="dark"] .bp-accordion .accordion-button {
    color: var(--bp-ivory) !important;
    background: #08162E !important;
}
html[data-theme="dark"] .bp-accordion .accordion-button:not(.collapsed) {
    color: var(--bp-blue-bright) !important;
    background: rgba(0,168,255,.075) !important;
}
html[data-theme="dark"] .bp-accordion .accordion-body {
    color: var(--bp-muted) !important;
}
html[data-theme="dark"] .bp-cta {
    background:
        radial-gradient(520px 300px at 88% 0%, rgba(0,168,255,.10), transparent 68%),
        linear-gradient(120deg, #4E0D20, #071225 62%, #0A1935) !important;
    border-color: rgba(212,175,98,.30) !important;
}
html[data-theme="dark"] .bp-cta h2,
html[data-theme="dark"] .bp-cta p,
html[data-theme="dark"] .bp-cta .bp-kicker {
    color: var(--bp-ivory) !important;
}

/* Media / tables */
html[data-theme="dark"] .bp-slider-card,
html[data-theme="dark"] .bp-video-wrap,
html[data-theme="dark"] .bp-home .glass-table {
    background: #071225 !important;
    border-color: rgba(212,175,98,.24) !important;
    box-shadow: 0 24px 62px rgba(0,0,0,.38) !important;
}
html[data-theme="dark"] .bp-slider-caption {
    background: linear-gradient(180deg, transparent 18%, rgba(5,11,26,.28) 43%, rgba(5,11,26,.96) 100%) !important;
}
html[data-theme="dark"] .bp-slider-link a {
    background: var(--bp-burgundy) !important;
    color: #FFF8EE !important;
}
html[data-theme="dark"] .table {
    --bs-table-color: var(--bp-ivory);
    --bs-table-bg: transparent;
    --bs-table-border-color: rgba(212,175,98,.15);
}
html[data-theme="dark"] .table-hover > tbody > tr:hover > * {
    --bs-table-hover-bg: rgba(0,168,255,.055);
    --bs-table-hover-color: var(--bp-ivory);
}

/* Forms / modal */
html[data-theme="dark"] .modal-content {
    background: linear-gradient(145deg, #08162E, #050B1A) !important;
    border-color: rgba(212,175,98,.30) !important;
}
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
    border-color: rgba(212,175,98,.18) !important;
}
html[data-theme="dark"] .glass-input,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background: #0A1935 !important;
    color: var(--bp-ivory) !important;
    border-color: rgba(0,168,255,.28) !important;
}
html[data-theme="dark"] .glass-input:focus,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    border-color: var(--bp-blue-bright) !important;
    box-shadow: 0 0 0 .22rem rgba(0,168,255,.14) !important;
}
html[data-theme="dark"] .glass-input::placeholder,
html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] .form-select::placeholder {
    color: rgba(185,196,213,.72) !important;
}
html[data-theme="dark"] .btn-close {
    filter: invert(1) !important;
}

/* Navigation / footer */
html[data-theme="dark"] .custom-navbar-height,
html[data-theme="dark"] .bottom-navbar {
    background:
        linear-gradient(180deg, rgba(7,18,37,.97), rgba(5,11,26,.98)) !important;
    color: var(--bp-ivory) !important;
    border-top-color: rgba(212,175,98,.22) !important;
    box-shadow: 0 -16px 44px rgba(0,0,0,.42) !important;
}
html[data-theme="dark"] .custom-navbar-height .nav-link,
html[data-theme="dark"] .bottom-navbar .nav-link {
    color: var(--bp-muted-strong) !important;
}
html[data-theme="dark"] .custom-navbar-height .nav-link:hover,
html[data-theme="dark"] .custom-navbar-height .nav-link:focus-visible,
html[data-theme="dark"] .custom-navbar-height .nav-link.active,
html[data-theme="dark"] .bottom-navbar .nav-link:hover,
html[data-theme="dark"] .bottom-navbar .nav-link:focus-visible,
html[data-theme="dark"] .bottom-navbar .nav-link.active {
    color: var(--bp-blue-bright) !important;
    background: rgba(0,168,255,.075) !important;
}
html[data-theme="dark"] .footer {
    background:
        radial-gradient(560px 250px at 86% 10%, rgba(0,168,255,.07), transparent 70%),
        radial-gradient(520px 240px at 10% 82%, rgba(212,175,98,.05), transparent 72%),
        #050B1A !important;
    color: var(--bp-ivory) !important;
    border-top: 1px solid rgba(212,175,98,.22) !important;
}
html[data-theme="dark"] .footer .footer-title,
html[data-theme="dark"] .footer h3,
html[data-theme="dark"] .footer .footer-description,
html[data-theme="dark"] .footer .footer-copyright,
html[data-theme="dark"] .footer .footer-credit,
html[data-theme="dark"] .footer .text-white {
    color: var(--bp-ivory) !important;
}
html[data-theme="dark"] .footer a:hover {
    color: var(--bp-gold-pale) !important;
}
html[data-theme="dark"] .footer-social {
    background: rgba(8,22,46,.72) !important;
    border-color: rgba(212,175,98,.20) !important;
}

/* Legacy components */
html[data-theme="dark"] .timeline::before {
    background: rgba(0,168,255,.20) !important;
}
html[data-theme="dark"] .timeline-item::before,
html[data-theme="dark"] .timeline-1 {
    border-color: var(--bp-blue) !important;
}
html[data-theme="dark"] .timeline-item::before {
    background: var(--bp-blue) !important;
    box-shadow: 0 0 0 5px rgba(0,168,255,.13) !important;
}
html[data-theme="dark"] .timeline-content {
    background: #08162E !important;
    color: var(--bp-ivory) !important;
}
html[data-theme="dark"] .timeline-time {
    color: var(--bp-muted) !important;
}
html[data-theme="dark"] .nav-tabs {
    border-color: var(--bp-border) !important;
}
html[data-theme="dark"] .nav-tabs .nav-link {
    color: var(--bp-blue-bright) !important;
}
html[data-theme="dark"] .nav-tabs .nav-link.active {
    background: rgba(0,168,255,.10) !important;
    color: var(--bp-ivory) !important;
}
html[data-theme="dark"] .nav-tabs .nav-link:hover,
html[data-theme="dark"] .nav-tabs .nav-link:focus-visible {
    background: rgba(0,168,255,.07) !important;
}

/* Selection and focus */
html[data-theme="dark"] ::selection {
    background: var(--bp-blue) !important;
    color: #04101F !important;
}
html[data-theme="dark"] a:focus-visible,
html[data-theme="dark"] button:focus-visible,
html[data-theme="dark"] input:focus-visible,
html[data-theme="dark"] select:focus-visible,
html[data-theme="dark"] textarea:focus-visible {
    outline-color: var(--bp-blue-bright) !important;
}

/* ============================================================
   BASTAPOOSH — FINAL FUNDAMENTAL THEME ENGINE
   This is intentionally the LAST theme layer.
   DARK MODE IS A NEW VISUAL SYSTEM, NOT A DARKER LIGHT MODE.
   ============================================================ */

html[data-theme="dark"] {
    color-scheme: dark !important;

    --bp-bg: #050B1A !important;
    --bp-section: #050B1A !important;

    --bp-panel: #071225 !important;
    --bp-panel-2: #08162E !important;
    --bp-panel-3: #0A1935 !important;
    --bp-panel-4: #0B1F3A !important;

    --bp-text: #F7F2E7 !important;
    --bp-heading: #FFFDF7 !important;
    --bp-muted: #B9C4D5 !important;
    --bp-muted-strong: #D8DFEA !important;

    --bp-red: #7A1730 !important;
    --bp-red-dark: #4E0D20 !important;

    --bp-blue: #00A8FF !important;
    --bp-blue-2: #008CFF !important;
    --bp-blue-bright: #00C6FF !important;

    --bp-gold: #B08D3B !important;
    --bp-gold-2: #C6A15B !important;
    --bp-gold-pale: #D4AF62 !important;

    --bp-border: rgba(212,175,98,.18) !important;
    --bp-border-strong: rgba(0,168,255,.34) !important;

    --bp-glass: rgba(7,18,37,.90) !important;
    --bp-glass-strong: rgba(5,11,26,.96) !important;
    --bp-input: #0A1935 !important;
    --bp-focus: rgba(0,198,255,.22) !important;
}

/* ------------------------------------------------------------
   01 — THE REAL PAGE CANVAS
   ------------------------------------------------------------ */

html[data-theme="dark"],
html[data-theme="dark"] body {
    background:
        radial-gradient(900px 600px at 8% -10%, rgba(0,140,255,.10), transparent 68%),
        radial-gradient(800px 540px at 95% 12%, rgba(212,175,98,.055), transparent 70%),
        radial-gradient(700px 520px at 45% 108%, rgba(122,23,48,.055), transparent 72%),
        linear-gradient(135deg, #040817 0%, #050B1A 42%, #071225 72%, #050B1A 100%) !important;

    color: #F7F2E7 !important;
}

html[data-theme="dark"] {
    min-height: 100%;
}

html[data-theme="dark"] body {
    min-height: 100vh !important;
    position: relative !important;
    isolation: isolate !important;
    overflow-x: hidden !important;
}

/* Kill old full-page Emerald/black backgrounds. */
html[data-theme="dark"] .wrapper,
html[data-theme="dark"] #app,
html[data-theme="dark"] .app,
html[data-theme="dark"] .site-main,
html[data-theme="dark"] main,
html[data-theme="dark"] .bp-home {
    background: transparent !important;
    color: #F7F2E7 !important;
}

/* The actual main canvas is Navy. */
html[data-theme="dark"] main,
html[data-theme="dark"] .site-main {
    background:
        radial-gradient(700px 360px at 82% 5%, rgba(0,168,255,.045), transparent 72%),
        #050B1A !important;
}

/* ------------------------------------------------------------
   02 — LUXURY MIDNIGHT MARBLE
   ------------------------------------------------------------ */

html[data-theme="dark"] body::before {
    content: "";
    position: fixed;
    inset: -12%;
    z-index: -2;
    pointer-events: none;

    background:
        radial-gradient(900px 260px at 8% 17%,
            transparent 0 47%,
            rgba(212,175,98,.13) 48%,
            transparent 49%),
        radial-gradient(950px 300px at 80% 74%,
            transparent 0 47%,
            rgba(212,175,98,.09) 48%,
            transparent 49%),
        radial-gradient(720px 230px at 54% 38%,
            transparent 0 47%,
            rgba(0,198,255,.12) 48%,
            transparent 49%);

    filter: blur(1px);
    transform: rotate(-5deg) scale(1.12);
}

html[data-theme="dark"] body::after {
    content: "";
    position: fixed;
    inset: -12%;
    z-index: -1;
    pointer-events: none;

    background:
        radial-gradient(760px 230px at 87% 9%,
            transparent 0 47%,
            rgba(0,168,255,.10) 48%,
            transparent 49%),
        radial-gradient(820px 250px at 20% 88%,
            transparent 0 47%,
            rgba(176,141,59,.075) 48%,
            transparent 49%);

    filter: blur(1.5px);
    transform: rotate(6deg) scale(1.15);
}

/* ------------------------------------------------------------
   03 — STRUCTURAL SECTIONS
   ------------------------------------------------------------ */

html[data-theme="dark"] .bp-home > section {
    color: #F7F2E7 !important;
}

/* Every major section is a Navy layer. */
html[data-theme="dark"] .bp-home .bp-hero,
html[data-theme="dark"] .bp-home .bp-featured,
html[data-theme="dark"] .bp-home .bp-premium {
    background:
        radial-gradient(760px 340px at 87% 8%, rgba(0,168,255,.075), transparent 70%),
        radial-gradient(620px 300px at 10% 90%, rgba(212,175,98,.045), transparent 72%),
        linear-gradient(135deg, #071225 0%, #050B1A 58%, #08162E 100%) !important;
}

html[data-theme="dark"] .bp-home .bp-services,
html[data-theme="dark"] .bp-home .bp-advantages,
html[data-theme="dark"] .bp-home .bp-about,
html[data-theme="dark"] .bp-home .bp-faq,
html[data-theme="dark"] .bp-home .section-space {
    background:
        radial-gradient(700px 320px at 90% 12%, rgba(0,140,255,.045), transparent 72%),
        #050B1A !important;
}

/* Catch common section wrappers even if their original CSS uses a
   hard-coded Emerald value. */
html[data-theme="dark"] section.bp-section,
html[data-theme="dark"] section.section,
html[data-theme="dark"] .section-space {
    color: #F7F2E7 !important;
}

/* ------------------------------------------------------------
   04 — HEADER / NAV / FOOTER
   ------------------------------------------------------------ */

html[data-theme="dark"] .site-header,
html[data-theme="dark"] header,
html[data-theme="dark"] .glass-header {
    background:
        linear-gradient(105deg, #040817 0%, #071225 58%, #08162E 100%) !important;

    color: #F7F2E7 !important;
    border-color: rgba(212,175,98,.22) !important;
    box-shadow: 0 16px 52px rgba(0,0,0,.44) !important;
}

html[data-theme="dark"] .bottom-navbar,
html[data-theme="dark"] .custom-navbar-height {
    background:
        linear-gradient(180deg, #071225 0%, #050B1A 100%) !important;

    color: #F7F2E7 !important;
    border-color: rgba(212,175,98,.20) !important;
    box-shadow: 0 -18px 46px rgba(0,0,0,.46) !important;
}

html[data-theme="dark"] .footer {
    background:
        radial-gradient(650px 300px at 85% 8%, rgba(0,168,255,.065), transparent 70%),
        linear-gradient(180deg, #071225 0%, #050B1A 100%) !important;

    color: #F7F2E7 !important;
    border-top-color: rgba(212,175,98,.20) !important;
}

/* ------------------------------------------------------------
   05 — SURFACE DEPTH
   ------------------------------------------------------------ */

html[data-theme="dark"] .glass-container,
html[data-theme="dark"] .glass-background,
html[data-theme="dark"] .service-box,
html[data-theme="dark"] .card,
html[data-theme="dark"] .bp-slider-card,
html[data-theme="dark"] .bp-info-card,
html[data-theme="dark"] .bp-about-stat,
html[data-theme="dark"] .bp-video-wrap,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .accordion-item,
html[data-theme="dark"] .list-group-item {
    background:
        linear-gradient(145deg, #08162E 0%, #071225 72%, #0A1935 100%) !important;

    color: #F7F2E7 !important;
    border-color: rgba(212,175,98,.18) !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.34) !important;
}

html[data-theme="dark"] .service-box:hover,
html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .bp-info-card:hover,
html[data-theme="dark"] .bp-slider-card:hover {
    background:
        linear-gradient(145deg, #0A1935 0%, #08162E 72%, #0B1F3A 100%) !important;

    border-color: rgba(0,168,255,.38) !important;
    box-shadow:
        0 28px 70px rgba(0,0,0,.44),
        0 0 28px rgba(0,168,255,.055) !important;
}

/* ------------------------------------------------------------
   06 — TEXT
   ------------------------------------------------------------ */

html[data-theme="dark"] .logo-text,
html[data-theme="dark"] .navbar,
html[data-theme="dark"] .navbar-brand,
html[data-theme="dark"] .header-right-section,
html[data-theme="dark"] .footer,
html[data-theme="dark"] .footer h3,
html[data-theme="dark"] .footer-title,
html[data-theme="dark"] .footer-description,
html[data-theme="dark"] .footer-credit,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .modal-title,
html[data-theme="dark"] label,
html[data-theme="dark"] .form-label,
html[data-theme="dark"] .text-white,
html[data-theme="dark"] .text-light {
    color: #F7F2E7 !important;
}

html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .bp-home .bp-hero-lead,
html[data-theme="dark"] .bp-home .bp-info-card p,
html[data-theme="dark"] .bp-home .bp-advantage-grid p {
    color: #B9C4D5 !important;
}

html[data-theme="dark"] a {
    color: #00C6FF !important;
}

html[data-theme="dark"] a:hover {
    color: #D4AF62 !important;
}

html[data-theme="dark"] .bp-kicker,
html[data-theme="dark"] .bp-eyebrow,
html[data-theme="dark"] .bp-card-icon {
    color: #D4AF62 !important;
}

/* ------------------------------------------------------------
   07 — ELECTRIC BLUE PRIMARY ACTIONS
   ------------------------------------------------------------ */

html[data-theme="dark"] .bp-btn-primary,
html[data-theme="dark"] .bp-btn,
html[data-theme="dark"] .btn-custom,
html[data-theme="dark"] .custom-btn {
    background: linear-gradient(135deg, #008CFF, #00A8FF) !important;
    color: #03101F !important;
    border-color: rgba(0,198,255,.55) !important;
    box-shadow: 0 12px 30px rgba(0,140,255,.20) !important;
}

html[data-theme="dark"] .bp-btn-primary:hover,
html[data-theme="dark"] .bp-btn:hover,
html[data-theme="dark"] .btn-custom:hover,
html[data-theme="dark"] .custom-btn:hover {
    background: linear-gradient(135deg, #00A8FF, #00C6FF) !important;
    color: #03101F !important;
}

/* Burgundy stays a restrained luxury accent. */
html[data-theme="dark"] .bp-card-featured,
html[data-theme="dark"] .bp-cta {
    background:
        radial-gradient(480px 240px at 88% 8%, rgba(0,168,255,.08), transparent 70%),
        linear-gradient(120deg, #4E0D20 0%, #071225 54%, #0A1935 100%) !important;

    border-color: rgba(212,175,98,.26) !important;
}

/* ------------------------------------------------------------
   08 — COUNTER / HOME COMPONENTS
   ------------------------------------------------------------ */

html[data-theme="dark"] .bp-home .bp-card-grid,
html[data-theme="dark"] .bp-home .bp-advantage-grid,
html[data-theme="dark"] .bp-home .bp-about-grid,
html[data-theme="dark"] .bp-home .bp-hero-grid {
    color: #F7F2E7 !important;
}

html[data-theme="dark"] .bp-home .bp-advantage-grid article {
    background: linear-gradient(145deg,#08162E,#071225) !important;
    border-color: rgba(212,175,98,.18) !important;
    border-top-color: #00A8FF !important;
}

html[data-theme="dark"] .bp-home .bp-about-grid > div:first-child {
    background:
        radial-gradient(circle at 90% 15%, rgba(0,168,255,.09), transparent 32%),
        linear-gradient(135deg,#071225,#0A1935) !important;
    border-color: rgba(212,175,98,.18) !important;
}

html[data-theme="dark"] .bp-home .bp-trust-row span {
    background: rgba(8,22,46,.78) !important;
    border-color: rgba(212,175,98,.16) !important;
}

html[data-theme="dark"] .bp-home .bp-card-icon {
    background: rgba(0,168,255,.08) !important;
    border-color: rgba(0,168,255,.22) !important;
    color: #00C6FF !important;
}

/* ------------------------------------------------------------
   09 — FORMS / MODALS / TABLES
   ------------------------------------------------------------ */

html[data-theme="dark"] .glass-input,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background: #0A1935 !important;
    color: #F7F2E7 !important;
    border-color: rgba(0,168,255,.28) !important;
}

html[data-theme="dark"] .glass-input:focus,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background: #0B1F3A !important;
    border-color: #00C6FF !important;
    box-shadow: 0 0 0 .22rem rgba(0,168,255,.14) !important;
}

html[data-theme="dark"] .modal-content {
    background: linear-gradient(145deg,#08162E,#050B1A) !important;
    color: #F7F2E7 !important;
    border-color: rgba(212,175,98,.28) !important;
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
    border-color: rgba(212,175,98,.16) !important;
}

html[data-theme="dark"] .accordion-button {
    background: #071225 !important;
    color: #F7F2E7 !important;
}

html[data-theme="dark"] .accordion-button:not(.collapsed) {
    background: #0A1935 !important;
    color: #D4AF62 !important;
}

html[data-theme="dark"] .table {
    --bs-table-color: #F7F2E7;
    --bs-table-bg: transparent;
    --bs-table-border-color: rgba(212,175,98,.15);
}

/* ------------------------------------------------------------
   10 — TOGGLE
   ------------------------------------------------------------ */

html[data-theme="dark"] .bp-theme-switcher {
    background: #071225 !important;
    border-color: rgba(212,175,98,.24) !important;
}

html[data-theme="dark"] .bp-theme-btn {
    color: #B9C4D5 !important;
}

html[data-theme="dark"] .bp-theme-btn.active {
    background: linear-gradient(135deg,#008CFF,#00A8FF) !important;
    color: #03101F !important;
    box-shadow: 0 7px 20px rgba(0,168,255,.20) !important;
}

/* ------------------------------------------------------------
   11 — HARD SAFETY NET AGAINST OLD EMERALD CANVAS
   ------------------------------------------------------------ */

/* Only structural wrappers are made transparent. Cards/surfaces above
   explicitly receive their Navy backgrounds. */
html[data-theme="dark"] .wrapper,
html[data-theme="dark"] .site-main,
html[data-theme="dark"] .bp-home {
    background-color: transparent !important;
}

/* Never allow the old Emerald canvas to leak through the root. */
html[data-theme="dark"] body {
    background-color: #050B1A !important;
}

/* Selection/focus match the new identity. */
html[data-theme="dark"] ::selection {
    background: #00A8FF !important;
    color: #03101F !important;
}

html[data-theme="dark"] a:focus-visible,
html[data-theme="dark"] button:focus-visible,
html[data-theme="dark"] input:focus-visible,
html[data-theme="dark"] select:focus-visible,
html[data-theme="dark"] textarea:focus-visible {
    outline-color: #00C6FF !important;
}

/* Theme transition */
html[data-theme="dark"] body,
html[data-theme="light"] body,
html[data-theme="dark"] .bp-home > section,
html[data-theme="light"] .bp-home > section,
html[data-theme="dark"] .site-header,
html[data-theme="light"] .site-header {
    transition:
        background .28s ease,
        background-color .28s ease,
        color .28s ease,
        border-color .28s ease,
        box-shadow .28s ease;
}


/* =========================================================
   FINAL FIX — DARK MODE PRODUCTS + FAQ
   These two sections must use the same Deep Navy system
   as the rest of the Dark Mode. No ivory/emerald canvas.
   ========================================================= */

html[data-theme="dark"] .bp-home .bp-products,
html[data-theme="dark"] .bp-home .bp-faq {
    background:
        radial-gradient(700px 360px at 88% 8%, rgba(0,168,255,.065), transparent 70%),
        radial-gradient(560px 280px at 8% 92%, rgba(212,175,98,.045), transparent 72%),
        linear-gradient(180deg, #050B1A 0%, #071225 100%) !important;
    color: #F7F2E7 !important;
    border-block: 1px solid rgba(212,175,98,.12) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-section-heading,
html[data-theme="dark"] .bp-home .bp-products .bp-section-heading h2,
html[data-theme="dark"] .bp-home .bp-products .bp-section-heading p,
html[data-theme="dark"] .bp-home .bp-faq .bp-section-heading,
html[data-theme="dark"] .bp-home .bp-faq .bp-section-heading h2 {
    color: #F7F2E7 !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-section-heading p {
    color: #B9C4D5 !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card {
    background:
        radial-gradient(260px 150px at 88% 0%, rgba(0,168,255,.075), transparent 70%),
        linear-gradient(145deg, #08162E 0%, #071225 70%, #0A1935 100%) !important;
    color: #F7F2E7 !important;
    border: 1px solid rgba(212,175,98,.18) !important;
    box-shadow: 0 18px 52px rgba(0,0,0,.34) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card:nth-child(2) {
    background:
        radial-gradient(260px 150px at 12% 0%, rgba(0,198,255,.055), transparent 70%),
        linear-gradient(145deg, #0A1935 0%, #071225 72%, #08162E 100%) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card.bp-card-featured {
    background:
        radial-gradient(320px 190px at 8% 100%, rgba(122,23,48,.20), transparent 70%),
        linear-gradient(145deg, #0A1935 0%, #071225 55%, #4E0D20 150%) !important;
    border-color: rgba(212,175,98,.30) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card:hover {
    transform: translateY(-5px);
    border-color: rgba(0,168,255,.40) !important;
    box-shadow:
        0 26px 64px rgba(0,0,0,.46),
        0 0 30px rgba(0,168,255,.06) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-card-icon {
    color: #00C6FF !important;
    background: rgba(0,168,255,.08) !important;
    border-color: rgba(0,168,255,.22) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-card-featured .bp-card-icon {
    color: #D4AF62 !important;
    background: rgba(212,175,98,.08) !important;
    border-color: rgba(212,175,98,.20) !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card h3 {
    color: #FFFDF7 !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card p {
    color: #B9C4D5 !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card a {
    color: #00C6FF !important;
}

html[data-theme="dark"] .bp-home .bp-products .bp-info-card a:hover {
    color: #D4AF62 !important;
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion {
    --bs-accordion-bg: #071225;
    --bs-accordion-color: #F7F2E7;
    --bs-accordion-border-color: rgba(212,175,98,.18);
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-item {
    background:
        linear-gradient(145deg, #08162E 0%, #071225 72%, #0A1935 100%) !important;
    color: #F7F2E7 !important;
    border: 1px solid rgba(212,175,98,.18) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 52px rgba(0,0,0,.30) !important;
    overflow: hidden;
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-button {
    background: #071225 !important;
    color: #F7F2E7 !important;
    min-height: 62px;
    font-weight: 800;
    box-shadow: none !important;
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-button:hover {
    background: #0A1935 !important;
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-button:not(.collapsed) {
    background:
        linear-gradient(90deg, rgba(0,168,255,.09), rgba(10,25,53,.96)) !important;
    color: #D4AF62 !important;
    box-shadow: inset 3px 0 0 #00A8FF !important;
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-button::after {
    filter: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(720%) hue-rotate(171deg) brightness(91%);
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-button:not(.collapsed)::after {
    filter: brightness(0) saturate(100%) invert(76%) sepia(36%) saturate(604%) hue-rotate(359deg) brightness(91%);
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-collapse {
    background: transparent !important;
}

html[data-theme="dark"] .bp-home .bp-faq .bp-accordion .accordion-body {
    background: linear-gradient(180deg, rgba(8,22,46,.82), rgba(5,11,26,.72)) !important;
    color: #B9C4D5 !important;
    line-height: 2;
    border-top: 1px solid rgba(212,175,98,.10);
}




/* =========================================================
   BASTAPOOSH — TOP NAVIGATION + MOBILE MENU
   ========================================================= */
.site-header .custom-navbar {
    position: relative;
}

.bp-main-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: 1 1 auto;
    min-width: 0;
    margin-inline: 22px;
}

.bp-nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 15px;
    color: #f7f2e7 !important;
    text-decoration: none !important;
    font-size: .94rem;
    font-weight: 850;
    white-space: nowrap;
    border-radius: 13px;
    transition: color .2s ease, background .2s ease, transform .2s ease;
}

.bp-nav-link::after {
    content: "";
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 4px;
    height: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--bp-red), #d4af62);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .22s ease;
}

.bp-nav-link:hover,
.bp-nav-link:focus-visible {
    color: #fff !important;
    background: rgba(255,255,255,.065);
    transform: translateY(-1px);
}

.bp-nav-link:hover::after,
.bp-nav-link:focus-visible::after {
    transform: scaleX(1);
}

.bp-mobile-menu-btn {
    display: none;
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 1px solid rgba(212,175,98,.28);
    border-radius: 14px;
    background: rgba(7,18,37,.72);
    color: #fff;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    box-shadow: 0 10px 26px rgba(0,0,0,.18);
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.bp-mobile-menu-btn span {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 99px;
    background: currentColor;
    transition: transform .2s ease, opacity .2s ease;
}

.bp-mobile-menu-btn:hover,
.bp-mobile-menu-btn:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(0,198,255,.55);
    background: rgba(0,168,255,.10);
}

.bp-mobile-offcanvas {
    --bs-offcanvas-width: min(88vw, 390px);
    background:
        radial-gradient(420px 260px at 15% 8%, rgba(0,168,255,.10), transparent 70%),
        linear-gradient(145deg, #08162e 0%, #050b1a 100%);
    color: #f7f2e7;
    border-inline-start: 1px solid rgba(212,175,98,.24);
    box-shadow: -25px 0 80px rgba(0,0,0,.45);
}

.bp-mobile-offcanvas .offcanvas-header {
    padding: 22px 20px 18px;
    border-bottom: 1px solid rgba(212,175,98,.16);
}

.bp-mobile-offcanvas .offcanvas-title {
    margin: 2px 0 0;
    font-size: 1.35rem;
    font-weight: 900;
    color: #fffdf7;
}

.bp-mobile-menu-kicker {
    color: #d4af62;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .18em;
}

.bp-mobile-offcanvas .btn-close {
    margin: 0;
    opacity: .9;
}

.bp-mobile-nav-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bp-mobile-nav-link {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 58px;
    padding: 0 16px;
    border: 1px solid rgba(212,175,98,.14);
    border-radius: 16px;
    background: rgba(8,22,46,.74);
    color: #f7f2e7 !important;
    text-decoration: none !important;
    font-weight: 850;
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.bp-mobile-nav-link i {
    width: 24px;
    text-align: center;
    color: #00c6ff;
    font-size: 1.15rem;
}

.bp-mobile-nav-link:hover,
.bp-mobile-nav-link:focus-visible {
    transform: translateX(-3px);
    background: linear-gradient(90deg, rgba(0,168,255,.13), rgba(8,22,46,.92));
    border-color: rgba(0,198,255,.38);
    color: #fff !important;
}

.bp-mobile-phone-link {
    margin-top: 8px;
    background: linear-gradient(135deg, rgba(122,23,48,.75), rgba(8,22,46,.92));
    border-color: rgba(212,175,98,.28);
}

.bp-mobile-phone-link i {
    color: #d4af62;
}

@media (max-width: 1199.98px) and (min-width: 992px) {
    .bp-main-nav { margin-inline: 8px; gap: 2px; }
    .bp-nav-link { padding-inline: 10px; font-size: .88rem; }
}

@media (max-width: 991.98px) {
    .bp-main-nav { display: none; }
    .bp-mobile-menu-btn { display: inline-flex; }
    .site-header .custom-navbar { gap: 8px; }
    .header-right-section { gap: 5px; }
}

@media (max-width: 575.98px) {
    .bp-mobile-menu-btn { width: 44px; height: 44px; border-radius: 13px; }
    .header-flags { display: none !important; }
    .bp-mobile-offcanvas { --bs-offcanvas-width: min(92vw, 360px); }
}

html[data-theme="light"] .bp-mobile-menu-btn {
    background: rgba(6,63,50,.78);
    border-color: rgba(212,175,98,.34);
}

html[data-theme="light"] .bp-mobile-offcanvas {
    background:
        radial-gradient(420px 260px at 15% 8%, rgba(176,141,59,.12), transparent 70%),
        linear-gradient(145deg, #064e3b 0%, #032e25 100%);
}


/* =========================================================
   MOBILE HEADER FINAL FIX
   - Menu stays on the physical left
   - Language flags remain visible on mobile
   - Login button never sits underneath the menu
   ========================================================= */
@media (max-width: 991.98px) {
    .site-header .custom-navbar {
        position: relative !important;
    }

    .site-header .bp-mobile-menu-btn {
        position: absolute !important;
        left: 8px !important;
        right: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 1060 !important;
        pointer-events: auto !important;
    }

    .site-header .header-right-section {
        position: absolute !important;
        left: 60px !important;
        right: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 1065 !important;
        min-width: max-content !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
    }

    .site-header .header-flags {
        display: flex !important;
        align-items: center !important;
        gap: 2px !important;
    }

    .site-header .user-buttons {
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
        flex-wrap: nowrap !important;
    }

    .site-header .header-right-section .custom-btn {
        position: relative !important;
        z-index: 1070 !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 575.98px) {
    .site-header .bp-mobile-menu-btn {
        left: 6px !important;
        width: 40px !important;
        height: 40px !important;
        border-radius: 10px !important;
    }

    .site-header .header-right-section {
        left: 54px !important;
        gap: 3px !important;
    }

    .site-header .header-flags {
        display: flex !important;
        gap: 1px !important;
    }

    .site-header .header-flags a {
        width: 29px !important;
        height: 31px !important;
        border-radius: 9px !important;
    }

    .site-header .header-flags span {
        font-size: 15px !important;
    }

    .site-header .user-buttons {
        gap: 3px !important;
    }

    .site-header .header-right-section .custom-btn {
        min-height: 34px !important;
        padding: 5px 7px !important;
        font-size: .68rem !important;
        border-radius: 9px !important;
    }

    .site-header .bp-theme-switcher {
        display: inline-flex !important;
        align-items: center !important;
        visibility: visible !important;
        opacity: 1 !important;
        flex-shrink: 0 !important;
        min-height: 32px !important;
        padding: 2px !important;
        gap: 2px !important;
    }

    .site-header .bp-theme-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        visibility: visible !important;
        opacity: 1 !important;
        min-width: 30px !important;
        min-height: 27px !important;
        padding: 3px 7px !important;
    }

    .site-header .bp-theme-btn span {
        display: none !important;
    }

    .site-header .bp-theme-btn i {
        display: inline-block !important;
        font-size: .82rem !important;
    }
}


/* =========================================================
   BASTAPOOSH — AWARDS / HONORS SECTION
   Horizontal premium showcase
   ========================================================= */

.bp-awards{
    position:relative;
    width:100%;
}

.bp-awards-wrap{
    position:relative;
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    padding:8px 2px 18px;
    scrollbar-width:thin;
    scrollbar-color: rgba(0,168,255,.55) transparent;
    -webkit-overflow-scrolling:touch;
}

.bp-awards-wrap::-webkit-scrollbar{
    height:7px;
}

.bp-awards-wrap::-webkit-scrollbar-track{
    background:transparent;
}

.bp-awards-wrap::-webkit-scrollbar-thumb{
    background:rgba(0,168,255,.45);
    border-radius:999px;
}

.bp-awards-track{
    display:flex;
    flex-direction:row;
    gap:18px;
    width:max-content;
    min-width:100%;
    padding:2px;
}

.bp-award-card{
    flex:0 0 clamp(245px, 27vw, 310px);
    position:relative;
    overflow:hidden;
    border:1px solid var(--bp-border);
    border-radius:22px;
    background:linear-gradient(145deg, rgba(8,22,46,.96), rgba(7,18,37,.96));
    box-shadow:0 20px 55px rgba(0,0,0,.24);
    transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.bp-award-card:hover{
    transform:translateY(-6px);
    border-color:rgba(0,168,255,.38);
    box-shadow:0 28px 70px rgba(0,0,0,.38), 0 0 30px rgba(0,168,255,.08);
}

.bp-award-image-wrap{
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 18px 18px 0 0;
}

.bp-award-image-wrap::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, transparent 58%, rgba(5,11,26,.34));
    pointer-events:none;
}

.bp-award-image{
   width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    transition:transform .45s ease;
}

.bp-award-card:hover .bp-award-image{
    transform:scale(1.045);
}

.bp-award-content {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 76px;
    padding: 15px 17px 17px;

    /* هماهنگ با حالت روز و شب */
    background: var(--bp-panel, #ffffff);
    color: var(--bp-text, #111827);

    border-top: 1px solid var(--bp-border, rgba(0, 0, 0, .08));
}

.bp-award-icon {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;

    display: grid;
    place-items: center;

    border-radius: 13px;

    color: #fff;
    background: linear-gradient(145deg, var(--bp-red), #4E0D20);

    box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
}

.bp-award-content h3 {
    margin: 0;
    color: var(--bp-text, #111827);
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.8;
}

@media (max-width:767.98px){
    .bp-awards-wrap{
        margin-inline:-2px;
        padding-inline:2px;
    }

    .bp-awards-track{
        gap:14px;
    }

    .bp-award-card{
        flex-basis:76vw;
        max-width:300px;
        border-radius:18px;
    }

    .bp-award-content{
        min-height:68px;
        padding:12px 14px 14px;
    }



    .bp-award-content h3{
        font-size:.94rem;
    }
    /* اگر قالب در حالت روشن متغیرهای رنگ را تغییر می‌دهد */
[data-theme="light"] .bp-award-content,
.light-mode .bp-award-content {
    background: #ffffff;
    color: #111827;
}

[data-theme="light"] .bp-award-content h3,
.light-mode .bp-award-content h3 {
    color: #111827;
}

[data-theme="dark"] .bp-award-content,
.dark-mode .bp-award-content {
    background: #10141d;
    color: #f8f9fb;
}

[data-theme="dark"] .bp-award-content h3,
.dark-mode .bp-award-content h3 {
    color: #f8f9fb;
}

}