/**
 * Cartes produit Midi — uniformes sur tout le site.
 *
 * S'applique partout où Martfury rend une carte produit : accueil (carrousels
 * et sections catégorie), catalogue, produits liés, boutiques vendeurs.
 * La page catalogue a des règles plus spécifiques (midi-shop-page.css) au
 * même effet — la cohérence est garantie.
 */

/* Zone image : carré 1:1, image entière sans rognage, fond blanc */
.woocommerce .product .mf-product-thumbnail {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	margin-bottom: 10px;
	background: #fff;
	border-radius: 8px;
	overflow: hidden;
}

.woocommerce .product .mf-product-thumbnail > a {
	display: block;
	width: 100%;
	height: 100%;
}

.woocommerce .product .mf-product-thumbnail img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 8px;
	box-sizing: border-box;
}

/* Nom du produit : une seule ligne, coupé par des points de suspension.
   Le thème force le lien en inline-block (largeur = contenu) : max-width le
   ramène à la largeur de la carte pour que l'ellipsis se déclenche. */
.woocommerce .product .woo-loop-product__title {
	display: block;
	max-width: 100%;
	margin: 0 0 4px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.woocommerce .product .woo-loop-product__title a {
	display: block;
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

/* Mini-liste latérale « Recommandés pour vous » : titre sur une seule ligne.
   La carte est en flexbox ; la colonne texte a min-width:auto par défaut, ce
   qui empêche l'ellipsis (un titre long force la largeur au contenu). min-width:0
   autorise la colonne à rétrécir → l'ellipsis se déclenche. */
.products-side li.product {
	min-width: 0;
}

.products-side li.product .product-inners {
	min-width: 0;
	overflow: hidden;
}

.products-side li.product h2 {
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.products-side li.product h2 a {
	display: block;
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}