:root{--bottom-nav-h:56px;--bottom-nav-total:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom));--pwa-sticky-top:calc(var(--header-h, 70px) + env(safe-area-inset-top))}*{-webkit-tap-highlight-color:#fff0}a,button,[role="button"],label,.jdm-sec-btn,.jdm-acc-nav-item{touch-action:manipulation;-webkit-touch-callout:none}.kebab-panel,.jdm-acc-content,.jdm-modal-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}#main-content{-webkit-overflow-scrolling:touch}html.is-ios #main-content{overscroll-behavior:contain}.pwa-header-title{display:none}@media (display-mode:standalone) and (max-width:767px){.site-logo{display:none!important}.pwa-header-title{display:block!important;flex:1!important;min-width:0!important;text-align:center!important;font-family:var(--font-display,sans-serif)!important;font-size:16px!important;font-weight:700!important;letter-spacing:1.5px!important;text-transform:uppercase!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;pointer-events:none!important;position:static!important;transform:none!important}}@media (display-mode:standalone){#wpadminbar{display:none!important}html{margin-top:0!important}body{margin-top:0!important;background-color:rgb(8 14 22)}html.is-ios{overscroll-behavior-y:none}html.is-ios body{overscroll-behavior-y:none}.site-header{padding-top:env(safe-area-inset-top);height:calc(var(--header-h, 70px) + env(safe-area-inset-top))}.kebab-panel{padding-top:env(safe-area-inset-top)}.site-header .header-inner{padding-left:max(16px, env(safe-area-inset-left));padding-right:max(16px, env(safe-area-inset-right))}.kebab-panel{padding-left:env(safe-area-inset-left)}}@media (display-mode:standalone) and (max-width:767px){.jdm-section-nav{display:block!important}.jdm-section-nav{top:auto!important;bottom:calc(-1 * env(safe-area-inset-bottom, 0px))!important;height:calc(var(--bottom-nav-total) + env(safe-area-inset-bottom, 0px))!important;border-top:1px solid rgb(255 255 255 / .12)!important;border-bottom:none!important;padding-bottom:calc(env(safe-area-inset-bottom) * 2)!important;background:rgb(8 14 22 / .98)!important;box-shadow:0 -4px 20px rgb(0 0 0 / .35)!important}.jdm-section-nav::after{content:'';position:absolute;bottom:calc(-1 * env(safe-area-inset-bottom));left:0;right:0;height:env(safe-area-inset-bottom);background:rgb(8 14 22 / .98)}.jdm-section-nav-inner{padding-inline:4px!important;padding-top:6px!important;justify-content:space-around!important;overflow-x:hidden!important;gap:0!important;align-items:flex-start!important}.jdm-section-nav .jdm-sec-btn{flex:1!important;max-width:72px;width:auto!important;height:auto!important;flex-direction:column!important;gap:3px!important;padding:4px 2px!important;border-radius:var(--radius)!important;border:none!important;background:transparent!important;opacity:.6!important}.jdm-section-nav .jdm-sec-btn-ico{font-size:24px!important;line-height:1!important}.jdm-section-nav .jdm-sec-btn-avatar{width:28px!important;height:28px!important;border-radius:50%!important;object-fit:cover!important;border:2px solid rgb(255 255 255 / .25)!important;display:block!important;margin:0 auto!important}.jdm-section-nav .jdm-sec-btn--active .jdm-sec-btn-avatar{border-color:var(--p-color,#94a3b8)!important}.jdm-section-nav .jdm-sec-btn-initial{width:28px!important;height:28px!important;border-radius:50%!important;background:rgb(100 116 139 / .35)!important;border:2px solid rgb(148 163 184 / .4)!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:13px!important;font-weight:700!important;color:#94a3b8!important;line-height:1!important;margin:0 auto!important}.jdm-section-nav .jdm-sec-btn--active .jdm-sec-btn-initial{background:rgb(100 116 139 / .55)!important;border-color:#94a3b8!important;color:#fff!important}.jdm-section-nav .jdm-sec-btn-lbl{display:block!important;font-size:9px!important;font-weight:700!important;letter-spacing:.3px!important;text-transform:uppercase!important;color:inherit!important;opacity:1!important}.jdm-section-nav .jdm-sec-btn--active{opacity:1!important;background:var(--p-bg,rgb(255 255 255 / .08))!important;border-radius:var(--radius)!important}.jdm-section-nav .jdm-sec-btn:not(.jdm-sec-btn--active):hover{opacity:.85!important;filter:brightness(1.2)!important;transform:none!important}.jdm-sec-inline{display:none!important}.site-footer{display:none!important}#main-content{padding-bottom:calc(var(--bottom-nav-h, 56px) + env(safe-area-inset-bottom) + 8px)!important}body.has-section-nav .single-hero,body.has-section-nav .jdm-ann-hero{padding-top:calc(var(--header-h,70px)+env(safe-area-inset-top)+var(--wp-admin--admin-bar--height,0)+24px)!important}body.has-section-nav .jdm-ann-search-bar,body .jdm-ann-search-bar{top:var(--pwa-sticky-top)!important}}@media (display-mode:standalone){body.jdm-user-logged-in.jdm-user-logged-in #jdm-help-btn,body.jdm-user-logged-in.jdm-user-logged-in #jdm-help-overlay,body.jdm-user-logged-in.jdm-user-logged-in #jdm-welcome-overlay,body.jdm-user-logged-in.jdm-user-logged-in #jdm-tour-backdrop,body.jdm-user-logged-in.jdm-user-logged-in #jdm-tour-frame,body.jdm-user-logged-in.jdm-user-logged-in #jdm-tour-bubble{display:none!important;visibility:hidden!important;pointer-events:none!important}}@media (min-width:768px){#jdm-push-block{display:none!important}}@media (display-mode:standalone){.site-header .header-right{margin-right:-12px}}@media (display-mode:standalone) and (max-width:767px){.single-hero,.jdm-ann-hero{display:none!important}.pwa-hidden{display:none!important}body.has-section-nav .section:first-of-type,body.has-section-nav>#main-content>.section:first-child,body.has-section-nav>#main-content>section:first-child{padding-top:calc(var(--header-h,70px)+env(safe-area-inset-top)+16px)!important}.page-bg+.section,.page-bg+section{padding-top:calc(var(--header-h,70px)+env(safe-area-inset-top)+16px)!important}}— fixés sous le header en standalone Chaque page de section a ses propres contrôles de filtrage. En PWA,l'utilisateur scroll beaucoup : les filtres doivent rester
   accessibles sans remonter en haut de page.
   ========================================================================== */

@media (display-mode: standalone) and (max-width: 767px) {

  /* Tous les wrappers de filtres : sticky sous le header PWA.
     Le fond coloré semi-transparent vient de .filters-wrap dans _components.css.
     Ici on ne gère que le positionnement. */

  .actu-search,
  .filters-wrap,
  .jdm-ann-search-bar,
  #form-gpx-filters {
    position:      sticky             !important;
    top:           var(--pwa-sticky-top) !important;
    z-index:       800                !important;
    margin-top:    0                  !important;
    margin-bottom: 0                  !important;
    border-radius: var(--radius-lg, 14px) !important;
  }

  /* Espace sous les filtres collants */
  .tabs:has(.tab-btn[data-past]) + *,
  .actu-search + *,
  .filters-wrap + *,
  .jdm-ann-search-bar + *,
  #form-gpx-filters + * {
    padding-top: 12px !important;
  }

  /* ── Parcours : layout compact en PWA ──
     Les labels sont masqués, les selects s'affichent en grille 2 colonnes. Évite l'empilement vertical qui prend toute la hauteur. */
  #form-gpx-filters .jdm-filter-label {
    display: none !important;
  }
  #form-gpx-filters {
    display:        flex      !important;
    flex-direction: row       !important;
    flex-wrap:      wrap      !important;
    align-items:    center    !important;
    gap:            8px       !important;
  }
  #form-gpx-filters .jdm-field-group {
    flex:        1 1 calc(50% - 8px) !important;
    min-width:   0                   !important;
    display:     flex                !important;
    flex-direction: column           !important;
    align-self:  auto                !important;
  }
  /* Écraser les min-width inline sur les selects */
  #form-gpx-filters .jdm-btn-filter,
  #form-gpx-filters select {
    width:     100%   !important;
    min-width: 0      !important;
    font-size: 13px   !important;
  }
  /* Div boutons Rechercher/Réinitialiser : pleine largeur en bas */
  #form-gpx-filters > div[style*="margin-left:auto"],
  #form-gpx-filters > div:last-of-type {
    flex:        1 1 100%   !important;
    margin-left: 0          !important;
    display:     flex       !important;
    gap:         8px        !important;
  }
  /* Le span "Filtrer :" : pleine largeur sur sa propre ligne */
  #form-gpx-filters > span:first-of-type {
    flex:  1 1 100% !important;
    padding-bottom: 0 !important;
  }


