/* ============================================================
   L'essentiel — WooCommerce : habillage des éléments WC natifs
   (formulaire de variation, tri, filtres, notices) à la charte.
   Chargé uniquement sur les pages boutique.
   ============================================================ */

/* ---------- Filtres : liens famille (.filter-link) ---------- */
.filter-list .filter-link {
  display: flex; align-items: center; gap: 11px;
  font-size: 0.9rem; color: var(--color-ink-soft);
  padding: 3px 0; transition: color .2s ease;
}
.filter-list .filter-link:hover { color: var(--color-terracotta); }
.filter-list .filter-link.is-active { color: var(--color-terracotta); font-weight: 500; }
.filter-list .filter-link .count { margin-left: auto; font-size: 0.76rem; color: var(--color-ink-muted); }
.filter-list .filter-link .count.soon { font-style: italic; }

/* ---------- Tri WooCommerce (.woocommerce-ordering) ---------- */
.shop-tools .woocommerce-ordering { margin: 0; }
.woocommerce-ordering select,
.shop-tools select {
  font-family: var(--font-body); font-size: 0.85rem; color: var(--color-foret);
  border: 1px solid rgba(44, 56, 48, 0.2); border-radius: var(--radius-card);
  padding: 9px 34px 9px 13px; cursor: pointer; outline: none;
  appearance: none; -webkit-appearance: none; background-color: var(--color-creme-soft);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%232C3830' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}

/* ---------- Formulaire d'achat (variations) ---------- */
.product-summary form.cart { margin: 0 0 26px; }

/* Variations en pastilles : on masque le <table> WC, on garde le rendu .ps-* du kit. */
.variations_form .ps-hidden-variations { display: none !important; }
.product-summary .ps-variations { margin: 0 0 22px; }
.product-summary .ps-variations .ps-attr { margin-bottom: 18px; }
.product-summary .ps-variations .ps-attr-label { display: block; margin-bottom: 10px; }
.product-summary .variations { width: 100%; border-collapse: collapse; margin-bottom: 18px; }
.product-summary .variations tr { display: block; margin-bottom: 16px; }
.product-summary .variations th,
.product-summary .variations td { display: block; text-align: left; padding: 0; }
.product-summary .variations .label label {
  font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--color-ink-muted); margin-bottom: 8px; display: block;
}
.product-summary .variations td.value select {
  width: 100%; font-family: var(--font-body); font-size: 0.9rem; color: var(--color-foret);
  border: 1px solid rgba(44, 56, 48, 0.2); border-radius: var(--radius-card);
  padding: 13px 38px 13px 15px; cursor: pointer; outline: none;
  appearance: none; -webkit-appearance: none; background-color: var(--color-creme-soft);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%232C3830' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center;
}
.product-summary .reset_variations {
  display: inline-block; margin: 4px 0 10px; font-size: 0.78rem;
  color: var(--color-ink-muted); text-decoration: underline;
}
.product-summary .woocommerce-variation-price { margin: 10px 0 18px; }
.product-summary .woocommerce-variation-price .price { font-family: var(--font-display); font-size: 1.8rem; color: var(--color-terracotta); }
.product-summary .woocommerce-variation-availability { font-size: 0.82rem; color: var(--color-ink-muted); }

/* Ligne quantité + bouton (calquée sur .ps-buy) */
.product-summary .woocommerce-variation-add-to-cart,
.product-summary .single_variation_wrap .woocommerce-variation-add-to-cart {
  display: flex; align-items: stretch; gap: 14px; flex-wrap: wrap; margin-top: 6px;
}
.product-summary .quantity {
  display: inline-flex; align-items: center;
  border: 1px solid rgba(44, 56, 48, 0.2); border-radius: var(--radius-card); overflow: hidden;
}
.product-summary .quantity .qty {
  width: 64px; text-align: center; border: 0; outline: none; background: transparent;
  font-family: var(--font-body); font-size: 1rem; color: var(--color-foret); padding: 14px 6px;
  -moz-appearance: textfield;
}
.product-summary .quantity .qty::-webkit-outer-spin-button,
.product-summary .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.woocommerce .product-summary .ps-buy-wrap .single_add_to_cart_button,
.woocommerce-page .product-summary .single_add_to_cart_button.button {
  flex: 1; min-width: 220px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  background-color: var(--color-foret); color: var(--color-creme);
  font-family: var(--font-body); font-size: 0.86rem; letter-spacing: 0.06em; font-weight: 400;
  border: 0; border-radius: var(--radius-pill); padding: 16px 30px; cursor: pointer;
  text-transform: none; text-decoration: none;
  transition: background-color .25s ease, transform .15s ease;
}
.woocommerce .product-summary .ps-buy-wrap .single_add_to_cart_button:hover,
.woocommerce-page .product-summary .single_add_to_cart_button.button:hover { background-color: var(--color-terracotta); color: var(--color-creme); }
.woocommerce .product-summary .ps-buy-wrap .single_add_to_cart_button:active { transform: translateY(1px); }
.product-summary .single_variation .price { font-family: var(--font-display); font-size: 1.6rem; color: var(--color-terracotta); }

/* ---------- Notices WooCommerce (erreur / info / succès) ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  position: relative; list-style: none; margin: 0 0 22px;
  padding: 15px 18px 15px 48px; border-radius: var(--radius-card);
  border: 1px solid transparent; border-left-width: 3px;
  font-family: var(--font-body); font-size: 0.86rem; line-height: 1.55;
}
.woocommerce-message { background: rgba(125, 184, 125, 0.14); border-color: var(--color-vert); color: var(--color-foret); display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.woocommerce-info { background: var(--color-creme-deep); border-color: var(--color-sable); color: var(--color-foret); }
.woocommerce-error { background: rgba(198, 123, 92, 0.1); border-color: var(--color-terracotta); color: var(--color-terracotta-deep); }

/* Picto propre, aligné (remplace l'icône police WooCommerce qui chevauchait le texte). */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  content: ""; position: absolute; left: 15px; top: 15px; width: 19px; height: 19px;
  line-height: 19px; text-align: center; border-radius: 50%; padding: 0; margin: 0;
  font-size: 12px; font-weight: 700; font-family: var(--font-body); color: #fff;
}
.woocommerce-message::before { content: "\2713"; background: var(--color-vert); color: var(--color-foret); }
.woocommerce-info::before { content: "i"; background: var(--color-sable); color: var(--color-foret); }
.woocommerce-error::before { content: "!"; background: var(--color-terracotta); }

/* Liste d'erreurs : une par ligne, séparées finement (au lieu du flux inline cramé). */
.woocommerce-error li { margin: 0; padding: 4px 0; }
.woocommerce-error li + li { border-top: 1px solid rgba(198, 123, 92, 0.16); }

.woocommerce-message .button,
.woocommerce-message .wc-forward,
.woocommerce-error .button {
  margin-left: auto; background: var(--color-foret); color: var(--color-creme) !important;
  padding: 9px 18px; border-radius: var(--radius-pill); font-size: 0.8rem; text-decoration: none; border: 0;
}

/* ---------- Galerie : repli sans miniatures ---------- */
.product-gallery .pg-stage img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- État vide boutique ---------- */
.shop-empty { padding: 40px 0; color: var(--color-ink-muted); font-size: 0.95rem; }

/* ============================================================
   Panier : neutraliser les styles par défaut de WooCommerce (la maquette
   ne charge QUE le kit) et restituer le rendu du kit. woo.css charge après
   le CSS WC ; on prend assez de spécificité pour battre `.woocommerce table.shop_table`.
   ============================================================ */
