/* Conteneur de l'en-tête fixe */
.fixed-header-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1030;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Ajustement du padding-top pour le body, assurez-vous que la valeur est correcte pour la hauteur totale de votre header fixe */
body {
  padding-top: 90px; /* Adaptez cette valeur après avoir testé la hauteur finale du header */
}

/* Styles Top Bar Personnalisée */
.top-bar-custom {
  background-color: #512A16; /* Fond marron foncé */
  color: #F49F37; /* Texte orange */
  padding: 5px 0px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
}

.top-bar-custom .top-bar-text {
  margin-bottom: 0px;
  color: #F49F37;
  font-weight: bold;
}

/* Styles Header Principal */
.header-main-section {
  background-color: #fff;
  padding : 5px 0;
  display: flex;
  align-items: center;
}

.header-main-section .container {
  max-width: 1200px;
}

/* Styles pour le Logo */
.logo-wrapper {
  text-align: left;
  display: flex;
  align-items: center;
  height: 100%;
}

.logo-wrapper .logo {
  max-width: 200px !important; 
  min-width: 175px !important;
  padding: 0 25px;
  height: auto;
}

/* Styles pour le bouton Commander dans le header*/
.header-commander {
  background-color:#F49F37 !important;
  color : #512A16 !important;
}

.header-commander:hover {
  background-color:#F49F37 !important;
  color : #FFFFFF !important;
}

/* ---------------------------------------------------- */
/* NOUVELLES RÈGLES POUR LES ICÔNES DE L'EN-TÊTE */
/* ---------------------------------------------------- */

/* Conteneur des icônes à droite (recherche, menu, panier, compte) */
.header-icons-wrapper {
  display: flex;
  justify-content: flex-end; /* Aligne les icônes à droite */
  align-items: center; /* Centre verticalement les icônes */
  height: 100%; /* Important pour l'alignement vertical avec d-flex sur le parent */
}

/* Styles généraux pour toutes les icônes d'action dans l'en-tête */
.header-action-icon {
  margin-left: 15px; /* Espacement entre les icônes */
  font-size: 28px; /* Taille de base pour toutes les icônes Material Icons */
  color: #ff9100; /* Couleur orange des icônes */
  cursor: pointer;
  display: flex; /* Pour s'assurer que l'icône est bien centrée si elle a son propre contenu */
  align-items: center;
  justify-content: center;
}

/* Correction : La règle précédente ciblait .search, elle doit cibler l'icône générale ou la div parente */
.header-action-icon.search-icon .material-icons { /* Cible l'icône spécifique */
  font-size: 40px; /* Taille spécifique pour l'icône de recherche si différente */
  color: #ff9100; /* Orange */
}

/* Styles pour l'icône du menu burger */
.header-action-icon.menu-icon .material-icons {
  font-size: 40px; /* Taille pour le menu burger, ajustez si besoin */
  color: #ff9100; /* Orange */
}

/* Styles pour l'icône du panier */
.header-action-icon.cart-icon .material-icons {
  font-size: 40px; /* Taille pour le panier, ajustez si besoin */
  color: #ff9100; /* Orange */
}

/* Styles pour l'icône du compte utilisateur */
.header-action-icon.user-icon .material-icons {
  font-size: 40px; /* Taille pour l'utilisateur, ajustez si besoin */
  color: #ff9100; /* Orange */
}

/* ---------------------------------------------------- */
/* NOUVELLES RÈGLES POUR LES VOLETS LATÉRAUX (Overlay et Sidebars) */
/* ---------------------------------------------------- */

