/*
 * Spartan Nutrition — habillage WooCommerce.
 * Boutique, carte produit, fiche produit, panier, commande, compte.
 */

/* ======================================================================= */
/* Grille de produits                                                       */
/* ======================================================================= */

.woocommerce ul.products,
ul.products {
	display: grid;
	gap: var(--sp-4);
	margin: 0 0 var(--sp-8);
	padding: 0;
	list-style: none;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.sp-shop-cols-mobile-1 ul.products {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 640px) {
	.woocommerce ul.products,
	ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1024px) {
	.woocommerce ul.products,
	ul.products {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	body.sp-shop-cols-2 ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.sp-shop-cols-3 ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	body.sp-shop-cols-4 ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	body.sp-shop-cols-5 ul.products { grid-template-columns: repeat(5, minmax(0, 1fr)); }

	body.has-shop-sidebar.sp-shop-cols-5 ul.products { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

.woocommerce ul.products li.product,
ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	padding: 0;
	float: none !important;
	clear: none !important;
	text-align: left;
}

/* ======================================================================= */
/* Carte produit                                                            */
/* ======================================================================= */

li.product.sp-product-card {
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: #fff;
	overflow: hidden;
	transition: border-color var(--sp-t-fast), box-shadow var(--sp-t), transform var(--sp-t);
}

li.product.sp-product-card:hover {
	border-color: var(--sp-grey-300);
	box-shadow: var(--sp-shadow-md);
	transform: translateY(-2px);
}

.product-card__media {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	background: var(--sp-grey-50);
	overflow: hidden;
}

.product-card__media-link {
	display: block;
	width: 100%;
	height: 100%;
}

.product-card__image {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: var(--sp-3);
	transition: opacity var(--sp-t), transform 500ms var(--sp-ease);
}

.product-card__image--hover {
	position: absolute;
	inset: 0;
	opacity: 0;
}

.product-card__media.has-hover:hover .product-card__image--hover {
	opacity: 1;
}

.product-card__media.has-hover:hover .product-card__image:not(.product-card__image--hover) {
	opacity: 0;
}

li.product.is-out-of-stock .product-card__image {
	opacity: 0.55;
}

.product-card__badges {
	position: absolute;
	top: var(--sp-2);
	left: var(--sp-2);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	pointer-events: none;
}

.product-card__tools {
	position: absolute;
	top: var(--sp-2);
	right: var(--sp-2);
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.product-card__tools:empty {
	display: none;
}

.product-card__tools > * {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: var(--sp-shadow-xs);
	color: var(--sp-ink);
}

.product-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--sp-1);
	flex: 1;
	padding: var(--sp-4);
}

.product-card__brand {
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-xs);
	font-weight: 700;
	letter-spacing: var(--sp-tracking-wide);
	text-transform: uppercase;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.product-card__title {
	margin: 0;
	padding: 0;
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-base);
	font-weight: 700;
	line-height: 1.32;
}

.product-card__title a {
	color: var(--sp-ink);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.product-card__title a:hover {
	color: var(--sp-primary);
	text-decoration: none;
}

.product-card__rating {
	display: flex;
	align-items: center;
	gap: var(--sp-2);
}

.product-card__rating .star-rating {
	margin: 0;
	font-size: 0.85em;
}

.product-card__rating-count {
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-xs);
}

.product-card__variations {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2);
	margin: var(--sp-1) 0 0;
	padding: 0;
	list-style: none;
}

.product-card__variation {
	margin: 0;
	padding: 0.15rem 0.45rem;
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius-sm);
	color: var(--sp-ink-soft);
	font-size: 11px;
	line-height: 1.5;
}

.product-card__variation-label {
	font-weight: 600;
}

.woocommerce ul.products li.product .price,
.product-card .price {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: var(--sp-2);
	margin: var(--sp-2) 0 0;
	color: var(--sp-ink);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-lg);
	font-weight: 800;
}

.woocommerce ul.products li.product .price del,
.price del {
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
	font-weight: 500;
	opacity: 1;
}

.woocommerce ul.products li.product .price ins,
.price ins {
	background: none;
	color: var(--sp-sale);
	text-decoration: none;
}

.product-card__cta {
	margin-top: auto;
	padding-top: var(--sp-3);
}

.woocommerce ul.products li.product .button,
.product-card__cta .button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: var(--sp-tap);
	margin: 0;
	padding: 0.6rem 1rem;
	border: 2px solid var(--sp-ink);
	border-radius: var(--sp-radius-sm);
	background: transparent;
	color: var(--sp-ink);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-sm);
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	transition: background var(--sp-t-fast), color var(--sp-t-fast), border-color var(--sp-t-fast);
}

.woocommerce ul.products li.product .button:hover,
.product-card__cta .button:hover {
	background: var(--sp-btn-bg);
	border-color: var(--sp-btn-bg);
	color: var(--sp-btn-text);
}

.woocommerce ul.products li.product .button.loading::after {
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-left: 8px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: sp-spin 700ms linear infinite;
}

@keyframes sp-spin {
	to { transform: rotate(360deg); }
}

.woocommerce ul.products li.product .added_to_cart {
	display: block;
	margin-top: var(--sp-2);
	color: var(--sp-primary);
	font-size: var(--sp-fs-sm);
	font-weight: 700;
	text-align: center;
}

/* ======================================================================= */
/* En-tête et barre d'outils boutique                                       */
/* ======================================================================= */

.shop-header {
	padding-block: var(--sp-8) var(--sp-4);
}

.shop-header__title {
	margin-bottom: var(--sp-2);
}

