/* ==========================================================================
   NAVIGATION — Header, menu principal, sous-menus
   Remplace le CSS header/footer du Customizer (supprime les !important)
   ========================================================================== */

/* --- Header -------------------------------------------------------------- */

header,
.site-header,
.main-header,
.eduvalt-header,
.header-area,
.header-wrapper,
#masthead,
.elementor-location-header,
.header-main {
  background: var(--clr-white) !important;
  box-shadow: var(--shadow-sm) !important;
  border-bottom: none !important;
  /* Ne pas forcer position: relative — Elementor gère sticky/fixed via JS */
}

/* Accent barre navy/gold en bas du header */
header::after,
.site-header::after,
.eduvalt-header::after,
.elementor-location-header::after,
#masthead::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(
    90deg,
    var(--clr-navy-800) 0%,
    var(--clr-navy-800) 68%,
    var(--clr-gold-700) 68%,
    var(--clr-gold-700) 100%
  ) !important;
}

/* --- Liens menu principal ------------------------------------------------ */

nav a,
.nav a,
.menu a,
.main-menu a,
.elementor-nav-menu a,
.eduvalt-menu a,
header nav ul li a,
#menu-main-menu li a {
  font-family: var(--font-sans) !important;
  font-size: var(--text-xs) !important;
  font-weight: var(--fw-bold) !important;
  color: var(--clr-navy-800) !important;
  padding: 12px 16px !important;
  text-transform: uppercase !important;
  letter-spacing: var(--tracking-wider) !important;
  transition:
    color var(--transition-base),
    background-color var(--transition-base) !important;
  border-radius: var(--radius-sm) !important;
  position: relative !important;
}

nav a:hover,
.elementor-nav-menu a:hover,
header nav ul li a:hover {
  background: var(--clr-navy-050) !important;
  color: var(--clr-navy-700) !important;
}

/* Indicateur page active */
.elementor-nav-menu > li.current-menu-item > a::after,
.elementor-nav-menu > li.current-menu-parent > a::after,
.elementor-nav-menu > li.current-menu-ancestor > a::after,
.current-menu-item > a::after,
.current-menu-parent > a::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--clr-gold-700) !important;
  border-radius: var(--radius-full) !important;
}

/* --- Flèche sous-menu ---------------------------------------------------- */

.elementor-nav-menu .sub-arrow {
  font-size: 10px !important;
  margin-left: 3px !important;
  opacity: 0.6 !important;
  transition: transform var(--transition-base) !important;
}

.elementor-nav-menu li:hover > a .sub-arrow {
  transform: rotate(180deg) !important;
  opacity: 1 !important;
}

/* --- Sous-menus déroulants ----------------------------------------------- */

.elementor-nav-menu ul.sub-menu,
.sub-menu,
.dropdown-menu,
.menu-item-has-children > ul {
  background: var(--clr-white) !important;
  border-top: 3px solid var(--clr-gold-700) !important;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg) !important;
  box-shadow: var(--shadow-xl) !important;
  padding: var(--space-2) !important;
  min-width: 240px !important;
  margin-top: 6px !important;
}

.elementor-nav-menu ul.sub-menu li a,
.sub-menu li a,
.dropdown-menu li a {
  font-size: var(--text-sm) !important;
  color: var(--clr-ink-mid) !important;
  padding: 10px 14px !important;
  border-radius: var(--radius-md) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: var(--fw-medium) !important;
  transition:
    background var(--transition-base),
    color var(--transition-base),
    padding-left var(--transition-base) !important;
}

.elementor-nav-menu ul.sub-menu li a:hover,
.sub-menu li a:hover {
  background: var(--clr-navy-050) !important;
  color: var(--clr-navy-800) !important;
  padding-left: 20px !important;
}

/* Puce dorée devant chaque item sous-menu */
.elementor-nav-menu ul.sub-menu li a::before,
.sub-menu li a::before,
.dropdown-menu li a::before {
  content: '›' !important;
  color: var(--clr-gold-700) !important;
  margin-right: var(--space-2) !important;
  font-size: 14px !important;
  font-weight: var(--fw-bold) !important;
  opacity: 0.7 !important;
  transition: opacity var(--transition-base) !important;
}

.elementor-nav-menu ul.sub-menu li a:hover::before,
.sub-menu li a:hover::before {
  opacity: 1 !important;
}

/* ==========================================================================
   BARRE DE MENU COLORISÉE — logo labo déplacé dans la barre d'affiliation
   Le menu principal devient une bande navy compacte, sans logo.
   ========================================================================== */

/* Le logo du labo vit désormais dans la barre d'affiliation : on le masque ici */
.tg-header__area .tgmenu__nav .logo { display: none !important; }

/* Fond teal FSJES + bande compacte (teal profond pour contraste AA du texte blanc) */
header .tg-header__area {
  background: #0b6e87 !important;   /* teal soutenu — texte blanc lisible (AA) */
  box-shadow: var(--shadow-sm) !important;
}

header .tg-header__area .tgmenu__nav {
  min-height: 0 !important;
  padding: 2px 0 !important;
  justify-content: center !important;   /* menu centré sans logo */
}

/* Libellés du menu (Accueil, Membres…) en BLANC — niveau 1 uniquement.
   Sélecteur à ID pour battre la règle globale #menu-main-menu li a. */
header .tg-header__area ul#menu-main-menu > li > a,
header .tg-header__area .tgmenu__navbar-wrap > ul > li > a,
header .tg-header__area .tgmenu__main-menu > ul > li > a {
  color: #fff !important;
}

header .tg-header__area ul#menu-main-menu > li > a:hover,
header .tg-header__area ul#menu-main-menu > li.current-menu-item > a,
header .tg-header__area ul#menu-main-menu > li.current-menu-parent > a,
header .tg-header__area .tgmenu__navbar-wrap > ul > li > a:hover,
header .tg-header__area .tgmenu__navbar-wrap > ul > li.active > a {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

/* Flèche des sous-menus de niveau 1 en blanc aussi */
header .tg-header__area .tgmenu__navbar-wrap > ul > li > a .sub-arrow,
header .tg-header__area ul#menu-main-menu > li > a i {
  color: #fff !important;
}

/* Icônes / boutons / toggler en clair pour rester lisibles sur navy */
header .tg-header__area .mobile-nav-toggler i,
header .tg-header__area .tgmenu__search button i,
header .tg-header__area .tgmenu__action .list-wrap > li > a {
  color: #fff !important;
}

/* Champ de recherche éventuel : contour discret sur fond navy */
header .tg-header__area .tgmenu__search-form input {
  color: #fff !important;
}
header .tg-header__area .tgmenu__search-form input::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* La bande dégradée navy/gold sous le header blanc n'a plus lieu d'être */
header::after,
.eduvalt-header::after,
#masthead::after { display: none !important; }