/* Overlay commun pour tous les volets (recherche et menu) */
.common-overlay { /* Renommé de .search-overlay */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 1040;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.common-overlay.is-visible {
  opacity: 1;
  visibility: visible;
}

/* Styles de base pour TOUS les volets latéraux (Search et Menu) */
.sidebar-base {
  position: fixed;
  top: 0;
  right: 0;
  width: 350px; /* Largeur du volet, ajustez si besoin */
  max-width: 90%; /* Pour mobile, pour ne pas déborder */
  height: 100%;
  background-color: #fff;
  z-index: 1050;
  box-shadow: -5px 0 15px rgba(0, 0, 0, 0.2);
  transform: translateX(100%); /* Masqué par défaut */
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
}

.sidebar-base.is-visible {
  transform: translateX(0); /* Visible */
}

/* Appliquer la classe de base aux volets spécifiques (si vous n'utilisez pas SCSS @extend) */
/* Si vous utilisez Sass/SCSS et @extend : vous pouvez supprimer ces blocs et utiliser @extend */
/* Sinon, si vous êtes en CSS pur, copiez les propriétés de .sidebar-base dans les deux règles ci-dessous */
.search-sidebar,
.menu-sidebar,
.user-sidebar,
.cart-sidebar {
  /* Copiez ici toutes les propriétés de .sidebar-base si vous ne faites pas de Sass */
  position: fixed;
  top: 0;
  right: 0;
  width: 350px;
  max-width: 90%;
  height: 100%;
  background-color: #fff;
  z-index: 1050;
  box-shadow: -5px 0 15px rgba(0, 0, 0, 0.2);
  transform: translateX(100%);
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
}

.search-sidebar.is-visible,
.menu-sidebar.is-visible,
.user-sidebar.is-visible,
.cart-sidebar.is-visible  {
  transform: translateX(0);
}


/* Entête commune des volets */
.sidebar-header {
  padding: 15px 20px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f8f8f8;
}

.search-sidebar-header,
.menu-sidebar-header, .user-sidebar-header, .cart-sidebar-header {
  /* Copiez ici toutes les propriétés de .sidebar-header si vous ne faites pas de Sass */
  padding: 15px 20px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f8f8f8;
}

/* Bouton de fermeture commun */
.sidebar-close {
  background: none;
  border: none;
  font-size: 30px;
  color: #666;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}

.search-sidebar-close,
.menu-sidebar-close,
.user-sidebar-close,
.cart-sidebar-close   {

  background: none;
  border: none;
  font-size: 30px;
  color: #666;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}


.search-sidebar-title, .cart-sidebar-title {
  margin: 0;
  font-size: 22px;
  color: #333;
}

.search-sidebar-content {
  padding: 20px;
  flex-grow: 1;
  overflow-y: auto;
}

.search-sidebar-content form {
  display: flex;
  border-radius: 4px;
  overflow: hidden;
}

/* Ajout d'une bordure au conteneur du formulaire de recherche */
.search-sidebar-content .search-widget form {
    border: 1px solid #ccc; /* Bordure pour le champ de recherche */
}


.search-sidebar-content input[type="text"] {
  flex-grow: 1;
  border: none;
  padding: 10px 15px;
  outline: none;
  font-size: 16px;
}

.search-sidebar-content input[type="text"]:focus {
  background-color: #f6f6f6 !important;
  box-shadow: none !important;
}

.search-sidebar-content button[type="submit"] {
  background-color: transparent;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
}

.search-sidebar-content button[type="submit"] .search {
  color: #F49F37;
  font-size: 20px;
}

/* ---------------------------------------------------- */
/* NOUVELLES RÈGLES POUR LE VOLET DU MENU  & USER LINKS */
/* ---------------------------------------------------- */

.menu-sidebar-logo, .user-sidebar-logo {
  padding-right: 15px;
}
.menu-sidebar-logo img, .user-sidebar-logo img  {
    max-height: 50px;
}

.menu-sidebar-content, .user-sidebar-content  {
  flex-grow: 1;
  overflow-y: auto;
  padding: 20px;
}



.menu-sidebar-content ul, .user-sidebar-content ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

.menu-sidebar-content li, .user-sidebar-content li {
  border-bottom: 1px solid #eee;
  color: #6d5b4a;
  text-transform: uppercase;
  position: relative;
}
.menu-sidebar-content li::after,.user-sidebar-content li::after {
    content: "\2304";
    font-size: 1em;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
}


.menu-sidebar-content li a, .user-sidebar-content li a {
  display: block;
  padding: 15px 0;
  color: #6d5b4a !important;
  font-size: 16px;
  text-decoration: none;
  font-weight: bold;
}

.menu-sidebar-content li a:hover ,.user-sidebar-content li a:hover{
  color: #ff9100 !important;
}

.menu-sidebar-content li .material-icons, .user-sidebar-content li .material-icons { /* Pour les chevrons du menu */
  float: right;
  font-size: 18px;
  color: #999;
}
.menu-sidebar-content .header-action-icon {
  margin-top:10px
}
.menu-sidebar-footer, .user-sidebar-footer {
  padding: 20px;
  border-top: 1px solid #eee;
  text-align: center;
}

.social-icons {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.social-icon {
  font-size: 24px;
  color: #ff9100;
  border: 1px solid #ff9100;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  text-decoration: none;
}

.social-icon:hover {
  /* background-color: #ff9100; */
  color: #000000 !important;
}

/*----------------------------------------------------*/
/* HOME CATEGORIES - affichage des catégories sur la page d'accueil
/*----------------------------------------------------*/


/* Styles généraux pour le titre de la section */
h2.CategoriesTitle {
    text-align: center; /* Centre le titre */
    margin-bottom: 30px; /* Espace sous le titre */
    font-size: 1.8em !important; /* Taille de police du titre */
    color: #ff9100 !important; /* Couleur de texte */
    text-transform: uppercase;
    font-weight: bolder!important;
}
/* Conteneur principal de la galerie de catégories */
.wraperCategories {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    padding: 0 px;
    margin: 0 auto;
}
/* Styles pour chaque bloc d'item de catégorie */
.itemCategorie {
    background-color: #fff; /* Fond blanc (visible si pas d'image ou image transparente) */
    border: 1px solid #ddd;
    border-radius: 8px;
    /* Suppression du padding ici, car le contenu est superposé sur l'image */
    text-align: center; /* Centre le contenu textuel à l'intérieur */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    overflow: hidden; /* Important pour que le contenu débordant ou les coins arrondis ne posent pas de problème */


    position: relative; /* Très important : permet le positionnement absolu des éléments internes */
    width: 100%; /* Défini par les media queries */
    /* height: 250px;  Hauteur fixe pour les blocs (ajustez selon vos images) */
    /* max-width: 300px; Max-width par défaut pour 2 colonnes ou mobile */
}

.itemCategorie:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

/* Style de l'espace réservé à l'image */
.itemCategorieImage {
    position: absolute; /* Prend toute la place dans .itemCategorie */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Pour que l'image ne dépasse pas les coins arrondis du parent */
}
/* Style de l'image réelle à l'intérieur de itemCategorieImage */
.itemCategorieImage img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* L'image couvre tout le conteneur, peut être rognée */
    display: block; /* Supprime l'espace sous l'image */
    transition: transform 0.3s ease; /* Zoom au survol */
}
.itemCategorie:hover .itemCategorieImage img {
    transform: scale(1.08); /* Léger zoom sur l'image au survol du bloc */
}

/* Overlay sombre semi-transparent sur l'image */
.itemCategorieImage::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1); /* Overlay sombre semi-transparent */
    transition: background 0.3s ease;
    z-index: 1; /* S'assure que l'overlay est au-dessus de l'image */
}

.itemCategorie:hover .itemCategorieImage::before {
    background: rgba(0, 0, 0, 0.4); /* Plus sombre au survol */
}

/* Styles pour le titre et le lien, superposés sur l'image */
.itemCategorieTitle,
.itemCategorieLink {
    position: absolute; /* Positionnement absolu par rapport à .itemCategorie */
    left: 50%; /* Centre horizontalement */
    transform: translateX(-50%); /* Ajustement pour un centrage parfait */
    z-index: 2; /* S'assure qu'ils sont au-dessus de l'overlay */
    width: 90%; /* Pour laisser de la marge sur les côtés */
}

.itemCategorieTitle {
    bottom: 80px; /* Positionne le titre au-dessus du bouton */
    font-size: 1.5em; /* Taille plus grande pour le titre */
    text-transform: uppercase;
    font-weight: bold;
    color: #fff; /* Texte blanc sur l'image */
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); /* Ombre légère pour la lisibilité */
}

/* Styles pour le bouton "découvrir" */
.itemCategorieLink {
    bottom: 20px; /* Positionne le bouton par rapport au bas du bloc */
}

.itemCategorieLink a {
    display: inline-block;
    background-color: transparent; /* Fond transparent par défaut */
    color: #f7931e; /* Texte blanc par défaut */
    padding: 10px 25px;
    border-radius: 8px;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    border: 2px solid #f7931e; /* Bordure blanche par défaut */
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.itemCategorieLink a:hover {
    background-color: #f7931e; /* Fond orange au survol */
    color: #fff; /* Texte blanc reste */
    border-color: #f7931e; /* Bordure orange au survol */
    transform: scale(1.05);
}


/* --- Media Queries pour le Responsive Design --- */

/* Sur les écrans mobiles (max-width: 767px) */
@media (max-width: 767px) {
    .itemCategorie {
        width: calc(100% - 30px); /* PREND TOUTE LA LARGEUR DISPONIBLE (100% - padding du wrapper) */
        height: 220px; /* Hauteur ajustée pour mobile */
    }

    .itemCategorieTitle {
        font-size: 1.3em;
        bottom: 70px; /* Position ajustée pour mobile */
    }

    .itemCategorieLink {
        bottom: 25px; /* Position ajustée pour mobile */
    }

    .itemCategorieLink a {
        padding: 8px 20px; /* Padding du bouton ajusté */
    }
}

/* Sur les écrans plus grands que les mobiles (tablettes, desktops) */
@media (min-width: 768px) {

    .itemCategorie {
        width: calc(24% - 10px); /* 10px est la moitié du gap de 20px */
        max-width: 400px; /* Limite la largeur de chaque item */
        height: 400px; /* Hauteur fixe pour les blocs */
    }
}

/* -----------------------------------------------------*/
/* Resulat de la recherche
/* ----------------------------------------------------*/

h2.page-maintitle {
  text-align: center!important;
  font-size:3.1vw !important ;
  text-transform: uppercase ;
}


/* -----------------------------------------------------*/
/* PAGE /content/8-nos-boulangeries
/* ----------------------------------------------------*/

.page-content.page-cms {

  padding: 0px;
}

h1.page-maintitle {

  display:none
}


#titrenosboulangeries {
font-size: 2.8vw !important;
color : #474747;
}
#soustitrenosboulangeries {

