/* ==========================================================================
   Chaussette Leblond — WooCommerce « shortcodes classiques » (skin charte)
   --------------------------------------------------------------------------
   Panier [woocommerce_cart], Commande [woocommerce_checkout], Mon compte.
   Cette feuille est CONCATÉNÉE APRÈS assets/css/main.css : elle réutilise les
   variables :root du thème (var(--blue), var(--navy), var(--osw)…).
   Le CSS par défaut de WooCommerce (layout / smallscreen) reste chargé : on ne
   fait ici que « skinner » (couleurs, typographies, filets, ombres, boutons,
   notices) et raffiner le responsive. Aucun PHP.

   PORTÉE : tous les sélecteurs sont scopés sous .woocommerce / .woocommerce-page
   ou body.woocommerce-cart / .woocommerce-checkout / .woocommerce-account.
   On ne touche JAMAIS au mini-panier drawer (.cl-drawer*, .cl-cartline*), qui
   n'est pas descendant de .woocommerce.

   Sommaire :
     0. Base / portée (largeur page, neutralisation .prose, titres, champs)
     1. Panier
     2. Commande / checkout
     3. Mon compte
     4. Notices
     5. Boutons
     6. Responsive
   ========================================================================== */


/* ==========================================================================
   0. BASE / PORTÉE
   ========================================================================== */

/* Les pages panier/commande/compte passent par page.php (.cl-page max-width:820).
   On élargit uniquement ces pages pour laisser respirer tableau + colonnes. */
body.woocommerce-cart .cl-page,
body.woocommerce-checkout .cl-page,
body.woocommerce-account .cl-page{
  max-width:1080px;
}

.woocommerce,
.woocommerce-page{
  font-family:var(--body);
  color:var(--ink);
}

/* Neutralisation des styles éditoriaux .prose hérités (page.php enveloppe le
   contenu dans .prose) : listes en flex + puces carrées bleues + liens soulignés
   + gros paragraphes ne doivent pas polluer les composants WooCommerce.
   Double-scope (.woocommerce-page .woocommerce) pour battre .prose en spécificité. */
.woocommerce-page .woocommerce ul,
.woocommerce-page .woocommerce ol{
  display:block;
  gap:0;
}
.woocommerce-page .woocommerce ul li,
.woocommerce-page .woocommerce ol li{
  display:block;
  gap:0;
}
.woocommerce-page .woocommerce ul li::before,
.woocommerce-page .woocommerce ol li::before{
  content:none;
  display:none;
}
.woocommerce-page .woocommerce a{
  text-decoration:none;
}

/* Titres de sections WooCommerce (h2/h3 : « Détails de facturation », « Votre
   commande », « Se connecter »…) : Oswald MAJUSCULES, tailles calibrées (on
   redimensionne les gros h2/h3 de .prose). */
.woocommerce h2,
.woocommerce-page .woocommerce h2{
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:700;
  font-size:24px;
  line-height:1.1;
  letter-spacing:.01em;
  color:var(--ink);
  margin:0 0 16px;
}
.woocommerce h3,
.woocommerce-page .woocommerce h3{
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:600;
  font-size:19px;
  line-height:1.12;
  letter-spacing:.02em;
  color:var(--ink);
  margin:0 0 14px;
}

/* -------- Champs de formulaire (partagés cart / checkout / compte) -------- */
.woocommerce form .form-row{
  margin:0 0 16px;
}
.woocommerce form .form-row label{
  display:block;
  margin:0 0 6px;
  font-family:var(--body);
  font-weight:600;
  font-size:13.5px;
  letter-spacing:.01em;
  color:var(--ink-2);
}
.woocommerce form .form-row label.checkbox,
.woocommerce form .form-row label.woocommerce-form__label-for-checkbox{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-weight:500;
  color:var(--ink-2);
}
.woocommerce .woocommerce-input-wrapper{
  display:block;
  width:100%;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce #order_review input.input-text,
.woocommerce .woocommerce-Address-fields input.input-text,
.woocommerce-account form input.input-text,
.woocommerce-account form input[type="text"],
.woocommerce-account form input[type="email"],
.woocommerce-account form input[type="tel"],
.woocommerce-account form input[type="password"]{
  width:100%;
  border:1px solid var(--line-2);
  border-radius:10px;
  padding:13px 15px;
  font-family:var(--body);
  font-size:15px;
  line-height:1.3;
  color:var(--ink);
  background:var(--card);
  box-shadow:none;
  transition:border-color .15s, box-shadow .15s;
}
.woocommerce form .form-row textarea{
  min-height:110px;
  resize:vertical;
}
.woocommerce form .form-row input.input-text::placeholder,
.woocommerce form .form-row textarea::placeholder{
  color:var(--grey-2);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce #order_review input.input-text:focus,
.woocommerce-account form input:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,66,227,.14);
  outline:0;
}
/* champ en erreur de validation WooCommerce */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select{
  border-color:var(--err);
}
.woocommerce form .form-row.woocommerce-validated input.input-text{
  border-color:var(--ok);
}
/* astérisque « requis » */
.woocommerce .required,
.woocommerce form .form-row label .required{
  color:var(--err);
  border:0;
  text-decoration:none;
}
/* cases à cocher / radios à la couleur de marque */
.woocommerce input[type="radio"],
.woocommerce input[type="checkbox"]{
  accent-color:var(--blue);
}