.shop-header__description {
	max-width: 75ch;
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-base);
}

.shop-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-3);
	margin-bottom: var(--sp-5);
	padding: var(--sp-3) var(--sp-4);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: var(--sp-grey-50);
}

.shop-toolbar__left,
.shop-toolbar__right {
	display: flex;
	align-items: center;
	gap: var(--sp-3);
}

.woocommerce .woocommerce-result-count {
	margin: 0;
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
}

.woocommerce .woocommerce-ordering {
	margin: 0;
}

.woocommerce .woocommerce-ordering select {
	min-height: 40px;
	min-width: 200px;
	font-size: var(--sp-fs-sm);
}

@media (min-width: 1024px) {
	body.has-shop-sidebar .shop-toolbar__filters {
		display: none;
	}
}

/* ======================================================================= */
/* Panneau de filtres                                                       */
/* ======================================================================= */

.shop-filters {
	position: fixed;
	/* Sous l'en-tête (sticky) et non sous top:0, sinon le panneau ouvert
	   passe par-dessus l'en-tête au lieu de s'ouvrir en dessous. Cette
	   règle ne s'applique qu'en dessous de 1024px (voir plus bas), où
	   --sp-header-h-total vaut toujours 68px. */
	top: var(--sp-header-h-total);
	left: 0;
	bottom: 0;
	z-index: var(--sp-z-panel);
	width: min(360px, 90vw);
	transform: translateX(-100%);
	/* Hors écran : on retire aussi le panneau de l'ordre de tabulation. */
	visibility: hidden;
	transition: transform var(--sp-t), visibility var(--sp-t);
}

.shop-filters.is-open {
	transform: translateX(0);
	visibility: visible;
}

@media (min-width: 1024px) {
	body.has-shop-sidebar .shop-filters {
		position: static;
		/* Le z-index du tiroir mobile (210) doit être neutralisé ici : la
		   colonne est un élément de grille (.shop-layout est en display:grid),
		   et pour un élément flex/grid le z-index s'applique même en
		   position:static — la barre passait donc par-dessus l'en-tête
		   collant (z-index 100) au défilement. */
		z-index: auto;
		width: auto;
		transform: none;
		visibility: visible;
		box-shadow: none;
		background: transparent;
	}

	body.has-shop-sidebar .shop-filters__head,
	body.has-shop-sidebar .shop-filters__foot {
		display: none;
	}

	body.has-shop-sidebar .shop-filters__body {
		padding: 0;
		overflow: visible;
	}
}

.shop-filter-group {
	margin-bottom: var(--sp-5);
	padding-bottom: var(--sp-5);
	border-bottom: 1px solid var(--sp-grey-200);
}

.shop-filter-group__title {
	margin-bottom: var(--sp-3);
	font-size: var(--sp-fs-md);
	text-transform: uppercase;
	letter-spacing: var(--sp-tracking-wide);
}

.shop-filter-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.shop-filter-list__link {
	display: flex;
	align-items: center;
	gap: var(--sp-2);
	min-height: 38px;
	padding: 0.35rem 0;
	color: var(--sp-ink);
	font-size: var(--sp-fs-base);
}

.shop-filter-list__link::before {
	content: "";
	width: 18px;
	height: 18px;
	flex: none;
	border: 2px solid var(--sp-grey-300);
	border-radius: 4px;
	transition: background var(--sp-t-fast), border-color var(--sp-t-fast);
}

.shop-filter-list__link.is-active::before {
	border-color: var(--sp-primary);
	background: var(--sp-primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E") center / 12px no-repeat;
}

.shop-filter-list__link.is-active {
	font-weight: 700;
}

.shop-filters__reset {
	width: 100%;
}

.shop-filters__empty {
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
}

.shop-filters .widget {
	margin-bottom: var(--sp-5);
	padding: 0 0 var(--sp-5);
	border: 0;
	border-bottom: 1px solid var(--sp-grey-200);
	border-radius: 0;
	background: transparent;
}

.shop-filters .widget__title {
	font-size: var(--sp-fs-md);
}

.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content {
	background: var(--sp-grey-200);
	border-radius: var(--sp-radius-pill);
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-range {
	background: var(--sp-primary);
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-handle {
	width: 18px;
	height: 18px;
	top: -6px;
	border: 2px solid #fff;
	background: var(--sp-primary);
	box-shadow: var(--sp-shadow-sm);
}

.woocommerce .widget_price_filter .price_slider_amount .button {
	float: none;
	padding: 0.4rem 1rem;
	border-radius: var(--sp-radius-sm);
	background: var(--sp-ink);
	color: #fff;
	font-size: var(--sp-fs-sm);
}

/* ======================================================================= */
/* Fiche produit                                                            */
/* ======================================================================= */

.woocommerce div.product {
	padding-top: var(--sp-6);
}

.woocommerce div.product div.images.woocommerce-product-gallery,
.woocommerce div.product div.summary {
	float: none;
	width: 100%;
	margin: 0;
}

.woocommerce div.product div.images.woocommerce-product-gallery {
	position: relative;
	top: auto;
	width: 100%;
	max-width: 520px;
	margin-inline: auto;
	/* FlexSlider place les diapositives suivantes sur une longue ligne.
	   overflow:hidden empêche cette ligne interne d'élargir la page. */
	overflow: hidden;
	align-self: start;
	justify-self: center;
}

@media (min-width: 900px) {
	.woocommerce div.product {
		display: grid;
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		gap: var(--sp-10);
		align-items: start;
	}

	.woocommerce div.product .woocommerce-tabs,
	.woocommerce div.product .related,
	.woocommerce div.product .up-sells,
	.woocommerce div.product .sp-section--recently-viewed,
	.woocommerce div.product .woocommerce-product-gallery + .summary + * {
		grid-column: 1 / -1;
	}
}

.woocommerce div.product .woocommerce-product-gallery__wrapper {
	border-radius: var(--sp-radius);
	overflow: hidden;
	background: var(--sp-grey-50);
}

.woocommerce div.product .woocommerce-product-gallery__image {
	display: flex !important;
	align-items: center;
	justify-content: center;
	background: var(--sp-grey-50);
}

.woocommerce div.product .woocommerce-product-gallery__image > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 1 / 1;
	background: var(--sp-grey-50);
}

.woocommerce div.product .woocommerce-product-gallery__image img:not(.zoomImg) {
	display: block;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	border-radius: var(--sp-radius);
}

.woocommerce div.product .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 72px));
	justify-content: center;
	gap: var(--sp-2);
	margin-top: var(--sp-3);
	padding: 0;
	list-style: none;
}

