/*
Theme Name: La Tasse de Mon Village
Template: storefront
Description: Thème enfant Storefront — identité "village au trait" : vert olive, crème, logo village + cœur, formes arrondies.
Author: latassedemonvillage
Version: 1.8.0
Text Domain: latassedemonvillage
*/

/* ==========================================================================
   Palette & fondations
   ========================================================================== */

:root {
	--lmv-cream: #f2e9d8;
	--lmv-paper: #f9f4e8;
	--lmv-linen: #ece0c4;
	--lmv-sage: #e7e6da;
	--lmv-ink: #3d2c1e;
	--lmv-ink-soft: #6b5843;
	--lmv-brown: #4a3323;
	--lmv-copper: #1e4a2c;
	--lmv-copper-dark: #173524;
	--lmv-terracotta: #b35839;
	--lmv-line: #ddd0ac;
	--lmv-line-soft: rgba(30, 74, 44, 0.18);
	--lmv-gold: #d9a256;

	--lmv-font-heading: 'Fredoka', sans-serif;
	--lmv-font-display: 'Fraunces', Georgia, serif;
	--lmv-font-body: 'Nunito', sans-serif;
	--lmv-font-script: 'Kaushan Script', cursive;
}

body {
	background-color: var(--lmv-cream);
	color: var(--lmv-ink);
	font-family: var(--lmv-font-body);
	font-size: 17px;
	line-height: 1.65;
}

a {
	color: var(--lmv-copper);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

a:hover,
a:focus {
	color: var(--lmv-brown) !important;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--lmv-font-display);
	color: var(--lmv-copper);
	font-weight: 600;
	line-height: 1.2;
}

h1, .page-title { font-size: 2.4em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.3em; }

.lmv-script {
	font-family: var(--lmv-font-script);
	font-weight: 400;
	color: var(--lmv-brown);
}

blockquote {
	border-left: 3px solid var(--lmv-copper);
	color: var(--lmv-ink-soft);
	padding-left: 1.2em;
	font-style: italic;
}

hr {
	border: none;
	border-top: 2px solid var(--lmv-line);
	margin: 2.5em 0;
}

/* Filet ornemental avec petit cœur, utilisable entre sections. */
.lmv-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.8em;
	margin: 2em 0;
	color: var(--lmv-copper);
	font-size: 1.2em;
}
.lmv-divider::before,
.lmv-divider::after {
	content: '';
	flex: 1;
	height: 2px;
	background: var(--lmv-line);
}

/* Bandeau ruban (façon banderole) pour les accroches courtes. */
.lmv-ribbon {
	display: inline-block;
	background: var(--lmv-copper);
	color: #fff;
	font-family: var(--lmv-font-heading);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-align: center;
	padding: 0.9em 2.4em;
	clip-path: polygon(0% 0%, 100% 0%, 92% 50%, 100% 100%, 0% 100%, 8% 50%);
}

/* Badge circulaire (façon tampon). */
.lmv-badge-circle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 9em;
	height: 9em;
	border-radius: 50%;
	background: var(--lmv-copper);
	color: #fff;
	font-family: var(--lmv-font-heading);
	font-weight: 600;
	text-transform: uppercase;
	font-size: 0.85em;
	line-height: 1.3;
	padding: 1em;
	border: 2px dashed rgba(255, 255, 255, 0.5);
}

/* ==========================================================================
   En-tête du site
   ========================================================================== */

.site-header {
	background-color: var(--lmv-cream);
	border-bottom: 3px solid var(--lmv-copper);
}

.lmv-site-branding {
	display: flex;
	align-items: center;
}

.lmv-logo-link {
	display: flex;
	align-items: center;
	gap: 0.7em;
	text-decoration: none !important;
}

.lmv-logo-mark {
	width: 2.8em;
	height: auto;
	flex-shrink: 0;
}

.lmv-wordmark {
	display: flex;
	flex-direction: column;
	line-height: 1;
}

.lmv-wordmark__main {
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-size: 1.7em;
	color: var(--lmv-copper);
}

