/* WalStore v2.3 — root horizontal-scroll repair.
   Loaded last. Keeps the whole product page and mobile fixed nav inside the real layout viewport. */

html,
body.vp-site-body {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    translate: none !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none !important;
}

.vp-main-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative !important;
    left: 0 !important;
    transform: none !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

/* Guaranteed header cart icon. This does not depend on a saved theme icon. */
.vp-header-cart-btn::before {
    content: "" !important;
    display: inline-block !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 2px 0 0 !important;
    background: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M3 4h2l1.55 9.05a2 2 0 0 0 1.98 1.66h7.96a2 2 0 0 0 1.95-1.55L20 7H6'/%3E%3Ccircle cx='9' cy='19' r='1.35' fill='black'/%3E%3Ccircle cx='17' cy='19' r='1.35' fill='black'/%3E%3C/svg%3E") center/contain no-repeat !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M3 4h2l1.55 9.05a2 2 0 0 0 1.98 1.66h7.96a2 2 0 0 0 1.95-1.55L20 7H6'/%3E%3Ccircle cx='9' cy='19' r='1.35' fill='black'/%3E%3Ccircle cx='17' cy='19' r='1.35' fill='black'/%3E%3C/svg%3E") center/contain no-repeat !important;
    color: #fff !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.vp-header-cart-btn .wc-header-cart-svg { display: none !important; }

@media (max-width: 991px) {
    html,
    body.vp-site-body {
        touch-action: manipulation;
    }

    .vp-product-page {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        left: 0 !important;
        right: auto !important;
        transform: none !important;
        translate: none !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* Real centered mobile canvas. Do not let old desktop container math touch screen edges. */
    .vp-product-page > .vp-container,
    .vp-product-page > .vp-container-wide,
    .vp-product-page > .vp-container.vp-container-wide {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        min-width: 0 !important;
        margin-left: 12px !important;
        margin-right: 12px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        position: relative !important;
        left: 0 !important;
        right: auto !important;
        transform: none !important;
        translate: none !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .vp-product-detail,
    .vp-product-gallery,
    .vp-product-summary,
    .vp-product-panels,
    .vp-product-panels > *,
    .nova-buy-info-card,
    .nova-buy-info-grid,
    .nova-product-info-wrap,
    .nova-product-info-card,
    .nova-product-info-grid,
    .vp-action-box,
    .vp-price-box,
    .vp-short-desc,
    .vp-meta-pills,
    .vp-breadcrumbs {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        left: 0 !important;
        right: auto !important;
        transform: none !important;
        translate: none !important;
        box-sizing: border-box !important;
    }

    .vp-product-detail {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
        overflow: visible !important;
    }

    .vp-product-page *,
    .vp-product-page *::before,
    .vp-product-page *::after {
        box-sizing: border-box !important;
        min-width: 0;
    }

    .vp-product-page img,
    .vp-product-page video,
    .vp-product-page iframe,
    .vp-product-page svg,
    .vp-product-page canvas {
        max-width: 100% !important;
    }

    .vp-product-page table,
    .vp-product-page pre,
    .vp-product-page code {
        max-width: 100% !important;
    }
    .vp-product-page table { display: block !important; overflow-x: auto !important; }
    .vp-product-page pre { overflow-x: auto !important; white-space: pre-wrap !important; }

    .vp-product-summary h1,
    .vp-product-summary h2,
    .vp-product-summary h3,
    .vp-product-summary p,
    .vp-rich-text,
    .vp-rich-text * {
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    /* Intentional horizontal gallery scrolling stays inside the strip only. */
    .vp-gallery-carousel,
    .vp-main-image,
    #zoomContainer {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    .vp-thumb-strip {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        overscroll-behavior-x: contain !important;
        -webkit-overflow-scrolling: touch !important;
    }

    /* Bottom nav is tied to the visible viewport, never to an oversized page ancestor. */
    .vp-mobile-bottom-nav {
        position: fixed !important;
        inset-inline: 12px !important;
        left: 12px !important;
        right: 12px !important;
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        min-width: 0 !important;
        margin: 0 !important;
        transform: none !important;
        translate: none !important;
        box-sizing: border-box !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        overflow: hidden !important;
        contain: layout paint !important;
    }
    .vp-mobile-bottom-nav > a,
    .vp-mobile-bottom-nav > button {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    /* Offcanvas panels must never create root horizontal width. */
    #offcanvasRight,
    #navbar-default {
        max-width: calc(100% - 16px) !important;
        box-sizing: border-box !important;
    }
}
