/**
 * WooCommerce Product Images Fix
 * Uniforma le dimensioni delle immagini prodotto
 */

/* ========================================
   PRODOTTI CORRELATI / UPSELL / CROSS-SELL
   ======================================== */

/* Container immagine prodotto correlato */
.related.products .product .woocommerce-loop-product__link img,
.upsells.products .product .woocommerce-loop-product__link img,
.cross-sells .product .woocommerce-loop-product__link img,
.products .product .woocommerce-loop-product__link img {
    width: 100%;
    height: 300px; /* Altezza fissa - modifica questo valore secondo necessità */
    object-fit: cover; /* Taglia l'immagine mantenendo proporzioni */
    object-position: center;
}

/* Alternativa: usa contain invece di cover per mostrare l'intera immagine con spazio bianco */
/*
.related.products .product .woocommerce-loop-product__link img,
.upsells.products .product .woocommerce-loop-product__link img,
.cross-sells .product .woocommerce-loop-product__link img,
.products .product .woocommerce-loop-product__link img {
    width: 100%;
    height: 300px;
    object-fit: contain;
    object-position: center;
    background: #f8f8f8;
}
*/

/* ========================================
   ELEMENTOR PRODUCT GRID/CAROUSEL
   ======================================== */

/* Elementor Products Widget */
.elementor-widget-woocommerce-products .product img,
.elementor-widget-products .product img,
.elementor-element .woocommerce .product img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    object-position: center;
}

/* Elementor Product Archive */
.elementor-widget-archive-products .product img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    object-position: center;
}

/* ========================================
   LOOP PRODOTTI GENERALE
   ======================================== */

/* Loop prodotti WooCommerce generale */
.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    object-position: center;
}

/* ========================================
   IMMAGINE PRODOTTO SINGOLO (galleria)
   ======================================== */

/* Immagine principale prodotto singolo - mantieni proporzioni originali */
.woocommerce div.product div.images img.wp-post-image {
    width: 100%;
    height: auto;
    object-fit: contain;
}

/* Thumbnails galleria */
.woocommerce div.product div.images .flex-control-thumbs img {
    width: 100%;
    height: 80px;
    object-fit: cover;
    object-position: center;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media screen and (max-width: 768px) {
    /* Su mobile riduci l'altezza */
    .related.products .product .woocommerce-loop-product__link img,
    .upsells.products .product .woocommerce-loop-product__link img,
    .cross-sells .product .woocommerce-loop-product__link img,
    .products .product .woocommerce-loop-product__link img,
    .elementor-widget-woocommerce-products .product img,
    .elementor-widget-products .product img,
    .woocommerce ul.products li.product img,
    .woocommerce-page ul.products li.product img {
        height: 250px;
    }
}

@media screen and (max-width: 480px) {
    /* Su mobile piccolo riduci ulteriormente */
    .related.products .product .woocommerce-loop-product__link img,
    .upsells.products .product .woocommerce-loop-product__link img,
    .cross-sells .product .woocommerce-loop-product__link img,
    .products .product .woocommerce-loop-product__link img,
    .elementor-widget-woocommerce-products .product img,
    .elementor-widget-products .product img,
    .woocommerce ul.products li.product img,
    .woocommerce-page ul.products li.product img {
        height: 200px;
    }
}

/* ========================================
   FIX COMUNI
   ======================================== */

/* Assicura che il container immagine non si deformi */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
    display: block;
}

/* Rimuovi eventuali padding/margin che possono creare problemi */
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce-page ul.products li.product .woocommerce-loop-product__link {
    display: block;
    overflow: hidden;
}

/* ========================================
   OPZIONE AVANZATA: ASPECT RATIO
   (Supporto browser moderno)
   ======================================== */

/* Usa aspect-ratio invece di height fissa per maggiore flessibilità */
/*
.woocommerce ul.products li.product img {
    width: 100%;
    height: auto;
    aspect-ratio: 3/4;
    object-fit: cover;
}
*/