.woocommerce div.product div.images.woocommerce-product-gallery .flex-control-thumbs li {
	width: 100%;
	margin: 0;
	float: none;
}

.woocommerce div.product .flex-control-thumbs img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	border: 2px solid transparent;
	border-radius: var(--sp-radius-sm);
	background: var(--sp-grey-50);
	opacity: 0.7;
	transition: opacity var(--sp-t-fast), border-color var(--sp-t-fast);
}

.woocommerce div.product .flex-control-thumbs img.flex-active,
.woocommerce div.product .flex-control-thumbs img:hover {
	opacity: 1;
	border-color: var(--sp-primary);
}

.single-product__brand {
	margin: 0 0 var(--sp-2);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
	font-weight: 700;
	letter-spacing: var(--sp-tracking-wide);
	text-transform: uppercase;
}

.woocommerce div.product .product_title {
	margin-bottom: var(--sp-3);
	font-size: var(--sp-fs-2xl);
	line-height: 1.14;
}

.single-product__rating {
	margin-bottom: var(--sp-3);
}

.woocommerce div.product .woocommerce-product-rating {
	display: flex;
	align-items: center;
	gap: var(--sp-3);
	margin: 0;
}

.woocommerce .star-rating {
	color: var(--sp-accent);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: var(--sp-3);
	margin-bottom: var(--sp-4);
	color: var(--sp-ink);
	font-family: var(--sp-font-heading);
	font-size: 1.9rem;
	font-weight: 800;
}

.woocommerce div.product p.price del {
	font-size: 1.1rem;
}

.woocommerce-product-details__short-description {
	margin-bottom: var(--sp-5);
	color: var(--sp-ink-soft);
}

/* --- Variations ---------------------------------------------------------- */

.woocommerce div.product form.cart {
	margin-bottom: var(--sp-4);
}

.woocommerce div.product form.cart .variations {
	width: 100%;
	margin-bottom: var(--sp-4);
	border: 0;
}

.woocommerce div.product form.cart .variations tr {
	display: block;
	margin-bottom: var(--sp-4);
}

.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
}

.woocommerce div.product form.cart .variations th.label {
	margin-bottom: var(--sp-2);
	font-size: var(--sp-fs-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: var(--sp-tracking-wide);
}

.woocommerce div.product form.cart .variations select {
	min-height: var(--sp-tap);
}

.woocommerce div.product form.cart .variations select.screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	min-width: 1px !important;
	max-width: 1px !important;
	height: 1px !important;
	min-height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.woocommerce div.product form.cart .reset_variations {
	display: inline-block;
	margin-top: var(--sp-2);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
	text-decoration: underline;
}

.woocommerce div.product .woocommerce-variation-price {
	margin-bottom: var(--sp-3);
}

.woocommerce div.product .woocommerce-variation-availability .stock {
	margin: 0;
}

/* Pastilles de saveur générées par le thème (voir product.js). */
.variation-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2);
	margin-bottom: var(--sp-2);
}

.variation-swatch {
	min-height: 40px;
	padding: 0.45rem 0.9rem;
	border: 2px solid var(--sp-grey-300);
	border-radius: var(--sp-radius-sm);
	background: #fff;
	color: var(--sp-ink);
	font-size: var(--sp-fs-sm);
	font-weight: 600;
	transition: border-color var(--sp-t-fast), background var(--sp-t-fast), color var(--sp-t-fast);
}

.variation-swatch:hover {
	border-color: var(--sp-ink);
}

.variation-swatch[aria-pressed="true"] {
	border-color: var(--sp-primary);
	background: var(--sp-primary-soft);
	color: var(--sp-primary-dark);
}

.variation-swatch[disabled] {
	opacity: 0.4;
	cursor: not-allowed;
	text-decoration: line-through;
}

/* --- Quantité ------------------------------------------------------------ */

/*
 * Le sélecteur cible « div.quantity » (l'enveloppe du champ) et jamais
 * « span.quantity » (le « 1 × 189 MAD » du mini-panier).
 */
div.quantity {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--sp-grey-300);
	border-radius: var(--sp-radius-sm);
	overflow: hidden;
}

div.quantity.hidden {
	display: none;
}

/* WooCommerce remplace le champ numérique par un input caché lorsque le
   stock achetable est limité à une seule unité. Dans ce cas les boutons
   moins/plus n'ont aucune action possible et ne doivent pas rester seuls. */
div.quantity:has(input.qty[type="hidden"]) {
	display: none;
}

