/*
Theme Name: Flora Naturopathy
Theme URI: https://floranaturopathy.ma/
Description: Thème e-commerce « Nature riche » pour Flora Naturopathy — tisanes bio du Maroc. Basé sur Storefront + WooCommerce. Inclut boutique, panier, commande, volet consultation naturopathe et chatbot guidé.
Author: Flora Naturopathy
Version: 1.0.0
Template: storefront
Text Domain: flora-naturopathy
*/

/* =========================================================
   FLORA NATUROPATHY — DESIGN SYSTEM « NATURE RICHE »
   ========================================================= */
:root{
  /* Palette */
  --flora-forest:#1F3D1A;     /* vert forêt profond */
  --flora-sage:#4A7C2E;       /* vert sauge principal */
  --flora-leaf:#8BAF6E;       /* vert tendre accent */
  --flora-moss:#6B8E4E;       /* vert mousse */
  --flora-cream:#F5F1E8;      /* crème fond */
  --flora-sand:#EDE6D6;       /* beige texturé */
  --flora-gold:#C9A961;       /* doré */
  --flora-ink:#2A2E26;        /* texte */
  --flora-white:#FFFDF8;

  /* Typo */
  --flora-display:"Cormorant Garamond", Georgia, serif;
  --flora-body:"Poppins", system-ui, sans-serif;

  /* Espacements & rayons */
  --flora-radius:14px;
  --flora-shadow:0 10px 40px -12px rgba(31,61,26,.28);
  --flora-shadow-sm:0 4px 18px -8px rgba(31,61,26,.25);
}

/* ---------- Base ---------- */
body.flora{
  background:var(--flora-cream);
  color:var(--flora-ink);
  font-family:var(--flora-body);
  font-size:16px;
  line-height:1.7;
  /* Texture feuillage discrète */
  background-image:
    radial-gradient(circle at 12% 18%, rgba(139,175,110,.10) 0, transparent 40%),
    radial-gradient(circle at 88% 82%, rgba(74,124,46,.08) 0, transparent 45%);
  background-attachment:fixed;
}
.flora h1,.flora h2,.flora h3,.flora .h-display{
  font-family:var(--flora-display);
  color:var(--flora-forest);
  font-weight:600;
  letter-spacing:.2px;
  line-height:1.15;
}
.flora a{color:var(--flora-sage);}
.flora a:hover{color:var(--flora-forest);}
.flora .container{max-width:1180px;margin-inline:auto;padding-inline:20px;}

/* ---------- Boutons ---------- */
.flora .btn,
.flora .button,
.flora .wp-element-button,
.flora .woocommerce a.button,
.flora .woocommerce button.button,
.flora .woocommerce input.button,
.flora .woocommerce #respond input#submit{
  background:var(--flora-sage);
  color:var(--flora-white)!important;
  border:none;
  border-radius:999px;
  padding:.75em 1.6em;
  font-family:var(--flora-body);
  font-weight:600;
  letter-spacing:.3px;
  text-transform:none;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  box-shadow:var(--flora-shadow-sm);
}
.flora .btn:hover,
.flora .button:hover,
.flora .woocommerce a.button:hover,
.flora .woocommerce button.button:hover,
.flora .woocommerce input.button:hover,
.flora .woocommerce #respond input#submit:hover{
  background:var(--flora-forest);
  transform:translateY(-2px);
  box-shadow:var(--flora-shadow);
}
.flora .btn--ghost{
  background:transparent;
  color:var(--flora-forest)!important;
  border:1.5px solid var(--flora-leaf);
  box-shadow:none;
}
.flora .btn--gold{background:var(--flora-gold);color:var(--flora-forest)!important;}

/* ---------- HERO ---------- */
.flora-hero{
  position:relative;
  overflow:hidden;
  padding:120px 0 100px;
  background:
    linear-gradient(135deg, rgba(31,61,26,.80), rgba(74,124,46,.66)),
    url('assets/images/hero-botanique.png') center/cover no-repeat;
  color:var(--flora-white);
  text-align:center;
}
.flora-hero .eyebrow{
  display:inline-block;
  font-size:.8rem;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--flora-gold);
  margin-bottom:18px;
}
.flora-hero h1{
  color:var(--flora-white);
  font-size:clamp(2.4rem,5vw,4.4rem);
  margin:0 0 18px;
}
.flora-hero h1 em{color:var(--flora-leaf);font-style:italic;}
.flora-hero p.lead{
  max-width:620px;margin:0 auto 32px;
  font-size:1.1rem;opacity:.94;
}
.flora-hero .hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* Feuilles flottantes animées */
.flora-leaf{position:absolute;opacity:.18;animation:floatLeaf 14s ease-in-out infinite;pointer-events:none;font-size:5rem;}
.flora-leaf::before{content:"\1F33F";}
.flora-leaf:nth-child(2)::before{content:"\1F343";}
.flora-leaf:nth-child(4)::before{content:"\1F343";}
.flora-leaf:nth-child(1){top:12%;left:8%;width:90px;animation-delay:0s;}
.flora-leaf:nth-child(2){top:60%;left:14%;width:60px;animation-delay:-4s;}
.flora-leaf:nth-child(3){top:24%;right:10%;width:110px;animation-delay:-7s;}
.flora-leaf:nth-child(4){bottom:14%;right:18%;width:70px;animation-delay:-2s;}
@keyframes floatLeaf{
  0%,100%{transform:translateY(0) rotate(0deg);}
  50%{transform:translateY(-26px) rotate(8deg);}
}