.lmv-wordmark__script {
	font-family: var(--lmv-font-script);
	font-weight: 400;
	font-size: 1.3em;
	color: var(--lmv-brown);
	margin-top: -0.1em;
}

.site-header .site-description {
	font-family: var(--lmv-font-script);
	color: var(--lmv-ink-soft);
	margin-left: 0.5em;
}

.main-navigation ul li a {
	font-family: var(--lmv-font-heading);
	font-weight: 600;
	text-transform: uppercase;
	font-size: 0.85em;
	letter-spacing: 0.04em;
	color: var(--lmv-brown);
}

.main-navigation ul li a:hover {
	color: var(--lmv-copper) !important;
}

.main-navigation ul li.current-menu-item > a {
	color: var(--lmv-copper) !important;
	box-shadow: 0 2px 0 0 var(--lmv-terracotta);
}

.storefront-primary-navigation,
.site-header-cart {
	background-color: transparent;
}

.site-header-cart .cart-contents {
	color: var(--lmv-copper);
	background-color: var(--lmv-paper);
	border: 2px solid var(--lmv-terracotta);
	border-radius: 12px;
	padding: 0.5em 1.1em;
	font-family: var(--lmv-font-heading);
	font-weight: 600;
}

.site-header-cart .cart-contents,
.site-header-cart .cart-contents .count,
.site-header-cart:hover .cart-contents,
.site-header-cart:hover .cart-contents .count,
.site-header-cart .cart-contents:hover,
.site-header-cart .cart-contents:hover .count {
	color: var(--lmv-copper) !important;
	opacity: 1 !important;
}

/* ==========================================================================
   Boutons — pleins, arrondis, chaleureux
   ========================================================================== */

