/*
Theme Name: Gibi Savonnia
Theme URI: https://savonnia.com
Description: Thème custom pour Savonnia — hybride PHP+Gutenberg
Author: Lionel Gibaudan
Author URI: https://gibaudan.com
Version: 1.0.0
Text Domain: gibi-savonnia
*/

/* =========================================================
   RESET
   ========================================================= */

body {
	margin: 0;
	font-family: 'Lato', system-ui, sans-serif;
}

/* Les blocs pleine-largeur (calc(50% - 50vw), .alignfull, fiche produit)
   débordent de quelques pixels sur Chrome/Edge : 50vw compte la barre de
   défilement verticale, 50% du conteneur non — évite la barre horizontale
   que cet écart provoque, sans toucher à la technique elle-même. */
html {
	overflow-x: hidden;
	scroll-behavior: smooth;
}

*, *::before, *::after {
	box-sizing: border-box;
}

/* Sticky footer : le footer reste en bas de l'écran même sur les pages à faible contenu */
#wrapper.site {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.site-main {
	flex: 1 0 auto;
}

img {
	max-width: 100%;
	height: auto;
}

/* =========================================================
   CONTENEUR PRINCIPAL — 1290px centré
   ========================================================= */

.site-container {
	max-width: 1290px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1rem;
	padding-right: 1rem;
}

/* =========================================================
   LAYOUT HYBRIDE — largeurs Gutenberg
   Source : docs/guide-largeurs-theme-hybride.md
   ========================================================= */

article {
	width: 100%;
}

article > *:not(.entry-content) {
	max-width: 1290px;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--wp--style--root--padding-left);
	padding-right: var(--wp--style--root--padding-right);
}

.entry-content {
	padding-left:  var(--wp--style--root--padding-left);
	padding-right: var(--wp--style--root--padding-right);
}

.entry-content > * {
	max-width: var(--wp--style--global--content-size);
	margin-left: auto;
	margin-right: auto;
}

/* Centrage forcé du bloc Checkout — le plugin Mondial Relay/InPost (checkout.css)
   fixe margin-left/right à 0px depuis sa v5.8, avec la même spécificité que la
   règle ci-dessus. On la double pour gagner systématiquement la cascade. */
.entry-content .wp-block-woocommerce-checkout {
	margin-left: auto;
	margin-right: auto;
}

.entry-content .alignwide {
	max-width: var(--wp--style--global--wide-size);
}

.entry-content .alignfull {
	margin-left:   calc(50% - 50vw);
	margin-right:  calc(50% - 50vw);
	margin-bottom: 0;
	max-width:     none;
	width:         auto;
}

/* =========================================================
   HEADER — fond plat
   ========================================================= */

#masthead {
	background-color: var(--savonnia-violet);
}

/* =========================================================
   HEADER — barre de navigation
   ========================================================= */

:root {
	--nav-height: 170px;
	--savonnia-violet: #413751;
}

.header-nav-bar {
	background: transparent;
}

.header-nav-bar .site-container {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: var(--nav-height);
}

/* Logo + tagline */
.header-logo {
	flex-shrink: 0;
}

.header-logo .custom-logo {
	display: block;
	max-width: 320px;
	height: auto;
}

@media (max-width: 600px) {
	:root {
		--nav-height: 120px;
	}
	.header-nav-bar .site-container {
		justify-content: flex-start;
	}
	.header-logo .custom-logo {
		max-width: 220px;
	}
	.savonnia-hamburger {
		top: 20px; /* même correction bulle, proportionnelle au logo mobile */
	}
	body.admin-bar .savonnia-hamburger {
		top: 66px; /* 20px alignement texte mobile + 46px barre admin */
	}
}

.header-logo .site-name {
	font-size: 1.25rem;
	font-weight: 600;
	text-decoration: none;
	color: inherit;
}

/* Panier */
.utility-actions {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.header-contact-link {
	display: flex;
	align-items: center;
	color: inherit;
	text-decoration: none;
}

.header-contact-link:hover {
	opacity: 0.8;
}

.header-contact-link--current {
	opacity: 0.4;
	cursor: default;
}

.header-cart-link {
	position: relative;
	display: flex;
	align-items: center;
	color: inherit;
	text-decoration: none;
	margin-right: 8px;
}

.cart-count {
	position: absolute;
	top: -6px;
	right: -8px;
	background: #fff;
	color: #222;
	font-size: 0.65rem;
	font-weight: 700;
	line-height: 1;
	min-width: 16px;
	height: 16px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 3px;
}

/* =========================================================
   HEADER — barre utilitaire (compte + panier)
   ========================================================= */

.header-utility-bar {
	background: #2d3142;
	padding: 0.35rem 0;
	color: #fff;
	font-size: 0.8rem;
}

.header-utility-bar .site-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.utility-link {
	color: #fff;
	text-decoration: none;
}

.utility-link:hover {
	text-decoration: underline;
}

/* Fiche produit : le titre est déjà dans le résumé WooCommerce */
body.single-product .header-hero {
	display: none;
}

/* =========================================================
   HEADER — zone titre (hero)
   ========================================================= */

.header-hero {
	padding: 0.8rem 0 1.5rem;
}

.header-hero-title {
	margin: 0;
	font-family: 'Dancing Script', cursive;
	font-size: clamp(1.8rem, 4.5vw, 3.5rem);
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	color: #fff;
}

.header-hero-cart-total {
	display: inline-block;
	font-family: 'Lato', system-ui, sans-serif;
	font-size: clamp(1rem, 2.5vw, 1.4rem);
	font-weight: 400;
	letter-spacing: 0.03em;
	color: #2d3142;
	background: rgba(255, 255, 255, 0.85);
	margin-top: 0.4rem;
	padding: 0.2rem 0.8rem;
	border-radius: 4px;
}

.header-hero-subtitle {
	display: block;
	margin-top: 0.3rem;
	font-family: 'Lato', system-ui, sans-serif;
	font-size: clamp(0.9rem, 2vw, 1.2rem);
	font-weight: 400;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.75);
}

/* =========================================================
   MENU OVERLAY
   ========================================================= */

#savonnia-menu {
	background: #f7f6f4;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}