font-size: 3.1vw !important;

}

.Marcq-nosBoulangerie, .Lille-nosBoulangerie, .Hem-nosBoulangerie {gap:5%}

.info-toutesLesBoulangeries {
  text-align : left !important;
font-size: 0.8em !important;
}

.toutesLesBoulangeries p{
color : #512a16 !important;
text-align : left !important;
font-size: 0.8em !important;

}

.button_aller {
    display: inline-block;
    background-color: transparent; /* Fond transparent par défaut */
    color: #f7931e; /* Texte blanc par défaut */
    padding: 10px 25px;
    border-radius: 8px;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    border: 2px solid #f7931e; /* Bordure blanche par défaut */
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;

}
.button_aller:hover {
    background-color: #f7931e; /* Fond orange au survol */
    color: #fff; /* Texte blanc reste */
    border-color: #f7931e; /* Bordure orange au survol */
    transform: scale(1.05);
}

/* Sur les écrans mobiles (max-width: 767px) */
@media (max-width: 767px) {

#titrenosboulangeries {
font-size: 6vw !important;
}
#soustitrenosboulangeries {

font-size: 6.5vw !important;

}
}

/* -----------------------------------------------------*/
/* PAGE content/9-notre-entreprise
/* ----------------------------------------------------*/

#notreEntreprise {
font-size: 3.1vw !important;
color : #f7931e!important;
text-align:center!important;
text-transform: uppercase!important;

}

.imgPresentation-pageNotreEntreprise{
  margin :30px 0px
}


.section-pageNotreEntreprise {
margin-top : 20px;
padding : 0px !important

}
.nosPartenaires-pageNotreEntreprise {
margin-top : 40px;
padding : 10px 0px !important
}
.nosPartenaires-pageNotreEntreprise #liennospartenaires {
  margin-top:15px
}
  
.nosPartenaires-pageNotreEntreprise h1{

  text-align : center !important;
  text-transform: uppercase;
}

.carousel-nosPartenaires .owl-prev , .carousel-nosPartenaires .owl-next{

  height : 50px !important;
  width: 50px !important;

}


.carousel-nosPartenaires .owl-prev {text-indent: -5000px!important;}
.carousel-nosPartenaires .owl-next  {text-indent: +5000px!important;}


/* Sur les écrans mobiles (max-width: 767px) */
@media (max-width: 767px) {
  #notreEntreprise {
font-size : 6vw !important;
  }
}


/* -----------------------------------------------------*/
/* PAGE /nous-contacter
/* ----------------------------------------------------*/
#flexContact {
  padding-top : 30px
}

#flexForm {
  padding-top : 30px

}
/* Sur les écrans mobiles (max-width: 767px) */
@media (max-width: 767px) {
  .titreContact {
    width: auto !important;

  }
  div#flexTitreEtImage {
    margin-top: 0px!important;
  }
#flexContact {
    padding-top: 0px!important;
}  

section.contact-form{

width : 100% !important;
top: inherit !important;

}

div#flexForm{
  margin: 0px !important
}
section.contact-form .form-fields {
  margin:0px !important
}


}



/* ----------------------------------------------------*/
/* PAGES COMMANDER - Listing produit
/* ----------------------------------------------------*/

/*filtre et catégorie */
#search_filters_wrapper {
  display : inherit !important;
}

#search_filter_controls {display:none;}

#search_filters .facet .collapse.show {
  display: block !important;
}

/*bouton ajouter au panier*/

.quick-view.js-quick-view.btn, .modal-dialog .add-to-cart.btn  {
background-color: #F49F37 !important;
color : #512A16 !important;
}
.quick-view.js-quick-view.btn:hover, .modal-dialog .add-to-cart.btn:hover  {
background-color: #F49F37 !important;
color : #ffffff !important;
}




#js-product-list .product-miniature .thumbnail-container {
  margin-bottom: 0px!important;
}

#js-product-list-header .block-category {min-height: inherit !important;}
h1.produitsH1 {font-size: 1.9rem !important;text-align: center;}

h2.produitsH2 {font-size: 1.35rem !important;text-align: center;}



.product-description .qty-products {position : relative !important}

.product-miniature .highlighted-informations {top : inherit !important}

.modal-dialog {
    transform: translate(-50%, 0%) !important;
}

.quickview .modal-content .modal-body .right-block {
  position : relative !important;
  overflow-y : inherit !important;
}
.quickview .images-container {

  min-height: inherit !important;
}

.quickview .social-sharing {
  display:none !important
}

.quickview .compare {

  display :none !important
}

.quickview .product-quantity .qty {
  display:flex !important;
  align-items: center;
  width: 100%;
}
.quickview p.quantite { 
  margin : 0 20px 0 0;
  /* display:inline !important*/
  } 

.quickview .input-group.bootstrap-touchspin {display:inline !important}

.quickview .modal-content .modal-body h1.product_title.h1 {

  font-size: 1.5rem !important;
}

.product-prices {display:none !important} 

.quickview .product-variants-item {

  display: flex !important;
}

#js-product-list .qty-products {display :none !important}

#category .container {width: 100% !important;} 
/* #product .container {width: 100% !important;}  */

.product-thumbnail img.img_1 {z-index:500}
.wishlist-button-add {display:none !important}

#search_filters .facet .facet-label .custom-checkbox, #search_filters .facet .facet-label .custom-radio {
    top: 0px;
}
.product-miniature .product-container .product-title {
    white-space: break-spaces;
}

.product-miniature .highlighted-informations {

  position: relative ! important;
}
.product-title a {
    color: #512a16 !important;
    font-weight: bold !important;
        font-size: 15px !important;
}

.product-price-and-shipping .price {
    color: #512a16;
    font-weight: bold !important;
        font-size: 16px !important;
}
.quantite-products{
  color: #512a16;
    font-weight: bold;
    font-size: 16px;
}

