/*
 * Eventify product-image alignment hotfix
 *
 * This file deliberately does NOT give products fixed pixel dimensions.
 * Each card keeps its existing responsive size; this only makes the image
 * stage center its content on every viewport and browser engine.
 */

.ev-product-img {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.ev-product-img > :is(img, picture, a) {
    grid-area: 1 / 1 !important;
    justify-self: center !important;
    align-self: center !important;
    max-width: 100% !important;
    max-height: 100% !important;
}

.ev-product-img > :is(picture, a) {
    display: grid !important;
    place-items: center !important;
}

.ev-product-img > img,
.ev-product-img > picture > img,
.ev-product-img > a > img {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: auto !important;
    object-fit: contain !important;
    object-position: 50% 50% !important;
    transform: none !important;
}