/*
Theme Name: Bridge Child
Theme URI: https://bridgelanding.qodeinteractive.com/
Template: bridge
Author: Qode Interactive
Author URI: https://qodeinteractive.com/
Description: Creative Multipurpose WordPress Theme
Tags: one-column,two-columns,three-columns,four-columns,left-sidebar,right-sidebar,custom-menu,featured-images,flexible-header,post-formats,sticky-post,threaded-comments,translation-ready
Version: 30.8.8.4.1771330524
Updated: 2026-02-17 13:15:24

*/







/* Titres */
h1, h2, h3, h4, h5, h6 {
  font-family: "gopher", sans-serif;
  font-weight: 700;
  font-style: normal;
}

/* Police principale du site */
body {
  font-family: tt-commons-pro, sans-serif;
  font-weight: 500;
  font-style: normal;
  line-height: 1.6;
  color: #014639; /* facultatif */
}

p,
body.qode-overridden-elementors-fonts .elementor-widget-heading p.elementor-heading-title {
 font-family: tt-commons-pro, sans-serif;
  font-size: 18px;
  line-height: 27px;
  font-weight: 500;
  color: #014639;
}


/* Version mobile */
@media (max-width: 767px) {
  p,
body.qode-overridden-elementors-fonts .elementor-widget-heading p.elementor-heading-title {
 font-family: tt-commons-pro, sans-serif;
 line-height: 20px;
}
}


/* === LOGO SUR DESKTOP === */
.q_logo {
  margin-top: -40px !important; /* supprime ou réduit la marge au-dessus du logo */
  padding-top: 0 !important;
}

.q_logo img.normal,
.q_logo img.dark,
.q_logo img.light,
.q_logo img.sticky {
  width: 500px !important;
  height: auto !important;
}

/* Ajuste aussi la hauteur du conteneur du lien */
.q_logo a {
  height: auto !important;
  display: inline-block;
}

/* === LOGO SUR MOBILE === */
@media (max-width: 768px) {
  .q_logo {
    margin-top: 5px !important; /* petite marge sur mobile si tu veux */
  }

  .q_logo img.normal,
  .q_logo img.dark,
  .q_logo img.light,
  .q_logo img.sticky,
  .q_logo img.mobile {
    width: 300px !important;
    height: auto !important;
  }

  /* Centrer le logo sur mobile */
  .q_logo {
    text-align: center;
  }

  .q_logo a {
    display: inline-block;
  }
}


/* === STYLE GLOBAL DES BOUTONS === */
.wp-element-button,
.wp-block-button__link,
button,
input[type="submit"],
input[type="button"],
a.button,
a.wp-block-button__link {
  background-color: #F9B1FF !important; /* fond rose */
  color: #64012E !important; /* texte bordeaux */
  border: 2px solid #64012E !important; /* contour fin */
  border-radius: 55px !important; /* arrondi */
  font-family: "tt-commons-pro", sans-serif !important;
  font-weight: 700 !important; /* bold */
  font-size: 18px !important;
  line-height: 1.2em !important;
  text-align: center !important;
  padding: 8px 22px !important; /* espace autour du texte réduit */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  transition: all 0.3s ease;
  cursor: pointer;
}

/* === HOVER === */
.wp-element-button:hover,
.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover,
a.button:hover,
a.wp-block-button__link:hover {
  background-color: #64012E !important;
  color: #F9B1FF !important;
  border-color: #64012E !important;
}

body > div.wrapper > div > div > div > div > div > div > div.elementor-element.elementor-element-747339a.e-con-full.e-flex.parallax_section_no.qode_elementor_container_no.e-con.e-parent.e-lazyloaded {
    --padding-top: 0 !important;
    --padding-right: 0 !important;
    --padding-bottom: 0 !important;
    --padding-left: 0 !important;
    padding: 0 !important;
}

.classeh2 {
  font-family: 'Gopher', sans-serif;
  font-size: 25px;
  line-height: 1.2;
  color: #64012E;
  margin: 0;
}

/* H1 en Gopher — desktop + mobile */
.classeh1 {
  font-family: 'Gopher', sans-serif;
  font-size: 50px;         /* desktop */
  line-height: 1.1;
  color: #014639;
  margin: 0;
}







/* Mobile */
@media (max-width: 767px) {
  .classeh1 {
    font-size: 35px;        /* mobile */
  }
}



/* Version générique : sections/containers à zéro */
.elementor-section,
.elementor-container,
.e-con {
  --padding-block-start: 0 !important;
  --padding-block-end: 0 !important;
  --padding-inline-start: 0 !important;
  --padding-inline-end: 0 !important;
  padding: 0 !important;
}

/* Sur ton container spécifique */
.elementor-element-747339a {
  --padding-block-start: 0 !important;
  --padding-block-end: 0 !important;
  --padding-inline-start: 0 !important;
  --padding-inline-end: 0 !important;
  --widgets-spacing: 0px !important;
  padding: 0 !important;
}










/* =========================================
   RECETTES CAROUSEL – Tags + Titre + Overlay Recette
   (Elementor Image Carousel / Swiper)
   ========================================= */

.recettes-carousel .swiper-slide{
  position: relative;
}

.recettes-carousel figure{
  position: relative;
  margin: 0;
}

.recettes-carousel img{
  display: block;
  width: 100%;
  height: auto;
}

/* === Légende Elementor invisible mais lisible par JS === */
.recettes-carousel .elementor-image-carousel-caption,
.recettes-carousel figure figcaption{
  position: absolute !important;
  top: 0;
  left: 0;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  z-index: 1;
}

/* === Conteneur des badges (centré sur l’image) === */
.recettes-carousel .slide-badges{
  position: absolute;
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  z-index: 3;
}