#savonnia-menu.open {
	grid-template-rows: 1fr;
}

.menu-inner {
	min-height: 0;
	overflow: hidden;
}

.savonnia-menu-list {
	list-style: none;
	max-width: 1290px;
	margin: 0 auto;
	padding: 1.5rem 1rem 2rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1.5rem 2rem;
	align-items: start;
}

.savonnia-menu-list .sub-menu {
	list-style: none;
	margin: 0.5rem 0 0;
	padding: 0 0 0 0.75rem;
	border-left: 2px solid #e8e2d8;
}

.savonnia-menu-list .standalone-group > .sub-menu {
	margin-top: 0;
}

.savonnia-menu-list .menu-depth-0 {
	padding: 0;
}

.savonnia-menu-list .menu-depth-0 > a,
.savonnia-menu-list .menu-depth-0 > .menu-label {
	font-size: 1.1rem;
	font-weight: 600;
	text-decoration: none;
	color: inherit;
	transition: color 0.15s;
}

.savonnia-menu-list .menu-depth-0 > a:hover {
	color: #c8a951;
}

.savonnia-menu-list .menu-depth-1 {
	padding: 0.2rem 0;
}

.savonnia-menu-list .menu-depth-1 > a {
	font-size: 1rem;
	font-weight: 400;
	text-decoration: none;
	color: inherit;
	transition: color 0.15s;
	display: inline-flex;
	align-items: center;
}

.savonnia-menu-list .menu-depth-1 > a:hover {
	color: #c8a951;
}

/* Lien actif (page courante) */
.savonnia-menu-list .current-menu-item > a,
.savonnia-menu-list .current-menu-parent > a,
.savonnia-menu-list .current-menu-ancestor > a {
	color: #c8a951;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Cibles tactiles agrandies sur mobile */
@media (max-width: 768px) {
	.savonnia-menu-list .menu-depth-0 > a,
	.savonnia-menu-list .menu-depth-0 > .menu-label {
		line-height: 2;
	}

	.savonnia-menu-list .menu-depth-1 > a {
		display: flex;
		line-height: 1;
		padding: 0.45rem 0;
	}
}

/* =========================================================
   BOUTON HAMBURGER — position fixe, toujours visible
   ========================================================= */

.savonnia-hamburger {
	position: fixed;
	/* Aligné sur le haut du texte "Savonnia" (pas la bulle qui dépasse) */
	top: 28px;
	/* Aligné sur le bord droit du conteneur 1290px */
	right: max(1rem, calc(50vw - 645px + 1rem));
	z-index: 9000;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 6px;
	width: 62px;
	height: 62px;
	background: #c8a951;
	border: 1.5px solid #2d3142;
	border-radius: 6px;
	cursor: pointer;
	padding: 10px;
	-webkit-appearance: none;
	appearance: none;
	transition: background 0.2s;
}

.savonnia-hamburger:hover {
	background: #b8973e;
}

.savonnia-hamburger:hover,
.savonnia-hamburger:focus {
	outline: none;
}

.savonnia-hamburger:focus-visible {
	outline: 2px solid #333;
	border-radius: 4px;
}

.hbg-bar {
	display: block;
	width: 34px;
	height: 2px;
	background: #2d3142;
	border-radius: 2px;
	transition: transform 0.25s ease, opacity 0.25s ease;
}

.savonnia-hamburger[aria-expanded="true"] .hbg-bar:nth-child(1) {
	transform: rotate(45deg) translate(7px, 5px);
}
.savonnia-hamburger[aria-expanded="true"] .hbg-bar:nth-child(2) {
	opacity: 0;
	transform: scaleX(0);
}
.savonnia-hamburger[aria-expanded="true"] .hbg-bar:nth-child(3) {
	transform: rotate(-45deg) translate(5px, -5px);
}

body.admin-bar .savonnia-hamburger {
	top: 60px; /* 28px alignement texte + 32px barre admin */
}
@media screen and (max-width: 782px) {
	body.admin-bar .savonnia-hamburger {
		top: 74px; /* 28px alignement texte + 46px barre admin (mobile) */
	}
}

/* =========================================================
   GUTENBERG — blocs groupe
   flow-root crée un BFC : les marges des enfants restent
   confinées dans le groupe (empêche le margin collapse)
   ========================================================= */

:root .wp-block-group:not(.is-layout-grid):not(.is-layout-flex) {
	display: flow-root;
}

/* =========================================================
   WOOCOMMERCE — notices (add-to-cart, erreurs...)
   ========================================================= */

.woocommerce-notices-wrapper,
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
	outline: none;
}

/* =========================================================
   WOOCOMMERCE — description d'archive (catégories/univers de senteur)
   ========================================================= */

.term-description {
	background: #f7f6f4;
	border: 1px solid #e2e0da;
	border-radius: 8px;
	padding: 0.85rem 1.5rem;
	margin-bottom: 1.5rem;
}

.archive .term-description p {
	font-size: 18px;
	margin-block: 0.5rem;
}

.archive .term-description p:first-of-type {
	color: var(--savonnia-violet);
	font-weight: bold;
}

/* =========================================================
   WOOCOMMERCE — grille produits responsive
   ========================================================= */

.fp-page-content {
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0 !important;
}

.woocommerce-wrap {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

/* Spécificité (0,2,0) — bat le .woocommerce ul.products (0,2,1) de WooCommerce
   uniquement sur les propriétés de layout qu'on redéfinit */
.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

/* Supprime les pseudo-éléments clearfix qui deviennent des cellules fantômes */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none;
}

/* Annule le float et la largeur fixe imposés par WooCommerce.
   !important requis : WooCommerce réapplique width dans ses propres media queries */
