/**
 * Ferboutik - Uniformizar Imagens de Produtos
 * 
 * Aplica aspect-ratio + object-fit:cover para que todas as imagens
 * de produtos tenham a mesma proporção (2:3) sem distorção.
 * A imagem é recortada centralizada no topo (ideal para fotos de moda).
 */

/* Container da imagem principal */
.product-item .product-img-wrap a.product-img .main-img {
  aspect-ratio: 2 / 3 !important;
  overflow: hidden !important;
}

/* Picture element dentro de main-img */
.product-item .product-img-wrap a.product-img .main-img picture {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

/* Imagem principal do produto */
.product-item .product-img-wrap a.product-img .main-img img,
.product-item .main-img img.attachment-woocommerce_thumbnail,
.product-item .main-img img.size-woocommerce_thumbnail {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  aspect-ratio: 2 / 3 !important;
}

/* Imagem secundária (hover) */
.product-item .product-img-wrap a.product-img .back-img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.product-item .product-img-wrap a.product-img .back-img picture {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.product-item .product-img-wrap a.product-img .back-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

/* Suporte para o carrossel de imagens do Elessi (slick slider) */
.product-item .product-img-wrap .main-img.nasa-slick-slider {
  aspect-ratio: 2 / 3 !important;
  overflow: hidden !important;
}

.product-item .product-img-wrap .main-img.nasa-slick-slider .slick-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}