/* Les frais kilométriques, natifs Le Fil (js/frais/views.js : déclarer un trajet, barème du séjour, trajets déclarés, totaux par personne, export CSV).
   Préfixe ffr-, jetons --f-* de css/fil.css. Kit du budget (css/fil-budget.css : .fb, .fb-carte, .fb-formulaire, .fb-bouton…) ; ce fichier ne porte que ce qui est propre aux frais.
   Style de Le Fil : encre, filets, couleur rare (sapin = validé, brique = suppression armée), cibles de 44 px et plus, sept tailles de texte (12, 14, 16, 18, 24, 30, 64), aucun effet.
   Remplace css/frais.css (classique, préfixe frk-, supprimé). */

.ffr [hidden] { display: none !important; }
.ffr-pile { display: grid; gap: 12px; align-items: start; min-width: 0; }
.ffr-col { display: grid; gap: 12px; align-content: start; min-width: 0; }
@media (min-width: 1000px) { .ffr-pile { grid-template-columns: minmax(340px, 440px) minmax(0, 1fr); gap: 20px; } }

/* ---------- Saisie ---------- */
.ffr-formulaire { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; }
.ffr-formulaire > .fb-champ--large { grid-column: 1 / -1; }
@media (max-width: 560px) { .ffr-formulaire > .fb-champ:nth-child(n+3) { grid-column: 1 / -1; } }
.ffr-erreur { margin: 10px 0 0; }
.ffr-declarer { flex: 1 1 auto; }

/* ---------- Barème ---------- */
.ffr-taux-ligne { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-top: 10px; }
.ffr-taux-ligne .fb-champ { flex: 1 1 200px; max-width: 280px; }

/* ---------- Trajets ---------- */
.ffr-count { color: var(--f-encre-2); font-weight: 500; }
.ffr-export-zone { margin: 8px 0 4px; }
.ffr-liste, .ffr-totaux { margin: 4px 0 0; padding: 0; list-style: none; }
.ffr-ligne { display: grid; gap: 4px; min-width: 0; padding: 12px 0; border-top: 1px solid var(--f-filet); }
.ffr-ligne:first-child { border-top: 0; }
.ffr-ligne-haut { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.ffr-date { color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.ffr-auteur { min-width: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.ffr-chiffres { display: flex; align-items: baseline; gap: 12px; margin-left: auto; }
.ffr-km, .ffr-eur { font: 600 16px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ffr-meta { color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.ffr-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.ffr-valider.on { border-color: var(--f-fait); color: var(--f-fait); }
.ffr-suppr { min-width: 48px; }
.ffr-suppr.is-armed { border-color: var(--f-urgent); color: var(--f-urgent); }

/* ---------- Totaux par personne ---------- */
.ffr-total { display: flex; align-items: baseline; gap: 12px; min-height: 48px; padding: 10px 0; border-top: 1px solid var(--f-filet); }
.ffr-total:first-child { border-top: 0; }
.ffr-total-nom { flex: 1 1 auto; min-width: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }