/*
Theme Name: PineProtect
Theme URI: https://piege-chenille-processionnaire.fr/
Description: Thème enfant d'Essentials portant la charte PineProtect (refonte 2026). Le design system vit dans assets/design-system.css ; ce fichier ne contient que l'habillage WooCommerce et les ajustements d'intégration.
Author: SAS Guêpes Contrôle
Template: essentials
Version: 1.0.3
Text Domain: pineprotect
*/

/* ==========================================================================
   Intégration WordPress
   Le design system (assets/design-system.css) décrit les maquettes statiques.
   Ici on ne traite que ce que WordPress/WooCommerce ajoute par-dessus.
   ========================================================================== */

/* La barre d'admin décale le haut de page : on ne casse pas le sticky du bandeau. */
body.admin-bar .shell{ min-height:calc(100vh - 32px); }

/* .promo-bar et .cookie-banner sont en display:flex, qui l'emporte sur [hidden]. */
.promo-bar[hidden],
.cookie-banner[hidden]{ display:none; }

/* Alignements natifs de l'éditeur de blocs */
.prose .alignleft{ float:left; margin:6px 20px 12px 0; }
.prose .alignright{ float:right; margin:6px 0 12px 20px; }
.prose .aligncenter{ display:block; margin-left:auto; margin-right:auto; }
.prose figure{ margin:0 0 18px; }
.prose figcaption{ font-size:12.5px; color:var(--text-soft); font-style:italic; margin-top:6px; }
.screen-reader-text{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(1px,1px,1px,1px); white-space:nowrap;
}

/* --------------------------------------------------------------------------
   WooCommerce — habillage commun
   -------------------------------------------------------------------------- */