div.quantity .qty {
	width: 56px;
	min-height: var(--sp-tap);
	border: 0;
	border-radius: 0;
	text-align: center;
	-moz-appearance: textfield;
}

div.quantity .qty::-webkit-outer-spin-button,
div.quantity .qty::-webkit-inner-spin-button {
	appearance: none;
	margin: 0;
}

div.quantity .qty:focus {
	box-shadow: none;
}

.quantity__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	background: var(--sp-grey-100);
	color: var(--sp-ink);
	transition: background var(--sp-t-fast);
}

.quantity__btn:hover {
	background: var(--sp-grey-200);
}

/* --- Bouton principal ---------------------------------------------------- */

.woocommerce div.product form.cart {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-3);
	align-items: center;
}

.woocommerce div.product form.cart .variations,
.woocommerce div.product form.cart .woocommerce-variation,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
	flex: 1 1 100%;
}

.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-3);
	align-items: center;
}

.woocommerce div.product form.cart button.single_add_to_cart_button,
.woocommerce div.product form.cart .single_add_to_cart_button {
	flex: 1 1 220px;
	min-height: 52px;
	padding: 0.85rem 1.75rem;
	border: 0;
	border-radius: var(--sp-radius-sm);
	background: var(--sp-btn-bg);
	color: var(--sp-btn-text);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-md);
	font-weight: 800;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	transition: background var(--sp-t-fast);
}

.woocommerce div.product form.cart button.single_add_to_cart_button:hover {
	background: var(--sp-btn-bg-hover);
}

.woocommerce div.product form.cart button.single_add_to_cart_button.disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.single-product__whatsapp {
	width: 100%;
	margin-bottom: var(--sp-4);
}

/* --- Réassurance et méta -------------------------------------------------- */

.single-product__reassurance {
	margin-block: var(--sp-5);
	padding: var(--sp-4);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: var(--sp-grey-50);
}

.reassurance-row {
	display: flex;
	align-items: flex-start;
	gap: var(--sp-3);
	margin-bottom: var(--sp-3);
	font-size: var(--sp-fs-base);
}

.reassurance-row:last-child {
	margin-bottom: 0;
}

.reassurance-row svg {
	margin-top: 2px;
	flex: none;
	color: var(--sp-primary);
}

.single-product__meta {
	display: flex;
	flex-direction: column;
	gap: var(--sp-1);
	margin-block: var(--sp-4);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
}

.single-product__meta a {
	color: var(--sp-ink-soft);
	text-decoration: underline;
}

.single-product__share {
	display: flex;
	align-items: center;
	gap: var(--sp-2);
	margin-top: var(--sp-4);
}

.single-product__share-label {
	margin-right: var(--sp-1);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: var(--sp-tracking-wide);
}

.woocommerce .stock.in-stock {
	color: var(--sp-success);
	font-weight: 700;
}

.woocommerce .stock.out-of-stock {
	color: var(--sp-sale);
	font-weight: 700;
}

.woocommerce .stock.low-stock {
	color: var(--sp-warning);
	font-weight: 700;
}

/* --- Onglets -------------------------------------------------------------- */

.woocommerce div.product .woocommerce-tabs {
	margin-top: var(--sp-12);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-1);
	margin: 0 0 var(--sp-6);
	padding: 0;
	border-bottom: 1px solid var(--sp-grey-200);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 0.85rem 1.1rem;
	border-bottom: 3px solid transparent;
	color: var(--sp-ink-soft);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-base);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	transition: color var(--sp-t-fast), border-color var(--sp-t-fast);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--sp-ink);
	border-bottom-color: var(--sp-primary);
	text-decoration: none;
}

.woocommerce div.product .woocommerce-tabs .panel {
	max-width: 80ch;
	margin: 0;
	padding: 0;
}

.woocommerce div.product .woocommerce-tabs .panel > h2:first-child {
	font-size: var(--sp-fs-xl);
}

@media (max-width: 767px) {
	.woocommerce div.product .woocommerce-tabs ul.tabs {
		overflow-x: auto;
		flex-wrap: nowrap;
		scrollbar-width: none;
	}

	.woocommerce div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar {
		display: none;
	}

	.woocommerce div.product .woocommerce-tabs ul.tabs li a {
		white-space: nowrap;
	}
}

/* --- Avis ---------------------------------------------------------------- */

.woocommerce #reviews #comments ol.commentlist {
	padding: 0;
}

.woocommerce #reviews #comments ol.commentlist li {
	margin-bottom: var(--sp-5);
	padding: var(--sp-5);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: #fff;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
	margin: 0 0 0 68px;
	padding: 0;
	border: 0;
	border-radius: 0;
}

.woocommerce #reviews #comments ol.commentlist li img.avatar {
	width: 52px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	position: absolute;
}

.woocommerce #review_form #respond textarea {
	border-radius: var(--sp-radius-sm);
}

/* --- Sections associées --------------------------------------------------- */

.woocommerce .related > h2,
.woocommerce .up-sells > h2,
.woocommerce .cross-sells > h2 {
	margin-bottom: var(--sp-6);
	font-size: var(--sp-fs-2xl);
}

.woocommerce .related,
.woocommerce .up-sells,
.sp-section--recently-viewed {
	margin-top: var(--sp-12);
	padding-top: var(--sp-10);
	border-top: 1px solid var(--sp-grey-200);
}

.sp-section--recently-viewed {
	padding-bottom: 0;
}

/* ======================================================================= */
/* Panier                                                                   */
/* ======================================================================= */