/* -------- select2 (pays / région) -------- */
/* Contrôle fermé (dans .woocommerce) */
.woocommerce .select2-container--default .select2-selection--single{
  height:auto;
  min-height:48px;
  border:1px solid var(--line-2);
  border-radius:10px;
  background:var(--card);
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:46px;
  padding-left:15px;
  color:var(--ink);
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow{
  height:46px;
}
.woocommerce .select2-container--default.select2-container--focus .select2-selection--single,
.woocommerce .select2-container--default.select2-container--open .select2-selection--single{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,66,227,.14);
}
/* Liste déroulante (rattachée à <body>, hors .woocommerce → scope body.woocommerce-page) */
body.woocommerce-page .select2-dropdown{
  border:1px solid var(--line-2);
  border-radius:10px;
  box-shadow:var(--shadow-drop);
  overflow:hidden;
}
body.woocommerce-page .select2-container--default .select2-results__option--highlighted[aria-selected]{
  background:var(--blue);
  color:#fff;
}
body.woocommerce-page .select2-container--default .select2-search--dropdown .select2-search__field{
  border:1px solid var(--line-2);
  border-radius:8px;
  padding:8px 10px;
}


/* ==========================================================================
   TABLEAUX WooCommerce — base commune (panier, récap commande, commandes compte)
   Carte blanche, filets --line, en-tête --navy en Oswald MAJUSCULES.
   ========================================================================== */
.woocommerce table.shop_table{
  width:100%;
  border:1px solid var(--line);
  border-collapse:separate;
  border-spacing:0;
  border-radius:14px;
  overflow:hidden;                 /* coins arrondis clippés */
  background:var(--card);
  box-shadow:0 1px 3px rgba(20,18,15,.05);
  margin:0 0 24px;
  font-size:15px;
}
.woocommerce table.shop_table thead th{
  background:var(--navy);
  color:#fff;
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:.05em;
  font-size:13px;
  line-height:1.2;
  text-align:left;
  padding:15px 18px;
  border:0;
}
.woocommerce table.shop_table thead th:first-child{border-top-left-radius:13px}
.woocommerce table.shop_table thead th:last-child{border-top-right-radius:13px}
.woocommerce table.shop_table tbody td,
.woocommerce table.shop_table tbody th{
  padding:16px 18px;
  border:0;
  border-top:1px solid var(--line);
  color:var(--ink-2);
  vertical-align:middle;
  background:transparent;
}


/* ==========================================================================
   1. PANIER  (.woocommerce-cart)
   ========================================================================== */

/* --- Tableau du panier --- */
.woocommerce-cart .woocommerce-cart-form table.cart{
  margin-bottom:34px;
}
/* miniature produit arrondie */
.woocommerce-cart table.cart td.product-thumbnail img{
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius:9px;
  border:1px solid var(--line);
}
/* lien produit en encre, hover bleu */
.woocommerce-cart table.cart td.product-name a{
  font-family:var(--body);
  font-weight:600;
  font-size:15.5px;
  color:var(--ink);
  text-decoration:none;
  transition:color .15s;
}
.woocommerce-cart table.cart td.product-name a:hover{
  color:var(--blue);
}
.woocommerce-cart table.cart td.product-name .variation,
.woocommerce-cart table.cart td.product-name dl.variation{
  margin:6px 0 0;
  font-size:13px;
  color:var(--muted);
}
.woocommerce-cart table.cart td.product-price,
.woocommerce-cart table.cart td.product-subtotal{
  color:var(--ink);
  font-weight:600;
}
.woocommerce-cart table.cart td.product-subtotal{
  font-family:var(--osw);
  font-weight:700;
  font-size:16px;
}
/* croix de suppression : ronde, discrète, hover rouge (WooCommerce force color:red!important) */
.woocommerce-cart table.cart td.product-remove{
  text-align:center;
  width:42px;
}
.woocommerce a.remove,
.woocommerce-cart table.cart td.product-remove a.remove{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:50%;
  font-size:17px;
  font-weight:400;
  line-height:1;
  color:var(--muted) !important;
  background:var(--line-3);
  border:1px solid var(--line-2);
  transition:.15s;
}
.woocommerce a.remove:hover,
.woocommerce-cart table.cart td.product-remove a.remove:hover{
  color:var(--err) !important;
  background:#f6e6e4;
  border-color:#e7c7c2;
}

