/*
Theme Name: Globe-Theme 
Description: Theme enfant Divi Par Eco Web
Author: Matthias // Freddy Eco Web
Author URI: https://eco-web.fr
Template: Divi
Version: 2.0
*/

/* #region Menu */
/*replier le sous menu sur mobile*/
.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
#main-header .et_mobile_menu .menu-item-has-children > a {
    background-color: transparent;
    position: relative;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after, #main-header .et_mobile_menu .menu-item-has-children > a:after {
    text-align: center;
    speak: none;
    font-weight: 600;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    font-size: 18px;
    content: '+';
    top: 11px;
    right: 13px;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children.visible > a:after,
#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
    content: '-';
}

.et_pb_menu .et_mobile_menu ul.sub-menu,
#main-header .et_mobile_menu ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li ul.sub-menu {
    display: none !important;
    visibility: hidden !important;
    transition: all 1.5s ease-in-out;
}

.et_pb_menu .et_mobile_menu li.visible > ul.sub-menu,
#main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l #main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li.visible > ul.sub-menu {
    display: block !important;
    visibility: visible !important;
}

/* header PC */
@media (min-width: 980px) {

/* container header */
  #container_custom_header{
    padding: 0 !important;
    height: 70px !important;
    display: flex !important;
    align-items: center !important;
  }
    #custom_header{
      padding: 0 !important;
    }
    #custom_header > div{
      display: flex !important;
      align-items: center !important;
    }
  }
/* img logo header */
  #custom_logo_header{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    width: 44px !important;
    height: 44px !important;
  }


/* formulaire de recherche */
  #custom_form_header{
    margin: 0 !important;
    border: solid 0px transparent !important;
  }
    #custom_form_header > form{
      margin: 0 !important;
      height: 32px !important;
      border: solid 0px transparent !important;
      border-radius: 16px !important;
    }
      #custom_form_header > form > div{
        padding: 0 !important;
        border: solid 0px transparent !important;
      }

        #custom_form_header > form > div > label{
          padding: 0 !important;
        }
        #custom_form_header > form > div > input{
          padding: 0 !important;
          padding-left: 1em !important;
          font-family: 'Zain' !important;
          font-weight: 400 !important;
          font-size: 14px !important;
          margin-right: -4em !important;
          color: rgba(40, 51, 73, 1) !important;
        }
        #custom_form_header > form > div > .et_pb_searchsubmit{/* btn submit */
          padding: 0 !important;
          height: 32px !important;
          width: 32px !important;
          color: transparent !important;
          background-color: transparent !important;
          margin-right: 0 !important;
          background-image: url("https://globe-croqueuse-pepiniere.fr/wp-content/uploads/2025/10/loupe.webp");
          background-repeat: no-repeat;
          background-size: 18px;
          background-position-x: center;
          background-position-y: center;
        }


/* menu */
  #container_menu_header{
    margin-left: 3em !important;
  }
  #menu-principal{
    margin: 0 !important;
    padding: 0 !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    gap: 15px;
  }

  #menu-principal > li{
    background-color: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
  }
    #menu-principal > li > a{
      font-family: 'Zain' !important;
      font-weight: 400 !important;
      font-size: 16px !important;
      line-height: 100% !important;
      letter-spacing: 0% !important;
      vertical-align: middle !important;
      color: rgba(245, 245, 245, 1);
      margin: 0 !important;
      padding: 9px !important;
    }
  #menu-principal > li:hover{
    border-radius: 8px 8px 8px 0px !important;
    background-color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
  }
    #menu-principal > li > a:hover{
      color: rgba(25, 29, 36, 1) !important;
      margin: 0 !important;
      padding: 9px !important;
      text-decoration: unset !important;
    }

  .current_page_item{color: rgba(25, 29, 36, 1) !important;}
  
  .et_pb_menu__icon.et_pb_menu__cart-button {
    color: #FAFAFA;
    text-decoration: none;
  }

  .et_mobile_menu {
    color: #FAFAFA;
  }

  .et-db #et-boc .et-l .et-menu a {
    font-family: 'Zain' !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
    color: rgba(245, 245, 245, 1);
    margin: 0 !important;
    padding: 9px !important;
  }




/* Fin header PC */




