/* Ventes sur iPhone : lignes à glisser (SwipeRow.js) et fiche d'une vente (screens/ventes/SaleDetail.js).
   Repris de la maquette validée par Dylan le 27/09/2026 (D5 : consulter ouvre une page, modifier une feuille). */

/* ---- Ligne à glisser vers la gauche : défilement horizontal natif, aimanté ---- */
.swipe-row { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.swipe-row::-webkit-scrollbar { display: none; }
.swipe-track { display: flex; width: 100%; }
.swipe-track > :first-child { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; }
.swipe-actions { flex: none; display: flex; scroll-snap-align: end; }
.sa {
  width: 84px; border: 0; color: #fff; display: grid; place-items: center; align-content: center; gap: 2px;
  font: inherit; font-size: 12.5px; font-weight: 650; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.sa-green { background: #1FA97A; }
.sa-red { background: #E5484D; }
.sa:disabled { opacity: 0.45; cursor: default; }

/* ---- Fiche d'une vente ---- */
.dh { display: grid; justify-items: center; text-align: center; gap: 4px; margin: 4px 0 var(--s-5); }
.dh-av { width: 64px; height: 64px; font-size: 30px; margin-bottom: 6px; }
.dh-name { margin: 0; font-size: 26px; font-weight: 750; letter-spacing: -0.02em; }
.dh-sub { margin: 0; color: var(--text-2); font-size: 15px; }
.dh-amt { margin: 6px 0 4px; font-size: 36px; font-weight: 750; letter-spacing: -0.03em; }
.prog-top { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-3); margin-bottom: var(--s-2); font-size: 15px; color: var(--text-2); }
.prog-top b { color: var(--text); font-size: 17px; }
.prog-top small { font-size: 13px; font-weight: 500; color: var(--text-3); }
.fiche .card .caption { margin-top: var(--s-2); }
.sec-t { margin: var(--s-6) 4px var(--s-2); font-size: 20px; font-weight: 700; letter-spacing: -0.015em; }
.ech { cursor: pointer; }
.ech:disabled { cursor: default; opacity: 1; }
.chk {
  width: 26px; height: 26px; flex: none; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--fill-2);
  display: grid; place-items: center; color: transparent; transition: background 0.25s var(--ease), box-shadow 0.25s var(--ease), color 0.2s;
}
.done .chk { background: var(--green); box-shadow: none; color: #fff; }
.done.pop .chk { animation: chkPop 0.45s var(--spring-snappy); } /* seulement l'échéance qu'on vient de cocher */
@keyframes chkPop { 0% { transform: scale(0.7); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }
.kv { display: flex; align-items: center; gap: var(--s-3); min-height: 50px; padding: var(--s-2) var(--s-4); }
.list li + li.kv { border-top: 1px solid var(--line); }
.kv .k { flex: 1; color: var(--text-2); font-size: 15px; }
.kv .v { font-weight: 600; font-size: 15px; text-align: right; }
.fiche .actions { margin-top: var(--s-5); }
/* Écran tactile : pas de fond « survolé » qui reste collé après un toucher */
@media (hover: none) { .sale-row:hover { background: transparent; } .sale-row:active { background: var(--fill-2); } }