.woocommerce .cart-empty,
.woocommerce .return-to-shop {
	text-align: center;
}

.woocommerce table.shop_table {
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}

.woocommerce table.shop_table th {
	padding: var(--sp-4);
	background: var(--sp-grey-50);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-sm);
	text-transform: uppercase;
	letter-spacing: var(--sp-tracking-wide);
}

.woocommerce table.shop_table td {
	padding: var(--sp-4);
	border-top: 1px solid var(--sp-grey-200);
	vertical-align: middle;
}

.woocommerce table.cart img {
	width: 72px;
	border-radius: var(--sp-radius-sm);
}

.woocommerce a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--sp-grey-100);
	color: var(--sp-ink-soft) !important;
	font-size: 1.1rem;
	line-height: 1;
}

.woocommerce a.remove:hover {
	background: var(--sp-sale);
	color: #fff !important;
}

.woocommerce .cart .product-name a {
	color: var(--sp-ink);
	font-weight: 600;
}

.woocommerce .cart .variation {
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-xs);
}

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals {
	width: 100%;
	float: none;
}

.woocommerce .cart_totals table.shop_table {
	border-radius: var(--sp-radius);
}

.woocommerce .cart_totals .order-total .amount {
	font-family: var(--sp-font-heading);
	font-size: 1.4rem;
	font-weight: 800;
}

.woocommerce .checkout-button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	margin-top: var(--sp-4);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-btn-bg);
	color: var(--sp-btn-text);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-md);
	font-weight: 800;
	text-transform: uppercase;
}

.woocommerce .checkout-button:hover {
	background: var(--sp-btn-bg-hover);
	color: var(--sp-btn-text);
}

@media (min-width: 900px) {
	.woocommerce-cart .woocommerce {
		display: grid;
		grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
		gap: var(--sp-8);
		align-items: start;
	}

	.woocommerce-cart .woocommerce > form.woocommerce-cart-form {
		grid-column: 1;
	}

	.woocommerce-cart .cart-collaterals {
		grid-column: 2;
		position: sticky;
		top: calc(var(--sp-header-h-total) + 20px);
		width: 100%;
	}

	.woocommerce-cart .woocommerce-notices-wrapper,
	.woocommerce-cart .shipping-progress,
	.woocommerce-cart .cross-sells {
		grid-column: 1 / -1;
	}
}

.woocommerce .cart-collaterals .cross-sells {
	width: 100%;
	float: none;
}

.cart-reassurance {
	margin-top: var(--sp-4);
	padding: var(--sp-4);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: var(--sp-grey-50);
}

.cart-reassurance__note {
	margin: var(--sp-3) 0 0;
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
}

.cart-continue {
	margin-left: var(--sp-2);
}

@media (max-width: 767px) {
	.woocommerce table.shop_table_responsive tr td {
		display: flex;
		justify-content: space-between;
		gap: var(--sp-4);
		text-align: right;
	}

	.woocommerce table.shop_table_responsive tr td::before {
		font-weight: 700;
	}

	/* La ligne "actions" (coupon + boutons) n'est pas une paire
	   étiquette/valeur : la règle générique ci-dessus l'étirait en
	   colonnes très étroites et très hautes, cassant le texte des
	   boutons lettre par lettre. On l'empile normalement à la place. */
	.woocommerce table.cart td.actions {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		text-align: left;
		gap: var(--sp-3);
	}

	.woocommerce table.cart td.actions::before {
		display: none;
	}

	.woocommerce table.cart td.actions .coupon {
		display: flex;
		gap: var(--sp-2);
		height: auto;
	}

	.woocommerce table.cart td.actions .coupon #coupon_code {
		flex: 1;
		min-width: 0;
	}

	.woocommerce table.cart td.actions .button,
	.woocommerce table.cart td.actions .cart-continue {
		width: 100%;
		height: auto;
		text-align: center;
	}

	.woocommerce table.cart td.actions .cart-continue {
		margin-left: 0;
	}
}

/* ======================================================================= */
/* Mini-panier                                                              */
/* ======================================================================= */

.mini-cart .woocommerce-mini-cart {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mini-cart .woocommerce-mini-cart-item {
	position: relative;
	display: flex;
	gap: var(--sp-3);
	padding: var(--sp-3) 0;
	border-bottom: 1px solid var(--sp-grey-200);
}

.mini-cart .woocommerce-mini-cart-item img {
	order: -1;
	width: 62px;
	height: 62px;
	flex: none;
	object-fit: contain;
	border-radius: var(--sp-radius-sm);
	background: var(--sp-grey-50);
}

.mini-cart .woocommerce-mini-cart-item a:not(.remove) {
	display: block;
	color: var(--sp-ink);
	font-size: var(--sp-fs-base);
	font-weight: 600;
}

.mini-cart .woocommerce-mini-cart-item .quantity {
	display: block;
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
}

.mini-cart .woocommerce-mini-cart-item a.remove {
	position: absolute;
	top: var(--sp-3);
	right: 0;
}

.mini-cart .woocommerce-mini-cart__total {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: var(--sp-4) 0;
	padding-top: var(--sp-4);
	border-top: 2px solid var(--sp-ink);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-lg);
	font-weight: 800;
}

.mini-cart .woocommerce-mini-cart__buttons {
	display: grid;
	gap: var(--sp-2);
}

.mini-cart .woocommerce-mini-cart__buttons .button {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--sp-tap);
	border: 2px solid var(--sp-ink);
	border-radius: var(--sp-radius-sm);
	background: transparent;
	color: var(--sp-ink);
	font-family: var(--sp-font-heading);
	font-weight: 700;
	text-transform: uppercase;
}

