/* ==========================================================================
   VARIABLES ASTRA
   ========================================================================== */
:root {
  --ast-global-color-0: #046bd2;
  --ast-global-color-1: #045cb4;
  --ast-global-color-2: #1e293b;
  --ast-global-color-3: #334155;
  --ast-global-color-4: #ffffff;
  --ast-global-color-5: #f0f5fa;
  --ast-global-color-6: #111111;
  --ast-global-color-7: #d1d5db;
  --ast-global-color-8: #111111;
  --ast-normal-container-width: 1200px;
}

/* ==========================================================================
   CONTENEUR PRINCIPAL DU HEADER
   ========================================================================== */
#masthead {
  position: fixed;
  top: 0;
  z-index: 9999;
  padding-left: 20px;
  padding-right: 20px;
  background-color: white;
  width: 100%;
}

/* Correctif : neutralise une règle scopée d'Astra qui casse le sticky */
.main-header-bar {
  position: static !important;
}

/* Bascule desktop / mobile */
@media (max-width: 921.9px) {
  #ast-desktop-header {
    display: none;
  }
}
@media (min-width: 922px) {
  #ast-mobile-header {
    display: none;
  }
}

/* ==========================================================================
   LOGO
   ========================================================================== */
.site-branding a {
  text-decoration: none !important;
}
.site-branding .ast-logo-svg-icon {
  display: inline-flex;
}
.site-branding .ast-logo-svg-icon svg {
  width: 90px;
}
.ast-logo-title-inline .ast-site-identity {
  gap: 0px;
}

@media (max-width: 921px) {
  .site-branding .ast-logo-svg-icon svg {
    width: 100px;
  }
}
@media (max-width: 544px) {
  .site-branding .ast-logo-svg-icon svg {
    width: 69px;
  }
}

/* ==========================================================================
   MENU PRINCIPAL — styles communs (desktop + mobile)
   ========================================================================== */
.main-header-menu > .menu-item {
  display: block;
}

.main-header-menu > .menu-item > .menu-link,
#astra-footer-menu > .menu-item > .menu-link {
  line-height: 50px;
  display: inline-block;
}

.main-header-menu > .menu-item > .menu-link .ast-icon.icon-arrow,
.main-header-menu > .menu-item > .menu-link .dropdown-menu-toggle {
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
}

.main-header-menu .current-menu-item > a {
  text-decoration: none !important;
}

.main-header-bar .main-header-bar-navigation .sub-menu {
  line-height: 1.45;
}

/* Couleurs des liens — desktop */
.ast-builder-menu-1 .menu-item > .menu-link {
  color: var(--ast-global-color-3);
}
.ast-builder-menu-1 .menu-item:hover > .menu-link,
.ast-builder-menu-1 .menu-item.current-menu-item > .menu-link {
  color: #9999ff;
}

