/*! LADJ — habillage du menu OceanWP
 *
 *  Fichier SÉPARÉ de ladj-ui.min.css, volontairement : la bibliothèque
 *  ne cible que l'intérieur de .ladj, l'en-tête appartient au thème.
 *  À charger APRÈS ladj-ui.min.css.
 *
 *  En-tête ciblé : minimal-header center-menu center-logo.
 */

/* ─── Barre principale ─────────────────────────────────────────────── */
#site-header,
#site-header.minimal-header,
#site-header.is-sticky,
#site-header #site-header-inner{
  background:#007EAF !important;      /* bleu foncé de la charte */
  border-bottom:0;
}

/* Le thème pose un fond distinct derrière le logo, d'où le rectangle
   plus clair. On le rend transparent pour retrouver une barre unie. */
#site-header #site-logo,
#site-header .logo-container,
#site-header #site-logo-inner,
#site-header .site-branding{background:transparent !important}

/* ─── Entrées de premier niveau ────────────────────────────────────────
   OceanWP donne aux liens la hauteur entière de l'en-tête. On garde ce
   comportement pour la zone cliquable, mais on remet un fond neutre :
   les pastilles bleues visibles venaient du survol du thème. */
#site-header .main-menu > li > a,
#site-header .dropdown-menu > li > a{
  background:transparent !important;
  color:#FFF !important;
  font-family:'Poppins',system-ui,-apple-system,sans-serif !important;
  font-weight:600 !important;
  font-size:15px !important;
  letter-spacing:0;
  text-transform:none !important;
}

/* Survol et page courante : un filet orange sous le libellé, plutôt
   qu'un aplat qui découpe la barre en rectangles de couleurs. */
#site-header .main-menu > li > a::before,
#site-header .main-menu > li > a::after{display:none !important}

#site-header .main-menu > li > a > span.text-wrap,
#site-header .main-menu > li > a{position:relative}

#site-header .main-menu > li > a:hover,
#site-header .main-menu > li:hover > a,
#site-header .main-menu > li.current-menu-item > a,
#site-header .main-menu > li.current-menu-ancestor > a{
  color:#FFD84D !important;
  background:transparent !important;
}

/* ─── Sous-menus ───────────────────────────────────────────────────── */
#site-header .sub-menu{
  background:#FFF !important;
  border:1px solid #E6E3DE !important;
  border-radius:14px !important;
  box-shadow:0 12px 30px rgb(0 0 0 / .18) !important;
  padding:6px !important;
  min-width:240px;
}
#site-header .sub-menu li{border:0 !important}
#site-header .sub-menu li a{
  background:transparent !important;
  color:#1B1B1B !important;
  font-family:'Poppins',system-ui,-apple-system,sans-serif !important;
  font-weight:500 !important;
  font-size:15px !important;
  line-height:1.35 !important;
  padding:10px 12px !important;
  border-radius:8px !important;
  border-bottom:0 !important;
  white-space:nowrap;
}
#site-header .sub-menu li a:hover,
#site-header .sub-menu li a:focus-visible,
#site-header .sub-menu li.current-menu-item a{
  background:#F6F4F1 !important;
  color:#CC4B27 !important;
}

/* ─── Le bouton d'inscription ──────────────────────────────────────────
   Ajouter la classe ladj-cta sur cette entrée :
   Apparence > Menus > Options de l'écran > cocher « Classes CSS ».

   Le lien ne doit PAS prendre la hauteur de l'en-tête, sinon l'arrondi
   de 999 px en fait un ovale. On le recentre verticalement et on lui
   redonne sa hauteur naturelle. */
/* Le lien garde la hauteur entière que lui donne le thème : c'est ce
   qui le centre verticalement. La pastille est portée par le <span>
   intérieur, qui lui a sa hauteur propre. Lutter contre la hauteur du
   lien le faisait déborder hors de la barre. */
#site-header .main-menu > li.ladj-cta > a{
  background:transparent !important;
  padding:0 10px !important;
}
#site-header .main-menu > li.ladj-cta > a .text-wrap,
#site-header .main-menu > li.ladj-cta > a > span{
  display:inline-block;
  background:#FF5E31;
  color:#1B1B1B;
  padding:11px 22px;
  border-radius:999px;
  font-weight:800;
  line-height:1.2;
}
/* Repli si le thème n'enveloppe pas le libellé dans un span */
#site-header .main-menu > li.ladj-cta > a:not(:has(span)){
  background:#FF5E31 !important;
  color:#1B1B1B !important;
  border-radius:999px !important;
  padding:11px 22px !important;
  line-height:1.2 !important;
  height:auto !important;
  align-self:center;
}
#site-header .main-menu > li.ladj-cta > a:hover .text-wrap,
#site-header .main-menu > li.ladj-cta > a:hover > span,
#site-header .main-menu > li.ladj-cta > a:focus-visible .text-wrap{
  background:#FFF;
  color:#CC4B27;
}