#myBtnCommander {
    background-color: #f89a45;
    border-radius: 50px;
    color: white;
    text-decoration: none;
    text-align: center;
    border: none;
    font-size: 14px;
    margin-left: 30px;
    margin: 15px;
    padding: 5px;
    width: 100%;
    font-family: 'Biotif';
    text-transform: uppercase;
}
#myBtnCommander:hover {
    transform: scale(1.10) !important;
}

a.all-product-link.float-xs-left.float-md-right.h4 {
    color: white;
}

a.quick-view.js-quick-view.btn.btn-primary img {
    display: none;
}

.thumbnail-inner .highlighted-informations.no-variants {
    display: none;
}

#product-description-short .rte-content img {
    max-width: 50px;
}

a.nav-link.composition {
    display: none;
}

.tabs .tab-content {
    padding-top: 10px !important;
}



.product-variants>.product-variants-item+.product-variants-item {
    margin-top: 5px !important;
}

.product-variants>.product-variants-item {
    margin-top: 0px !important;
    margin-bottom: 5px;
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

.tab-pane p {
    font-weight: 100;
    font-size: 18px;
    margin-bottom: 10px;
}
.product-quantity .qty {
    display: flex;
    align-items: center;
}
.wishlist {
    display: none !important;
}
.tax-shipping-delivery-label {
    display: none !important;
}
.product-prices {
    font-family: 'Biotif';
    text-align: end;
    padding-right: 20px;
    color: #512a16 !important;
    margin: 30px 0 0;
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}
.product-price {
    color: #512a16;
    font-size: 30px;
}

.block-categories.block.top-categories {
    display: none;
}

h1.text-center {
    color: #512a16;
    font-size: 66px !important;
    font-weight: 100;
}

.imgproduitsale {
    width: 1300px;
}

.col.total-products.hidden-xs-down {
    display: none;
}

div#js-product-list-top {
    display: none;
}

#left-column .block,
#right-column .block {
    border: none;
}

#left-column .title_block,
#right-column .title_block {
    background: none;
    color: #512a16;
    font-family: 'Biotif';
    text-transform: none;
    font-size: 20px;
    margin: 0 !important;
    font-weight: bolder;
}

#search_filters .facet .facet-title {
    text-transform: none;
    margin-left: 5px;
}

.title {
    color: #512a16;
    background-color: #e8d1bf;
    text-align: left;
    margin-bottom: 10px;
}

div#search_filters {
    padding-left: 90px;
    padding-top: 20px;
    padding-right: 90px;
}

span.magnitude {
    display: none;
}

#search_filters .facet .collapse {
    display: none;
}

.add {
    text-align: end;
    padding-top: 0px;
    padding-right: 0px;
}

a._gray-darker.search-link.js-search-link {
    color: #512a16;
}




.products.grid.row.cols-xs-1.cols-sm-2.cols-md-3.cols-lg-3.cols-xl-3 {
    margin-right: 200px;
    margin-top: 45px;
}

.button-container {
    display: none;
}

.product-miniature .product-container {
    border: none;
    outline: none;
    box-shadow: none;
    background: none;
}
.product-desc {
    display: none;
}
.qty-products {
    display: flex;
    margin: 14px;
    gap: 20px;
    align-items: baseline;
}

.qty-products input {
    width: 50%;
    border: 1px solid #512a16;
    color: gray;
}
.qty-products .btn.btn-touchspin.js-touchspin.bootstrap-touchspin-up {
    display: none;
}

.qty-products .btn.btn-touchspin.js-touchspin.bootstrap-touchspin-down {
    display: none;
}

.qty-products .input-group.bootstrap-touchspin {
    width: 50%;
}

.qty-products .bootstrap-touchspin input.form-control {
    border: 1px solid #512a16;
    padding: 2px;
    font-size: 14px;
    font-family: sans-serif;
    color: gray !important;
}

/* -----------------------------------------------------*/
/* PAGE PRODUIT
/* ----------------------------------------------------*/

#product_comments_block_extra, #productsnav, .product-details-content,
 .product-information .social-sharing, .product-add-to-cart .compare,
  .product-actions .product-add-to-cart .control-label, .product-actions .blockreassurance_product {
    display: none !important;
}
.product-information .tabs {

  margin:0px !important;
  padding : 0px !important;
  border : inherit !important;
  background-color: inherit !important;
}
.product-information .tabs .nav-tabs {
  border: inherit !important;
}
.product-information .tabs .tab-content {
  margin:0px !important;
  padding : 0px !important;
}
.product-information .tabs .tab-pane {
   margin:0px !important;
  padding : 0px !important; 
}

.product-actions .control-label {

  display : inline !important
}

.product-actions .bootstrap-touchspin {

  display : flex!important;
}
.product-add-to-cart .qty .quantite {margin-bottom: 0px !important;margin-right : 10px!important}

/* colonne de gauche */

.left-block .product-cover .layer {

  position : relative !important;
  display: block!important;
  opacity: inherit !important;
}
.left-block .js-qv-mask.mask {

  display:none !important
}
#product #content {

  max-width: 100%!important;
}

.product-add-to-cart .product-quantity.clearfix {

  display: block !important;
}
.product-add-to-cart .product-quantity.clearfix .add {

  clear: both!important;
  float: none !important;
  display: block !important;
}
/* ajouter au panier*/

.product-add-to-cart {
margin:0px !important

}
.product-add-to-cart .add .add-to-cart.btn  {
background-color: #F49F37 !important;
color : #512A16 !important;
margin-top : 10px!important
}
.product-add-to-cart .add .add-to-cart.btn :hover  {
background-color: #F49F37 !important;
color : #ffffff !important;
}

.product-add-to-cart .add .add-to-cart.btn i {font-size : 25px!important}


.product-accessories.products_block.clearfix {
  clear: both;
  padding-top : 0px !important;
  margin-top : 0px !important
  
}

.productpage-heading.product_accessories {
  font-size: 30px!important;
}

/* -----------------------------------------------------*/
/* MODALE confirmation mise au panier
/* ----------------------------------------------------*/

#blockcart-modal .cart-content-btn {

  display: flex;
  justify-content : space-between;
  
}


#blockcart-modal .cart-content-btn a {

  display: block;
  padding: 8px 15px;
  font-weight: bold;


}

#blockcart-modal .cart-content-btn a  {
background-color: #F49F37 !important;
color : #512A16 !important;
}
#blockcart-modal .cart-content-btn a:hover  {
background-color: #F49F37 !important;
color : #ffffff !important;
}

#blockcart-modal .modal-text {
  border : 2px solid green !important;
  width : 100%!important;
  padding : 15px;
}
#blockcart-modal .modal-text .modal-title {

  color: green;
}
#blockcart-modal .cart-content-btn {

  margin : 8px 0px 0px 0px !important

}

