/*
Theme Name: Hara Child
Theme URI: https://hara.thembaydev.com/
Author: Thembay
Description: This is a child theme for Hara
Version: 3.0
Author URI: https://thembay.com/
Template: hara
Text Domain: hara-child
*/

/* [ Add your custom css below ]
- - - - - - - - - - - - - - - - - - - - */

/* ============================================
   MANDELYA - CSS PREMIUM v3.0
   Design haut de gamme, sobre et naturel
============================================ */

/* === VARIABLES === */
:root {
  --m-green: #2d6a4f;
  --m-green-light: #52b788;
  --m-green-dark: #1b4332;
  --m-cream: #faf7f2;
  --m-cream-mid: #f2ede4;
  --m-border: #e0d8cc;
  --m-text: #1a1a1a;
  --m-text-mid: #444;
  --m-text-light: #888;
  --m-radius: 4px;
  --m-radius-lg: 8px;
  --font-title: 'Playfair Display', 'Georgia', serif;
  --font-body: 'Raleway', 'Helvetica Neue', Arial, sans-serif;
}

/* === TYPOGRAPHIE GLOBALE === */
body,
.site,
.entry-content,
.woocommerce,
p, span, div, li, a {
  font-family: var(--font-body) !important;
  -webkit-font-smoothing: antialiased;
  color: var(--m-text);
}

h1, h2, h3, h4,
.product_title,
.entry-title,
.woocommerce-loop-product__title,
.widget-title,
.section-title {
  font-family: var(--font-title) !important;
}

