/*
 * Espace compte — chargée sur les vues « Mon compte ».
 *
 * Deux écrans très différents sous une même adresse : la porte d'entrée, quand
 * on n'est pas connecté — connexion à gauche, demande de compte à droite — et
 * l'espace lui-même, menu à gauche et contenu à droite. Ils ne partagent que
 * le bandeau.
 *
 * Ces règles vivaient dans boutique.css. Elles en sortent : la boutique et le
 * compte n'ont ni la même grille, ni les mêmes composants, et les mélanger
 * avait un coût — voir la grille de l'espace, plus bas, qui s'appliquait aussi
 * à la page de connexion.
 */

/* ---------- la porte d'entrée ---------- *
 * Connexion et demande de compte côte à côte, sur deux encadrés. La colonne de
 * droite est plus large : le formulaire de demande porte une dizaine de champs
 * — société, SIRET, TVA, EORI — là où la connexion en a deux. */
.woocommerce-account:not(.logged-in) .u-columns.col2-set{
  display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(24px,3.4vw,44px);align-items:start}
.woocommerce-account:not(.logged-in) .u-column1,
.woocommerce-account:not(.logged-in) .u-column2{
  float:none!important;width:auto!important;margin:0!important;
  border:1px solid var(--filet);background:var(--blanc);
  padding:clamp(22px,3vw,34px)}
/* La demande de compte est l'action qu'on veut voir aboutir : elle se pose sur
   le beige pour se distinguer de la connexion, sans crier. */
.woocommerce-account:not(.logged-in) .u-column2{background:var(--fond-doux);border-color:var(--filet)}
.woocommerce-account:not(.logged-in) .u-columns h2{
  font-size:clamp(22px,2.4vw,28px);margin:0 0 clamp(16px,2vw,22px);
  padding-bottom:14px;border-bottom:1px solid var(--filet)}
/* Les boutons des deux formulaires prennent toute la largeur de leur encadré :
   ce sont les seules actions de la page, elles n'ont pas à se chercher. */
.woocommerce-account:not(.logged-in) .woocommerce-form-login__submit,
.woocommerce-account:not(.logged-in) .woocommerce-form-register__submit{width:100%;margin-top:6px}
.woocommerce-account .woocommerce-LostPassword{margin:14px 0 0;font-size:16px}

/* ---------- l'espace, une fois connecté ---------- *
 * Menu à gauche, contenu à droite. La grille est bornée aux pages connectées :
 * posée sur toutes les vues du compte, elle rangeait aussi la page de
 * connexion en deux colonnes — dont une de 250 px pour le seul bandeau de
 * notifications, vide la plupart du temps, pendant que les deux formulaires
 * se serraient dans ce qui restait. */
.woocommerce-account.logged-in .woocommerce{
  display:grid;grid-template-columns:250px minmax(0,1fr);
  gap:clamp(28px,3.6vw,52px);align-items:start}
/* WooCommerce pose un « clearfix » (::before/::after en display:table) sur ce
   conteneur. Dans une grille, un pseudo-élément avec contenu devient une CASE :
   le ::before prenait la première, le menu glissait en colonne 2 et le contenu
   en ligne 2. Vu le 06/09/2026 après le passage à WooCommerce 11.1. */
.woocommerce-account.logged-in .woocommerce::before,
.woocommerce-account.logged-in .woocommerce::after{content:none;display:none}
/* Les notifications traversent : une alerte de commande n'a pas à tenir dans
   la colonne du menu. */
.woocommerce-account.logged-in .woocommerce-notices-wrapper{grid-column:1/-1}
/* Même sort pour tout ce qu'un plugin glisse dans ce conteneur — le bouton
   « Aller à la caisse » de woo-salon-order, posé avant le menu, prenait la
   case 1 : menu en colonne 2, contenu à la ligne dans les 250 px du menu.
   Seuls le menu et le contenu ont une colonne à eux ; le reste traverse. */
.woocommerce-account.logged-in .woocommerce > :not(.woocommerce-MyAccount-navigation):not(.woocommerce-MyAccount-content){grid-column:1/-1}
.woocommerce-account.logged-in .woocommerce > .wso-retour-caisse{margin:0;text-align:center}
.woocommerce-account .woocommerce-MyAccount-navigation{float:none;width:auto;margin:0}
.woocommerce-account .woocommerce-MyAccount-content{float:none;width:auto;margin:0;min-width:0}

/* Le menu : des filets, pas un bloc. L'onglet courant se marque par un trait
   doré et l'encre pleine — l'aplat navy sur toute la ligne pesait plus lourd
   que le contenu qu'il annonçait. */