/* header Mobile */
@media (max-width: 980px) {

/* formulaire de recherche */
  #custom_form_header{
    margin: 0 !important;
    border: solid 0px transparent !important;
  }
    #custom_form_header > form{
      margin: 0 !important;
      height: 32px !important;
      border: solid 0px transparent !important;
      border-radius: 16px !important;
    }
      #custom_form_header > form > div{
        padding: 0 !important;
        border: solid 0px transparent !important;
      }

        #custom_form_header > form > div > label{
          padding: 0 !important;
        }
        #custom_form_header > form > div > input{
          padding: 0 !important;
          padding-left: 1em !important;
          font-family: 'Zain' !important;
          font-weight: 400 !important;
          font-size: 14px !important;
          margin-right: -4em !important;
          color: rgba(40, 51, 73, 1) !important;
        }
        #custom_form_header > form > div > .et_pb_searchsubmit{/* btn submit */
          padding: 0 !important;
          height: 32px !important;
          width: 32px !important;
          color: transparent !important;
          background-color: transparent !important;
          margin-right: 0 !important;
          background-image: url("https://globe-croqueuse-pepiniere.fr/wp-content/uploads/2025/10/loupe.webp");
          background-repeat: no-repeat;
          background-size: 18px;
          background-position-x: center;
          background-position-y: center;
        }


  /* menu */
    #mobile_menu1 {
      width: fit-content !important;
      left: auto !important;
      right: 25px;
      box-shadow: inset 0px 0px 10px rgba(0,0,0,.2) !important;
      background-color: #ffffff !important;
      padding: 5px 10px 5px 10px;
      border-radius: 8px 0px 8px 8px !important;
      border: 0 !important;
    }
      #mobile_menu1 > li{
        border-radius: 8px 8px 8px 0px !important;
      }

        #mobile_menu1 > li > a {
          /*width: fit-content;*/
          color: rgba(25, 29, 36, 1) !important;
          padding: 10px !important;
          margin: 10px !important;
          white-space: pre;
          text-decoration: none;
        }
  .current_page_item{color: rgba(25, 29, 36, 1) !important;}



}




/*#endregion */

/*#region Variable */

/*declaration des variable*/

:root {
  /*  Mode clair (Globe Croqueuse) */
  --color-brand-primary: #283349;
  --color-brand-secondary: #fbcd47;
  --color-background: #fafafa;
  --color-text-primary: #191d24;
  --color-focus: #283349;
  --color-background-button:#283349;
  --color-error: #a1122a;
  --color-white: #ffffff;
  --color-black: #000000;
  --font-heading: "Zain", sans-serif;
  --font-body: "Bitter", serif;
  --font-handwritten: "Pecita", cursive;
  --font-button:"Inter";
  --font-size-base: 16px;
  --line-height-base: 1.5;
}

@media (prefers-color-scheme: dark) {
  :root {
    /*  Mode sombre  */
    --color-brand-primary:#283349;   /* Jaune devient accent */
    --color-brand-secondary: #fbcd47; /* Inversé pour contraste */
    --color-background: #283349;
    --color-background-button:#fafafa;
    --color-text-primary: #fafafa;
    --color-focus: #fbcd47;
    --color-error: #a1122a;
    --color-white: #000000;
    --color-black: #ffffff;
  }
}
    
/* Classes pour choix manuel du thème */
    .light-theme {
      --color-brand-secondary: #fbcd47;
      --color-brand-primary: #283349;
      --color-text-primary: #191d24;
      --color-background-button:#283349;
      --color-focus: #283349;
      --color-error: #a1122a;
      --color-white: #ffffff;
      --color-black: #000000;
      --color-background: #fafafa;
      

    }
    
    .dark-theme {
      --color-brand-secondary: #fbcd47;
      --color-brand-primary: #283349;
      --color-text-primary: #fafafa;
      --color-background-button:#fafafa;
      --color-focus: #fbcd47;
      --color-error: #a1122a;
      --color-white: #ffffff;
      --color-black: #000000;
      --color-background: #283349;

    }
    

