/* ===== Bannière Yapla : enlever l'overlay + garder le haut de l'image visible ===== */

/* Enlève le voile (overlay) qui assombrit l'image */
.mod-banner__img::before,
.mod-banner__img::after{
  content: none !important;
  display: none !important;
  background: transparent !important;
  opacity: 0 !important;
}

/* Au cas où un filtre/opacité est appliqué ailleurs */
.mod-banner__img{
  filter: none !important;
  opacity: 1 !important;
  background-position: top center !important;
  background-size: cover !important;
  height: 200px; /* Ajustez la hauteur selon vos besoins */
}


:root { 
--mobile-header-mod-header-part__right-height: auto; 
--mobile-hamburger-vertical-align: center; 
--mobile-hamburger-padding: 0; 
--mobile-modheader-height: auto; 
--mobile-topheader-ext-social-links: inherit;
}


/* BOUTON DE CONNEXION MOBILE (SÉCURITÉ) */
@media (max-width: 767px) {
  .header-ext-login {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* Force l'affichage global des boutons de connexion et d'adhésion */
.header-ext-login, 
.mod-header .btn, 
.mod-header a.btn,
.mod-header-part__right a,
.header-ext-login a {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}


/* ===== Effet de survol : Actif partout, sauf dans l'entête ===== */

/* Curseur "main" sur tous les liens au survol */
a:hover {
  cursor: pointer;
}

/* Réactivation globale de l'effet sur toutes vos tuiles et images du site */
a:hover img {
  filter: brightness(1.1) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,0.40) !important;
}

/* BLOCAGE ABSOLU : Si le lien est dans l'entête, on annule immédiatement l'effet pour préserver le logo */
header a:hover img, 
.mod-header a:hover img, 
.navbar-brand a:hover img, 
.mod-header-part__logo a:hover img,
[class*="header"] a:hover img {
  filter: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}


/* ===== NETTOYAGE EXCLUSIF DU LOGO (SANS TOUCHER AUX BOUTONS) ===== */

/* Cible uniquement le contenant direct du logo pour enlever le fond blanc */
.mod-header-part__logo, 
.navbar-brand,
a.mod-header-logo,
.mod-header-logo {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Assure la transparence du fond de l'image du logo elle-même */
.mod-header-part__logo img,
.navbar-brand img,
a.mod-header-logo img,
.mod-header-logo img {
  background: transparent !important;
  background-color: transparent !important;
}


/* ===== ESPACEMENT ENTRE LE LOGO ET LE MENU (ORDINATEUR UNIQUEMENT) ===== */
@media (min-width: 768px) {
  .mod-header-part__logo, 
  .navbar-brand,
  a.mod-header-logo {
    margin-right: 40px !important; /* Ajustez le '40px' pour augmenter ou diminuer l'espace */
  }
}


/* ===== AJUSTEMENT MOBILE SANS CHANGER L'ALIGNEMENT NATUREL ===== */
@media (max-width: 767px) {
  
  /* 1. On garde la structure en ligne (Logo à gauche, boutons à droite) */
  .mod-header .container, 
  .header-main-container,
  header .container {
    display: flex !important;
    flex-direction: row !important; 
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
  }

  /* 2. On restreint le logo et sa zone cliquable à gauche */
  .mod-header-logo,
  .mod-header-part__logo,
  .navbar-brand,
  a.mod-header-logo {
    width: 120px !important;      /* Largeur maximale de la zone cliquable */
    max-width: 120px !important;
    margin: 0 !important;         /* Annule le centrage forcé précédent */
    display: inline-block !important;
  }

  /* Taille de l'image du logo */
  .mod-header-logo img,
  .mod-header-part__logo img,
  .navbar-brand img,
  header img {
    width: 100% !important;
    max-width: 120px !important;
    height: auto !important;
    display: block !important;
  }

  /* 3. On pousse et affiche TOUS les boutons à droite */
    @media (max-width: 767px) {    
  .mod-header-part__right,
  .mod-header-wrapper,
  .header-ext-login,
  .mod-header-nav-right,
  [class*="header-part__right"],
  [class*="ext-login"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    flex-grow: 1 !important;      /* Prend tout l'espace disponible vers la droite */
    gap: 8px !important;          /* Espace entre vos boutons */
  }

  /* Ajustement final des boutons pour qu'ils ne débordent pas */
  .mod-header .btn, 
  .mod-header a.btn,
  .header-ext-login a {
    width: auto !important;
    display: inline-block !important;
    padding: 6px 10px !important;
    font-size: 12px !important;
  }
}

/* Espacement du bouton hamburger par rapport au bord (mobile uniquement) */
@media (max-width: 767px) {
  .navbar-default .navbar-toggle {
    margin-right: 15px !important;
    padding: 12px 15px !important;
  }
}