/* -----------------------------------------------------*/
/* PANIER
/* ----------------------------------------------------*/


section#mainpanier h1.text-center.mt-5.titrePanier {

  font-size: 30px !important;
}

section#mainpanier .cart-grid-body {

  padding : 0px !important;
}

section#mainpanier .product-line-info.cart-product-name .label {
  font-size : 18px !important
}

.product-line-info.cart-product-price.product-price.h5 {

  display : none !important
}

section#mainpanier .product-line-grid-right.product-line-actions {

  padding : 0px !important;
  width : 100% !important;
}
section#mainpanier .product-line-grid-right.product-line-actions .col-4.hidden-md-up {
  display : none !important;
}


.product-line-grid-right .cart-line-product-actions {

  padding-left: inherit !important;
}
section#mainpanier .product-line-grid-right.product-line-actions .qty{

  padding-left: 30px !important;
}


section#mainpanier .blockcart.cart-preview {
  display : none !important
}

section#mainpanier .cart-detailed-totals .card-block {
padding : 0px !important
} 

section#mainpanier .blockreassurance_product {

  display : none;
}

/* --- Styles pour le volet Panier (ps_shoppingcart.tpl) --- */
.cart_block.block.exclusive.js-sidebar-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 350px;
  height: 100%;
  background-color: #fff;
  z-index: 1050;
  box-shadow: -5px 0 15px rgba(0, 0, 0, 0.2);
  transform: translateX(100%); 
  transition: transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  opacity: 0; 
  visibility: hidden;
}


.cart_block.block.exclusive.js-sidebar-panel.is-visible {
  transform: translateX(0); 
  opacity: 1; 
  visibility: visible; 
}

.js-sidebar-panel .block_content .cart-header {
  padding: 15px 20px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f8f8f8;
}


.cart_block .cart-body {

  padding : 10px;

}

.cart_block .cart-body .product {

  display:flex;
  align-items: center;
  margin-bottom : 8px

}
.cart_block .cart-body .product .cart-images {

  padding: 0 15px;
  max-width: 25%;

}

.cart_block .cart-body .product .cart-info {
     color: #888;
     font-size : 20px;
     text-align: left !important;
}
.cart_block .block_content .cart-body a {
    color: #888 !important;
}


.cart_block .block_content .cart-body .remove_link i {
  font-size: 20px;


}
/* Conteneur principal du volet du panier */
.cart_block.js-sidebar-panel {
    display: flex; /* Utilise flexbox pour organiser header, body et footer */
    flex-direction: column; /* Empile les éléments verticalement */
    height: 100%; /* Important pour que le flexbox fonctionne sur toute la hauteur du volet */
    padding: 0; /* Supprime le padding du conteneur principal si présent, le met sur les sous-éléments */
    position: relative; /* Nécessaire si le footer doit être position: absolute */
}

/* En-tête du volet du panier */
.cart-sidebar-header {
    padding: 20px; /* Espace autour du titre et de la croix */
    border-bottom: 1px solid #eee; /* Ligne de séparation */
    flex-shrink: 0; /* Empêche l'en-tête de rétrécir */
    display: flex; /* Pour aligner titre et croix */
    justify-content: space-between; /* Espace entre titre et croix */
    align-items: center; /* Centrage vertical */
}

/* Titre du panier */
.cart-sidebar-header .cart-sidebar-title {
  text-transform: uppercase; /* Met le titre en majuscules */
  font-size: 0.8em; /* Ajustez la taille si nécessaire */
  color: #333; /* Ou la couleur de votre texte */
  margin: 0; /* Supprime la marge par défaut des h3 */
}

/* Bouton de fermeture (la croix "X") */
.cart-sidebar-close {
  background: none; /* Supprime l'arrière-plan du bouton */
  border: none; /* Supprime la bordure */
  font-size: 0.8em; /* Taille de la croix */
  font-weight: bold; /* Pour rendre la X plus épaisse si c'est un caractère */
  color: #888; /* Couleur de la croix */
  cursor: pointer;
  padding: 0;
  line-height: 1; /* Aligner la croix */
}
.cart-sidebar-close:hover {
  color: #000; /* Couleur au survol */
}

/* Si vous avez conservé l'icône material-icons pour la croix */
.cart-sidebar-close .material-icons {
  font-size: 0.8em; /* Taille de l'icône Material Design */
  color: #888; /* Couleur de l'icône */
  line-height: 1;
}
.cart-sidebar-close .material-icons:hover {
  color: #000;
}


/* Corps du panier (liste des produits) */
.cart_block .block_content {
    flex-grow: 1; /* Permet au contenu de prendre tout l'espace disponible */
    overflow-y: auto; /* Permet le défilement si le contenu dépasse */
    -webkit-overflow-scrolling: touch; /* Améliore le défilement sur les mobiles */
}

.cart_block .cart-body {
  padding: 10px; /* Padding à l'intérieur du corps du panier */
}

.cart_block .cart-body .product {
  display: flex;
  align-items: center; /* Aligne les éléments enfants verticalement au centre */
  margin-bottom: 8px;
  border-bottom: 1px solid #eee; /* Ligne de séparation entre les produits */
  padding-bottom: 8px; /* Espace sous la ligne de produit */
  padding-top: 8px; /* Espace au-dessus de la ligne de produit */
}

.cart_block .cart-body .product .remove_link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 10px;
  width: 30px;
  flex-shrink: 0;
}

.cart_block .block_content .cart-body .remove_link i {
  font-size: 0.8em;
  color: #999;
}

.cart_block .block_content .cart-body .remove_link i:hover {
  color: #d9534f;
}


.cart_block .cart-body .product .cart-images {
  padding: 0 15px;
  max-width: 25%;
  flex-shrink: 0;
}

.cart_block .cart-body .product .cart-images img {
    display: block;
    max-width: 100%;
    height: auto;
}

.cart_block .cart-body .product .cart-info {
  color: #888;
  font-size: 15px;
  text-align: left !important;
  flex-grow: 1;
}

.cart_block .block_content .cart-body a {
  color: #888 !important;
}

.cart_block .cart-body .product .cart-info .product-name {
    font-size: 1em;
    margin-bottom: 5px;
}

.cart_block .cart-body .product .cart-info .product-name a {
    color: #333 !important;
    font-weight: bold;
    text-decoration: none;
}
.cart_block .cart-body .product .cart-info .product-name a:hover {
    text-decoration: underline;
}

.cart_block .cart-body .product .cart-info .price {
    font-size: 0.9em;
    font-weight: normal;
}
.cart_block .cart-body .product .cart-info .quantity-formated {
    font-size: 0.9em;
}