/* ---------- Bandeau valeurs ---------- */
.flora-values{padding:72px 0;background:var(--flora-white);}
.flora-values .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.flora-value{
  text-align:center;padding:30px 20px;border-radius:var(--flora-radius);
  background:var(--flora-cream);transition:transform .3s ease,box-shadow .3s ease;
}
.flora-value:hover{transform:translateY(-6px);box-shadow:var(--flora-shadow);}
.flora-value .ico{font-size:2.4rem;display:block;margin-bottom:10px;}
.flora-value h3{font-size:1.25rem;margin:0 0 8px;}
.flora-value p{font-size:.92rem;margin:0;color:#4a4f44;}

/* ---------- Section titres ---------- */
.flora-section{padding:84px 0;}
.flora-section .section-head{text-align:center;max-width:640px;margin:0 auto 50px;}
.flora-section .eyebrow{
  color:var(--flora-gold);text-transform:uppercase;letter-spacing:3px;
  font-size:.78rem;font-weight:600;
}
.flora-section h2{font-size:clamp(2rem,4vw,3rem);margin:.3em 0 .4em;}

/* ---------- Produits (WooCommerce) ---------- */
.flora .woocommerce ul.products li.product,
.flora .woocommerce-page ul.products li.product{
  background:var(--flora-white);border-radius:var(--flora-radius);
  padding:14px;box-shadow:var(--flora-shadow-sm);
  transition:transform .3s ease,box-shadow .3s ease;text-align:center;
}
.flora .woocommerce ul.products li.product:hover{
  transform:translateY(-8px);box-shadow:var(--flora-shadow);
}
.flora .woocommerce ul.products li.product img{border-radius:10px;}
.flora .woocommerce ul.products li.product .price{
  color:var(--flora-sage);font-weight:700;font-family:var(--flora-body);
}
.flora .woocommerce span.onsale{
  background:var(--flora-gold);color:var(--flora-forest);border-radius:999px;
}

/* ---------- Volet Consultation ---------- */
.flora-consult{
  position:relative;padding:96px 0;color:var(--flora-white);
  background:linear-gradient(135deg,var(--flora-forest),var(--flora-sage));
  overflow:hidden;
}
.flora-consult::after{
  content:"🌿";position:absolute;font-size:22rem;right:-3rem;bottom:-6rem;
  opacity:.07;transform:rotate(-15deg);
}
.flora-consult .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;position:relative;z-index:2;}
.flora-consult h2{color:var(--flora-white);font-size:clamp(2rem,4vw,3rem);}
.flora-consult .eyebrow{color:var(--flora-gold);letter-spacing:3px;text-transform:uppercase;font-size:.78rem;}
.flora-consult ul{list-style:none;padding:0;margin:22px 0;}
.flora-consult ul li{padding:8px 0 8px 30px;position:relative;}
.flora-consult ul li::before{content:"✓";position:absolute;left:0;color:var(--flora-leaf);font-weight:700;}
.flora-consult-card{
  background:var(--flora-white);color:var(--flora-ink);
  border-radius:18px;padding:30px;box-shadow:var(--flora-shadow);
}
.flora-consult-card h3{margin-top:0;}
.flora-consult-card .field{margin-bottom:14px;}
.flora-consult-card label{display:block;font-size:.85rem;font-weight:600;margin-bottom:4px;color:var(--flora-forest);}
.flora-consult-card input,.flora-consult-card select,.flora-consult-card textarea{
  width:100%;padding:.7em .9em;border:1.5px solid var(--flora-sand);
  border-radius:10px;font-family:inherit;background:var(--flora-cream);
}
.flora-consult-card input:focus,.flora-consult-card select:focus,.flora-consult-card textarea:focus{
  outline:none;border-color:var(--flora-leaf);
}

