/* 0. Hide duplicate hamburger text (content:'a') when menu open */
.mobile_menu_bar:before {
  content: none !important;
}

/* 1. White overlay — use the existing ::before on .mobile_nav.opened */
.et_mobile_nav_menu .mobile_nav.opened:before {
  visibility: hidden !important;
}

/* 2. Mobile nav container above overlay */
.mobile_nav.opened {
  z-index: 9999 !important;
}

/* 3. Mobile menu list above overlay */
.et_mobile_menu {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 10px 0 !important;
  z-index: 1 !important;
  min-width: 50vw !important;
  min-height: auto !important;
  box-shadow: none !important;
  border-top: none !important;
}

/* 4. Clean menu items — remove pill/button style */
.et_mobile_menu li a,
.et_mobile_menu li a.dipi-cta-button,
.et_mobile_menu li a.et_pb_button {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #333 !important;
  box-shadow: none !important;
  padding: 12px 24px !important;
  display: block !important;
  text-align: center !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
  min-width: 0 !important;
  width: 100% !important;
}

/* 5. "Besoin d'aide" CTA — keep distinct but smaller */
.et_mobile_menu li.dipi-cta-button-menu-item a.dipi-cta-button {
  background: #dc2626 !important;
  color: #fff !important;
  border-radius: 6px !important;
  padding: 10px 20px !important;
  margin: 5px 20px 10px !important;
  width: auto !important;
  font-size: 14px !important;
}

/* 6. Remove button icon/arrow */
.et_mobile_menu li a.dipi-cta-button:after,
.et_mobile_menu li a.et_pb_button:after {
  display: none !important;
}

/* 7. Hover state */
.et_mobile_menu li a:hover {
  background: #f5f5f5 !important;
  color: #dc2626 !important;
}

/* 8. Separator between items */
.et_mobile_menu li {
  border-bottom: 1px solid #eee !important;
}
.et_mobile_menu li:last-child {
  border-bottom: none !important;
}
.et_mobile_menu li.dipi-cta-button-menu-item {
  border-bottom: none !important;
}

/* 9. Submenu arrows */
.et_mobile_menu .et_mobile_menu_arrow:before {
  color: #333 !important;
}

header .et_mobile_menu:before {
  height: 2rem !important;
}

@media screen and (max-width: 980px) {
  body .et-l--header {
    height: auto !important;
    background: #ffffff !important;
  }
}

/* 10. Desktop header right column - align all items in a row */
#logos-adhesion {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

#logos-adhesion .et_pb_image {
  width: auto !important;
  max-width: 40px !important;
}

#logos-adhesion .et_pb_image img {
  width: 40px !important;
  height: 40px !important;
}

#logos-adhesion .et_pb_button_module_wrapper {
  width: auto !important;
}

@media screen and (max-width: 375px) and (min-width: 320px) {
  body.dipi-mobile-menu-fullscreen
    #main-header
    .mobile_nav.opened
    ul.et_mobile_menu,
  body.dipi-mobile-menu-fullscreen
    .et-l--header
    .et_mobile_nav_menu
    .mobile_nav.opened
    ul.et_mobile_menu {
    padding: 0 0.5rem 0 0.5rem !important;
    left: 2rem !important;
    min-width: 69vw !important;
  }
}

@media screen and (max-width: 425px) and (min-width: 375px) {
  body.dipi-mobile-menu-fullscreen
    #main-header
    .mobile_nav.opened
    ul.et_mobile_menu,
  body.dipi-mobile-menu-fullscreen
    .et-l--header
    .et_mobile_nav_menu
    .mobile_nav.opened
    ul.et_mobile_menu {
    padding: 0 0.5rem 0 0.5rem !important;
    left: 1.5rem !important;
    min-width: 69vw !important;
  }
}

@media screen and (max-width: 320px) {
  body.dipi-mobile-menu-fullscreen
    #main-header
    .mobile_nav.opened
    ul.et_mobile_menu,
  body.dipi-mobile-menu-fullscreen
    .et-l--header
    .et_mobile_nav_menu
    .mobile_nav.opened
    ul.et_mobile_menu {
    padding: 0 0.2rem 0 0.2rem !important;
    left: 2.5rem !important;
    min-width: 71vw !important;
  }
}
body.dipi-mobile-menu-fullscreen
  #main-header
  .mobile_nav.opened
  ul.et_mobile_menu,
body.dipi-mobile-menu-fullscreen
  .et-l--header
  .et_mobile_nav_menu
  .mobile_nav.opened
  ul.et_mobile_menu {
  background-color: #fff !important;
}

@media screen and (max-width: 320px) {
  body.dipi-mobile-menu-fullscreen
    #main-header
    .mobile_nav.opened
    ul.et_mobile_menu,
  body.dipi-mobile-menu-fullscreen
    .et-l--header
    .et_mobile_nav_menu
    .mobile_nav.opened
    ul.et_mobile_menu {
    padding: 0 0.2rem 0 0.2rem !important;
    left: 2.5rem !important;
    min-width: 71vw !important;
  }
}

@media screen and (max-width: 425px) and (min-width: 375px) {
  body.dipi-mobile-menu-fullscreen
    #main-header
    .mobile_nav.opened
    ul.et_mobile_menu,
  body.dipi-mobile-menu-fullscreen
    .et-l--header
    .et_mobile_nav_menu
    .mobile_nav.opened
    ul.et_mobile_menu {
    padding: 0 0.5rem 0 0.5rem !important;
    left: 1.5rem !important;
    min-width: 69vw !important;
  }
}

@media screen and (max-width: 768px) and (min-width: 425px) {
  body.dipi-mobile-menu-fullscreen
    #main-header
    .mobile_nav.opened
    ul.et_mobile_menu,
  body.dipi-mobile-menu-fullscreen
    .et-l--header
    .et_mobile_nav_menu
    .mobile_nav.opened
    ul.et_mobile_menu {
    padding: 0 0.5rem 0 0.5rem !important;
    left: 1.5rem !important;
    min-width: 64vw !important;
  }
}