/* =========================================================
   DZ PRODUCT THUMBNAIL CLEAN V4.7
   Remove countdown timer overlay from product images.
   Keep images clean + rounded on desktop and mobile.
   ========================================================= */

/* Remove ONLY the timer/countdown from product image areas. */
.product__top .product__countdown,
.store-product__top .product__countdown,
.product__thumbnail .product__countdown,
.store-product__thumbnail .product__countdown,
.similar-product-image-wrap .product__countdown {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/*
 * Clean image stage.
 * Keep wishlist/compare buttons, sold-out state and discount badge functional.
 */
.product__top,
.store-product__top,
.product__thumbnail,
.store-product__thumbnail,
.similar-product-image-wrap,
.similar-product-thumbnail {
    border-radius: 12px !important;
}

/* Clip the image itself to the rounded thumbnail corners. */
.product__thumbnail,
.store-product__thumbnail,
.similar-product-thumbnail {
    overflow: hidden !important;
    background: #fff;
}

.product__thumbnail img,
.store-product__thumbnail img,
.similar-product-thumbnail img,
.similar-product-image {
    border-radius: 12px !important;
}

/* Homepage/listing cards: keep image fully visible and uncluttered. */
.product__top > .product__thumbnail,
.store-product__top > .store-product__thumbnail {
    width: 100%;
    height: 100%;
}

/* Product-detail thumbnail gallery: clean rounded thumbnails too. */
.pd-img-wrap .quickviewSliderThumb2 .swiper-slide,
.pd-img-wrap .quickviewSliderThumb2 .swiper-slide img {
    border-radius: 10px !important;
}

.pd-img-wrap .quickviewSliderThumb2 .swiper-slide {
    overflow: hidden !important;
}

/* Mobile: same clean rounded presentation, no counter/timer. */
@media (max-width: 767.98px) {
    .product__top,
    .store-product__top,
    .product__thumbnail,
    .store-product__thumbnail,
    .similar-product-image-wrap,
    .similar-product-thumbnail,
    .product__thumbnail img,
    .store-product__thumbnail img,
    .similar-product-thumbnail img,
    .similar-product-image {
        border-radius: 12px !important;
    }

    /*
     * Preserve the user's existing enlarged mobile image/card dimensions.
     * No width, height, --size, --minWidth or --maxWidth is changed here.
     */
}

/* Dark mode: keep product image canvas neutral. */
[theme="dark"] .product__thumbnail,
[theme="dark"] .store-product__thumbnail,
[theme="dark"] .similar-product-thumbnail {
    background: #fff;
}