/* --- Champ quantité --- */
.woocommerce .quantity input.qty,
.woocommerce-cart .quantity input.qty{
  width:74px;
  height:46px;
  padding:8px 6px 8px 10px;
  border:1px solid var(--line-2);
  border-radius:8px;
  background:var(--card);
  font-family:var(--body);
  font-weight:600;
  font-size:15px;
  color:var(--ink);
  text-align:center;
  transition:border-color .15s, box-shadow .15s;
}
.woocommerce .quantity input.qty:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,66,227,.14);
  outline:0;
}

/* --- Ligne d'actions (coupon + mise à jour) dans td.actions --- */
.woocommerce-cart-form td.actions{
  padding:18px;
  background:var(--blue-soft);
  border-top:1px solid var(--line);
}
.woocommerce-cart-form td.actions .coupon{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.woocommerce-cart-form td.actions .coupon label{
  display:none;
}
.woocommerce-cart-form td.actions .coupon input#coupon_code{
  width:220px;
  max-width:100%;
  height:48px;
  border:1px solid var(--line-2);
  border-radius:10px;
  padding:12px 15px;
  font-size:15px;
  color:var(--ink);
  background:var(--card);
}
.woocommerce-cart-form td.actions .coupon input#coupon_code:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,66,227,.14);
  outline:0;
}

/* --- Cart totals --- */
.woocommerce .cart-collaterals{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:flex-start;
  gap:30px;
  width:100%;
}
.woocommerce .cart-collaterals .cross-sells{
  flex:1 1 320px;
  min-width:0;
}
.woocommerce .cart-collaterals .cart_totals{
  float:none;                       /* on annule le float WooCommerce */
  flex:0 0 440px;
  max-width:100%;
  width:100%;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow-card);
  padding:26px 28px 28px;
}
.woocommerce .cart_totals h2{
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:700;
  font-size:22px;
  letter-spacing:.01em;
  color:var(--ink);
  margin:0 0 14px;
}
/* la table interne redevient transparente (la carte, c'est .cart_totals) */
.woocommerce .cart_totals table.shop_table{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
  margin:0;
}
.woocommerce .cart_totals table tr th,
.woocommerce .cart_totals table tr td{
  padding:12px 0;
  border:0;
  border-top:1px solid var(--line);
  text-align:left;
  font-size:15px;
  color:var(--ink-2);
  background:transparent;
}
.woocommerce .cart_totals table tr:first-child th,
.woocommerce .cart_totals table tr:first-child td{
  border-top:0;
}
.woocommerce .cart_totals table th{
  font-family:var(--body);
  font-weight:600;
  color:var(--ink-2);
  width:45%;
}
.woocommerce .cart_totals table td{
  text-align:right;
  font-weight:600;
  color:var(--ink);
}
.woocommerce .cart_totals table td .amount{
  color:var(--ink);
}
/* remise (coupon) en vert */
.woocommerce .cart_totals .cart-discount th,
.woocommerce .cart_totals .cart-discount td,
.woocommerce .cart_totals .cart-discount td .amount{
  color:var(--ok);
}
/* total plus grand / gras */
.woocommerce .cart_totals .order-total th,
.woocommerce .cart_totals .order-total td{
  padding-top:15px;
  font-size:19px;
  font-weight:700;
  color:var(--ink);
}
.woocommerce .cart_totals .order-total th{
  font-family:var(--osw);
  text-transform:uppercase;
  letter-spacing:.02em;
}
.woocommerce .cart_totals .order-total td .amount{
  font-family:var(--osw);
  font-weight:700;
}
/* calculateur d'expédition */
.woocommerce .cart_totals .shipping-calculator-button{
  color:var(--blue);
  font-weight:600;
}
.woocommerce .cart_totals .woocommerce-shipping-destination{
  font-size:13px;
  color:var(--muted);
}

/* --- Bouton « Valider la commande » : CTA primaire pleine largeur --- */
.woocommerce .wc-proceed-to-checkout{
  padding-top:20px;
}
.woocommerce .wc-proceed-to-checkout a.checkout-button{
  display:flex;
  width:100%;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:.05em;
  font-size:16px;
  line-height:1.1;
  padding:17px 24px;
  border-radius:11px;
  color:#fff;
  background:var(--blue);
  box-shadow:var(--shadow-cta);
}
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover{
  background:var(--blue-hover);
  color:#fff;
}


/* ==========================================================================
   2. COMMANDE / CHECKOUT  (.woocommerce-checkout)
   ========================================================================== */

/* Colonnes desktop : détails client à gauche, récap commande collant à droite.
   On n'agit que sur des ID connus (floats sûrs, aucun autre enfant déplacé). */
