/* =========================================================
   Le Réseau Réno — couche « native » mobile
   Chargée en dernier sur chaque page, après la feuille de la page.
   Corrige les comportements de plateforme (toucher, zoom, scroll,
   encoches) qui trahissent un site web sur un téléphone.
   ========================================================= */

:root {
  --press-scale: 0.97;
  --press-duration: 120ms;
  --press-ease: cubic-bezier(0.2, 0, 0.3, 1);
}

/* Le navigateur intégré Meta sur Android (Instagram, Facebook, Threads)
   signale la barre d'état en safe-area-inset-top alors que sa propre
   barre est déjà au-dessus de la page : l'en-tête s'allongeait d'autant. */
html.meta-iab {
  --safe-top: 0px;
}

html {
  /* Pas de flash gris/bleu du navigateur au toucher : chaque contrôle
     fournit son propre retour via :active ci-dessous. */
  -webkit-tap-highlight-color: transparent;
  /* Pas de gonflement du texte en paysage sur iOS. */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Sous 16px, iOS Safari zoome à la mise au point et ne dézoome jamais.
   Plancher appliqué uniquement aux pointeurs grossiers pour laisser
   les échelles typographiques du bureau intactes. */
@media (pointer: coarse) {
  input,
  textarea,
  select {
    font-size: max(16px, 1em);
  }
}

/* Pas de délai de 300ms au clic, pas de sélection du libellé au
   appui long, pas de menu contextuel sur les contrôles. Le texte de
   contenu reste sélectionnable — on ne touche jamais à body. */
button,
[role="button"],
summary,
.btn,
.navtab,
.menu-item,
.check,
.tweak-opt,
.theme-segmented-btn,
.acct-chip,
.service-option {
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

a {
  touch-action: manipulation;
}

/* Retour à l'appui, pas au relâchement : un contrôle qui ne réagit
   qu'au click répond quand le doigt part, ce qui se lit comme du lag.
   :active fonctionne sur tous les types d'entrée, contrairement à :hover. */
button:not(:disabled),
[role="button"],
a.btn,
.btn,
.navtab,
.menu-item,
.check,
.tweak-opt,
.acct-chip,
.service-option,
.upload-zone,
.act-stat-clickable,
.md-card,
.reco-select-btn {
  transition: transform var(--press-duration) var(--press-ease),
    background-color var(--press-duration) var(--press-ease),
    border-color var(--press-duration) var(--press-ease),
    color var(--press-duration) var(--press-ease);
}

button:not(:disabled):active,
[role="button"]:active,
a.btn:active,
.btn:not(:disabled):active,
.navtab:active,
.menu-item:active,
.check:active,
.tweak-opt:active,
.acct-chip:active,
.upload-zone:active,
.act-stat-clickable:active,
.md-card:active,
.reco-select-btn:not(:disabled):active {
  transform: scale(var(--press-scale));
}

/* Les surfaces pleine largeur écrasées à 0.97 se décollent visiblement
   de leurs bords : on les assombrit au lieu de les réduire. */
.menu-item:active,
.nav-mobile-panel a:active,
.act-feed-item:active,
.legal-nav a:active {
  transform: none;
  background-color: var(--surface-hover, var(--panel-soft));
}

/* Les liens de navigation et de pied de page ne sont pas des boutons :
   un simple assombrissement suffit. */
.nav-links a:active,
.footer-col a:active {
  opacity: 0.6;
}

/* Une bascule déjà sélectionnée ne doit pas rejouer l'animation d'appui. */
.theme-segmented-btn[aria-checked="true"]:active {
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  button:active,
  [role="button"]:active,
  a.btn:active,
  .btn:active,
  .navtab:active,
  .menu-item:active,
  .check:active,
  .tweak-opt:active,
  .acct-chip:active,
  .upload-zone:active,
  .act-stat-clickable:active,
  .md-card:active,
  .reco-select-btn:active {
    transform: none;
  }
}

/* Les conteneurs de défilement internes ne doivent pas entraîner la page
   (ni le pull-to-refresh) quand ils arrivent en butée. */
.chat-messages,
.nav-mobile-panel,
.mobile-sidebar-panel,
.md-list,
.modal,
.feed-list,
.wizard-step--tall {
  overscroll-behavior: contain;
}