.custom-variation-swatches {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 20px;
}

.swatch-group {
    display: grid;
	grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.swatch-title {
	grid-column: 1 / -1; /* Le titre prend toute la largeur */
    width: 100%;
    font-size: 16px;
    margin-bottom: 8px;
    font-weight: bold;
}

.swatch-option {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    padding: 6px;
    cursor: pointer;
    border: #C6CFD7 solid 1px;
    border-radius: 75px 0 0 75px;
    transition: all 0.2s ease;
}

/* Image à gauche */
.swatch-option img {
    width: 75px;
    border-radius: 75px !important;
    aspect-ratio: 1 / 1;
    max-width: 100%;
}

/* Container texte + prix à droite */
.swatch-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1; /* prend tout l’espace à droite */
}

/* Texte (réf) pleine largeur */
.swatch-text {
	
}

/* Prix pleine largeur en dessous */
.swatch-price {	
	text-align: right;
}


.swatch-option img {
	width: 75px; 
	border-radius: 75px !important;
	aspect-ratio: 1/1;
    max-width: 100%;
}

.swatch-option input[type="radio"] {
    /*display: none;*/
}

.swatch-option.selected {
	box-shadow: 0px 3px 3px 0px #8B9197;
}

@media (max-width: 767px) {
	.swatch-group {
		grid-template-columns: repeat(1, 1fr);
	}
	.swatch-option img{
		width: 50px; 
		border-radius: 50px !important;
	}
}