.button,
button:not(.lmv-hero__dot):not(.lmv-hero__nav):not(.lmv-back-to-top),
input[type="button"],
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.wc-block-components-button {
	background-color: var(--lmv-copper) !important;
	border: none !important;
	color: #fff !important;
	font-family: var(--lmv-font-heading);
	font-weight: 600;
	letter-spacing: 0.01em;
	font-size: 1em;
	border-radius: 14px !important;
	box-shadow: 0 3px 10px rgba(71, 84, 44, 0.25) !important;
	transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.button:hover,
button:not(.lmv-hero__dot):not(.lmv-hero__nav):not(.lmv-back-to-top):hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.wc-block-components-button:hover {
	background-color: var(--lmv-copper-dark) !important;
	color: #fff !important;
	transform: translateY(-2px);
	box-shadow: 0 6px 14px rgba(71, 84, 44, 0.3) !important;
}

.button.alt,
.woocommerce a.button.alt {
	background-color: var(--lmv-brown) !important;
}

/* Répété avec le préfixe ".woocommerce" : la règle boutons pleins
   (".woocommerce a.button, .woocommerce button.button, ...") a une
   spécificité plus élevée qu'un simple ".lmv-btn-outline" et regagne sinon
   la priorité sur les pages WooCommerce (boutique, fiche produit) — le même
   piège que celui déjà documenté pour "a:hover" dans le footer. */
.lmv-btn-outline,
.woocommerce a.lmv-btn-outline,
.woocommerce button.lmv-btn-outline {
	background-color: transparent !important;
	color: var(--lmv-terracotta) !important;
	border: 2px solid var(--lmv-terracotta) !important;
	box-shadow: none !important;
}

.lmv-btn-outline:hover,
.woocommerce a.lmv-btn-outline:hover,
.woocommerce button.lmv-btn-outline:hover {
	background-color: var(--lmv-terracotta) !important;
	color: #fff !important;
	box-shadow: 0 6px 14px rgba(179, 88, 57, 0.25) !important;
}

/* ==========================================================================
   Formulaires (champs génériques + soumission photo LMV + checkout blocks)
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="file"],
input[type="search"],
textarea,
select,
.wc-block-components-text-input input,
.wc-block-components-textarea textarea {
	background-color: var(--lmv-paper) !important;
	border: 2px solid var(--lmv-line) !important;
	border-radius: 12px !important;
	color: var(--lmv-ink) !important;
	font-family: var(--lmv-font-body);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
	border-color: var(--lmv-copper) !important;
	outline: none;
}

label {
	font-family: var(--lmv-font-body);
	font-weight: 700;
	color: var(--lmv-ink-soft);
}

.lmv-submission-fields {
	background-color: var(--lmv-linen);
	border: none;
	border-radius: 18px;
	padding: 1.5em 1.7em;
	margin-bottom: 1.5em;
}

.lmv-submission-fields .form-row label {
	font-weight: 700;
	color: var(--lmv-ink);
	display: block;
	margin-bottom: 0.3em;
}

.lmv-submission-fields.lmv-consent,
.lmv-submission-fields .lmv-consent {
	font-size: 0.92em;
}

.lmv-submission-guidelines {
	background-color: var(--lmv-paper);
	border: 2px solid var(--lmv-line);
	border-radius: 14px;
	padding: 1em 1.3em;
	margin-bottom: 1.3em;
	font-size: 0.92em;
}

.lmv-submission-guidelines p {
	margin: 0 0 0.4em;
}

.lmv-submission-guidelines ul {
	margin: 0;
	padding-left: 1.2em;
	color: var(--lmv-ink-soft);
}

.lmv-rights-choice {
	background-color: var(--lmv-linen);
	border-radius: 14px;
	padding: 1.2em 1.4em;
}

.lmv-rights-choice p {
	margin: 0 0 0.6em;
}

.lmv-rights-option {
	display: block;
	margin-bottom: 0.6em;
	font-weight: 400;
}

.lmv-rights-option:last-child {
	margin-bottom: 0;
}

.lmv-rights-option input {
	margin-right: 0.5em;
}

/* ==========================================================================
   Boutique — grille produits
   ========================================================================== */

/* Grille (pas les flottants du thème parent) : sans ça, "height:100%" plus
   bas sur chaque carte ne veut rien dire (un flottant n'a pas de hauteur de
   ligne partagée) — les cartes avec un titre sur 2 lignes se retrouvaient
   plus hautes que celles sur 1 ligne, décalant le bouton "Ajouter au panier"
   d'une carte à l'autre sur une même rangée. La grille étire toutes les
   cartes d'une rangée à la même hauteur automatiquement. */
.woocommerce ul.products {
	display: grid;
	gap: 1.6em;
}

/* Storefront pose un clearfix ("::before"/"::after" en display:table, vide)
   sur ce même élément pour sa mise en page par flottants. En grille, ce
   pseudo-élément vide devient un item de grille à part entière : il prenait
   la 1re case invisible et décalait toutes les vraies cartes d'un cran,
   provoquant un retour à la ligne prématuré pour la dernière. */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none;
	display: none;
}

.woocommerce ul.products.columns-1 { grid-template-columns: repeat(1, 1fr); }
.woocommerce ul.products.columns-2 { grid-template-columns: repeat(2, 1fr); }
.woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, 1fr); }
.woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
.woocommerce ul.products.columns-5 { grid-template-columns: repeat(5, 1fr); }
.woocommerce ul.products.columns-6 { grid-template-columns: repeat(6, 1fr); }

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

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

.woocommerce ul.products li.product,
.woocommerce div.product {
	background-color: transparent;
}

.woocommerce ul.products li.product {
	/* Storefront fixe une largeur/marge en % + float sur cette même sélecteur
	   (ex. ".columns-4 li.product{width:21.7%;float:left;margin-right:4.3%}")
	   pour sa mise en page par flottants — annulé ici pour laisser la grille
	   ci-dessus gérer seule le placement des cartes. */
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	display: flex;
	flex-direction: column;
	height: 100%;
	background-color: var(--lmv-paper);
	border: none;
	border-radius: 18px;
	padding: 1.1em 1.1em 1.5em;
	box-shadow: 0 4px 14px rgba(74, 51, 35, 0.08);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.woocommerce ul.products li.product:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 22px rgba(74, 51, 35, 0.15);
}

