/* Victor Scientific — low-cost product image interactions.
   Desktop hover zoom is intentionally scoped to the main product image only. */

@keyframes vsc-product-image-enter {
    from { opacity: .94; transform: scale(.992); }
    to   { opacity: 1; transform: scale(1); }
}

body.product-refresh-page .product-gallery-column .dimage_item {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

/* Keep the image immediately in its final layout; only its pixels receive a
   short compositor-friendly entrance. No page-wide fade or layout animation. */
body.product-refresh-page .product-gallery-column .dimage_item img.block__pic {
    display: block;
    transform: scale(1);
    transform-origin: var(--vsc-zoom-x, 50%) var(--vsc-zoom-y, 50%);
    transition: transform 125ms cubic-bezier(.2, .72, .25, 1);
    cursor: zoom-in;
    will-change: auto;
}

body.product-refresh-page .product-gallery-column .vsc-product-gallery > .dimage_item:first-child img.block__pic {
    animation: vsc-product-image-enter 130ms cubic-bezier(.2, .72, .25, 1) both;
}

/* The pointer events are mouse-only in JavaScript. A width-only media query is
   deliberate: some desktop/touch laptops report a coarse primary pointer even
   while a real mouse is connected. !important protects the scale from older
   product-page transform resets. */
@media (min-width: 768px) {
    body.product-refresh-page .product-gallery-column .dimage_item.vsc-magnifier-active > img.block__pic {
        transform: scale(2.6) !important;
        transform-origin: var(--vsc-zoom-x, 50%) var(--vsc-zoom-y, 50%) !important;
        will-change: transform;
        cursor: zoom-in;
    }
}

/* Touch devices use tap-to-open full image viewer; no hover magnification. */
@media (max-width: 767.98px) {
    body.product-refresh-page .product-gallery-column .dimage_item img.block__pic {
        transform: none !important;
        transition: none !important;
        will-change: auto;
        cursor: zoom-in;
    }
}

/* Reduced-motion preference removes interpolation, not the requested direct
   desktop magnification. The scale appears immediately while the pointer rests. */
@media (prefers-reduced-motion: reduce) {
    body.product-refresh-page .product-gallery-column .dimage_item img.block__pic,
    body.product-refresh-page .product-gallery-column .vsc-product-gallery > .dimage_item:first-child img.block__pic {
        animation: none !important;
        transition: none !important;
    }
}
@media (min-width: 768px) and (prefers-reduced-motion: reduce) {
    body.product-refresh-page .product-gallery-column .dimage_item.vsc-magnifier-active > img.block__pic {
        transform: scale(2.6) !important;
    }
}
