/* FDC — Livraison offerte
   Les couleurs arrivent par variables CSS inline, définies côté PHP. */

.fdc-fso {
	--fdc-fso-bg: #fff7ed;
	--fdc-fso-border: #ea9a4e;
	--fdc-fso-text: #9a3412;
	--fdc-fso-bar: #b45309;

	box-sizing: border-box;
	margin: 0 0 16px;
	padding: 12px 14px;
	border: 1px solid var(--fdc-fso-border);
	border-radius: 8px;
	background: var(--fdc-fso-bg);
	color: var(--fdc-fso-text);
	font-size: 14px;
	line-height: 1.45;
}

.fdc-fso *,
.fdc-fso *::before,
.fdc-fso *::after {
	box-sizing: inherit;
}

.fdc-fso--is-empty {
	display: none;
}

.fdc-fso__msg {
	display: flex;
	align-items: flex-start;
	gap: 9px;
}

.fdc-fso__icon {
	flex: 0 0 auto;
	margin-top: 2px;
	color: var(--fdc-fso-bar);
}

.fdc-fso__text {
	flex: 1 1 auto;
}

.fdc-fso__text strong,
.fdc-fso__text b {
	font-weight: 700;
	color: inherit;
}

.fdc-fso__track {
	position: relative;
	height: 8px;
	margin-top: 10px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.14);
	overflow: hidden;
}

.fdc-fso__fill {
	display: block;
	height: 100%;
	min-width: 3px;
	border-radius: 999px;
	background: var(--fdc-fso-bar);
	transition: width 0.45s ease, background-color 0.3s ease;
}

/* --- Appel à l'action ------------------------------------------------- */

.fdc-fso__cta--link {
	display: inline-block;
	margin-top: 10px;
	color: inherit;
	font-weight: 600;
	text-decoration: underline;
}

.fdc-fso__cta--link:hover,
.fdc-fso__cta--link:focus {
	color: inherit;
	text-decoration: none;
}