.cart_block .cart-body .product .cart-info .product-atributes {
    font-size: 0.85em;
    color: #555;
    margin-top: 5px;
}
.cart_block .cart-body .product .cart-info .product-atributes .atributes {
    margin-bottom: 2px;
}
.cart_block .cart-body .product .cart-info .product-atributes .key {
    font-weight: bold;
}

/* Pied de page du panier (Sous-total et boutons) */
.cart-footer {
    flex-shrink: 0; /* Empêche le pied de page de rétrécir */
    padding: 20px; /* Espace autour du contenu du footer */
    border-top: 1px solid #eee; /* Ligne de séparation */
    background-color: #fff; /* Assure un fond blanc si le volet est transparent */
    box-shadow: 0 -2px 5px rgba(0,0,0,0.05); /* Optionnel: petite ombre pour le faire ressortir */
    /* Si position: sticky ne marche pas, essayez position: absolute; bottom: 0; left: 0; right: 0; */
    position: sticky; /* ou absolute, voir explication */
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10; /* Pour s'assurer qu'il est au-dessus du contenu scrollable */
}

/* Sous-total */
.cart-footer .cart-prices .price.subtotal {
    font-size: 0.9em; /* Légèrement plus grand */
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    /* Supprime la border-top ici si elle est déjà sur .cart-footer */
    /* border-top: 1px solid #eee; */
    margin-top: 0; /* Supprime la marge supérieure */
    margin-bottom: 15px; /* Espace avant les boutons */
}
.cart-footer .cart-prices .price.subtotal .value {
    color: #f7931e; /* Couleur orange pour le total */
}

/* Conteneur des boutons */
.cart-footer .cart-buttons {
    display: flex;
    flex-direction: column; /* Empile les boutons verticalement */
    gap: 10px; /* Espace entre les boutons */
}

/* Bouton COMMANDER (Orange) */
.cart-footer .cart-buttons .checkout {
  background-color: #f7931e; /* Orange spécifique */
  border-color: #f7931e;
  color: #fff !important; /* Texte blanc */
  font-weight: bold;
  padding: 12px 20px; /* Un peu plus de padding pour des boutons plus grands */
  border-radius: 5px; /* Bords légèrement arrondis */
  transition: all 0.3s ease;
  width: 100%; /* S'assurer qu'il prend toute la largeur */
  text-align: center; /* Centrer le texte si c'est un lien */
  display: block; /* S'assurer que le lien se comporte comme un bloc pour le width:100% */
  text-decoration: none; /* Enlève le soulignement du lien */
}

.cart-footer .cart-buttons .checkout:hover {
  background-color: #e68400; /* Orange un peu plus foncé au survol */
  border-color: #e68400;
}

/* Bouton VOIR LE PANIER (Gris foncé) */
.cart-footer .cart-buttons .viewcart {
  background-color: #343a40; /* Gris foncé */
  border-color: #343a40;
  color: #fff !important; /* Texte blanc */
  font-weight: bold;
  padding: 12px 20px;
  border-radius: 5px;
  transition: all 0.3s ease;
  width: 100%; /* S'assurer qu'il prend toute la largeur */
  text-align: center;
  display: block;
  text-decoration: none;
}

.cart-footer .cart-buttons .viewcart:hover {
  background-color: #23272b; /* Gris encore plus foncé au survol */
  border-color: #23272b;
}

/* Styles pour le panier vide */
.cart_block_no_products {
    text-align: center;
    padding: 20px;
    color: #555;
}


/*----------------------------------------------------*/
/* CHECKOUT
/*----------------------------------------------------*/

#mainpanier .titrePanier {

  font-size : 40px !important;
  color : #512a16 !important;
  margin-top: 0px !important;
}

/* etapes */

#breadcrumbpdv {
 padding : 40px 0;
 /*font-family: "Manrope",sans-serif !important;*/

}
#identification, #panier2, #livraison, #paiement {

  font-family: inherit!important;
}
.breadcrumbpdv {

    display: flex;
    justify-content: space-between;
    list-style-type: none;
    font-size: 18px;
    color: #512a16;
    font-family: inherit!important;
}

#mainpanier #panier2 { font-weight: bolder;}

#mainpanier .ligne {
    display: flex;
    justify-content: space-around;
    width: 99%;
    height: 5px;
    align-items: center;
}

#mainpanier .rond {
    background-image: url(https://www.boulangeriemathieu.fr/img/cms/rond.svg);
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
}

#mainpanier .rond2, #mainpanier .rond3, #mainpanier .rond4 {

    background-image: url(https://www.boulangeriemathieu.fr/img/cms/rond2.svg);
}

#mainpanier .trait {
    background-image: url(https://www.boulangeriemathieu.fr/img/cms/trait-marron2.png);
    width: 31%;
    height: 53%;
}

#mainpanier a.continueShopping {
    color: #512a16;
    font-size: 18px;
    font-weight: bold;
}

#mainpanier .bootstrap-touchspin {

  display: flex!important;
}
ul.nav.nav-inline.m-y-2
 {
    display: none !important;
}

.step-title.h3 {
  font-size:15px!important
}


section#checkout-personal-information-step {
width : 100% !important

}

section#checkout-personal-information-step .custom-checkbox label {
  display: block;
}

section#checkout-personal-information-step .form-group label {

  white-space: inherit;
}

section#breadcrumbpdv ul {
  gap :0px !important;
}


section#breadcrumbpdv #panier2 {
    font-weight: 100;
}

section#breadcrumbpdv #identification {
    text-transform: capitalize;
}


section#breadcrumbpdv .ligne {
    display: flex;
    justify-content: space-around;
    width: 99%;
    height: 5px;
    align-items: center;
}
section#breadcrumbpdv .rond1, section#breadcrumbpdv .rond2, section#breadcrumbpdv .rond3,section#breadcrumbpdv .rond4   {
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
}
#checkout .blockreassurance_product {
  display : none
}

#checkout #cart-subtotal-shipping {
  display :none
}

section#checkout-addresses-step {

  width : 100%
}

#checkout-addresses-step section.form-fields{

  margin:0px;
}

#checkout-addresses-step .form-group label {
  white-space: inherit;
  display: inline;

}

section#checkout-delivery-step {

  width : 100%
}

section#checkout-payment-step {
  width : 100%;
  border: 1px solid #ebebeb;
}

section#checkout-payment-step .cacperiods{

  padding : 0px!important;
}

#availablehourscac {
  padding :0px!important;
}
/* ---------------------------------------------------- */
/* Styles Généraux et Responsives */
/* ---------------------------------------------------- */

/* Dans custom.css */
body.no-scroll {
  overflow: hidden;
}

/* Ajustements Responsives */
@media (max-width: 767px) {
  .header-main-section {
    padding: 15px 0;
  }
#js-checkout-summary{

  display:none
}
  .col-12 {
      flex: 0 0 100%;
      max-width: 100%;
  }

  .header-action-icon {
      font-size: 24px;
      margin: 0 10px;
  }


}