.woocommerce-account .woocommerce-MyAccount-navigation ul{
  list-style:none;margin:0;padding:0;border-top:1px solid var(--filet)}
.woocommerce-account .woocommerce-MyAccount-navigation li{margin:0;border-bottom:1px solid var(--filet)}
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display:block;padding:13px 0 13px 14px;color:var(--texte-doux);
  font-family:var(--serif);font-size:17px;line-height:1.35;
  border-left:2px solid transparent;transition:.2s}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{
  color:var(--texte-titre);border-left-color:var(--filet)}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
  color:var(--texte-titre);border-left-color:var(--accent)}
/* La déconnexion n'est pas un onglet : elle quitte l'espace. */
.woocommerce-account .woocommerce-MyAccount-navigation li--customer-logout a{color:var(--texte-faible);font-size:16px}

/* ---------- le contenu ---------- */
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3{margin-top:0;
  font-size:clamp(21px,2.2vw,26px)}
.woocommerce-account .woocommerce-table,
.woocommerce-account table.shop_table{border:1px solid var(--filet)}
.woocommerce-account .woocommerce-table th{font-family:var(--serif);color:var(--texte-titre)}

/* ---------- la page d'une commande ---------- *
 * WooCommerce 11 rend lui-même une ligne « Actions » dans le tableau ; nos
 * documents ont leur section en dessous, plus lisible qu'une pile de boutons
 * dans une cellule. On cache la ligne, pas les boutons. */
.woocommerce-account .woocommerce-table--order-details tr:has(> .order-actions--heading){display:none}
.woocommerce-account .woocommerce-order-details{margin-bottom:clamp(22px,2.8vw,32px)}
.woocommerce-account .woocommerce-order-details__title{margin-bottom:12px}
.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-notices-wrapper + p{
  margin:0 0 clamp(18px,2.2vw,24px);font-size:17px}
