/* « Préparer les trajets » : l'éditeur des trajets de l'aller et du retour (js/convoyage/trajets-vue.js, audit directeur du 2026-10-15, lot TR).
   Préfixe fct-, jetons --f-* de css/fil.css, kit du budget (css/fil-budget.css : .fb, .fb-carte, .fb-bouton, .fb-feuille…). Ce fichier ne porte que ce qui est propre à l'éditeur.
   Style de Le Fil : encre, filets, couleur rare (ambre = ce qui reste à faire, sapin = fait), cibles de 44 px et plus, aucune lueur ni ombre colorée sur les cartes.
   Les feuilles (.fb-voile) sont posées dans <body> : leurs règles ne dépendent donc d'AUCUN ancêtre (pas de `.fct` devant), et le socle du Fil (min-height 44 px sur tout
   `button`, qui ne vaut que sous [data-app]) y est redit à la main. */

/* ---------- La page : une colonne au téléphone, l'aller et le retour côte à côte au bureau ---------- */
.fct [hidden] { display: none !important; }
.fct { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 8px 32px; }
.fct-tete, .fct-pied { grid-column: 1 / -1; }
.fct-tete { padding: 4px 0 8px; }
.fct-intro { max-width: 70ch; margin: 0; color: var(--f-encre-2); font: 400 16px/1.5 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-sens { min-width: 0; margin: 0 0 16px; }
.fct-sens-tete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 8px 0 10px; padding: 0 0 8px; border-bottom: 1px solid var(--f-filet); }
.fct-sens-titre { margin: 0; font: 600 24px/1.25 Inter, system-ui, sans-serif; }
.fct-sens-jour { color: var(--f-encre-2); font: 400 16px/1.3 Inter, system-ui, sans-serif; }
.fct-alerte { margin: 0 0 10px; padding: 10px 12px; border-left: 3px solid var(--f-attention); border-radius: 10px; background: var(--f-surface-2); color: var(--f-encre); font: 500 14px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-cartes { display: grid; gap: 12px; min-width: 0; margin: 0 0 12px; }
@media (min-width: 1000px) { .fct { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Une carte de trajet ---------- */
.fb-carte.fct-carte { display: grid; gap: 8px; min-width: 0; padding: 16px; }
.fct-haut { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 4px 14px; min-width: 0; }
.fct-heure { min-width: 3.4ch; font: 600 24px/1.2 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fct-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fct-titre { margin: 0; font: 600 16px/1.35 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-sous { margin: 0; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fct-gens { margin: 0; font: 400 14px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-n { font: 600 16px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fct-gens[data-etat="attention"], .fct-manque[data-etat="attention"] { color: var(--f-attention); }
.fct-manque { margin: 0; font: 400 14px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-pointes { justify-self: start; }
.fct-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.fct-actions .fb-bouton { flex: 1 1 auto; }
.fct-ajout { width: 100%; }
.fct-ordre { margin: 0 0 12px; }
.fct-ordre[data-etat="attention"] { color: var(--f-attention); }
.fct-vide { display: grid; gap: 8px; padding: 16px; }
.fct-vide .fb-carte-titre { margin: 0; }
.fct-vide .fb-note { margin: 0; }
.fct-vide .fb-bouton { justify-self: stretch; }
.fct-pied { margin: 8px 0 0; padding: 12px 0 0; border-top: 1px solid var(--f-filet); }
.fct-lien { text-decoration: none; }
.fct-etat { display: grid; gap: 8px; }

/* ---------- Les feuilles : trajet et « Qui voyage » (posées dans <body>, aucun ancêtre) ---------- */
.fct-lib { margin: 0 0 6px; color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; }
.fct-sous-titre { margin: 0 0 4px; color: var(--f-encre-2); font: 500 14px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-modes { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.fct-mode { min-height: 44px; padding: 0 16px; border: 1px solid var(--f-filet); border-radius: 99px; background: var(--f-surface); color: var(--f-encre); font: 500 14px/1 Inter, system-ui, sans-serif; cursor: pointer; }
.fct-mode:hover { background: var(--f-surface-2); }
.fct-mode[aria-checked="true"] { background: var(--f-encre); border-color: var(--f-encre); color: var(--f-fond); }
.fct-details { margin: 12px 0 0; }
.fct-reassure { margin: 12px 0 0; }
.fct-rapides { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.fct-rapides .fb-bouton { flex: 1 1 auto; }
.fct-groupe { margin: 0 0 8px; }
.fct-groupe-tete { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 44px; padding: 4px 0; border-bottom: 1px solid var(--f-filet); }
.fct-groupe-nom { flex: 1 1 auto; min-width: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-groupe-n { color: var(--f-encre-2); font: 500 14px/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fct-groupe-tout { min-height: 44px; padding: 0 12px; }
.fct-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; min-height: 48px; padding: 6px 0; border-top: 1px solid var(--f-filet); font: 400 16px/1.3 Inter, system-ui, sans-serif; cursor: pointer; }
.fct-groupe-tete + .fct-ligne { border-top: 0; }
.fct-ligne input[type="checkbox"] { flex: none; width: 24px; height: 24px; margin: 0; accent-color: var(--f-encre); }
.fct-nom { flex: 1 1 8ch; min-width: 0; overflow-wrap: anywhere; }
.fct-meta { color: var(--f-encre-2); font: 400 14px/1.3 Inter, system-ui, sans-serif; }
.fct-aussi, .fct-pointe, .fct-sans-compte { flex: none; }
.fct-pointe { color: var(--f-fait); border-color: var(--f-fait); }
.fct-sans-compte { color: var(--f-attention); border-color: var(--f-attention); }
.fct-accomp { border-top: 1px solid var(--f-filet); }
.fct-accomp > .fct-ligne { border-top: 0; }
.fct-accomp-sous { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 10px 36px; }
.fct-tel { flex: 1 1 180px; width: auto; min-width: 0; }
.fct-chef { min-height: 44px; padding: 0 14px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface); color: var(--f-encre); font: 500 14px/1 Inter, system-ui, sans-serif; cursor: pointer; }
.fct-chef[aria-pressed="true"] { background: var(--f-encre); border-color: var(--f-encre); color: var(--f-fond); }
.fct-resume { margin: 12px 0 0; padding: 10px 12px; border-left: 3px solid var(--f-filet); border-radius: 10px; background: var(--f-surface-2); color: var(--f-encre-2); font: 500 14px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fct-resume[data-etat="attention"] { border-left-color: var(--f-attention); color: var(--f-encre); }

/* ---------- Les deux entrées de l'éditeur, posées sur l'écran de direction du convoyage (js/convoyage/views.js, js/convoyage/feuille-vue.js) ---------- */
.fct-bandeau { display: grid; gap: 8px; margin: 0 0 12px; padding: 16px; min-width: 0; }
.fct-bandeau .fb-carte-titre { margin: 0; }
.fct-bandeau .fb-note { margin: 0; }
.fct-bandeau-lien { justify-self: start; text-decoration: none; }
.fct-lien-trajets { align-self: start; margin: 0 0 12px; text-decoration: none; }
@media (max-width: 520px) { .fct-bandeau-lien { justify-self: stretch; } }