.cart-page table.shop_table,
.woocommerce .cart-page table.shop_table {
  border: 0; border-radius: 0; border-collapse: collapse; border-spacing: 0; margin: 0; background: transparent;
}
/* Tableau des articles : en-têtes + cellules au rendu kit */
.cart-page table.shop_table.cart thead th {
  border-top: 0; border-bottom: 1px solid rgba(44, 56, 48, 0.14);
  padding: 0 0 16px; font-weight: 400; line-height: 1.4;
}
.cart-page table.shop_table.cart td {
  border-top: 0; padding: 22px 0; line-height: 1.5; background: transparent;
}
.cart-page table.shop_table.cart .cart_item td { border-bottom: 1px solid rgba(44, 56, 48, 0.1); }
/* Récapitulatif : cellules sans bordure/padding WC */
.cart-page .cart_totals table.shop_table td,
.cart-page .cart_totals table.shop_table th { border-top: 0; padding: 12px 0; }

/* Bouton supprimer (×) : cercle du kit, on annule le rouge + position absolue WC. */
.cart-page a.remove.ci-remove,
.woocommerce .cart-page td.product-remove a.remove {
  position: static; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  border: 1px solid rgba(44, 56, 48, 0.18); background: transparent;
  color: var(--color-ink-muted) !important; font-size: 1rem; font-weight: 400; line-height: 1;
}
.cart-page a.remove.ci-remove:hover,
.woocommerce .cart-page td.product-remove a.remove:hover {
  background: var(--color-terracotta) !important; border-color: var(--color-terracotta); color: #fff !important;
}

/* ---------- Vignette d'article au panier ---------- */
.cart .ci-thumb { display: block; width: 72px; height: 72px; border-radius: var(--radius-card); overflow: hidden; background: var(--color-creme-deep); flex-shrink: 0; }
.cart .ci-thumb img,
.cart .product-name .cart-item-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Le <td> reste une cellule de tableau (sinon les colonnes se désalignent des
   en-têtes) : on flexe un wrapper interne .ci-row, pas la cellule elle-même.
   Scopé au desktop pour ne pas casser le responsive (mobile = max-width 720px). */
.cart .cart_item .product-name .ci-row { display: flex; align-items: center; gap: 18px; }
@media (min-width: 721px) {
	.cart .cart_item td.product-name { display: table-cell; vertical-align: middle; }
}

/* ---------- Cases & radios WooCommerce à la charte (au lieu du violet par défaut) ---------- */
.woocommerce-page input[type="radio"],
.woocommerce-page input[type="checkbox"],
.woocommerce input[type="radio"],
.woocommerce input[type="checkbox"] { accent-color: var(--color-foret); }