.wddp-documents,.wso-documents,.wddp-enlevement{margin:0 0 clamp(24px,3vw,36px)}
.wddp-documents h2,.wso-documents h2,.wddp-enlevement h2{font-size:clamp(19px,1.9vw,22px);margin-bottom:10px}
.wddp-documents__liste{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.wddp-documents__liste .button{margin:0}
.wso-documents > p{margin:0 0 12px;color:var(--texte-doux)}
.wso-documents-solde{margin-top:10px;color:var(--texte-doux)}
/* « Vos documents » : une ligne par pièce, ses boutons à droite. */
.wso-documents-liste{list-style:none;margin:0;padding:0;border:1px solid var(--filet);background:var(--blanc)}
.wso-document{display:grid;grid-template-columns:minmax(0,1.6fr) auto auto auto;gap:6px 18px;align-items:center;
  padding:12px 16px;border-top:1px solid var(--filet)}
.wso-document:first-child{border-top:0}
.wso-document--a-regler{background:var(--fond-doux)}
.wso-document__quoi{display:flex;flex-direction:column;gap:2px;min-width:0}
.wso-document__quoi small{color:var(--texte-doux)}
.wso-document__montant{font-variant-numeric:tabular-nums;white-space:nowrap}
.wso-document__etat{color:var(--texte-doux);white-space:nowrap}
.wso-document__etat strong{color:var(--accent)}
.wso-document__liens{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.wso-document__liens .button{margin:0;padding:6px 12px;font-size:13px}
@media (max-width:640px){.wso-document{grid-template-columns:1fr 1fr}.wso-document__quoi{grid-column:1/-1}.wso-document__liens{grid-column:1/-1;justify-content:flex-start}}
/* La carte enlèvement : un état et une action, pas un bouton parmi d'autres. */
.wddp-enlevement{padding:clamp(18px,2.4vw,24px) clamp(18px,2.6vw,28px);
  border:1px solid var(--filet);border-left:4px solid var(--accent);background:var(--blanc)}
.wddp-enlevement--ok{border-left-color:#5c8a4a}
.wddp-enlevement--a-faire{border-left-color:var(--accent);background:var(--fond-doux)}
.wddp-enlevement h2{margin-top:0}
.wddp-enlevement p{margin:0 0 10px;max-width:62ch}
.wddp-enlevement__etat{font-size:17px}
.wddp-enlevement--ok .wddp-enlevement__etat strong{color:#3f6b30}
.wddp-enlevement__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:14px 0 0 !important}
.wddp-enlevement__actions .button{margin:0}
.wddp-enlevement__papier{font-size:15px;color:var(--texte-doux);text-decoration:underline;text-underline-offset:3px}
.woocommerce-account .order-again{margin:clamp(22px,2.8vw,32px) 0}
@media (max-width:640px){.wddp-documents__liste .button,.wddp-enlevement__actions .button{width:100%;text-align:center}}

/* ---------- le tableau de bord ---------- *
 * Voir woocommerce/myaccount/dashboard.php : les trois destinations du menu y
 * redeviennent des blocs qu'on vise, au lieu de trois liens noyés dans une
 * phrase d'explication. */
.ml-compte__bonjour{font-size:clamp(19px,1.8vw,22px);margin:0 0 clamp(20px,2.6vw,28px);
  padding-bottom:clamp(18px,2.4vw,24px);border-bottom:1px solid var(--filet)}
.ml-compte__bonjour strong{font-family:var(--display);font-weight:400}
.ml-compte__deconnexion{margin-left:14px;font-size:14px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--texte-faible)}
.ml-compte__deconnexion:hover{color:var(--alerte)}
.ml-compte__raccourcis{display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,24px);margin-bottom:clamp(28px,3.6vw,44px)}
.ml-compte__raccourci{display:block;padding:clamp(18px,2.4vw,26px);
  border:1px solid var(--filet);background:var(--blanc);color:inherit;transition:.2s}
.ml-compte__raccourci:hover{border-color:var(--accent);
  box-shadow:0 1px 3px rgba(24,19,15,.06), 0 8px 22px rgba(24,19,15,.06)}
.ml-compte__raccourci h3{margin:0 0 8px;font-size:clamp(19px,1.9vw,22px)}
.ml-compte__raccourci span{display:block;color:var(--texte-doux);font-size:16px;line-height:1.5}
.ml-compte__pied{padding-top:clamp(22px,3vw,30px);border-top:1px solid var(--filet)}
.ml-compte__aide{margin:16px 0 0;color:var(--texte-doux);font-size:16.5px}

@media (max-width:900px){
  .woocommerce-account:not(.logged-in) .u-columns.col2-set{grid-template-columns:1fr;gap:26px}
  .ml-compte__raccourcis{grid-template-columns:1fr}
}
@media (max-width:768px){
  .woocommerce-account.logged-in .woocommerce{grid-template-columns:1fr;gap:26px}
}

/* ---------- la connexion, seule ---------- *
 * La demande de compte est partie sur sa page : il ne reste ici qu'un
 * formulaire de deux champs et le chemin pour en ouvrir un. Deux colonnes
 * encore, mais dans l'autre rapport — c'est la connexion qui commande. */
.ml-connexion{display:grid;grid-template-columns:1.3fr 1fr;
  gap:clamp(28px,3.6vw,56px);align-items:start;max-width:960px;margin-inline:auto}
.ml-connexion h2{font-size:clamp(22px,2.4vw,28px);margin:0 0 clamp(16px,2vw,22px);
  padding-bottom:14px;border-bottom:1px solid var(--filet)}
.ml-connexion__form{border:1px solid var(--filet);background:var(--blanc);
  padding:clamp(22px,3vw,34px)}
.ml-connexion__form .woocommerce-form-login__submit{width:100%;margin-top:6px}
.ml-connexion .woocommerce-LostPassword{margin:14px 0 0;font-size:16px}
/* L'invitation n'est pas un second formulaire : pas d'encadré blanc, un aplat
   beige et trois lignes. Elle doit se lire comme une porte, pas comme une
   alternative à remplir. */
.ml-connexion__invite{background:var(--fond-doux);padding:clamp(22px,3vw,34px)}
.ml-connexion__invite p{color:var(--texte-doux);font-size:17px;line-height:1.6;margin:0 0 clamp(20px,2.6vw,26px)}
.ml-connexion__invite .ml-btn{width:100%;font-size:18px;padding:13px 20px}

/* ---------- la demande d'accès ---------- *
 * Une recherche, pas un questionnaire. Le widget d'entreprise interroge le
 * registre et remplit lui-même raison sociale, SIRET, TVA et adresse : c'est
 * lui le geste, les champs en dessous en sont le résultat. Il porte donc le
 * poids visuel, et le reste s'efface d'un cran. */
.ml-inscription{max-width:760px;margin-inline:auto}
.ml-inscription__chapo{font-size:clamp(18px,1.7vw,20px);line-height:1.6;
  color:var(--texte);margin:0 0 clamp(26px,3.4vw,36px)}
.ml-inscription form.register{display:flex;flex-direction:column}
/* La recherche passe en tête, avant l'e-mail : c'est par elle qu'on commence,
   et c'est elle qui remplit le reste. L'ordre du balisage, lui, ne bouge pas —
   WooCommerce et le plugin gardent le leur. */
.ml-inscription .wddp-entreprise-widget{order:-2;background:var(--fond-doux);
  padding:clamp(20px,2.6vw,28px);margin-bottom:clamp(20px,2.6vw,28px)}
.ml-inscription .wddp-entreprise-widget h2{font-size:clamp(20px,2.1vw,24px);margin:0 0 14px}
.ml-inscription .wddp-entreprise-widget + div{order:-1}
/*
 * L'ordre d'affichage, du haut vers le bas : la recherche et son identifiant,
 * l'e-mail, l'identité de l'entreprise que la recherche a remplie, puis les
 * champs du dédouanement — qui ne concernent que le hors-UE et le disent
 * eux-mêmes. Le balisage, lui, garde l'ordre que WooCommerce et le plugin lui
 * donnent : on ne déplace rien, on affiche autrement.
 *
 * Le paragraphe « Livraisons hors Union européenne » n'a pas de classe : il se
 * désigne par sa place, juste après le bloc de la recherche.
 */
.ml-inscription form.register > p.woocommerce-FormRow{order:1}
.ml-inscription form.register > p.form-row.form-row-wide{order:2}
.ml-inscription__envoi{order:9}
.ml-inscription .woocommerce-privacy-policy-text{order:8;color:var(--texte-doux);font-size:15px;line-height:1.55}
/* Les champs d'identité : plus discrets que la recherche, et sur deux colonnes
   là où ils sont courts. Ce sont des valeurs à vérifier, pas à composer. */
.ml-inscription form.register > p.form-row,
.ml-inscription form.register > p.woocommerce-FormRow{margin:0 0 16px}
/* Le libellé des formulaires du site : espacé, en capitales. Le même que sur
   la page Contact — un formulaire ne doit pas changer d'échelle d'une page à
   l'autre, et les deux règles bougent donc ensemble.
   Il tenait en 13 px d'encre douce, et c'était trop peu de trois côtés à la
   fois : EB Garamond a une petite hauteur d'x, les capitales retirent au mot
   sa silhouette, et l'interlettrage le décolle. Trois adoucissements qui, pris
   ensemble, faisaient une étiquette qu'on devine au lieu de la lire — sur un
   formulaire de douze champs. 15 px, l'interlettrage réduit de moitié et
   l'encre pleine : la ligne garde son allure, elle se lit. */
.ml-inscription form.register label{font-size:15px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--texte);font-weight:400}
.ml-inscription form.register label .required{color:var(--alerte);text-decoration:none}
.ml-inscription form.register label .optional{text-transform:none;letter-spacing:0}
.ml-inscription form.register .description{font-size:15px;color:var(--texte-faible)}
/* Les paragraphes vides que l'éditeur et les greffons laissent entre deux
   champs : ils creusaient des trous dans la colonne. */