@font-face {
    font-family: 'Zain';
    src: url('Fonts/Zain/Zain-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Zain';
    src: url('Fonts/Zain/Zain-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-ThinItalic.woff2') format('woff2');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-MediumItalic.woff2') format('woff2');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Thin.woff2') format('woff2');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-SemiBoldItalic.woff2') format('woff2');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-LightItalic.woff2') format('woff2');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Italic.woff2') format('woff2');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-ExtraLightItalic.woff2') format('woff2');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-ExtraBoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-BlackItalic.woff2') format('woff2');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-ExtraBold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-BoldItalic.woff2') format('woff2');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Bitter';
    src: url('Fonts/Bitter/Bitter-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Pecita';
    src: url('Fonts/Pecita/Pecita.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('Fonts/Inter/Inter_18pt-Medium.woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Material-symbol';
  src: url('Fonts/Material-Symbol/MaterialSymbolsOutlined-Regular.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/*#endregion */


  /* Reset de base */
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  
  /* Styles de base du document */
  html {
    font-size: var(--font-size-base);
    font-family: var(--font-body);
    line-height: var(--line-height-base);
    color: var(--color-text-primary);
    background-color: var(--color-brand-primary);
  }
  
  body {
    color: var(--color-text-primary) ;
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    line-height: var(--line-height-base);
    transition: background-color 0.3s, color 0.3s;
    margin: 0 auto;
  }
  
  /* Titres avec contraste suffisant et tailles fluides avec clamp() */
  h1, h2, h3, h4, h5, h6 {
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    line-height: 1.2;
    font-family: var(--font-heading) ;
    color: var(--color-text-primary);
  }
  
  h1 {
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    margin-top: 2rem;
  }
  
  h2 {
    font-size: clamp(1.5rem, 4vw, 2rem);
  }
  
  h3 {
    font-size: clamp(1.3rem, 3.5vw, 1.75rem);
  }
  
  h4 {
    font-size: clamp(1.2rem, 3vw, 1.5rem);
  }
  
  h5 {
    font-size: clamp(1.1rem, 2.5vw, 1.25rem);
  }
  
  h6 {
    font-size: clamp(1rem, 2vw, 1.1rem);
  }
  
  /* Paragraphes */
  p {
    font-family: var(--font-body);
    margin-bottom: 1rem;
    color: var(--color-text-primary) !important;
  }
  
  /* Listes */
  ul, ol {
    margin-bottom: 1rem;
    padding-left: 2rem;
  }
  
  li {
    margin-bottom: 0.5rem;
  }
  
  /* Liens avec états distincts et contraste suffisant */
  a {
    color: var(--color-link);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    transition: color 0.2s;
  }
  
  a:visited {
    color: var(--color-link-visited);
  }
  
  a:hover, a:active {
    text-decoration: underline;
    text-decoration-thickness: 0.125em;
    outline: none;
  }
  
  /* Focus visible pour l'accessibilité */
  :focus {
    outline: 3px solid var(--color-focus);
    outline-offset: 2px;
  }
  
  :focus:not(:focus-visible) {
    outline: none;
  }
  
  :focus-visible {
    outline: 3px solid var(--color-focus);
    outline-offset: 2px;
  }
  
  input:focus, 
  textarea:focus, 
  select:focus {
    border-color: var(--color-focus);
    outline: 3px solid var(--color-focus);
    outline-offset: 2px;
  }
  
  button {
    cursor: pointer;
  }
  
  button:hover {
    opacity: 0.9;
  }
  
  button:focus {
    outline: 3px solid var(--color-focus);
    outline-offset: 2px;
  }
  
  button:disabled {
    cursor: not-allowed;
    opacity: 0.6;
  }
  
  /* Accessibilité - Classes utilitaires */
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
  }
  
  .skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    padding: 8px;
    z-index: 100;
    background: var(--color-brand-primary);
    color: var(--color-link);
  }
  
  .skip-link:focus {
    top: 0;
  }
    


  /* Règles d'impression */
  @media print {
    body {
      background: #fff;
      color: #000;
      font-size: 12pt;
    }
    
    a {
      color: #000;
      text-decoration: underline;
    }
    
    a[href^="http"]:after {
      content: " (" attr(href) ")";
    }
}
/*/////FIn du CSS par defaut /*/

.et_pb_section{
    background-color: var(--color-background) !important;
}

div.et_pb_section.et_pb_section_0 {
    background-color: var(--color-background) !important;
    background-blend-mode: overlay !important;
}
.et-pb-arrow-next{
    color: var(--color-text-primary);
}
.et-pb-arrow-prev{
    color: var(--color-text-primary);
}
/*#region General */
.et_pb_button {
    all: unset !important;
    background-color: var(--color-background-button) !important;
    font-family: var(--font-button) !important;
    color: var(--color-background) !important;
    border-radius: 16px !important;
    text-decoration: none !important;
    font-size: 0.75rem !important;
    padding: 1rem 2rem 1rem 2rem !important;

}

.et_pb_button:hover {
    all: unset !important;
    background-color: var(--color-brand-secondary) !important;
    color: var(--color-brand-primary) !important;
    font-family: var(--font-button) !important;
    border-radius: 16px !important;
    text-decoration: none !important;
    font-size: 0.75rem !important;
    padding: 1rem 2rem 1rem 2rem !important;

}
.et_pb_button::after {
  display: none;
}

/*#region header */

#main-header{
    background-color: var(--color-brand-primary);
  }
