/* =========================================================
   🎯 PDP FINAL — SAFE + FULLY COMPATIBLE
========================================================= */

:root{
  --pdp-accent: #ff4500;
  --pdp-green: #16a34a;
  --pdp-text: #111;
  --pdp-muted: rgba(0,0,0,.6);
  --pdp-soft: #f5f5f5;
  
  
  --content-width: 560px;
}


/* =========================================================
   🖼️ GALLERY
========================================================= */
.pdp-media{ margin:0; padding:0; background:#fff; }

.pdp-media__stage{
  position: relative;
  overflow: hidden;
}

.pdp-media__img{
  width:100%;
  display:block;
}

/* PAGINATION */
.pdp-pagination{
  position:absolute;
  bottom:18px;

  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;

  display:inline-flex !important;
  align-items:center;
  justify-content:center;

  width:auto !important;
  min-width:unset !important;
  max-width:max-content !important;

  gap:4px;
  white-space:nowrap;
  text-align:center;

  padding:4px 8px;
  border-radius:999px;

  z-index:2;

  background:rgba(0,0,0,0.28);

  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);

  box-shadow:0 2px 8px rgba(0,0,0,0.18);
}

/* BULLETS */
.pdp-pagination .swiper-pagination-bullet{
  width:5px;
  height:5px;

  background:rgba(255,255,255,0.75);

  opacity:1;
  margin:0;

  border-radius:50%;

  transition:all .2s ease;
}

/* ACTIVE */
.pdp-pagination .swiper-pagination-bullet-active{
  width:16px;
  background:#fff;
  border-radius:6px;
}


.pdp-media__swiper{
  position:relative;
}


  /* =========================
     BAGDE
  ========================= */
  
  .woocommerce span.onsale{
  position:absolute;
  top:12px;
  left:12px;
  z-index:5; /* 🔥 AU-DESSUS de tout */
}

.woocommerce span.onsale{
  position:absolute;
  top:12px;
  left:12px;
  z-index:5;

  background:#ff3b00;
  color:#fff;

  font-size:12px;
  font-weight:700;

  padding:6px 10px;
  border-radius:8px;

  line-height:1;
  min-height:auto;

  box-shadow:0 4px 10px rgba(0,0,0,0.15);
  
}

@keyframes mhgn-badge-pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.08);
  }
  100% {
    transform: scale(1);
  }
}

.woocommerce span.onsale{
  animation: mhgn-badge-pulse 1.8s infinite ease-in-out;
}



/* =========================================================
   🧠 HEADER (FIX COMPLET)
========================================================= */
.mhgn-product-header{
  padding:18px 12px 0;
  background:#fff;
  display:block;
}

/* RYTHME GLOBAL PROPRE */
.mhgn-product-header > * + *{
  margin-top:42px;
}

/* -------------------------
   SOCIAL PROOF — Version finale Safari safe
------------------------- */

.mhgn-social-proof .left{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:5px;
}

.mhgn-social-proof .stars{
  display:inline-flex;
  align-items:center;
  gap:2px;
}

/* Toutes les étoiles */
.mhgn-social-proof .star{
  position:relative;

  width:auto;
  display:inline-block;

  font-size:22px;
  line-height:1;
  font-family:Arial, sans-serif;

  margin:0;
  padding:0;

  flex-shrink:0;
}

/* Pleines */
.mhgn-social-proof .star.full{
  color:#ff5a1f;
  text-shadow:0 0 4px rgba(255,90,31,.12);
}

/* Partielle base */
.mhgn-social-proof .star.partial{
  color:#d1d5db;
}

/* Couche orange EXACTEMENT même glyphe */
.mhgn-social-proof .star.partial::before{
  content:"★";
  position:absolute;
  top:0;
  left:0;

  width:50%; /* ajuste ici */
  overflow:hidden;
  white-space:nowrap;

  color:#ff5a1f;
  text-shadow:0 0 4px rgba(255,90,31,.12);
}

/* Kill anciens systèmes */
.mhgn-social-proof .partial-star,
.mhgn-social-proof .stars-fill,
.mhgn-social-proof .stars::before{
  display:none !important;
}

/* Texte */
.mhgn-social-proof .rating-text{
  font-size:15px;
  font-weight:500;
  color:#6b7280;
  white-space:nowrap;
}

