.e-con-inner.mon-repeater-item {
	display: flex;
	flex-direction: column;
}

@media ( min-width: 768px ) {
	.e-con-inner.mon-repeater-item {
		flex-direction: row;
	}
}

/*
 * Classe utilitaire réutilisable (à ajouter via "Avancé > Classes CSS" dans
 * Elementor sur n'importe quel élément) : remplace l'ancien ciblage par ID
 * auto-généré Elementor (.elementor-element-XXXXXXX), fragile car il change
 * si l'élément est dupliqué/recréé.
 */
.mon-repeater-no-padding {
	padding: 0;
}

.mon-repeater-item .mon-repeater-col-text,
.mon-repeater-item .mon-repeater-col-image {
  width: 50%;
}

/* Padding personnalisé de la colonne texte (champ admin "Padding du texte"),
   piloté via variable CSS posée en inline sur .mon-repeater-col-text. */
.mon-repeater-item .mon-repeater-col-text {
	padding: var( --mon-repeater-texte-padding, 0 );
}

.mon-repeater-item .elementor-image {
	display: flex;
	justify-content: center;
}

.elementor img.mon-repeater-image-bordered {
	border-style: solid;
	border-width: 10px 10px 10px 10px;
	border-color: var(--e-global-color-472f472e);
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.5);
}

/* Plusieurs images empilées dans un même bloc : espace entre chacune. */
.mon-repeater-item .elementor-widget-image + .elementor-widget-image {
	margin-top: 16px;
}

/* Mode "image en fond (cover)" de la colonne droite. */
.mon-repeater-col-image.mon-repeater-bg-column {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	min-height: 300px;
}

@media ( max-width: 767px ) {
	/* Fond cover : hauteur fixe sur mobile. min-height doit aussi être écrasé,
	   sinon le min-height:300px du desktop reste prioritaire sur height:250px. */
	.mon-repeater-bg-column {
		height: 250px;
		min-height: 250px;
	}

	/* Colonnes non inversées : l'image passe avant le texte à l'empilement. */
	.mon-repeater-item:not( .mon-repeater-inverted ) .mon-repeater-col-image {
		order: -1;
	}

	/* Padding uniforme des deux colonnes, remplace tout padding custom ou vide hérité d'Elementor. */
	.mon-repeater-item .mon-repeater-col-text,
	.mon-repeater-item .mon-repeater-col-image {
	  width: 100%;
		padding: 20px;
	}

	/* .mon-repeater-no-padding ne s'applique qu'au desktop : sur mobile, on retombe sur le padding standard. */
	.mon-repeater-no-padding {
		padding: 20px;
	}
}