@media (min-width: 768px) {

    .header-action-icon.menu-icon {
        display: inline-block !important; /* Maintien le menu burger visible sur desktop selon votre maquette */
    }

}
@media (max-width: 767px) {
    
        body {
        padding-top: 165px; /* Adaptez cette valeur après avoir testé la hauteur finale du header */
    }
    
    .logo-wrapper .logo {
      padding :0px 5px 0px 0px;
    }

    .header-icons-wrapper {  
      justify-content: space-between; /*apres passage à la ligne alignement des icones d'action*/
      margin-top:8px
    }
    .header-action-icon.search-icon {
        /* Votre choix de masquage pour l'icône de recherche sur mobile si un champ de recherche fullscreen est préféré */
    }
}

/* --- Footer (Règles existantes, conservées pour le contexte) --- */
#footer {
    background-color: #f8f8f8;
    color: #6d5b4a;
    font-family: Arial, sans-serif;
    padding: 30px 0;
}

.footer-navigation li {
    font-size: 1.2em;
    color: #6d5b4a;
    text-align: center;
    border-bottom: 1px solid #e0e0e0;
    position: relative;
    cursor: pointer;
    font-weight: normal;
    text-transform: uppercase;
}

.footer-navigation li::after {
    content: "\2304";
    font-size: 1em;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
}

.footer-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
    width:100%;
}
.footer-navigation a {
    color: #8c786a;
    text-decoration: none;
    font-size: 0.95em;
    transition: color 0.3s ease;
    display: block;
    width: 100%;
    padding: 8px 0px;
}

.footer-navigation a:hover,
.footer-navigation a:focus,
.footer-navigation a:active {
    color: #F8A051;
}

.footer-navigation li:hover, .footer-navigation li:has(a:active) {
    background-color:#ffffff ;
}

.footer-bottom-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding-top: 15px;
    color: #8c786a;
    font-size: 0.9em;
}

.footer-credits,
.footer-legal,
.footer-sitemap {
    margin-bottom: 10px;
    width: 100%;
}

.footer-bottom-bar a {
    color: #8c786a;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-bottom-bar a:hover,
.footer-bottom-bar a:focus {
    color: #d4a373;
}

@media (min-width: 768px) {
    .footer-links {
        margin-bottom: 0;
        width: 25%;
        float: left;
        padding: 0 15px;
    }

    .footer-links h4 {
        text-align: left;
        border-bottom: none;
        padding-bottom: 0;
        cursor: default;
    }

    .footer-links h4::after {
        content: none;
    }

    .footer-links ul {
        display: block !important;
        text-align: left;
    }

    .footer-bottom-bar {
        justify-content: space-between;
        text-align: left;
    }

    .footer-credits,
    .footer-legal,
    .footer-sitemap {
        width: auto;
        margin-bottom: 0;
        flex-grow: 1;
    }

    .footer-legal {
        text-align: center;
    }

    .footer-sitemap {
        text-align: right;
    }
}

@media (min-width: 768px) {
    .footer-navigation .col-md-12 {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .footer-navigation .footer-links {
        flex: 1;
        min-width: 200px;
        max-width: 25%;
    }
}



/* ----------------------------------------------------*/
/* PAGE PLAN DU SITE
/* ----------------------------------------------------*/


.sitemap h2 {
  font-size : 2.2rem !important;
  font-weight: bolder;
}













/*
 *  Bootstrap TouchSpin - v3.1.1
 *  A mobile and touch friendly input spinner component for Bootstrap 3.
 *  http://www.virtuosoft.eu/code/bootstrap-touchspin/
 *
 *  Made by István Ujj-Mészáros
 *  Under Apache License v2.0 License
 */
.CalendarNoel{
	width :100%;
	height: 100vh;
}
.bootstrap-touchspin .input-group-btn-vertical{position:relative;white-space:nowrap;width:1%;vertical-align:middle;display:table-cell}.bootstrap-touchspin .input-group-btn-vertical>.btn{display:block;float:none;width:100%;max-width:100%;padding:8px 10px;margin-left:-1px;position:relative}.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-up{border-radius:0;border-top-right-radius:4px}.bootstrap-touchspin .input-group-btn-vertical .bootstrap-touchspin-down{margin-top:-2px;border-radius:0;border-bottom-right-radius:4px}.bootstrap-touchspin .input-group-btn-vertical i{position:absolute;top:3px;left:5px;font-size:9px;font-weight:400}
@charset "UTF-8";
@font-face {
  font-family: "Manrope";
  src: url(../css/895e092292d88717adaa347e532822ab.woff2) format("woff2"), /* Modern browsers */
  url(../css/83131b9daba3e9a7b2c7ae7e47d2d503.woff) format("woff"), /* Legacy browsers */
  url(../css/057cc3c927dc0b2e8dbb739a306bd3a3.otf) format("truetype"); /* Android, iOS */
  font-style: normal;
  font-weight: 800; }
@font-face {
  font-family: "Manrope";
  src: url(../css/dce0916af972e3040aa191f74b17dd46.woff2) format("woff2"),
  url(../css/de69cd9e672c81725abcde04ecf022ee.woff) format("woff"),
  url(../css/29acb3c63123183305b02ebc9844b2ef.otf) format("truetype");
  font-style: normal;
  font-weight: 700; }
@font-face {
  font-family: "Manrope";
  src: url(../css/250c120c3f8b2b0bb58ea27ee36153fc.woff2) format("woff2"),
  url(../css/c80d4fb11dcc2140b26007ce39cfa521.woff) format("woff"),
  url(../css/fd2d932b381003546821288ecde6e370.otf) format("truetype");
  font-style: normal;
  font-weight: 600; }
@font-face {
  font-family: "Manrope";
  src: url(../css/a7360927bb3673ed7814d6f607d122cb.woff2) format("woff2"),
  url(../css/a8af1233a958bd1e96edcad65791a0d3.woff) format("woff"),
  url(../css/40ef5dc59db6eeef16942fc6a0baa8de.otf) format("truetype");
  font-style: normal;
  font-weight: 500; }
@font-face {
  font-family: "Manrope";
  src: url(../css/52260854eea2d38939bf40e9e9687830.woff2) format("woff2"),
  url(../css/0f099f4e4d67aeb18ab6da291367a93f.woff) format("woff"),
  url(../css/56b65c6bec8f40445da4f7853f2553ec.otf) format("truetype");
  font-style: normal;
  font-weight: 400; }
@font-face {
  font-family: "Manrope";
  src: url(../css/57a1d494b0e76131f062c5c9c2d4960d.woff2) format("woff2"),
  url(../css/016d41b1da3f1f5aaa44a7e20baee117.woff) format("woff"),
  url(../css/4db1ea0d15010c761ee577d7c0f5a0a0.otf) format("truetype");
  font-style: normal;
  font-weight: 300; }
@font-face {
  font-family: "Manrope";
  src: url(../css/38fa559ad8e8cbaee0c7a2178d308df5.woff2) format("woff2"),
  url(../css/1e81f33d197ccdb39d4edce581ff50ec.woff) format("woff"),
  url(../css/64041bf784575b30a79fa31900c79cf6.otf) format("truetype");
  font-style: normal;
  font-weight: 200; }
body, html {
  font-family: "Manrope",sans-serif; }
*,*:before,*:after {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased; }



  /*carousel*/

  .carousel .carousel-inner {height : auto;}
/* --- CENTRAGE DE L'IMAGE DANS LE SLIDER --- */
#carousel .carousel-item figure {
    display: flex; /* Utilise flexbox pour le centrage */
    justify-content: center; /* Centre horizontalement l'image */
    align-items: center; /* Centre verticalement l'image */
    width: 100%; /* S'assure qu'il prend toute la largeur du slide */
    height: 100%; /* S'assure qu'il prend toute la hauteur du slide */
    margin: 0; /* Supprime les marges par défaut de figure */
}
#carousel .carousel-item figure img {
    object-fit: contain; /* S'assure que l'image est contenue et visible */
    max-width: 100%;
    max-height: 100%;
}