/* TITRE */
.mhgn-title{
  font-size:22px;
  font-weight:800;
  line-height:1.3;
  margin:0;
  color:var(--pdp-text);

  white-space: normal;
  overflow: visible;
  text-overflow: unset;

  word-break: break-word;
  overflow-wrap: anywhere;
}


/* PRIX FIX */
/* STRUCTURE */
.mhgn-product-header{
  display:flex;
  flex-direction:column;
}

/* TITRE */
.mhgn-title{
  display:block;
  margin-bottom:10px; 
}


/* PRIX WRAP */
.mhgn-price-wrap{
  margin:0;
  display:block;
  width:100%;
  clear:both;
  
}

/* PRIX PRINCIPAL */
.price-main{
  display:block;
  width:100%;

  font-size:30px;
  font-weight:700;
  color:var(--pdp-accent);
  line-height:1.2;
}

/* PRIX SECONDAIRE */
.price-secondary{
  display:flex;
  gap:8px;
  align-items:center;
  margin-top:4px;
}

.price-old{
  text-decoration:line-through;
  font-size:14px;
  color:var(--pdp-muted);
}

.price-save{
  background:#e8f7ee;
  color:var(--pdp-green);
  font-size:12px;
  padding:3px 8px;
  border-radius:6px;
  font-weight:600;
  
}


/* =========================================================
   🧱 STRUCTURE (NOUVEAU HTML)
========================================================= */

.summary,
.entry-summary{
  background:transparent !important;
}

.mhgn-product-section{
  background:#fff;
  padding:16px 16px 0;
}

/* Ligne uniquement avant le PREMIER checkout */
.mhgn-product-section + .mhgn-checkout-section{
  margin-top:24px;
  padding:24px 16px 0;
  border-top:1px solid #e5e7eb;
}

/* =========================================================
   🧾 BENEFITS
========================================================= */

.mhgn-short-desc{
  margin-top:0;
  padding:0;
}

.mhgn-short-desc ul{
  list-style:none;
  margin:6px 0 0;
  padding:18px 16px;

  display:flex;
  flex-direction:column;
  gap:12px;

  background:#fafafa;
  border-radius:16px;

  border:1px solid #eeeeee;
  box-shadow:0 1px 3px rgba(0,0,0,0.03);
}

.mhgn-short-desc li{
  font-size:14px;
  color:#1f2937;

  display:flex;
  align-items:center;
  gap:10px;

  line-height:1.45;

  transition:transform 0.15s ease;
}

.mhgn-short-desc li:active{
  transform:scale(0.98);
}

.mhgn-short-desc li::before{
  content:"✓";

  width:22px;
  height:22px;

  display:flex;
  align-items:center;
  justify-content:center;

  background:var(--pdp-green);
  color:#fff;

  border-radius:50%;

  font-size:12px;
  font-weight:800;

  box-shadow:0 4px 10px rgba(22,163,74,0.35);
  flex-shrink: 0;
}


/* =========================================================
   📦 CHECKOUT
========================================================= */

.mhgn-inline-checkout{
  background:#fff;
  border-radius:16px;
  padding:16px;
  box-shadow:0 4px 16px rgba(0,0,0,0.05);
}



/* =========================================================
   ❓ FAQ — VERSION FINALE CLEAN
========================================================= */

.pdp-faq{
  margin-top:0;
  padding:24px 0;
  background:transparent;

  width:100vw;
  margin-left:calc(50% - 50vw);
}

/* 🔥 CONTENEUR ALIGNÉ AVEC CHECKOUT */
.pdp-faq__inner{
  max-width: 560px;
  margin: 0 auto;
  padding: 0 16px; /* 👈 IMPORTANT */
}



/* TITRE */
.pdp-faq__title{
  font-size: 18px;
  font-weight: 900;
  margin-bottom: 16px;
  letter-spacing: 0.05em;
}

.pdp-faq__title::after{
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--pdp-green);
  margin-top: 6px;
  border-radius: 2px;
}

/* ITEM */
.pdp-faq__item{
  width: 100%;
  background: #fff;
  border: 1.5px solid #e5e3dc;
  border-radius: 14px;
  margin-bottom: 12px;
  overflow: hidden;
  transition: all 0.2s ease;
}

/* TAP EFFECT */
.pdp-faq__item:active{
  transform: scale(0.99);
}

/* QUESTION */
.pdp-faq__question{
  width: 100%;
  padding: 16px;

  font-size: 14px;
  font-weight: 700;
  color: #111;

  display: flex;
  justify-content: space-between;
  align-items: center;

  background: none;
  border: none;
  cursor: pointer;
}