/* ---------- Récapitulatif panier : tableau + livraison ---------- */
/* WooCommerce force .cart-collaterals .cart_totals à width:48%;float:right
   → on le remet à 100 % pour qu'il remplisse sa colonne de grille. */
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals { width: 100%; float: none; }
/* Colonne label : se rétracte à son contenu (évite « Sous-total » coupé sur 2 lignes). */
.cart_totals .shop_table th { white-space: nowrap; width: 1%; padding-right: 16px; }
.cart_totals .shop_table td { vertical-align: top; }
/* Liste des méthodes de livraison, compacte et lisible. */
.cart_totals .woocommerce-shipping-methods { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.cart_totals .woocommerce-shipping-methods li { display: flex; align-items: flex-start; gap: 8px; font-size: 0.84rem; line-height: 1.4; color: var(--color-foret); text-align: left; }
.cart_totals .woocommerce-shipping-methods li input { margin-top: 3px; flex-shrink: 0; }
.cart_totals .woocommerce-shipping-methods li label { display: inline; cursor: pointer; white-space: normal; }
.cart_totals .woocommerce-shipping-methods .amount { font-weight: 500; white-space: nowrap; }
/* Messages d'estimation / calculateur : superflus dans cette sidebar. */
.cart_totals .woocommerce-shipping-destination,
.cart_totals .shipping-calculator-button,
.cart_totals .shipping-calculator-form { display: none; }

/* ---------- Notice d'ajout au panier ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notices-wrapper .wc-block-components-notice-banner {
  font-family: var(--font-body);
}
.woocommerce-message {
  background: rgba(125, 184, 125, 0.16); border-color: var(--color-vert);
  color: var(--color-foret); font-size: 0.9rem; padding: 15px 20px 15px 48px;
}
.woocommerce-message .button,
.woocommerce-message .wc-forward {
  margin-left: auto; background: var(--color-foret); color: var(--color-creme) !important;
  padding: 10px 20px; border-radius: var(--radius-pill); font-size: 0.8rem;
  letter-spacing: 0.04em; text-decoration: none; border: 0; transition: background-color .2s ease;
}
.woocommerce-message .button:hover,
.woocommerce-message .wc-forward:hover { background: var(--color-terracotta); color: var(--color-creme) !important; }

/* ============================================================
   Tunnel d'achat — bridge du markup WooCommerce vers le kit
   ============================================================ */

/* ============================================================
   Checkout : neutraliser les défauts WooCommerce (idem panier — la maquette
   ne charge que le kit). woo.css charge après le CSS WC.
   ============================================================ */
/* Tableau récap (review order) : pas de cadre, pas d'en-tête Produit/Sous-total */
.checkout-page table.shop_table,
.woocommerce .checkout-page table.shop_table {
  border: 0; border-radius: 0; border-collapse: collapse; border-spacing: 0; margin: 0 0 22px; background: transparent;
}
.checkout-page .woocommerce-checkout-review-order-table thead { display: none; }
.checkout-page .woocommerce-checkout-review-order-table td,
.checkout-page .woocommerce-checkout-review-order-table th { border-top: 0; }
.checkout-page .woocommerce-checkout-review-order-table .cart_item td { border-bottom: 1px solid rgba(44, 56, 48, 0.1); padding: 14px 0; }

/* Paiement : annuler le fond lavande WC */
.checkout-page #payment,
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.checkout-page #payment ul.payment_methods { border: 0; padding: 0; }
.checkout-page #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
  background: var(--color-creme-deep); color: var(--color-foret);
  border-radius: var(--radius-card); margin: 12px 0; box-shadow: none;
}
.checkout-page #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before { display: none; }

/* Zone « commander » : le .place-order WC est un <div> form-row → on annule le
   fond vert (réservé au bouton #place_order). */
.checkout-page div.place-order,
.woocommerce-checkout div.place-order {
  background: transparent; color: var(--color-foret); padding: 0; border: 0;
}

/* Méthodes de paiement : chaque option (Stripe, COD…) dans une carte cohérente.
   ⚠️ Le <input> radio est un FRÈRE du <label> (pas dedans) → on met le <li> en
   flex pour les aligner sur une ligne, et le .payment_box passe en pleine largeur. */
.checkout-page #payment ul.payment_methods { display: flex; flex-direction: column; gap: 10px; }
.checkout-page #payment ul.payment_methods > li.wc_payment_method {
  border: 1px solid rgba(44, 56, 48, 0.14); border-radius: var(--radius-card); overflow: hidden;
  background: transparent; display: flex; flex-wrap: wrap; align-items: center; padding: 14px 16px;
}
.checkout-page #payment ul.payment_methods > li.wc_payment_method > input[type="radio"] {
  order: 0; margin: 0 10px 0 0; accent-color: var(--color-foret); width: 16px; height: 16px; flex-shrink: 0;
}
.checkout-page #payment ul.payment_methods > li.wc_payment_method > label {
  order: 1; flex: 1 1 auto; margin: 0; display: flex; align-items: center; gap: 8px;
  font-size: 0.9rem; color: var(--color-foret); cursor: pointer;
}
.checkout-page #payment ul.payment_methods > li.wc_payment_method > label img { margin-left: auto; max-height: 24px; width: auto; }
.checkout-page #payment ul.payment_methods > li.wc_payment_method:has(> input:checked) {
  border-color: var(--color-foret); background: rgba(125, 184, 125, 0.06);
}
.checkout-page #payment ul.payment_methods > li.wc_payment_method > .payment_box {
  order: 2; flex: 0 0 100%; margin: 10px 0; padding: 18px 16px;
  background: transparent; border: none !important; border-radius: 0;
}