.woocommerce ul.products li.product {
	float: none !important;
	width: auto !important;
	display: flex;
	flex-direction: column;
	margin: 0;
	border: 1px solid #c2c2c2;
	border-radius: 6px;
	overflow: hidden; /* clips l'image dans le border-radius — pas besoin de cibler l'img */
	padding-bottom: 12px;
	position: relative;

	> a.woocommerce-LoopProduct-link {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
		text-decoration: none;

		h2 {
			margin-inline: 12px;
			color: var(--savonnia-violet);
		}

		.star-rating {
			margin-inline: auto;
		}

		.price {
			margin-top: auto; /* pousse le prix en bas du lien, position constante */
			padding-top: 0.5rem;
			text-align: center;

			bdi {
				font-size: 1.25rem;
			}
		}
	}

	/* Bouton panier + lien "Voir le panier" — même position en bas de card */
	> a.add_to_cart_button,
	> a.added_to_cart {
		margin-inline: 12px;
		margin-top: 8px;
		text-align: center;
	}

	> a.add_to_cart_button {
		background-color: var(--savonnia-violet);
		border-color: var(--savonnia-violet);
		color: #fff;
	}

	> a.add_to_cart_button:hover {
		background-color: #342c41;
		border-color: #342c41;
	}

	/* Message "Achetez et gagnez X points !" (WPLoyalty) centré comme le prix et le bouton */
	.wlr-product-message {
		text-align: center;
	}
}

/* Lien "Rupture de stock" (remplace "Lire la suite") : texte simple, pas un bouton */
.woocommerce ul.products li.product.outofstock > a.button {
	background: none;
	border: none;
	padding: .618em 1em;
	line-height: 1;
	margin-inline: 12px;
	margin-top: 8px;
	color: #7a1f2b;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
}

/* Images pleine largeur dans leur cellule */
.woocommerce ul.products li.product img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
}

@media (max-width: 1200px) {
	.woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
	.woocommerce ul.products { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 500px) {
	.woocommerce ul.products { grid-template-columns: 1fr; }
}

/* Espace entre la grille et la pagination */
.woocommerce ul.products + nav.woocommerce-pagination {
	margin-top: 2rem;
}

/* =========================================================
   EXPLORATEUR DE GAMME (page-gamme.php)
   ========================================================= */

.gamme-explorer {
	padding: 2rem 0 3rem;
}

.gamme-tree--root {
	list-style: none;
	padding: 0;
	margin: 0;
}

.gamme-tree {
	list-style: none;
	padding: 0 0 0 1.25rem;
	margin: 0.3rem 0 0.3rem 0.4rem;
	border-left: none;
}

.gamme-tree--d2 {
	border-left: 4px solid #c8a951;
}

.gamme-tree--d3 {
	border-left: 4px solid #8b6f4e;
}

.gamme-node {
	padding: 0.2rem 0;
}

.gamme-tree--root > .gamme-node > .gamme-link {
	font-weight: 600;
	font-size: 1rem;
}

.gamme-link {
	text-decoration: none;
	color: #2d3142;
	transition: color 0.15s;
}

.gamme-link:hover {
	color: #c8a951;
}

.gamme-count {
	color: #aaa;
	font-size: 0.8em;
	font-weight: 400;
}

/* Vignettes produits dans les branches feuilles (page-gamme-detail.php) */
.gamme-products {
	list-style: none;
	padding: 0.75rem 0 0.25rem;
	margin: 0 0 0.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.gamme-product-link {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-decoration: none;
	color: inherit;
	width: 100px;
}

.gamme-product-img {
	width: 100px;
	height: 100px;
	object-fit: cover;
	border-radius: 4px;
	display: block;
}

.gamme-product-name {
	font-size: 0.7rem;
	margin-top: 0.3rem;
	line-height: 1.3;
	text-align: center;
	color: #555;
}

.gamme-product-link:hover .gamme-product-name {
	color: #c8a951;
}

/* =========================================================
   FRONT PAGE — Barre de recherche
   ========================================================= */

.fp-search {
	padding: 1.75rem 0 0.5rem;
}

.fp-search-form {
	display: flex;
	max-width: 480px;
	margin: 0 auto;
	border: 2px solid var(--savonnia-violet);
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
}

.fp-search-input {
	flex: 1;
	min-width: 0;
	border: none;
	outline: none;
	padding: 0.75rem 1.25rem;
	font-size: 1rem;
	background: transparent;
	color: #2d3142;
}

.fp-search-input::placeholder {
	color: #9a9a9a;
}

.fp-search-submit {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	flex-shrink: 0;
	border: none;
	background: var(--savonnia-violet);
	color: #fff;
	cursor: pointer;
	transition: background 0.2s;
}

.fp-search-submit:hover {
	background: #52466a;
}

/* Recherche dans le bandeau header-hero (fond violet) : la bordure/bouton
   violet du composant de base deviendrait invisible sur fond violet */
.header-hero .fp-search-form {
	border: none;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.header-hero .fp-search-submit {
	background: color-mix(in srgb, var(--savonnia-violet) 22%, white);
	color: var(--savonnia-violet);
}

.header-hero .fp-search-submit:hover {
	background: color-mix(in srgb, var(--savonnia-violet) 32%, white);
}

/* =========================================================
   FRONT PAGE — Meilleures ventes
   ========================================================= */

.fp-best-sellers {
	padding: 2rem 0 2rem;
}

.fp-section-title {
	font-family: 'Dancing Script', cursive;
	font-size: clamp(2.2rem, 3.5vw, 2.9rem);
	font-weight: 700;
	color: #9B7408;
	margin: 0 0 1.5rem;
	text-align: center;
}

.fp-products-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

.fp-product-card {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
	transition: box-shadow 0.25s, transform 0.25s;
}

.fp-product-card:hover {
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
	transform: translateY(-3px);
}

.fp-card-link {
	display: block;
	position: relative;
	text-decoration: none;
	color: inherit;
}

.fp-card-img {
	width: 100%;
	height: auto;
	display: block;
}

.fp-card-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.68) 0%, transparent 100%);
	padding: 1.25rem 0.75rem 0.75rem;
}

.fp-card-title {
	font-size: 1rem;
	font-weight: 700;
	color: #fff;
	text-align: center;
	line-height: 1.3;
	margin: 0;
	text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}

.fp-card-btn {
	display: none;
	position: absolute;
	top: 0.6rem;
	right: 0.6rem;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	border: none;
	background: #c8a951;
	color: #2d3142;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	transition: background 0.2s, transform 0.2s;
}

.fp-product-card:hover .fp-card-btn {
	background: #b8973e;
	transform: scale(1.08);
}