/* ICON */
.pdp-faq__icon{
  font-size: 20px;
  color: var(--pdp-green);
  transition: transform 0.25s ease;
}

/* ANSWER */
.pdp-faq__answer{
  padding: 0 16px 16px;
  padding-top: 12px;

  font-size: 13.5px;
  color: #666;
  line-height: 1.7;

  border-top: 1px dashed #eee;
}

/* OPEN STATE */
.pdp-faq__item.open{
  box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}

.pdp-faq__item.open .pdp-faq__icon{
  transform: rotate(45deg);
}

/* =========================================================
   📌 STICKY CTA — VERSION SIMPLE & STABLE
========================================================= */

.pdp-sticky-cta{

  position:fixed;

  left:12px;
  right:12px;
  bottom:12px;

  z-index:999;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:14px;

  padding:12px 14px;

  border-radius:22px;

  background:rgba(255,255,255,.82);

  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);

  box-shadow:
    0 10px 30px rgba(15,23,42,.10),
    0 2px 10px rgba(15,23,42,.05);

  transform:translateY(120%);

  transition:
    transform .35s ease,
    opacity .35s ease;

  opacity:0;
}

/* SHOW */
.pdp-sticky-cta.show{
  transform:translateY(0);
  opacity:1;
}


/* =========================================================
   LEFT SIDE
========================================================= */

.sticky-left{

  display:flex;
  flex-direction:column;

  flex:1;

  min-width:0;
}


/* =========================================================
   PRICE WRAP
========================================================= */

.sticky-price-wrap{

  display:flex;
  flex-direction:column;

  line-height:1.05;
}


/* =========================================================
   CURRENT PRICE
========================================================= */

.price-current{

  font-size:18px;

  font-weight:900;

  letter-spacing:-0.03em;

  color:#ff4d0a;

  white-space:nowrap;
}


/* =========================================================
   OLD PRICE
========================================================= */

.price-old{

  margin-top:3px;

  font-size:13px;

  color:#94a3b8;

  text-decoration:line-through;
}


/* =========================================================
   BUTTON
========================================================= */

.sticky-btn{

  display:inline-flex;

  align-items:center;
  justify-content:center;

  flex-shrink:1;

  min-width:0;

  height:52px;

  padding:0 18px;

  border:none;

  border-radius:16px;

  background:var(--pdp-green);

  color:#fff;

  font-size:15px;
  font-weight:800;

  letter-spacing:-0.01em;

  white-space:nowrap;

  overflow:hidden;
  text-overflow:ellipsis;

  box-shadow:
    0 6px 18px rgba(22,163,74,.22);
}


/* =========================================================
   SMALL SCREENS
========================================================= */

@media (max-width:390px){

  .sticky-btn{

    font-size:13px;

    padding:0 16px;
  }

  .price-current{
    font-size:16px;
  }

}

/* =========================================================
   🚀 PREMIUM MODEL SELECTOR
========================================================= */

/* Cache le dropdown WooCommerce natif */
.variations select{
  display:none !important;
}

/* CONTENEUR GLOBAL */
.mhgn-model-selector{
  margin:18px 0 0;
  padding:0 16px;
  box-sizing:border-box;
  border-bottom:1px solid #e5e7eb;
  padding-bottom:24px;
}

/* Si couleur existe juste après modèle,
   on retire la ligne du modèle pour éviter double ligne */
.mhgn-model-selector:has(+ .mhgn-color-selector){
  border-bottom:none;
  padding-bottom:0;
}

/* HEADER */
.mhgn-model-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
}

.mhgn-model-title{
  font-size:13px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:#111;
}

.mhgn-model-current{
  font-size:14px;
  font-weight:600;
  color:#16a34a;
}