.fdc-fso__cta--pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	padding: 7px 15px;
	border: 0;
	border-radius: 999px;
	background: var(--fdc-fso-cta-bg, #9a3412);
	color: var(--fdc-fso-cta-text, #ffffff);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
	transition: filter 0.2s ease, box-shadow 0.2s ease;
}

.fdc-fso__cta--pill:hover,
.fdc-fso__cta--pill:focus {
	color: var(--fdc-fso-cta-text, #ffffff);
	text-decoration: none;
	filter: brightness(1.12);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);
}

.fdc-fso__cta--pill:focus-visible {
	outline: 2px solid var(--fdc-fso-cta-bg, #9a3412);
	outline-offset: 2px;
}

.fdc-fso__cta-icon {
	flex: 0 0 auto;
	transition: transform 0.2s ease;
}

.fdc-fso__cta--pill:hover .fdc-fso__cta-icon,
.fdc-fso__cta--link:hover .fdc-fso__cta-icon {
	transform: translateX(3px);
}

@media (prefers-reduced-motion: reduce) {
	.fdc-fso__cta-icon,
	.fdc-fso__cta--pill {
		transition: none;
	}

	.fdc-fso__cta--pill:hover .fdc-fso__cta-icon {
		transform: none;
	}
}

/* Ligne dans le tableau « Total panier » : la cellule ne doit rien ajouter. */
.fdc-fso-row > td {
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

.fdc-fso-row .fdc-fso {
	margin: 4px 0 14px;
}

/* Checkout : le bandeau se cale sous le titre « Votre commande ». */
.fdc-fso--checkout {
	margin: 4px 0 18px;
}

/* Mini-panier : plus compact. */
.fdc-fso--mini_cart {
	margin: 0 0 12px;
	padding: 10px 12px;
	font-size: 13px;
}

.fdc-fso--mini_cart .fdc-fso__track {
	height: 6px;
	margin-top: 8px;
}

.fdc-fso--mini_cart .fdc-fso__cta--pill {
	margin-top: 10px;
	padding: 6px 13px;
	font-size: 12.5px;
}

/* Ligne de liste dans le mini-panier : ne doit hériter d'aucun style d'article. */
li.fdc-fso-li {
	list-style: none !important;
	margin: 0 !important;
	padding: 10px 0 0 !important;
	overflow: hidden;
	border: 0 !important;
	background: none !important;
	min-height: 0 !important;
}

li.fdc-fso-li::before,
li.fdc-fso-li::after {
	content: none !important;
}

li.fdc-fso-li .fdc-fso {
	margin: 0;
}

/* Bandeau masqué : la ligne ne doit pas laisser d'espace résiduel. */
li.fdc-fso-li:has(> .fdc-fso--is-empty) {
	padding: 0 !important;
}

/* --- Variante compacte (fiche produit, liste boutique) ----------------- */

.fdc-fso--compact {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	font-size: 14px;
}

.fdc-fso--compact .fdc-fso__track {
	max-width: 260px;
}

.fdc-fso--product {
	margin: 14px 0 4px;
}

.fdc-fso--shop {
	margin: 0 0 20px;
}

.fdc-fso--shop.fdc-fso--compact {
	padding: 10px 0;
	border-top: 1px solid var(--fdc-fso-border);
	border-bottom: 1px solid var(--fdc-fso-border);
}

/* Seuil atteint : légère mise en avant, une seule fois. */
.fdc-fso--reached {
	animation: fdc-fso-pop 0.5s ease-out 1;
}

@keyframes fdc-fso-pop {
	0%   { transform: scale(0.99); opacity: 0.6; }
	60%  { transform: scale(1.005); opacity: 1; }
	100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
	.fdc-fso--reached {
		animation: none;
	}

	.fdc-fso__fill {
		transition: none;
	}
}

@media (max-width: 600px) {
	.fdc-fso {
		font-size: 13px;
		padding: 11px 12px;
	}
}

/* ======================================================================
   Économies réalisées
   ====================================================================== */

.fdc-fso__savings {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-top: 10px;
	padding-top: 9px;
	border-top: 1px dashed currentColor;
	font-size: 13.5px;
}

.fdc-fso--compact .fdc-fso__savings {
	border-top: 0;
	padding-top: 0;
}

.fdc-fso__savings-icon {
	flex: 0 0 auto;
	margin-top: 2px;
	opacity: 0.85;
}

.fdc-fso__savings-detail {
	opacity: 0.8;
	font-size: 12.5px;
}

/* ======================================================================
   Frise des paliers d'avantages
   ====================================================================== */

.fdc-tiers {
	--fdc-fso-bg: #fff7ed;
	--fdc-fso-border: #ea9a4e;
	--fdc-fso-text: #9a3412;
	--fdc-fso-bar: #b45309;
	--fdc-fso-done: #047857;

	box-sizing: border-box;
	margin: 0 0 22px;
	padding: 18px 20px 14px;
	border: 1px solid var(--fdc-fso-border);
	border-radius: 10px;
	background: var(--fdc-fso-bg);
	color: var(--fdc-fso-text);
	font-size: 14px;
	line-height: 1.4;
}

.fdc-tiers *,
.fdc-tiers *::before,
.fdc-tiers *::after {
	box-sizing: inherit;
}

.fdc-tiers--is-empty {
	display: none;
}

.fdc-tiers__title {
	margin: 0 0 18px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	opacity: 0.85;
}

.fdc-tiers__rail {
	position: relative;
	padding: 0 0 4px;
}

/* Le rail couvre toute la largeur, comme les pastilles qui sont centrées dans
   leur colonne. Un rail en retrait donnerait au remplissage un repère
   différent de celui des pastilles, et la barre ne tomberait jamais en face
   du bon palier. */
.fdc-tiers__track {
	position: absolute;
	top: 7px;
	left: 0;
	right: 0;
	height: 4px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.14);
	overflow: hidden;
}

.fdc-tiers__fill {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: var(--fdc-fso-bar);
	transition: width 0.5s ease;
}

.fdc-tiers__steps {
	display: flex;
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fdc-tiers__step {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 0 4px;
	text-align: center;
	list-style: none;
}

.fdc-tiers__step::before,
.fdc-tiers__step::after {
	content: none;
}

.fdc-tiers__dot {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	margin-bottom: 8px;
	/* La pastille porte l'information « palier atteint ou non » : son contour
	   doit franchir le seuil de contraste de 3:1, que la bordure décorative du
	   bloc, plus claire, n'atteint pas. */
	border: 2px solid var(--fdc-fso-text);
	border-radius: 50%;
	background: #fff;
	color: #fff;
	line-height: 0;
}

.fdc-tiers__step.is-done .fdc-tiers__dot {
	border-color: var(--fdc-fso-done);
	background: var(--fdc-fso-done);
}

.fdc-tiers__step.is-next .fdc-tiers__dot {
	border-color: var(--fdc-fso-bar);
	box-shadow: 0 0 0 4px rgba(180, 83, 9, 0.22);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--fdc-fso-bar) 22%, transparent);
}

.fdc-tiers__amount {
	font-size: 13.5px;
	font-weight: 700;
	white-space: nowrap;
}

.fdc-tiers__label {
	font-size: 12px;
	opacity: 0.85;
}

.fdc-tiers__step.is-done .fdc-tiers__label {
	opacity: 1;
	font-weight: 600;
}

.fdc-tiers__status {
	margin: 14px 0 0;
	padding-top: 12px;
	border-top: 1px solid rgba(0, 0, 0, 0.09);
	border-top: 1px solid color-mix(in srgb, var(--fdc-fso-border) 55%, transparent);
	font-size: 14px;
}

/* Colonnes étroites et petits écrans : la frise passe en liste verticale. */
.fdc-tiers--stack .fdc-tiers__track,
.fdc-tiers--stack .fdc-tiers__steps::before {
	display: none;
}

.fdc-tiers--stack .fdc-tiers__steps,
.fdc-tiers--stack .fdc-tiers__step {
	flex-direction: column;
	align-items: stretch;
	text-align: left;
}

.fdc-tiers--stack .fdc-tiers__step {
	display: grid;
	grid-template-columns: 18px auto 1fr;
	align-items: center;
	gap: 0 10px;
	padding: 5px 0;
}

.fdc-tiers--stack .fdc-tiers__dot {
	margin-bottom: 0;
}

.fdc-tiers--stack .fdc-tiers__label {
	text-align: right;
}

@media (max-width: 640px) {
	.fdc-tiers__track {
		display: none;
	}

	.fdc-tiers__steps {
		flex-direction: column;
	}

	.fdc-tiers__step {
		display: grid;
		grid-template-columns: 18px auto 1fr;
		align-items: center;
		gap: 0 10px;
		padding: 5px 0;
		text-align: left;
	}

	.fdc-tiers__dot {
		margin-bottom: 0;
	}

	.fdc-tiers__label {
		text-align: right;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fdc-tiers__fill {
		transition: none;
	}
}

/* ======================================================================
   Date de livraison estimée
   ====================================================================== */

.fdc-delivery {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 0 0 14px;
	color: var(--fdc-fso-text, #9a3412);
	font-size: 14px;
	line-height: 1.45;
}

.fdc-delivery__icon {
	flex: 0 0 auto;
	margin-top: 2px;
	color: var(--fdc-fso-bar, #b45309);
}

/* Encadré discret : le même langage visuel que le bandeau, en plus sobre. */
.fdc-delivery--boxed {
	padding: 9px 12px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border: 1px solid color-mix(in srgb, var(--fdc-fso-border, #ea9a4e) 70%, transparent);
	border-radius: 7px;
	background: rgba(0, 0, 0, 0.015);
	background: color-mix(in srgb, var(--fdc-fso-bg, #fff7ed) 55%, transparent);
	font-size: 13.5px;
}

.fdc-delivery--boxed.fdc-delivery--cart,
.fdc-delivery--boxed.fdc-delivery--checkout {
	font-size: 13px;
}

.fdc-delivery-row > td,
.fdc-tiers-row > td,
.fdc-trust-row > td {
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

.fdc-delivery--checkout {
	margin: 0 0 16px;
}

/* ======================================================================
   Réassurance
   ====================================================================== */

.fdc-trust {
	display: grid;
	gap: 10px 18px;
	margin: 0 0 16px;
	padding: 14px 0 0;
	border-top: 1px solid rgba(0, 0, 0, 0.09);
	border-top: 1px solid color-mix(in srgb, var(--fdc-fso-border, #ea9a4e) 60%, transparent);
	list-style: none;
	color: inherit;
	font-size: 13.5px;
	line-height: 1.35;
}

.fdc-trust--grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fdc-trust--inline {
	grid-auto-flow: column;
	grid-auto-columns: max-content;
	justify-content: start;
}

.fdc-trust__item {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fdc-trust__item::before,
.fdc-trust__item::after {
	content: none;
}

.fdc-trust__icon {
	flex: 0 0 auto;
	color: var(--fdc-fso-bar, #b45309);
}

@media (max-width: 600px) {
	.fdc-trust--grid,
	.fdc-trust--inline {
		grid-template-columns: 1fr;
		grid-auto-flow: row;
		grid-auto-columns: auto;
	}
}

/* ======================================================================
   Repli du champ code promo
   ====================================================================== */

/* Le thème déclare .coupon en display:flex ou block : l'attribut hidden,
   appliqué par la feuille de style du navigateur, ne fait pas le poids.
   Il faut donc une classe de même terrain, marquée !important. */
.woocommerce .fdc-coupon-hidden,
.woocommerce-page .fdc-coupon-hidden,
.fdc-coupon-hidden {
	display: none !important;
}

.fdc-coupon-holder {
	display: block;
	width: 100%;
}

.fdc-coupon-toggle {
	display: inline-flex;
	float: none;
	clear: both;
	align-items: center;
	gap: 7px;
	margin: 4px 0;
	padding: 6px 0;
	border: 0;
	background: none;
	color: inherit;
	font-size: 14px;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.fdc-coupon-toggle:hover,
.fdc-coupon-toggle:focus-visible {
	opacity: 0.75;
}

.fdc-coupon-toggle svg {
	flex: 0 0 auto;
	transition: transform 0.2s ease;
}

.fdc-coupon-toggle.is-open svg {
	transform: rotate(-90deg);
}

/* ======================================================================
   Région d'annonce pour les lecteurs d'écran
   ====================================================================== */

.fdc-fso-live {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}