.ml-inscription form.register > p:empty{display:none}
.ml-inscription__mdp{order:7;color:var(--texte-doux);font-size:16px}
.ml-inscription__envoi .ml-btn{width:100%;font-size:19px;padding:15px 20px}
.ml-inscription__retour{margin:clamp(26px,3.4vw,36px) 0 0;text-align:center;
  color:var(--texte-doux);font-size:16.5px}

@media (max-width:820px){
  .ml-connexion{grid-template-columns:1fr;gap:26px;max-width:520px}
}

/* Le bloc hors-UE, replié par le plugin. Il n'a pas à ressembler à un champ :
   une ligne qu'on ouvre, pas une question de plus. */
.ml-inscription .wddp-hors-ue{order:2;border-top:1px solid var(--filet);padding-top:16px;margin-bottom:18px}
.ml-inscription .wddp-hors-ue summary{cursor:pointer;font-size:16px;color:var(--texte-doux);
  list-style:none;padding:4px 0}
.ml-inscription .wddp-hors-ue summary::-webkit-details-marker{display:none}
.ml-inscription .wddp-hors-ue summary::before{content:"+ ";color:var(--accent-texte);font-weight:600}
.ml-inscription .wddp-hors-ue[open] summary::before{content:"– "}
.ml-inscription .wddp-hors-ue summary:hover{color:var(--texte-titre)}
.ml-inscription .wddp-hors-ue > p:first-of-type{margin-top:14px}