@media (min-width:769px){
  .woocommerce-checkout form.checkout.woocommerce-checkout::after{
    content:"";
    display:table;
    clear:both;
  }
  .woocommerce-checkout #customer_details{
    float:left;
    width:57%;
  }
  .woocommerce-checkout #order_review_heading,
  .woocommerce-checkout #order_review{
    float:right;
    width:39%;
    clear:right;
  }
  /* la facturation/livraison s'empilent dans la colonne (plus étroite) */
  .woocommerce-checkout #customer_details .col-1,
  .woocommerce-checkout #customer_details .col-2{
    float:none;
    width:100%;
  }
  .woocommerce-checkout #order_review_heading{
    margin-top:0;
  }
  .woocommerce-checkout #order_review{
    position:sticky;
    top:90px;
  }
}

/* Blocs facturation / livraison */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2{
  box-sizing:border-box;
}
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields{
  margin-bottom:8px;
}

/* Récap commande : carte blanche à ombre, en-tête navy (base shop_table) */
.woocommerce-checkout #order_review .shop_table,
.woocommerce-checkout table.woocommerce-checkout-review-order-table{
  box-shadow:var(--shadow-card);
  margin-bottom:22px;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td{
  padding:14px 18px;
  font-size:14.5px;
  color:var(--ink-2);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table .product-name{
  color:var(--ink);
  font-weight:600;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table .product-name .product-quantity{
  color:var(--muted);
  font-weight:500;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td{
  padding:13px 18px;
  border:0;
  border-top:1px solid var(--line);
  text-align:left;
  font-size:15px;
  color:var(--ink-2);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td{
  text-align:right;
  font-weight:600;
  color:var(--ink);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th{
  font-family:var(--body);
  font-weight:600;
  color:var(--ink-2);
}
/* remise en vert */
.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-discount th,
.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-discount td,
.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-discount td .amount{
  color:var(--ok);
}
/* total en gras / Oswald */
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td{
  font-size:19px;
  font-weight:700;
  color:var(--ink);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th{
  font-family:var(--osw);
  text-transform:uppercase;
  letter-spacing:.02em;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td .amount{
  font-family:var(--osw);
  font-weight:700;
}

/* Modes de paiement */
.woocommerce-checkout #payment{
  background:transparent;
  border-radius:14px;
  padding:0;
}
.woocommerce-checkout #payment ul.wc_payment_methods{
  margin:0 0 20px;
  padding:4px 18px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--card);
  box-shadow:0 1px 3px rgba(20,18,15,.05);
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method{
  list-style:none;
  padding:15px 0;
  border-top:1px solid var(--line);
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method:first-child{
  border-top:0;
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  color:var(--ink);
  margin:0;
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method img{
  display:inline-block;
  vertical-align:middle;
  margin:0 0 0 6px;
}
/* boîte d'info du mode sélectionné : arrondie, fond bleu doux */
.woocommerce-checkout #payment div.payment_box{
  margin:14px 0 4px;
  padding:14px 16px;
  border:1px solid var(--blue-border);
  border-radius:10px;
  background:var(--blue-soft);
  color:var(--ink-2);
  font-size:14px;
  line-height:1.55;
  box-shadow:none;
}
.woocommerce-checkout #payment div.payment_box::before{
  border-bottom-color:var(--blue-soft) !important;
}
.woocommerce-checkout #payment div.payment_box p{
  margin:0;
  font-size:14px;
  color:var(--ink-2);
}
/* conditions générales */
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper{
  margin:4px 0 16px;
  font-size:14px;
}
.woocommerce-checkout #payment .place-order{
  padding:18px 0 0;
  margin:0;
}

/* Bouton « Commander » : CTA primaire pleine largeur */
.woocommerce-checkout #payment #place_order{
  display:flex;
  width:100%;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:.05em;
  font-size:16px;
  line-height:1.1;
  padding:17px 24px;
  border-radius:11px;
  color:#fff;
  background:var(--blue);
  box-shadow:var(--shadow-cta);
  float:none;
}
.woocommerce-checkout #payment #place_order:hover{
  background:var(--blue-hover);
  color:#fff;
}

/* Bandeau + formulaire « Vous avez un code promo ? » (et connexion) : discrets */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info{
  padding:12px 16px 12px 16px;
  background:var(--blue-soft);
  border:1px solid var(--blue-border);
  border-left-width:4px;
  border-radius:10px;
  color:var(--ink-2);
  font-size:14px;
  box-shadow:none;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info::before{
  display:none;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a{
  color:var(--blue);
  font-weight:600;
}
.woocommerce-checkout form.checkout_coupon,
.woocommerce-checkout form.login{
  margin:0 0 22px;
  padding:20px 22px;
  border:1px solid var(--line-2);
  border-radius:12px;
  background:var(--card);
  box-shadow:0 1px 3px rgba(20,18,15,.05);
}
.woocommerce-checkout form.checkout_coupon .form-row-first{
  width:60%;
}


/* ==========================================================================
   3. MON COMPTE  (.woocommerce-account)
   ========================================================================== */

/* Layout : on garde les floats WooCommerce (nav 30% / contenu 68%),
   on ajoute juste un peu d'air. */
.woocommerce-account .woocommerce-MyAccount-navigation{
  margin-bottom:24px;
}

/* Navigation par onglets : liste en carte, liens Oswald, actif en bleu */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:var(--card);
  box-shadow:0 1px 3px rgba(20,18,15,.05);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li{
  border-top:1px solid var(--line);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li:first-child{
  border-top:0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a{
  display:block;
  padding:13px 16px;
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:600;
  font-size:13.5px;
  letter-spacing:.03em;
  color:var(--ink-2);
  transition:.15s;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover{
  color:var(--blue);
  background:var(--blue-soft);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{
  color:var(--blue);
  background:var(--blue-soft);
  box-shadow:inset 3px 0 0 var(--blue);
}

/* Contenu du compte */
.woocommerce-account .woocommerce-MyAccount-content{
  color:var(--ink-2);
}
.woocommerce-account .woocommerce-MyAccount-content a:not(.button){
  color:var(--blue);
  font-weight:600;
}

/* Tableau des commandes : en-tête navy via base shop_table + colonne actions */
.woocommerce-account .woocommerce-orders-table td,
.woocommerce-account .woocommerce-orders-table th{
  font-size:14.5px;
}
.woocommerce-account .woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions a.button{
  padding:9px 14px;
  font-size:12.5px;
}

/* Blocs d'adresses (tableau de bord) */
.woocommerce-account .woocommerce-Addresses .woocommerce-Address{
  margin-bottom:22px;
}
.woocommerce-account .woocommerce-Address address{
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--card);
  color:var(--ink-2);
  font-style:normal;
  line-height:1.7;
}
.woocommerce-account .woocommerce-Address .edit{
  color:var(--blue);
  font-weight:600;
}

/* Connexion / inscription : cartes blanches */
.woocommerce-account .woocommerce form.woocommerce-form-login,
.woocommerce-account .woocommerce form.woocommerce-form-register,
.woocommerce .woocommerce-ResetPassword.lost_reset_password{
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--card);
  padding:26px 26px 28px;
  box-shadow:0 1px 3px rgba(20,18,15,.05);
  margin:0;
}
.woocommerce-account .woocommerce-form-login__rememberme,
.woocommerce-account .woocommerce-form-register .woocommerce-form__label{
  font-weight:500;
  color:var(--ink-2);
}
.woocommerce-account .woocommerce-LostPassword a,
.woocommerce .woocommerce-form-login .lost_password a{
  color:var(--blue);
  font-weight:600;
  font-size:14px;
}


/* ==========================================================================
   4. NOTICES  (.woocommerce-message / .woocommerce-info / .woocommerce-error)
   Bandeaux arrondis à la charte : filet gauche coloré + pastille icône.
   ========================================================================== */
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error{
  position:relative;
  list-style:none;
  margin:0 0 24px;
  padding:15px 20px 15px 52px;
  border:1px solid var(--line);
  border-left-width:4px;
  border-radius:12px;
  background:var(--card);
  color:var(--ink);
  font-family:var(--body);
  font-size:15px;
  line-height:1.5;
  box-shadow:0 1px 3px rgba(20,18,15,.05);
}
.woocommerce-page .woocommerce-message::after,
.woocommerce .woocommerce-message::after,
.woocommerce-page .woocommerce-info::after,
.woocommerce .woocommerce-info::after,
.woocommerce-page .woocommerce-error::after,
.woocommerce .woocommerce-error::after{
  content:"";
  display:table;
  clear:both;
}
/* pastille icône (on remplace l'icône WooCommerce par une pastille ronde) */
.woocommerce-page .woocommerce-message::before,
.woocommerce .woocommerce-message::before,
.woocommerce-page .woocommerce-info::before,
.woocommerce .woocommerce-info::before,
.woocommerce-page .woocommerce-error::before,
.woocommerce .woocommerce-error::before{
  position:absolute;
  left:16px;
  top:15px;
  width:22px;
  height:22px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--osw);
  font-weight:700;
  font-size:13px;
  line-height:1;
  color:#fff;
  background:var(--blue);
  content:"i";
}
.woocommerce-page .woocommerce-message li,
.woocommerce .woocommerce-message li,
.woocommerce-page .woocommerce-info li,
.woocommerce .woocommerce-info li,
.woocommerce-page .woocommerce-error li,
.woocommerce .woocommerce-error li{
  list-style:none;
  margin:0;
}
/* succès (vert) */
.woocommerce-page .woocommerce-message,
.woocommerce .woocommerce-message{
  border-left-color:var(--ok);
}
.woocommerce-page .woocommerce-message::before,
.woocommerce .woocommerce-message::before{
  background:var(--ok);
  content:"\2713";               /* ✓ */
}
/* info (bleu, fond bleu doux) */
.woocommerce-page .woocommerce-info,
.woocommerce .woocommerce-info{
  border-color:var(--blue-border);
  border-left-color:var(--blue);
  background:var(--blue-soft);
  color:var(--ink-2);
}
.woocommerce-page .woocommerce-info::before,
.woocommerce .woocommerce-info::before{
  background:var(--blue);
  content:"i";
}
/* erreur (rouge) */
.woocommerce-page .woocommerce-error,
.woocommerce .woocommerce-error{
  border-left-color:var(--err);
}
.woocommerce-page .woocommerce-error::before,
.woocommerce .woocommerce-error::before{
  background:var(--err);
  content:"!";
}
/* bouton d'action éventuel dans une notice (ex. « Voir le panier ») : compact */
.woocommerce-page .woocommerce-message a.button,
.woocommerce .woocommerce-message a.button,
.woocommerce-page .woocommerce-info a.button,
.woocommerce .woocommerce-info a.button{
  float:right;
  margin:-4px 0 0 14px;
  padding:9px 16px;
  font-size:12.5px;
  box-shadow:none;
}


/* ==========================================================================
   5. BOUTONS  (cohérents avec .cl-btn : Oswald MAJ, radius 11px)
   Principaux (bleu) : .alt / checkout / place_order (déjà traités en CTA).
   Secondaires (encre) : « Mettre à jour le panier », « Appliquer le code promo ».
   ========================================================================== */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-family:var(--osw);
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:.05em;
  font-size:15px;
  line-height:1.1;
  border:0;
  border-radius:11px;
  padding:14px 22px;
  cursor:pointer;
  transition:.15s;
  color:#fff;
  background:var(--blue);
  box-shadow:none;
  text-decoration:none;
  text-shadow:none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover{
  color:#fff;
  background:var(--blue-hover);
}
/* emphase des actions principales */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt{
  box-shadow:var(--shadow-cta);
}
/* accessibilité clavier */
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.woocommerce #respond input#submit:focus-visible,
.woocommerce #place_order:focus-visible,
.woocommerce .checkout-button:focus-visible{
  outline:3px solid rgba(0,66,227,.45);
  outline-offset:2px;
}
/* état désactivé lisible */
.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button[disabled],
.woocommerce input.button:disabled,
.woocommerce input.button[disabled]{
  opacity:.5;
  cursor:not-allowed;
  box-shadow:none;
}
.woocommerce button.button:disabled:hover,
.woocommerce button.button[disabled]:hover{
  background:var(--blue);
}

/* Boutons SECONDAIRES (encre) : mise à jour panier + application du coupon */
.woocommerce button[name="update_cart"],
.woocommerce input[name="update_cart"],
.woocommerce button[name="apply_coupon"],
.woocommerce input[name="apply_coupon"],
.woocommerce-cart-form td.actions .coupon .button{
  background:var(--ink);
  color:#fff;
  box-shadow:none;
}
.woocommerce button[name="update_cart"]:hover,
.woocommerce input[name="update_cart"]:hover,
.woocommerce button[name="apply_coupon"]:hover,
.woocommerce input[name="apply_coupon"]:hover,
.woocommerce-cart-form td.actions .coupon .button:hover{
  background:#2c2a26;
  color:#fff;
}
/* état désactivé du bouton « Mettre à jour le panier » (désactivé tant qu'aucune
   quantité n'a changé) — reste lisible en encre atténuée */
.woocommerce button[name="update_cart"]:disabled,
.woocommerce button[name="update_cart"][disabled]{
  opacity:.5;
  cursor:not-allowed;
  background:var(--ink);
}
.woocommerce button[name="update_cart"]:disabled:hover,
.woocommerce button[name="update_cart"][disabled]:hover{
  background:var(--ink);
}
/* hauteur alignée des boutons de la ligne coupon avec le champ (48px) */
.woocommerce-cart-form td.actions .coupon .button,
.woocommerce-cart-form td.actions button[name="update_cart"]{
  height:48px;
  padding-top:0;
  padding-bottom:0;
}


/* ==========================================================================
   6. RESPONSIVE  (mobile — complète les media queries WooCommerce ≤768px)
   ========================================================================== */
@media (max-width:768px){

  body.woocommerce-cart .cl-page,
  body.woocommerce-checkout .cl-page,
  body.woocommerce-account .cl-page{
    padding-left:16px;
    padding-right:16px;
  }

  /* Tableau panier : lignes en cartes empilées (WooCommerce ajoute
     .shop_table_responsive + data-title ; on soigne le rendu carte). */
  .woocommerce-cart table.cart.shop_table_responsive{
    border:0;
    box-shadow:none;
    background:transparent;
    overflow:visible;
  }
  .woocommerce-cart table.cart.shop_table_responsive thead{
    display:none;
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody tr{
    display:block;
    margin:0 0 14px;
    padding:6px 16px 12px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--card);
    box-shadow:0 1px 3px rgba(20,18,15,.05);
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody td{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    width:auto;
    padding:11px 0;
    border:0;
    border-top:1px solid var(--line-3);
    text-align:right;
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody td::before{
    content:attr(data-title);
    font-family:var(--osw);
    text-transform:uppercase;
    font-weight:600;
    font-size:12px;
    letter-spacing:.04em;
    color:var(--muted);
    text-align:left;
  }
  /* miniature centrée, sans libellé */
  .woocommerce-cart table.cart.shop_table_responsive tbody td.product-thumbnail{
    display:block;
    text-align:center;
    border-top:0;
    padding-top:10px;
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody td.product-thumbnail::before{
    display:none;
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody td.product-thumbnail img{
    width:120px;
    height:120px;
    margin:4px auto 0;
  }
  /* croix de suppression alignée à droite */
  .woocommerce-cart table.cart.shop_table_responsive tbody td.product-remove{
    justify-content:flex-end;
    width:auto;
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody td.product-remove::before{
    display:none;
  }
  /* champ quantité aligné à droite */
  .woocommerce-cart table.cart.shop_table_responsive tbody td.product-quantity .quantity{
    margin-left:auto;
  }
  /* ligne d'actions (coupon + mise à jour) : bloc pleine largeur empilé */
  .woocommerce-cart table.cart.shop_table_responsive tbody td.actions{
    display:block;
    text-align:left;
    padding:14px 0 4px;
  }
  .woocommerce-cart table.cart.shop_table_responsive tbody td.actions::before{
    display:none;
  }
  .woocommerce-cart-form td.actions .coupon{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }
  .woocommerce-cart-form td.actions .coupon input#coupon_code{
    flex:1 1 100%;
    width:100%;
  }
  .woocommerce-cart-form td.actions .coupon .button,
  .woocommerce-cart-form td.actions button[name="update_cart"]{
    width:100%;
    margin:0;
  }

  /* Totaux + récap : pleine largeur */
  .woocommerce .cart-collaterals{
    display:block;
  }
  .woocommerce .cart-collaterals .cart_totals{
    flex:1 1 100%;
    width:100%;
    max-width:100%;
    margin-top:8px;
  }

  /* Checkout : colonne unique (annule les floats desktop) */
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review_heading,
  .woocommerce-checkout #order_review{
    float:none;
    width:100%;
  }
  .woocommerce-checkout #order_review{
    position:static;
  }

  /* Champs prénom/nom pleine largeur */
  .woocommerce-checkout .form-row-first,
  .woocommerce-checkout .form-row-last{
    width:100%;
  }

  /* Compte : nav au-dessus du contenu, pleine largeur */
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content{
    float:none;
    width:100%;
  }
  /* Colonnes connexion / inscription empilées */
  .woocommerce-account .u-columns .col-1,
  .woocommerce-account .u-columns .col-2{
    float:none;
    width:100%;
  }

  /* Boutons CTA pleine largeur déjà (checkout/place_order) ; on assure les
     boutons de compte */
  .woocommerce-account .woocommerce-form-login .button,
  .woocommerce-account .woocommerce-form-register .button,
  .woocommerce-ResetPassword .button{
    width:100%;
  }
}

/* ==========================================================================
   ÉTAPE 1 — récapitulatif du panier allégé
   Le bloc ne porte plus que le total et l'état de la livraison : le choix du
   transporteur et le paiement appartiennent à l'étape 3.
   ========================================================================== */

.woocommerce .cart_totals .cl-recap__livraison{
  margin:14px 0 0;
  padding:11px 14px;
  border-radius:10px;
  background:rgba(7,24,74,.04);
  font-size:13.5px;
  line-height:1.45;
  color:var(--ink-2);
}
.woocommerce .cart_totals .cl-recap__livraison--offerte{
  background:rgba(24,138,72,.08);
  color:#12643a;
}
.woocommerce .cart_totals .cl-recap__livraison strong{color:inherit}

/* Le total des articles doit se détacher : c'est le seul chiffre que le client
   retient de cet écran. */
.woocommerce .cart_totals .order-total th,
.woocommerce .cart_totals .order-total td{
  padding-top:14px;
  border-top:1px solid rgba(7,24,74,.12);
  font-size:16px;
}

.woocommerce .cart_totals .wc-proceed-to-checkout{margin-top:16px}

/* Puce bleue parasite au-dessus de « Carte bancaire » et « PayPal ».

   DEUX RÈGLES SE COMBINAIENT pour produire quelque chose qu'aucune des deux
   ne voulait :
     · WooCommerce pose un clearfix — `#payment ul.payment_methods li:before
       { content:" "; display:table }` — qui rend le pseudo-élément EXISTANT ;
     · la puce de liste du thème — `.prose ul li::before` — lui donne 9 px de
       côté, un fond bleu et un rayon de 3 px.
   Le clearfix fournit le corps, le thème fournit la peinture.

   ⚠️ ON NE SUPPRIME PAS LE PSEUDO-ÉLÉMENT. `display:none` aurait fait
   disparaître la puce ET le clearfix, dont la mise en page dépend. On lui
   retire seulement son apparence : plus de taille, plus de fond. Il reste là,
   il fait son travail, il ne se voit plus.

   ⚠️ LA RÈGLE DE WooCommerce CONTIENT UN ID. Une première tentative en
   `.woocommerce ul.payment_methods li::before` — deux classes — ne pouvait pas
   passer devant. D'où `#payment` ici aussi. */
.woocommerce #payment ul.payment_methods li::before,
.woocommerce #payment ul.payment_methods li::after,
#payment ul.payment_methods li::before,
#payment ul.payment_methods li::after{
  width:0;
  height:0;
  margin:0;
  background:none;
  border-radius:0;
  flex:none;
}

/* Boutons PayPal désormais rendus DANS le cadre du moyen de paiement.
   Ils y arrivent sans marge propre : on les décolle du texte « Payer avec
   PayPal » pour qu'ils se lisent comme l'action qui suit, pas comme une
   image d'illustration. */
.woocommerce #payment .payment_box .ppc-button-wrapper{
  margin-top:14px;
}
.woocommerce #payment .payment_box .ppc-button-wrapper > div{
  max-width:420px;
}

/* ==========================================================================
   ÉTAPE 2 — bloc d'inscription à la lettre d'information
   Sorti du flux des champs : une case perdue entre le code postal et le
   téléphone se lit comme une formalité, et se saute.
   ========================================================================== */

.woocommerce .cl-optin-bloc{
  display:flex;
  gap:16px;
  align-items:flex-start;
  margin:26px 0 0;
  padding:20px 22px;
  border:1px solid rgba(0,66,227,.22);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(0,66,227,.05),rgba(0,66,227,.02));
}
.woocommerce .cl-optin-bloc__ico{
  flex:none;
  color:var(--blue);
  margin-top:2px;
}
.woocommerce .cl-optin-bloc__corps{min-width:0}

.woocommerce .cl-optin-bloc__titre{
  margin:0 0 4px;
  font-family:var(--osw);
  font-weight:700;
  font-size:18px;
  letter-spacing:.01em;
  text-transform:uppercase;
  color:var(--navy,#07184a);
}
.woocommerce .cl-optin-bloc__accroche{
  margin:0 0 3px;
  font-size:15px;
  line-height:1.45;
  color:var(--ink-2);
}
/* Plus discret que l'accroche : c'est une garantie, pas un argument. */
.woocommerce .cl-optin-bloc__rassurance{
  margin:0 0 14px;
  font-size:13px;
  line-height:1.45;
  color:rgba(7,24,74,.55);
}

/* La case doit être atteignable sans viser : toute la ligne est cliquable et
   la cible fait 20 px — sur un écran tactile et à 70 ans, ça compte. */
.woocommerce .cl-optin-bloc__case{
  display:flex;
  align-items:center;
  gap:11px;
  padding:11px 13px;
  border:1px solid rgba(7,24,74,.16);
  border-radius:10px;
  background:#fff;
  font-weight:600;
  font-size:14.5px;
  color:var(--navy,#07184a);
  cursor:pointer;
  transition:border-color .15s, box-shadow .15s;
}
.woocommerce .cl-optin-bloc__case:hover{border-color:var(--blue)}
.woocommerce .cl-optin-bloc__case:focus-within{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,66,227,.14);
}
.woocommerce .cl-optin-bloc__case input[type="checkbox"]{
  flex:none;
  width:20px;
  height:20px;
  margin:0;
  accent-color:var(--blue);
  cursor:pointer;
}

@media (max-width:640px){
  .woocommerce .cl-optin-bloc{padding:17px 16px;gap:13px}
  .woocommerce .cl-optin-bloc__titre{font-size:16.5px}
  .woocommerce .cl-optin-bloc__accroche{font-size:14.5px}
}

/* ==========================================================================
   4bis. AVIS AUX CLIENTS D'AVANT LA REFONTE (formulaire de connexion)
   Encadré informatif, distinct des messages d'erreur : il est présent avant
   toute action du visiteur et ne doit donc pas ressembler à une alarme.
   Il disparaît de lui-même quand tous les comptes ont été redéfinis.
   ========================================================================== */
.cl-mdp-avis{
  margin:0 0 18px;
  padding:13px 16px;
  border:1px solid var(--line);
  border-left:4px solid var(--brand, #0042e3);
  border-radius:10px;
  background:var(--card);
  color:var(--ink);
  font-family:var(--body);
  font-size:14px;
  line-height:1.55;
}
.cl-mdp-avis strong{display:block;margin-bottom:2px}

/* Le message d'erreur de connexion porte trois lignes et un e-mail en gras :
   la mise en forme d'origine, prévue pour une phrase courte, le tassait. */
.woocommerce-error li strong{font-weight:700}
.woocommerce-error li br + em,
.woocommerce-error li em{
  display:inline-block;
  margin-top:6px;
  font-size:13.5px;
  opacity:.85;
}