/*
 * Structural fallback for the catalogue components rendered on product pages.
 * The Nehezgepalkatresz theme supplies the visual skin; these rules only keep
 * the plugin output usable with another WooCommerce theme.
 */
body:not(.ngp-storefront).single-product .ngp-technical-panel,
body:not(.ngp-storefront).single-product .ngp-fitment-panel,
body:not(.ngp-storefront).single-product .woocommerce-tabs,
body:not(.ngp-storefront).single-product .up-sells,
body:not(.ngp-storefront).single-product .related {
    clear: both;
    width: 100%;
    margin-block: 1.25rem 0;
}

body:not(.ngp-storefront).single-product .ngp-technical-grid,
body:not(.ngp-storefront).single-product .ngp-fitment-groups {
    min-width: 0;
}

body:not(.ngp-storefront).single-product .up-sells ul.products,
body:not(.ngp-storefront).single-product .related ul.products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 260px));
    justify-content: start;
    align-items: stretch;
    gap: 1.25rem;
}

body:not(.ngp-storefront).single-product .up-sells ul.products::before,
body:not(.ngp-storefront).single-product .up-sells ul.products::after,
body:not(.ngp-storefront).single-product .related ul.products::before,
body:not(.ngp-storefront).single-product .related ul.products::after {
    content: none;
}

body:not(.ngp-storefront).single-product .up-sells ul.products li.product,
body:not(.ngp-storefront).single-product .related ul.products li.product {
    float: none;
    clear: none;
    width: auto;
    max-width: 260px;
    margin: 0;
}

body:not(.ngp-storefront).single-product .ngp-purchase-fitment {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: .75rem;
    margin: 1rem 0;
    padding: .9rem;
    border: 1px solid #cfe5d8;
    border-radius: .4rem;
    background: #f0f8f3;
}

body:not(.ngp-storefront).single-product .ngp-purchase-fitment__icon {
    width: 2.1rem;
    height: 2.1rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #1c8b58;
    color: #fff;
    font-weight: 800;
}

body:not(.ngp-storefront).single-product .ngp-purchase-fitment > div {
    display: grid;
    gap: .2rem;
}

body:not(.ngp-storefront).single-product .ngp-purchase-fitment p {
    margin: 0;
}

body:not(.ngp-storefront).single-product .ngp-purchase-fitment.is-serial-needed,
body:not(.ngp-storefront).single-product .ngp-purchase-fitment.is-unknown {
    border-color: #ead4a0;
    background: #fff9e9;
}

body:not(.ngp-storefront).single-product .ngp-purchase-fitment.is-mismatch {
    border-color: #e7c2bd;
    background: #fff3f1;
}

@media (max-width: 640px) {
    body:not(.ngp-storefront).single-product .up-sells,
    body:not(.ngp-storefront).single-product .related {
        overflow: hidden;
    }

    body:not(.ngp-storefront).single-product .up-sells ul.products,
    body:not(.ngp-storefront).single-product .related ul.products {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;
        gap: .75rem;
        padding-block-end: .65rem;
        scrollbar-width: thin;
    }

    body:not(.ngp-storefront).single-product .up-sells ul.products li.product,
    body:not(.ngp-storefront).single-product .related ul.products li.product {
        flex: 0 0 min(76vw, 250px);
        max-width: min(76vw, 250px);
        scroll-snap-align: start;
    }
}