#main-footer{
    background-color: var(--color-brand-primary);
  }

#top-menu a {
    color: var(--color-white) !important; /*var(--color-link);*/
}
#et_top_search{
    color: var(--color-white) !important; /*var(--color-link);*/

}
.mobile_menu_bar:before{
    color: var(--color-link);
}
.li.current-menu-item>a {
    color: var(--color-link-visited) !important;
}
.colonne-header{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.et_pb_searchform{

}
.et_pb_search{
  width: 50%;
}
.et_pb_searchsubmit {
    position: relative;
    color: transparent !important;
    width: 40px; /* Assurez-vous que le bouton a une largeur suffisante */
    height: 40px; /* Assurez-vous que le bouton a une hauteur suffisante */
}


.et_pb_searchsubmit::before {
    content: "X";
    color: red;
    display: block;
}

/* Pour le menu principal */
.et_pb_menu__menu .current_page_item > a {
    background-color: white;
    color: #283349 !important;
    padding: 5px;
    border-radius: 8px 8px 8px 0px;
}

li.page_item{
  padding: 5px;
  color: #ffffff;
}
li.cat-item{
  padding: 5px;
  color: #ffffff;
}

/*#endregion*/ 


/*#region Formulaire de contact */

.wpcf7 {
        max-width: 600px;
        margin: 2rem auto;
        padding: 2rem;
        background-color: var(--color-brand-secondary);
        border-radius: 15px;
        box-shadow: 0 4px 15px rgba(0, 40, 0, 0.1);
        }
    
.wpcf7 label {
    display: block;
    margin-bottom: 1.5rem;
    color: var(--color-text-primary);
    font-size: 1.1rem;
    font-weight: 500;
}

.wpcf7 input:not([type="submit"]),
.wpcf7 select,
.wpcf7 textarea {
    width: 100%;
    background-color: var(--color-brand-secondary);
    border-color: var(--color-border);
    color: var(--color-text-primary);
    padding: 12px;
    margin-top: 8px;
    border: 2px solid;
    border-radius: 8px;
    font-size: 1rem;
}
.wpcf7 textarea {
    height: 150px;
    resize: vertical;
}
/* Bouton Submit */
.wpcf7 input[type="submit"] {
    width: 100%;
    padding: 15px;
    background-color: var(--color-link);
    color: var(--color-brand-secondary);
    border: none;
    border-radius: 8px;
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* États interactifs */
.wpcf7 input:not([type="submit"]):focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
    border-color: var(--color-focus);
    outline: none;
    box-shadow: 0 0 0 3px rgba(138, 191, 125, 0.2);
}

.wpcf7 input[type="submit"]:hover {
    background-color: #3a5848 !important;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 40, 0, 0.2);
}



/* Responsive */
@media (max-width: 640px) {
    .wpcf7 {
        padding: 1.5rem;
        margin: 1rem;
    }
    
    .wpcf7 label {
        font-size: 1rem;
    }
}

/*#endregion */


.p_post_info {
  padding-top: 1em;
  padding-bottom: 1em;
}

/*#region footer */

ul.dis_cust_ul {
  list-style-type: none !important;
  padding: 0 !important;
  color: white !important;
  text-decoration:none !important;
}
li.dis_cust_ul a{
  list-style-type: none !important;
  padding: 0 !important;
  color: white !important;
  text-decoration:none !important;
}
.dis_cust_ul a{
  list-style-type: none !important;
  padding: 0 !important;
  color: white !important;
  text-decoration:none !important;
}
/*#endregion */


/*#region Woocommerce */
.eco-attribut-glob{
  background-color: var(--color-background);
  border-radius: 16px;
  box-shadow: 0px 2px 3px 0px #EFF1F1;
  margin-bottom: 0.5rem;
  width: fit-content;
  padding-right: 1rem;
  padding-left: 1rem;
  padding-top: 0.5rem;

}

.single_add_to_cart_button{
    background-color: var(--color-background-button) !important;
    font-family: var(--font-button) !important;
    color: var(--color-background) !important;
    border-radius: 16px !important;
    text-decoration: none !important;
    font-size: 0.75rem !important;
    padding: 0.5rem 2rem 0.5rem 2rem !important;

}

.single_add_to_cart_button:hover {
    background-color: var(--color-brand-secondary) !important;
    color: var(--color-brand-primary) !important;
    font-family: var(--font-button) !important;
    border-radius: 16px !important;
    text-decoration: none !important;
    font-size: 0.75rem !important;
    padding: 0.5rem 2rem 0.5rem 2rem !important;

}

.single_add_to_cart_button::after {
  display: none !important;
}
.woocommerce-Price-amount{
  font-family: 'zain';
  font-size: 2rem;
}
.custom-product-tags-price{
    display: flex;
    justify-content: space-between;
}
.product-tag {
  font-size: 1rem;
}

.qty-btn_cust_btn {
  height: 26px;
  width: 26px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  border: 0 !important;
  background: var(--color-background) !important;
  color: var(--color-text-primary) !important;
  cursor: pointer !important;
}
.quantity > .input-text, .quantity > .qty, .quantity > .text {
  padding: 0 !important;
  height: 26px;
  font-weight: 400 !important;
  font-size: 18px !important;
  letter-spacing: 0% !important;
  text-align: center !important;
  color: var(--color-text-primary) !important;
  background: var(--color-background)!important;
    }
  input.qty {
    width: 2rem !important;
  }
.quantity > .input-text, .quantity > .qty, .quantity > .text {
  -moz-appearance: textfield !important;
}
.quantity > .qty::-webkit-outer-spin-button,
.quantity > .input-text::-webkit-outer-spin-button,
.quantity > .input-text::-webkit-inner-spin-button,
.quantity > .qty::-webkit-inner-spin-button,
.quantity > .text::-webkit-outer-spin-button,
.quantity > .text::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}
.quantity {
  display:flex !important;
  align-items: center;
  border: 1px solid #CAD0D9;
  border-radius: 8px;
  justify-content: start !important;
  margin: 0px !important;
  max-width: fit-content !important;
}
.minus_cust_btn::after {
  display: flex;
  align-items: center;
  height: 2rem;
  right: -14px !important;
  font-size: 1rem !important;
  font-family:Material-symbol;
  content: "remove";
  padding: 1em !important;
}
.plus_cust_btn::after {
  display: flex;
  align-items: center;
  height: 2rem;
  left: -14px !important;
  font-size: 1rem;
  font-family:"Material-symbol";
  content: "add_2";
  padding: 1em !important;
}
.cart{
     display:flex
}

