/* =========================================================================
 * BAZA-S240 — Recette Philippe (captures IMG_2285/2286/2288, 2026-07-30) :
 *   1. MENU « + » : parité COMPLÈTE avec le menu SYSTÈME iOS du bouton
 *      appareil photo — même taille de police (21px mesurés sur la capture)
 *      ET mêmes tailles d'icônes (26px, agrandies aussi dans la TSX).
 *   2. LISTES Messages + Groupes : le tiroir du swipe gauche devient la box
 *      BLEUE « Archiver » (icône + libellé empilés), révélée PROGRESSIVEMENT
 *      pendant le geste (élasticité + icône progressive « comme sur la page
 *      profil » — moteur S239) ; le popup de confirmation est retiré (TSX).
 *
 * Fichier PUBLIC séparé, chargé par <link> dans index.html : Vite ne le
 * fusionne PAS dans `index-*.css` ⇒ le hash CSS GELÉ S141 reste byte-identique
 * (aucun re-pin des gates s141/s145/s147/s149/s155 + méta-verrou s164).
 *
 * Toutes les surcharges gagnent par SPÉCIFICITÉ (jamais par simple ordre
 * source) : elles restent correctes quel que soit l'ordre d'injection des
 * feuilles (base gelée, s215, s239, s240). Catégories « typographie » et
 * « couleur/animation/visibilité » seulement — AUCUNE hauteur de coque,
 * AUCUNE unité de viewport, AUCUNE safe-area (coque gelée S141 / bande grise
 * S173G / tabbar S173F STRICTEMENT intactes). L'invariant S215/S199D est
 * PRÉSERVÉ : au repos, AUCUN tiroir n'est peint (jamais une couleur qui
 * filtre au bord d'écran ou au zoom fractionnaire).
 * ========================================================================= */

/* -------------------------------------------------------------------------
 * 1) MENU « + » — parité de POLICE et d'ICÔNES avec le menu système iOS.
 *    Le menu natif de l'appareil photo (Photothèque / Prendre une photo /
 *    Choisir les fichiers) rend, sur l'iPhone de la recette, ses libellés à
 *    ~21px et ses icônes à ~26px ; notre menu S239 était à 17px / 20px —
 *    visiblement plus petit sur la même capture (IMG_2285 vs IMG_2286).
 *    Spécificité (0,3,0) > S239 (0,2,0) > base gelée (0,1,0).
 * ------------------------------------------------------------------------- */
.s173h-attach-overlay .s173h-attach-panel .s173h-attach-item {
  font-size: 1.3125rem; /* 21px — même corps que le menu natif de la capture */
  line-height: 1.32;
}
.s173h-attach-overlay .s173h-attach-panel .s173h-attach-item-icon {
  width: 26px; /* conteneur aligné sur les SVG 26px (TSX S240) */
  height: 26px;
}
/* Panneau élargi en conséquence : chaque libellé d'album tient toujours sur
   DEUX lignes équilibrées (exigence S239 conservée, jamais 3 lignes) — la
   rangée se resserre légèrement (padding/gap) pour rester proche de la
   largeur du menu natif. Le plafond `max-width` responsive S173H est
   conservé. */
.s173h-attach-overlay div.s173h-attach-panel {
  width: 272px;
}
.s173h-attach-overlay .s173h-attach-panel .s173h-attach-item {
  padding-left: 12px;
  padding-right: 12px;
  gap: 10px;
}

/* -------------------------------------------------------------------------
 * 2) LISTES MESSAGES + GROUPES — box BLEUE « Archiver » révélée
 *    PROGRESSIVEMENT (élasticité gérée par le moteur TSX S240).
 *
 *    Base : S215 masque le tiroir au repos (`html .group-row-action
 *    { visibility: hidden }`, 0,1,1) et ne le révèle qu'à l'état OUVERT
 *    (`.is-swiped`). S240 ajoute l'état INTERMÉDIAIRE : pendant le geste
 *    (`.s239-swipe-dragging` posé par le moteur), le tiroir est peint et son
 *    opacité + l'échelle de l'action SUIVENT le doigt (--s239-swipe-progress).
 * ------------------------------------------------------------------------- */

/* Teinte ARCHIVE (bleue, réversible — même bleu que « Masquer » S173B) : les
   lignes réelles des listes Messages et Groupes portent `.is-archive` ; les
   tiroirs démo (Supprimer/Quitter) gardent le rouge historique S67A. */
html .group-row .group-row-action.is-archive {
  background-color: #1976d2;
}

/* Pendant le geste : tiroir peint, opacité = avancement du doigt. */
html .group-row.s239-swipe-dragging .group-row-action {
  visibility: visible;
  opacity: var(--s239-swipe-progress, 0);
}
/* Ligne OUVERTE : pleinement visible (S215 posait déjà la visibilité). */
html .group-row.is-swiped .group-row-action {
  visibility: visible;
  opacity: 1;
}
/* Opacité de REPOS explicitement NULLE (leçon S239 : sans elle, la valeur
   initiale 1 sert de point de départ au fondu ⇒ FLASH du tiroir à pleine
   opacité au premier pixel du geste). Double sécurité avec le
   `visibility: hidden` S215 : rien n'est peint au repos. */
html .group-row .group-row-action {
  opacity: 0;
  transition: opacity 0.12s linear;
}

/* L'action « arrive » avec le doigt : icône + libellé montent en échelle
   (transform seul — jamais un déplacement de mise en page). */
html .group-row.s239-swipe-dragging .group-row-action-btn {
  transform: scale(calc(0.86 + 0.14 * var(--s239-swipe-progress, 0)));
  transition: transform 0.12s ease-out;
}
html .group-row.is-swiped .group-row-action-btn {
  transform: none;
}

/* Icône AU-DESSUS du libellé (façon tiroir d'archivage des messageries
   modernes) — le glyphe est décoratif, le texte porte le sens. */
html .group-row .group-row-action-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
}

/* Retour/ouverture du rail : même courbe de décélération élastique que les
   cartes Profils S239 (le suivi du doigt reste piloté en JS, transition
   neutralisée pendant le geste). La géométrie 96px du moteur S67A/S151 est
   INCHANGÉE — seule la courbe de l'animation de fin change. */
html .group-row .group-row-content {
  transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.12s;
}

/* Accessibilité : aucune animation si l'utilisateur la refuse (le geste et
   l'archivage restent parfaitement fonctionnels). */
@media (prefers-reduced-motion: reduce) {
  html .group-row .group-row-action,
  html .group-row.s239-swipe-dragging .group-row-action-btn,
  html .group-row .group-row-content {
    transition: none;
  }
}