/*
 * CV-047 - staging-only PDP recommendation presentation.
 * Scoped to the native related and upsell modules; recently viewed is excluded.
 */
body.single-product #related-products .products,
body.single-product #upsell-products .products {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    max-width: 100%;
    margin: 0;
    background: transparent;
}

body.single-product #related-products .products > .product,
body.single-product #upsell-products .products > .product {
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
    float: none !important;
    flex: none !important;
}

body.single-product #related-products .product-wrapper,
body.single-product #upsell-products .product-wrapper {
    height: 100%;
    overflow: visible;
    background: #11131c;
    border: 1px solid #303545;
}

body.single-product #related-products .thumbnail-wrapper,
body.single-product #upsell-products .thumbnail-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    overflow: visible;
    background: #f7f8fd;
}

body.single-product #related-products .thumbnail-wrapper img,
body.single-product #upsell-products .thumbnail-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

body.single-product #related-products .product-title,
body.single-product #related-products .product-title a,
body.single-product #upsell-products .product-title,
body.single-product #upsell-products .product-title a {
    color: #ececf1;
}

body.single-product #related-products .price,
body.single-product #related-products .price *,
body.single-product #upsell-products .price,
body.single-product #upsell-products .price * {
    color: #e9cd8a;
}

body.single-product #related-products .price del,
body.single-product #related-products .price del *,
body.single-product #upsell-products .price del,
body.single-product #upsell-products .price del * {
    color: #aeb1bd;
}

body.single-product #related-products .product-badges,
body.single-product #upsell-products .product-badges {
    color: #58cf94;
}

body.single-product #related-products .klb-title .entry-title,
body.single-product #upsell-products .klb-title .entry-title {
    color: #303545;
}

body.single-product .shop-content.single-gray .woocommerce-breadcrumb li a {
    color: #303545 !important;
}

body.single-product .shop-content.single-gray .woocommerce-breadcrumb li:last-child {
    color: #4f556a;
}

body.single-product #related-products a:focus-visible,
body.single-product #upsell-products a:focus-visible,
body.single-product .shop-content.single-gray .woocommerce-breadcrumb a:focus-visible {
    position: relative;
    z-index: 2;
    outline: 2px solid #7b244d;
    outline-offset: 3px;
}

@media (max-width: 768px) {
    body.single-product #related-products .products,
    body.single-product #upsell-products .products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