/* L'accusé de réception, quand la demande est partie. Il remplace le
   formulaire : il n'y a plus rien à remplir. */
.ml-inscription__recu{background:var(--fond-doux);padding:clamp(26px,3.6vw,40px);text-align:center}
.ml-inscription__recu h2{margin:0 0 14px;font-size:clamp(22px,2.6vw,30px)}
.ml-inscription__recu p{margin:0 auto;max-width:52ch;color:var(--texte);font-size:17.5px;line-height:1.6}
.ml-inscription__recu-aide{margin-top:18px!important;color:var(--texte-doux)!important;font-size:16px!important}

/* L'adresse de l'entreprise, en fin de formulaire : c'est la recherche qui la
   remplit, on ne la saisit qu'à défaut. Deux colonnes pour le code postal et
   la ville, qui vont ensemble et tiennent sur une ligne. */
/* Le pays ouvre le premier temps : c'est lui qui dit si la recherche au
   registre servira à quelque chose. */
.ml-inscription__pays{order:-3;margin-bottom:clamp(18px,2.4vw,24px)}
.ml-inscription__adresse{order:3;border-top:1px solid var(--filet);padding-top:clamp(18px,2.4vw,24px);margin-top:6px}
/* L'intertitre du bloc d'adresse. Il tenait en capitales espacées de 15 px sur
   --texte-doux, c'est-à-dire dans la même langue que les libellés qu'il
   chapeaute et un ton plus bas qu'eux : depuis qu'ils sont passés à 15 px
   d'encre pleine, il ne les chapeautait plus, il se rangeait derrière.
   Il change de famille plutôt que de corps — c'est la règle que la palette pose
   elle-même : « les titres ne se distinguent plus par la couleur mais par la
   fonte ». En display, il sort de la concurrence au lieu de la gagner d'un
   cran, et il prend le second rang sous la légende de l'étape, qui est du même
   caractère en plus grand. */
.ml-inscription__adresse-titre{margin:0 0 16px;font-family:var(--display);
  font-size:19px;letter-spacing:0;text-transform:none;color:var(--texte-titre)}
.ml-inscription__adresse .form-row{margin-bottom:16px}
.ml-inscription__adresse .form-row-first,
.ml-inscription__adresse .form-row-last{float:none;width:100%}
@media (min-width:520px){
  .ml-inscription__adresse{display:grid;grid-template-columns:1fr 1fr;
    column-gap:clamp(14px,2vw,20px)}
  .ml-inscription__adresse-titre,
  .ml-inscription__adresse .form-row-wide{grid-column:1/-1}
}

/* ---------- la recherche d'entreprise, aux couleurs de la maison ---------- *
 * Le widget de woo-ddp-devis se veut neutre, et il a raison : il sert aussi
 * dans l'administration et à la caisse, où le crème de la boutique n'aurait
 * rien à faire. Sa feuille le dit en toutes lettres. C'est donc au thème de
 * l'habiller là où il se montre au public — angles droits, filets de la
 * maison, et le corps des autres champs.
 *
 * Le contenu est posé en JavaScript après le chargement : ces règles visent
 * des éléments qui n'existent pas encore au premier rendu, et c'est normal.
 */
.ml-inscription .wddp-ent-q{max-width:none;font-family:var(--serif);font-size:20px;
  line-height:1.5;padding:13px 15px;min-height:0;border:1px solid var(--filet);
  border-radius:0;background:var(--blanc);color:var(--texte);-webkit-appearance:none}
.ml-inscription .wddp-ent-q:focus{outline:2px solid var(--focus);outline-offset:1px;
  border-color:var(--texte-titre)}
.ml-inscription .wddp-ent-aide{font-size:15px;opacity:1;color:var(--texte-doux);margin-top:8px}
.ml-inscription .wddp-ent-res{max-width:none;margin-top:12px}
/* Un résultat = une cible pleine largeur. On garde la mécanique du plugin, on
   change la peau : pas d'arrondi, le filet de la maison, le doré au survol. */
.ml-inscription .wddp-ent-item{border:1px solid var(--filet);border-radius:0;
  background:var(--blanc);padding:13px 15px;margin-bottom:8px;transition:.2s}
.ml-inscription .wddp-ent-item:hover,
.ml-inscription .wddp-ent-item:focus-visible{border-color:var(--accent);
  background:var(--blanc);box-shadow:0 1px 3px rgba(24,19,15,.06)}
