/* Copie retournée (droite à gauche) de assets/css/variations-v2.css — fabriquée par anaaz-langues, ne pas modifier */
/*
 * Boutons de variations de la fiche produit (inc/variations.php).
 * Rendu repris des réglages de l'ancienne extension : carrés 35 x 35,
 * bordure 1 px #a8a8a8, survol 3 px noir, choisi 2 px noir, info-bulle #333.
 */

/*
 * L'extension enveloppait le contenu du formulaire dans un bloc pleine largeur :
 * choix des variations, puis prix et bouton « Ajouter au panier » en dessous.
 */
form.variations_form.cart {
	flex-direction: column;
}

/* Nom de l'attribut au-dessus des boutons, suivi de la valeur choisie en gras. */
form.variations_form table.variations th,
form.variations_form table.variations td {
	display: block;
	text-align: start;
	width: auto !important;
}

form.variations_form table.variations th label,
form.variations_form table.variations th .anaaz-var__choix {
	display: inline-block;
	margin: 0 2px;
}

form.variations_form table.variations th .anaaz-var__choix {
	font-weight: 600;
}

.anaaz-var__liste {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	list-style: none;
	margin: 0;
	padding: 0;
}

.anaaz-var__liste .anaaz-var__item {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-width: 35px;
	height: 35px;
	margin: 4px;
	padding: 2px;
	list-style: none;
	border-radius: 2px;
	background-color: #fff;
	color: #000;
	font-size: 16px;
	cursor: pointer;
	outline: none;
	box-shadow: 0 0 0 1px #a8a8a8;
	transition: box-shadow .2s ease, opacity .2s ease;
	-webkit-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}

.anaaz-var__liste .anaaz-var__item:hover,
.anaaz-var__liste .anaaz-var__item:focus-visible {
	box-shadow: 0 0 0 3px #000;
}

.anaaz-var__liste .anaaz-var__item--choisi,
.anaaz-var__liste .anaaz-var__item--choisi:hover {
	box-shadow: 0 0 0 2px #000;
}