/* Carte produit à taille fixe, quel que soit le nombre de lignes du titre :
   image en ratio carré, titre limité à 2 lignes, prix systématiquement en pied de carte. */
.woocommerce ul.products li.product a.woocommerce-loop-product__link {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.woocommerce ul.products li.product img,
.woocommerce div.product div.images img {
	background: #fff;
	border-radius: 12px;
}

.woocommerce ul.products li.product img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-family: var(--lmv-font-display);
	font-weight: 600;
	font-size: 1.2em;
	line-height: 1.3;
	margin-top: 0.7em;
	color: var(--lmv-ink);
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	color: var(--lmv-copper-dark);
}

.woocommerce ul.products li.product .price {
	margin-top: auto;
	padding-top: 0.4em;
}

.woocommerce ul.products li.product .star-rating {
	margin: 0.3em 0;
}

/* --- Bloc "Nouveautés" (WooCommerce Blocks) affiché dans le panier vide ---
   Le panier utilise le bloc Cart de WooCommerce ; sa section "panier vide"
   embarque un bloc "Produits les plus récents" (wp:woocommerce/product-new)
   qui génère un balisage différent de la grille boutique classique
   (".wc-block-grid__product" au lieu de "ul.products li.product") et
   n'hérite donc d'aucun des styles de carte ci-dessus. On reproduit ici le
   même habillage pour que ce listing reste visuellement intégré. */

.wc-block-grid__products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.6em;
}

.wc-block-grid.has-1-column .wc-block-grid__products { grid-template-columns: repeat(1, 1fr); }
.wc-block-grid.has-2-columns .wc-block-grid__products { grid-template-columns: repeat(2, 1fr); }
.wc-block-grid.has-3-columns .wc-block-grid__products { grid-template-columns: repeat(3, 1fr); }
.wc-block-grid.has-4-columns .wc-block-grid__products { grid-template-columns: repeat(4, 1fr); }
.wc-block-grid.has-5-columns .wc-block-grid__products { grid-template-columns: repeat(5, 1fr); }
.wc-block-grid.has-6-columns .wc-block-grid__products { grid-template-columns: repeat(6, 1fr); }

@media (max-width: 700px) {
	.wc-block-grid.has-2-columns .wc-block-grid__products,
	.wc-block-grid.has-3-columns .wc-block-grid__products,
	.wc-block-grid.has-4-columns .wc-block-grid__products,
	.wc-block-grid.has-5-columns .wc-block-grid__products,
	.wc-block-grid.has-6-columns .wc-block-grid__products {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 460px) {
	.wc-block-grid.has-2-columns .wc-block-grid__products,
	.wc-block-grid.has-3-columns .wc-block-grid__products,
	.wc-block-grid.has-4-columns .wc-block-grid__products,
	.wc-block-grid.has-5-columns .wc-block-grid__products,
	.wc-block-grid.has-6-columns .wc-block-grid__products {
		grid-template-columns: repeat(1, 1fr);
	}
}

.wc-block-grid__product {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	flex: none !important;
	margin: 0 !important;
	border: none !important;
	display: flex;
	flex-direction: column;
	height: 100%;
	background-color: var(--lmv-paper);
	border-radius: 18px;
	padding: 1.1em 1.1em 1.5em;
	box-shadow: 0 4px 14px rgba(74, 51, 35, 0.08);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.wc-block-grid__product:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 22px rgba(74, 51, 35, 0.15);
}

.wc-block-grid__product-link {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	color: inherit;
}

.wc-block-grid__product-image {
	width: 100%;
}

.wc-block-grid__product-image img {
	background: #fff;
	border-radius: 12px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.wc-block-grid__product-title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-family: var(--lmv-font-display);
	font-weight: 600;
	font-size: 1.2em;
	line-height: 1.3;
	margin-top: 0.7em;
	color: var(--lmv-ink);
}

.wc-block-grid__product-price.price {
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	color: var(--lmv-copper-dark);
	margin-top: auto;
	padding-top: 0.4em;
}

.wc-block-grid__product-add-to-cart {
	margin-top: 0.7em;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link {
	background-color: var(--lmv-copper) !important;
	border: none !important;
	color: #fff !important;
	font-family: var(--lmv-font-heading);
	font-weight: 600;
	border-radius: 14px !important;
	box-shadow: 0 3px 10px rgba(71, 84, 44, 0.25) !important;
	transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
	background-color: var(--lmv-copper-dark) !important;
	transform: translateY(-2px);
	box-shadow: 0 6px 14px rgba(71, 84, 44, 0.3) !important;
}

/* --- Carrousel photo dans la carte produit (plusieurs photos d'une tasse) --- */

.lmv-product-carousel {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 12px;
	overflow: hidden;
	background: #fff;
}

.lmv-product-carousel__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.6s ease;
}

.lmv-product-carousel__img.is-active {
	opacity: 1;
}

.lmv-product-carousel__dots {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0.6em;
	display: flex;
	justify-content: center;
	gap: 0.35em;
}

.lmv-product-carousel__dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.65);
	box-shadow: 0 0 0 1px rgba(74, 51, 35, 0.25);
	transition: background 0.3s ease, transform 0.3s ease;
}