.ml-inscription .wddp-ent-nom{font-family:var(--display);font-size:19px;color:var(--texte-titre)}
.ml-inscription .wddp-ent-meta,
.ml-inscription .wddp-ent-alias{color:var(--texte-doux);font-size:15px}
/* « Utiliser » : le plugin en fait une pastille bleue, celle de l'administration
   WordPress — c'est la cible tactile du POS, visée au doigt sur tablette. Ici
   on n'en reprenait que la couleur du texte, et l'or se posait sur le bleu.
   Réduit à du texte nu, il cessait d'avoir l'air d'une action ; il prend donc
   le contour de la maison, le même que « Chercher le n° » juste en dessous.
   La ligne entière est un <button> : c'est elle qui reçoit le survol, et le
   contour se remplit avec elle. */
.ml-inscription .wddp-ent-cta{font-family:var(--serif);font-size:13px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--texte-titre);white-space:nowrap;
  background:transparent;border:1px solid var(--texte-titre);border-radius:0;
  padding:8px 15px;font-weight:400;transition:.2s}
.ml-inscription .wddp-ent-item:hover .wddp-ent-cta,
.ml-inscription .wddp-ent-item:focus-visible .wddp-ent-cta{
  background:var(--texte-titre);color:var(--blanc)}
.ml-inscription .wddp-tva-btn{font-family:var(--serif);font-size:14px;letter-spacing:.1em;
  text-transform:uppercase;padding:9px 16px;border:1px solid var(--texte-titre);
  border-radius:0;background:transparent;color:var(--texte-titre);cursor:pointer}
.ml-inscription .wddp-tva-btn:hover{background:var(--texte-titre);color:var(--fond)}
.ml-inscription .wddp-tva-note,
.ml-inscription .wddp-ent-statut{font-size:15px;line-height:1.5}

/* WooCommerce encadre form.login et form.register d'un filet gris arrondi —
   « border:1px solid #cfc8d8; border-radius:5px; padding:20px ». Ici le cadre,
   c'est l'encadré du thème : le sien faisait une seconde bordure à l'intérieur
   de la première, arrondie et d'un gris qui n'est pas de la maison.
   Les sélecteurs portent une classe de plus que les siens, pour gagner quel
   que soit l'ordre de chargement des feuilles. */
.ml-connexion .woocommerce form.login,
.ml-connexion form.login,
.ml-inscription form.register{border:0;border-radius:0;padding:0;margin:0}

/* ---------- la demande en trois temps ---------- *
 * Le découpage est posé en JavaScript — voir assets/js/inscription.js. Sans
 * lui, rien de ce qui suit ne trouve d'élément : la page reste une colonne. */
.ml-etapes-fil{list-style:none;margin:0 0 clamp(24px,3vw,32px);padding:0;
  display:flex;gap:0;counter-reset:etape}
/* Les temps à venir ne sont pas décoratifs : c'est là qu'on lit ce qui reste
   à faire. En 14 px sur --texte-faible ils passaient sous la barre que la
   palette pose elle-même à ce ton — 3,5:1, « grand corps seulement ». */
.ml-etapes-fil__item{counter-increment:etape;flex:1 1 0;min-width:0;
  padding:10px 0 0;border-top:2px solid var(--filet);
  font-size:16px;line-height:1.35;color:var(--texte-doux)}
.ml-etapes-fil__item::before{content:counter(etape) ". ";font-family:var(--display)}
.ml-etapes-fil__item.est-faite{border-top-color:var(--accent);color:var(--texte-doux)}
.ml-etapes-fil__item.est-active{border-top-color:var(--texte-titre);color:var(--texte-titre)}

.ml-etape{border:0;padding:0;margin:0;min-width:0}
.ml-etape > legend{padding:0;margin:0 0 6px;font-family:var(--display);
  font-size:clamp(22px,2.4vw,28px);color:var(--texte-titre)}
.ml-etape__mot{margin:0 0 clamp(20px,2.6vw,26px);color:var(--texte-doux);
  font-size:16.5px;line-height:1.55}
/* Le pied : « Précédent » à gauche, « Continuer » à droite. Sur le dernier
   temps, « Continuer » s'efface et c'est le bouton d'envoi du formulaire qui
   reste — il vit dans ce temps-là. */
.ml-etape__nav{display:flex;gap:14px;justify-content:space-between;
  margin-top:clamp(24px,3vw,32px)}
.ml-etape__nav .ml-btn{min-width:170px}
.ml-etape__nav button[hidden]{display:none}
.ml-etape__nav .ml-btn--rempli-navy{margin-left:auto}