/* ---------- Widget Stripe (Payment Element) ----------
   Le champ carte est un iframe Stripe cross-origin : sa typo n'est PAS
   atteignable en CSS. Le plugin construit l'« appearance » Stripe en lisant
   les styles calculés de la page (input de référence + 1er <label> + boîte de
   paiement). On cale donc CES références sur notre typo pour que Stripe la
   recopie : input de référence Stripe + inputs du checkout = 0.85rem Montserrat. */
.checkout-page #wc-stripe-hidden-style-input,
.checkout-page #wc-stripe-upe-form .input-text {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  color: var(--color-ink) !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(44, 56, 48, 0.2) !important;
  border-radius: 10px !important;
  background: #fff !important;
}
/* Le <fieldset> Stripe : pleine largeur, sans marges/bordures parasites du thème
   (corrige l'espace vide à droite). On ne touche PAS aux nœuds internes Stripe
   (.StripeElement / .__PrivateStripeElement) sous peine de casser le rendu. */
.checkout-page #wc-stripe-upe-form { margin: 0; padding: 0; border: 0; min-width: 0; }
.checkout-page .wc-stripe-upe-element { width: 100%; }

/* Notice « Mode test » : fine print thémée, alignée sur le reste du checkout. */
.checkout-page .payment_box .testmode-info {
  font-family: var(--font-body); font-size: 0.72rem; line-height: 1.65;
  color: var(--color-ink-muted); margin: 0 0 14px;
}
.checkout-page .payment_box .testmode-info strong { color: var(--color-foret); font-weight: 600; }
.checkout-page .payment_box .testmode-info a { color: var(--color-sauge); text-decoration: underline; }
.checkout-page .payment_box .wc-stripe-copy-test-number {
  font-family: var(--font-body); font-size: 0.72rem; color: var(--color-foret);
  background: #fff; border: 1px solid rgba(44, 56, 48, 0.15); border-radius: 5px;
  padding: 1px 6px; margin: 0 2px; cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
}
.checkout-page .payment_box .wc-stripe-copy-test-number:hover { border-color: var(--color-sauge); }

/* Toggle coupon en haut du checkout : absent de la maquette (coupon = panier). */
.checkout-page .woocommerce-form-coupon-toggle,
.woocommerce-checkout .woocommerce-form-coupon-toggle { display: none; }

/* Récap : nom + quantité + meta lisibles */
.checkout-page .woocommerce-checkout-review-order-table .product-name { color: var(--color-foret); line-height: 1.5; }
.checkout-page .woocommerce-checkout-review-order-table .product-name .product-quantity { font-weight: 400; color: var(--color-ink-muted); }
.checkout-page .woocommerce-checkout-review-order-table .variation { margin-top: 4px; }

/* Récap checkout : typographie (valeurs WC = .woocommerce-Price-amount, pas .price). */
.checkout-page table.woocommerce-checkout-review-order-table tfoot th { font-size: 0.85rem; font-weight: 400; color: var(--color-ink-soft); }
.checkout-page table.woocommerce-checkout-review-order-table tfoot td { font-size: 0.95rem; font-weight: 400; }
.checkout-page .woocommerce-checkout-review-order-table tfoot td .woocommerce-Price-amount,
.checkout-page .woocommerce-checkout-review-order-table tfoot td .price { font-family: var(--font-display); color: var(--color-foret); font-weight: 400; }
.checkout-page .woocommerce-checkout-review-order-table tfoot small { font-size: 0.7rem; color: var(--color-ink-muted); font-weight: 400; }
.checkout-page table.woocommerce-checkout-review-order-table .order-total th { font-size: 0.95rem; font-weight: 400; color: var(--color-foret); }
.checkout-page .woocommerce-checkout-review-order-table .order-total td,
.checkout-page .woocommerce-checkout-review-order-table .order-total td .woocommerce-Price-amount,
.checkout-page .woocommerce-checkout-review-order-table .order-total .total-price { font-family: var(--font-display); font-size: 1.5rem; color: var(--color-foret); }