.lmv-product-carousel__dot.is-active {
	background: var(--lmv-terracotta);
	transform: scale(1.2);
}

.woocommerce span.onsale {
	background-color: var(--lmv-brown);
	font-family: var(--lmv-font-heading);
	text-transform: uppercase;
	font-size: 0.75em;
	border-radius: 999px;
}

/* --- Introduction de la page boutique --- */

.lmv-shop-intro {
	text-align: center;
	max-width: 620px;
	margin: 0 auto 1.2em;
}

/* Storefront ajoute un grand padding-bottom sur cet en-tête de boutique
   (titre + intro) — réduit pour resserrer l'espace avant la recherche. */
.woocommerce-products-header {
	padding-bottom: 1.5em;
}

.lmv-shop-intro .lmv-ribbon {
	font-size: 1.05em;
}

/* --- Recherche produit (remplace le tri / nombre de résultats) --- */

.lmv-shop-search {
	max-width: 420px;
	margin: 0 auto 1.2em;
}

.lmv-shop-search__field {
	position: relative;
}

.lmv-shop-search__field > svg {
	position: absolute;
	top: 50%;
	left: 1.1em;
	transform: translateY(-50%);
	width: 1.1em;
	height: 1.1em;
	color: var(--lmv-ink-soft);
	pointer-events: none;
}

.lmv-shop-search .woocommerce-product-search {
	display: flex;
	gap: 0.5em;
}

.lmv-shop-search input.search-field {
	flex: 1 1 auto;
	padding: 0.75em 1em 0.75em 2.6em !important;
	border-radius: 999px !important;
}

/* Bouton "Recherche" masqué : la recherche se déclenche déjà en direct dès 4
   caractères (voir live-search.js). Il reste dans le DOM comme bouton de
   soumission implicite du formulaire (repli clavier "Entrée" si JS échoue). */
.lmv-shop-search button {
	display: none;
}

.lmv-shop-search__hint {
	margin: 0.6em 0 0;
	text-align: center;
	font-size: 0.85em;
	color: var(--lmv-ink-soft);
}

/* Recherche "en direct" : léger fondu pendant le chargement d'une nouvelle
   grille de résultats, pour indiquer qu'une recherche est en cours. */
#lmv-shop-results.is-loading {
	opacity: 0.45;
	transition: opacity 0.15s ease;
}

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

div.product .woocommerce-product-gallery__image {
	border: none;
	border-radius: 18px;
	overflow: hidden;
}

.woocommerce-product-gallery__trigger {
	background: var(--lmv-paper) !important;
	border: 2px solid var(--lmv-copper) !important;
	border-radius: 50% !important;
	color: var(--lmv-copper) !important;
}

div.product .product_title {
	margin-bottom: 0.2em;
}

div.product p.price,
div.product span.price {
	font-size: 1.4em;
}

/* --- Rappels entretien / don projets de préservation du patrimoine --- */