.mini-cart .woocommerce-mini-cart__buttons .checkout {
	border-color: var(--sp-btn-bg);
	background: var(--sp-btn-bg);
	color: var(--sp-btn-text);
}

.mini-cart .woocommerce-mini-cart__empty-message {
	padding: var(--sp-8) 0;
	color: var(--sp-ink-soft);
	text-align: center;
}

/* ======================================================================= */
/* Commande (checkout)                                                      */
/* ======================================================================= */

.woocommerce-checkout .woocommerce {
	padding-bottom: var(--sp-12);
}

@media (min-width: 900px) {
	.woocommerce-checkout form.checkout {
		display: grid;
		grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
		gap: var(--sp-8);
		align-items: start;
	}

	.woocommerce-checkout #customer_details {
		grid-column: 1;
	}

	.woocommerce-checkout #order_review {
		grid-column: 2;
	}

	.woocommerce-checkout h3#order_review_heading {
		margin-top: 0;
	}

	.woocommerce-checkout #order_review {
		position: sticky;
		top: calc(var(--sp-header-h-total) + 20px);
		padding: var(--sp-5);
		border: 1px solid var(--sp-grey-200);
		border-radius: var(--sp-radius);
		background: var(--sp-grey-50);
	}
}

.woocommerce-checkout .col2-set,
.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
	width: 100%;
	float: none;
}

.woocommerce form .form-row {
	margin-bottom: var(--sp-4);
	padding: 0;
}

.woocommerce form .form-row label {
	font-size: var(--sp-fs-sm);
	font-weight: 600;
}

.woocommerce form .form-row .required {
	color: var(--sp-sale);
	text-decoration: none;
}

.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
	margin-bottom: var(--sp-6);
	padding: var(--sp-5);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
}

/* Ligne de formulaire conservée dans le DOM mais masquée (champ pays). */
.woocommerce-checkout .form-row.sp-row-hidden {
	display: none;
}

.woocommerce #payment ul.payment_methods {
	padding: var(--sp-4);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: #fff;
}

.woocommerce #payment ul.payment_methods li {
	margin-bottom: var(--sp-2);
	list-style: none;
}

.woocommerce #payment div.payment_box {
	margin-top: var(--sp-2);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-grey-100);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
}

.woocommerce #payment div.payment_box::before {
	border-bottom-color: var(--sp-grey-100);
}

.woocommerce #payment #place_order {
	display: block;
	width: 100%;
	min-height: 54px;
	margin-top: var(--sp-4);
	border: 0;
	border-radius: var(--sp-radius-sm);
	background: var(--sp-btn-bg);
	color: var(--sp-btn-text);
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-md);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.woocommerce #payment #place_order:hover {
	background: var(--sp-btn-bg-hover);
}

.checkout-policies {
	margin-top: var(--sp-3);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-xs);
	text-align: center;
}

.woocommerce-terms-and-conditions-wrapper {
	margin-bottom: var(--sp-3);
	font-size: var(--sp-fs-sm);
}

/* ======================================================================= */
/* Mon compte                                                               */
/* ======================================================================= */

.woocommerce-account .woocommerce {
	padding-block: var(--sp-8) var(--sp-12);
}

@media (min-width: 900px) {
	.woocommerce-account .woocommerce-MyAccount-navigation {
		float: none;
		width: 260px;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		float: none;
		width: auto;
	}

	.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
		display: block;
	}

	.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
		display: grid;
		grid-template-columns: 260px minmax(0, 1fr);
		gap: var(--sp-8);
		align-items: start;
	}

	/*
	 * WooCommerce pose un clearfix sur .woocommerce (::before et ::after en
	 * display:table). Dans une grille, ces pseudo-éléments deviennent de
	 * vraies cellules : ils occupaient la première, ce qui repoussait le menu
	 * en colonne 2 et le contenu à la ligne suivante.
	 */
	.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation)::before,
	.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation)::after {
		content: none;
	}

	.woocommerce-account .woocommerce-notices-wrapper {
		grid-column: 1 / -1;
	}
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: var(--sp-2);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	list-style: none;
	background: #fff;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
	display: block;
	padding: 0.7rem 0.9rem;
	border-radius: var(--sp-radius-sm);
	color: var(--sp-ink);
	font-weight: 600;
}

.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
	background: var(--sp-off);
	text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--sp-ink);
	color: #fff;
}

@media (max-width: 899px) {
	.woocommerce-account .woocommerce-MyAccount-navigation ul {
		display: flex;
		gap: var(--sp-1);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
		display: none;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation a {
		white-space: nowrap;
	}
}

.woocommerce-account .addresses .col-1,
.woocommerce-account .addresses .col-2 {
	width: 100%;
	float: none;
}

.woocommerce-account .woocommerce-Address {
	margin-bottom: var(--sp-4);
	padding: var(--sp-5);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
}

/* ======================================================================= */
/* Messages WooCommerce                                                     */
/* ======================================================================= */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sp-3);
	margin-bottom: var(--sp-5);
	padding: var(--sp-4) var(--sp-5);
	border: 1px solid var(--sp-grey-200);
	border-left: 4px solid var(--sp-primary);
	border-radius: var(--sp-radius);
	background: var(--sp-grey-50);
	color: var(--sp-ink);
	list-style: none;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	display: none;
}

.woocommerce-message {
	border-left-color: var(--sp-success);
}

.woocommerce-error {
	border-left-color: var(--sp-sale);
}