/* === Style des badges === */
.recette-tag{
  font-family: 'TT Commons Pro', sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  padding: 6px 14px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* === Couleurs par tag === */
.recette-tag.famille{      background:#FFD400; color:#014639; }
.recette-tag.classique{    background:#80B6FC; color:#014639; }
.recette-tag.vegetarien{   background:#F9B1FF; color:#014639; }
.recette-tag.monde{        background:#64012E; color:#F9B1FF; }
.recette-tag.soupe{       background:#33BEA2; color:#014639; }
.recette-tag.tarte-salee{  background:#ED6C2D; color:#64012E; }
.recette-tag.poisson{     background:#014639; color:#33BEA2; }

/* Tag long : TARTE SALÉE -> un peu plus compact */
.woocommerce-account .recette-tag.tarte-salee{
  font-size: 13px !important;
  padding: 6px 10px !important;
  letter-spacing: 0.01em !important;
}


/* === Titre sous l’image === */
.recettes-carousel .slide-title{
  margin-top: 10px;
  text-align: center;
  font-family: 'TT Commons Pro', sans-serif;
  font-weight: 500;
  font-size: 18px;
  color: #64012E;
}

/* === Overlay recette (sur la photo) === */
.recettes-carousel .slide-overlay{
  position: absolute;
  inset: 0;
background: rgba(200,228,218,0.96); /* #C8E4DA */

  color: #014639;
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 10px;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
  z-index: 4;
}

/* Hover desktop */
@media (hover:hover){
  .recettes-carousel .swiper-slide:hover .slide-overlay{
    opacity: 1;
    transform: translateY(0);
  }
}

.recettes-carousel .slide-overlay .overlay-title{
  font-family: 'TT Commons Pro', sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.15;
}

.recettes-carousel .slide-overlay .overlay-recipe{
  font-family: 'TT Commons Pro', sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 1.25;
  opacity: .95;
}

/* Mobile : ouverture au tap (classe is-open posée en JS) */
@media (hover:none){
  .recettes-carousel .swiper-slide.is-open .slide-overlay{
    opacity: 1;
    transform: translateY(0);
  }
}



/* Cache toute légende rendue par le widget, où qu'elle apparaisse */
.recettes-carousel .elementor-image-carousel-caption,
.recettes-carousel .swiper-slide > .elementor-image-carousel-caption,
.recettes-carousel .swiper-slide figcaption,
.recettes-carousel .swiper-slide .swiper-slide-caption,
.recettes-carousel .elementor-image-carousel .swiper-slide .elementor-image-carousel-caption {
  display: none !important;
}

/* Cache toute variante de légende rendue par le widget/carrousel */
.recettes-carousel .elementor-image-carousel-caption,
.recettes-carousel .swiper-slide .elementor-image-carousel-caption,
.recettes-carousel .swiper-slide figcaption,
.recettes-carousel .swiper-slide .swiper-slide-caption,
.recettes-carousel .swiper-slide [class*="caption"] {
  display: none !important;
}

.recettes-carousel .slide-title::first-letter {
  text-transform: uppercase;
}


/* + / - : style minimal sans fond */
.bcc-btn {
  background: transparent !important;   /* pas de fond */
  color: #014639 !important;
  border: 2px solid #014639 !important;
}





/* Style pour les titres "H3" personnalisés */
.classeh3 {
  font-family: 'Gopher', sans-serif;
  font-size: 25px;         /* desktop */
  line-height: 1.1;
  color: #014639;
  margin: 0;
}



/* Retire le padding imposé par Qode à l'intérieur de CET accordéon */
.faq-full .qode-accordion-content {
  padding: 0 !important;
}

/* Optionnel : neutralise aussi tout padding interne Qode */
.faq-full .qode-accordion-content-inner {
  padding: 0 !important;
}

/* Si ton modèle doit aller bord à bord, dé-commente la section suivante : */
/*
.faq-full .qode-accordion-content .elementor .e-con.e-parent {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
*/







/* ====== TITRES (H3) ====== */
/* padding, look H3, suppression des bordures/ombres */
.faq-accordeon h3.qode-title-holder {
  position: relative;
  padding: 26px 72px 26px 28px !important; /* espace à droite pour l’icône */
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 1.15;
  cursor: pointer;
}

/* Alternance de fond par rang (odd = 1er, 3e, …) */
.faq-accordeon h3.qode-title-holder:nth-of-type(odd)  { background:#33BEA2 !important; }
.faq-accordeon h3.qode-title-holder:nth-of-type(even) { background:#C8EDDE !important; }

/* Texte du titre : on force le style sur l'inner span */
.faq-accordeon h3.qode-title-holder .qode-tab-title .qode-tab-title-inner {
  display: block !important;               /* override display:table-cell */
  padding: 0 !important;
  font-family: "TT Commons Pro", sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 3.2vw, 44px);     /* plus petit que H2, responsive */
  color: #014639;
  text-align: left;
}

/* ====== ICÔNE À DROITE ====== */
/* masque les + / − natifs */
.faq-accordeon h3.qode-title-holder .qode-accordion-mark .icon_plus,
.faq-accordeon h3.qode-title-holder .qode-accordion-mark .icon_minus-06 {
  display: none !important;
}
/* remplace par une flèche → en unicode */
.faq-accordeon h3.qode-title-holder .qode-accordion-mark {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.faq-accordeon h3.qode-title-holder .qode-accordion-mark-icon::before {
  content: "\2192";                        /* flèche → */
  display: block;
  font-size: 42px;
  color: #014639;
  line-height: 1;
  transition: transform .2s ease;
}
/* rotation quand ouvert (Qode met .ui-accordion-header-active) */
.faq-accordeon h3.qode-title-holder.ui-accordion-header-active
  .qode-accordion-mark-icon::before {
  transform: rotate(90deg);
}

/* ====== CONTENU (section qui s'ouvre) ====== */
/* retire le padding imposé par Qode pour que ton modèle prenne toute la largeur */
.faq-accordeon .qode-accordion-content,
.faq-accordeon .qode-accordion-content-inner {
  padding: 0 !important;
}




/* === FAQ Accordéon : version finale corrigée === */
.faq-accordeon h3.qode-title-holder {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 110px;
  padding: 0 40px !important;
  position: relative;
  border: none !important;
  box-shadow: none !important;
}

/* Réinitialisation du style Qode sur la flèche */
.faq-accordeon h3.qode-title-holder .qode-accordion-mark {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  margin-left: 20px !important;
  transform: none !important;
  pointer-events: none;
}

/* Flèche personnalisée */
.faq-accordeon h3.qode-title-holder .qode-accordion-mark-icon::before {
  content: "\2192"; /* flèche → */
  font-size: 60px;
  color: #014639;
  display: block;
  line-height: 1;
  transition: transform 0.25s ease, color 0.25s ease;
}

/* Effet à l'ouverture */
.faq-accordeon h3.qode-title-holder.ui-accordion-header-active 
  .qode-accordion-mark-icon::before {
  transform: rotate(90deg);
  color: #8F2820;
}

/* Texte du titre */
.faq-accordeon h3.qode-title-holder .qode-tab-title .qode-tab-title-inner {
  display: block;
  font-family: "gopher", sans-serif;
  font-weight: 800;
  font-size: clamp(24px, 4vw, 44px);
  color: #014639;
  line-height: 1.2;
  text-align: left;
}

/* Alternance des fonds */
.faq-accordeon h3.qode-title-holder:nth-of-type(odd)  { background:#33BEA2 !important; }
.faq-accordeon h3.qode-title-holder:nth-of-type(even) { background:#C8EDDE !important; }

/* ======= Version mobile ======= */
@media (max-width: 767px) {
  .faq-accordeon h3.qode-title-holder {
    flex-direction: row;
    justify-content: center; /* centre le contenu globalement */
    text-align: left;         /* mais le texte lui reste aligné à gauche */
    padding: 0 20px !important;
    min-height: 100px;
    gap: 20px;
  }

  /* Texte légèrement plus grand sur mobile */
  .faq-accordeon h3.qode-title-holder .qode-tab-title .qode-tab-title-inner {
    font-size: 25px !important;
    text-align: left !important;
  }

  /* Flèche ajustée */
  .faq-accordeon h3.qode-title-holder .qode-accordion-mark-icon::before {
    font-size: 44px;
  }
}


/* === Style pour les titres "H4" personnalisés === */
.classeh4 {
  font-family: 'Gopher', sans-serif;
  font-size: 35px;       /* desktop */
  line-height: 1.1;
  color: #014639;
  margin: 0;
}

/* Mobile */
@media (max-width: 767px) {
  .classeh4 {
    font-size: 27px;        /* mobile */
  }
}


/* Fallback mobile: désactive le "fixed" et force un fond statique visible */
@media (max-width: 1024px) {
  .parallax-fallback,
  .elementor-element-710c44c {
    background-attachment: scroll !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    min-height: 70vh !important;   /* assure une hauteur visible */
  }
}







/* === Top Bar Batch Cooking Club === */

/* === TOP BAR (non fixe) === */
.top-bar-bcc{
  position: relative;            /* pas fixe */
  background:#014639;
  color:#fff;
  font-family:'TT Commons Pro',sans-serif;
  font-weight:700;
  font-size:16px;
  line-height:1.4;
  text-transform:none;
  padding:10px 20px;
  z-index:100;                   /* au-dessus du header */
}
.top-bar-bcc .top-bar-inner{
  max-width:1400px; margin:0 auto;
  display:flex; justify-content:center; align-items:center;
}
.top-bar-bcc .ville{ color:#F9B1FF; }

/* === HEADER BRIDGE : non sticky + hauteur compacte === */
.page_header,
.page_header.fixed,
.page_header.sticky,
.page_header.scrolled_not_transparent{
  position: relative !important; /* annule le sticky/absolute */
  top: auto !important;
  z-index:50 !important;
  background:#fff;               /* évite l’effet transparent + overlay */
  box-shadow:none;
}

/* Supprime toute compensation résiduelle qu’on avait ajoutée */
.page_header,
.elementor-location-header,
header.site-header{ margin-top:0 !important; }


/* Empêche des wrappers de masquer/chevaucher */
.wrapper, .wrapper_inner{ overflow:visible !important; }

/* Mobile : centrage du texte top-bar */
@media (max-width:768px){
  .top-bar-bcc{ font-size:15px; padding:9px 16px; }
  .top-bar-bcc .top-bar-inner{ justify-content:center; }
  .top-bar-bcc .top-bar-text{ text-align:center; }
}


/* Cible toute la page */
body .content.content_top_margin { margin-top: 0 !important; padding-top: 0 !important; }

/* Encore plus fort : uniquement pour cette page (ID 19) */
body.page-id-19 .content.content_top_margin { margin-top: 0 !important; padding-top: 0 !important; }
body.page-id-19 .content_inner { padding-top: 0 !important; }




.footer_top_holder, .footer_bottom_holder { display:none !important; }



.woocommerce-account .woocommerce-MyAccount-navigation li a { font-family: 'Gopher', sans-serif;
    font-size: 25px;
    line-height: 1.2;
    color: #64012E;
    margin: 0;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    padding: 0;
    display: inline-block;
}


.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a, .woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    color: #f9b1ff
;
}






.tag-pill {
    display: inline-block;
    padding: 1px 12px; /* ← réduction du padding vertical */
    border-radius: 999px;
    background: #FFFFFF;
    color: #014639;
    font-size: 19px;
    font-weight: 600;
    letter-spacing: 0em;
    text-transform: uppercase;
    white-space: nowrap;
}

.tags-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 8px; /* vertical | horizontal */
}

 .tags-wrapper {
    justify-content: left;
    text-align: left;
  }


@media (max-width: 768px) {
  .tags-wrapper {
    justify-content: center;
    text-align: center;
  }
}

#back_to_top {
    display: none !important;
}



html, body {
    max-width: 100%;
    overflow-x: hidden;
}




@media (max-width: 768px) {

    /* Hauteur imposée à TOUTES les couches du header */
    header.page_header,
    header.page_header .header_inner,
    header.page_header .header_top_bottom_holder,
    header.page_header .header_bottom {
        height: 70px !important;
        min-height: 70px !important;
        max-height: 70px !important;
        padding: 0 !important;
    }

    /* Colonne gauche + logo */
    header.page_header .header_inner_left,
    header.page_header .logo_wrapper,
    header.page_header .q_logo {
        height: 70px !important;
        min-height: 70px !important;
        display: flex !important;
        align-items: center !important;
    }
}
   
	





/* Afficher et styliser les labels WooCommerce */
.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
    display: block !important;
    margin: 0 0 4px;
    font-family: "TT Commons Pro", sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #014639;
}
/* Style des champs de formulaire WooCommerce (login / register / compte) */
.woocommerce form .form-row .input-text,
.woocommerce-page form .form-row .input-text {
    border: 1px solid #014639;          /* léger contour vert */
    border-radius: 8px;
    padding: 10px 12px;
    background-color: #fff;
    box-shadow: none;
    font-size: 16px;
}

/* Effet au focus */
.woocommerce form .form-row .input-text:focus,
.woocommerce-page form .form-row .input-text:focus {
    border-color: #8F2820;              /* ton bordeaux */
    outline: none;
    box-shadow: 0 0 0 1px rgba(143, 40, 32, 0.15);
}
.woocommerce form .form-row .input-text::placeholder,
.woocommerce-page form .form-row .input-text::placeholder {
    color: rgba(1, 70, 57, 0.45);
    font-weight: 400;
}






/* Bouton "afficher le mot de passe" – reset complet + icône perso */
.woocommerce form button.show-password-input,
.woocommerce-page form button.show-password-input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 0 8px !important;
    border-radius: 0 !important;
    width: 24px !important;
    height: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    font-size: 0 !important; /* on masque le texte éventuel */
    position: relative;
}

/* On dessine l’icône (un petit œil) nous-mêmes */
.woocommerce form button.show-password-input::before,
.woocommerce-page form button.show-password-input::before {
    content: "👁"; /* tu peux mettre autre chose : "\f06e" avec une font-icon par ex. */
    font-size: 16px;
    line-height: 1;
    color: #014639; /* ton vert */
}


/* Texte de confidentialité plus petit sur les formulaires WooCommerce */
.woocommerce form .woocommerce-privacy-policy-text p {
    font-size: 14px;     /* ou 13px si tu veux encore plus petit */
    line-height: 1.4;
    margin-bottom: 22px; /* espace AVANT le bouton */
}


@media only screen and (min-width: 1000px) {
  body.woocommerce-account .content .container .container_inner.default_template_holder,
  body.woocommerce-account .content .container .container_inner.page_container_inner {
      padding-top: 0 !important;
  }
}

/* Supprime totalement le padding-top sur mobile */
@media only screen and (max-width: 1000px) {
    .content .container .container_inner.default_template_holder,
    .content .container .container_inner.page_container_inner {
        padding-top: 0 !important;
    }
}







/* === MON COMPTE — MOBILE — Nouvelle version finale === */

/* Titre des blocs */
.woocommerce-account #customer_login h2 {
    font-family: "Gopher", sans-serif;
    font-weight: 800;
    font-size: 26px;
    margin-bottom: 12px;
    color: #014639;
}

/* === VERSION MOBILE === */
@media (max-width: 768px) {

  /* **************
     BLOC INSCRIPTION (u-column2) — GRAND, LARGE, RESPIRANT
     ************** */
  .woocommerce-account #customer_login .u-column2 {
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 auto 40px !important;

      padding: 28px 22px 34px !important;
      border-radius: 26px !important;

      background: #F9B1FF1A !important; /* rose ultra léger */
      box-sizing: border-box !important;
      border: none !important;
  }

  /* **************
     BLOC CONNEXION (u-column1) — Discret et plus étroit
     ************** */
  .woocommerce-account #customer_login .u-column1 {
      padding: 0 12px 40px !important;
      border-top: 1px solid #E0E0E0 !important;
      margin-top: 30px !important;
  }

  /* "Lost your password" bien placé sous le bouton */
  .woocommerce-account #customer_login .lost_password {
      display: block;
      margin-top: 10px !important;
      text-align: left;
      font-size: 14px;
  }
}

/* Texte de confidentialité plus petit */
.woocommerce form .woocommerce-privacy-policy-text p {
    font-size: 14px;
    line-height: 1.4;
}

/* Espacement entre ce texte et le bouton */
.woocommerce-account #customer_login .woocommerce-privacy-policy-text {
    margin-bottom: 14px;
}


















/* Sur mobile : montrer l'inscription avant la connexion sur /mon-compte/ */
@media (max-width: 768px) {
  #customer_login {
    display: flex;
    flex-direction: column;
    gap: 30px; /* espace entre les deux blocs, ajuste si besoin */
  }

  #customer_login .u-column1.col-1 {  /* bloc Connexion */
    order: 2;  /* passe en dessous */
  }

  #customer_login .u-column2.col-2 {  /* bloc Inscription */
    order: 1;  /* passe au-dessus */
  }
}