/* Suffixe TVA du total (« (dont X € TVA) ») : fine print sur sa propre ligne,
   JAMAIS repris en gros display (sinon ça déborde). Cart + checkout. */
.cart-page .order-total td .includes_tax,
.checkout-page .order-total td .includes_tax,
.cart-page .order-total td .includes_tax .woocommerce-Price-amount,
.checkout-page .order-total td .includes_tax .woocommerce-Price-amount {
  font-family: var(--font-body) !important;
  font-size: 0.72rem !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
  color: var(--color-ink-muted) !important;
}
.cart-page .order-total td .includes_tax,
.checkout-page .order-total td .includes_tax { display: block; margin-top: 5px; }

/* Mention de confidentialité au-dessus du bouton : fine print (sinon hérite du 1rem). */
.checkout-page .woocommerce-privacy-policy-text,
.checkout-page .woocommerce-privacy-policy-text p,
.woocommerce-checkout .woocommerce-privacy-policy-text p {
  font-size: 0.76rem; line-height: 1.6; color: var(--color-ink-muted); margin: 14px 0;
}

/* Checkout : wrappers WC billing/shipping en cartes (comme .checkout-card) */
.checkout .woocommerce-billing-fields,
.checkout .woocommerce-shipping-fields,
.checkout .woocommerce-account-fields,
.checkout .woocommerce-additional-fields {
  background: var(--color-creme-soft); border: 1px solid rgba(44, 56, 48, 0.08);
  border-radius: 12px; padding: 28px 26px;
}
.checkout #customer_details > .col-1,
.checkout #customer_details > .col-2 { display: flex; flex-direction: column; gap: 24px; }
.checkout .woocommerce-billing-fields h3,
.checkout .woocommerce-shipping-fields h3,
.checkout .woocommerce-additional-fields h3 {
  font-family: var(--font-display); font-size: 1.25rem; color: var(--color-foret); margin: 0 0 20px;
}
.checkout .woocommerce-shipping-fields { margin-top: 24px; }
/* Espacement des champs : pas de margin-bottom sur les rangées, le row-gap de
   la grille suffit (sinon gap + margin = double espace). */
.checkout .form-row { margin: 0; }
.checkout .form-row-grid { gap: 6px 14px; }
/* Note B2B (SIRET / TVA) dans la grille « Mes coordonnées » : pleine largeur. */
.form-row-grid .form-section-hint {
  grid-column: 1 / -1; margin: -2px 0 2px;
  font-size: 0.74rem; line-height: 1.5; color: var(--color-ink-muted);
}
.checkout .form-row label { display: block; font-size: 0.8rem; color: var(--color-ink-soft); margin-bottom: 6px; }
.checkout .form-row .required { color: var(--color-terracotta); text-decoration: none; }
.checkout .form-row input.input-text,
.checkout .form-row textarea,
.checkout .form-row .select2-container,
.checkout .form-row select {
  width: 100%; padding: 13px 15px; border: 1px solid rgba(44, 56, 48, 0.2);
  border-radius: var(--radius-card); font-family: var(--font-body); font-size: 0.9rem;
  background: #fff; color: var(--color-ink);
}

/* Bouton "Commander et payer" (WC #place_order) */
.woocommerce-checkout #payment #place_order,
.woocommerce-page .checkout #place_order {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%;
  background-color: var(--color-foret); color: var(--color-creme);
  font-family: var(--font-body); font-size: 0.95rem; letter-spacing: 0.04em; font-weight: 400;
  border: 0; border-radius: var(--radius-pill); padding: 17px 30px; cursor: pointer; margin-top: 16px;
  text-transform: none; transition: background-color .25s ease;
}
.woocommerce-checkout #payment #place_order:hover,
.woocommerce-page .checkout #place_order:hover { background-color: var(--color-terracotta); color: var(--color-creme); }