/* ---------- Contact ---------- */
.flora-contact{padding:84px 0;background:var(--flora-sand);}
.flora-contact .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px;}
.flora-contact .ccard{background:var(--flora-white);border-radius:var(--flora-radius);padding:26px;text-align:center;box-shadow:var(--flora-shadow-sm);}
.flora-contact .ccard .ico{font-size:2rem;}

/* ---------- Reveal au scroll ---------- */
.flora-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease;}
.flora-reveal.is-visible{opacity:1;transform:none;}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .flora-values .grid{grid-template-columns:repeat(2,1fr);}
  .flora-consult .wrap{grid-template-columns:1fr;}
  .flora-contact .cards{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .flora-values .grid{grid-template-columns:1fr;}
  .flora-hero{padding:90px 0 70px;}
}

/* ---------- Accessibilité : mouvement réduit ---------- */
@media(prefers-reduced-motion:reduce){
  .flora-leaf{animation:none;}
  .flora-reveal{transition:none;opacity:1;transform:none;}
  .flora *{scroll-behavior:auto;}
}

/* =========================================================
   SECTIONS ADDITIONNELLES (inspiration fonctionnelle Nourish)
   ========================================================= */

/* ---------- Bande de garanties défilante ---------- */
.flora-marquee{background:var(--flora-forest);color:var(--flora-white);overflow:hidden;padding:14px 0;white-space:nowrap;}
.flora-marquee .track{display:inline-flex;align-items:center;white-space:nowrap;width:max-content;animation:floraScroll 25s linear infinite;will-change:transform;}
.flora-marquee:hover .track{animation-play-state:paused;}
.flora-marquee span{font-size:.82rem;letter-spacing:2px;text-transform:uppercase;margin:0 28px;color:var(--flora-leaf);flex:none;}
.flora-marquee span b{color:var(--flora-white);font-weight:600;}
@keyframes floraScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ---------- Promesse / résultats ---------- */
.flora-promise{padding:84px 0;background:var(--flora-white);}
.flora-promise .wrap{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
.flora-promise .checks{list-style:none;padding:0;margin:24px 0 0;}
.flora-promise .checks li{padding:10px 0 10px 36px;position:relative;font-weight:500;}
.flora-promise .checks li::before{content:"✓";position:absolute;left:0;top:8px;
  width:24px;height:24px;border-radius:50%;background:var(--flora-leaf);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:.8rem;}
.flora-promise .visual{background:linear-gradient(135deg,var(--flora-sage),var(--flora-forest));
  border-radius:22px;min-height:320px;display:flex;align-items:center;justify-content:center;
  color:#fff;font-family:var(--flora-display);font-size:1.6rem;text-align:center;padding:30px;
  box-shadow:var(--flora-shadow);position:relative;overflow:hidden;}
.flora-promise .visual::before{content:"🌿";position:absolute;font-size:14rem;opacity:.12;bottom:-3rem;right:-2rem;}

/* ---------- Packs ---------- */
.flora-packs{padding:84px 0;background:var(--flora-cream);}
.flora-packs .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;}
.flora-pack{background:var(--flora-white);border-radius:18px;overflow:hidden;
  box-shadow:var(--flora-shadow-sm);transition:transform .3s ease,box-shadow .3s ease;
  border:2px solid transparent;display:flex;flex-direction:column;}
.flora-pack:hover{transform:translateY(-8px);box-shadow:var(--flora-shadow);border-color:var(--flora-leaf);}
.flora-pack .head{padding:26px 24px 0;}
.flora-pack .badge{display:inline-block;background:var(--flora-gold);color:var(--flora-forest);
  font-size:.7rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:4px 10px;border-radius:999px;margin-bottom:12px;}
.flora-pack h3{margin:0 0 6px;font-size:1.5rem;}
.flora-pack .sub{color:var(--flora-moss);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;}
.flora-pack ul{list-style:none;padding:0 24px;margin:18px 0;flex:1;}
.flora-pack ul li{padding:7px 0 7px 24px;position:relative;font-size:.92rem;border-bottom:1px solid var(--flora-sand);}
.flora-pack ul li:last-child{border-bottom:none;}
.flora-pack ul li::before{content:"🌿";position:absolute;left:0;font-size:.85rem;}
.flora-pack .foot{padding:0 24px 26px;}
.flora-pack .price{font-size:1.6rem;font-weight:700;color:var(--flora-sage);font-family:var(--flora-body);}
.flora-pack .price small{font-size:.9rem;color:#999;text-decoration:line-through;margin-left:8px;}

/* ---------- Témoignages ---------- */
.flora-testi{padding:84px 0;background:var(--flora-white);}
.flora-testi .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;}
.flora-quote{background:var(--flora-cream);border-radius:18px;padding:30px;position:relative;}
.flora-quote::before{content:"“";font-family:var(--flora-display);font-size:5rem;color:var(--flora-leaf);
  position:absolute;top:-10px;left:18px;line-height:1;opacity:.5;}