/* GRID */
.mhgn-model-options{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

/* BOUTONS */
.mhgn-model-option{
  appearance:none;
  border:1.5px solid #dcdcdc;
  background:#fff;
  color:#111827;

  padding:6px 12px;      /* 🔥 encore plus compact */
  min-height:34px;       /* 🔥 hauteur réduite */

  border-radius:8px;

  font-size:13px;        /* 🔥 plus discret */
  font-weight:600;
  line-height:1.1;

  cursor:pointer;
  transition:all .2s ease;

  user-select:none;

  white-space:nowrap;
}

/* Hover */
.mhgn-model-option:hover:not(.is-disabled){
  border-color:#16a34a;
}

/* ACTIF */
.mhgn-model-option.is-selected{
  border:2px solid #16a34a;
  background:#f0fdf4;
  color:#16a34a;
}

/* INDISPONIBLE */
.mhgn-model-option.is-disabled{
  color:#bdbdbd;
  text-decoration:line-through;
  background:#fafafa;
  cursor:not-allowed;
  opacity:.75;
}

/* COULEURS CSS */


/* OPTIONS */
.mhgn-color-options{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* PASTILLE */
.mhgn-color-option{
  width:34px;
  height:34px;

  padding:0;
  min-height:auto;

  border-radius:999px;

  border:2px solid #e5e7eb;

  cursor:pointer;

  transition:all .2s ease;

  appearance:none;

  position:relative;
}

/* Hover */
.mhgn-color-option:hover:not(.is-disabled){
  transform:scale(1.06);
}

/* Sélection */
.mhgn-color-option.is-selected{
  border-color:#16a34a;
  box-shadow:0 0 0 3px rgba(22,163,74,.18);
}

/* Blanc visible */
.mhgn-color-option[aria-label*="Blanc"],
.mhgn-color-option[aria-label*="blanc"],
.mhgn-color-option[aria-label*="White"],
.mhgn-color-option[aria-label*="white"]{
  border-color:#d1d5db;
}

/* Indisponible */
.mhgn-color-option.is-disabled{
  opacity:.45;
  cursor:not-allowed;
  position:relative;
}

.mhgn-color-option.is-disabled::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:140%;
  height:2px;
  background:#9ca3af;
  transform:translate(-50%, -50%) rotate(-45deg);
}

.mhgn-color-selector{
  margin:18px 0 0;
  padding:0 16px;
  box-sizing:border-box;
  border-bottom:1px solid #e5e7eb;
  padding-bottom:24px;
}

.mhgn-color-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  margin-bottom:14px;
}

.mhgn-color-title{
  font-size:13px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:#111;
}

.mhgn-color-current{
  font-size:14px;
  font-weight:600;
  color:#16a34a;
  text-align:right;
}

/* =========================================================
   MHGN — SECTION AVIS CLIENTS
========================================================= */



.mhgn-reviews{
  margin: 42px 0 38px;
  padding: 0 2px;
}


/* =========================
   HEADER PREMIUM
========================= */

.mhgn-reviews__head{

  background:#fbfcfa;

  border:1px solid rgba(15,23,42,.05);

  border-radius:28px;

  padding:34px 24px;

  margin-bottom:22px;

  box-shadow:
    0 1px 2px rgba(15,23,42,.02),
    0 10px 30px rgba(15,23,42,.04);
}

/* =========================
   CENTER BLOCK
========================= */

.mhgn-rating-main{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  text-align:center;
}

/* =========================
   NOTE
========================= */

.mhgn-rating-score{
  font-size:64px;
  font-weight:800;
  line-height:.95;

  color:#0f172a;

  letter-spacing:-0.04em;

  margin-bottom:10px;
}

.mhgn-rating-score span{
  font-size:34px;

  opacity:.45;

  font-weight:700;
}

/* =========================
   STARS
========================= */

.mhgn-stars{
  color:#f59e0b;

  font-size:24px;

  letter-spacing:4px;

  line-height:1;

  margin-bottom:16px;
}

/* =========================
   SUBTEXT
========================= */

.mhgn-rating-subtext{
  font-size:17px;

  color:#64748b;

  line-height:1.45;

  margin-bottom:18px;
}

/* =========================
   BADGE
========================= */

.mhgn-reviews__badge{

  display:inline-flex;

  align-items:center;
  justify-content:center;

  padding:10px 18px;

  border-radius:999px;

  background:#eefaf0;

  border:1px solid #d9f1dd;

  color:#16a34a;

  font-size:14px;

  font-weight:700;

  box-shadow:
    0 2px 8px rgba(22,163,74,.05);
}

/* =========================
   LISTE AVIS
========================= */

.mhgn-reviews__list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

/* =========================
   CARTE AVIS
========================= */

.mhgn-review-card{
  background:#ffffff;

  border:1px solid rgba(15,23,42,.08);

  border-radius:20px;

  padding:16px;

  box-shadow:
    0 1px 2px rgba(15,23,42,.03),
    0 8px 24px rgba(15,23,42,.04);

  transition:
    transform .18s ease,
    box-shadow .18s ease;
}

.mhgn-review-card:active{
  transform:scale(.992);
}