.lmv-product-facts {
	list-style: none;
	margin: 1.3em 0;
	padding: 1em 1.3em;
	background-color: var(--lmv-paper);
	border: 2px solid var(--lmv-line);
	border-radius: 14px;
}

.lmv-product-facts li {
	display: flex;
	align-items: flex-start;
	gap: 0.7em;
	font-size: 0.92em;
	color: var(--lmv-ink-soft);
}

.lmv-product-facts li + li {
	margin-top: 0.7em;
}

.lmv-product-facts__icon {
	flex: 0 0 auto;
	width: 1.4em;
	height: 1.4em;
	color: var(--lmv-copper);
	margin-top: 0.1em;
}

.lmv-product-facts__icon svg {
	width: 100%;
	height: 100%;
}

.product_meta {
	margin-top: 2em;
	padding-top: 1em;
	border-top: 2px solid var(--lmv-line);
	font-weight: 700;
	color: var(--lmv-ink-soft);
}

.product_meta a {
	color: var(--lmv-copper);
}

/* --- Onglets (description / avis) --- */

.woocommerce-tabs ul.tabs {
	border-bottom: 2px solid var(--lmv-line);
	margin: 2.5em 0 1.5em;
	padding-left: 0;
}

.woocommerce-tabs ul.tabs li {
	font-family: var(--lmv-font-heading);
	font-weight: 600;
	text-transform: uppercase;
	font-size: 1em;
	letter-spacing: 0.02em;
}

.woocommerce-tabs ul.tabs li a {
	color: var(--lmv-ink);
}

.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover {
	color: var(--lmv-copper);
}

.woocommerce-tabs ul.tabs li.active {
	border-color: var(--lmv-copper) !important;
}

.woocommerce-Tabs-panel h2 {
	margin-top: 0;
}

/* --- Avis --- */

.star-rating span::before {
	color: var(--lmv-gold);
}

#reviews #comments ol.commentlist li .comment-text {
	border: none;
	background: var(--lmv-paper);
	border-radius: 14px;
	padding: 1em 1.3em;
}

/* --- Produits liés --- */

.related.products {
	margin-top: 3em;
	padding-top: 2em;
	border-top: 2px solid var(--lmv-line);
	text-align: center;
}

.related.products > h2 {
	margin-bottom: 1.5em;
}

/* ==========================================================================
   Pied de page
   ========================================================================== */

.site-footer,
footer.site-footer {
	background-color: var(--lmv-copper);
	color: #fff;
}

.site-footer a {
	color: #fff;
}

.site-footer .widget-title {
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
}

.lmv-footer {
	display: flex;
	flex-wrap: wrap;
	gap: 2.5em;
	padding: 3em 0 2.5em;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.lmv-footer__col {
	flex: 1 1 200px;
}

.lmv-footer__brand {
	flex: 1 1 260px;
}

.lmv-footer__logo {
	display: flex;
	align-items: center;
	gap: 0.7em;
	margin-bottom: 0.9em;
}

.lmv-footer__logo img {
	flex-shrink: 0;
	/* Le trait brun du logo est illisible sur le fond vert forêt du footer : on le passe en blanc. */
	filter: brightness(0) invert(1);
}

.lmv-footer__brand-main {
	display: block;
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 1.3em;
	color: #fff;
	line-height: 1;
}

.lmv-footer__brand-script {
	display: block;
	font-family: var(--lmv-font-script);
	font-size: 1.15em;
	color: #fff;
	margin-top: 0.15em;
}

.lmv-footer__tagline {
	color: #fff;
	max-width: 32ch;
	margin: 0 0 1.2em;
}

.lmv-footer__socials {
	display: flex;
	gap: 0.7em;
}

.lmv-footer__socials a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.2em;
	height: 2.2em;
	border-radius: 50%;
	border: 1.5px solid rgba(255, 255, 255, 0.5);
	opacity: 1 !important;
}

.lmv-footer__socials svg {
	width: 1.1em;
	height: 1.1em;
}

.lmv-footer__made {
	flex: 0 1 140px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.7em;
}