.woocommerce-message .button,
.woocommerce-info .button {
	margin-left: auto;
	padding: 0.45rem 1rem;
	border: 2px solid var(--sp-ink);
	border-radius: var(--sp-radius-sm);
	color: var(--sp-ink);
	font-size: var(--sp-fs-sm);
	font-weight: 700;
	text-transform: uppercase;
}

.woocommerce-error li {
	margin: 0;
	width: 100%;
}

.woocommerce .blockUI.blockOverlay {
	background: rgba(255, 255, 255, 0.6) !important;
}

/* --- Blocs Cart & Checkout (WooCommerce Blocks) --------------------------- */

.wc-block-components-button:not(.is-link) {
	border-radius: var(--sp-radius-sm);
	background: var(--sp-btn-bg);
	color: var(--sp-btn-text);
	font-family: var(--sp-font-heading);
	font-weight: 800;
	text-transform: uppercase;
}

.wc-block-components-button:not(.is-link):hover {
	background: var(--sp-btn-bg-hover);
}

.wc-block-components-totals-item__value {
	font-weight: 800;
}

/* --- Correctif : par défaut WooCommerce affiche les cross-sells AVANT le
   résumé de commande, ce qui enterre le bouton "Passer la commande" sous
   une rangée de suggestions produits. On force le résumé en premier. --- */
.cart-collaterals .cart_totals {
	order: -1;
}

.cart-collaterals .cross-sells {
	margin-top: var(--sp-8);
}

.cart-collaterals .cross-sells .section-head__title,
.cart-collaterals .cross-sells h2 {
	font-size: var(--sp-fs-md);
}

/* Suggestions panier : grille compacte à 3 colonnes, cartes réduites au
   strict minimum (image + titre + prix), pas la taille d'une carte boutique
   normale — c'est un encart secondaire à côté du résumé de commande. */
.cart-collaterals .cross-sells ul.products,
.cart-collaterals .cross-sells ul.products.columns-2 {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: var(--sp-2);
}

.cart-collaterals .cross-sells .product-card__body {
	gap: 2px;
	padding: var(--sp-2);
}

.cart-collaterals .cross-sells .product-card__brand,
.cart-collaterals .cross-sells .product-card__rating,
.cart-collaterals .cross-sells .product-card__variations,
.cart-collaterals .cross-sells .product-card__badges,
.cart-collaterals .cross-sells .product-card__tools,
.cart-collaterals .cross-sells .product-card__cta {
	display: none;
}

.cart-collaterals .cross-sells .product-card__title {
	font-size: 11px;
	line-height: 1.25;
	-webkit-line-clamp: 2;
}

.cart-collaterals .cross-sells .price {
	margin-top: 2px;
	font-size: 12px;
}

.cart-collaterals .cross-sells .price del {
	display: none;
}

@media (min-width: 900px) {
	.woocommerce-cart .cart-collaterals {
		display: flex;
		flex-direction: column;
	}
}

/* --- Correctif : neutralise le clearfix hérité de WooCommerce (::before/::after
   display:table) qui, dans une grille CSS, devient lui-même une case invisible
   et décale tous les produits d\x27une position (le \"vide\" en haut à gauche). --- */
ul.products::before,
ul.products::after {
	content: none !important;
	display: none !important;
}

/* --- Correctif : le tableau du panier débordait de sa colonne (table-layout
   auto = largeur basée sur le contenu, ignorant le conteneur), chevauchant
   le résumé de commande, avec "MAD" qui se coupait au milieu. Uniquement
   au-dessus de 768px : en dessous, WooCommerce empile déjà proprement
   chaque ligne (shop_table_responsive), qu'on laisse faire. --- */
@media (min-width: 768px) {
	.woocommerce table.cart,
	.woocommerce table.shop_table.cart {
		width: 100%;
		table-layout: fixed;
	}

	.woocommerce table.cart th,
	.woocommerce table.cart td {
		padding: var(--sp-3);
		font-size: var(--sp-fs-sm);
	}

	.woocommerce table.cart th {
		font-size: 0.7rem;
		letter-spacing: 0;
		text-transform: none;
	}

	.woocommerce table.cart th.product-remove,
	.woocommerce table.cart td.product-remove {
		width: 24px;
		padding-left: 0;
		padding-right: 0;
	}

	.woocommerce table.cart th.product-thumbnail,
	.woocommerce table.cart td.product-thumbnail {
		width: 56px;
		padding-left: var(--sp-1);
		padding-right: var(--sp-1);
	}

	.woocommerce table.cart img {
		width: 44px;
		height: auto;
	}

	.woocommerce table.cart th.product-name,
	.woocommerce table.cart td.product-name {
		width: auto;
		font-size: var(--sp-fs-sm);
		line-height: 1.35;
	}

	/* Prix unitaire masqué à partir de 768px : redondant avec le sous-total
	   dès que la grille panier + résumé de commande (à partir de 900px, voir
	   plus bas) réduit le tableau à ~480px, trop étroit pour 6 colonnes.
	   display:none casse le calcul des colonnes en table-layout:fixed (le
	   navigateur laisse un vide à la place) : on garde la cellule, réduite
	   à 0px, plutôt que de la retirer du rendu. */
	.woocommerce table.cart th.product-price,
	.woocommerce table.cart td.product-price {
		width: 0;
		padding: 0 !important;
		border: 0 !important;
		overflow: hidden;
		white-space: nowrap;
	}

	.woocommerce table.cart th.product-subtotal,
	.woocommerce table.cart td.product-subtotal {
		width: 96px;
		padding-left: var(--sp-2);
		padding-right: var(--sp-2);
		white-space: nowrap;
	}

	.woocommerce table.cart th.product-quantity,
	.woocommerce table.cart td.product-quantity {
		width: 104px;
		padding-left: var(--sp-1);
		padding-right: var(--sp-1);
	}

	.woocommerce table.cart .quantity input.qty {
		font-size: var(--sp-fs-sm);
	}

	/* Le stepper (- / input / +) standard fait ~140px, trop large pour la
	   colonne quantité du panier (104px) : il débordait sur le sous-total. */
	.woocommerce table.cart div.quantity {
		width: fit-content;
	}

	.woocommerce table.cart div.quantity .qty {
		width: 32px;
		min-height: 36px;
	}

	.woocommerce table.cart .quantity__btn {
		width: 26px;
		min-height: 36px;
	}
}