/* ---------- les champs, habillés en propre ---------- *
 * La page ne porte pas l'enveloppe « .woocommerce » — voir le gabarit : elle
 * apportait la mise en forme des champs, mais aussi les boutons pleins de la
 * boutique. Ces quelques lignes la remplacent, et ne débordent sur rien.
 *
 * 18 px et non les 20 du tunnel de commande : là-bas on saisit une adresse une
 * fois, ici il y a douze champs d'affilée, et 20 px en faisait des lignes de
 * 58 px de haut.
 *
 * Le menu déroulant du pays garde sa flèche native : la lui retirer obligerait
 * à en dessiner une, pour rien. */
.ml-inscription form.register .input-text,
.ml-inscription form.register select,
.ml-inscription form.register textarea{
  width:100%;font-family:var(--serif);font-size:18px;line-height:1.45;
  color:var(--texte);background:var(--blanc);
  border:1px solid var(--filet);border-radius:0;padding:11px 14px}
.ml-inscription form.register .input-text,
.ml-inscription form.register textarea{-webkit-appearance:none;appearance:none}
.ml-inscription form.register .input-text:focus,
.ml-inscription form.register select:focus,
.ml-inscription form.register textarea:focus{
  outline:2px solid var(--focus);outline-offset:1px;border-color:var(--texte-titre)}
/* Le bouton d'envoi porte la classe « button » de WooCommerce en plus de celle
   du thème. Sans l'enveloppe, plus rien ne la lit — mais on remet à zéro ce
   que le navigateur, lui, pourrait en faire. */
.ml-inscription form.register button{border-radius:0}
.ml-inscription form.register .form-row{padding:0;margin:0 0 15px}
.ml-inscription form.register .form-row label{line-height:1.4;display:block;margin-bottom:6px}
.ml-inscription form.register .woocommerce-input-wrapper{display:block;width:100%}

/* ---------- les deux boutons de la porte d'entrée ---------- *
 * « Se connecter » et « Ouvrir un compte » se lisent côte à côte : ils doivent
 * parler la même langue et dire lequel porte l'action principale. L'or, depuis
 * 2cb8c3a, est la couleur du site — c'est donc lui qui les tient, plein pour
 * le premier, en contour pour le second.
 *
 * ⚠ La spécificité n'est pas décorative ici, elle est tout le sujet.
 *
 * boutique.css habille les boutons de WooCommerce, et son groupe contient
 * « .woocommerce button.button » — soit (0,2,1). Les deux tentatives
 * précédentes, l'encre puis l'or, s'écrivaient toutes deux
 * « .ml-connexion .woocommerce-form-login__submit » : (0,2,0). À !important
 * égal, c'est la spécificité qui tranche — elles perdaient l'une comme
 * l'autre, et n'ont jamais rien affiché. Le bouton portait le style du
 * catalogue depuis le premier jour : pleine largeur par la règle voisine, au
 * corps et à la fonte de la boutique. C'est cette barre-là qu'on a prise pour
 * un aplat d'encre.
 *
 * Le sélecteur ci-dessous vaut (0,3,2). Ne pas le raccourcir. */
.ml-connexion form.login button.woocommerce-form-login__submit{
  background:var(--accent-texte)!important;color:var(--blanc)!important;
  border:1px solid var(--accent-texte)!important;border-radius:0!important;
  font-family:var(--display)!important;font-size:20px!important;letter-spacing:.06em;
  padding:14px 34px!important;text-transform:none;transition:.2s}
.ml-connexion form.login button.woocommerce-form-login__submit:hover{
  background:var(--texte-titre)!important;color:var(--blanc)!important;
  border-color:var(--texte-titre)!important}
/* L'invitation est l'action secondaire : le même or, en contour. Elle porte la
   classe partagée du thème — c'est donc ici, et sur cette page seulement,
   qu'elle passe de l'encre à l'or ; ailleurs « ml-btn--rempli-navy » ne bouge
   pas d'un pouce. */
.ml-connexion__invite .ml-btn,
.ml-connexion__invite .ml-btn:visited{
  background:transparent;color:var(--accent-texte);border-color:var(--accent-texte)}
.ml-connexion__invite .ml-btn:hover{
  background:var(--accent-texte);color:var(--blanc);border-color:var(--accent-texte)}

/* Le mot destiné aux entreprises étrangères : il paraît sous le pays, quand
   le pays cesse d'être la France. Un conseil, pas une alerte — le filet doré
   suffit à le distinguer du champ qui le précède. */