/* Bouton "Parcourir les produits" et "Enregistrer les modifications" */
.woocommerce .button,
.woocommerce .button.alt,
.woocommerce .woocommerce-Button,
.woocommerce-page .button,
.woocommerce-page .woocommerce-Button {
    background-color: #014639 !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}

/* Hover */
.woocommerce .button:hover,
.woocommerce .button.alt:hover,
.woocommerce .woocommerce-Button:hover,
.woocommerce-page .button:hover,
.woocommerce-page .woocommerce-Button:hover {
    background-color: #013E33 !important; /* un peu plus foncé */
    color: #ffffff !important;
}

/* Pour empêcher ton thème d’ajouter du rose */
.woocommerce button.button,
.woocommerce a.button {
    border: none !important;
}













/* ===============================
   TITRES : plus spécifiques + forcés (le thème écrasait ta règle)
   =============================== */

.woocommerce-EditAccountForm .bcc-section-title{
  font-family: gopher, sans-serif !important;
  font-size: 22px !important; /* augmente ici */
  color: rgb(100, 1, 46) !important;
  font-weight: 700 !important;
  margin: 0 0 18px 0 !important;
  padding-bottom: 8px;
  line-height: 1.2;
  border-bottom: 1px solid rgba(100, 1, 46, 0.15);
}

/* BOUTON : on neutralise les floats/positions du thème */
.woocommerce-EditAccountForm .bcc-account-actions{
  clear: both;
  display: flex;
  justify-content: flex-end;
  margin-top: 22px;
}

/* Section Batch un peu plus visible (clé UX) */
.bcc-section-batch {
    background: #e3f1ec;
    padding: 22px 22px 26px;
    border-radius: 14px;
}

/* Espacement global entre sections */
.bcc-account-section {
    margin-bottom: 36px;
}


.woocommerce-EditAccountForm .bcc-account-actions .woocommerce-Button{
  float: none !important;
  position: static !important;
}



/* Masquer complètement le header Bridge */
header.page_header,
header#header,
.qode_header,
.qode-header,
.qodef-page-header,
.qodef-top-bar,
.qode_top_bar {
  display: none !important;
}










/* === Page Produit (Batch Cooking Club) === */

/* Cache la quantité (inutile pour tes variations) */
.woocommerce div.product form.cart .quantity,
.woocommerce div.product form.cart .buttons_added{
  display: none !important;
}

/* Bouton plein largeur sur mobile */
@media (max-width: 767px){
  .woocommerce div.product form.cart button.single_add_to_cart_button{
    width: 100% !important;
    display: block !important;
    border-radius: 999px;
    padding: 16px 18px;
    font-size: 16px;
  }
  .woocommerce div.product .single_variation_wrap{
    margin-top: 14px;
  }
}

/* Champ quantité (au milieu) : reset (au cas où le thème l’affiche ailleurs) */
.woocommerce .quantity input.qty{
  background: transparent !important;
  border: 2px solid #014639 !important;
  border-radius: 12px !important;
  color: #014639 !important;
  height: 38px !important;
  line-height: 36px !important;
  padding: 0 10px !important;
  box-shadow: none !important;
}

/* WooCommerce : masquer meta produit */
.woocommerce div.product .product_meta,
.woocommerce div.product .product_meta .sku_wrapper,
.woocommerce div.product .product_meta .posted_in{
  display: none !important;
}

/* Masque le texte auto Woo Subscriptions */
.subscription-details{
  display: none !important;
}

/* Bloc prix global ("à partir de") */
.woocommerce div.product .price{
  margin: 18px 0 6px;
  line-height: 1.1;
}

/* "À partir de" */
.woocommerce div.product .price .from{
  font-family: "TT Commons Pro", sans-serif;
  font-size: 18px;
  font-weight: 500;
  color: #627671;
}

/* Forcer la couleur du prix (thème l’écrase) */
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  color: #014639 !important;
}

/* Montant "à partir de" (rose) */
.woocommerce div.product p.price .woocommerce-Price-amount.amount,
.woocommerce div.product span.price .woocommerce-Price-amount.amount,
.woocommerce div.product p.price .woocommerce-Price-amount.amount bdi,
.woocommerce div.product span.price .woocommerce-Price-amount.amount bdi,
.woocommerce div.product p.price .woocommerce-Price-currencySymbol,
.woocommerce div.product span.price .woocommerce-Price-currencySymbol{
  color: #f65cec !important;
}

/* Ligne secondaire sous le prix */
.woocommerce div.product .price::after{
  content: "Consigne récupérable : 14,90 € (une seule fois)";
  display: block;
  margin-top: 8px;
  font-family: "TT Commons Pro", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #627671;
}

@media (max-width: 767px) {
  .woocommerce div.product .price .amount{
    font-size: 36px;
  }
  .woocommerce div.product .price::after{
    font-size: 15px;
  }
}

/* Espace entre le prix et la description produit */
.woocommerce div.product .woocommerce-product-details__short-description{
  margin-top: 28px !important;
}

/* Titre produit */
.woocommerce div.product h1.product_title{
  line-height: 1.15 !important;
  font-size: 30px;
  color: #014639;
}

/* Mobile : padding un peu réduit */
@media (max-width: 767px){
  .woocommerce div.product .qode-single-product-summary .summary.entry-summary{
    padding: 22px 18px 24px;
    margin: 18px 0;
    border-radius: 18px;
  }
}

/* === Checklist avec petites coches (style Huel-like) === */
.woocommerce div.product .woocommerce-product-details__short-description ul.bcc-checklist{
  list-style: none !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
}

.woocommerce div.product .woocommerce-product-details__short-description ul.bcc-checklist li{
  position: relative;
  padding-left: 28px;
  margin: 0 0 10px 0 !important;
  line-height: 1.35;
  color: #014639;
  font-weight: 500;
}

.woocommerce div.product .woocommerce-product-details__short-description ul.bcc-checklist li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 900;
  background: #014639;
  color: #ffffff;
}

/* === Variations === */

/* Table variations : aérer */
.woocommerce div.product table.variations{
  margin: 18px 0 10px !important;
  width: 100%;
}

/* Mettre label + chips sur UNE seule ligne */
.woocommerce div.product table.variations tbody tr{
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
}

.woocommerce div.product table.variations td.label{
  padding-right: 0 !important;
  color: #014639;            /* label en vert */
  font-weight: 800;
  width: auto !important;
  min-width: 140px;          /* ajuste si besoin */
  margin: 0 !important;
}