.flora-quote p{font-style:italic;color:#3a3f34;margin:14px 0 18px;position:relative;z-index:1;}
.flora-quote .who{font-weight:600;color:var(--flora-forest);}
.flora-quote .stars{color:var(--flora-gold);letter-spacing:2px;}

@media(max-width:900px){
  .flora-promise .wrap{grid-template-columns:1fr;}
  .flora-packs .grid,.flora-testi .grid{grid-template-columns:1fr;}
}

/* ---------- Fiches produits : style des listes ---------- */
.flora .woocommerce-product-details__short-description{font-size:1.05rem;color:var(--flora-moss);}
.flora ul.flora-benefits li,.flora ul.flora-composition li{margin:6px 0;}
.flora .flora-contre{background:#fdf6ec;border-left:4px solid var(--flora-gold);padding:12px 16px;border-radius:8px;font-size:.92rem;}
.flora .flora-disclaimer{font-size:.85rem;color:#777;margin-top:14px;}

/* ---------- Page Consultation : étapes ---------- */
.flora-steps{counter-reset:step;list-style:none;padding:0;margin:30px 0 0;}
.flora-steps li{counter-increment:step;position:relative;padding:18px 18px 18px 64px;margin-bottom:14px;
  background:var(--flora-white);border-radius:14px;box-shadow:var(--flora-shadow-sm);}
.flora-steps li::before{content:counter(step);position:absolute;left:16px;top:50%;transform:translateY(-50%);
  width:34px;height:34px;border-radius:50%;background:var(--flora-sage);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-family:var(--flora-body);}
.flora-steps li strong{color:var(--flora-forest);}

/* =========================================================
   CORRECTIFS MOBILE & FINITIONS
   ========================================================= */

/* Masquer le crédit "Built with WooCommerce" et autres mentions du footer */
.flora .site-info .woocommerce-store-notice,
.flora .storefront-credit,
.flora .site-info a[href*="woocommerce.com"],
.flora .site-info .site-info-credit{display:none!important;}
/* Si le footer ne contient plus que ça, on neutralise le texte parasite */
.flora .site-info{font-size:.85rem;color:#6b8e4e;}

/* Bouton WhatsApp + chatbot : remonter au-dessus de la barre mobile */
@media(max-width:782px){
  #flora-wa{left:14px;bottom:84px;z-index:9999;}
  #flora-chat{right:14px;bottom:84px;z-index:9999;}
  #flora-chat .fc-window{bottom:70px;width:300px;}
  #flora-wa a{padding:12px;}            /* icône seule sur mobile */
  #flora-wa .label{display:none;}
}

/* Section produits : grille propre et cartes alignées */
.flora .woocommerce ul.products{display:grid;gap:20px;margin:0;}
.flora .woocommerce ul.products li.product{width:auto!important;margin:0!important;float:none!important;
  display:flex;flex-direction:column;}
.flora .woocommerce ul.products li.product a img{aspect-ratio:1/1;object-fit:cover;width:100%;}
.flora .woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--flora-display);font-size:1.15rem;color:var(--flora-forest);padding:.4em 0;}
.flora .woocommerce ul.products li.product .button{margin-top:auto;}
/* Colonnes responsives */
@media(min-width:981px){.flora .woocommerce ul.products{grid-template-columns:repeat(4,1fr);}}
@media(min-width:601px) and (max-width:980px){.flora .woocommerce ul.products{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.flora .woocommerce ul.products{grid-template-columns:repeat(2,1fr);gap:12px;}
  .flora .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:1rem;}}

/* Packs : meilleure respiration mobile */
@media(max-width:600px){
  .flora-pack h3{font-size:1.3rem;}
  .flora-packs .grid,.flora-testi .grid,.flora-contact .cards{gap:16px;}
  .flora-section{padding:54px 0;}
  .flora-hero{padding:80px 0 60px;}
  .flora-hero h1{font-size:2rem;}
}

/* Section head : plus d'air */
.flora-section .section-head{margin-bottom:40px;}
.flora-section .section-head p{color:#5a5f54;}

/* ---------- Header : fond botanique au lieu du noir uni ---------- */
.flora .site-header,
.flora.storefront .site-header{
  background-color:#1F3D1A!important;
  background-image:url('assets/images/header-botanique.png')!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