.woocommerce-product-gallery{
    box-shadow: 0px 8px 16px 0px #2C333540;
    background-color: white;
    padding: 2rem;
    margin-top: 2rem;

}
.produits-suggeres {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  margin: 20px 0;
}

.produit-suggere {
  width: 210px;
  padding: 1rem;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  transition: transform 0.2s ease;
}

.produit-suggere:hover {
  transform: translateY(-4px);
}

.produit-suggere a {
  color: inherit;
  text-decoration: none;
  display: block;
}

.produit-image {
  position: relative;
  width: 180px;
  height: 180px;
  overflow: hidden;
}

.produit-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.bouton-plus {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: #EEF1F6BF;
  color: #333D4C;
  border-radius: 50%;
  font-size: 1.1rem;
  font-weight: bold;
  width: 2rem;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
  box-shadow: 0 0 3px rgba(0,0,0,0.1);
  pointer-events: none;
}

.produit-info {
  padding: 10px;
  text-align: left;
}

.produit-titre {
  font-size: 1rem;
  font-weight: 600;
  margin: 10px 0 5px;
}

.produit-prix .woocommerce-Price-amount {
  font-weight: bold;
  color: #444;
  margin: 0 0 5px;
  font-size: 1rem;
}

.produit-desc {
  font-size: 0.9em;
  color: #666;
  margin: 0;
}

.et_pb_post{
  background-color: var(--color-background) !important;
  color: var(--color-text-primary) !important;
}
/*#endregion */

/*#region Panier */

.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link {
      background-color: var(--color-background-button) !important;
    font-family: var(--font-button) !important;
    color: var(--color-background) !important;
    border-radius: 16px !important;
    text-decoration: none !important;
    font-size: 0.75rem !important;
    padding: 0.5rem 2rem 0.5rem 2rem !important;
}
.wc-block-grid__product-title {
    color: var(--color-text-primary) !important;
    text-decoration: none;

}
/*endregion */

/*#region Blogs*/
.post-content-inner{
  color: var(--color-text-primary);
}
.author{
  color: var(--color-text-primary);

}