/* --- COULEUR DE FOND DU SLIDER LORSQUE L'IMAGE NE PREND PAS TOUTE LA LARGEUR --- */
#carousel .carousel-item {

    background-color: #512B16; /* Fond marron foncé */
    background-image: url('/img/cms/Home-Carousel/MotifBleHP.png');
    background-repeat: repeat-x;
     background-position: center center;
    
    overflow: hidden; /* S'assure que rien ne déborde visuellement */
}


/* --- Positionnement et Centrage du BOUTON DÉCOUVRIR --- */

/* Positionnement de la légende (figcaption) */
#carousel .carousel-item .caption {
    position: absolute; /* Reste absolu pour se superposer à l'image */
    bottom: 20px; /* Centre verticalement par rapport à l'image */
    left: 50%; /* Centre horizontalement par rapport à l'image */
    transform: translate(-50%); /* Ajustement pour un centrage parfait basé sur son propre centre */
    text-align: center; /* Centre le texte et les éléments inline/inline-block à l'intérieur */
    width: 100%; /* Prend toute la largeur pour le centrage horizontal */
    padding: 0 20px; /* Ajoute un padding pour ne pas coller aux bords */
    box-sizing: border-box; /* Inclut le padding dans la largeur */
}

/* Styles pour le wrapper du bouton, pour le centrage */
#carousel .carousel-item .caption .slide-button-wrapper {
    margin-top: 20px; /* Espace au-dessus du bouton par rapport au texte */
}


/* --- Styles du BOUTON DÉCOUVRIR (y compris le survol alpha) --- */
.slide-discover-button {
  background-color: transparent; /* Fond transparent */
  border: 2px solid #f7a900;    /* Bordure orange */
  color: #f7a900;               /* Texte orange */
  font-weight: bold;           /* Texte en gras */
  text-transform: uppercase;   /* Texte en majuscules */
  padding: 10px 25px;
  border-radius: 5px;
  transition: all 0.3s ease;   /* Transition douce pour le survol */
  position: relative; /* Nécessaire pour le pseudo-élément */
  z-index: 1; /* S'assure que le bouton est au-dessus du pseudo-élément */
  overflow: hidden; /* Cache le débordement du pseudo-élément initial */
}

/* Pseudo-élément pour le fond orange avec alpha au survol */
.slide-discover-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(247, 169, 0, 0.5); /* Orange avec alpha 0.5 */
    transform: translateY(100%); /* Caché en bas par défaut */
    transition: transform 0.3s ease;
    z-index: -1; /* Place le pseudo-élément derrière le texte du bouton */
}

.slide-discover-button:hover::before {
    transform: translateY(0); /* Révèle le fond orange au survol */
}

.slide-discover-button:hover,
.slide-discover-button:focus {
  /* Au survol, on garde le texte orange pour qu'il soit contrasté avec le fond orange (même alpha) */
  color: #FFFFFF; /* Texte marron foncé au survol (selon votre maquette où le texte devient marron) */
}

/* --- Styles pour les flèches de navigation du slider --- */
#carousel .carousel-control .material-icons {
    color: #FF9F3B; /* Couleur des flèches */
    font-size: 80px; /* Ajustez la taille si besoin */
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3); /* Ombre légère pour les rendre plus visibles */
}

/* Vous pouvez aussi ajuster les styles des conteneurs des flèches si besoin */
#carousel .carousel-control {
    width: 50px; /* Augmenter la largeur pour éviter que la flèche ne soit coupée */
    height: 100%; /* S'assure qu'il prend toute la hauteur du carrousel */
    display: flex; /* Utilise flexbox pour centrer l'icône */
    align-items: center; /* Centre verticalement l'icône dans le contrôle */
    justify-content: center; /* Centre horizontalement l'icône dans le contrôle */
    background: none; /* Supprime tout fond par défaut de Bootstrap */
    opacity: 0.8; /* Opacité légère par défaut */
    transition: background-color 0.3s ease, opacity 0.3s ease; /* Transition douce pour le survol */
}

/* S'assurer que les contrôles gauche et droit sont bien positionnés aux bords */
#carousel .carousel-control.left {
    left: 0;
}

#carousel .carousel-control.right {
    right: 0;
    left: auto; /* Annule la propriété 'left' si elle était définie */
}

/* Effet de survol pour les contrôles de la flèche */
#carousel .carousel-control:hover {
    opacity: 1; /* Pleine opacité au survol */
    background-color: rgba(255, 159, 59, 0.5); /* Fond orange (#FF9F3B avec 50% de transparence) */
}

/* Style de l'icône Material Design elle-même */
#carousel .carousel-control .material-icons {
    color: white; /* Couleur des flèches : BLANC */
    font-size: 40px; /* Taille des flèches, ajustez si besoin */
    text-shadow: 1px 1px 2px rgba(0,0,0,0.3); /* Petite ombre pour lisibilité */
}
/* --- RESPONSIVE : Ajustements pour mobile --- */
@media (max-width: 767px) {

    .carousel .carousel-item .caption {

      margin : 0px
    }
    .slide-discover-button {
        padding: 8px 15px; /* Padding plus petit sur mobile */
        font-size: 0.9em;
        margin : 0px
    }
}

/* page rejoignez-nous */

.custom-select-contrat-trigger, .custom-select-wrapper, .custom-select-magasin-trigger {
  text-align :left;
  line-height: inherit;
}

.pdv_candidate_item_description {
  text-align: left;
}

.pdv_candidate_item_text {
  text-align : left;
}