/* Panier : quantité (input WC) façon kit */
.cart .product-quantity .quantity { display: inline-flex; align-items: center; border: 1px solid rgba(44, 56, 48, 0.2); border-radius: var(--radius-card); overflow: hidden; }
.cart .product-quantity .quantity .qty {
  width: 60px; text-align: center; border: 0; outline: none; background: transparent;
  font-family: var(--font-body); font-size: 0.95rem; color: var(--color-foret); padding: 11px 4px;
  -moz-appearance: textfield;
}
.cart .product-quantity .quantity .qty::-webkit-outer-spin-button,
.cart .product-quantity .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cart-actions .update-cart { margin-left: auto; }

/* Panier : état « mise à jour AJAX en cours » (cart-qty.js → API Store).
   On atténue les valeurs recalculées le temps de la requête, sans bloquer
   les boutons de quantité (debounce gère les clics rapides). */
.cart-layout.is-updating .cart_totals,
.cart-layout.is-updating .product-subtotal .price {
  opacity: 0.5; transition: opacity 0.2s ease;
}
.cart-layout.is-updating .cart_totals { pointer-events: none; }

/* Boutons "coupon / mettre à jour" outline */
.btn.btn-outline { background: transparent; color: var(--color-foret); border: 1px solid rgba(44, 56, 48, 0.25); }
.btn.btn-outline:hover { background: var(--color-foret); color: var(--color-creme); }

/* ---------- Chrome : neutraliser .woocommerce-page img sur le footer ----------
   WooCommerce applique « .woocommerce-page img { height:auto; max-width:100% } »
   (spécificité 0,1,1) qui écrase « .footer-logo { height:68px } » (0,1,0) et fait
   exploser la taille du logo. On rétablit avec une spécificité supérieure. */
.site-footer .footer-logo { height: 68px; width: auto; max-width: 100%; }
.site-footer .footer-emblem { width: clamp(260px, 30vw, 460px); height: auto; }

/* Le shortcode WC sort un message vide redondant avant cart-empty.php : on le masque (notre carte porte déjà le message). */
.cart-page .wc-empty-cart-message { display: none; }

/* ============================================================
   Panier vide — état travaillé (cart-empty.php)
   ============================================================ */
.cart-empty-state {
  max-width: 580px; margin: 14px auto 64px; text-align: center;
  background: var(--color-creme-soft); border: 1px solid rgba(44, 56, 48, 0.08);
  border-radius: 18px; padding: 52px 40px;
}
.cart-empty-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 78px; height: 78px; border-radius: 50%; background: #fff;
  color: var(--color-foret); margin-bottom: 22px; border: 1px solid rgba(44, 56, 48, 0.08);
}
.cart-empty-state h2 { font-family: var(--font-display); font-size: 1.85rem; color: var(--color-foret); margin: 0 0 12px; }
.cart-empty-state p { color: var(--color-ink-soft); line-height: 1.7; margin: 0 auto 28px; max-width: 46ch; }
.cart-empty-actions { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.cart-empty-link { font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-sauge); }
.cart-empty-link:hover { color: var(--color-terracotta); }
.cart-empty-families { margin-top: 36px; padding-top: 28px; border-top: 1px solid rgba(44, 56, 48, 0.1); }
.cart-empty-families-label { font-size: 0.66rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-ink-muted); display: block; margin-bottom: 16px; }
.cart-empty-families ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; }
.cart-empty-families li a {
  display: inline-block; padding: 8px 16px; border-radius: var(--radius-pill);
  border: 1px solid rgba(44, 56, 48, 0.18); font-size: 0.8rem; color: var(--color-foret);
  background: #fff; transition: border-color .2s ease, background .2s ease;
}
.cart-empty-families li a:hover { border-color: var(--color-foret); background: rgba(125, 184, 125, 0.08); }