/* Final storefront parity layer. Loaded last on storefront. */

/* Product card photo rendering fix.
   Real cards use product-card-v2__photo*, not product-card__image.
   This layer is loaded last, so it wins over old mobile/catalog caps. */
:root[data-theme="dark"] .product-card-v2__photo,
:root[data-theme="dark"] .product-card-v2__photo-wrap,
:root[data-theme="dark"] .product .photo.product-card-v2__photo {
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, #f8fafc, #eef3fb) !important;
}

:root[data-theme="dark"] .product-card-v2__photo-link {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
}

:root[data-theme="dark"] .product-card-v2__photo img,
:root[data-theme="dark"] .product-card-v2__photo-wrap img,
:root[data-theme="dark"] .product-card-v2__photo-link img,
:root[data-theme="dark"] .products .product-card-v2__photo img,
:root[data-theme="dark"] .products-polished .product-card-v2__photo img,
:root[data-theme="dark"] .catalog-products .product-card-v2__photo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 108% !important;
    max-height: 108% !important;
    object-fit: contain !important;
    object-position: center center !important;
    margin: auto !important;
    transform: scale(1.08) !important;
    transform-origin: center center !important;
    filter: none !important;
}

/* Final lightbox cleanup: keep one CSS-drawn close button and no decorative icons over photos. */
.product-lightbox[aria-hidden="false"] .product-lightbox__close,
.product-lightbox.is-open .product-lightbox__close {
    top: max(104px, calc(96px + env(safe-area-inset-top))) !important;
    right: max(18px, calc(16px + env(safe-area-inset-right))) !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

.product-lightbox[aria-hidden="false"] .product-lightbox__close::before,
.product-lightbox.is-open .product-lightbox__close::before {
    content: "×" !important;
    display: grid !important;
    place-items: center !important;
    color: #fff !important;
    font-size: 30px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

.product-lightbox[aria-hidden="false"] .product-lightbox__close > *,
.product-lightbox.is-open .product-lightbox__close > *,
.product-lightbox[aria-hidden="false"] svg,
.product-lightbox.is-open svg,
.product-lightbox[aria-hidden="false"] path,
.product-lightbox.is-open path,
.product-lightbox[aria-hidden="false"] .product-lightbox__image-button img:not([data-lightbox-image]),
.product-lightbox.is-open .product-lightbox__image-button img:not([data-lightbox-image]),
.product-lightbox[aria-hidden="false"] .product-lightbox__image-button picture:not(:has([data-lightbox-image])),
.product-lightbox.is-open .product-lightbox__image-button picture:not(:has([data-lightbox-image])),
.product-lightbox[aria-hidden="false"] .product-lightbox__image-button > *:not([data-lightbox-image]):not(picture),
.product-lightbox.is-open .product-lightbox__image-button > *:not([data-lightbox-image]):not(picture) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.product-lightbox[aria-hidden="false"] [data-lightbox-image],
.product-lightbox.is-open [data-lightbox-image] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 767px) {
    :root[data-theme="dark"] .home-hero-grid .hero-slider,
    :root[data-theme="dark"] .home-hero-grid--mockup .hero-slider {
        background: #f3f4f7 !important;
    }

    :root[data-theme="dark"] .home-hero-grid .hero-slide,
    :root[data-theme="dark"] .home-hero-grid--mockup .hero-slide,
    :root[data-theme="dark"] .home-hero-grid .hero-slide__media,
    :root[data-theme="dark"] .home-hero-grid--mockup .hero-slide__media,
    :root[data-theme="dark"] .home-hero-grid .hero-slide__media picture,
    :root[data-theme="dark"] .home-hero-grid--mockup .hero-slide__media picture {
        background: #f3f4f7 !important;
    }

    :root[data-theme="dark"] .home-hero-grid .hero-slide__media img,
    :root[data-theme="dark"] .home-hero-grid--mockup .hero-slide__media img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        object-position: center center !important;
        background: #f3f4f7 !important;
        filter: none !important;
        transform: none !important;
    }

    .home-quick-links--rail a::after,
    .home-quick-links--rail a svg,
    .home-quick-links--rail a img[aria-hidden="true"] {
        content: none !important;
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }

    :root[data-theme="dark"] .product-card-v2__photo img,
    :root[data-theme="dark"] .product-card-v2__photo-wrap img,
    :root[data-theme="dark"] .product-card-v2__photo-link img,
    :root[data-theme="dark"] .products .product-card-v2__photo img,
    :root[data-theme="dark"] .products-polished .product-card-v2__photo img,
    :root[data-theme="dark"] .catalog-products .product-card-v2__photo img {
        max-width: 112% !important;
        max-height: 112% !important;
        transform: scale(1.12) !important;
    }

    .product-lightbox[aria-hidden="false"] .product-lightbox__close,
    .product-lightbox.is-open .product-lightbox__close {
        top: max(82px, calc(74px + env(safe-area-inset-top))) !important;
        right: max(14px, calc(12px + env(safe-area-inset-right))) !important;
    }
}