.woocommerce-notices-wrapper:empty{ display:none; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error{
  list-style:none; margin:0 0 20px; padding:14px 18px;
  border-radius:12px; font-size:14px; border:1px solid var(--border);
}
.woocommerce-message{ background:var(--green-light); color:var(--green-dark); border-color:transparent; }
.woocommerce-info{ background:var(--cream-alt); color:var(--text); }
.woocommerce-error{ background:oklch(94% 0.04 29); color:var(--red); border-color:transparent; }
/* Le bouton d'une notice est aligné à droite du texte plutôt que flottant :
   en flottant il débordait de l'encadré quand le message tenait sur une ligne. */
.woocommerce-message,
.woocommerce-info{
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
}
.woocommerce-message .button,
.woocommerce-info .button{ flex-shrink:0; }
/* WooCustomizer Pro colore ce lien en rouge vif, en style inline et !important,
   avec le même sélecteur que le nôtre : d'où le `body` en tête, qui départage. */
body .woocommerce-message .button,
body .woocommerce-message .button:hover,
body .woocommerce-message .button.wc-forward,
body .woocommerce-message .button.wc-forward:hover,
body .woocommerce-info .button,
body .woocommerce-info .button:hover{ color:var(--cream) !important; }

/* WooCommerce donne le focus à la notice pour les lecteurs d'écran : le halo du
   navigateur apparaissait alors dès le chargement. Il reste visible au clavier. */
.woocommerce-message:focus,
.woocommerce-info:focus,
.woocommerce-error:focus{ outline:none; }
.woocommerce-message:focus-visible,
.woocommerce-info:focus-visible,
.woocommerce-error:focus-visible{ outline:2px solid var(--orange); outline-offset:2px; }

/* Champ « code promo » : il ne passe pas par .form-row, donc pas par la règle
   générale des champs de formulaire. */
.woocommerce #coupon_code{
  width:auto; min-width:180px; padding:12px 14px; border:1px solid var(--border-strong);
  border-radius:8px; font-size:14px; font-family:var(--font-body); background:var(--white);
}
.woocommerce .coupon{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.woocommerce td.actions{ padding:16px 14px; }
.woocommerce .quantity input.qty{
  width:80px; text-align:center; padding:10px 8px; border:1px solid var(--border-strong);
  border-radius:8px; font-size:14px; font-family:var(--font-body);
}

.woo-wrap{ padding:24px 48px 56px; }
.woo-wrap-narrow{ max-width:960px; margin:0 auto; }

/* Boutons WooCommerce : on les aligne sur .btn du design system */
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce #respond input#submit,
.wc-block-components-button{
  display:inline-block; text-align:center; padding:14px 24px; border-radius:10px;
  font-weight:600; font-size:15px; border:none; cursor:pointer;
  font-family:var(--font-body); background:var(--green-dark); color:var(--cream);
  text-decoration:none; line-height:1.2;
}
.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button:hover{ background:var(--green-darker); color:var(--cream); }
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt{ background:var(--orange); color:var(--orange-text); }
.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce input.button.alt:hover{ background:var(--orange); color:var(--orange-text); filter:brightness(1.05); }
.woocommerce .button.disabled,
.woocommerce button.button:disabled{ background:var(--border); color:var(--text-soft); cursor:not-allowed; }

/* WooCustomizer Pro écrit ses couleurs de bouton en style inline avec
   !important (includes/customizer/styles.php) : impossible de les couvrir
   autrement. À supprimer si l'extension est un jour désinstallée. */
body.woocommerce-cart .wc-proceed-to-checkout a.button.checkout-button,
body.woocommerce-cart .wc-proceed-to-checkout a.button.checkout-button:hover{
  background-color:var(--orange) !important;
  color:var(--orange-text) !important;
  border-radius:10px !important;
  font-family:var(--font-body) !important;
  font-size:15px !important;
}

/* Champs de formulaire (panier, commande, compte) */
.woocommerce form .form-row{ margin:0 0 16px; display:block; }
.woocommerce form .form-row label{
  display:block; font-size:13px; font-weight:600; color:var(--text-nav); margin-bottom:6px;
}
.woocommerce form .form-row .required{ color:var(--price); text-decoration:none; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single{
  width:100%; padding:12px 14px; border:1px solid var(--border-strong);
  border-radius:8px; font-size:14px; font-family:var(--font-body);
  color:var(--text); background:var(--white); height:auto;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{
  outline:2px solid var(--orange); outline-offset:1px; border-color:var(--orange);
}
.woocommerce form .form-row-first,
.woocommerce form .form-row-last{ width:48.5%; float:left; }
.woocommerce form .form-row-last{ float:right; }
.woocommerce form .clear{ clear:both; }

/* Tableaux (panier, commande, compte) */
.woocommerce table.shop_table{
  width:100%; border-collapse:collapse; border:1px solid var(--border);
  border-radius:14px; overflow:hidden; font-size:14px; margin:0 0 24px;
}
.woocommerce table.shop_table th{
  background:var(--cream-alt); font-family:var(--font-title); font-weight:600;
  text-align:left; padding:12px 14px; color:var(--text); font-size:14px;
}
.woocommerce table.shop_table td{ padding:14px; border-top:1px solid var(--border); vertical-align:middle; }
.woocommerce table.shop_table img{ width:64px; height:auto; border-radius:8px; }
.woocommerce .cart_totals h2,
.woocommerce-checkout h3,
.woocommerce-account h2{ font-family:var(--font-title); font-size:20px; margin:0 0 14px; }

/* Pagination */
.woocommerce nav.woocommerce-pagination ul{
  display:flex; gap:8px; justify-content:center; list-style:none; padding:0; margin:24px 0 0;
}
.woocommerce nav.woocommerce-pagination li a,
.woocommerce nav.woocommerce-pagination li span{
  display:block; padding:8px 14px; border-radius:8px; border:1px solid var(--border);
  font-size:14px; color:var(--text-nav);
}
.woocommerce nav.woocommerce-pagination li span.current{
  background:var(--green-dark); color:var(--cream); border-color:transparent;
}

/* Fiche produit : formulaire de variations */
.woocommerce div.product form.cart .variations{ width:100%; margin:0 0 8px; }
.woocommerce div.product form.cart .variations td{ display:block; padding:0; }
.woocommerce div.product form.cart .variations label{
  display:block; font-size:13px; font-weight:600; color:var(--text-nav); margin:18px 0 6px;
}
.woocommerce div.product form.cart .variations select{
  width:100%; padding:12px 14px; border:1px solid var(--border-strong);
  border-radius:8px; font-size:14px; font-family:var(--font-body); background:var(--white);
}
.woocommerce div.product form.cart .reset_variations{ font-size:12.5px; color:var(--text-soft); }
.woocommerce div.product form.cart .quantity input.qty{
  width:90px; text-align:center; padding:14px 8px; border:1px solid var(--border-strong);
  border-radius:8px; font-size:15px; font-family:var(--font-body);
}
.woocommerce div.product form.cart{ display:block; }
.woocommerce div.product .woocommerce-variation-price{ margin:0 0 12px; }
.woocommerce div.product .woocommerce-variation-price .price{
  font-family:var(--font-title); font-size:24px; font-weight:600; color:var(--price);
}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-family:var(--font-title); font-size:26px; color:var(--price); font-weight:600;
}
.woocommerce div.product p.price del{ font-size:.6em; color:var(--text-soft); font-weight:400; }
.woocommerce .woocommerce-variation-add-to-cart{ display:flex; gap:12px; align-items:stretch; }
.woocommerce .woocommerce-variation-add-to-cart .button{ flex:1; }

/* Galerie produit */
.woocommerce div.product div.images{ margin:0; }
.woocommerce div.product div.images img{ border-radius:14px; }
.woocommerce div.product div.images .flex-control-thumbs{
  display:flex; gap:10px; margin-top:12px; padding:0; list-style:none; flex-wrap:wrap;
}
.woocommerce div.product div.images .flex-control-thumbs li{ width:72px; }
.woocommerce div.product div.images .flex-control-thumbs img{
  border:1px solid var(--border); border-radius:10px; cursor:pointer;
}

/* Onglets de la fiche produit */
.woocommerce-tabs ul.tabs{
  display:flex; gap:8px; list-style:none; padding:0; margin:0 0 20px;
  border-bottom:1px solid var(--border); flex-wrap:wrap;
}
.woocommerce-tabs ul.tabs li{ margin:0; }
.woocommerce-tabs ul.tabs li a{
  display:block; padding:10px 18px; font-family:var(--font-title); font-size:15px;
  color:var(--text-soft);
}
.woocommerce-tabs ul.tabs li.active a{
  color:var(--green-dark); border-bottom:2px solid var(--orange);
}

/* Compteur « plus que X € pour la livraison offerte » */
.pp-freeship{
  background:var(--cream-alt); border:1px solid var(--border);
  border-radius:14px; padding:14px 18px; margin:0 0 20px;
}
.pp-freeship.is-reached{ background:var(--green-light); border-color:transparent; }
.pp-freeship-text{ font-size:14px; color:var(--text); margin:0 0 10px; }
.pp-freeship-text strong{ color:var(--price); }
.pp-freeship.is-reached .pp-freeship-text strong{ color:var(--green-dark); }
.pp-freeship-bar{
  height:6px; border-radius:100px; background:var(--border); overflow:hidden;
}
.pp-freeship-bar span{
  display:block; height:100%; border-radius:100px; background:var(--orange);
  transition:width .3s ease;
}
.pp-freeship.is-reached .pp-freeship-bar span{ background:var(--green-ok); }

/* Fiche produit : colonne d'achat */
.product-info .product_title{
  font-family:var(--font-title); font-size:28px; line-height:1.25; margin:0 0 10px; color:var(--text);
}
.product-info .woocommerce-product-details__short-description{
  font-size:14.5px; color:var(--text-soft); line-height:1.6; margin:18px 0 0;
}
.product-info .product_meta{
  font-size:12.5px; color:var(--text-soft); margin-top:18px; display:block;
}
.product-info .product_meta a{ color:var(--text-soft); }
.product-info .woocommerce-product-rating{ margin:0 0 10px; font-size:13px; }

/* Onglets + produits liés.
   Ces blocs sont sortis du conteneur `div.product` par content-single-product.php
   (ils vivent dans la section crème sous la fiche) : les sélecteurs ne peuvent
   donc pas être ancrés sur `.woocommerce div.product`. */
.woocommerce-tabs,
.related,
.upsells{ max-width:800px; margin:0 auto 40px; }
.upsells + .related{ margin-top:40px; }
.woocommerce-tabs .panel > h2,
.related > h2,
.upsells > h2{ font-family:var(--font-title); font-size:24px; margin:0 0 16px; }
.woocommerce-tabs .panel{ font-size:15px; line-height:1.7; color:oklch(32% 0.02 175); }
.woocommerce-tabs .panel h6{
  font-family:var(--font-title); font-size:17px; font-weight:600; margin:26px 0 10px; color:var(--text);
}
.woocommerce-tabs .panel ul{ padding-left:22px; }
.woocommerce-tabs .panel table{ width:100%; border-collapse:collapse; font-size:14px; }
.woocommerce-tabs .panel td,
.woocommerce-tabs .panel th{
  border:1px solid var(--border); padding:8px 10px; text-align:left;
}
.related ul.products,
.upsells ul.products{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px; list-style:none; padding:0; margin:0;
}
/* Un seul produit lié ne doit pas occuper un tiers de colonne perdu au milieu. */
.related ul.products li:only-child,
.upsells ul.products li:only-child{ grid-column:1 / -1; max-width:320px; }

@media (max-width:768px){
  .related ul.products,
  .upsells ul.products{ grid-template-columns:1fr; }
}

/* La référence produit (« UGS : ND ») n'a pas de sens pour ce catalogue. */
.product_meta .sku_wrapper{ display:none; }

/* --------------------------------------------------------------------------
   Tunnel de commande : choix de livraison et de paiement
   -------------------------------------------------------------------------- */
#shipping_method,
.woocommerce-checkout .wc_payment_methods{
  list-style:none; margin:0; padding:0; display:grid; gap:10px;
}
#shipping_method li,
.woocommerce-checkout .wc_payment_methods > li{
  margin:0; padding:12px 14px; border:1px solid var(--border);
  border-radius:12px; background:var(--white);
}
#shipping_method li label,
.woocommerce-checkout .wc_payment_methods > li > label{
  display:inline-flex; align-items:center; gap:8px; font-size:14px;
  font-weight:600; color:var(--text); cursor:pointer; margin:0;
}
#shipping_method li input[type="radio"],
.woocommerce-checkout .wc_payment_methods input[type="radio"]{
  accent-color:var(--green-dark); width:16px; height:16px; margin:0;
}
.woocommerce-checkout .wc_payment_methods .payment_box{
  margin-top:12px; padding:14px; background:var(--cream-alt);
  border-radius:10px; font-size:13.5px; line-height:1.6; color:var(--text-soft);
}
.woocommerce-checkout .wc_payment_methods .payment_box p{ margin:0 0 8px; }
.woocommerce-checkout .wc_payment_methods label img{ display:inline; max-height:24px; width:auto; }

/* Widget point relais Colissimo : le bouton d'ouverture de la carte est injecté
   dans le libellé de la méthode, sans classe exploitable — d'où le ciblage par
   le conteneur du module. */
#shipping_method li .lpc-modal{ display:none; }
#shipping_method li #lpc_layer_pickup_open,
#shipping_method li .lpc_pickup_open{
  display:inline-block; margin-top:10px; padding:9px 18px; border-radius:8px;
  background:var(--green-dark); color:var(--cream); font-size:13px;
  font-weight:600; border:none; cursor:pointer;
}
.lpc-lib-modal{ z-index:9999; }

/* Bouton de validation de commande : même traitement que le panier, WooCustomizer
   Pro imposant sa couleur en style inline. */
body.woocommerce-checkout #payment button#place_order,
body.woocommerce-checkout #payment button#place_order:hover{
  background-color:var(--orange) !important;
  color:var(--orange-text) !important;
  border-radius:10px !important;
  font-family:var(--font-body) !important;
}

/* Compte client */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  list-style:none; padding:0; margin:0; display:grid; gap:6px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display:block; padding:11px 16px; border-radius:10px; font-size:14px;
  color:var(--text-nav); background:var(--cream-alt);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
  background:var(--green-dark); color:var(--cream);
}
.woocommerce-account .woocommerce-MyAccount-navigation{ float:left; width:26%; }
.woocommerce-account .woocommerce-MyAccount-content{ float:right; width:70%; }

@media (max-width:900px){
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content{ float:none; width:100%; }
  .woocommerce-account .woocommerce-MyAccount-content{ margin-top:24px; }
  .woocommerce form .form-row-first,
  .woocommerce form .form-row-last{ width:100%; float:none; }
}

@media (max-width:768px){
  .woo-wrap{ padding-left:20px; padding-right:20px; }
  .woocommerce table.shop_table th{ display:none; }
  .woocommerce table.shop_table td{ display:block; border-top:none; padding:6px 14px; }
  .woocommerce table.shop_table tr{ display:block; border-top:1px solid var(--border); padding:10px 0; }
  .woocommerce .woocommerce-variation-add-to-cart{ flex-direction:column; }
  .woocommerce div.product form.cart .quantity input.qty{ width:100%; }
}