/* Parisian Agenda v2 : adaptation mobile et tablette (chargé en dernier). Barre basse, cibles 44px, safe-areas, dvh, carrousels, clavier. */

/* ---- hauteur dynamique (barres d'URL mobiles, clavier) ---- */
@supports (height:100dvh){
  body{min-height:100dvh}
  .hero{min-height:clamp(430px,62dvh,540px)}
  .map-box{height:min(62dvh,640px)}
  .onb-card{max-height:92dvh}
  .lang-menu{max-height:70dvh}
  .nfx-stage{height:clamp(420px,66dvh,520px)}
}

@media(max-width:999px){
  /* défilement horizontal iOS : pas de débordement de page, inertie, pas de rebond qui remonte à la page */
  html,body{max-width:100%;overflow-x:clip}
  .rail,.nfx-track,.nfx-chips,.chips.scroll,.subtabs{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .rail,.nfx-track{scroll-snap-type:x mandatory}
  .nfx-track>*,.rail>*{scroll-snap-align:start;scroll-snap-stop:normal}
  .nfx-chips>*,.chips.scroll>*{flex:none;scroll-snap-align:start}
  .nfx-chips,.chips.scroll{scroll-snap-type:x proximity}

  /* barre basse : encoche et indicateur d'accueil */
  .tabs{height:calc(var(--tabH) + var(--safeB));padding-bottom:var(--safeB);padding-left:calc(8px + var(--safeL));padding-right:calc(8px + var(--safeR))}
  .tabs a{min-width:0;min-height:48px;padding:0 2px}
  .tabs a>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tabs-extra,.cz-navbtn,.cz-colhead,.cz-wtab{display:none!important}
  .topbar{padding-left:calc(14px + var(--safeL));padding-right:calc(14px + var(--safeR))}
  .brand-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  main{padding-left:calc(16px + var(--safeL));padding-right:calc(16px + var(--safeR))}
  .toast,.pa-update{max-width:calc(100% - 24px)}

  /* tiroirs et fenêtres : jamais plus hauts que l'écran visible, notch respecté */
  .sheet{max-height:calc(100dvh - var(--safeT) - 8px);padding-bottom:var(--safeB)}
  .sheet-body{padding-bottom:calc(var(--safeB) + 28px)}
  .onb-card,.pux-modal{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 20px)}
  .onb-card{max-height:calc(100dvh - var(--safeT) - 12px);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}

  /* iOS zoome sur les champs < 16px */
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:max(16px,1rem)}
  input[type=search],input[type=text],select{min-height:44px}
  /* le clavier virtuel ne doit pas cacher le champ actif derrière la barre basse */
  input,textarea,select{scroll-margin-bottom:calc(var(--tabH) + var(--safeB) + 90px);scroll-margin-top:calc(var(--topH) + var(--safeT) + 16px)}

  /* cibles tactiles : zone cliquable étendue sans changer le rendu */
  .nfx-dot,.nfx-pause,.hw-chip,.btn.small,.map-ctl button,.icon-btn,.pill-btn,.chip,.subtabs a,.link{position:relative}
  .nfx-dot::after,.nfx-pause::after,.hw-chip::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:44px;transform:translate(-50%,-50%)}
  .nfx-chip{position:relative;min-height:44px}
  .credit a,.sheet-body a[href^="#/credits"]{display:inline-block;padding:13px 4px;margin:-13px -4px}
  .chip,.nfx-chip,.pill-btn,.onb-skip{min-height:44px}
  .chip.onb-day,.onb-days .chip{min-width:44px}
  .icon-btn{min-width:44px;min-height:44px}
  .hw-btn,.hw-q{min-height:48px}
  input[type=checkbox],input[type=radio]{width:24px;height:24px}
  label:has(>input[type=checkbox]),label:has(>input[type=radio]){min-height:44px}
  .chip,.btn,.cta{touch-action:manipulation}
  a,button{-webkit-tap-highlight-color:transparent}

  /* textes longs : pas de débordement, titres qui passent à la ligne */
  h1,h2,h3,.card-main,.sheet-hero h2,.hw-title{overflow-wrap:anywhere;hyphens:auto}
  img,video,svg,canvas,iframe{max-width:100%}
  table{display:block;max-width:100%;overflow-x:auto}
  pre,code{overflow-x:auto;max-width:100%}
}

@media(max-width:900px){
  .map-ctl{gap:8px}
  .map-ctl>*{min-width:0}
  .map-box{min-height:300px}
  /* carte Leaflet / SVG : les boutons de zoom restent sous le pouce et hors encoche */
  .map-box .pa-btn,.leaflet-control-zoom a{width:44px;height:44px;line-height:44px}
  .leaflet-bottom,.leaflet-right{margin-bottom:var(--safeB)}
  .leaflet-container{touch-action:none}
  .sheet-actions .btn{flex:1 1 140px}
  .btn-row>.btn,.btn-row>.cta{flex:1 1 auto}
}

@media(max-width:600px){
  .grid{grid-template-columns:1fr}
  .tiles{grid-template-columns:1fr 1fr}
  .sheet-hero h2{font-size:1.5rem}
  .sheet-plain{padding-right:calc(64px + var(--safeR))}
  .btn-row{gap:8px}
  .btn-row>.btn,.btn-row>.cta,.sheet-actions .btn{min-height:48px}
  .hw-act{flex-direction:column}
  .hw-act .hw-btn{width:100%}
  .nfx-intro .btn-row,.nfx-intro .nfx-cta{flex-wrap:wrap}
}

/* petits téléphones (320 à 360 px) */
@media(max-width:360px){
  .tabs a{font-size:.68rem}
  .tabs svg{width:20px;height:20px}
  .tiles{grid-template-columns:1fr}
  .brand-name{max-width:42vw}
}

/* paysage téléphone : barre basse plus fine, pas de hero plein écran */
@media(max-height:480px) and (orientation:landscape) and (max-width:999px){
  :root{--tabH:52px;--topH:48px}
  .tabs a>span{display:none}
  .hero,.nfx-stage{min-height:0;height:auto}
  .map-box{height:calc(100dvh - var(--topH) - var(--tabH) - 24px);min-height:220px}
  .sheet{max-height:calc(100dvh - var(--safeT))}
}

/* tablette portrait : contenu plus large, grilles à deux colonnes */
@media(min-width:601px) and (max-width:999px){
  main{max-width:880px}
  .tiles{grid-template-columns:repeat(4,1fr)}
}
