/* ============================================================
   PRÉPARATEUR.E46 — LES BOUTONS
   ============================================================
   Règle unique, héritée de Gravano et vraie ici aussi : **jamais plat au
   repos.** Un bouton au contour transparent ressemble à du texte décoratif ;
   les gens ne cliquent pas dessus. Donc au repos il est déjà rempli et déjà
   soulevé — au survol il se soulève un peu plus, au clic il s'enfonce pour de
   bon. La tranche solide (box-shadow sans flou) fait l'épaisseur.
   ============================================================ */

.pe-bouton,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce .button.alt,
.single_add_to_cart_button,
.checkout-button{
  --pe-b-fond:  linear-gradient(168deg, var(--pe-or-clair) 0%, var(--pe-or) 52%, var(--pe-or-sombre) 100%);
  --pe-b-tranche: #6b4e06;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  padding:.58rem 1.1rem;
  border:0;
  border-radius:9px;
  cursor:pointer;

  font-family:'Barlow Condensed', sans-serif;
  font-size:.94rem;
  font-weight:600;
  letter-spacing:.07em;
  text-transform:uppercase;
  text-decoration:none !important;
  /* Le texte est sombre sur l'or : de l'or clair avec du blanc dessus se lit
     mal, et le contraste doit tenir pour tout le monde, pas seulement pour un
     œil neuf sur un bel écran. */
  color:#17130a;
  white-space:nowrap;

  background:var(--pe-b-fond);
  box-shadow:0 3px 0 var(--pe-b-tranche),
             0 7px 16px rgba(0,0,0,.3),
             inset 0 1px 0 rgba(255,255,255,.35);
  transform:translateY(-2px);
  transition:transform .13s ease, box-shadow .13s ease, filter .13s ease;
}

.pe-bouton:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.single_add_to_cart_button:hover,
.checkout-button:hover{
  transform:translateY(-4px);
  filter:brightness(1.06);
  box-shadow:0 5px 0 var(--pe-b-tranche),
             0 12px 22px rgba(0,0,0,.36),
             inset 0 1px 0 rgba(255,255,255,.42);
}

.pe-bouton:active,
.woocommerce button.button:active,
.woocommerce a.button:active,
.single_add_to_cart_button:active,
.checkout-button:active{
  transform:translateY(1px);
  box-shadow:0 1px 0 var(--pe-b-tranche),
             0 2px 6px rgba(0,0,0,.4),
             inset 0 2px 4px rgba(0,0,0,.18);
}

/* Le focus clavier doit être VISIBLE et ne pas se confondre avec le survol :
   quelqu'un qui navigue au clavier doit savoir où il est. */
.pe-bouton:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce a.button:focus-visible{
  outline:2px solid var(--pe-blanc);
  outline-offset:3px;
}


/* ── LE BOUTON SECONDAIRE ────────────────────────────────────────────────────
   Pour les produits à variantes, où l'action honnête est « aller voir » et non
   « ajouter ». Même relief, mais en métal plutôt qu'en or : la hiérarchie se lit
   d'un coup d'œil sans que le bouton ait l'air désactivé. */
.pe-bouton--voir,
.pe-bouton--metal{
  --pe-b-fond: linear-gradient(168deg, var(--pe-graphite) 0%, var(--pe-fonte) 55%, #24282c 100%);
  --pe-b-tranche: #101316;
  color:var(--pe-blanc);
}
.pe-bouton--voir{ cursor:pointer; }


/* ── L'ÉTAT « AJOUTÉ » ───────────────────────────────────────────────────────
   Un bouton qui ne dit rien après le clic laisse croire que rien ne s'est
   passé, et la personne clique deux fois. Il annonce donc ce qui vient
   d'arriver, au passé. */
.pe-bouton--ajout[data-etat="encours"]{
  filter:saturate(.5);
  pointer-events:none;
}
.pe-bouton--ajout[data-etat="fait"]{
  --pe-b-fond: linear-gradient(168deg,#4ADE80 0%,var(--pe-confiance) 55%,#1B9E56 100%);
  --pe-b-tranche:#137a41;
  color:#08210f;
}


/* ── DRIFT — même les boutons s'embrasent (Florient, 01/08) ─────────────────
   Demande explicite : une ambiance à part pour Drift, jusque dans les
   boutons d'ajout — pas seulement le fond de la zone. Même mécanique de
   relief que le bouton or (tranche, hover, active, état « ajouté » qui reste
   vert par-dessus grâce à sa spécificité plus précise) : seules les deux
   variables de couleur changent, exactement comme le fait déjà le bouton
   secondaire « voir » avec le métal. Couvre les cartes du fil
   (.pe-zone--drift) ET la fiche produit seule (WooCommerce pose
   `product_cat-drift` sur le wrapper dès que le produit est dans ce rayon). */
.pe-zone--drift .pe-bouton--ajout,
.product_cat-drift .single_add_to_cart_button{
  --pe-b-fond: linear-gradient(168deg, var(--pe-feu-clair) 0%, var(--pe-feu) 55%, var(--pe-feu-sombre) 100%);
  --pe-b-tranche: #5c1804;
}


/* ── LE BOUTON PRINCIPAL DE LA FICHE PRODUIT ─────────────────────────────────
   Il est le seul de la page : il a droit à plus de place. */
.single_add_to_cart_button{
  padding:.85rem 1.7rem;
  font-size:1.05rem;
  width:100%;
}


/* ── WOOCOMMERCE : ce qu'on éteint ───────────────────────────────────────────
   Le lien gris « Voir le panier » qui apparaît sous chaque bouton après un
   ajout. Avec un panier en tiroir qui s'ouvre de lui-même, il fait doublon et
   propose une sortie du fil au moment précis où on veut y rester. */
.woocommerce .added_to_cart{ display:none !important; }