/* =====================================================================
   BLVD — Storefront theme overlay
   Loaded last in every customer-facing layout (web, auction, blog,
   payment, errors). Overrides only — no stock file is modified.
   ===================================================================== */

/* ---------- Base ---------- */
:root {
    --font-family-sans-serif: var(--blvd-font);
    --input-placeholder-color: var(--blvd-subtle);
}

body {
    font-family: var(--blvd-font) !important;
    background-color: var(--blvd-cream) !important;
    color: var(--blvd-text);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.font-bold, .fw-bold {
    font-family: var(--blvd-font);
    color: var(--blvd-ink);
    letter-spacing: -0.01em;
}

input, select, textarea, button, .btn,
.form-control, .dropdown-menu, .modal, .tooltip, .popover,
.swal2-popup, .toast {
    font-family: var(--blvd-font) !important;
}

a { color: var(--blvd-ink); }
a:hover { color: var(--blvd-accent-dark); }

::selection { background: var(--blvd-accent-soft); color: var(--blvd-ink); }

.text-accent-blvd { color: var(--blvd-accent) !important; }

/* Standalone pages (errors, maintenance, payment) don't define --web-primary */
.text-primary { color: var(--web-primary, var(--blvd-accent)) !important; }

/* ---------- Buttons ---------- */
.btn {
    border-radius: var(--blvd-radius-pill);
    font-weight: 600;
}
.btn--primary,
.btn-primary,
.btn.btn--primary,
.btn-scroll-top {
    color: #fff !important;
    background-color: var(--blvd-ink) !important;
    border-color: var(--blvd-ink) !important;
}
.btn--primary:hover,
.btn-primary:hover,
.btn--primary:focus,
.btn-primary:focus {
    color: #fff !important;
    background-color: var(--blvd-ink-2) !important;
    border-color: var(--blvd-ink-2) !important;
    box-shadow: 0 0 0 .2rem rgba(var(--blvd-ink-rgb), .12) !important;
}
.btn-secondary,
.btn--secondary {
    color: #fff !important;
    background-color: var(--blvd-accent-dark) !important;
    border-color: var(--blvd-accent-dark) !important;
}
.btn-outline-primary,
.btn-outline-accent,
.btn-outline--primary {
    color: var(--blvd-ink) !important;
    border-color: var(--blvd-ink) !important;
    background: transparent;
}
.btn-outline-primary:hover,
.btn-outline-accent:hover,
.btn-outline--primary:hover {
    color: #fff !important;
    background-color: var(--blvd-ink) !important;
}
.btn-light, .btn--light {
    background: var(--blvd-surface);
    border-color: var(--blvd-border);
    color: var(--blvd-ink);
}

/* ---------- Forms ---------- */
.form-control,
.custom-select,
select.form-control {
    border-radius: 12px;
    border-color: var(--blvd-border);
    background-color: var(--blvd-surface);
    color: var(--blvd-ink);
}
.form-control:focus,
.custom-select:focus {
    border-color: var(--blvd-accent) !important;
    box-shadow: 0 0 0 .2rem rgba(var(--blvd-accent-rgb), .15) !important;
}
.custom-control-input:checked ~ .custom-control-label::before,
.form-check-input:checked {
    background-color: var(--blvd-ink) !important;
    border-color: var(--blvd-ink) !important;
}

/* ---------- Cards & surfaces ---------- */
.card,
.__shadow,
.modal-content,
.dropdown-menu {
    border-color: var(--blvd-border) !important;
    border-radius: var(--blvd-radius) !important;
}
.card { box-shadow: var(--blvd-shadow-sm) !important; }
.dropdown-menu { box-shadow: var(--blvd-shadow) !important; }
.bg-light, .bg--light { background-color: var(--blvd-bg) !important; }

/* ---------- Topbar ---------- */
.topbar {
    background-color: var(--blvd-bg) !important;
    border-bottom: 1px solid var(--blvd-border);
}
.topbar .topbar-link,
.topbar .topbar-text { color: var(--blvd-text) !important; }

/* ---------- Header ---------- */
.navbar-sticky,
.navbar-sticky.bg-light,
.mobile-head {
    background-color: var(--blvd-cream) !important;
}
.navbar-sticky.navbar-stuck {
    box-shadow: 0 8px 24px -16px rgba(var(--blvd-ink-rgb), .35) !important;
}

/* Search pill */
.search_form .input-group-overlay,
.input-group-overlay .search-bar-input,
.search-bar-input {
    border-radius: var(--blvd-radius-pill) !important;
}
.search-bar-input {
    height: 46px;
    background: var(--blvd-surface) !important;
    border: 1px solid var(--blvd-border) !important;
    box-shadow: var(--blvd-shadow-sm);
    padding-inline-start: 1.25rem !important;
    padding-inline-end: 3.25rem !important;
}
.search-bar-input::placeholder { color: var(--blvd-subtle); }
.search-bar-input:focus {
    border-color: var(--blvd-accent) !important;
    box-shadow: 0 0 0 .2rem rgba(var(--blvd-accent-rgb), .15) !important;
}
.search_button {
    background-color: transparent !important;
    border: 0 !important;
    border-radius: var(--blvd-radius-pill) !important;
}
.search_button .input-group-text {
    background: var(--blvd-ink) !important;
    border-radius: var(--blvd-radius-pill) !important;
    width: 36px; height: 36px;
    padding: 0 !important;
    display: inline-flex; align-items: center; justify-content: center;
    margin: 5px;
    border: 0 !important;
}
.search_button .input-group-text i { color: #fff !important; }

/* Round icon buttons (wishlist / account / cart) */
.navbar-light .navbar-tool-icon-box,
.navbar-tool-icon-box.bg-secondary,
.navbar-tool-icon-box {
    background-color: var(--blvd-surface) !important;
    border: 1px solid var(--blvd-border);
    border-radius: 50% !important;
    color: var(--blvd-ink) !important;
    box-shadow: var(--blvd-shadow-sm);
}
.navbar-tool-icon-box .navbar-tool-icon-box { border: 0; box-shadow: none; }
.navbar-tool .navbar-tool-label {
    background-color: var(--blvd-heart) !important;
    color: #fff !important;
}
.navbar-tool-text, .navbar-tool-text small { color: var(--blvd-ink) !important; }

/* Menu bar under the header */
.navbar-stuck-menu {
    background-color: var(--blvd-cream) !important;
    border-top: 1px solid var(--blvd-border);
    border-bottom: 1px solid var(--blvd-border);
}
@media (min-width: 768px) {
    .navbar-stuck-menu .navbar-nav .nav-link,
    .navbar-stuck-menu .navbar-nav .nav-link span,
    .navbar-stuck-menu .navbar-nav .nav-item > a,
    .navbar-stuck-menu .navbar-nav .nav-item > button {
        color: var(--blvd-ink) !important;
        font-weight: 600;
    }
    .navbar-stuck-menu .navbar-nav .nav-item > a:hover,
    .navbar-stuck-menu .navbar-nav .nav-item.active > a {
        color: var(--blvd-accent-dark) !important;
    }
    .navbar-stuck-menu .__mega-nav { background: transparent !important; }
    .navbar-stuck-menu .__mega-nav .nav-link,
    .navbar-stuck-menu .mega-nav .category-menu-toggle-btn {
        background: var(--blvd-ink) !important;
        color: #fff !important;
        border-radius: var(--blvd-radius-pill) !important;
        padding-inline: 1.1rem !important;
        margin-block: 6px;
    }
    .navbar-stuck-menu .mega-nav .category-menu-toggle-btn,
    .navbar-stuck-menu .mega-nav .category-menu-toggle-btn span,
    .navbar-stuck-menu .mega-nav .category-menu-toggle-btn svg {
        color: #fff !important;
        padding-top: 0 !important; padding-bottom: 0 !important;
    }
    .navbar-stuck-menu .mega-nav .category-menu-toggle-btn { padding-block: 9px !important; }
    .navbar-stuck-menu .navbar-nav .text-white,
    .navbar-stuck-menu .navbar-nav .dropdown-toggle.btn:not(.btn--primary) {
        color: var(--blvd-ink) !important;
    }
    .navbar-stuck-menu .btn--primary,
    .navbar-stuck-menu .dropdown-toggle.btn { color: #fff !important; }
}
.mega-nav .nav-item .nav-link { color: var(--blvd-ink) !important; }

/* Category mega menu / sidebar */
.category-menu,
.category-menu-wrap .category-menu {
    border-radius: var(--blvd-radius) !important;
    border: 1px solid var(--blvd-border) !important;
    box-shadow: var(--blvd-shadow-sm) !important;
    background: var(--blvd-surface);
}
.category-menu li a:hover,
.mega_menu_inner h6 a:hover { color: var(--blvd-accent-dark) !important; }

/* ---------- Section headings & "See All" ---------- */
.view-all-btn-text,
.view-all-btn-text .view-btn-text {
    color: var(--blvd-text) !important;
    font-weight: 500;
}
.view-all-btn-text:hover,
.view-all-btn-text:hover .view-btn-text { color: var(--blvd-ink) !important; }

.categories-title,
.feature-product-title,
.arrival-title,
.featured_deal_title,
.section-header h2,
.__text-22px {
    color: var(--blvd-ink) !important;
    font-weight: 700 !important;
}

/* ---------- BLVD hero (home) ---------- */
.blvd-hero {
    position: relative;
    overflow: hidden;
    border-radius: var(--blvd-radius-lg);
    background: linear-gradient(100deg, var(--blvd-hero) 0%, #FBEFE6 38%, #F6E4D6 100%);
    min-height: 340px;
    display: flex;
    align-items: center;
}
.blvd-hero__art {
    position: absolute;
    inset: 0 0 0 auto;
    width: 74%;
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%);
            mask-image: linear-gradient(90deg, transparent 0%, #000 22%);
}
[dir="rtl"] .blvd-hero__art {
    inset: 0 auto 0 0;
    transform: scaleX(-1);
}
.blvd-hero__body {
    position: relative;
    z-index: 1;
    padding: 3rem 3rem;
    max-width: 480px;
}
.blvd-hero__title {
    font-size: clamp(2rem, 3.4vw, 3.1rem);
    line-height: 1.12;
    font-weight: 800;
    color: var(--blvd-ink);
    margin: 0 0 1.5rem;
    letter-spacing: -0.02em;
}
.blvd-hero__title .text-accent-blvd { display: block; }
.blvd-hero__cta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .8rem 1.4rem;
    border-radius: var(--blvd-radius-pill);
    background: var(--blvd-ink);
    color: #fff !important;
    font-weight: 600;
    font-size: .95rem;
    transition: transform .2s ease, background-color .2s ease;
}
.blvd-hero__cta:hover { background: var(--blvd-ink-2); transform: translateY(-1px); }

.blvd-hero-banners .owl-stage-outer,
.blvd-hero-banners img { border-radius: var(--blvd-radius) !important; }

@media (max-width: 767px) {
    .blvd-hero {
        min-height: 0;
        flex-direction: column;
        align-items: stretch;
    }
    .blvd-hero__body { padding: 1.75rem 1.25rem 0; max-width: none; }
    .blvd-hero__title { margin-bottom: 1rem; }
    .blvd-hero__art {
        position: relative;
        inset: auto;
        order: 2;
        width: 100%;
        height: 0;
        padding-top: 47%;            /* keeps the illustration's aspect ratio */
        margin-top: -1rem;
        background-position: center;
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%);
                mask-image: linear-gradient(180deg, transparent 0%, #000 22%);
    }
    [dir="rtl"] .blvd-hero__art { inset: auto; }
}

/* ---------- BLVD banner slider (home) ----------
   Admin > Promotion > Banners > "Home Slider", one banner at a time.
   Phones: main image 1179 x 630 px (the 393 x 210 band of the Figma "BLVD App" iPhone
   frame at 3x, node 2072-1482), full-bleed, dots 20px above the bottom as in Figma.
   Tablets/desktops: desktop image 2400 x 625 px. */
.blvd-banners__wrap { container-type: inline-size; }
.blvd-banners__slider { position: relative; }
.blvd-banner {
    display: block;
    overflow: hidden;
    border-radius: var(--blvd-radius-lg);
    background: var(--blvd-card);
}
.blvd-banner picture { display: block; }
.blvd-banner__img {
    display: block;
    width: 100% !important;
    height: auto;
    aspect-ratio: 1179 / 630;
    object-fit: cover;
}

.blvd-banners__slider.owl-theme .owl-dots {
    position: absolute;
    inset: auto 0 calc(20.6 * 100cqw / 393);
    z-index: 3;
    display: flex;
    justify-content: center;
    gap: 5px;
    margin: 0 !important;
    line-height: 0;
}
.blvd-banners__slider.owl-theme .owl-dots.disabled { display: none; }
.blvd-banners__slider.owl-theme .owl-dots .owl-dot {
    width: 6px !important;
    height: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: var(--blvd-radius-pill) !important;
    background: #9E9E9C !important;
    outline: 0;
    transition: width .25s ease, background-color .25s ease;
}
.blvd-banners__slider.owl-theme .owl-dots .owl-dot span { display: none !important; }
.blvd-banners__slider.owl-theme .owl-dots .owl-dot.active,
.blvd-banners__slider.owl-theme .owl-dots .owl-dot:hover {
    width: 16px !important;
    background: #383735 !important;
}

/* phones: full-bleed like the app frame */
@media (max-width: 575.98px) {
    .blvd-banners__wrap { padding-inline: 0; }
    .blvd-banner { border-radius: 0; }
}
@media (min-width: 576px) {
    .blvd-banners { padding-top: 1rem; }
}
@media (min-width: 768px) {
    .blvd-banner__img { aspect-ratio: 2400 / 625; }
    /* no desktop image uploaded: show the whole phone image rather than crop it */
    .blvd-banner--no-desktop .blvd-banner__img { object-fit: contain; }
    .blvd-banners__slider.owl-theme .owl-dots { bottom: 16px; }
    .blvd-banners__slider.owl-theme .owl-dots .owl-dot { width: 8px !important; height: 8px !important; }
    .blvd-banners__slider.owl-theme .owl-dots .owl-dot.active,
    .blvd-banners__slider.owl-theme .owl-dots .owl-dot:hover { width: 22px !important; }
}

/* ---------- Main banner slider ---------- */
.__slide-img,
.hero-slider .owl-stage-outer,
.footer_banner_img,
.__inline-63 {
    border-radius: var(--blvd-radius) !important;
}

/* ---------- Categories (circles) ---------- */
.__cate-item .__img {
    background: var(--blvd-surface);
    border: 1px solid var(--blvd-border);
    box-shadow: var(--blvd-shadow-sm) !important;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}
.__cate-item a:hover .__img {
    transform: translateY(-2px);
    box-shadow: var(--blvd-shadow) !important;
}
.__cate-item h3 { color: var(--blvd-ink); font-weight: 500 !important; }

/* ---------- Product cards ---------- */
.product-single-hover,
.flash_deal_product,
.inline_product,
.__f-23 {
    border-radius: var(--blvd-radius) !important;
}
.product-single-hover {
    background: var(--blvd-surface);
    border: 1px solid var(--blvd-border);
    box-shadow: none !important;
}
.product-single-hover:hover {
    box-shadow: var(--blvd-shadow) !important;
    transform: translateY(-2px);
}
.product-single-hover .inline_product,
.flash-deals-background-image {
    background: var(--blvd-card) !important;
}
.product-single-hover .inline_product img,
.product-single-hover.style--card .inline_product img {
    border-radius: 12px;
}
.flash_deal_product {
    background: var(--blvd-surface) !important;
    border: 1px solid var(--blvd-border) !important;
}

/* Discount pill (lavender, top-left) */
.for-discount-value {
    background: var(--blvd-lavender) !important;
    color: #fff !important;
    border-radius: var(--blvd-radius-pill) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 3px 9px !important;
    top: 10px !important;
    left: 10px !important;
    right: auto;
    line-height: 1.4;
}
[dir="rtl"] .for-discount-value { left: auto !important; right: 10px !important; }
.for-discount-value.position-static { top: auto !important; left: auto !important; }
.discount-badge,
.price-discount,
.price-discount.badge-primary {
    background: var(--blvd-lavender) !important;
    color: #fff !important;
    border-radius: var(--blvd-radius-pill) !important;
    font-weight: 600 !important;
    padding: 3px 10px !important;
}

.flash-product-title,
.single-product-details a,
.single-product-details h3,
.product-title1 {
    color: var(--blvd-ink) !important;
}
.product-price .text-accent,
.flash-product-price,
.text-accent.text-dark {
    color: var(--blvd-ink) !important;
    font-weight: 700 !important;
}
del, .category-single-product-price del, del.category-single-product-price {
    color: var(--blvd-subtle) !important;
}

/* Quick view / wishlist circle buttons */
.btn-circle,
.product-single-hover .btn-circle {
    background: var(--blvd-surface) !important;
    color: var(--blvd-ink) !important;
    border: 1px solid var(--blvd-border) !important;
    border-radius: 50% !important;
    box-shadow: var(--blvd-shadow-sm);
}
.wishlist-icon_active,
.wishlist_icon_active,
.czi-heart-filled,
.fa-heart.text-danger { color: var(--blvd-heart) !important; }

/* Stars keep warm gold */
.text-warning, .tio-star, .tio-star-half { color: #E0A93B !important; }

/* Owl nav arrows */
.owl-theme .owl-nav [class*="owl-"] {
    background: var(--blvd-surface) !important;
    color: var(--blvd-ink) !important;
    border: 1px solid var(--blvd-border) !important;
    border-radius: 50% !important;
    box-shadow: var(--blvd-shadow-sm);
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span { background: var(--blvd-ink) !important; }

/* ---------- Home sections ---------- */
.__inline-62,
.section-card-margin,
.__featured-deal-wrap,
.featured_deal .__featured-deal-wrap {
    border-radius: var(--blvd-radius-lg) !important;
}
.__inline-62 { background: var(--blvd-surface); border: 1px solid var(--blvd-border); }
.__featured-deal-wrap { background: var(--blvd-bg) !important; }

/* Flash deal band */
.flash-deal-view-all-web,
.flash_deal_title,
.countdown-card,
.__flash-deals-bg {
    border-radius: var(--blvd-radius) !important;
}
.countdown-card,
.flash-deal-text,
.cz-countdown { color: #fff; }
.__flash-deals-bg,
.flash-deal-slider-mobile + div,
.countdown-background { background: var(--blvd-ink) !important; }

/* Deal of the day / recommended product */
.deal_of_the_day,
.__inline-70 {
    border-color: var(--blvd-border) !important;
    border-radius: var(--blvd-radius-lg) !important;
    background: var(--blvd-bg) !important;
    overflow: hidden;
}

/* Top sellers */
.others-store-card,
.__shop-card,
.top-seller-card {
    border-color: var(--blvd-border) !important;
    border-radius: var(--blvd-radius) !important;
}

/* Brand tiles */
.__brand-item {
    background: var(--blvd-surface);
    border: 1px solid var(--blvd-border);
    border-radius: var(--blvd-radius) !important;
}

/* ---------- Badges, tabs, pagination ---------- */
.badge-primary,
.badge--primary,
.badge-accent,
span.badge-accent {
    background: var(--blvd-accent-soft) !important;
    color: var(--blvd-accent-dark) !important;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link,
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: var(--blvd-ink) !important;
    border-color: var(--blvd-ink) !important;
}
.nav-pills .nav-link.active { background: var(--blvd-ink) !important; color: #fff !important; }
.page-item.active .page-link {
    background: var(--blvd-ink) !important;
    border-color: var(--blvd-ink) !important;
    color: #fff !important;
}
.page-link { color: var(--blvd-ink); border-radius: 10px !important; margin: 0 2px; }

/* ---------- Account / profile sidebar ---------- */
.__account-address .nav-pills .nav-link.active,
.profile-aside .active,
.__inline-45 .nav-pills .nav-link.active {
    background: var(--blvd-accent-soft) !important;
    color: var(--blvd-ink) !important;
}

/* ---------- Footer ---------- */
.page-footer,
.__inline-9,
footer.page-footer {
    background-color: var(--blvd-ink) !important;
}
.footer-heading-color,
.page-footer .widget-title,
.page-footer h6 { color: #fff !important; }
.page-footer a:hover { color: var(--blvd-accent-soft) !important; }

/* ---------- Misc ---------- */
::-webkit-scrollbar-thumb:hover { background: var(--blvd-accent) !important; }
.loading-parent .loader-img, #loading { color: var(--blvd-ink); }
.swal2-styled.swal2-confirm { background-color: var(--blvd-ink) !important; border-radius: var(--blvd-radius-pill) !important; }
.swal2-styled.swal2-cancel { border-radius: var(--blvd-radius-pill) !important; }
.swal2-popup { border-radius: var(--blvd-radius-lg) !important; }