@media (max-width: 1200px) {
	.fp-products-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
	.fp-products-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 500px) {
	.fp-products-grid { grid-template-columns: 1fr; }
}

.fp-reviews { padding: 2rem 0 3rem; }

.fp-reviews-grid {
	list-style: none; padding: 0; margin: 0;
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem;
}

.fp-review-card {
	background: #fff; border-radius: 10px;
	border: 1px solid #e2e2e2;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1);
	padding: 1.5rem; display: flex; flex-direction: column; gap: 0.75rem;
}

.fp-review-stars { color: #d8d8d8; font-size: 1rem; letter-spacing: 0.1em; }
.fp-star-filled { color: #c8a951; }

.fp-review-text { font-size: 0.9rem; line-height: 1.5; color: #333; margin: 0; flex-grow: 1; }
.fp-review-meta { font-size: 0.85rem; color: #666; margin: 0; }
.fp-review-meta a { color: var(--savonnia-violet); font-weight: 600; }

@media (max-width: 1200px) { .fp-reviews-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px)  { .fp-reviews-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px)  { .fp-reviews-grid { grid-template-columns: 1fr; } }

/* =========================================================
   FOOTER
   ========================================================= */

.site-footer {
	background: #252838;
	color: rgba(255, 255, 255, 0.80);
	font-size: 0.9rem;
}

.footer-widgets {
	padding: 3rem 0 2rem;
}

.footer-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2rem 3rem;
	align-items: start;
}

.footer-heading {
	font-size: 1.1rem;
	font-weight: 600;
	color: #fff;
	margin: 0 0 1.2rem;
}

/* Contact */
.footer-contact {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.footer-contact li {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	line-height: 1.5;
}

.footer-contact svg {
	flex-shrink: 0;
	margin-top: 2px;
	opacity: 0.7;
}

.footer-contact a {
	color: inherit;
	text-decoration: none;
}

.footer-contact a:hover {
	color: #fff;
}

/* Liens */
.footer-links {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.footer-links a {
	color: inherit;
	text-decoration: none;
	transition: color 0.15s;
}

.footer-links a:hover {
	color: #fff;
}

.menu-senteur-dot {
	display: inline-block;
	width: 18px;
	height: 12px;
	border-radius: 3px;
	margin-right: 0.5em;
	margin-top: 2px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	flex-shrink: 0;
}

.menu-senteur-count {
	font-size: 0.75em;
	opacity: 0.65;
	margin-left: 2px;
}

.footer-placeholder-img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
}

/* Newsletter */
.footer-newsletter-intro {
	margin: 0 0 1rem;
	line-height: 1.6;
}

.footer-newsletter-form {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.footer-newsletter-field {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	padding-bottom: 0.4rem;
}

.footer-newsletter-field svg {
	flex-shrink: 0;
	opacity: 0.6;
}

.footer-newsletter-field input[type="email"] {
	background: transparent;
	border: none;
	outline: none;
	color: #fff;
	font-size: 0.9rem;
	width: 100%;
}

.footer-newsletter-field input[type="email"]::placeholder {
	color: rgba(255, 255, 255, 0.45);
}

.footer-newsletter-btn {
	align-self: flex-start;
	background: #fff;
	color: #252838;
	border: none;
	padding: 0.5rem 1.4rem;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	border-radius: 3px;
	transition: background 0.2s;
}

.footer-newsletter-btn:hover {
	background: #e8e8e8;
}

/* Barre copyright */
.footer-bar {
	background: #1c1f2e;
	padding: 0.9rem 0;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.45);
}

.footer-bar p {
	margin: 0;
}

/* Responsive */
@media (max-width: 1024px) {
	.footer-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
	.footer-grid { grid-template-columns: 1fr; }
}

/* Lien "Comment nous trouver" */
.footer-find-us {
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-find-us-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #fff;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.footer-find-us-toggle::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s;
}

.footer-find-us-toggle[aria-expanded="true"]::after {
	transform: rotate(-135deg);
}

.footer-find-us-toggle svg {
	opacity: 0.7;
	flex-shrink: 0;
}

.footer-find-us-panel {
	margin-top: 1rem;
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.4s ease;
}

.footer-find-us-panel.is-open {
	max-height: 3000px;
}


.footer-find-us-images {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: start;
	gap: 1.5rem;
	margin-bottom: 1rem;
}

.footer-find-us-images p {
	font-size: 1.1rem;
	line-height: 1.6;
	margin: 0;
}

.footer-find-us-images img {
	width: 100%;
	height: auto;
	display: block;
}

@media (max-width: 600px) {
	.footer-find-us-images {
		grid-template-columns: 1fr;
	}
}

/* =========================================================
   WOOCOMMERCE — fiche produit : pills notes/ingrédients
   ========================================================= */

.product-notes-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0.35rem 0 0.75rem;
}

.product-note-pill {
	display: inline-block;
	background: #f5f0e8;
	color: #6b5a3a;
	border: 1px solid #e0d5c0;
	border-radius: 2rem;
	padding: 0.2rem 0.75rem;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.03em;
	text-decoration: none;
}

/* Pills dans la grille boutique — position absolute sur l'image */
.loop-product-notes {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem;
	max-width: calc(100% - 4rem);
}

.loop-note-pill {
	display: inline-block;
	background: #000;
	color: #fff;
	border-radius: 2rem;
	padding: 0.35rem 0.7rem;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}

.product-note-pill--link:hover {
	background: #e8dfc8;
	border-color: #c8a951;
	color: #4a3a20;
}

/* =========================================================
   WOOCOMMERCE — fiche produit : avis clients
   ========================================================= */

/* Titre "X avis pour Produit" */
.woocommerce-Reviews-title {
	font-size: 1.25rem;
	font-weight: 600;
	margin-bottom: 1.5rem;
}

/* Padding par défaut du navigateur sur <ol> (indentation des puces), jamais reseté par WooCommerce malgré list-style: none */
.woocommerce #reviews #comments ol.commentlist {
	padding: 0;
}

/* Avatar Gravatar générique inutile (aucun client n'a de photo) — masqué, place récupérée */
.woocommerce #reviews #comments ol.commentlist li img.avatar {
	display: none;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
	margin: 0;
}

/* Padding navigateur non reseté sur ul.children (même défaut que ol.commentlist) */
.woocommerce #reviews #comments ol.commentlist ul.children {
	padding: 0;
}

