/*
 * PJ3D Theme v139 regression contract.
 * Loaded after v135 and excluded from LiteSpeed optimization by the inherited
 * theme-asset exclusion so these geometry and contrast rules stay intact.
 */

/* Shop columns must never force primary content outside the viewport. */
.shop-container {
    box-sizing: border-box !important;
    display: grid !important;
    gap: clamp(1.5rem, 3vw, 3rem) !important;
    max-width: 1440px !important;
    min-width: 0 !important;
    width: 100% !important;
}

.shop-container.with-sidebar-left {
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) !important;
}

.shop-container.with-sidebar-right {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px) !important;
}

.shop-container.with-sidebar-both {
    grid-template-columns: minmax(200px, 250px) minmax(0, 1fr) minmax(200px, 250px) !important;
}

.shop-container :is(.shop-content, .shop-sidebar, .widget-area),
.shop-content > * {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Both card layers occupy one immutable 4:5 containing block. */
.pj135-product-media {
    contain: layout paint !important;
    isolation: isolate !important;
    position: relative !important;
}

.pj135-product-media > .pj135-product-media__image,
.pj135-product-media > .pj135-product-media__image--primary,
.pj135-product-media > .pj135-product-media__image--secondary {
    bottom: 0 !important;
    box-sizing: border-box !important;
    height: 100% !important;
    inset: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    max-height: none !important;
    max-width: none !important;
    object-fit: contain !important;
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    width: 100% !important;
}

.pj135-product-media > .pj135-product-media__image--primary {
    opacity: 1 !important;
}

.pj135-product-media > .pj135-product-media__image--secondary {
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 160ms ease-out !important;
}

@media (hover: hover) and (pointer: fine) {
    :is(li.product, .wc-block-grid__product, .wp-block-post):hover
        .pj135-product-media--ready > .pj135-product-media__image--secondary {
        opacity: 1 !important;
    }
}

:is(li.product, .wc-block-grid__product, .wp-block-post):focus-within
    .pj135-product-media--ready > .pj135-product-media__image--secondary {
    opacity: 1 !important;
}

/* Give decision content the width it needs and never clamp purchase text. */
body.single-product .hero-grid.commercial-layout {
    grid-template-columns: minmax(0, 1fr) minmax(420px, 0.8fr) !important;
}

body.single-product .hero-info-col {
    min-width: 0 !important;
}

body.single-product .hero-info-col :is(.pj-title, .ep-title-clamp, .hero-subtitle, .pj-microline) {
    display: block !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    -webkit-box-orient: initial !important;
    -webkit-line-clamp: unset !important;
}

/* Stable contrast across responsive image crops and every table state. */
body:not(.single-product) .wp-block-cover::before,
body:not(.single-product) .wp-block-cover__background,
body:not(.single-product) .wp-block-cover__gradient-background {
    background: rgba(20, 18, 15, 0.72) !important;
    opacity: 1 !important;
}

body:not(.single-product) .wp-block-cover :is(h1, h2, h3, h4, h5, h6, p, li) {
    color: #fffdf8 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
}

body :is(.wp-block-table, .woocommerce table, table.shop_table) :is(th, thead td) {
    background: #24211d !important;
    color: #fffdf8 !important;
}

body :is(.wp-block-table, .woocommerce table, table.shop_table) tbody :is(td, th) {
    background: #fffdf8 !important;
    color: #24211d !important;
}

body :is(.wp-block-table, .woocommerce table, table.shop_table) tbody tr:is(:hover, :focus-within) :is(td, th) {
    background: #e8dece !important;
    color: #24211d !important;
}

@media (max-width: 1100px) {
    .shop-container,
    .shop-container.with-sidebar-left,
    .shop-container.with-sidebar-right,
    .shop-container.with-sidebar-both {
        display: grid !important;
        gap: 1rem !important;
        grid-template-columns: minmax(0, 1fr) !important;
        margin-inline: auto !important;
        overflow-x: clip !important;
        padding-inline: clamp(12px, 4vw, 24px) !important;
        width: 100% !important;
    }

    .shop-container .shop-sidebar {
        padding-top: 0 !important;
    }

    .collection-filter-toggle {
        align-items: center !important;
        background: #24211d !important;
        color: #fffdf8 !important;
        display: inline-flex !important;
        justify-content: center !important;
        min-height: 48px !important;
        min-width: 48px !important;
        width: 100% !important;
    }

    .collection-filter-panel {
        display: none !important;
    }

    .collection-filter-panel.is-open {
        display: block !important;
    }

    /* Flatten only gallery wrappers so the first image, purchase panel and
       remaining images form the intended reading order without JavaScript. */
    body.single-product .hero-grid.commercial-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 1rem !important;
        grid-template-columns: none !important;
        width: 100% !important;
    }

    body.single-product :is(
        .hero-image-col,
        .hero-product-wrapper,
        .woocommerce-product-gallery,
        .flex-viewport,
        .woocommerce-product-gallery__wrapper
    ) {
        display: contents !important;
    }

    body.single-product .woocommerce-product-gallery__trigger,
    body.single-product .woocommerce-product-gallery .flex-control-nav {
        display: none !important;
    }

    body.single-product .woocommerce-product-gallery__image {
        flex: 0 0 auto !important;
        height: auto !important;
        max-height: none !important;
        order: 3 !important;
        width: 100% !important;
    }

    body.single-product .woocommerce-product-gallery__image:first-child {
        aspect-ratio: auto !important;
        height: min(82vw, 320px) !important;
        max-height: 320px !important;
        min-height: 220px !important;
        order: 1 !important;
    }

    body.single-product .woocommerce-product-gallery__image:first-child img {
        height: 100% !important;
        max-height: 320px !important;
        width: 100% !important;
    }

    body.single-product .hero-info-col {
        order: 2 !important;
        padding: clamp(1rem, 4vw, 1.5rem) !important;
        width: 100% !important;
    }
}

@media (hover: none) {
    .pj135-product-media > .pj135-product-media__image--secondary {
        opacity: 0 !important;
    }

    :is(li.product, .wc-block-grid__product, .wp-block-post):focus-within
        .pj135-product-media--ready > .pj135-product-media__image--secondary {
        opacity: 1 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pj135-product-media > .pj135-product-media__image--secondary {
        animation: none !important;
        transition: none !important;
    }
}