/*
 * Header mobile « une ligne » - lifting express (variante B validee par Audrey, 02/09/2026).
 * Les widgets vises portent des classes posees par docs/scripts-header/lifting-mobile-header.php :
 *   .hl-top (bandeau haut), .hl-langues (FR NL), .hl-don (bouton Don), .hl-burger (copie du nav-menu).
 * Zone A : toutes largeurs. Zone B : mobile uniquement (<= 767 px, breakpoint Elementor).
 * Le desktop et la tablette ne recoivent rien de la zone B.
 */

/* ---- Zone A : entrees de menu reservees au tiroir mobile (passe 2).
   Sans effet tant qu'aucun item de menu ne porte la classe. ---- */
.elementor-nav-menu--main .menu-mobile-only {
  display: none;
}

/* ---- Zone B : mobile uniquement ---- */
@media (max-width: 767px) {

  /* Logo : plus grand que la maquette (demande d'Audrey), largeur fluide */
  .elementor-location-header .hl-top #logosvg {
    display: block;
    width: clamp(110px, 40vw, 150px);
    height: auto;
  }
  .elementor-location-header .hl-top .elementor-widget-html .elementor-widget-container {
    line-height: 0;
  }

  /* Langues : deux pastilles FR | NL, la langue courante en actif */
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__nav {
    --cpel-switcher-space: 0px;
  }
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__list {
    display: flex;
    gap: 2px;
    margin: 0;
    padding: 2px;
    list-style: none;
    border-radius: 999px;
    background: rgba(20, 22, 28, 0.06);
  }
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__lang {
    margin: 0;
    padding: 0;
  }
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__lang a {
    display: block;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    text-decoration: none;
    color: #6c7382;
  }
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__lang--active a {
    background: #fff;
    color: #14161c;
    box-shadow: 0 1px 2px rgba(20, 22, 28, 0.12);
  }
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__code {
    padding: 0;
  }

  /* Don : pastille pleine compacte (couleurs heritees du bouton d'origine) */
  .elementor-location-header .hl-top .hl-don.elementor-widget .elementor-button {
    padding: 7px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  /* Burger : pas de marge parasite, le dropdown s'etire sur toute la largeur (reglage full_width) */
  .elementor-location-header .hl-top .hl-burger.elementor-widget .elementor-menu-toggle {
    margin: 0;
  }
}

/* Petits ecrans (iPhone SE et similaires) : on resserre pour rester sur une ligne */
@media (max-width: 360px) {
  .elementor-location-header .hl-top #logosvg {
    width: 104px;
  }
  .elementor-location-header .hl-top .hl-langues.elementor-widget .cpel-switcher__lang a {
    padding: 4px 7px;
  }
  .elementor-location-header .hl-top .hl-don.elementor-widget .elementor-button {
    padding: 7px 11px;
  }
}

/* ---- Zone B (suite) : burger rouge sur tous les etats, extras du tiroir ---- */
@media (max-width: 767px) {

  /* Burger : rouge de la maquette, y compris au toucher (focus/hover/actif) */
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle,
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle:hover,
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle:focus,
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle.elementor-active {
    color: #ff1500;
    background-color: transparent;
  }
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle svg,
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle:hover svg,
  .elementor-location-header .hl-top .hl-burger.elementor-widget div.elementor-menu-toggle:focus svg {
    fill: #ff1500;
  }

  /* Extras du tiroir (injectes par includes/header-mobile-extras.php) */
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--coeur {
    margin-top: 10px;
    padding-top: 14px;
    border-top: 1px solid #ececec;
  }
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--bouton a.hl-extra__lien,
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--bouton a.hl-extra__lien:hover,
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--bouton a.hl-extra__lien:focus,
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--bouton a.hl-extra__lien.highlighted {
    display: block;
    margin: 0 20px 10px;
    padding: 12px 18px;
    border-radius: 999px;
    background-color: var(--e-global-color-accent, #ff1500);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.04em;
    text-align: center;
    text-transform: uppercase;
  }
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--social {
    display: flex;
    justify-content: center;
    gap: 22px;
    padding: 12px 20px 22px;
  }
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--social a.hl-extra__social,
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--social a.hl-extra__social:hover,
  .elementor-location-header .hl-burger nav.elementor-nav-menu--dropdown .hl-extra--social a.hl-extra__social:focus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 50%;
    background-color: transparent;
    color: var(--e-global-color-accent, #ff1500);
    font-size: 30px;
    line-height: 1;
  }
}