@media (max-width: 600px) {
	.woocommerce #reviews #comments ol.commentlist ul.children {
		margin-left: 20px;
	}
}

/* Fond doré clair (couleur des étoiles) sur les réponses (children) pour les distinguer des avis */
.woocommerce #reviews #comments ol.commentlist ul.children li .comment-text {
	position: relative;
	background: rgba(200, 169, 81, 0.12);
}

.woocommerce #reviews #comments ol.commentlist ul.children li .comment-text::before {
	content: "Réponse";
	position: absolute;
	top: -10px;
	left: 16px;
	background: #c8a951;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: 3px;
	line-height: 1.4;
}

/* Étoiles remplies dans les avis existants */
.woocommerce .star-rating span::before,
.woocommerce p.stars a::before,
.woocommerce p.stars a:hover ~ a::before {
	color: #c8a951;
}

/* Étoiles interactives du formulaire — état par défaut et survol */
.woocommerce p.stars a {
	color: #c8a951;
}

.woocommerce p.stars a:hover,
.woocommerce p.stars a:hover ~ a,
.woocommerce p.stars.selected a.active,
.woocommerce p.stars.selected a.active ~ a {
	color: #c8a951;
}

/* Titre du formulaire "Ajouter un Avis" */
#reply-title {
	font-size: 1.1rem;
	font-weight: 600;
	margin-top: 2rem;
	margin-bottom: 0.5rem;
}

/* Bouton Soumettre */
.woocommerce #reviews #respond .form-submit input[type="submit"] {
	background: #2d3142;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 0.6rem 1.4rem;
	font-size: 0.9rem;
	cursor: pointer;
	transition: background 0.2s;
}

.woocommerce #reviews #respond .form-submit input[type="submit"]:hover {
	background: #1a1e2e;
}

/* =========================================================
   WOOCOMMERCE — fiche produit : séparation des zones
   ========================================================= */

/* Padding pleine-largeur : contenu centré à 1290px, bords jusqu'au viewport.
   Même logique que alignfull Gutenberg. */
:root {
	--single-full-pad: max(1.25rem, calc((100vw - 1290px) / 2 + 1.25rem));
}

/* Titre "Caractéristiques du produit" :
   clear:both — évite qu'il remonte dans l'espace à côté de la galerie flottante.
   Marges négatives fullwidth OK maintenant que le float est purgé. */
/* Espace avant le bloc foncé : padding sur les floats, pas margin sur le clearing element */
body.single-product .woocommerce-product-gallery,
body.single-product .summary.entry-summary {
	padding-top: 2.5rem;
	padding-bottom: 3rem;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.product-gallery-caption {
	margin: 0.75rem 0;
	color: #888;
	font-size: 0.8rem;
	text-align: center;
	font-style: italic;
}

body.single-product .product-tabs-heading {
	clear: both;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 3rem var(--single-full-pad) 1.5rem;
	background: #2d3142;
	font-size: 1.45rem;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.55);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-align: center;
}

/* Onglets : dark scheme — même marine que le header/footer */
body.single-product .woocommerce-tabs.wc-tabs-wrapper {
	background: #2d3142;
	margin: 0 calc(50% - 50vw);
	padding: 1rem var(--single-full-pad) 5rem;
	color: rgba(255, 255, 255, 0.85);
}

/* Barre d'onglets : suppression totale des bordures WooCommerce par défaut.
   align-items: flex-end → l'onglet actif (plus haut) monte au-dessus des autres */
body.single-product .woocommerce-tabs .tabs.wc-tabs {
	border-bottom: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	align-items: flex-end;
	gap: 3px;
	overflow: visible;
}

/* Onglets inactifs */
body.single-product .woocommerce-tabs .tabs.wc-tabs li {
	background: rgba(255, 255, 255, 0.10) !important;
	border: none !important;
	border-radius: 6px 6px 0 0;
	margin: 0 !important;
	transition: background 0.15s;
	float: none !important;
}

body.single-product .woocommerce-tabs .tabs.wc-tabs li::before,
body.single-product .woocommerce-tabs .tabs.wc-tabs li::after {
	display: none !important;
}

body.single-product .woocommerce-tabs .tabs.wc-tabs li a {
	color: rgba(255, 255, 255, 0.50) !important;
	font-size: 0.875rem;
	font-weight: 500;
	padding: 0.6rem 1.25rem;
	display: block;
}

body.single-product .woocommerce-tabs .tabs.wc-tabs li:hover {
	background: rgba(255, 255, 255, 0.20) !important;
}

body.single-product .woocommerce-tabs .tabs.wc-tabs li:hover a {
	color: rgba(255, 255, 255, 0.85) !important;
}

/* Onglet actif : fond blanc + accent ambre en haut + typographie renforcée.
   Plus grand que les inactifs → monte vers le haut grâce à align-items: flex-end */
body.single-product .woocommerce-tabs .tabs.wc-tabs li.active {
	background: #fff !important;
	border: none !important;
	border-radius: 6px 6px 0 0;
}

body.single-product .woocommerce-tabs .tabs.wc-tabs li.active a {
	color: #2d3142 !important;
	font-weight: 700;
	font-size: 0.9rem;
	padding: 0.72rem 1.35rem;
}

/* Panneau de contenu : collé sous les onglets, sans aucune bordure WooCommerce */
body.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
	background: #fff !important;
	border: none !important;
	border-radius: 0 6px 6px 6px;
	padding: 2.5rem 3rem !important;
	margin: 0 !important;
	color: #2d3142;
}

body.single-product .woocommerce-tabs .panel h2 {
	color: #2d3142;
	font-size: 1rem;
	font-weight: 600;
	margin-bottom: 1rem;
}

body.single-product .woocommerce-tabs .panel p,
body.single-product .woocommerce-tabs .panel li {
	color: #444;
	line-height: 1.7;
}

/* Tableau "Informations complémentaires" */
body.single-product .woocommerce-tabs .shop_attributes {
	width: 100%;
	border-collapse: collapse;
}

