:root{ --brand:#6D28D9; --line:#e5e7eb; --muted:#4b5563; }

/* ==== HERO Flex Start (tes styles existants) ==== */
.flexstart-hero{
  background:#fff;border:1px solid var(--line);border-radius:24px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);margin:24px 0;padding:28px
}
.fs-wrap{max-width:1120px;margin:auto;display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
.fs-pill{display:inline-flex;gap:8px;align-items:center;background:#f5f3ff;border:1px solid #e9d5ff;color:var(--brand);padding:6px 12px;border-radius:999px;font-weight:700}
.fs-title{font-size:clamp(28px,4vw,48px);line-height:1.15;margin:10px 0 8px;font-weight:900}
.fs-sub{color:var(--muted);max-width:680px}
.fs-price .big{font-size:clamp(22px,3vw,28px);font-weight:800}
.fs-badges{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 16px}
.fs-badges .badge{background:#f9fafb;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-weight:600;color:#111}
.fs-cta{display:flex;gap:12px;flex-wrap:wrap}

/* Bouton Woo (base) */
.single_add_to_cart_button, .button.alt{
  background:#6D28D9!important;border-radius:12px!important;padding:14px 18px!important;
  font-weight:800!important;color:#fff!important;border:none!important
}

/* Galerie encadrée */
.fs-right .woocommerce-product-gallery{
  border:1px solid var(--line);border-radius:16px;padding:8px;
  box-shadow:0 10px 30px rgba(0,0,0,.06)
}

/* Détails */
.fs-details{margin:32px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:#fff}
.fs-details h2{margin:0 0 10px}
.fs-list{margin:0;padding-left:18px}

@media (max-width:980px){
  .fs-wrap{grid-template-columns:1fr}
  .fs-right{order:-1}
}

/* =========================
   AJOUT : variables utiles
   ========================= */
:root{
  --brand2:#F43F5E;            /* seconde couleur pour dégradé CTA */
  --shadow:0 12px 30px rgba(17,24,39,.08);
}

/* ==========================================================
   CTA (liens boutons) pour Single / Pro + harmonisation Woo
   ========================================================== */
.theme-cta{
  display:inline-flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  color:#fff!important;border:none;border-radius:12px;
  padding:14px 18px;font-weight:800;cursor:pointer;
  box-shadow:0 12px 28px rgba(244,63,94,.18);
  text-decoration:none;transition:transform .15s ease, filter .15s ease, box-shadow .2s ease;
}
.theme-cta:hover{transform:translateY(-2px);filter:brightness(1.03)}

.btn-ghost{
  background:#fff;border:2px solid var(--line);color:#111!important;
  border-radius:12px;padding:14px 18px;font-weight:800;text-decoration:none
}

/* Harmonisation bouton Woo + légère ombre */
.single_add_to_cart_button, .button.alt{
  background:#6D28D9!important;border-radius:12px!important;padding:14px 18px!important;
  font-weight:800!important;color:#fff!important;border:none!important;
  box-shadow:0 10px 24px rgba(109,40,217,.18);
}

/* =================================================
   Tableau comparatif (base)
   ================================================= */
.compare-desktop{
  background:#fff;border:1px solid var(--line);border-radius:16px;
  box-shadow:var(--shadow);overflow:hidden
}
.compare-desktop table{width:100%;border-collapse:collapse}
.compare-desktop thead th{background:#f1f5f9}
.compare-desktop th, .compare-desktop td{
  padding:14px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top
}
.compare-desktop .ok{font-weight:800}
.compare-desktop .muted{color:var(--muted)}

.compare-mobile{display:none}
.plan-tabs{display:flex;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:var(--shadow)}
.plan-tab{flex:1;border:none;border-radius:8px;padding:10px 12px;background:transparent;font-weight:800;cursor:pointer}
.plan-tab[aria-selected="true"]{background:#f3f4f6}
.plan-panel{display:none;margin-top:12px}
.plan-panel.active{display:block}
.featlist{display:grid;gap:10px}
.featrow{display:flex;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.featrow .l{font-weight:600}
.featrow .r{color:var(--muted);font-weight:700}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}

/* Boutons mobile compacts */
@media (max-width:860px){
  .compare-desktop{display:none}
  .compare-mobile{display:block}
  .cta-row .single_add_to_cart_button,
  .cta-row .theme-cta{
    padding:10px 14px;
    font-size:14px;
    line-height:1.2;
    border-radius:10px;
    box-shadow:0 8px 18px rgba(17,24,39,.08);
  }
}

/* =========================
   Bloc final CTA (gradient)
   ========================= */
.igf-cta-gradient{
  margin:40px 0 10px;background:linear-gradient(90deg,var(--brand) 0%, #A855F7 35%, var(--brand2) 100%);
  border-radius:28px;padding:28px;border:1px solid rgba(17,24,39,.06);box-shadow:var(--shadow);color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:18px
}
.igf-cta-gradient .left{max-width:760px}
.igf-cta-gradient .pre{
  display:inline-flex;align-items:center;gap:8px;
  border:1.5px solid rgba(255,255,255,.5);border-radius:999px;padding:8px 14px;
  background:rgba(255,255,255,.15);font-weight:800
}
.igf-cta-gradient h3{font-size:clamp(22px,3.4vw,40px);margin:12px 0 8px}
.igf-cta-gradient p{margin:0;opacity:.95}

/* >>> Bouton “Ajouter au panier” DANS le bloc final : texte noir ultra lisible */
.igf-cta-gradient .single_add_to_cart_button{
  background:#fff!important;color:#111!important;
  border:2px solid rgba(255,255,255,.9)!important;border-radius:14px;
  padding:14px 18px;font-weight:900;font-size:16px;
  box-shadow:0 10px 22px rgba(0,0,0,.15);text-shadow:none;
  transition:transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.igf-cta-gradient .single_add_to_cart_button:hover{
  transform:translateY(-2px);filter:brightness(1.02);box-shadow:0 14px 28px rgba(0,0,0,.18)
}
.igf-cta-gradient .single_add_to_cart_button:focus{
  outline:3px solid rgba(255,255,255,.9);outline-offset:2px
}

/* Pleine largeur en mobile pour le bouton final */
@media (max-width:520px){
  .igf-cta-gradient{flex-direction:column;align-items:flex-start}
  .igf-cta-gradient .single_add_to_cart_button{width:100%;justify-content:center}
}

/* =========================
   FAQ avec chevrons
   ========================= */
.igf-faq{display:grid;gap:12px}
.igf-faq details{
  background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);
  transition:box-shadow .2s ease, transform .15s ease
}
.igf-faq details:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(17,24,39,.10)}
.igf-faq summary{
  list-style:none;cursor:pointer;font-weight:800;padding:16px 20px 16px 16px;
  display:flex;align-items:center;gap:12px;position:relative
}
.igf-faq summary::-webkit-details-marker{display:none}
.igf-faq summary .chev{
  width:18px;height:18px;flex:0 0 18px;opacity:.9;transition:transform .2s ease
}
.igf-faq details[open] summary .chev{transform:rotate(90deg)}
.igf-faq .content{padding:0 20px 16px 46px;color:var(--muted);line-height:1.55}
.igf-faq summary:focus{outline:2px solid rgba(109,40,217,.5);outline-offset:3px;border-radius:10px}

/* ========== Compatibilité thème : tableau comparatif (rendu identique, pas de verticales) ========== */
.igf-compare { 
  --tbl-bg:#fff; 
  --tbl-head:#f1f5f9; 
  --tbl-border:var(--line); 
  --tbl-text:#111827; 
  --tbl-muted:var(--muted);
}

/* Neutralise styles de table du thème */
.igf-compare table{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:var(--tbl-bg) !important;
  color:var(--tbl-text) !important;
  table-layout:auto !important;
}
.igf-compare colgroup, .igf-compare col{border:none !important}

/* En-têtes : horizontales uniquement */
.igf-compare thead th{
  background:var(--tbl-head) !important;
  color:var(--tbl-text) !important;
  font-weight:800 !important;
  padding:14px 16px !important;
  text-align:left !important;
  vertical-align:middle !important;
  white-space:normal !important;
  border-top:none !important;
  border-right:none !important;     /* pas de lignes verticales */
  border-left:none !important;      /* pas de lignes verticales */
  border-bottom:1px solid var(--tbl-border) !important; /* horizontales */
}

/* Cellules : horizontales uniquement */
.igf-compare tbody td,
.igf-compare tbody th{
  background:#fff !important;
  color:var(--tbl-text) !important;
  padding:14px 16px !important;
  text-align:left !important;
  vertical-align:top !important;
  border-top:none !important;
  border-right:none !important;     /* pas de verticales */
  border-left:none !important;      /* pas de verticales */
  border-bottom:1px solid var(--tbl-border) !important;
}

/* Dernière ligne : pas de bordure basse */
.igf-compare tbody tr:last-child > *{
  border-bottom:none !important;
}

/* Bord arrondi + ombre du conteneur (desktop) */
.compare-desktop.igf-compare{
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:0 12px 30px rgba(17,24,39,.08) !important;
}

/* Renforce ✔︎ et muted */
.igf-compare .ok{ font-weight:800 !important; }
.igf-compare .muted{ color:var(--tbl-muted) !important; }

/* Boutons dans la table */
.igf-compare .single_add_to_cart_button,
.igf-compare .theme-cta{
  border-radius:12px !important;
  padding:14px 18px !important;
  font-weight:800 !important;
  box-shadow:0 10px 24px rgba(17,24,39,.12) !important;
}

/* Mobile : CTA compacts (renforcé) */
@media (max-width:860px){
  .compare-mobile .cta-row .single_add_to_cart_button,
  .compare-mobile .cta-row .theme-cta{
    padding:10px 14px !important;
    font-size:14px !important;
    line-height:1.2 !important;
    border-radius:10px !important;
    box-shadow:0 8px 18px rgba(17,24,39,.08) !important;
  }
}

/* ===== 1) Onglets mobile du comparatif : état sélectionné lisible ===== */
.plan-tabs{ background:#fff !important; }
.plan-tab{
  background:transparent !important;
  color:#6b7280 !important;           /* gris par défaut */
  font-weight:800 !important;
}
.plan-tab[aria-selected="true"]{
  background:rgba(109,40,217,.10) !important;   /* léger violet */
  color:var(--brand) !important;                 /* texte violet lisible */
  box-shadow:inset 0 0 0 2px rgba(109,40,217,.25) !important;
}
.plan-tab:focus-visible{
  outline:2px solid rgba(109,40,217,.5) !important;
  outline-offset:2px !important;
  border-radius:8px !important;
}

/* ===== 2) Bloc "Prêt à démarrer ?" : texte du bouton bien NOIR ===== */
.igf-cta-gradient form .single_add_to_cart_button.button.alt.wp-element-button{
  background:#fff !important;
  color:#111 !important;                 /* << texte noir */
  font-size:16px !important;
  line-height:1.2 !important;
  min-width:220px;                        /* lisible */
  padding:14px 18px !important;
  border-radius:14px !important;
  border:2px solid rgba(255,255,255,.9) !important;
  box-shadow:0 10px 22px rgba(0,0,0,.15) !important;
  text-shadow:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.igf-cta-gradient form .single_add_to_cart_button.button.alt.wp-element-button:hover{
  transform:translateY(-2px);
  filter:brightness(1.02);
  box-shadow:0 14px 28px rgba(0,0,0,.18) !important;
}
/* Si le thème ajoute des pseudos (icône/overlay), on les coupe */
.igf-cta-gradient .single_add_to_cart_button:before,
.igf-cta-gradient .single_add_to_cart_button:after{ display:none !important; }

/* Bannière sticky : tout sur une ligne, propre */
.sticky .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sticky form.cart{display:flex;align-items:center;gap:10px;margin:0}
/* Cache le champ quantité dans la sticky */
.sticky .quantity{display:none !important}
/* Bouton bien aligné */
.sticky .single_add_to_cart_button{margin:0}

/* Variante : si un thème insère un prix à côté du titre, on le masque ici */
.sticky .txt .price,
.sticky .txt .amount{display:none !important}


/* --- Uniformisation bouton sticky avec les CTA principaux --- */

/* Bouton du sticky = même gradient, même ombre */
.sticky .single_add_to_cart_button.button.alt,
.sticky .single_add_to_cart_button {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  font-weight: 800 !important;
  box-shadow: 0 12px 28px rgba(244, 63, 94, .18) !important;
  text-transform: none !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
  transition: transform .15s ease, filter .15s ease, box-shadow .2s ease;
}

.sticky .single_add_to_cart_button:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 14px 32px rgba(244, 63, 94, .25) !important;
}

/* Aligne le tout proprement sur une ligne */
.sticky {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sticky .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0;
}
.sticky form.cart {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.sticky .quantity { display: none !important; } /* cache quantité */


/* =========================
   UNIFICATION DES BOUTONS WOOCOMMERCE
   - Héro, tableau comparatif, sticky
   - EXCEPTION : bouton dans .igf-cta-gradient (reste blanc/texte noir)
   ========================= */

/* Style de base pour TOUT add-to-cart (hors bloc final) */
.single_add_to_cart_button.button,
.single_add_to_cart_button.button.alt,
form.cart .single_add_to_cart_button {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  box-shadow: 0 12px 28px rgba(244,63,94,.18) !important;
  text-decoration: none !important;
  text-transform: none !important;
  transition: transform .15s ease, filter .15s ease, box-shadow .2s ease;
}
.single_add_to_cart_button.button:hover,
.single_add_to_cart_button.button.alt:hover,
form.cart .single_add_to_cart_button:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 14px 32px rgba(244,63,94,.25) !important;
}

/* HÉRO : aligner proprement si Woo insère la quantité */
.hero form.cart { display:flex; align-items:center; gap:12px; }

/* TABLEAU : même bouton + pas de champ quantité dans les cellules */
.igf-compare form.cart { display:inline-flex; align-items:center; gap:10px; margin:0; }
.igf-compare .quantity,
.compare-mobile .quantity { display:none !important; }

/* STICKY : même look + quantités masquées uniquement dans la bannière */
.sticky .single_add_to_cart_button.button.alt,
.sticky .single_add_to_cart_button {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color:#fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  font-weight: 800 !important;
  box-shadow: 0 12px 28px rgba(244,63,94,.18) !important;
}
.sticky form.cart { display:flex; align-items:center; gap:10px; margin:0; }
.sticky .quantity { display:none !important; }

/* EXCEPTION : garder le bouton du bloc final blanc + texte noir */
.igf-cta-gradient .single_add_to_cart_button {
  background:#fff !important;
  color:#111 !important;
  border:2px solid rgba(255,255,255,.9) !important;
  border-radius:14px !important;
  padding:14px 18px !important;
  font-weight:900 !important;
  font-size:16px !important;
  box-shadow:0 10px 22px rgba(0,0,0,.15) !important;
  text-shadow:none !important;
}
.igf-cta-gradient .single_add_to_cart_button:hover{
  transform:translateY(-2px);
  filter:brightness(1.02);
  box-shadow:0 14px 28px rgba(0,0,0,.18) !important;
}