/* ─── Icône du menu mobile ─────────────────────────────────────────── */
.oceanwp-mobile-menu-icon a.mobile-menu{color:#FFF !important}
.oceanwp-mobile-menu-icon a.mobile-menu:hover{color:#FFD84D !important}

/* ─── Panneau mobile Sidr ──────────────────────────────────────────────
   Sidr recopie le menu dans un autre bloc et préfixe les classes par
   « sidr-class- » : les règles du dessus ne l'atteignent pas. */
#sidr{background:#007EAF}
#sidr a{
  color:#FFF;
  font-family:'Poppins',system-ui,-apple-system,sans-serif;
  font-weight:600;
  border-bottom:1px solid rgb(255 255 255 / .14);
}
#sidr a:hover,#sidr a:focus-visible{background:rgb(255 255 255 / .14);color:#FFD84D}
#sidr .sidr-class-sub-menu a{
  font-weight:500;font-size:.94em;padding-left:26px;
  color:rgb(255 255 255 / .85);
}
#sidr li.sidr-class-ladj-cta > a{
  background:#FF5E31;color:#1B1B1B;font-weight:800;border-bottom:0;
}

/* Le bouton de fermeture du panneau : blanc sur blanc par défaut, donc
   invisible tant qu'on ne le survole pas. */
#sidr .sidr-class-sidr-button-close,
#sidr .sidr-class-mobile-menu-close,
#sidr a.sidr-class-toggle-sidr-close,
#sidr #sidr-close,
#sidr .sidr-class-dropdown-menu-close{
  color:#FFF !important;
  background:rgb(255 255 255 / .14) !important;
  border-radius:8px;
  padding:10px 14px;
  font-weight:700;
}
#sidr .sidr-class-sidr-button-close:hover,
#sidr a.sidr-class-toggle-sidr-close:hover,
#sidr #sidr-close:hover{
  background:#FF5E31 !important;
  color:#1B1B1B !important;
}
#sidr .sidr-class-sidr-button-close i,
#sidr #sidr-close i{color:inherit !important}

/* Les flèches de dépliage des sous-menus : grises sur bleu, donc
   illisibles. On les passe en blanc, avec une zone tactile correcte. */
#sidr .sidr-class-dropdown-toggle,
#sidr .sidr-class-sidr-class-dropdown-toggle,
#sidr .sidr-class-menu-item-has-children > a .sidr-class-dropdown-toggle,
#sidr span.sidr-class-dropdown-toggle{
  color:#FFF !important;
  opacity:1 !important;
  min-width:44px;min-height:44px;
  display:inline-flex !important;align-items:center;justify-content:center;
}
#sidr .sidr-class-dropdown-toggle i,
#sidr .sidr-class-dropdown-toggle svg{color:#FFF !important;fill:#FFF !important;opacity:1 !important}
#sidr .sidr-class-dropdown-toggle:hover{background:rgb(255 255 255 / .16) !important;border-radius:6px}

/* ─── Barre collante ───────────────────────────────────────────────────
   À N'ACTIVER QUE SI OceanWP ne propose pas l'en-tête collant dans le
   Personnalisateur. Deux mécanismes superposés produisent des sauts au
   défilement.

   Pour activer : retirer les deux lignes de commentaire ci-dessous.

   Piège fréquent : position:sticky ne fonctionne pas si un parent porte
   overflow-x:hidden. Si la barre ne colle pas malgré ces règles, cherche
   cette propriété sur #outer-wrap ou #wrap et neutralise-la. */

#site-header{
  position:sticky;
  top:0;
  z-index:999;
}
/* Connecté à l'administration, la barre WordPress occupe le haut. */
.admin-bar #site-header{top:32px}
@media screen and (max-width:782px){
  .admin-bar #site-header{top:46px}
}
/* Le parent ne doit pas rogner le collant. */
#outer-wrap,#wrap,#main{overflow:visible !important}

/* ─── Ancres ───────────────────────────────────────────────────────────
   Une ancre ne doit pas atterrir sous la barre collante. */
.ladj [id]{scroll-margin-top:120px}