body.single-product .woocommerce-tabs .shop_attributes th,
body.single-product .woocommerce-tabs .shop_attributes td {
	padding: 0.6rem 0.75rem;
	color: #444;
	border-bottom: 1px solid #eee;
	text-align: left;
}

body.single-product .woocommerce-tabs .shop_attributes th {
	color: #888;
	font-weight: 600;
	font-size: 0.85rem;
	width: 40%;
}

/* Formulaire avis */
body.single-product .woocommerce-tabs #reply-title {
	color: #2d3142;
}

body.single-product .woocommerce-tabs .comment-form label {
	color: #555;
}

body.single-product .woocommerce-tabs .comment-form textarea,
body.single-product .woocommerce-tabs .comment-form input[type="text"],
body.single-product .woocommerce-tabs .comment-form input[type="email"] {
	background: #fafafa;
	border: 1px solid #ddd;
	color: #333;
	border-radius: 4px;
	padding: 0.5rem 0.75rem;
	width: 100%;
}

body.single-product .woocommerce-tabs .woocommerce-noreviews {
	color: #888;
}

@media (max-width: 480px) {
	body.single-product .woocommerce-tabs .tabs.wc-tabs {
		flex-direction: column;
		align-items: stretch;
		gap: 2px;
	}
	body.single-product .woocommerce-tabs .tabs.wc-tabs li {
		border-radius: 4px !important;
		text-align: center;
	}
	body.single-product .woocommerce-tabs .tabs.wc-tabs li.active {
		border-radius: 4px !important;
	}
	body.single-product .woocommerce-tabs .tabs.wc-tabs li a {
		padding: 1rem 1.25rem !important;
	}
}

/* Suggestions : sans fond, séparées par un filet */
body.single-product .up-sells.upsells {
	margin: 3rem 0 0;
	padding-top: 1.5rem;
}

body.single-product .related.products {
	margin: 2.5rem 0 0;
	padding-top: 1.5rem;
	padding-bottom: 3rem;
}

/* Titres suggestions : harmonisés avec .product-tabs-heading */
body.single-product .up-sells > h2,
body.single-product .related > h2 {
	font-size: 1.45rem;
	font-weight: 700;
	color: #aaa;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 1.5rem;
}

/* Grille : 4 colonnes héritées de .woocommerce ul.products — pas de surcharge nécessaire */

/* =========================================================
   WOOCOMMERCE — fiche produit : formulaire panier
   ========================================================= */

/* Prix */
body.single-product p.price {
	text-align: center;
	font-size: 2.4rem !important;
	font-weight: 700;
	margin-block: 0.5rem;
}

/* Statut stock */
body.single-product p.stock {
	text-align: center;
	font-size: 1.1rem;
	font-weight: 600;
}

/* Aligne le stepper et le bouton sur la même hauteur */
body.single-product form.cart {
	display: flex;
	align-items: stretch;
	justify-content: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin-left: 0 !important;
	padding-left: 0 !important;
}

body.single-product form.cart .quantity {
	display: flex !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.single-product form.cart .quantity input.qty {
	width: 90px;
	margin: 0 !important;
	padding: 0 6px 0 0 !important;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 1rem;
	text-align: center;
}

body.single-product form.cart .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: inner-spin-button;
	width: 28px;
	margin-right: 2px;
	opacity: 1;
	cursor: pointer;
}

/* =========================================================
   WOOCOMMERCE — page panier
   ========================================================= */

/* Aération générale */
body.woocommerce-cart .woocommerce-wrap {
	padding-top: 2.5rem;
	padding-bottom: 3rem;
}

/* Vignettes articles du panier : agrandies */
body.woocommerce-cart td.wc-block-cart-item__image {
	width: 100px !important;
	min-width: 100px !important;
}

body.woocommerce-cart .wc-block-cart-item__image a {
	display: block !important;
	width: 100px !important;
	height: 100px !important;
}

body.woocommerce-cart .wc-block-cart-item__image img {
	display: block !important;
	width: 100px !important;
	height: 100px !important;
	object-fit: cover;
}

/* Images panier : réduites sur tablette/intermédiaire */
@media (max-width: 780px) {
	body.woocommerce-cart td.wc-block-cart-item__image {
		width: 80px !important;
		min-width: 80px !important;
	}
	body.woocommerce-cart .wc-block-cart-item__image a {
		display: block !important;
		width: 80px !important;
		height: 80px !important;
	}
	body.woocommerce-cart td.wc-block-cart-item__product {
		padding-left: 12px !important;
	}
	body.woocommerce-cart .wc-block-cart-item__image img {
		width: 80px !important;
		height: 80px !important;
	}
}

@media (max-width: 600px) {
	body.woocommerce-cart td.wc-block-cart-item__image {
		width: 72px !important;
		min-width: 72px !important;
	}
	body.woocommerce-cart .wc-block-cart-item__image a,
	body.woocommerce-cart .wc-block-cart-item__image img {
		width: 72px !important;
		height: 72px !important;
	}

	/* Cross-sells : 2 colonnes — spécificité haute pour battre WooCommerce Blocks */
	body.woocommerce-cart ul.wc-block-product-template.wc-block-product-template__responsive {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	/* Bouton checkout sticky en bas de l'écran */
	.wc-block-cart__submit {
		position: sticky;
		bottom: 0;
		z-index: 500;
		background: #fff;
		padding: 0.75rem 1rem;
		box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.12);
		margin: 0;
	}
}

/* Titre "Contenu du panier" injecté en CSS avant le tableau */
body.woocommerce-cart .wc-block-cart__main::before {
	content: 'CONTENU DU PANIER' var(--cart-total-suffix, '');
	display: block;
	font-family: 'Lato', system-ui, sans-serif;
	font-size: 1.3rem;
	font-weight: 700;
	color: #2d3142;
	letter-spacing: 0.04em;
	text-align: center;
	padding: 3rem 0 1rem;
}

/* Cross-sells : titre de section */
body.woocommerce-cart h2:not(.wp-block-post-title) {
	font-size: 1.3rem;
	font-weight: 700;
	color: #2d3142;
	letter-spacing: 0.04em;
	text-align: center;
	margin: 2.5rem 0 1.5rem;
}