/* ============================================================
   MODIFICATIONS PWA JDM — toutes scopées body.is-pwa
   (plus fiable que @media display-mode:standalone sur iOS)
   ============================================================ */

/* ── Bottom nav : hauteur, tap targets, couleurs ── */
body.is-pwa :root { --bottom-nav-h: 60px; }

body.is-pwa .jdm-section-nav .jdm-sec-btn {
  flex: 1 !important; max-width: 80px;
  min-height: 44px !important;
  padding: 6px 4px !important;
  color: rgba(148,163,184,.65) !important;
  opacity: 1 !important;
  will-change: transform;
  background: transparent !important; border: none !important;
  flex-direction: column !important; gap: 3px !important;
  border-radius: var(--radius) !important;
}
body.is-pwa .jdm-section-nav .jdm-sec-btn-ico {
  display: flex !important; align-items: center !important;
  justify-content: center !important; line-height: 1 !important;
  transition: color var(--transition) !important;
}
body.is-pwa .jdm-section-nav .jdm-sec-btn-ico svg {
  display: block !important; width: 22px !important; height: 22px !important;
}
body.is-pwa .jdm-section-nav .jdm-sec-btn-lbl {
  display: block !important; font-size: 10px !important;
  font-weight: 600 !important; text-transform: none !important;
  letter-spacing: .1px !important; color: inherit !important;
  opacity: 1 !important;
}
body.is-pwa .jdm-section-nav .jdm-sec-btn--active {
  color: var(--p-color, #94a3b8) !important;
  opacity: 1 !important;
  background: var(--p-bg, rgba(255,255,255,.08)) !important;
  border-radius: var(--radius) !important;
}
body.is-pwa .jdm-section-nav .jdm-sec-btn:not(.jdm-sec-btn--active):hover {
  color: rgba(255,255,255,.85) !important;
}

/* ── Animation entrée de page ── */
@keyframes jdm-page-in {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
body.is-pwa #main-content {
  animation: jdm-page-in .35s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@media (prefers-reduced-motion: reduce) {
  body.is-pwa #main-content { animation: none; }
}

/* ── Kebab : masquer items tabnav ── */
body.is-pwa .kebab-menu-list .kebab-tabnav { display: none !important; }
body.is-pwa .kebab-menu-list .kebab-section-label:first-child { display: none !important; }

/* ── PAGE SORTIES ── */

/* Filtres période : scroll horizontal */
body.is-pwa .filters-wrap .tabs {
  display: flex !important; flex-wrap: nowrap !important;
  overflow-x: auto !important; -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important; gap: 8px !important;
  margin-bottom: 10px !important;
}
body.is-pwa .filters-wrap .tabs::-webkit-scrollbar { display: none !important; }
body.is-pwa .filters-wrap .tab-btn {
  flex-shrink: 0 !important; padding: 9px 18px !important;
  font-size: 13px !important; white-space: nowrap !important;
}

/* Filtres type : scroll horizontal */
body.is-pwa .filters-wrap .planning-tabs {
  display: flex !important; flex-wrap: nowrap !important;
  overflow-x: auto !important; -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important; gap: 8px !important;
  margin-bottom: 10px !important;
}
body.is-pwa .filters-wrap .planning-tabs::-webkit-scrollbar { display: none !important; }
body.is-pwa .filters-wrap .ptab-btn {
  flex-shrink: 0 !important; padding: 9px 16px !important;
  font-size: 13px !important; white-space: nowrap !important;
}

/* Tri : segmented control */
body.is-pwa .jdm-sort-wrap {
  display: flex !important; align-items: center !important; gap: 10px !important;
}
body.is-pwa .jdm-sort-label {
  font-size: 13px !important; color: rgba(255,255,255,.55) !important;
  flex-shrink: 0 !important;
}
body.is-pwa .jdm-sort-control {
  display: flex !important; background: rgba(0,0,0,.28) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: var(--radius) !important; padding: 3px !important; gap: 2px !important;
}
body.is-pwa .jdm-sort-btn {
  padding: 7px 16px !important; border-radius: var(--radius-sm) !important;
  border: none !important; background: transparent !important;
  color: rgba(255,255,255,.5) !important; font-size: 13px !important;
  font-weight: 600 !important; cursor: pointer !important;
  font-family: var(--font) !important; white-space: nowrap !important;
  transition: background var(--transition-fast), color var(--transition-fast) !important;
}
body.is-pwa .jdm-sort-btn.active {
  background: rgba(111,207,66,.22) !important;
  color: var(--lime-accent) !important;
  border: 1px solid rgba(111,207,66,.45) !important;
}

/* Cards sorties : layout compact */
body.is-pwa .sorties-grid {
  grid-template-columns: 1fr !important; gap: 10px !important;
}
body.is-pwa .sortie-card {
  display: flex !important; flex-direction: row !important;
  align-items: stretch !important; overflow: hidden !important;
  min-height: 80px !important;
}
body.is-pwa .sortie-card .sortie-card-thumb { display: none !important; }
body.is-pwa .sortie-card .sortie-card-header {
  flex: 1 !important; padding: 12px 14px !important;
  gap: 12px !important; align-items: center !important; min-width: 0 !important;
}
body.is-pwa .sortie-card .sortie-date-badge {
  flex-shrink: 0 !important; width: 48px !important; padding: 7px 4px !important;
}
body.is-pwa .sortie-card .sortie-date-badge .jour { font-size: 22px !important; }
body.is-pwa .sortie-card .sortie-card-meta { flex: 1 !important; min-width: 0 !important; }
body.is-pwa .sortie-card .sortie-card-meta h3 {
  font-size: 14px !important; margin-bottom: 4px !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.is-pwa .sortie-card .sortie-card-body { display: none !important; }
body.is-pwa .sortie-card.sortie-card--past { opacity: .65 !important; }

/* ── PAGE PARCOURS ── */

/* Bouton téléchargement */
.gpx-card-download { position: absolute; bottom: 8px; left: 8px; z-index: 5; }
.jdm-btn-gpx-dl {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%; border: none;
  background: rgba(0,0,0,.45); color: rgba(255,255,255,.85);
  cursor: pointer; backdrop-filter: blur(4px); text-decoration: none;
  transition: background var(--transition);
}
body.is-pwa .jdm-btn-favori,
body.is-pwa .jdm-btn-gpx-dl {
  width: 38px !important; height: 38px !important;
}

/* Bottom sheet filtres */
.jdm-gpx-filter-toggle { display: none; }
.jdm-gpx-filter-sheet  { display: contents; }
.jdm-gpx-filter-overlay { display: none; }

body.is-pwa #form-gpx-filters {
  display: flex !important; flex-direction: row !important;
  flex-wrap: nowrap !important; align-items: center !important;
  gap: 8px !important; padding: 10px 12px !important;
}
body.is-pwa #form-gpx-filters > span:first-of-type,
body.is-pwa #form-gpx-filters > input[name="post_type"] { display: none !important; }

body.is-pwa .jdm-gpx-filter-toggle {
  display: inline-flex !important; align-items: center !important;
  gap: 7px !important; padding: 10px 16px !important;
  border-radius: var(--radius) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.85) !important;
  font-size: 13px !important; font-weight: 600 !important;
  cursor: pointer !important; font-family: var(--font) !important;
  white-space: nowrap !important;
}
body.is-pwa .jdm-gpx-filter-toggle[aria-expanded="true"] {
  background: rgba(74,159,212,.22) !important;
  border-color: rgba(74,159,212,.55) !important; color: #7dd3fc !important;
}
body.is-pwa .jdm-gpx-filter-sheet {
  display: none !important; position: fixed !important;
  bottom: var(--bottom-nav-total) !important; left: 0 !important;
  right: 0 !important; max-height: 70vh !important; overflow-y: auto !important;
  background: rgba(8,14,22,.98) !important;
  border-top: 1px solid rgba(255,255,255,.12) !important;
  border-radius: var(--radius-lg) 20px 0 0 !important;
  padding: 20px 16px 16px !important; z-index: 1100 !important;
  flex-direction: column !important; gap: 12px !important;
}
body.is-pwa .jdm-gpx-filter-sheet.jdm-sheet-open { display: flex !important; }
body.is-pwa .jdm-gpx-filter-overlay {
  display: none !important; position: fixed !important; inset: 0 !important;
  background: rgba(0,0,0,.45) !important; z-index: 1099 !important;
}
body.is-pwa .jdm-gpx-filter-overlay.jdm-sheet-open { display: block !important; }

/* Grille 1 colonne */
body.is-pwa .gpx-grid {
  grid-template-columns: 1fr !important; gap: 12px !important;
}

/* ── Skeleton loaders ── */
@keyframes jdm-shimmer {
  from { background-position: -600px 0; }
  to   { background-position:  600px 0; }
}
body.is-pwa .jdm-skel {
  border-radius: var(--radius-sm);
  background: linear-gradient(90deg,
    rgba(255,255,255,.04) 25%, rgba(255,255,255,.10) 50%,
    rgba(255,255,255,.04) 75%);
  background-size: 600px 100%;
  animation: jdm-shimmer 1.4s infinite linear;
}

/* ── Indicateur de navigation ── */
#jdm-nav-loader { display: none; }

/* Keyframe au niveau racine — Safari/WebKit ne supporte pas @keyframes dans @media */
@keyframes jdm-loader-pulse {
  0%,100% { box-shadow: 0 0 0 0    rgba(79,168,48,.55); }
  50%      { box-shadow: 0 0 0 14px rgba(79,168,48,0);   }
}

@keyframes jdm-loader-enter {
  from { opacity: 0; transform: scale(0.72); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes jdm-logo-pulse {
  0%   { box-shadow: 0 0 0 0    rgba(79,168,48,.70), 0 8px 32px rgba(0,0,0,.55); }
  60%  { box-shadow: 0 0 0 14px rgba(79,168,48,.0),  0 8px 32px rgba(0,0,0,.55); }
  100% { box-shadow: 0 0 0 0    rgba(79,168,48,.0),  0 8px 32px rgba(0,0,0,.55); }
}
@keyframes jdm-loader-spin {
  to { transform: rotate(360deg); }
}

@media (display-mode: standalone) {
  #jdm-nav-loader {
    animation: jdm-loader-enter .22s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .jdm-loader-logo {
    position:   relative;
    width:      72px; height: 72px; border-radius: var(--radius-lg); overflow: hidden;
    background: rgba(22,55,30,.95); border: 2px solid rgba(111,207,66,.4);
    display:    flex; align-items: center; justify-content: center;
    animation:  jdm-logo-pulse .9s ease-out infinite,
                jdm-loader-enter .22s cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .jdm-loader-logo img { width: 54px; height: 54px; object-fit: contain; }
  .jdm-loader-logo::before {
    content:       '';position:absolute;inset:-5px;border-radius:var(--radius-lg);border:2.5px solid #fff0;border-top-color:rgb(111 207 66 / .9);border-right-color:rgb(111 207 66 / .3);animation:jdm-loader-spin .8s linear infinite}}@media (display-mode:standalone) and (prefers-reduced-motion:reduce){#jdm-nav-loader{animation:none}.jdm-loader-logo{animation:none}.jdm-loader-logo::before{animation:none}}