/* =========================================================================
 * Efena Color Gallery — CSS module CATALOGUE
 * -------------------------------------------------------------------------
 * Plus de bande de vignettes : le swap d'image se fait au survol/clic des
 * pastilles couleur déjà présentes sous la carte. Ce fichier ne sert plus
 * qu'à : (1) masquer le lien « Effacer » sur le catalogue, (2) un fondu
 * propre sur l'image, (3) verrouiller la taille de la zone image pour
 * empêcher le « zigzag ».
 * ========================================================================= */

/* 0) Masquer le lien « Effacer » (a.reset_variations) UNIQUEMENT sur les
 * cartes du catalogue. GOYA l'imprime via loop-variations.php. On NE
 * touche PAS au « Clear » de la fiche produit (formulaire .variations_form,
 * sans le suffixe _loop) où il reste utile. */
.variations_form_loop .reset_variations {
    display: none !important;
}

/* 1) Fondu doux lors du changement d'image principale. */
.product_thumbnail img.main-image {
    transition: opacity .16s ease;
}

/* 2) Verrou de mise en page (anti « zigzag »).
 * Les images des différentes couleurs n'ont pas forcément le même ratio
 * (carré, portrait...). Si la hauteur de la carte change au survol, le
 * curseur sort de la pastille → l'image revient → la carte change de
 * taille → boucle infinie. On fige donc la zone image en carré
 * (aspect-ratio 1/1 + object-fit:cover) UNIQUEMENT sur les cartes qui ont
 * la fonctionnalité (classe .efena-cg-card ajoutée par archive.js). */
.efena-cg-card figure.product_thumbnail > a {
    display: block;
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.efena-cg-card figure.product_thumbnail > a img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}