/* =========================================================
   apple.css — Fix iPhone/iPad Safari (WebKit touch)
   Objectif : empêcher les contrôles (Leaflet/agenda/recherche)
   de passer sous le header quand on manipule la carte sur iOS.
   ⚠️ Ne s’applique PAS à Safari Mac (desktop), pour éviter de
   déplacer la barre de recherche sur PC.
   ========================================================= */

@supports (-webkit-touch-callout: none) {

  :root{
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
  }

  /* 1) Empêche le scroll/bounce de page qui fait “glisser” la carte sous le header */
  html, body{
    height: 100%;
    overflow: hidden;
    overscroll-behavior: none;
    -webkit-overflow-scrolling: auto;
  }

  /* 2) Header toujours au-dessus */
  header.site-header{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 6000 !important;
  }

  /* 3) Carte fixée sous le header (avec safe-area iPhone) */
  #map{
    position: fixed !important;
    top: calc(var(--header-h) + var(--safe-top)) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: var(--safe-bottom) !important;
    height: auto !important;
  }

  /* 4) Contrôles Leaflet : décale sous le header (sans ajouter trop d’espace) */
  #map .leaflet-top{
    top: calc(var(--header-h) + var(--safe-top)) !important;
  }

  /* 5) Agenda + recherche : fixés sous le header (sans +12px pour ne pas “descendre”) */
  #agendaBtn{
    position: fixed !important;
    top: calc(var(--header-h) + var(--safe-top)) !important;
    z-index: 5500 !important;
  }

  .search-wrapper{
    position: fixed !important;
    top: calc(var(--header-h) + var(--safe-top)) !important;
    z-index: 5500 !important;
  }

  /* La search-bar desktop est en absolute : on la neutralise proprement */
  .search-wrapper .search-bar{
    position: relative !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
  }

  /* Calendrier : fixé sous la rangée recherche/agenda */
  #calendarContainer.calendar{
    position: fixed !important;
    top: calc(var(--header-h) + var(--safe-top) + 48px) !important;
    z-index: 5500 !important;
  }
}

/* =========================================================
   iPad uniquement : corrige la barre de recherche sur grand écran tactile
   Ne touche pas aux iPhone <= 480px, gérés par mobile.css
   ========================================================= */
@supports (-webkit-touch-callout: none) {
  @media (min-width: 768px) {
    .search-wrapper{
      position: fixed !important;
      top: calc(var(--header-h) + var(--safe-top) + 12px) !important;
      right: 16px !important;
      left: auto !important;
      width: auto !important;
      z-index: 5500 !important;
    }

    .search-wrapper .search-bar{
      position: relative !important;
      top: 0 !important;
      right: auto !important;
      left: auto !important;
      width: auto !important;
    }

    #agendaBtn{
      position: fixed !important;
      top: calc(var(--header-h) + var(--safe-top) + 12px) !important;
      right: 228px !important;
      left: auto !important;
      z-index: 5500 !important;
    }

    #calendarContainer.calendar{
      position: fixed !important;
      top: calc(var(--header-h) + var(--safe-top) + 60px) !important;
      right: 225px !important;
      left: auto !important;
      z-index: 5500 !important;
    }
  }
}