/*
Theme Name:   Blablarab Child
Theme URI:    https://blablarab.com
Description:  Thème enfant de Hello Elementor pour Blablarab. Contient les correctifs
              de conversion et de charte graphique. Ne jamais modifier le thème parent :
              les changements seraient perdus à la prochaine mise à jour.
Author:       Blablarab
Template:     hello-elementor
Version:      1.1.1
Text Domain:  blablarab-child
*/

/* ==========================================================================
   Jetons de couleur — repris de la charte Elementor du site (kit post-12)
   ========================================================================== */

:root {
  --bl-brun:        #351C13; /* couleur primaire — en-tête, pied de page */
  --bl-dore:        #C6A379; /* couleur secondaire — boutons */
  --bl-dore-fonce:  #AD7532; /* survol */
  --bl-texte:       #4F4F4F;
  --bl-creme:       #F5EDDC; /* fond des pages boutique */
}

/* ==========================================================================
   1. Boutons WooCommerce « alt » — corrige le bouton violet (constat B-03)

   Le CSS de l'Customizer stylait déjà « .woocommerce button.button »
   (spécificité 0-2-1). Mais WooCommerce colore ses boutons principaux via
   « .woocommerce button.button.alt » (0-3-1), plus spécifique : sa couleur
   mauve #a46497 l'emportait. D'où le bouton violet sur les fiches produit.

   On ne reprend donc QUE les variantes « .alt » manquantes, en réutilisant
   exactement les valeurs déjà choisies dans l'Customizer (fond #351C13,
   survol #2a140e, rayon 5px). L'objectif est de réparer, pas de redessiner.
   ========================================================================== */

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce button.single_add_to_cart_button {
  background-color: var(--bl-brun);
  color: #FFFFFF;
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
  font-weight: 600;
  transition: background-color 0.3s ease;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce button.single_add_to_cart_button:hover {
  background-color: #2a140e;
  color: #FFFFFF;
}

/* Les boutons désactivés doivent rester visiblement inactifs. */
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt:disabled {
  background-color: #8A7A72;
  cursor: not-allowed;
}

/* Le focus clavier n'était traité nulle part : ajout pour l'accessibilité. */
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.wc-block-components-button:focus-visible {
  outline: 2px solid var(--bl-dore);
  outline-offset: 2px;
}

/* ==========================================================================
   2. Barre d'action fixe sur mobile (constat T-01)
   Le balisage est injecté par functions.php. Masquée sur le panier et la
   commande pour ne pas concurrencer le bouton de paiement.
   ========================================================================== */

.bl-cta-mobile {
  display: none;
}

@media (max-width: 767px) {
  .bl-cta-mobile {
    display: block;
    position: fixed;
    inset: auto 0 0 0;
    z-index: 9999;
    background: var(--bl-brun);
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    box-shadow: 0 -2px 14px rgba(0, 0, 0, 0.18);
  }

  .bl-cta-mobile a {
    display: block;
    text-align: center;
    background: var(--bl-dore);
    color: var(--bl-brun);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    padding: 13px 16px;
    border-radius: 999px;
  }

  .bl-cta-mobile a:active { background: var(--bl-dore-fonce); color: #FFFFFF; }
  .bl-cta-mobile a:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 2px; }

  /* Empêche la barre de recouvrir la fin du contenu */
  body.bl-has-cta-mobile { padding-bottom: 76px; }
}

/* ==========================================================================
   3. Bloc ebook gratuit, avant le pied de page (constat B-06)
   Volontairement sobre : il doit prolonger la page, pas concurrencer le
   bandeau d'annonce des dates déjà présent en haut du site.
   ========================================================================== */

.bl-ebook {
  background: var(--bl-brun);
  color: #FFFFFF;
  padding: clamp(40px, 7vw, 64px) 20px;
}

.bl-ebook__inner {
  max-width: 620px;
  margin: 0 auto;
  text-align: center;
}

.bl-ebook__eyebrow {
  margin: 0 0 12px;
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--bl-dore);
}

/* Sélecteur imbriqué volontaire (0-2-0) : le kit Elementor impose
   « .elementor-kit-12 h2 { color: #351C13 } » (0-1-1), soit exactement la
   couleur du fond de ce bloc. Une classe seule ne suffisait pas à le battre. */
.bl-ebook .bl-ebook__titre {
  margin: 0 0 16px;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(1.5rem, 4vw, 2.1rem);
  line-height: 1.2;
  color: #FFFFFF;
  text-wrap: balance;
}

.bl-ebook__texte {
  margin: 0 0 28px;
  font-size: 1rem;
  line-height: 1.65;
  color: #E8DED4;
}

.bl-ebook__bouton {
  display: inline-block;
  background: var(--bl-dore);
  color: var(--bl-brun);
  font-family: "Playfair Display", Georgia, serif;
  font-size: 1.05rem;
  font-weight: 700;
  text-decoration: none;
  padding: 14px 34px;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}

.bl-ebook__bouton:hover,
.bl-ebook__bouton:focus {
  background: var(--bl-dore-fonce);
  color: #FFFFFF;
}

.bl-ebook__bouton:focus-visible {
  outline: 2px solid #FFFFFF;
  outline-offset: 3px;
}

.bl-ebook__mention {
  margin: 16px 0 0;
  font-size: 0.82rem;
  color: #B9A796;
}

/* La barre fixe mobile recouvrirait le bouton : on dégage la hauteur. */
@media (max-width: 767px) {
  .bl-ebook { padding-bottom: clamp(48px, 9vw, 72px); }
}

/* ==========================================================================
   4. Divers
   ========================================================================== */

/* Le fil d'Ariane « Accueil / Non classé / … » n'apporte rien tant que les
   produits ne sont pas rangés dans de vraies catégories. */
.woocommerce .woocommerce-breadcrumb { color: var(--bl-texte); font-size: 0.85rem; }

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