/* Cross-sells : cartes égales, bouton en bas */
body.woocommerce-cart .wc-block-product-template {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
	align-items: stretch !important;
	gap: 1.5rem !important;
	padding: 0 !important;
	margin: 0 !important;
}

body.woocommerce-cart .wc-block-product-template li.wc-block-product {
	display: flex !important;
	flex-direction: column !important;
	border: 1px solid #ddd;
	border-radius: 6px;
	overflow: hidden;
	padding-bottom: 12px;
}

body.woocommerce-cart .wc-block-product-template li .wc-block-components-product-image img {
	height: 180px !important;
	width: 100% !important;
	object-fit: cover !important;
	object-position: center !important;
}

/* Titre produit : taille réduite + padding de sécurité */
body.woocommerce-cart .wc-block-product-template li h2.wp-block-post-title {
	font-size: 1rem !important;
	padding-inline: 8px;
}

/* Bouton : moins pill, plus moderne */
body.woocommerce-cart .wc-block-product-template .wp-block-woocommerce-product-button {
	margin-top: auto !important;
	padding: 0 12px 0;
	text-align: center;
}

body.woocommerce-cart .wc-block-product-template .wp-block-button__link {
	border-radius: 5px !important;
	font-size: 0.85rem !important;
	padding: 0.5em 1.2em !important;
	background: #2d3142 !important;
	color: #fff !important;
	border: none !important;
	letter-spacing: 0.03em;
}

/* Étiquette "Expédition" sur la ligne de livraison du Blocks Cart */
.wc-block-components-totals-shipping::before {
	content: "Livraison";
	display: block;
	font-size: 0.8em;
	color: #888;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 0.2em;
}

/* Paiements express masqués sur le panier — tout au Checkout (décision projet) */
body.woocommerce-cart #ppcp-cart-paylater-messages,
body.woocommerce-cart .wc-block-components-express-payment--cart,
body.woocommerce-cart .wc-block-components-express-payment-continue-rule--cart {
	display: none !important;
}

/* =========================================================
   WOOCOMMERCE — Mon compte
   ========================================================= */

/* Le shortcode [woocommerce_my_account] génère .woocommerce comme enfant direct
   de .entry-content, qui contraint tout enfant direct à contentSize (620px,
   règle ligne ~63). On l'élargit au wideSize (équivalent "alignwide") plutôt
   que de tout désactiver — le margin: auto est déjà hérité de .entry-content > *. */
body.woocommerce-account .entry-content > .woocommerce {
	max-width: var(--wp--style--global--wide-size);
	padding-top: 2.5rem;
	padding-bottom: 3rem;
}

/* Sidebar de navigation : carte blanche, lien actif marine */
.woocommerce-MyAccount-navigation {
	background: #fff;
	border: 1px solid #ebebeb;
	border-radius: 6px;
	padding: 0.5rem;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-MyAccount-navigation-link a {
	display: block;
	padding: 0.65rem 1rem;
	border-radius: 4px;
	color: #2d3142;
	text-decoration: none;
	font-weight: 500;
	transition: background 0.15s, color 0.15s;
}

.woocommerce-MyAccount-navigation-link a:hover {
	color: #c8a951;
	background: #f7f6f4;
}

.woocommerce-MyAccount-navigation-link.is-active a {
	background: #2d3142;
	color: #fff;
}

/* Tableau des commandes */
.woocommerce-orders-table {
	border: 1px solid #ebebeb;
	border-radius: 6px;
	overflow: hidden;
	border-collapse: collapse;
	width: 100%;
}

.woocommerce-orders-table thead th {
	background: #2d3142;
	color: #fff;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	padding: 0.85rem 1rem;
	text-align: left;
}

.woocommerce-orders-table tbody tr:nth-child(even) {
	background: #f7f6f4;
}

.woocommerce-orders-table tbody td {
	padding: 0.85rem 1rem;
	border-bottom: 1px solid #ebebeb;
}

/* Espacement boutons "Voir" / "Voir la facture" — gap fonctionne en ligne (desktop)
   comme en colonne (mobile, voir flex-direction:column ci-dessous) */
.woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

/* Badges de statut */
.woocommerce-orders-table mark.order-status {
	display: inline-block;
	border-radius: 2rem;
	padding: 0.3rem 0.85rem;
	font-size: 0.8rem;
	font-weight: 600;
	background: #ebebeb;
	color: #555;
}

.woocommerce-orders-table mark.order-status.status-completed {
	background: #e3f3e8;
	color: #2e7d4f;
}

.woocommerce-orders-table mark.order-status.status-cancelled,
.woocommerce-orders-table mark.order-status.status-failed {
	background: #f1f1f1;
	color: #888;
}

.woocommerce-orders-table mark.order-status.status-pending,
.woocommerce-orders-table mark.order-status.status-on-hold,
.woocommerce-orders-table mark.order-status.status-processing {
	background: #f5ecd8;
	color: #8a6d1f;
}

/* Boutons d'action — "Voir" neutre, "Voir la facture" marine plein */
.woocommerce-orders-table .woocommerce-button {
	display: inline-block;
	border-radius: 4px;
	padding: 0.5rem 1rem;
	font-size: 0.85rem;
	font-weight: 500;
	text-decoration: none;
	margin: 0.15rem 0;
	transition: background 0.15s, color 0.15s;
}

.woocommerce-orders-table .woocommerce-button.view {
	background: #fff;
	border: 1px solid #ccc;
	color: #2d3142;
}

.woocommerce-orders-table .woocommerce-button.view:hover {
	border-color: #2d3142;
}

.woocommerce-orders-table .woocommerce-button.wc_pip_view_invoice {
	background: #c8a951;
	color: #2d3142;
	border: 1px solid #c8a951;
}

.woocommerce-orders-table .woocommerce-button.wc_pip_view_invoice:hover {
	background: #b8954a;
}

/* Pagination */
.woocommerce-pagination .button {
	border-radius: 4px;
	border: 1px solid #ccc;
	background: #fff;
	color: #2d3142;
	padding: 0.5rem 1.2rem;
}

/* Mobile : tableau en cartes empilées */
@media (max-width: 600px) {
	.woocommerce-MyAccount-navigation {
		margin-bottom: 1.5rem;
	}

	.woocommerce-orders-table thead {
		display: none;
	}

	.woocommerce-orders-table tbody tr {
		display: block;
		margin-bottom: 0.5rem;
		border-radius: 4px;
		overflow: hidden;
		border-bottom: 8px solid #f0f0f0;
	}

	.woocommerce-orders-table tbody td,
	.woocommerce-orders-table tbody th {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1rem;
		padding: 0.9rem 1rem;
		border-bottom: 1px solid #ebebeb;
		text-align: right;
	}

	/* woocommerce-smallscreen.css force display:none sur th (spécificité plus
	   élevée : 2 classes vs 1) — on doit forcer l'affichage */
	.woocommerce-orders-table tbody th {
		display: flex !important;
	}

	.woocommerce-orders-table tbody td::before,
	.woocommerce-orders-table tbody th::before {
		content: attr(data-title);
		font-weight: 600;
		color: #888;
		text-align: left;
	}

	.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions::before {
		display: none;
	}
}

/* =========================================================
   PAGE CONTACT
   ========================================================= */

.contact-page {
	padding-top: 3rem;
	padding-bottom: 4rem;
}

.contact-notice {
	padding: 1rem 1.25rem;
	margin-bottom: 2rem;
	border-radius: 3px;
	font-size: 0.95rem;
}

.contact-notice--success {
	background: #e6f4ea;
	color: #1e4620;
	border: 1px solid #b7dfc0;
}

.contact-notice--error {
	background: #fbeaea;
	color: #611a1a;
	border: 1px solid #f0b8b8;
}

.contact-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
}

