/**
 * Mobile-only layout fixes for original storefront.
 * ALL rules are inside max-width media queries — desktop is unchanged.
 * No color / functionality changes.
 */

/* Phones + small tablets */
@media (max-width: 767.98px) {
    /*
     * Backdrop only covers the RIGHT side (outside the ~295px sidebar).
     * Never covers the menu — so Home / Genie / links stay clickable.
     */
    .mobile-nav-backdrop {
        display: none !important;
        position: fixed !important;
        top: 0 !important;
        left: 295px !important;
        right: 0 !important;
        bottom: 0 !important;
        width: auto !important;
        height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        z-index: 100000 !important;
        pointer-events: auto !important;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .mobile-nav-backdrop.show {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /*
     * Genie / any Bootstrap modal open → hide menu backdrop.
     * Otherwise the right-side dark strip (left:295px) covers the modal.
     */
    body.modal-open .mobile-nav-backdrop,
    body.modal-open .mobile-nav-backdrop.show,
    html.modal-open .mobile-nav-backdrop,
    html.modal-open .mobile-nav-backdrop.show,
    body:has(#productRequestModal.show) .mobile-nav-backdrop,
    body:has(#productRequestModal.show) .mobile-nav-backdrop.show {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        z-index: -1 !important;
    }

    /* Genie modal above leftover overlays */
    body.modal-open #productRequestModal,
    #productRequestModal.show {
        z-index: 100060 !important;
    }

    body.modal-open .modal-backdrop,
    body.modal-open .modal-backdrop.show {
        z-index: 100050 !important;
    }

    /* Keep sidebar clickable above page content */
    body.mobile-nav-open #navbarCollapse.show,
    html.mobile-nav-open #navbarCollapse.show {
        z-index: 100001 !important;
        position: fixed !important;
        left: 0 !important;
        top: 0 !important;
        pointer-events: auto !important;
    }

    body.mobile-nav-open #navbarCollapse.show a,
    body.mobile-nav-open #navbarCollapse.show button,
    body.mobile-nav-open #navbarCollapse.show .nav-link,
    body.mobile-nav-open #navbarCollapse.show .dropdown-toggle {
        pointer-events: auto !important;
        position: relative;
        z-index: 1;
    }

    body.mobile-nav-open,
    html.mobile-nav-open {
        overflow: hidden !important;
    }

    @media (max-width: 360px) {
        .mobile-nav-backdrop {
            left: 85vw !important; /* match narrower sidebars */
        }
    }

    html {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    html,
    body {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    body {
        position: relative !important;
    }

    /* Do NOT set max-width on .owl-stage (carousel needs wider track) */
    img,
    video,
    iframe,
    svg {
        max-width: 100% !important;
        height: auto;
    }

    .owl-carousel .owl-item img {
        width: 100% !important;
        max-width: 100% !important;
    }

    .container,
    .container-fluid,
    .container-sm,
    .container-md {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    /* Header — keep sticky, prevent side overflow */
    header.__inline-10,
    header.__inline-10 .navbar-sticky,
    header.__inline-10 .topNav,
    header.__inline-10 .bottomNav,
    header.__inline-10 .navbar-stuck-menu {
        width: 100% !important;
        max-width: 100vw !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    header.__inline-10 .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* Home page wrapper */
    .__inline-61 {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Categories — hide broken fixed-width grid; use carousel only */
    .catSection .catTab {
        display: none !important;
    }

    .catSection,
    .catCont,
    .catSection .card,
    .catSection .card-body {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    .catSection .categories-title .font-semibold,
    .catSection .categories-title .font-semi-bold {
        margin-left: 0 !important;
        font-size: 1.15rem !important;
    }

    .catSection .__cate-item .__img,
    .catSection .mobile-carousel-item .__img {
        height: auto !important;
        max-height: 120px !important;
        aspect-ratio: 1 / 1 !important;
        margin: 0 auto !important;
    }

    .catSection .owl-carousel,
    .categories--slider {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .catSection .owl-stage-outer,
    .categories--slider .owl-stage-outer {
        overflow: hidden !important;
        padding: 8px 4px !important;
    }

    /* Featured products — stop page overflow; allow carousel inside */
    .featuredSection,
    .featuredCont,
    .__inline-62 {
        height: auto !important;
        min-height: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 16px 12px 20px !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .feature-product,
    .feature-product .carousel-wrap,
    #featured_products_list,
    #gifting_products_list,
    .new-arrivals-product,
    .owl-carousel {
        width: 100% !important;
        max-width: 100% !important;
        position: relative !important;
        overflow: visible !important;
    }

    .feature-product .owl-stage-outer,
    #featured_products_list .owl-stage-outer,
    #gifting_products_list .owl-stage-outer,
    .new-arrivals-product .owl-stage-outer,
    .owl-carousel .owl-stage-outer {
        overflow: hidden !important;
    }

    /*
     * Show left/right arrows on mobile (no hover on touch).
     * Desktop still uses hover behavior — these rules are max-width only.
     */
    .__inline-61 .owl-theme .owl-nav,
    .__inline-61 .owl-theme:not(:hover) .owl-nav,
    .featuredSection .owl-theme .owl-nav,
    .featuredSection .owl-theme:not(:hover) .owl-nav,
    #featured_products_list.owl-theme .owl-nav,
    #featured_products_list.owl-theme:not(:hover) .owl-nav,
    #gifting_products_list.owl-theme .owl-nav,
    .new-arrivals-product.owl-theme .owl-nav,
    .categories--slider.owl-theme .owl-nav {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        z-index: 20 !important;
        position: absolute !important;
        top: 40% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        justify-content: space-between !important;
        transform: none !important;
    }

    .__inline-61 .feature-product .owl-nav {
        z-index: 20 !important;
    }

    .__inline-61 .owl-theme .owl-nav .owl-prev,
    .__inline-61 .owl-theme .owl-nav .owl-next,
    .__inline-61 .owl-theme:not(:hover) .owl-nav .owl-prev,
    .__inline-61 .owl-theme:not(:hover) .owl-nav .owl-next,
    #featured_products_list.owl-theme .owl-nav .owl-prev,
    #featured_products_list.owl-theme .owl-nav .owl-next,
    #featured_products_list.owl-theme:not(:hover) .owl-nav .owl-prev,
    #featured_products_list.owl-theme:not(:hover) .owl-nav .owl-next {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
        margin: 0 !important;
        width: 36px !important;
        height: 36px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: #34092a !important;
        color: #fff !important;
        border-radius: 50% !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18) !important;
    }

    .__inline-61 .owl-theme .owl-nav .owl-prev,
    #featured_products_list.owl-theme .owl-nav .owl-prev {
        margin-left: 2px !important;
    }

    .__inline-61 .owl-theme .owl-nav .owl-next,
    #featured_products_list.owl-theme .owl-nav .owl-next {
        margin-right: 2px !important;
    }

    .__inline-61 .owl-theme .owl-nav .owl-prev i,
    .__inline-61 .owl-theme .owl-nav .owl-next i,
    #featured_products_list .owl-nav i {
        color: #fff !important;
        font-size: 16px !important;
    }

    .feature-product-title,
    .featuredTopDiv .feature-product-title {
        font-size: 1.15rem !important;
    }

    /* Banners / hero */
    .__inline-61 img.footer_banner_img,
    .mainBannerCont img,
    .promotional-banner-slider img,
    .owl-carousel img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: cover;
    }

    /* Vendor / best selling / new arrival */
    .new-arrival-section,
    .vendorCont,
    .compContainer,
    .shipping-policy-web {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
    }

    /* Reliability bar — 2 items on mobile (owl items:2 in custom.js); desktop unchanged */
    .shipping-policy-web,
    .product-policy-web .shipping-policy-web,
    .compContainer .shipping-policy-web {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .footer-top-slider .footer-top-slide-item {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .footer-top-slider .shipping-method-system img {
        width: 56px !important;
        height: 56px !important;
        margin-bottom: 8px !important;
    }

    .footer-top-slider .shipping-method-system p,
    .footer-top-slider .web-text-primary {
        font-size: 12px !important;
        line-height: 1.3 !important;
        padding: 0 4px !important;
    }

    .new-arrival-section {
        padding: 16px 10px !important;
    }

    .__best-selling {
        max-width: 100% !important;
    }

    /*
     * Founding / Top seller — show carousel again on mobile.
     * Do NOT set float:none / display:flex on .owl-item (breaks Owl height → blank).
     * One card only comes from home.js items:1 below 768px.
     */
    .vendorCont,
    .vendor-card,
    .vendor-card .card,
    .vendor-card .card-body {
        max-width: 100% !important;
        overflow: visible !important;
        min-height: 0 !important;
        height: auto !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    /* AOS sometimes leaves opacity:0 on mobile — force visible */
    .vendorCont[data-aos],
    .vendorCont.aos-init,
    .vendorCont.aos-animate {
        opacity: 1 !important;
        transform: none !important;
        visibility: visible !important;
    }

    .others-store-slider.owl-carousel {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        opacity: 1 !important;
        visibility: visible !important;
        min-height: 180px !important;
    }

    .others-store-slider .owl-stage-outer {
        overflow: hidden !important;
        width: 100% !important;
        display: block !important;
    }

    .others-store-slider .owl-stage {
        display: flex !important;
    }

    .others-store-card {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .others-store-slider .owl-nav {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 20 !important;
        pointer-events: auto !important;
    }

    .others-store-slider .owl-nav .owl-prev,
    .others-store-slider .owl-nav .owl-next,
    .others-store-slider.owl-theme:not(:hover) .owl-nav .owl-prev,
    .others-store-slider.owl-theme:not(:hover) .owl-nav .owl-next {
        opacity: 1 !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    /* Cookie / privacy bar — stack on small screens */
    #cookie-section,
    .cookie-section,
    [id*="cookie"] {
        max-width: 100vw !important;
        box-sizing: border-box !important;
    }

    #cookie-section .d-flex,
    .cookie-section .d-flex {
        flex-wrap: wrap !important;
    }

    #cookie-section .btn,
    .cookie-accept {
        margin-top: 8px;
    }

    /* Footer */
    .page-footer,
    .footer-slider-container,
    .__inline-9 {
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* Prevent wide min-widths from forcing horizontal scroll */
    .min-width-600px,
    .min-width-160px {
        min-width: 0 !important;
        width: 100% !important;
    }

    /* Tables / wide blocks */
    .table-responsive {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    /*
     * Shop page (/shopView/*) — mobile layout only.
     * Desktop rules in style.css are untouched.
     */
    .__inline-67 {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        padding-top: 12px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    /* Banner: full width (was tiny with object-fit:contain) */
    .__inline-67 .__shop-banner-main {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
        display: block !important;
        overflow: hidden !important;
        border-radius: 10px !important;
        box-sizing: border-box !important;
    }

    .__inline-67 .__shop-banner-main .__shop-page-banner,
    .__inline-67 .__shop-page-banner {
        position: static !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 120px !important;
        max-height: none !important;
        aspect-ratio: 16 / 7 !important;
        object-fit: cover !important;
        object-position: center center !important;
        border-radius: 10px !important;
        margin: 0 !important;
    }

    /* Shop info card under banner */
    .__inline-67 .__rounded-10 {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .__inline-67 .vendor-details {
        width: 100% !important;
        justify-content: flex-start !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 4px !important;
        padding: 6px 4px !important;
    }

    .__inline-67 .vendor-details > .d-flex.align-items-center {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    .__inline-67 .w-90px {
        width: 64px !important;
        min-width: 64px !important;
        flex-shrink: 0 !important;
    }

    .__inline-67 .__w-100px {
        min-width: 0 !important;
        width: auto !important;
        max-width: 100% !important;
    }

    .__inline-67 .vendor-details .font-weight-bolder {
        font-size: 1rem !important;
        line-height: 1.3 !important;
        word-break: break-word !important;
    }

    .__inline-67 .vendor-details .fs-12,
    .__inline-67 .vendor-details .fs-13 {
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    .__inline-67 .chat-with-vendor-button {
        padding: 4px !important;
        flex-shrink: 0 !important;
    }

    /* Categories row + sort + search */
    .__inline-67 .w-max-md-100 {
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    .__inline-67 .d-flex.flex-wrap.gap-3.justify-content-sm-between.py-4 {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-top: 16px !important;
        padding-bottom: 12px !important;
    }

    .__inline-67 .d-flex.flex-column.flex-sm-row.gap-3 {
        width: 100% !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .__inline-67 .d-flex.flex-column.flex-sm-row.gap-3 > form {
        width: 100% !important;
        margin: 0 !important;
    }

    .__inline-67 .sorting-item {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .__inline-67 .sorting-item select {
        width: 100% !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    .__inline-67 .search_form,
    .__inline-67 .search-form-input-group {
        width: 100% !important;
        max-width: 100% !important;
        flex-wrap: nowrap !important;
    }

    .__inline-67 .search-form-input-group .form-control {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        font-size: 13px !important;
    }

    .__inline-67 .filter-ico-button {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        justify-content: center !important;
        border-radius: 8px !important;
    }

    /*
     * Sidebar is fixed off-canvas on mobile — collapse its grid column
     * so products use full width (sidebar still opens via filter button).
     */
    .__inline-67 > .row.rtl > .col-lg-3,
    .__inline-67 .row > .col-lg-3.pe-4 {
        flex: 0 0 0 !important;
        width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        border: 0 !important;
    }

    .__inline-67 .product-div,
    .__inline-67 .row > .col-lg-9.product-div {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .__inline-67 #ajax-products {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .__inline-67 #ajax-products > [class*="col-"] {
        padding: 6px !important;
    }

    .__inline-67 #ajax-products .product-single-hover,
    .__inline-67 #ajax-products .card,
    .__inline-67 #ajax-products .for-hover-bg {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .__inline-67 #ajax-products img {
        max-width: 100% !important;
        height: auto !important;
    }

    /*
     * Product details page — mobile gallery + layout.
     * Desktop side-by-side thumbs stay unchanged (outside this media query).
     */
    .productSection,
    .__inline-23.productSection {
        width: 100% !important;
        max-width: 100vw !important;
        margin: 0 !important;
        border-radius: 0 !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        box-sizing: border-box !important;
        padding: 0 0 calc(110px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .productSection > .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-top: 8px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    .productDetailsRow,
    .productSection .productDetailsRow {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Force every product column full-width so title/price are never beside gallery */
    .productDetailsRow > [class*="col-"],
    .productSection .productDetailsRow > [class*="col-"],
    .productSection .col-lg-6,
    .productSection .col-md-6,
    .productSection .col-12 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        float: none !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    .productSection .web-direction,
    .productSection .details,
    .productSection .details.__h-100 {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        position: relative !important;
        margin: 8px 0 0 !important;
        padding: 12px !important;
        border-radius: 12px !important;
        box-sizing: border-box !important;
        background: #fff !important;
    }

    /* Stack: main image on top, thumbs horizontal below */
    .cz-product-gallery,
    .cz-product-gallery.d-flex,
    .productSection .cz-product-gallery {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .cz-product-gallery .cz-preview {
        order: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
        position: relative !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        background: #fff !important;
        border: 1px solid #ede4ea !important;
        border-radius: 12px !important;
        overflow: visible !important;
        box-shadow: none !important;
    }

    .cz-product-gallery .product-thumb-vertical-gallery {
        order: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 auto !important;
    }

    .cz-product-gallery .product-thumb-vertical-gallery > .d-flex.flex-column {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        padding: 2px 0 6px !important;
        width: 100% !important;
    }

    .cz-product-gallery .product-preview-thumb-vertical {
        width: 60px !important;
        height: 60px !important;
        min-width: 60px !important;
        flex: 0 0 60px !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
    }

    .cz-product-gallery .product-preview-thumb-vertical img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .cz-product-gallery .main-product-image-container {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        background: #fff !important;
        position: relative !important;
    }

    /* Keep image shorter so title/price show above sticky bar */
    .cz-product-gallery #mainProductImage,
    .cz-product-gallery .cz-image-zoom {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: 42vh !important;
        margin: 0 auto !important;
        object-fit: contain !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .cz-product-gallery #mainProductVideo {
        max-height: 42vh !important;
    }

    .cz-product-gallery .preview-overlay-controls {
        position: absolute !important;
        top: 10px !important;
        left: 10px !important;
        right: auto !important;
        z-index: 12 !important;
        pointer-events: none !important;
    }

    .cz-product-gallery .preview-overlay-controls .btn,
    .cz-product-gallery .btn-zoom-toggle {
        pointer-events: auto !important;
        padding: 6px 10px !important;
        font-size: 12px !important;
        border-radius: 8px !important;
    }

    .cz-product-gallery .btn-image-nav {
        width: 34px !important;
        height: 34px !important;
        top: 50% !important;
    }

    .cz-product-gallery .btn-image-prev {
        left: 6px !important;
    }

    .cz-product-gallery .btn-image-next {
        right: 6px !important;
    }

    .cz-product-gallery .wishList-pos-btn {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        left: auto !important;
        width: 36px !important;
        height: 36px !important;
        z-index: 12 !important;
        background: #fff !important;
        border-radius: 50% !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    /* Share under thumbs — not floating on image */
    .cz-product-gallery .cz-preview > .d-flex.flex-column.gap-3.mt-3 {
        position: static !important;
        margin: 8px 8px 10px !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        min-height: 0 !important;
    }

    .cz-product-gallery .share--icons,
    .cz-product-gallery .sharethis-inline-share-buttons,
    .productSection .share--icons {
        position: static !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        bottom: auto !important;
        transform: none !important;
        flex-direction: row !important;
        display: flex !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        z-index: 1 !important;
    }

    .cz-product-gallery .cz-image-zoom-pane {
        display: none !important;
    }

    .cz-product-gallery.manual-zoom-enabled .cz-image-zoom-pane {
        display: block !important;
    }

    .productSection .details .__inline-24 {
        display: block !important;
        font-size: 1.2rem !important;
        line-height: 1.35 !important;
        word-break: break-word !important;
        margin-bottom: 6px !important;
    }

    .productSection .details #chosen_price,
    .productSection .details .product-price {
        font-size: 1.3rem !important;
    }

    .productSection .details .btn {
        padding: 12px 16px !important;
        font-size: 14px !important;
        border-radius: 9999px !important;
    }

    .productSection .details .floating-btn-grp,
    .productSection .details .action-buttons {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .productSection .quantity-box {
        max-width: 100% !important;
    }

    .productSection .accordion,
    .productSection .productDetailsAccordionCard {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Sticky buy bar — full width, never hide product info */
    .bottom-sticky,
    .bottom-sticky.d-sm-none,
    .productSection .bottom-sticky,
    .bottom-sticky.stick,
    .bottom-sticky.is-fixed {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        z-index: 1030 !important;
        margin: 0 !important;
        padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
        border-radius: 14px 14px 0 0 !important;
        box-sizing: border-box !important;
        background: #fff !important;
        opacity: 1 !important;
        height: auto !important;
        visibility: visible !important;
        box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.1) !important;
    }

    .bottom-sticky .btn {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
    }

    .bottom-sticky .d-flex.gap-3 {
        width: 100% !important;
        gap: 8px !important;
    }

    /*
     * Shopping cart (/shop-cart) — mobile layout only.
     * Desktop table (d-none d-lg-block) is untouched.
     */
    #cart-summary {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-top: 8px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    #cart-summary .row.g-3 {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    #cart-summary > .row > [class*="col-"],
    #cart-summary .col-lg-8,
    #cart-summary .col-lg-4,
    #cart-summary .order-summery-aside {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        float: none !important;
    }

    #cart-summary .cart_information.d-lg-none {
        width: 100% !important;
        max-width: 100% !important;
        background: #fff !important;
        border-radius: 12px !important;
        padding: 12px !important;
        margin-bottom: 12px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    #cart-summary .cart_information.d-lg-none .card-header {
        padding-left: 0 !important;
        padding-right: 0 !important;
        background: transparent !important;
    }

    /* Cart item: stack info then qty (stop cramped 3-column squeeze) */
    #cart-summary .cart_information.d-lg-none > .d-flex.justify-content-between {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        padding: 12px 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    #cart-summary .cart_information.d-lg-none > .d-flex.justify-content-between > .d-flex.gap-3.align-items-center {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }

    #cart-summary .cart_information.d-lg-none > .d-flex.justify-content-between > .d-flex.gap-3.align-items-center > .d-flex.align-items-center.gap-3 {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }

    #cart-summary .cart_information.d-lg-none .__img-48 {
        width: 64px !important;
        height: 64px !important;
        min-width: 64px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
    }

    #cart-summary .cart_information.d-lg-none .d-flex.flex-column.gap-1 {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    #cart-summary .cart_information.d-lg-none .text-break,
    #cart-summary .cart_information.d-lg-none .__line-2 {
        white-space: normal !important;
        word-break: break-word !important;
        font-size: 14px !important;
        line-height: 1.35 !important;
        max-height: none !important;
    }

    #cart-summary .cart_information.d-lg-none .__text-12px,
    #cart-summary .cart_information.d-lg-none .fs-12 {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }

    /* Prices / total — wrap cleanly, never split mid-amount */
    #cart-summary .cart_information.d-lg-none .d-flex.gap-2,
    #cart-summary .cart_information.d-lg-none .d-flex.flex-wrap.column-gap-2 {
        flex-wrap: wrap !important;
        column-gap: 6px !important;
        row-gap: 2px !important;
        align-items: baseline !important;
    }

    #cart-summary .cart_information.d-lg-none .font-semi-bold,
    #cart-summary .cart_information.d-lg-none .fw-semibold {
        white-space: nowrap !important;
        word-break: keep-all !important;
    }

    #cart-summary .cart_information.d-lg-none .text-nowrap.fs-10 {
        white-space: normal !important;
        font-size: 11px !important;
    }

    /* Qty: horizontal under product */
    #cart-summary .cart_information.d-lg-none > .d-flex.justify-content-between > div:last-child {
        width: 100% !important;
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
    }

    #cart-summary .cart_information.d-lg-none .qty.d-flex.flex-column {
        flex-direction: row-reverse !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        border: 1px solid #ede4ea !important;
        border-radius: 10px !important;
        padding: 2px 4px !important;
        background: #faf7f9 !important;
    }

    #cart-summary .cart_information.d-lg-none .qty_plus,
    #cart-summary .cart_information.d-lg-none .qty_minus {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 36px !important;
        padding: 0 !important;
        cursor: pointer !important;
    }

    #cart-summary .cart_information.d-lg-none .qty_input {
        width: 44px !important;
        min-width: 44px !important;
        height: 36px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        text-align: center !important;
        border: none !important;
        background: transparent !important;
        font-weight: 600 !important;
        font-size: 14px !important;
        -moz-appearance: textfield;
    }

    #cart-summary .cart_information.d-lg-none .qty_input::-webkit-outer-spin-button,
    #cart-summary .cart_information.d-lg-none .qty_input::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    #cart-summary .h-100-200,
    #cart-summary textarea.form-control {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 90px !important;
        box-sizing: border-box !important;
    }

    #cart-summary .__cart-total,
    #cart-summary .cart_total {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        border-radius: 12px !important;
    }

    #cart-summary .order-summery-aside {
        padding-top: 8px !important;
    }

    #cart-summary .__cart-total_sticky {
        position: static !important;
    }

    #cart-summary .cart_title,
    #cart-summary .cart_value {
        font-size: 14px !important;
    }

    #cart-summary .proceed_to_next_button,
    #cart-summary .__cart-total .btn {
        width: 100% !important;
        max-width: 100% !important;
    }

    /*
     * Checkout (/checkout-details → shipping address form).
     * Desktop layout unchanged.
     */
    .__inline-56,
    .checkout-details-page,
    .__inline-54 {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    .__inline-56 > .row,
    .checkout-details-page > .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .__inline-56 .col-lg-8,
    .__inline-56 .col-lg-4,
    .__inline-56 .col-md-12,
    .__inline-56 .order-summery-aside,
    .checkout-details-page .col-lg-8,
    .checkout-details-page .col-lg-4,
    .checkout-details-page .order-summery-aside {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        float: none !important;
    }

    .__inline-56 .checkout_details {
        padding-right: 0 !important;
        padding-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .__inline-56 .__card,
    .__inline-56 #address-form.card,
    .__inline-56 .card.__card {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .__inline-56 .list-group-item {
        padding-left: 12px !important;
        padding-right: 12px !important;
        overflow: hidden !important;
    }

    /* Stack form columns (city/pincode, name/phone, etc.) */
    .__inline-56 #address-form .col-6,
    .__inline-56 #address-form .col-sm-6,
    .__inline-56 #billing-address-form .col-6,
    .__inline-56 #billing-address-form .col-sm-6,
    .__inline-56 .add-another-address .col-6,
    .__inline-56 .add-another-address .col-sm-6,
    .checkout-details-page .col-sm-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .__inline-56 .form-group {
        margin-bottom: 14px !important;
    }

    .__inline-56 .form-control,
    .__inline-56 select.form-control,
    .__inline-56 textarea.form-control,
    .__inline-56 .bootstrap-select,
    .__inline-56 .bootstrap-select > .dropdown-toggle {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .__inline-56 .bootstrap-select .dropdown-menu {
        max-width: 100vw !important;
        min-width: 0 !important;
    }

    /* intl-tel-input phone field */
    .__inline-56 .iti,
    .__inline-56 .iti--allow-dropdown,
    .__inline-56 .iti--separate-dial-code {
        width: 100% !important;
        display: block !important;
        max-width: 100% !important;
    }

    .__inline-56 .iti input.iti__tel-input,
    .__inline-56 .phone-input-with-country-picker-3,
    .__inline-56 input#phone,
    .__inline-56 input[type="tel"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .__inline-56 .iti__country-list {
        max-width: min(300px, calc(100vw - 40px)) !important;
        width: auto !important;
    }

    .__inline-56 .pincode-check-feedback {
        word-break: break-word !important;
        white-space: normal !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
        max-width: 100% !important;
    }

    /* Google map — stop horizontal overflow */
    .__inline-56 .location-map-canvas-area,
    .__inline-56 .form-group.location-map-canvas-area {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        position: relative !important;
        border-radius: 10px !important;
        box-sizing: border-box !important;
        margin-bottom: 12px !important;
    }

    .__inline-56 #location_map_canvas,
    .__inline-56 #location_map_canvas_billing,
    .__inline-56 .__h-200px {
        width: 100% !important;
        max-width: 100% !important;
        height: 200px !important;
        overflow: hidden !important;
        border-radius: 10px !important;
        box-sizing: border-box !important;
    }

    .__inline-56 #location_map_canvas > div,
    .__inline-56 #location_map_canvas_billing > div,
    .__inline-56 .location-map-canvas-area iframe,
    .__inline-56 .location-map-canvas-area img {
        max-width: 100% !important;
    }

    .__inline-56 .location-search-input-field,
    .__inline-56 #pac-input,
    .__inline-56 .__inline-46 {
        max-width: calc(100% - 24px) !important;
        width: calc(100% - 24px) !important;
        left: 12px !important;
        right: 12px !important;
        box-sizing: border-box !important;
        font-size: 13px !important;
    }

    .__inline-56 .steps-light,
    .__inline-56 .checkout-steps {
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .__inline-56 .__cart-total,
    .__inline-56 .cart_total,
    .__inline-56 .__cart-total_sticky {
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        box-sizing: border-box !important;
    }

    .__inline-56 .btn-block,
    .__inline-56 .btn.btn--primary,
    .__inline-56 .btn.btn-secondary {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .__inline-56 .saved-address-dropdown {
        max-width: min(320px, calc(100vw - 32px)) !important;
    }

    /*
     * Vendor registration (/vendor/auth/registration) hero text.
     * Center on mobile only — desktop alignment unchanged.
     */
    .vendorHeader,
    .vendorHeader.ext-center {
        width: 100% !important;
        max-width: 100% !important;
        align-items: center !important;
        text-align: center !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        box-sizing: border-box !important;
    }

    .vendorHeader .manContent {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    .vendorHeader .manContent h3,
    .vendorHeader .manContent h5,
    .vendorHeader .manContent p,
    .vendorHeader .manContent .text-centre,
    .vendorHeader .manContent a {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
        display: block !important;
    }

    .vendorHeader .manContent p a {
        display: inline !important;
        width: auto !important;
    }

    .vendorHeader .manfImg {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .vendorHeader .manfImg img {
        max-width: min(280px, 100%) !important;
        width: auto !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* Very small phones */
@media (max-width: 575.98px) {
    .featuredSection,
    .featuredCont,
    .__inline-62 {
        padding: 12px 8px !important;
        border-radius: 16px !important;
    }

    .catSection .__cate-item .__img,
    .catSection .mobile-carousel-item .__img {
        max-height: 96px !important;
    }

    .categories-title .font-semibold,
    .feature-product-title,
    .vendorTitle {
        font-size: 1.05rem !important;
        margin-left: 0 !important;
    }

    .__cate-item p,
    .__cate-item .small {
        font-size: 11px !important;
        line-height: 1.25 !important;
    }

    .__inline-67 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .__inline-67 .__shop-banner-main .__shop-page-banner,
    .__inline-67 .__shop-page-banner {
        min-height: 100px !important;
        aspect-ratio: 16 / 8 !important;
    }

    .__inline-67 .w-90px {
        width: 56px !important;
        min-width: 56px !important;
    }

    .productSection > .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .cz-product-gallery #mainProductImage,
    .cz-product-gallery .cz-image-zoom {
        max-height: 38vh !important;
    }

    .cz-product-gallery .product-preview-thumb-vertical {
        width: 56px !important;
        height: 56px !important;
        min-width: 56px !important;
        flex-basis: 56px !important;
    }

    .productSection .details,
    .productSection .details.__h-100 {
        padding: 10px !important;
    }

    .productSection .details .__inline-24 {
        font-size: 1.1rem !important;
    }

    #cart-summary {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    #cart-summary .cart_information.d-lg-none {
        padding: 10px !important;
    }

    #cart-summary .cart_information.d-lg-none .__img-48 {
        width: 56px !important;
        height: 56px !important;
        min-width: 56px !important;
    }

    .__inline-56,
    .checkout-details-page {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .__inline-56 .list-group-item {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .__inline-56 #location_map_canvas,
    .__inline-56 #location_map_canvas_billing {
        height: 180px !important;
    }

    .vendorHeader .manContent h3 {
        font-size: 1.35rem !important;
        line-height: 1.3 !important;
    }

    .vendorHeader .manContent h5 {
        font-size: 1.05rem !important;
    }

    .vendorHeader .manContent p {
        font-size: 0.9rem !important;
        line-height: 1.4 !important;
    }
}