@media (max-width: 767px) {
	.woocommerce table.cart img {
		width: 48px;
		height: auto;
	}

	.woocommerce table.shop_table_responsive tr td,
	.woocommerce table.shop_table_responsive tr th {
		font-size: var(--sp-fs-sm);
	}

	.woocommerce table.cart td.product-name {
		line-height: 1.3;
	}

	/* Le champ quantité garde la taille par défaut du navigateur (16px) tant
	   qu'aucune règle ne le cible en dessous de 768px : ça le fait paraître
	   plus gros que le reste de la ligne (13px). */
	.woocommerce table.cart .quantity input.qty {
		font-size: var(--sp-fs-sm);
	}
}

/* --- Panier / Commande : la page utilise le gabarit générique (page.php),
   limité à --sp-container-narrow (860px). Avec la grille articles + résumé
   (voir plus haut), ça écrasait le tableau à ~480px même sur grand écran.
   1140px : assez large pour respirer, sans prendre toute la largeur du
   conteneur standard (1320px), qui faisait paraître la page trop étirée. --- */
.woocommerce-cart .container--narrow,
.woocommerce-checkout .container--narrow,
.woocommerce-account .container--narrow {
	max-width: 1140px;
}

/* --- « Passer la commande » et « Partager sur WhatsApp » reprenaient la
   taille tactile par défaut de WooCommerce (~20px de police/padding) sur
   mobile, disproportionnée à côté du reste du panier. On les aligne sur le
   gabarit de boutons du thème (13-14px). Le bouton WhatsApp reçoit son
   padding/sa police en style inline (réglages du plugin) : !important est
   nécessaire pour passer devant. --- */
@media (max-width: 767px) {
	/* Spécificité alignée sur la règle WooCommerce native (.woocommerce-cart
	   .wc-proceed-to-checkout a.checkout-button), sinon celle-ci l'emporte
	   malgré l'ordre de chargement. */
	.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
		min-height: 46px;
		padding: 0.75rem 1rem;
		font-size: var(--sp-fs-sm);
	}

	.woocommerce-cart .wwnp-share-wrap {
		margin-top: var(--sp-2);
	}

	.woocommerce-cart .wwnp-btn.wwnp-share-btn {
		padding: 9px 14px !important;
		font-size: var(--sp-fs-xs) !important;
		line-height: 20px !important;
	}

	.woocommerce-cart .wwnp-share-btn .wwnp-icon {
		width: 16px;
		height: 16px;
	}
}

/* ======================================================================= */
/* Avis produits                                                           */
/* ======================================================================= */

.review-summary {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--sp-6);
	align-items: center;
	margin: var(--sp-4) 0 var(--sp-6);
	padding: var(--sp-5);
	border: 1px solid var(--sp-grey-200);
	border-radius: var(--sp-radius);
	background: var(--sp-grey-100);
}

@media (max-width: 560px) {
	.review-summary {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--sp-4);
	}
}

.review-summary__score {
	text-align: center;
	min-width: 120px;
}

.review-summary__average {
	display: block;
	font-family: var(--sp-font-heading);
	font-size: var(--sp-fs-2xl);
	font-weight: 800;
	line-height: 1;
	color: var(--sp-ink);
}

.review-summary__score .star-rating {
	margin: 6px auto 4px;
}

.review-summary__count {
	display: block;
	font-size: var(--sp-fs-sm);
	color: var(--sp-ink-soft);
}

.review-bars {
	margin: 0;
	padding: 0;
	list-style: none;
}

.review-bars__row {
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr) 28px;
	gap: var(--sp-2);
	align-items: center;
	margin-bottom: 5px;
	font-size: var(--sp-fs-sm);
	color: var(--sp-ink-soft);
}

.review-bars__track {
	height: 7px;
	border-radius: var(--sp-radius-pill);
	background: var(--sp-grey-200);
	overflow: hidden;
}

.review-bars__fill {
	display: block;
	height: 100%;
	border-radius: var(--sp-radius-pill);
	background: var(--sp-primary);
}

.review-bars__count {
	text-align: end;
	font-variant-numeric: tabular-nums;
}

/* Mention d'achat vérifié, posée avant le texte de l'avis. */
.review-verified {
	display: inline-flex;
	align-items: center;
	margin: 0 0 8px;
	padding: 3px 10px;
	border-radius: var(--sp-radius-pill);
	background: #eaf7f0;
	color: #146036;
	font-size: 12px;
	font-weight: 700;
}

.review-form__intro {
	margin-bottom: var(--sp-4);
	color: var(--sp-ink-soft);
	font-size: var(--sp-fs-sm);
	line-height: 1.6;
}