@media (max-width: 1000px) {
	.contact-grid {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.contact-form-wrap {
		order: -1;
	}
}

.contact-info h2,
.contact-form-wrap h2 {
	font-size: 1.6rem;
	font-weight: 700;
	color: #2d3142;
	margin: 0 0 1.5rem;
}

.contact-info-item {
	display: flex;
	gap: 0.9rem;
	margin-bottom: 1.75rem;
	line-height: 1.6;
}

.contact-info-item svg {
	flex-shrink: 0;
	color: #2d3142;
	margin-top: 0.15rem;
}

.contact-info-item a {
	color: #2d3142;
	text-decoration: none;
}

.contact-info-item a:hover {
	text-decoration: underline;
}

.contact-form-honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.contact-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
}

@media (max-width: 480px) {
	.contact-form-row {
		grid-template-columns: 1fr;
	}
}

.contact-form-field {
	margin-bottom: 1.25rem;
}

.contact-form-field label {
	display: block;
	font-size: 0.9rem;
	font-weight: 600;
	color: #2d3142;
	margin-bottom: 0.4rem;
}

.contact-form-field .required {
	color: #b23b3b;
}

.contact-form-field input,
.contact-form-field select,
.contact-form-field textarea {
	width: 100%;
	padding: 0.65rem 0.75rem;
	border: 1px solid #ccc;
	border-radius: 3px;
	font-family: inherit;
	font-size: 0.95rem;
}

.contact-form-field input:focus,
.contact-form-field select:focus,
.contact-form-field textarea:focus {
	outline: none;
	border-color: #2d3142;
}

.atelier-form-optional {
	color: #6b7280;
	font-weight: 400;
}

.atelier-form-mention {
	font-size: 0.8rem;
	color: #6b7280;
	margin-top: 0.75rem;
	text-align: right;
}

.contact-form-submit {
	display: block;
	margin-left: auto;
	background: var(--savonnia-violet);
	color: #fff;
	border: none;
	padding: 0.75rem 2rem;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	border-radius: 3px;
	transition: background 0.15s;
}

.contact-form-submit:hover {
	background: #342c41;
}

.contact-form-submit:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* =========================================================
   PAGE INSCRIPTION
   ========================================================= */

.register-page {
	padding-top: 3rem;
	padding-bottom: 4rem;
}

.register-form-wrap {
	max-width: 480px;
	margin: 0 auto;
}

.register-form-wrap h1 {
	font-size: 1.6rem;
	font-weight: 700;
	color: #2d3142;
	margin: 0 0 1.5rem;
}

.register-form-hint {
	font-size: 0.85rem;
	color: #666;
	margin: -1rem 0 1.5rem;
}

.register-login-link {
	margin-top: 1.25rem;
	font-size: 0.9rem;
	text-align: center;
}

.register-login-link a {
	color: #2d3142;
	font-weight: 600;
}

/* Notice compte obligatoire — bloc "Coordonnées" du checkout (injectée en JS, voir savonnia.js) */
.checkout-account-notice {
	font-size: 0.9rem;
	color: #5c4423;
	line-height: 1.5;
	background: #fdf3e0;
	border-left: 3px solid #d99a3d;
	padding: 0.75rem 1rem;
	margin: 0.5rem 0 1.25rem;
}

/* Récap "Validation de la commande" : colonne Total réduite à son contenu
   réel pour laisser la place à la colonne Produit (évite le retour à la
   ligne sur les noms de savon longs dans le détail des coffrets) */
.woocommerce-table--order-details td.product-total,
.woocommerce-table--order-details th.product-total {
	white-space: nowrap;
	width: 1%;
}

/* Fiche produit — UGS/Catégories/Étiquettes sous le bouton "Ajouter au panier" :
   UGS en texte simple sur sa propre ligne, Catégories/Étiquettes en pilules. */
.product_meta {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	margin-top: 1.75rem;
	font-size: 0.9rem;
	color: #888;
}

.product_meta .posted_in,
.product_meta .tagged_as {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
}

.product_meta .posted_in a,
.product_meta .tagged_as a {
	background: #f7f6f4;
	border: 1px solid #e2e0da;
	border-radius: 999px;
	padding: 0.2rem 0.75rem;
	color: var(--savonnia-violet);
	text-decoration: none;
	font-size: 0.85rem;
}

.product_meta .posted_in a:hover,
.product_meta .tagged_as a:hover {
	background: var(--savonnia-violet);
	color: #fff;
}
