/*
 * Product detail surface layer.
 *
 * Loaded after each product family stylesheet. It keeps legacy page structure
 * intact while removing stacked card shadows that make long detail pages feel
 * heavy. Product media and content blocks use light borders instead of floating
 * panels; buttons, floating navigation and image zoom overlays keep their own
 * interaction styling.
 */

body.product-detail-v2 .atf_portfolio__details-area,
body.product-detail-v2 .atf_portfolio__details-area.atf-section-padding.bg-f6 {
    background: var(--v2-bg-primary) !important;
    background-color: var(--v2-bg-primary) !important;
}

body.product-detail-v2 .atf_portfolio__details-area .container {
    background: var(--v2-bg-primary);
    border: 0;
    box-shadow: none !important;
    padding-top: 0;
    padding-bottom: 0;
}

body.product-detail-v2 .product-section {
    background: var(--v2-bg-primary);
    border: 0;
    border-bottom: 1px solid rgba(var(--v2-primary-500-rgb), 0.1);
    border-radius: 0;
    box-shadow: none !important;
    margin-bottom: 0;
    padding: clamp(48px, 6vw, 72px) 0;
    scroll-margin-top: var(--detail-scroll-offset);
}

body.product-detail-v2 .product-section:first-of-type {
    padding-top: clamp(32px, 4vw, 48px);
}

body.product-detail-v2 .product-section:last-of-type {
    border-bottom: 0;
}

body.product-detail-v2 :where(
    .main-product-image img,
    .main-product-image picture,
    .product-showcase img,
    .product-showcase picture,
    .feature-showcase img,
    .feature-showcase picture,
    .info-card img,
    .info-card picture,
    .dimensions-gallery img,
    .dimensions-gallery picture,
    .package-images img,
    .package-images picture,
    .spectrum-image img,
    .spectrum-image picture,
    .channel-item img,
    .channel-item picture,
    .image-wrapper img,
    .image-wrapper picture,
    .tech-feature > img,
    .tech-feature > picture
) {
    border: 1px solid rgba(var(--v2-primary-500-rgb), 0.1);
    box-shadow: none !important;
}

body.product-detail-v2 :where(
    .description-card,
    .feature-card,
    .feature-item,
    .info-card,
    .feature-showcase,
    .performance-card,
    .comparison-item,
    .application-card,
    .function-description,
    .feature-list,
    .package-list,
    .package-list li,
    .specs-card,
    .spec-item,
    .range-item,
    .spectrum-content,
    .filter-features-accordion .accordion-item,
    .gallery-item,
    .channel-samples,
    .install-type,
    .warranty-card,
    .card-item,
    .param-item,
    .option-card,
    .detail-item
) {
    border: 1px solid rgba(var(--v2-primary-500-rgb), 0.1);
    box-shadow: none !important;
}

body.product-detail-v2 :where(
    .description-card,
    .feature-card,
    .feature-item,
    .info-card,
    .performance-card,
    .comparison-item,
    .application-card,
    .function-description,
    .feature-list,
    .package-list,
    .specs-card,
    .spec-item,
    .range-item,
    .filter-features-accordion .accordion-item,
    .gallery-item,
    .channel-samples,
    .install-type,
    .warranty-card,
    .card-item,
    .param-item,
    .option-card,
    .detail-item
) {
    background: var(--v2-bg-primary);
}

body.product-detail-v2 :where(
    .feature-showcase,
    .spectrum-content,
    .package-list,
    .channel-samples,
    .function-description
) {
    background: var(--v2-bg-primary);
}

body.product-detail-v2 :where(
    .feature-card,
    .feature-item,
    .package-list li,
    .range-item,
    .gallery-item,
    .warranty-card,
    .card-item
):hover {
    border-color: rgba(var(--v2-primary-500-rgb), 0.24);
    box-shadow: none !important;
    transform: translateY(-2px);
}

body.product-detail-v2 :where(
    .main-product-image img,
    .main-product-image picture,
    .product-showcase img,
    .product-showcase picture,
    .image-popup img,
    .image-popup picture,
    .ae-image-zoom img,
    .ae-image-zoom picture
):hover {
    box-shadow: none !important;
}

body.product-detail-v2 :where(
    .D60_detail_2_box_ul > li,
    .D60_detail_3_box,
    .D60_detail_4_list li,
    .D60_detail_8_box,
    .D60_detail_9_list li,
    .before-after-container
) {
    box-shadow: none !important;
}

@media (max-width: 768px) {
    body.product-detail-v2 .product-section {
        padding: 44px 0;
    }

    body.product-detail-v2 .atf_portfolio__details-area .container {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 480px) {
    body.product-detail-v2 .product-section {
        padding: 36px 0;
    }
}

@media (max-width: 767px) {
    /* Keep the mobile rhythm on an 8px scale without changing section content. */
    body.product-detail-v2 .atf_portfolio__details-area:has(.product-section) {
        padding-top: 24px !important;
        padding-bottom: 32px !important;
    }

    body.product-detail-v2 .atf_portfolio__details-area:has(.product-section) > .container {
        margin-top: 0;
        margin-bottom: 0;
    }

    body.product-detail-v2 .product-section,
    body.product-detail-v2 .product-section:first-of-type {
        padding-top: 24px;
        padding-bottom: 24px;
    }

    body.product-detail-v2 .product-section > :last-child {
        margin-bottom: 0;
    }
}