/* =========================
   TOP CARD
========================= */

.mhgn-review-card__top{
  display:flex;
  align-items:center;
  gap:12px;

  margin-bottom:10px;
}

.mhgn-review-avatar{
  width:42px;
  height:42px;

  border-radius:50%;

  background:#dcfce7;
  color:#16a34a;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:16px;
  font-weight:700;

  flex-shrink:0;
}

.mhgn-review-meta{
  display:flex;
  flex-direction:column;
  gap:2px;

  min-width:0;
}

.mhgn-review-meta strong{
  font-size:14px;
  color:#111827;
  line-height:1.2;
}

.mhgn-review-meta span{
  font-size:12px;
  color:#6b7280;
}

.mhgn-review-verified{

  margin-left:auto;

  display:flex;
  align-items:center;
  gap:5px;

  padding:7px 11px;

  border-radius:999px;

  background:rgba(34,197,94,.08);

  border:1px solid rgba(34,197,94,.10);

  color:#16a34a;

  font-size:11px;

  font-weight:600;

  letter-spacing:-0.01em;

  white-space:nowrap;

  backdrop-filter:blur(6px);
}
.mhgn-review-verified{

  padding:5px 11px;

  font-size:12px;

  font-weight:600;

  border:1px solid #d7f5df;

  background:#f5fff7;

  color:#16a34a;
}

/* =========================
   ÉTOILES
========================= */

.mhgn-review-stars{
  color:#f59e0b;

  font-size:14px;
  letter-spacing:1px;

  margin-bottom:8px;
}

/* =========================
   TEXTE
========================= */

.mhgn-review-text{
  margin:0;

  color:#334155;

  font-size:13.5px;
  line-height:1.55;

  letter-spacing:.01em;
}

/* =========================
   BOUTON
========================= */

.mhgn-reviews__more{
  margin-top:18px;

  width:100%;
  height:48px;

  border:1.5px solid #d1d5db;

  border-radius:14px;

  background:#fff;
  color:#111827;

  font-size:14px;
  font-weight:700;

  box-shadow:none;
}

.mhgn-reviews__more:active{
  transform:scale(.985);
  opacity:.92;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width:360px){

  .mhgn-reviews__head{
    flex-direction:column;
    align-items:flex-start;
  }

  .mhgn-review-card{
    padding:16px 14px;
  }

}

.mhgn-reviews-title{
  font-size:32px;
  line-height:1.1;
  font-weight:800;
  color:#111827;
  margin:0 0 8px;
}

.mhgn-reviews-subtitle{
  margin:0 0 26px;
  color:#6b7280;
  font-size:15px;
  line-height:1.5;
}

.mhgn-reviews-section{
  margin-top: 46px;
}

/* =========================
   HEADING PREMIUM
========================= */

.mhgn-reviews-heading{

  margin-bottom:18px;
}

.mhgn-reviews-heading__content{
  display:flex;
  flex-direction:column;
}

/* =========================
   HEADER SECTION AVIS
========================= */

.mhgn-reviews-title{
  margin:0 0 4px;

  font-size:28px;

  line-height:1.05;

  font-weight:800;

  letter-spacing:-0.03em;

  color:#0f172a;
}

.mhgn-reviews-subtitle{

  margin:0;

  font-size:14px;

  line-height:1.4;

  color:#94a3b8;

  letter-spacing:-0.01em;
}

/* =========================
   HORODATAGE
========================= */

.mhgn-review-location{

  display:flex;
  align-items:center;
  gap:6px;

  margin-top:2px;

  font-size:13px;

  line-height:1.4;

  letter-spacing:-0.01em;
}

.mhgn-review-location span{
  color:#6b7280;
}

.mhgn-review-location small{

  color:#94a3b8;

  font-size:12px;

  font-weight:500;
}

.mhgn-review-location small::before{

  content:"·";

  margin-right:6px;

  color:#cbd5e1;
}
  letter-spacing:-0.01em;
}

.mhgn-review-location span{
  color:#6b7280;
}

.mhgn-review-location small{

  color:#94a3b8;

  font-size:12px;

  font-weight:500;
}

.mhgn-review-location small::before{
  content:"·";

  margin-right:6px;

  color:#cbd5e1;
}

.mhgn-section-divider{

  width:100%;

  height:1px;

  margin:34px 0 30px;

  background:
    linear-gradient(
      to right,
      transparent,
      rgba(15,23,42,.08),
      transparent
    );
}

