/* Wrapper for the zoomable image */
.js-product-zoom-trigger {
    display: block;
    overflow: hidden; /* Vital for inner zoom */
    cursor: zoom-in;
    position: relative;
    border-radius: 8px; /* Optional: matches modern theme */
}

.js-product-zoom-trigger img {
    transition: transform 0.1s ease-out; /* Smooth follow, but fast enough */
    will-change: transform;
    display: block;
    width: 100%;
    height: auto;
}

/* Hide the old "zoom-in" icon on desktop if we have hover zoom, 
   but keep it for mobile where it indicates tap-to-expand */
@media (min-width: 992px) {
    .product__images__modal-opener {
        display: none !important;
    }
}