.woocommerce div.product table.variations td.value{
  flex: 1;
}

/* Focus (si jamais on affiche des champs ailleurs) */
.woocommerce div.product table.variations select:focus{
  border-color: #014639;
  box-shadow: 0 0 0 3px rgba(1,70,57,.10);
}

/* Cache le lien "Clear" */
.woocommerce div.product a.reset_variations{
  display:none !important;
}

/* Cache les selects proprement (sans casser Woo) */
.woocommerce div.product table.variations select{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Conteneur des chips : tout sur une ligne (scroll horizontal si besoin) */
.woocommerce div.product .bcc-opts{
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  margin: 0 !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
}

/* Option (chips) : fond blanc / contour vert / texte vert */
.woocommerce div.product .bcc-opt{
  appearance: none;
  border: 2px solid #014639 !important;
  background: #ffffff !important;
  color: #014639 !important;
  font-family: "TT Commons Pro", sans-serif;
  font-weight: 800;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  line-height: 1;
  cursor: pointer;
  transition: transform .06s ease;
  min-width: 44px; /* taille tap-friendly */
  text-align: center;
  flex: 0 0 auto;
}
.woocommerce div.product .bcc-opt:active{ transform: scale(.98); }

/* Sélectionné : fond vert / texte blanc */
.woocommerce div.product .bcc-opt.is-active{
  background: #014639 !important;
  border-color: #014639 !important;
  color: #ffffff !important;
}

/* === Prix final (variation) : vert + gros, sous les sélecteurs === */
.woocommerce div.product .woocommerce-variation-price{
  margin: 18px 0 6px !important;
}

.woocommerce div.product .woocommerce-variation-price .price{
  margin: 0 !important;
}

.woocommerce div.product .woocommerce-variation-price .woocommerce-Price-amount,
.woocommerce div.product .woocommerce-variation-price .woocommerce-Price-currencySymbol{
  color: #014639 !important;
  font-size: 38px !important;
  font-weight: 900 !important;
  line-height: 1.1;
}

/* Optionnel : réduire le texte consigne (si tu l’affiches ailleurs) */
.woocommerce div.product .woocommerce-variation-price .subscription-details{
  display: none !important;
}

/* Petit ajustement mobile */
@media (max-width: 767px){
  .woocommerce div.product table.variations td.label{
    min-width: 120px;
  }
  .woocommerce div.product .woocommerce-variation-price .woocommerce-Price-amount,
  .woocommerce div.product .woocommerce-variation-price .woocommerce-Price-currencySymbol{
    font-size: 34px !important;
  }
}


/* Variations : titre au-dessus + chips sur une ligne */
.woocommerce div.product table.variations tbody tr{
  display: block;
  margin-bottom: 18px;
}

.woocommerce div.product table.variations td.label{
  display: block;
}

.woocommerce div.product table.variations td.value{
  display: block;
}



/* ✅ Prix de variation (le prix final) -> vert (écrase le rose) */
.woocommerce div.product .single_variation_wrap .woocommerce-variation-price .woocommerce-Price-amount.amount,
.woocommerce div.product .single_variation_wrap .woocommerce-variation-price .woocommerce-Price-amount.amount bdi,
.woocommerce div.product .single_variation_wrap .woocommerce-variation-price .woocommerce-Price-currencySymbol{
  color: #014639 !important;
}

/* Consigne sous le prix : plus proche du montant */
.woocommerce div.product .price::after{
  content: "Consigne récupérable : dès 14,90 €";
  display: block;
  margin-top: 0px;          /* plus proche du prix */
  margin-bottom: 25px;      /* espace AVANT le bouton */
  font-family: "TT Commons Pro", sans-serif;
  font-size: 15px;
  font-weight: 500;
  color: #627671;
}

/* Masquer l'accordéon "Additional information" et "Avis" sur la page produit */
.woocommerce-accordion .additional_information_tab,
.woocommerce-accordion .reviews_tab,
.woocommerce-accordion .additional_information_tab + .accordion_content,
.woocommerce-accordion .reviews_tab + .accordion_content{
  display:none !important;
}












/* =========================================
   Elementor Nested Tabs : style "texte"
   ========================================= */

/* 1) Reset bouton + texte vert */
.e-n-tabs .e-n-tab-title{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  padding: 0 0 10px 0 !important; /* espace pour le soulignement */
  margin: 0 28px 0 0 !important;

  color: #155a4d !important;      /* vert */
  font-family: "tt-commons-pro", sans-serif !important;
  font-weight: 500 !important;
  font-size: 22px !important;
  line-height: 1.2 !important;

  display: inline-flex !important;
  align-items: center !important;

  cursor: pointer !important;
}

/* 2) Le span hérite bien de la couleur */
.e-n-tabs .e-n-tab-title .e-n-tab-title-text{
  color: inherit !important;
}

/* 3) Soulignement vert épais UNIQUEMENT actif */
.e-n-tabs .e-n-tab-title[aria-selected="true"]{
  border-bottom: 4px solid #155a4d !important;
}

/* 4) Optionnel : hover */
.e-n-tabs .e-n-tab-title:hover{
  opacity: .75;
}

/* 5) Si Elementor ajoute des traits/décos via pseudo-éléments */
.e-n-tabs .e-n-tab-title::before,
.e-n-tabs .e-n-tab-title::after{
  display: none !important;
  content: none !important;
}

/* ===============================
   MOBILE – Tabs Elementor propres
   =============================== */
@media (max-width: 767px){

  /* conteneur tabs : pas de justification bizarre */
  .e-n-tabs{
    justify-content: flex-start !important;
  }

  /* chaque tab = largeur du texte */
  .e-n-tabs .e-n-tab-title{
    flex: 0 0 auto !important;
    width: auto !important;

    margin-right: 18px !important;
    padding-bottom: 6px !important;
  }

  /* underline plus fin sur mobile */
  .e-n-tabs .e-n-tab-title[aria-selected="true"]{
    border-bottom-width: 3px !important;
  }
}

/* =========================================
   MOBILE – Marges sur TITRES + CONTENU tabs
   ========================================= */
@media (max-width: 767px){

  /* marges sur la ligne des tabs (titres) */
  .e-n-tabs .e-n-tabs-heading{
    padding-left: 18px !important;
    padding-right: 18px !important;
    box-sizing: border-box !important;
  }

  /* marges sur le contenu */
  .e-n-tabs .e-n-tabs-content > .e-con{
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
  }
}


/* =========================================
   Nested Tabs Elementor – underline sous le TEXTE seulement
   ========================================= */

/* Supprime toute bordure/trait qui pourrait venir du conteneur des titres */
.e-n-tabs .e-n-tabs-heading{
  border-bottom: none !important;
}

/* Les boutons ne doivent pas prendre 100% */
.e-n-tabs .e-n-tab-title{
  width: fit-content !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 10px 0 !important;
}

/* Texte vert */
.e-n-tabs .e-n-tab-title .e-n-tab-title-text{
  display: inline-block !important;  /* IMPORTANT pour que le trait suive la largeur du texte */
  color: #155a4d !important;
  padding-bottom: 10px !important;   /* espace pour le trait */
}

/* On enlève l'underline éventuel sur le bouton (qui faisait toute la largeur) */
.e-n-tabs .e-n-tab-title[aria-selected="true"]{
  border-bottom: 0 !important;
}

/* Underline vert épais UNIQUEMENT sous le texte actif */
.e-n-tabs .e-n-tab-title[aria-selected="true"] .e-n-tab-title-text{
  border-bottom: 4px solid #155a4d !important;
}

/* Optionnel : centrer la liste des tabs (vu sur ta capture) */
.e-n-tabs .e-n-tabs-heading{
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

@media (max-width: 767px){
  .e-n-tabs .e-n-tab-title .e-n-tab-title-text{
    font-size: 17px !important;
    line-height: 1.25 !important;
  }
}



/* DESKTOP : tabs en ligne */
@media (min-width: 768px){
  .e-n-tabs .e-n-tabs-heading{
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important; /* ou flex-start si tu préfères à gauche */
    align-items: center !important;
    gap: 28px !important;
  }

  /* on annule la marge verticale que tu avais mise */
  .e-n-tabs .e-n-tab-title{
    margin: 0 !important;
  }
}

/* MOBILE : tabs en colonne */
@media (max-width: 767px){
  .e-n-tabs .e-n-tabs-heading{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .e-n-tabs .e-n-tab-title{
    margin: 0 !important;
  }
}

/* =========================================
   FIX : Nested Tabs Elementor affiche tout
   ========================================= */

/* Cache tous les contenus par défaut */
.e-n-tabs .e-n-tabs-content > [role="tabpanel"]{
  display: none !important;
}

/* Affiche uniquement l'onglet actif (Elementor met .e-active) */
.e-n-tabs .e-n-tabs-content > .e-active[role="tabpanel"]{
  display: block !important;
}



div.title.title_size_small.position_left{
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}


/* Masquer flèches du carrousel Elementor */
.recettes-carousel .elementor-swiper-button{
  display: none !important;
}



/* ===============================
   Bloc recettes produit
   =============================== */
.bcc-product-recettes{
  margin: 80px 0 100px; /* espace avant/après */
}

/* Titre */
.bcc-product-recettes-title{
  text-align: center;
  margin-bottom: 40px;
  font-family: "gopher", sans-serif;
  font-weight: 700;
  font-style: normal;
color: #155a4d;
	line-height: 27px;
	
}


/* Mobile */
@media (max-width: 767px){
  .bcc-product-recettes{
    margin: 50px 0 70px;
  }

  .bcc-product-recettes-title{
    font-size: 24px;
    margin-bottom: 28px;
    padding: 0 20px;
  }
}


.bcc-product-bottom-template{
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}




/* =========================================
   FIX MOBILE – Page produit uniquement
   ========================================= */
@media (max-width: 767px){

  /* 1) Réduire les marges/paddings du bloc résumé (Qode) */
  body.single-product.woocommerce div.product .qode-single-product-summary .summary.entry-summary{
    padding: 10px 30px 0px 30px !important;
    margin: 10px 0 !important;
    border-radius: 14px !important;
  }

  /* 2) Tabs Elementor : FORCER en ligne + scroll (au lieu de colonne) */
  body.single-product .e-n-tabs .e-n-tabs-heading{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: center !important;

    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;

    gap: 16px !important;
    padding: 0 12px 8px !important;
  }

  /* Empêche les titres de prendre 100% */
  body.single-product .e-n-tabs .e-n-tab-title{
    width: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.single-product .e-n-tabs .e-n-tab-title .e-n-tab-title-text{
    display: inline-block !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    padding-bottom: 8px !important;
  }

  /* underline actif (texte seulement) un peu plus fin */
  body.single-product .e-n-tabs .e-n-tab-title[aria-selected="true"] .e-n-tab-title-text{
    border-bottom-width: 3px !important;
  }

  /* 3) Contenu des tabs : marges latérales plus petites */
  body.single-product .e-n-tabs .e-n-tabs-content > .e-con{
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
  }

  /* 4) Bloc "Explorer les recettes..." : trop d’air -> on resserre */
  body.single-product .bcc-product-recettes{
    margin: 34px 0 46px !important;
  }

  body.single-product .bcc-product-recettes-title{
    padding: 0 12px !important;
    margin-bottom: 14px !important;
    font-size: 22px !important;
    line-height: 1.15 !important;
  }

  /* 5) Ton full width : garder full width mais éviter “collé aux bords” */
  body.single-product .bcc-product-bottom-template{
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
  }
}

/* =========================================
   FIX THEME QODE/BRIDGE — width 300px sur mobile
   Page produit uniquement
   ========================================= */
@media only screen and (max-width: 480px) {
  body.single-product .container_inner,
  body.single-product div.section .section_inner,
  body.single-product div.grid_section .section_inner,
  body.single-product .full_width .parallax_content{
    width: 100% !important;
    max-width: 100% !important;
  }
}








/* Badge centré horizontalement, positionné en haut de l’image */
.woocommerce-account .bcc-card .bcc-media .bcc-badges{
  position: absolute !important;
  top: 22px !important;                /* ajuste si besoin */
  left: 50% !important;
  transform: translateX(-50%) !important;

  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;

  z-index: 3 !important;
  pointer-events: none !important;
}

/* S’assure que l’image est la référence */
.woocommerce-account .bcc-card .bcc-media{
  position: relative !important;
}


/* DESCRIPTION COURTE – couleur verte + interligne plus serré */
.woocommerce-account .bcc-card .bcc-desc{
  color: #014639 !important;
  font-family: "TT Commons Pro", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.25 !important; /* moins d’interligne */
  margin: 0 !important;
  opacity: 0.95;
}


/* Conteneur texte de la carte */
.woocommerce-account .bcc-card .bcc-body{
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px; /* espace maîtrisé entre les éléments */
}


/* Tu gardes tes .recette-tag + couleurs par slug */
.recette-tag{
  font-family: "TT Commons Pro", sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  padding: 6px 12px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* Titre du plat */
.bcc-card h3,
.bcc-card .bcc-title{
  color: #64012E;
  font-family: "TT Commons Pro", sans-serif;
  font-weight: 600;
  font-size: 18px;
  line-height: 1.15; /* plus compact */
  margin: 12px 0 6px;
}



/* ===============================
   BCC — TITRES ESPACE CLIENT
   Objectif : même style que "Données personnelles"
   =============================== */

/* Titre principal de page (Données personnelles / Choisir mes plats / Retrait des plats...) */
.woocommerce-account .woocommerce-MyAccount-content h1,
.woocommerce-account .woocommerce-MyAccount-content h2.bcc-page-title,
.woocommerce-account .woocommerce-MyAccount-content .bcc-page-title,
.woocommerce-account .woocommerce-MyAccount-content > h2,
.woocommerce-account .woocommerce-MyAccount-content > h3:first-child{
  font-family: "gopher", sans-serif !important;
  font-weight: 700 !important;
  font-style: normal !important;

  font-size: 30px !important;          /* ajuste si besoin */
  line-height: 1.15 !important;
  color: #64012E !important;

  margin: 0 0 18px 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(100, 1, 46, 0.18) !important;
}

/* Mobile : un peu plus compact */
@media (max-width: 767px){
  .woocommerce-account .woocommerce-MyAccount-content h1,
  .woocommerce-account .woocommerce-MyAccount-content h2.bcc-page-title,
  .woocommerce-account .woocommerce-MyAccount-content .bcc-page-title,
  .woocommerce-account .woocommerce-MyAccount-content > h2,
  .woocommerce-account .woocommerce-MyAccount-content > h3:first-child{
    font-size: 24px !important;
    margin-bottom: 14px !important;
  }
}



/* =========================================
   BCC — ESPACE COMPTE — FIX MARGES MOBILE
   Objectif : récupérer de la largeur utile
   ========================================= */
@media (max-width: 767px){

  /* 1) Neutralise les paddings Bridge/Qode qui écrasent le contenu */
  body.woocommerce-account .content,
  body.woocommerce-account .content_inner,
  body.woocommerce-account .container,
  body.woocommerce-account .container_inner,
  body.woocommerce-account .full_width,
  body.woocommerce-account .full_width_inner{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 2) Redonne une marge "propre" (fine, lisible) sur le vrai contenu */
  body.woocommerce-account .woocommerce{
    padding-left: 14px !important;
    padding-right: 14px !important;
    box-sizing: border-box !important;
  }

  /* 3) Si ton thème limite la largeur (max-width) */
  body.woocommerce-account .container_inner{
    width: 100% !important;
    max-width: 100% !important;
  }

  /* 4) Navigation + contenu : plein écran (Woo met parfois des widths) */
  body.woocommerce-account .woocommerce-MyAccount-navigation,
  body.woocommerce-account .woocommerce-MyAccount-content{
    float: none !important;
    width: 100% !important;
  }

  /* 5) Optionnel : la nav prend trop de place verticalement → compacte un peu */
  body.woocommerce-account .woocommerce-MyAccount-navigation li a{
    padding: 12px 0 !important;
  }
}



/* =========================================
   BCC — ESPACE ENTRE TEXTE INTRO & GRILLE
   ========================================= */

.bcc-menus-intro{
  margin-bottom: 28px !important;
}

/* Mobile : un peu plus respirant */
@media (max-width: 767px){
  .bcc-menus-intro{
    margin-bottom: 22px !important;
  }
}


/* =========================================
   BCC — CADRE "VOTRE RETRAIT ACTUEL"
   (override WooCommerce notice)
   ========================================= */

body.woocommerce-account 
.woocommerce-MyAccount-content 
.woocommerce-info{
  background: #E3F1EC !important;   /* même vert que "Mon batch" */
  border: none !important;
  border-radius: 16px !important;

  padding: 20px 22px !important;
  margin-top: 18px !important;

  box-shadow: none !important;

  font-family: "TT Commons Pro", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  color: #014639 !important;
}

/* =========================================
   FIX — PAS DE MAJUSCULES SUR LA NOTICE
   ========================================= */

body.woocommerce-account 
.woocommerce-MyAccount-content 
.woocommerce-info,
body.woocommerce-account 
.woocommerce-MyAccount-content 
.woocommerce-info *{
  text-transform: none !important;
}


/* =========================================
   FIX — SUPPRIMER LE PADDING TOP SUR DESKTOP
   ========================================= */
@media only screen and (min-width: 1000px) {
  .content .container .container_inner.default_template_holder,
  .content .container .container_inner.page_container_inner {
    padding-top: 40px !important;
  }
}


/* =========================================
   CHECKOUT BLOCKS — CHAMPS AVEC CADRE PARTOUT
   (Prénom / Nom / Adresse / etc.)
   ========================================= */

/* Conteneur du champ : on neutralise styles parasites */
.woocommerce-checkout .wc-block-components-text-input{
  margin-bottom: 16px; /* espace entre champs */
}

/* Input */
.woocommerce-checkout .wc-block-components-text-input input,
.woocommerce-checkout .wc-block-components-text-input textarea{
  border: 1px solid #014639 !important;
  border-radius: 8px !important;
  padding: 12px 12px !important;
  background: #fff !important;
  box-shadow: none !important;

  font-family: "TT Commons Pro", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: #014639 !important;
}

/* Label */
.woocommerce-checkout .wc-block-components-text-input label{
  font-family: "TT Commons Pro", sans-serif !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  color: #014639 !important;
}

/* Focus (premium) */
.woocommerce-checkout .wc-block-components-text-input input:focus,
.woocommerce-checkout .wc-block-components-text-input textarea:focus{
  border-color: #8F2820 !important;
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(143, 40, 32, 0.12) !important;
}

/* Placeholder */
.woocommerce-checkout .wc-block-components-text-input input::placeholder,
.woocommerce-checkout .wc-block-components-text-input textarea::placeholder{
  color: rgba(1,70,57,0.45) !important;
}

/* Etats invalides (si Woo affiche une erreur) */
.woocommerce-checkout .wc-block-components-text-input.is-invalid input,
.woocommerce-checkout .wc-block-components-text-input.is-invalid textarea{
  border-color: #8F2820 !important;
}

















/* =========================================
   BCC — PAGE LÉGALE (RGPD) — TYPO MOBILE OK
   Mets la classe "bcc-legal" sur la section Elementor qui contient le texte
   ========================================= */

.bcc-legal{
  /* optionnel : un peu de confort de lecture */
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* Titres */
.bcc-legal h1{
  font-family: "gopher", sans-serif;
  font-weight: 800;
  font-size: clamp(34px, 6vw, 56px);
  line-height: 1.05;
  margin: 0 0 14px 0;
}

.bcc-legal h2{
  font-family: "gopher", sans-serif;
  font-weight: 800;
  font-size: clamp(26px, 5.2vw, 42px);
  line-height: 1.05;
  margin: 26px 0 10px 0;
  letter-spacing: -0.01em;
  hyphens: auto;
}

/* Texte */
.bcc-legal p,
.bcc-legal li{
  font-family: "tt-commons-pro", sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.55;
  color: #014639;
}

/* Listes plus propres */
.bcc-legal ul{
  margin: 10px 0 18px 0;
  padding-left: 20px;
}
.bcc-legal li{ margin: 6px 0; }

/* Mobile : on calme les H2 + on redonne de l’air au texte */
@media (max-width: 767px){
  .bcc-legal{
    padding-left: 18px;
    padding-right: 18px;
  }

  .bcc-legal h1{
    font-size: 38px;
    line-height: 1.05;
  }

  .bcc-legal h2{
    font-size: 32px;   /* <- c’est ça qui règle le “1. Responsable…” trop gros */
    line-height: 1.05;
    margin-top: 22px;
  }

  .bcc-legal p,
  .bcc-legal li{
    font-size: 16px;   /* <- plus confortable sur mobile */
    line-height: 1.55; /* <- évite l’effet “serré” */
  }
}






/* =========================================
   OVERRIDE BOUTONS WOO — MON ABONNEMENT
   Spécificité > règle globale (0,3,0)
   ========================================= */

body.woocommerce-account.woocommerce-view-subscription
.woocommerce .button,
body.woocommerce-account.woocommerce-view-subscription
.woocommerce .button.alt,
body.woocommerce-account.woocommerce-view-subscription
.woocommerce .woocommerce-Button,
body.woocommerce-account.woocommerce-view-subscription
.woocommerce-page .button,
body.woocommerce-account.woocommerce-view-subscription
.woocommerce-page .woocommerce-Button{
  background: transparent !important;
  color: #014639 !important;

  border-style: solid !important;
  border-width: 2px !important;
  border-color: #014639 !important;

  box-shadow: none !important;

  padding: 1px 14px !important;
  font-size: 15px !important;
  line-height: 1.1 !important;
  border-radius: 999px !important;

  width: auto !important;
}

/* =========================================
   ESPACEMENT ENTRE BOUTONS — MON ABONNEMENT
   ========================================= */

/* Desktop : un espace horizontal + un petit espace vertical */
body.woocommerce-account.woocommerce-view-subscription
.woocommerce a.button,
body.woocommerce-account.woocommerce-view-subscription
.woocommerce a.woocommerce-button{
  margin: 0 12px 12px 0 !important; /* droite + bas */
}

/* Pas d’espace après le dernier si tu veux */
body.woocommerce-account.woocommerce-view-subscription
.woocommerce a.button:last-child,
body.woocommerce-account.woocommerce-view-subscription
.woocommerce a.woocommerce-button:last-child{
  margin-right: 0 !important;
}

/* Mobile : empilé proprement */
@media (max-width: 767px){
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce a.button,
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce a.woocommerce-button{
    display: block !important;
    width: 100% !important;
    margin: 0 0 10px 0 !important; /* juste vertical */
  }
}

/* =========================================
   BOUTONS OUTLINE — TOUT L’ESPACE MON COMPTE
   ========================================= */
body.woocommerce-account
.woocommerce .button,
body.woocommerce-account
.woocommerce .button.alt,
body.woocommerce-account
.woocommerce .woocommerce-Button,
body.woocommerce-account
.woocommerce-page .button,
body.woocommerce-account
.woocommerce-page .woocommerce-Button{
  background: transparent !important;
  color: #014639 !important;

  border-style: solid !important;
  border-width: 2px !important;
  border-color: #014639 !important;

  box-shadow: none !important;

  padding: 1px 14px !important;
  font-size: 15px !important;
  line-height: 1.1 !important;
  border-radius: 999px !important;

  width: auto !important;
}








/* =========================================
   BCC — TITRE "Explorer les recettes" — MOBILE
   Le rendre visible face à la FAQ
   ========================================= */
@media (max-width: 767px){

  body.single-product .bcc-product-recettes-title{
    font-size: 26px !important;     /* avant ~22px */
    line-height: 1.15 !important;
    margin-top: 22px !important;
    margin-bottom: 22px !important;

    padding: 0 14px !important;
    text-align: center;

    font-weight: 700 !important;    /* plus de présence */
  }
}











/* ===============================
   BCC — THANK YOU PAGE CTA (TOP)
   =============================== */

.bcc-thankyou-top{
  margin: 40px 0 30px;
}

.bcc-thankyou-top__inner{
  max-width: 960px;
  margin: 0 auto;
  padding: 28px 26px 30px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid rgba(1,70,57,0.15);
  text-align: center;

  /* polish */
  box-shadow: 0 10px 30px rgba(1,70,57,.06);
}

/* Titre */
.bcc-thankyou-top__title{
  font-family: "gopher", sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: 1.1;
  color: #014639;
  margin: 0 0 12px 0;
}

/* Texte */
.bcc-thankyou-top__text{
  font-family: "TT Commons Pro", sans-serif;
  font-size: 18px;
  line-height: 1.5;
  color: #014639;
  margin: 0 auto 22px auto;

  max-width: 680px;
  opacity: .92;
}

/* Zone boutons */
.bcc-thankyou-top__actions{
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 10px 0 16px;
}

/* Note */
.bcc-thankyou-top__note{
  font-family: "TT Commons Pro", sans-serif;
  font-size: 15px;
  line-height: 1.4;
  color: #627671;
  margin: 0;
}


/* ===============================
   BCC — BOUTONS CTA POST-CHECKOUT
   Style identique aux boutons Elementor Qi
   =============================== */

.bcc-qi-btn{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  padding: 12px 28px;
  border-radius: 44px;

  background-color: #F9B1FF;
  color: #64012E !important;

  border: 2px solid #64012E;
  font-family: "TT Commons Pro", sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none !important;

  box-shadow: 0 10px 24px rgba(100,1,46,.12);
  transition: all 0.25s ease;
}

.bcc-qi-btn:hover{
  background-color: #64012E;
  color: #F9B1FF !important;
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(100,1,46,.18);
}


/* ===============================
   THANK YOU — Woo message (optionnel)
   Enlève le doublon "Merci. Votre commande..."
   =============================== */
body.woocommerce-order-received p.woocommerce-notice{
  display:none !important;
}


/* ===============================
   THANK YOU — Order overview pills
   (Order number / Date / Email / Total / Payment)
   =============================== */

body.woocommerce-order-received ul.woocommerce-order-overview{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 18px 0 18px;
  padding: 0;
}

body.woocommerce-order-received ul.woocommerce-order-overview li{
  list-style: none !important;
  padding: 8px 30px;
  border-radius: 999px;
  background: rgba(227,241,236,.75);
  border: 1px solid rgba(1,70,57,.12);

  font-family: "TT Commons Pro", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #014639;

  min-width: 0;
}.elementor-section

body.woocommerce-order-received ul.woocommerce-order-overview li strong{
  display: inline;
  margin-left: 6px;
  font-weight: 800;
  color: #014639;
}

/* Met un accent sur le total (souvent li.order) */
body.woocommerce-order-received ul.woocommerce-order-overview li.order strong{
  color: #64012E;
}


/* ===============================
   THANK YOU — Tables (shop_table)
   =============================== */

body.woocommerce-order-received table.shop_table{
  border-radius: 16px;
  overflow: hidden;
}

body.woocommerce-order-received table.shop_table th,
body.woocommerce-order-received table.shop_table td{
  padding: 14px 16px;
}

/* 1ère colonne plus forte */
body.woocommerce-order-received table.shop_table td:first-child,
body.woocommerce-order-received table.shop_table th:first-child{
  font-weight: 700;
}

/* Footer un peu plus lisible */
body.woocommerce-order-received table.shop_table tfoot td{
  font-size: 16px;
}

/* Total final */
body.woocommerce-order-received table.shop_table tfoot tr:last-child th,
body.woocommerce-order-received table.shop_table tfoot tr:last-child td{
  font-size: 18px !important;
  font-weight: 900 !important;
  color: #014639 !important;
}

/* Abonnements associés : bouton à droite */
body.woocommerce-order-received table.my_account_orders td:last-child{
  text-align: right;
}


/* ===============================
   MOBILE — THANK YOU CTA
   =============================== */

@media (max-width: 767px){

  .bcc-thankyou-top{
    margin: 24px 12px 20px;
  }

  .bcc-thankyou-top__inner{
    padding: 22px 18px 24px;
  }

  .bcc-thankyou-top__title{
    font-size: 28px;
  }

  .bcc-thankyou-top__text{
    font-size: 16px;
  }

  .bcc-thankyou-top__actions{
    flex-direction: column;
    gap: 12px;
  }

  .bcc-qi-btn{
    width: 100%;
    font-size: 16px;
    padding: 12px 20px;
  }
}




/* ===============================
   THANK YOU — Tables plus lisibles
   =============================== */

body.woocommerce-order-received .woocommerce-order{
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

/* Titres sections */
body.woocommerce-order-received .woocommerce-order h2,
body.woocommerce-order-received .woocommerce-order h3{
  font-family: "gopher", sans-serif;
  font-weight: 800;
  color: #014639;
}

/* Tables = cartes */
body.woocommerce-order-received table.shop_table,
body.woocommerce-order-received table.my_account_orders{
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #fff;
  border: 1px solid rgba(1,70,57,.12);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(1,70,57,.05);
}

/* Lignes */
body.woocommerce-order-received table.shop_table th,
body.woocommerce-order-received table.shop_table td,
body.woocommerce-order-received table.my_account_orders th,
body.woocommerce-order-received table.my_account_orders td{
  padding: 14px 16px !important;
  border-bottom: 1px solid rgba(1,70,57,.08) !important;
  vertical-align: middle !important;
}

/* En-têtes */
body.woocommerce-order-received table.shop_table thead th,
body.woocommerce-order-received table.my_account_orders thead th{
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(1,70,57,.75);
}

/* Dernière ligne sans bordure */
body.woocommerce-order-received table.shop_table tr:last-child td,
body.woocommerce-order-received table.shop_table tr:last-child th,
body.woocommerce-order-received table.my_account_orders tr:last-child td{
  border-bottom: 0 !important;
}

/* Colonne actions (bouton "Voir") alignée à droite */
body.woocommerce-order-received table.my_account_orders td:last-child{
  text-align: right !important;
  white-space: nowrap;
}

/* Bouton "Voir" : cohérent */
body.woocommerce-order-received table.my_account_orders a.button{
  background: #014639 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 10px 18px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

/* Mobile : tables plus respirantes */
@media (max-width: 767px){
  body.woocommerce-order-received .woocommerce-order{
    padding-left: 14px;
    padding-right: 14px;
  }

  body.woocommerce-order-received table.shop_table th,
  body.woocommerce-order-received table.shop_table td,
  body.woocommerce-order-received table.my_account_orders th,
  body.woocommerce-order-received table.my_account_orders td{
    padding: 12px 12px !important;
    font-size: 15px;
  }

  /* Sur mobile, le tableau "abonnements associés" peut déborder → scroll */
  body.woocommerce-order-received .my_account_orders{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}




/* =========================================
   THANK YOU (order received) — Titres sections
   Détails de la commande / Abonnements associés / Adresse de facturation
   ========================================= */

body.woocommerce-order-received .woocommerce-order > h2,
body.woocommerce-order-received .woocommerce-order > h3,
body.woocommerce-order-received .woocommerce-order h2:not(.bcc-thankyou-top__title),
body.woocommerce-order-received .woocommerce-order h3{
  font-family: "gopher", sans-serif !important;
  font-weight: 800 !important;
  color: #014639 !important;
  font-size: 30px !important;      /* desktop */
  line-height: 1.15 !important;
  margin: 34px 0 14px !important;
}

/* Mobile */
@media (max-width: 767px){
  body.woocommerce-order-received .woocommerce-order > h2,
  body.woocommerce-order-received .woocommerce-order > h3,
  body.woocommerce-order-received .woocommerce-order h2:not(.bcc-thankyou-top__title),
  body.woocommerce-order-received .woocommerce-order h3{
    font-size: 24px !important;
    margin: 26px 0 12px !important;
  }
}







/* =====================================================
   THANK YOU (order received) — MOBILE REWORK (PROPRE)
   ===================================================== */
@media (max-width: 767px){

  /* 0) Conteneur : on respire */
  body.woocommerce-order-received .woocommerce-order{
    padding: 0 14px 28px !important;
  }

  /* 1) TITRES sections : un peu plus “présents” */
  body.woocommerce-order-received .woocommerce-order h2,
  body.woocommerce-order-received .woocommerce-order h3{
    font-family: "gopher", sans-serif !important;
    font-weight: 800 !important;
    font-size: 26px !important;
    line-height: 1.15 !important;
    margin: 24px 0 12px !important;
    color: #014639 !important;
  }

  /* 2) PILLS : plus petites + 2 colonnes */
  body.woocommerce-order-received ul.woocommerce-order-overview{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    padding: 0 !important;
    margin: 14px 0 18px !important;
    width: 100% !important;
  }

  body.woocommerce-order-received ul.woocommerce-order-overview > li{
    list-style: none !important;
    margin: 0 !important;
    float: none !important;
    width: auto !important;

    padding: 10px 12px !important;
    border-radius: 16px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;

    background: rgba(227,241,236,.75) !important;
    border: 1px solid rgba(1,70,57,.12) !important;
  }

  /* email / valeurs longues */
  body.woocommerce-order-received ul.woocommerce-order-overview li strong{
    display: block !important;
    margin-top: 4px !important;
    word-break: break-word !important;
    font-weight: 800 !important;
  }

  /* 3) DÉTAILS DE COMMANDE : table full width + lisible */
  body.woocommerce-order-received table.shop_table{
    width: 100% !important;
  }
  body.woocommerce-order-received table.shop_table th,
  body.woocommerce-order-received table.shop_table td{
    padding: 12px 12px !important;
    font-size: 14px !important;
  }

  /* 4) ABONNEMENTS ASSOCIÉS : on transforme le tableau en “cartes” */
  body.woocommerce-order-received table.my_account_orders thead{
    display: none !important; /* plus de header tronqué */
  }

  body.woocommerce-order-received table.my_account_orders,
  body.woocommerce-order-received table.my_account_orders tbody,
  body.woocommerce-order-received table.my_account_orders tr,
  body.woocommerce-order-received table.my_account_orders td{
    display: block !important;
    width: 100% !important;
  }

  /* chaque ligne devient une carte */
  body.woocommerce-order-received table.my_account_orders tr{
    background: #fff !important;
    border: 1px solid rgba(1,70,57,.12) !important;
    border-radius: 18px !important;
    padding: 12px 12px 14px !important;
    margin: 0 0 12px !important;
    box-shadow: 0 10px 30px rgba(1,70,57,.05) !important;
  }

  /* chaque cellule devient une ligne "Label : valeur" (Woo met data-title) */
  body.woocommerce-order-received table.my_account_orders td{
    border: 0 !important;
    padding: 8px 6px !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 12px !important;
    font-size: 14px !important;
  }

  body.woocommerce-order-received table.my_account_orders td::before{
    content: attr(data-title);
    font-weight: 700;
    color: rgba(1,70,57,.75);
  }

  /* la colonne "Actions" : bouton plein largeur en bas */
  body.woocommerce-order-received table.my_account_orders td:last-child{
    justify-content: flex-end !important;
    padding-top: 10px !important;
  }

  body.woocommerce-order-received table.my_account_orders a.button{
    width: 100% !important;
    justify-content: center !important;
    padding: 12px 16px !important;
    border-radius: 999px !important;

    background: #014639 !important;
    color: #fff !important;
    border: none !important;
  }

  /* 5) ADRESSE DE FACTURATION : la transformer en carte */
  body.woocommerce-order-received .woocommerce-customer-details{
    background: #fff !important;
    border: 1px solid rgba(1,70,57,.12) !important;
    border-radius: 18px !important;
    padding: 14px 14px 10px !important;
    box-shadow: 0 10px 30px rgba(1,70,57,.05) !important;
  }

  body.woocommerce-order-received .woocommerce-customer-details address{
    padding: 0 !important;
    border: 0 !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }
}










/* =====================================================
   THANK YOU — CTA boutons (Choisir mes recettes / point de retrait)
   Fix mobile : ne dépasse plus + full width propre
   ===================================================== */
@media (max-width: 767px){

  body.woocommerce-order-received .bcc-thankyou-top__actions{
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    align-items: stretch !important;
  }

  body.woocommerce-order-received .bcc-thankyou-top__actions a,
  body.woocommerce-order-received .bcc-thankyou-top__actions .bcc-qi-btn{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    white-space: normal !important;   /* autorise retour ligne si besoin */
  }

  /* Si le bloc parent est trop étroit à cause d’un padding */
  body.woocommerce-order-received .bcc-thankyou-top__inner{
    overflow: hidden !important;
  }
}



/* =====================================================
   Supprimer la phrase "Affichez l’état de votre abonnement..."
   (Thank you page)
   ===================================================== */
body.woocommerce-order-received .woocommerce-order p{
  /* on ne touche pas à tous les p : uniquement celui exact */
}

body.woocommerce-order-received .woocommerce-order p:has(a[href*="mon-compte"]),
body.woocommerce-order-received .woocommerce-order p:has(a[href*="my-account"]){
  display: none !important;
}



/* =========================================
   FIX CRITIQUE — ANNULER LE WIDTH 300px MOBILE (QODE)
   ========================================= */

@media only screen and (max-width: 480px) {

  .boxed div.section .section_inner,
  .carousel-inner .slider_content_outer,
  .container_inner,
  .container_inner nav.content_menu,
  .elementor-container .elementor-widget-wrap > .qode_elementor_container_inner,
  .elementor-row .elementor-widget-wrap > .qode_elementor_container_inner,
  .full_width .parallax_content,
  .qode_elementor_container_inner,
  .steps_holder_inner,
  div.grid_section .section_inner,
  div[data-element_type=container].qode_elementor_container_inner,
  nav.content_menu ul {

    width: 100% !important;
    max-width: 100% !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    box-sizing: border-box !important;
  }
}





/* =====================================================
   FIX — Mobile carte "Abonnements associés" : rien ne déborde
   ===================================================== */
@media (max-width: 767px){

  /* On s'assure que la carte coupe ce qui dépasse */
  body.woocommerce-order-received table.my_account_orders tr{
    overflow: hidden !important;
  }

  /* Chaque ligne = grille 2 colonnes (plus stable que flex) */
  body.woocommerce-order-received table.my_account_orders td{
    display: grid !important;
    grid-template-columns: 110px 1fr !important; /* label / valeur */
    column-gap: 12px !important;
    align-items: start !important;

    padding: 8px 0 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  /* Label (data-title) */
  body.woocommerce-order-received table.my_account_orders td::before{
    max-width: 110px !important;
    white-space: normal !important;
  }

  /* Valeur : autorise retour ligne + empêche le dépassement */
  body.woocommerce-order-received table.my_account_orders td > *{
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  /* Ligne Actions (bouton) : pleine largeur */
  body.woocommerce-order-received table.my_account_orders td:last-child{
    display: block !important;
    padding-top: 12px !important;
  }

  body.woocommerce-order-received table.my_account_orders td:last-child a.button{
    width: 100% !important;
  }

  /* Si le total est trop long, on le fait respirer */
  body.woocommerce-order-received table.my_account_orders td.order-total{
    grid-template-columns: 110px 1fr !important;
  }
}
/* =====================================================
   FIX FINAL — Bouton "VOIR" ne déborde plus (mobile)
   ===================================================== */
@media (max-width: 767px){

  body.woocommerce-order-received table.my_account_orders td:last-child{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.woocommerce-order-received table.my_account_orders td:last-child a.button{
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;
    padding: 12px 16px !important;

    white-space: normal !important;
    text-align: center !important;

    min-width: 0 !important;     /* ← clé */
  }
}









/* =========================================
   BCC — Carte recette sélectionnée
   ========================================= */

.bcc-card.is-selected{
  border: 2px solid #64012E;
  box-shadow:
    0 10px 26px rgba(100,1,46,0.18),
    0 0 0 2px rgba(100,1,46,0.08);
  transform: translateY(-1px);
}

.bcc-card.is-selected::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:18px;
  background: rgba(100,1,46,0.03);
  pointer-events:none;
}

/* Bouton + en mode sélectionné */
.bcc-card.is-selected .bcc-plus{
  background:#64012E !important;
  color:#fff !important;
  border-color:#64012E !important;
}

/* Micro animation */
.bcc-card{
  transition: border .2s ease, box-shadow .2s ease, transform .2s ease;
}









/* ================================
   BCC — Mon Compte : onglets mobile
   ================================ */
@media (max-width: 768px){

  /* le conteneur du menu */
  .woocommerce-account .woocommerce-MyAccount-navigation{
    width: 100% !important;
    float: none !important;
    margin: 0 0 14px !important;
  }

  /* la liste en ligne + scroll horizontal */
  .woocommerce-account .woocommerce-MyAccount-navigation ul{
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 8px 2px !important;
    margin: 0 !important;
    border: 0 !important;
  }

  /* chaque item = “pill” */
  .woocommerce-account .woocommerce-MyAccount-navigation li{
    flex: 0 0 auto !important;
    list-style: none !important;
    margin: 0 !important;
    border: 0 !important;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation a{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 10px 14px !important;
    border-radius: 999px !important;

    border: 2px solid #014639 !important;
    color: #014639 !important;
    background: transparent !important;

    font-family: "TT Commons Pro", sans-serif !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 1 !important;

    white-space: nowrap !important;
    text-decoration: none !important;
  }

  /* onglet actif */
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
    background: #014639 !important;
    color: #ffffff !important;
  }

  /* contenu prend toute la largeur */
  .woocommerce-account .woocommerce-MyAccount-content{
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
  }
}



@media (max-width: 768px){

  .woocommerce-account .woocommerce-MyAccount-navigation a{
    padding: 11px 16px !important;   /* + d’air horizontal & vertical */
    font-size: 13.5px !important;
    line-height: 1.1 !important;

    border-radius: 999px !important;

    letter-spacing: 0.01em !important;
  }

  /* état actif encore plus “bouton principal” */
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{
    box-shadow: 0 4px 10px rgba(1,70,57,0.18);
  }
}


@media (max-width: 768px){

  body.woocommerce-account
  .woocommerce-MyAccount-navigation
  ul
  li
  a{
    padding: 12px 18px !important;  /* respiration premium */
    line-height: 1.15 !important;
    min-height: 3px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}


/* Fix mobile — page Voir abonnement : boutons Actions en pleine largeur */
@media (max-width: 768px){

  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce .subscription-actions .button,
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce .subscription-actions a.button,
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce td.subscription-actions .button,
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce td.subscription-actions a.button,
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce .subscription_details td.actions .button,
  body.woocommerce-account.woocommerce-view-subscription
  .woocommerce .subscription_details td.actions a.button{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 12px 16px !important; /* + confortable */
    white-space: normal !important; /* autorise retour à la ligne */
  }

  /* Optionnel : aligne la cellule actions proprement */
  body.woocommerce-account.woocommerce-view-subscription
  td.subscription-actions,
  body.woocommerce-account.woocommerce-view-subscription
  .subscription-actions{
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    align-items: stretch !important;
  }
}





/* =====================================================
   FIX MOBILE — VOIR ABONNEMENT : boutons Actions qui débordent
   ===================================================== */
@media (max-width: 768px){

  /* Empile les boutons proprement */
  body.woocommerce-account.woocommerce-view-subscription
  .subscription-actions,
  body.woocommerce-account.woocommerce-view-subscription
  td.subscription-actions{
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  /* Boutons : 100% largeur + wrap texte */
  body.woocommerce-account.woocommerce-view-subscription
  .subscription-actions a.button,
  body.woocommerce-account.woocommerce-view-subscription
  .subscription-actions .button,
  body.woocommerce-account.woocommerce-view-subscription
  td.subscription-actions a.button,
  body.woocommerce-account.woocommerce-view-subscription
  td.subscription-actions .button{
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;
    justify-content: center !important;
    text-align: center !important;

    white-space: normal !important;        /* autorise retour ligne */
    overflow-wrap: anywhere !important;    /* évite dépassement */
    word-break: break-word !important;

    padding: 12px 16px !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
  }
}



























/* =====================================================
   BCC — PAGE INSCRIPTION/CONNEXION : STRUCTURE PROPRE
   ===================================================== */

/* Centre + limite la largeur pour éviter l’effet “vide” */
body.woocommerce-account:not(.logged-in) #customer_login{
  max-width: 980px;
  margin: 0 auto;
  padding: 30px 18px 60px;
  box-sizing: border-box;
}

/* Desktop : 2 colonnes bien alignées + gap maîtrisé */
@media (min-width: 769px){
  body.woocommerce-account:not(.logged-in) #customer_login{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 46px;
    align-items: start;
  }

  /* On neutralise les floats Woo */
  body.woocommerce-account:not(.logged-in) #customer_login .u-column1,
  body.woocommerce-account:not(.logged-in) #customer_login .u-column2{
    float: none !important;
    width: auto !important;
    margin: 0 !important;
  }

  /* On donne aussi un “vrai bloc” à l’inscription sur desktop (comme mobile) */
  body.woocommerce-account:not(.logged-in) #customer_login .u-column2{
    padding: 34px 30px 36px !important;
    border-radius: 26px !important;
    background: #F9B1FF1A !important;
  }

  /* Connexion : plus sobre, mais cohérente */
  body.woocommerce-account:not(.logged-in) #customer_login .u-column1{
    padding: 10px 0 0 !important;
  }
}



/* =====================================================
   BCC — FORM UX (mobile-first)
   ===================================================== */

/* Champs full width + un peu plus hauts (tactile) */
body.woocommerce-account:not(.logged-in) #customer_login input.input-text{
  width: 100% !important;
  min-height: 46px;
}

/* BCC — champs "nombre" : petites cases (foyer / plats) */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 input[type="number"]{
  width: 72px !important;
  max-width: 72px !important;
  min-width: 72px !important;
  padding: 10px 10px !important;
  text-align: center !important;
}

/* Optionnel : si tu veux un rendu plus “case” */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 input[type="number"]{
  height: 46px !important;
  border-radius: 14px !important;
}


/* “Force” (password strength) : trop brut → petit badge */
body.woocommerce-account:not(.logged-in) #customer_login .woocommerce-password-strength{
  display: inline-block;
  margin-top: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: rgba(227,241,236,.85);
  color: #014639;
}

/* Sous-titre “Votre pré-inscription…” : resserrer et clarifier */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 h2{
  margin-bottom: 6px !important;
}

body.woocommerce-account:not(.logged-in) #customer_login .u-column2 p{
  margin-top: 0 !important;
}

/* Bouton inscription : full width sur mobile */
@media (max-width: 768px){
  body.woocommerce-account:not(.logged-in) #customer_login .u-column2 button,
  body.woocommerce-account:not(.logged-in) #customer_login .u-column2 input[type="submit"]{
    width: 100% !important;
  }
}







/* =========================================
   BCC — Bloc de rassurance inscription
   ========================================= */

body.woocommerce-account:not(.logged-in) .bcc-register-box{
  margin: 0 0 18px;
  padding: 16px 16px;
  border-radius: 18px;

  background: rgba(227,241,236,.95);
  border: 2px solid rgba(1,70,57,.18);
  box-shadow: 0 12px 28px rgba(1,70,57,0.12);
}

body.woocommerce-account:not(.logged-in) .bcc-register-box p{
  margin: 0 0 8px !important;
  line-height: 1.35;
  color: #014639;
}

body.woocommerce-account:not(.logged-in) .bcc-register-box p:last-child{
  margin-bottom: 0 !important;
}

/* Lien rose uniquement */
body.woocommerce-account:not(.logged-in) .bcc-register-box a{
  color: #F9B1FF !important;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.woocommerce-account:not(.logged-in) .bcc-register-box a:hover{
  opacity: .85;
}

/* Preuve sociale */
body.woocommerce-account:not(.logged-in) .bcc-social-proof{
  margin-top: 10px !important;
  font-size: 14px;
  opacity: .85;
}