.ml-inscription__hors-france{margin:0 0 clamp(18px,2.4vw,24px);padding:12px 0 0;
  border-top:1px solid var(--accent);
  color:var(--texte-doux);font-size:16px;line-height:1.55}
.ml-inscription__hors-france[hidden]{display:none}

/* Le stepper masque par l'attribut ; certains sélecteurs de bloc rétabliraient
   l'affichage sans cette ligne. */
.ml-inscription [hidden]{display:none !important}
/* Dépôt des justificatifs de transport (enlèvement EXW), dans la carte enlèvement. */
.wddp-justificatifs{margin-top:16px;padding-top:14px;border-top:1px solid var(--filet)}
.wddp-justificatifs h3{font-size:16px;margin:0 0 6px}
.wddp-justificatifs h3 small{font-weight:400;color:var(--texte-doux)}
.wddp-justificatifs__liste{list-style:none;margin:0 0 10px;padding:0}
.wddp-justificatifs__liste li{padding:4px 0}
.wddp-justificatifs__date,.wddp-justificatifs__aucun{color:var(--texte-doux)}
.wddp-justificatifs__ok{color:#3f6e33;font-weight:600}
.wddp-justificatifs__err{color:var(--accent);font-weight:600}
.wddp-justificatifs__form{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
.wddp-justificatifs__form input[type=file]{max-width:100%}
.wddp-justificatifs__form .button{margin:0}
/* Qui a déposé le justificatif : le client, ou la boutique pour lui. */
.wddp-justificatifs__par{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:12px;
  background:var(--fond-doux);color:var(--texte-doux);vertical-align:1px}
.wddp-justificatifs__par--boutique{background:var(--accent);color:var(--blanc)}
.wddp-justificatifs__liste li.is-boutique{background:var(--fond-doux);padding:6px 8px;border-radius:6px}
/* Facture annulée par un avoir : le bouton reste, discret et barré. */
.woocommerce-account .wso-document__liens a.button.wso-document__annulee,.woocommerce-account .wso-document__liens a.button.wso-document__annulee:hover{background:transparent;color:var(--texte-doux);border:1px solid var(--filet);text-decoration:line-through}
/* Suivi de commande : la frise du salon, pour le client. */
.wso-suivi{margin:0 0 clamp(24px,3vw,36px);padding:clamp(18px,2.4vw,26px) clamp(18px,2.6vw,28px);border:1px solid var(--filet);background:var(--blanc)}
.wso-suivi__frise{list-style:none;margin:0;padding:0;display:flex;justify-content:space-between;position:relative;counter-reset:none}
.wso-suivi__frise::before{content:"";position:absolute;left:8%;right:8%;top:17px;height:2px;background:var(--filet)}
.wso-suivi__etape{position:relative;flex:1;text-align:center;padding:0 4px}
.wso-suivi__rond{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:2px solid var(--filet);background:var(--blanc);color:var(--texte-doux);font:600 14px/1 var(--serif);position:relative;z-index:1}
.wso-suivi__nom{display:block;margin-top:8px;font-family:var(--display);font-size:15px;color:var(--texte-doux)}
.wso-suivi__date{display:block;font-size:12px;color:var(--texte-doux)}
.wso-suivi__etape.is-fait .wso-suivi__rond{background:var(--accent);border-color:var(--accent);color:var(--blanc)}
.wso-suivi__etape.is-fait .wso-suivi__nom{color:var(--encre,#1a1a1a)}
.wso-suivi__etape.is-cours .wso-suivi__rond{border-color:var(--encre,#1a1a1a);background:var(--encre,#1a1a1a);color:var(--blanc)}
.wso-suivi__etape.is-cours .wso-suivi__nom{color:var(--encre,#1a1a1a);font-weight:700}
.wso-suivi__phrase{margin:18px 0 0;font-size:17px;line-height:1.5;max-width:62ch}
@media (max-width:640px){.wso-suivi__frise::before{display:none}.wso-suivi__frise{flex-direction:column;gap:10px}.wso-suivi__etape{display:flex;align-items:center;gap:12px;text-align:left}.wso-suivi__nom{margin-top:0}.wso-suivi__date{margin-left:auto}}
/* Détail de la commande : la photo devant le nom de l'article. */
.wso-item{display:inline-flex;align-items:center;gap:12px;vertical-align:middle;margin-right:6px}
.woocommerce-table--order-details .product-name .product-quantity{vertical-align:middle}
.wso-item__photo{width:56px;height:56px;object-fit:cover;border:1px solid var(--filet);background:var(--blanc);flex:0 0 56px}
.wso-item__nom{min-width:0}