/* Couleurs des liens — mobile */
.ast-builder-menu-mobile
  .main-navigation
  .main-header-menu
  .menu-item
  > .menu-link {
  color: var(--ast-global-color-3, #334155);
}
.ast-builder-menu-mobile
  .main-navigation
  .main-header-menu
  .menu-item:hover
  > .menu-link,
.ast-builder-menu-mobile
  .main-navigation
  .main-header-menu
  .menu-item.current-menu-item
  > .menu-link {
  color: #9999ff;
}

/* ==========================================================================
   SOUS-MENUS — styles communs
   ========================================================================== */
.sub-menu {
  display: none;
}
.menu-item.ast-submenu-expanded > .sub-menu {
  display: block !important;
}

.ast-builder-menu-1 .sub-menu {
  border-width: 0 !important;
  border-style: solid;
  border-color: #9999ff;
  border-top-width: 2px !important;
}

.ast-builder-menu-1 .sub-menu .menu-item,
.ast-builder-menu-1 .sub-menu .menu-link {
  border: none !important;
}

.ast-desktop .main-header-menu.ast-menu-shadow .sub-menu {
  box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   SOUS-MENUS — DESKTOP (survol)
   ========================================================================== */
@media (min-width: 922px) {
  .main-header-menu > .menu-item > a.menu-link,
  #astra-footer-menu > .menu-item > a.menu-link {
    line-height: 80px;
  }

  .main-header-menu > .menu-item-has-children > .sub-menu {
    display: none;
    opacity: 0;
    transition: opacity 0.2s ease;
  }
  .main-header-menu > .menu-item-has-children:hover > .sub-menu {
    display: block !important;
    opacity: 1;
  }

  .main-header-menu .menu-item.focus > .sub-menu,
  .main-header-menu .menu-item:hover > .sub-menu,
  .main-header-menu .menu-item > .sub-menu.toggled-on {
    left: 0;
    right: -22px !important;
    visibility: visible;
  }
}

/* ==========================================================================
   PANNEAU MOBILE — ouverture / fermeture
   ========================================================================== */
.ast-mobile-header-wrap .ast-mobile-header-content,
.ast-desktop-header-content {
  display: none;
  background-color: #ffffff;
}

.ast-main-header-nav-open.ast-header-break-point
  #ast-desktop-header
  .ast-desktop-header-content,
.ast-main-header-nav-open.ast-header-break-point
  .ast-mobile-header-wrap
  .ast-mobile-header-content {
  display: block;
}

.ast-desktop-header-content,
.ast-mobile-header-content {
  position: absolute;
  width: 100%;
  z-index: 99;
  left: 0;
  top: 100%;
}

.ast-mobile-header-content > *,
.ast-desktop-header-content > * {
  padding: 10px 0;
  height: auto;
}
.ast-mobile-header-content > *:first-child,
.ast-desktop-header-content > *:first-child {
  padding-top: 10px;
}
.ast-mobile-header-content > .ast-builder-menu,
.ast-desktop-header-content > .ast-builder-menu {
  padding-top: 0;
}

/* Icône hamburger ↔ croix */
.mobile-menu-toggle-icon .ast-close-svg {
  display: none;
}
body.ast-main-header-nav-open .mobile-menu-toggle-icon .ast-menu-svg {
  display: none;
}
body.ast-main-header-nav-open .mobile-menu-toggle-icon .ast-close-svg {
  display: inline-block;
}

[data-section="section-header-mobile-trigger"]
  .ast-button-wrap
  .ast-mobile-menu-trigger-minimal {
  color: #9999ff;
  border: none;
  background: transparent;
}
[data-section="section-header-mobile-trigger"]
  .ast-button-wrap
  .mobile-menu-toggle-icon
  .ast-mobile-svg {
  width: 20px;
  height: 20px;
  fill: #9999ff;
}

/* ==========================================================================
   MENU MOBILE — liste et accordéon des sous-catégories
   ========================================================================== */
@media (max-width: 921px) {
  .ast-builder-menu-mobile .main-navigation .main-header-menu {
    flex-direction: column !important;
    width: 100%;
  }
  .ast-builder-menu-mobile .main-navigation .main-header-menu > .menu-item {
    width: 100%;
  }

  .ast-builder-menu-mobile .sub-menu {
    position: static !important;
    width: 100% !important;
    margin: 0;
    padding-left: 20px;
    box-shadow: none;
    border: none !important;
    visibility: visible !important;
  }

  .ast-builder-menu-mobile .sub-menu .menu-item {
    display: block;
  }

  .ast-builder-menu-mobile .sub-menu .menu-link {
    line-height: normal;
    padding: 10px 0;
  }

  .submenu-with-border .sub-menu .menu-link {
    border-width: 0 !important;
  }

  /* Chevron ›  devant chaque sous-catégorie */
  .sub-menu .menu-link .ast-icon.icon-arrow {
    display: none;
  }
  .sub-menu .menu-link {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .sub-menu .menu-link::before {
    content: "› ";
    font-weight: bold;
    color: #9999ff;
  }
}