/* ==========================================================================
   BAZA-S232 — « Tirer pour rafraîchir » (pull-to-refresh) de la liste Profils.

   STRICTEMENT ADDITIF : servi depuis `public/` puis référencé par un <link>
   dans `index.html`. Vite NE LE FUSIONNE PAS dans `assets/index-*.css` : la
   coque CSS GELÉE S141 (hash de `assets/index-*.css`) reste byte-identique
   (aucun re-pin de gate, PWA sans réinstallation — sw.js/manifest inchangés).

   Catégorie « présentation » uniquement : AUCUNE hauteur/unité de viewport
   (100vh/100dvh/clientHeight/innerHeight), AUCUN sélecteur de coque agissant sur
   la géométrie (.app/.tabbar/.conversation-screen), safe-areas INTACTES. Le
   décalage vertical dynamique est porté par un style INLINE côté composant.

   Spécificité RENFORCÉE (`html …`) au lieu de `!important` (convention S215)
   pour l'emporter quel que soit l'ordre d'injection des <link>.
   ========================================================================== */

/* La liste Profils devient le repère de position de l'indicateur (absolu). Seul
   ajout : `position: relative` — les propriétés gelées de `.app-main`
   (flex/overflow/overscroll) restent inchangées. Neutre sur les autres onglets
   (ils ne rendent aucun `.ptr-*`). */
html .app-main {
  position: relative;
}

/* Contenu de l'onglet Profils : suit le doigt via translateY inline. Le retour
   élastique est animé par cette transition ; pendant le tirage actif le
   composant pose `transition: none` en inline (suivi 1:1, aucun retard). */
html .ptr-content {
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

/* Indicateur : ancré JUSTE AU-DESSUS de la zone visible (top négatif = masqué au
   repos, révélé par le translateY inline qui suit le contenu). */
html .ptr-indicator {
  position: absolute;
  top: -56px;
  left: 0;
  right: 0;
  height: 56px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  pointer-events: none;
  z-index: 3;
  color: var(--green, #0b7d24);
}

/* BAZA-S233 — pastille RONDE PETITE et centrée (motif discret à l'identité
   Baza), au lieu d'une capsule large avec texte. */
html .ptr-indicator-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  margin-bottom: 6px;
  border-radius: 50%;
  background: var(--surface, #ffffff);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.14);
}

/* Libellé conservé pour les lecteurs d'écran, visuellement masqué (motif seul). */
html .ptr-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

html .ptr-spinner {
  display: block;
  color: var(--green, #0b7d24);
  transition: transform 80ms linear, opacity 80ms linear;
}

html .ptr-indicator.is-refreshing .ptr-spinner {
  animation: ptr-spin 0.8s linear infinite;
  opacity: 1;
}

html .ptr-label {
  font-size: 0.72rem;
  line-height: 1;
  color: var(--text, #111b1a);
  opacity: 0.7;
  white-space: nowrap;
}

@keyframes ptr-spin {
  to {
    transform: rotate(360deg);
  }
}

/* prefers-reduced-motion (mission §4) : ressort visuel fortement réduit — aucune
   transition de retour, aucune rotation continue (l'indicateur reste net,
   l'actualisation fonctionne toujours). Même sélecteur, PLUS LOIN dans le
   fichier ⇒ l'emporte sans `!important`. */
@media (prefers-reduced-motion: reduce) {
  html .ptr-content {
    transition: none;
  }
  html .ptr-indicator.is-refreshing .ptr-spinner {
    animation: none;
  }
  html .ptr-spinner {
    transition: none;
  }
}