.anaaz-var__liste .anaaz-var__contenu {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.anaaz-var__liste .anaaz-var__texte {
	padding: 0 5px;
	white-space: nowrap;
}

/* Pastilles et photos : carré plein, nom gardé pour les lecteurs d'écran
 * et l'info-bulle. Dans une liste à photos, une valeur sans photo reste un
 * bouton texte. */
.anaaz-var__liste--pastilles .anaaz-var__item,
.anaaz-var__liste .anaaz-var__item--photo {
	width: 35px;
	background-color: transparent;
}

.anaaz-var__liste .anaaz-var__pastille,
.anaaz-var__liste .anaaz-var__photo {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
}

.anaaz-var__liste--pastilles .anaaz-var__texte,
.anaaz-var__liste .anaaz-var__item--photo .anaaz-var__texte {
	position: absolute;
	/* « !important » : style.css met « width:auto !important » sur ce texte. */
	width: 1px !important;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* Coche blanche sur la pastille ou la photo choisie. */
.anaaz-var__liste--pastilles .anaaz-var__item--choisi .anaaz-var__contenu::before,
.anaaz-var__liste .anaaz-var__item--photo.anaaz-var__item--choisi .anaaz-var__contenu::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("data:image/svg+xml;utf8,%3Csvg filter='drop-shadow(0px 0px 2px rgb(0 0 0 / .8))' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='M4 16L11 23 27 7'/%3E%3C/svg%3E") center / 60% no-repeat;
}

/* Combinaison qui n'existe pas : floutée et barrée, non cliquable. */
.anaaz-var__liste .anaaz-var__item--indispo {
	opacity: .4;
	cursor: not-allowed;
	box-shadow: 0 0 0 1px #a8a8a8;
}

.anaaz-var__liste .anaaz-var__item--indispo .anaaz-var__contenu::after {
	content: "";
	position: absolute;
	inset: 0;
	background: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' preserveAspectRatio='none'%3E%3Cpath fill='none' stroke='%230c0000' stroke-linecap='round' stroke-width='0.6' d='M0 0L24 24M24 0L0 24'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}

/* Info-bulle au survol (pas sur les écrans tactiles). */
@media (hover: hover) {
	.anaaz-var__liste [data-anaaz-bulle]::before,
	.anaaz-var__liste [data-anaaz-bulle]::after {
		position: absolute;
		right: 50%;
		z-index: 999;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateX(50%);
		transition: opacity .5s ease-in-out;
	}

	.anaaz-var__liste [data-anaaz-bulle]::before {
		content: attr(data-anaaz-bulle);
		bottom: calc(100% + 10px);
		height: 30px;
		padding: 0 10px;
		border-radius: 3px;
		background-color: #333;
		box-shadow: 0 0 5px 1px rgba(0, 0, 0, .3);
		color: #fff;
		font-size: 14px;
		line-height: 30px;
		white-space: nowrap;
	}

	.anaaz-var__liste [data-anaaz-bulle]::after {
		content: "";
		bottom: 100%;
		border: 5px solid transparent;
		border-top-color: #333;
	}

	.anaaz-var__liste [data-anaaz-bulle]:hover::before,
	.anaaz-var__liste [data-anaaz-bulle]:hover::after {
		opacity: 1;
		visibility: visible;
	}
}

/*
 * Bouton « M'avertir en premier » de Back in Stock Notifier : texte blanc
 * (noir sur fond foncé avant, illisible). Le « !important » est nécessaire :
 * style.css (l. 3404, « Forcer le texte en noir ») met en noir tout le
 * contenu du panneau avec « !important » ; la spécificité plus forte de ce
 * sélecteur le fait passer devant.
 */
body.single-product .cwginstock-subscribe-form .cwginstock-subscribe-form__form button.cwgstock_button,
body.single-product .cwginstock-subscribe-form .cwginstock-subscribe-form__form button.cwgstock_button:hover,
body.single-product .cwginstock-subscribe-form .cwginstock-subscribe-form__form button.cwgstock_button:focus {
	color: #fff !important;
}

/* retouches 6.305 */
.woocommerce-breadcrumb a:after{transform:scaleX(-1)}
/* retouches 6.307 */
html[dir=rtl]{overflow-x:hidden}@supports (overflow:clip){html[dir=rtl],html[dir=rtl] body{overflow-x:clip}}
/* retouches 6.311 */
.anaaz-choix,.anaaz-ar-erreur,.toaster,body #colorbox,.anaaz-var__liste [data-anaaz-bulle]::before,.anaaz-var__liste [data-anaaz-bulle]::after{left:50%!important;right:auto!important}
.anaaz-panneau{left:auto!important;right:16px!important}@media (max-width:767px){.anaaz-panneau{left:0!important;right:0!important}}
/* retouches 6.319 */
.slick-slider{direction:ltr}.slick-slider .slick-slide{float:left!important;direction:rtl}
/* retouches 6.333 : cœur des favoris de la fiche à la FIN du titre (côté gauche), place réservée à gauche, jamais sur le texte */
html[dir=rtl] .single-product .summary .variant-holder>.product_title{padding-right:0!important;padding-left:52px!important}html[dir=rtl] .anaaz-favori{right:auto!important;left:0!important;align-items:flex-start!important}html[dir=rtl] .anaaz-favori__message{right:auto!important;left:0!important}@media (max-width:768px){html[dir=rtl] .single-product .summary .variant-holder>.product_title{padding-right:0!important;padding-left:56px!important}}
/* retouches 6.335 : numéros de téléphone et adresses e-mail toujours écrits de gauche à droite (« +33… » et non « 33…+ »), alignés à droite */
html[dir=rtl] input[type=tel],html[dir=rtl] input[type=email],html[dir=rtl] input#phone,html[dir=rtl] input[name*=phone],html[dir=rtl] input[name*=email],html[dir=rtl] input#user_email{direction:ltr;text-align:right}
/* retouches 6.337 : tiroir du menu (extension Drawer Sliding, réglé « à gauche ») ouvert à DROITE, côté du bouton ; flèches des onglets dans le sens de lecture */
html[dir=rtl] .cs_drawer-left{left:auto!important;right:0!important;border-right:none!important;border-left:1px solid #dfdfdf}html[dir=rtl] .cs_drawer-left .cs_drawer-controls{left:auto!important;right:100%!important}html[dir=rtl] .cs_drawer-left.fold{margin-left:0!important;margin-right:-100%}html[dir=rtl] .cs_drawer-left.folding{transition-property:margin-right}@media (min-width:768px){html[dir=rtl] .cs_drawer-left.fold.dw-sm-6{margin-right:-50%}}@media (min-width:992px){html[dir=rtl] .cs_drawer-left.fold.dw-md-4{margin-right:-33.33333333%}}html[dir=rtl] .cs_drawer-left.fold.open{margin-left:0!important;margin-right:0!important}
html[dir=rtl] .ds-menu-wrap .scroll-arrow.right{transform:rotate(180deg)}html[dir=rtl] .ds-menu-wrap .scroll-arrow.left{transform:none}