.lmv-footer__made-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4em;
	height: 4em;
	border-radius: 50%;
	border: 1.5px solid rgba(255, 255, 255, 0.5);
}

.lmv-footer__made-badge svg {
	width: 1.6em;
	height: 1.6em;
}

.lmv-footer__made p {
	margin: 0;
	font-size: 0.9em;
}

.lmv-footer h3 {
	color: #fff;
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 1em;
	letter-spacing: 0.03em;
	margin: 0 0 1em;
}

.lmv-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.lmv-footer li {
	margin-bottom: 0.6em;
}

.lmv-footer a {
	color: #fff !important;
	text-decoration: none;
	opacity: 0.85;
}

.lmv-footer a:hover {
	color: #fff !important;
	text-decoration: underline;
	opacity: 1;
}

.site-footer .site-info {
	color: #fff;
	padding: 1.5em 0;
	font-size: 0.9em;
}

.site-footer .site-info a {
	color: #fff !important;
}

@media (max-width: 600px) {
	.lmv-footer {
		flex-direction: column;
		gap: 2em;
	}
}

/* ==========================================================================
   Filigrane de protection sur les photos affichées publiquement
   ========================================================================== */

.woocommerce ul.products li.product a.woocommerce-loop-product__link,
div.product .woocommerce-product-gallery__image {
	position: relative;
	display: block;
	overflow: hidden;
}

.lmv-village-card {
	position: relative;
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link::after,
div.product .woocommerce-product-gallery__image::after,
.lmv-village-card::before {
	content: 'latassedemonvillage.com';
	position: absolute;
	left: -25%;
	width: 150%;
	text-align: center;
	transform: rotate(-16deg);
	font-family: var(--lmv-font-heading);
	font-weight: 700;
	font-size: 0.8em;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.8);
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
	background: rgba(21, 50, 33, 0.32);
	padding: 0.3em 0;
	pointer-events: none;
	z-index: 2;
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link::after,
div.product .woocommerce-product-gallery__image::after {
	top: 42%;
}

.lmv-village-card::before {
	top: 2.6em;
}

/* ==========================================================================
   Notices WooCommerce
   ========================================================================== */

.woocommerce-message,
.woocommerce-info,
.wc-block-components-notice-banner.is-success {
	border-top-color: var(--lmv-copper) !important;
	background-color: var(--lmv-linen) !important;
	color: var(--lmv-ink) !important;
	border-radius: 12px !important;
}

.woocommerce-error,
.wc-block-components-notice-banner.is-error {
	border-top-color: #a3432e !important;
	border-radius: 12px !important;
}

.lmv-search-no-results {
	background-color: var(--lmv-linen);
	border-top: 4px solid var(--lmv-copper);
	border-radius: 12px;
	padding: 1.3em 1.6em;
	margin-bottom: 1.5em;
}

.lmv-search-no-results p {
	margin: 0;
	font-weight: 700;
	color: var(--lmv-ink);
}

/* Grille de secours (une seule carte produit) affichée sous l'invitation
   ci-dessus : la grille boutique standard aligne à gauche, on la centre ici. */
.lmv-search-fallback ul.products {
	display: flex;
	justify-content: center;
}

.lmv-search-fallback ul.products li.product {
	width: min(280px, 100%);
}

/* ==========================================================================
   Bouton "remonter en haut"
   ========================================================================== */

.lmv-back-to-top {
	position: fixed;
	right: 1.4em;
	bottom: 1.4em;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--lmv-copper);
	color: #fff;
	border: none;
	border-radius: 50%;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
	z-index: 100;
}

.lmv-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.lmv-back-to-top:hover,
.lmv-back-to-top:focus {
	background-color: var(--lmv-copper-dark);
	color: #fff !important;
}

.lmv-back-to-top svg {
	width: 22px;
	height: 22px;
	flex-shrink: 0;
}

@media (max-width: 480px) {
	.lmv-back-to-top {
		right: 1em;
		bottom: 1em;
		width: 44px;
		height: 44px;
	}
}