/* === BREADCRUMB === */
.woocommerce-breadcrumb {
  background: transparent !important;
  padding: 12px 0 !important;
  font-size: 12px !important;
  color: var(--m-text-light) !important;
  border-bottom: none !important;
  margin-bottom: 0 !important;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.woocommerce-breadcrumb a {
  color: var(--m-green) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
.woocommerce-breadcrumb a:hover {
  text-decoration: underline !important;
}

/* ============================================
   VIGNETTES PRODUIT (shop grid)
============================================ */
.products.columns-3 li.product,
.products.columns-4 li.product,
ul.products li.product {
  border: 1px solid var(--m-border) !important;
  border-radius: var(--m-radius-lg) !important;
  overflow: hidden !important;
  background: #fff !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease !important;
  padding: 0 !important;
  margin-bottom: 24px !important;
}
ul.products li.product:hover {
  box-shadow: 0 8px 32px rgba(45,106,79,0.12) !important;
  transform: translateY(-3px) !important;
}

/* Image vignette */
ul.products li.product a img {
  border-radius: 0 !important;
  width: 100% !important;
  height: 260px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.4s ease !important;
}
ul.products li.product:hover a img {
  transform: scale(1.04) !important;
}

/* Zone texte sous image */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2 {
  font-family: var(--font-title) !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  color: var(--m-green-dark) !important;
  padding: 14px 16px 4px !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

ul.products li.product .price {
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  color: var(--m-green) !important;
  font-weight: 700 !important;
  padding: 0 16px 6px !important;
  display: block !important;
}
ul.products li.product .price del {
  color: var(--m-text-light) !important;
  font-weight: 400 !important;
  font-size: 0.8rem !important;
  margin-right: 6px !important;
}
ul.products li.product .price ins {
  text-decoration: none !important;
  color: var(--m-green) !important;
}

/* Bouton add to cart sur vignette */
ul.products li.product .button,
ul.products li.product .add_to_cart_button {
  display: block !important;
  width: calc(100% - 32px) !important;
  margin: 4px 16px 16px !important;
  padding: 10px 0 !important;
  background: transparent !important;
  color: var(--m-green) !important;
  border: 1.5px solid var(--m-green) !important;
  border-radius: var(--m-radius) !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: none !important;
}
ul.products li.product .button:hover,
ul.products li.product .add_to_cart_button:hover {
  background: var(--m-green) !important;
  color: #fff !important;
}

/* Badge promo sur vignette - sobre, petit, sans bordure rouge */
ul.products li.product .onsale,
span.onsale {
  background: var(--m-green-dark) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 3px !important;
  padding: 3px 9px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
  font-family: var(--font-body) !important;
  min-height: auto !important;
  min-width: auto !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  top: 12px !important;
  left: 12px !important;
}

/* ============================================
   FICHE PRODUIT SINGLE
============================================ */

/* Layout sticky */
.single-product .woocommerce-product-gallery {
  position: sticky !important;
  top: 90px !important;
}
.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img {
  border-radius: var(--m-radius-lg) !important;
  box-shadow: none !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li img {
  border-radius: 4px !important;
  border: 2px solid transparent !important;
  transition: border-color 0.2s !important;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active,
.single-product .woocommerce-product-gallery .flex-control-thumbs li img:hover {
  border-color: var(--m-green) !important;
}

/* Summary */
.single-product .summary.entry-summary {
  padding-left: 36px !important;
}

/* Titre produit */
.single-product h1.product_title.entry-title {
  font-family: var(--font-title) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  color: var(--m-green-dark) !important;
  line-height: 1.2 !important;
  margin-bottom: 6px !important;
  letter-spacing: -0.3px;
}

/* Prix sur fiche produit */
.single-product .summary .price {
  font-family: var(--font-body) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: var(--m-green) !important;
  margin-bottom: 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.single-product .summary .price del {
  font-size: 1rem !important;
  color: var(--m-text-light) !important;
  font-weight: 400 !important;
}
.single-product .summary .price ins {
  text-decoration: none !important;
}

/* Rating block */
.single-product .woocommerce-product-rating {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
  margin-bottom: 18px !important;
  border-radius: 0 !important;
}
.single-product .woocommerce-product-rating .star-rating {
  color: #c8a45a !important;
  font-size: 14px !important;
}
.single-product .woocommerce-product-rating a,
.single-product .woocommerce-product-rating span {
  font-size: 12px !important;
  color: var(--m-text-light) !important;
  font-weight: 500 !important;
}

/* Description courte */
.single-product .woocommerce-product-details__short-description {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  margin-bottom: 22px !important;
}
.single-product .woocommerce-product-details__short-description p {
  font-size: 0.95rem !important;
  color: var(--m-text-mid) !important;
  line-height: 1.75 !important;
  margin: 0 !important;
  font-family: var(--font-body) !important;
}

/* Diviseur entre description et bouton */
.single-product .summary .woocommerce-product-details__short-description::after {
  content: '';
  display: block;
  height: 1px;
  background: var(--m-border);
  margin: 20px 0;
}

/* Sélecteur quantité + bouton */
.single-product .cart {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 24px !important;
  flex-wrap: nowrap !important;
}

/* Input quantité */
.single-product .cart .qty-container,
.single-product .cart .quantity {
  display: flex !important;
  align-items: center !important;
  border: 1.5px solid var(--m-border) !important;
  border-radius: var(--m-radius) !important;
  overflow: hidden !important;
  background: #fff !important;
  flex-shrink: 0 !important;
}
.single-product .cart .qty-btn,
.single-product .cart button.qty-btn {
  width: 36px !important;
  height: 44px !important;
  background: transparent !important;
  border: none !important;
  color: var(--m-green) !important;
  font-size: 1.1rem !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.2s !important;
}
.single-product .cart .qty-btn:hover {
  background: var(--m-cream) !important;
}
.single-product .cart input.qty,
.single-product .cart input[type="number"] {
  width: 44px !important;
  height: 44px !important;
  text-align: center !important;
  border: none !important;
  border-left: 1.5px solid var(--m-border) !important;
  border-right: 1.5px solid var(--m-border) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--m-text) !important;
  background: transparent !important;
  -moz-appearance: textfield !important;
  padding: 0 !important;
}

/* BOUTON AJOUTER AU PANIER - élégant et sobre */
.single-product .cart .single_add_to_cart_button,
.single-product .single_add_to_cart_button {
  flex: 1 !important;
  padding: 13px 28px !important;
  background: var(--m-green) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--m-radius) !important;
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: background 0.25s ease !important;
  box-shadow: none !important;
  min-height: 46px !important;
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.single-product .cart .single_add_to_cart_button:hover {
  background: var(--m-green-dark) !important;
}

/* Méta produit (SKU, catégories, tags) */
.single-product .product_meta {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  border-top: 1px solid var(--m-border) !important;
  padding-top: 18px !important;
  margin-top: 4px !important;
}
.single-product .product_meta span,
.single-product .product_meta a {
  font-size: 12px !important;
  color: var(--m-text-light) !important;
  font-family: var(--font-body) !important;
}
.single-product .product_meta a {
  color: var(--m-green) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.single-product .product_meta a:hover {
  text-decoration: underline !important;
}

/* ============================================
   SECTIONS ENRICHIES FICHE PRODUIT
   (Ingrédients, Bienfaits, Utilisation)
============================================ */

/* Onglets WooCommerce */
.single-product .woocommerce-tabs {
  margin-top: 48px !important;
  border-top: 1px solid var(--m-border) !important;
  padding-top: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  display: flex !important;
  gap: 0 !important;
  margin-bottom: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs::before {
  display: none !important;
}
.single-product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs li a {
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: var(--m-text-light) !important;
  padding: 16px 24px !important;
  display: block !important;
  background: transparent !important;
  border: none !important;
}
.single-product .woocommerce-tabs ul.tabs li.active {
  border-bottom: 2px solid var(--m-green) !important;
  background: transparent !important;
}
.single-product .woocommerce-tabs ul.tabs li.active a {
  color: var(--m-green) !important;
}
.single-product .woocommerce-tabs ul.tabs li::before,
.single-product .woocommerce-tabs ul.tabs li::after {
  display: none !important;
}
.single-product .woocommerce-tabs .woocommerce-Tabs-panel {
  padding: 32px 0 !important;
  background: transparent !important;
  border: none !important;
}
.single-product .woocommerce-tabs .woocommerce-Tabs-panel p {
  font-size: 0.92rem !important;
  line-height: 1.8 !important;
  color: var(--m-text-mid) !important;
  max-width: 720px !important;
}

/* Avis clients */
.single-product #reviews .woocommerce-Reviews-title {
  font-family: var(--font-title) !important;
  font-size: 1.4rem !important;
  color: var(--m-green-dark) !important;
  border-bottom: 1px solid var(--m-border) !important;
  padding-bottom: 12px !important;
  margin-bottom: 24px !important;
}
.single-product #reviews .comment {
  background: var(--m-cream) !important;
  border-radius: var(--m-radius-lg) !important;
  padding: 20px 24px !important;
  margin-bottom: 16px !important;
  border: 1px solid var(--m-border) !important;
}
.single-product #reviews .comment-text p.meta {
  font-size: 12px !important;
  color: var(--m-text-light) !important;
}
.single-product #reviews .star-rating {
  color: #c8a45a !important;
}

/* Produits liés */
.single-product .related h2,
.single-product .upsells h2 {
  font-family: var(--font-title) !important;
  font-size: 1.5rem !important;
  color: var(--m-green-dark) !important;
  margin-bottom: 28px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid var(--m-border) !important;
}

/* ============================================
   SECTIONS RICH CONTENT (si ajoutées via WP editor)
============================================ */

/* Bloc bénéfices */
.mandelya-benefits {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: 48px 0;
  padding: 40px;
  background: var(--m-cream);
  border-radius: var(--m-radius-lg);
}
.mandelya-benefit-item {
  text-align: center;
}
.mandelya-benefit-item .icon {
  font-size: 2rem;
  margin-bottom: 12px;
  display: block;
}
.mandelya-benefit-item h4 {
  font-family: var(--font-title) !important;
  font-size: 1rem;
  color: var(--m-green-dark);
  margin-bottom: 6px;
}
.mandelya-benefit-item p {
  font-size: 0.85rem;
  color: var(--m-text-mid);
  line-height: 1.6;
}

/* ============================================
   RESPONSIVE
============================================ */
@media (max-width: 991px) {
  .single-product .summary.entry-summary {
    padding-left: 12px !important;
  }
  .single-product h1.product_title.entry-title {
    font-size: 1.6rem !important;
  }
  .mandelya-benefits {
    grid-template-columns: 1fr 1fr;
    padding: 24px;
  }
}
@media (max-width: 767px) {
  .single-product .summary.entry-summary {
    padding-left: 0 !important;
    margin-top: 24px !important;
  }
  .single-product h1.product_title.entry-title {
    font-size: 1.4rem !important;
  }
  .single-product .cart {
    flex-wrap: wrap !important;
  }
  .single-product .cart .single_add_to_cart_button {
    flex: 1 1 100% !important;
  }
  .mandelya-benefits {
    grid-template-columns: 1fr;
  }
  .single-product .woocommerce-tabs ul.tabs li a {
    padding: 12px 14px !important;
    font-size: 11px !important;
  }
}
@media (max-width: 480px) {
  ul.products li.product a img {
    height: 200px !important;
  }
  .single-product .summary .price {
    font-size: 1.2rem !important;
  }
}

/* ============================================
   SCROLLBAR
============================================ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f5f5f5; }
::-webkit-scrollbar-thumb { background: var(--m-green-light); border-radius: 3px; }


/* === GALERIE STICKY - Suit le bloc de droite au scroll === */
@media (min-width: 992px) {
  .woocommerce-product-gallery {
    position: sticky !important;
    top: 100px !important;
    align-self: flex-start !important;
  }
  
  .single-product .woocommerce div.product {
    align-items: flex-start !important;
  }
  
  /* Pour Elementor product gallery widget */
  .elementor-widget-woocommerce-product-images .woocommerce-product-gallery,
  .woocommerce-product-gallery--with-images {
    position: sticky !important;
    top: 100px !important;
    align-self: flex-start !important;
  }
  
  /* Colonnes flex produit */
  .wc-block-product-image-gallery,
  .woocommerce-product-gallery__wrapper {
    position: sticky !important;
    top: 100px !important;
  }
}


/* === TRADUCTIONS CSS - textes du plugin bundle === */
/* Masquer le texte anglais "Best offer" et afficher en francais */
.bundle-message-blink {
  visibility: hidden;
  position: relative;
  font-size: 0 !important;
}
.bundle-message-blink::after {
  content: "Meilleure offre";
  visibility: visible;
  font-size: 12px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}