/* Centres natifs Le Fil (js/centres/) : catalogue #/centres (kit js/fil/liste.js, fli-), fiche #/centres/<id>, carte « Centre » de la page d'un séjour, recherche de centre (combobox),
   fiche pratique avec provenance, ressources autour, espaces du centre dans le planning, suggestions de lieu du convoyage. Remplace css/centres.css et css/centres-catalogue.css
   (classes ctr-* et cen-*, supprimées). Préfixe fce-, jetons --f-* de css/fil.css seulement ; boutons, champs et cartes sont ceux du budget (fb-, css/fil-budget.css). Certains blocs sont
   posés hors d'une racine `fb` (page d'un séjour, panneau du planning, formulaire du convoyage) : leurs règles ne dépendent donc pas de `.fb`. */
.fce, .fce-zone, .fce-espaces, .fce-suggest, .fce-champ-zone { font-family: Inter, system-ui, sans-serif; color: var(--f-encre); }
.fce [hidden], .fce-zone [hidden], .fce-espaces[hidden], .fce-suggest[hidden], .fce-rech [hidden], .fce-champ-zone [hidden], .fli-centres [hidden] { display: none !important; }
.fce-zone :focus-visible, .fce-espaces :focus-visible, .fce-suggest :focus-visible, .fce-champ-zone :focus-visible { outline: 2px solid var(--f-encre); outline-offset: 3px; }
.fce-lien { overflow-wrap: anywhere; }
/* Un lien d'une fiche (téléphone, e-mail, site, source, carte) est une cible : 44 px de haut. */
.fce-fiche a, .fce-bandeau a { display: inline-flex; align-items: center; min-height: 44px; }
.fce-aide, .fce-statut, .fce-vide, .fce-attente, .fce-notes { margin: 0; color: var(--f-encre-2); font: 400 14px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-statut { margin-top: 4px; }
.fce-erreur, .fce-echec { margin: 0; color: var(--f-urgent); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fce-flash { margin: 8px 0 0; }

/* ---------- Carte « Centre » (page du séjour, sous les chiffres clés) ---------- */
.fce-zone { padding-top: 12px; padding-bottom: 12px; }
.fce-carte { display: grid; gap: 12px; min-width: 0; }
.fce-carte[data-etat="proposition"] { border-color: var(--f-encre); }
.fce-tete { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; align-items: start; }
.fce-titre { grid-column: 1; margin: 0; font: 600 18px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-titre:focus { outline: none; }
.fce-sous { grid-column: 1; margin: 2px 0 0; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fce-bascule { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.fce-corps { display: grid; gap: 16px; min-width: 0; }
.fce-grille { display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); min-width: 0; }
.fce-col { display: grid; gap: 8px; align-content: start; min-width: 0; }
.fce-h { margin: 8px 0 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; }
.fce-h:first-child { margin-top: 0; }
.fce-proposition { margin: 0; font: 500 18px/1.35 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.fce-pied { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--f-filet); justify-items: start; }
.fce-attrib-zone:empty { display: none; }
.fce-attributions { margin: 0; color: var(--f-encre-3); font: 400 12px/1.5 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }

/* ---------- Fiche pratique : une ligne par donnée, la provenance dessous ---------- */
.fce-fiche-bloc { display: grid; gap: 12px; min-width: 0; }
.fce-fiche { display: grid; gap: 0; margin: 0; }
.fce-ligne { display: grid; grid-template-columns: minmax(6rem, 9rem) minmax(0, 1fr); gap: 4px 16px; padding: 10px 0; border-top: 1px solid var(--f-filet); }
.fce-ligne:first-child { border-top: 0; }
.fce-ligne-lib { margin: 0; color: var(--f-encre-2); font: 500 14px/1.4 Inter, system-ui, sans-serif; }
.fce-ligne-val { margin: 0; min-width: 0; font: 400 16px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-note { color: var(--f-encre-2); font-size: 14px; }
/* Bandeau de source : UN par fiche, en tête ; il dit d'où viennent les champs à vérifier et porte « Tout confirmer ». */
.fce-bandeau { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 12px 14px; border: 1px solid var(--f-attention); border-radius: 18px; background: var(--f-surface); }
.fce-bandeau-txt { flex: 1 1 16rem; min-width: 0; margin: 0; font: 400 14px/1.45 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-lien-source { white-space: nowrap; }
.fce-tout-confirmer { flex: none; }
.fce-tout-confirmer:disabled, .fce-confirmer-un:disabled { opacity: .5; cursor: default; }
/* Par champ : « à vérifier » en ambre, puis « Confirmer » (cible de 44 px) sur la même ligne. */
.fce-verif { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin-top: 4px; }
.fce-marque { color: var(--f-attention); font: 500 14px/1.2 Inter, system-ui, sans-serif; white-space: nowrap; }
.fce-confirmer-un { 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.2 Inter, system-ui, sans-serif; cursor: pointer; }
.fce-confirmer-un:hover { background: var(--f-surface-2); }

/* ---------- Ressources autour : « Pharmacie · Villé · 4,2 km » ---------- */
.fce-ressources { display: grid; gap: 8px; min-width: 0; }
.fce-approx { margin: 0; padding: 10px 14px; border: 1px solid var(--f-attention); border-radius: 14px; font: 400 14px/1.45 Inter, system-ui, sans-serif; }
.fce-res-liste { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.fce-res { padding: 10px 0; border-top: 1px solid var(--f-filet); font: 400 16px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-res:first-child { border-top: 0; }
.fce-res-lib { font-weight: 600; }
.fce-res-dist { font-variant-numeric: tabular-nums; white-space: nowrap; }
.fce-res-aucun { color: var(--f-encre-2); font-size: 14px; }
.fce-memoire { display: grid; gap: 4px; justify-items: start; }
.fce-memoire-ligne { margin: 0; font: 400 16px/1.45 Inter, system-ui, sans-serif; }
.fce-lien-fiche { display: inline-flex; align-items: center; min-height: 44px; }

/* ---------- Recherche de centre (combobox) ---------- */
.fce-champ-zone, .fce-rech-bloc { display: grid; gap: 8px; min-width: 0; margin-top: 4px; }
.fce-rech { display: grid; gap: 8px; min-width: 0; }
.fce-liste { margin: 0; padding: 0; list-style: none; background: var(--f-surface); border: 1px solid var(--f-encre-3); border-radius: 18px; overflow: hidden; }
.fce-option { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-height: 48px; padding: 10px 14px; border-top: 1px solid var(--f-filet); cursor: pointer; }
.fce-option:first-child { border-top: 0; }
.fce-option-nom { font: 600 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-option-meta { color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fce-option:hover, .fce-option.est-actif { background: var(--f-surface-2); }
.fce-option.est-actif { box-shadow: inset 3px 0 0 var(--f-encre); }
.fce-option-ajout { font-weight: 600; }
.fce-lie { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 0; padding: 8px 14px; border: 1px solid var(--f-fait); border-radius: 14px; font: 400 14px/1.45 Inter, system-ui, sans-serif; }
.fce-lie-txt { flex: 1 1 14rem; min-width: 0; }
.fce-creation { display: grid; gap: 12px; padding: 14px; background: var(--f-surface-2); border: 1px solid var(--f-filet); border-radius: 18px; }
.fce-creation-titre { margin: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; }
.fce-retour { display: grid; gap: 8px; justify-items: start; }
.fce-doublon { margin: 0; font: 400 14px/1.45 Inter, system-ui, sans-serif; }

/* ---------- Espaces du centre (fiche) et préremplissage du planning ---------- */
.fce-espaces-liste { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; padding: 0; list-style: none; }
.fce-espace { display: inline-flex; align-items: center; gap: 4px; padding: 0 0 0 14px; background: var(--f-surface-2); border: 1px solid var(--f-filet); border-radius: 14px; font: 400 14px/1.3 Inter, system-ui, sans-serif; }
.fce-espace .fb-bouton { min-height: 44px; padding: 0 12px; }
.fce-espaces-ajout { display: flex; flex-wrap: wrap; gap: 8px; }
.fce-espaces-ajout input { flex: 1 1 14rem; min-width: 0; }
.fce-espaces { display: grid; gap: 8px; justify-items: start; margin: 8px 0; padding: 12px 14px; background: var(--f-surface-2); border: 1px solid var(--f-filet); border-radius: 18px; }

/* ---------- Convoyage : suggestions sous le champ de lieu ---------- */
.fce-suggest { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 4px 0 12px; }
.fce-suggest-lib { color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fce-suggest-puce { min-height: 44px; padding: 0 14px; font: 400 14px/1.3 Inter, system-ui, sans-serif; text-align: left; color: var(--f-encre); background: var(--f-surface-2); border: 1px solid var(--f-filet); border-radius: 14px; cursor: pointer; overflow-wrap: anywhere; }
.fce-suggest-puce:hover { border-color: var(--f-encre-3); }

/* ---------- Catalogue : « fréquentés », puis tout le catalogue, paginé ---------- */
.fce-modes { margin: 0 0 16px; }
.fb-segment.fce-mode { height: auto; padding: 8px 12px; line-height: 1.25; white-space: normal; }
.fb-segment.fce-mode[aria-pressed="true"] { background: var(--f-encre); color: var(--f-fond); }
.fce-pistes { display: grid; gap: 8px; justify-items: start; margin: 12px 0; }
.fce-pistes:empty { display: none; }
.fce-pistes-texte { margin: 0; color: var(--f-encre-2); font: 400 14px/1.45 Inter, system-ui, sans-serif; }
.fce-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 16px 0; }
.fce-page-pos { margin: 0; color: var(--f-encre-2); font: 400 14px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fli-centres .fli-lien { display: inline-flex; align-items: center; min-height: 44px; }
.fli-centres .fli-etat[data-etat="erreur"] { color: var(--f-urgent); }
form.fli-filtres.fce-filtres { grid-template-columns: minmax(0, 1fr); }
.fce-filtres-champs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-items: end; }
.fce-filtres-champs > * { margin-top: 0; }
.fce-type .fli-menu-bouton { height: 100%; }
.fli-centres .fce-carte-form { margin-top: 20px; }
.fce-carte-form > .fb-carte-ligne + * { margin-top: 12px; }
.fce-carte-form > * + * { margin-top: 12px; }

/* ---------- Fiche : moyennes, séjours liés, évaluation, historique ---------- */
.fce-pile .fb-carte > * + * { margin-top: 12px; }
.fce-pile .fb-carte > .fb-carte-ligne + * { margin-top: 8px; }
.fce-moys { display: grid; gap: 8px; }
.fce-moy { display: grid; grid-template-columns: minmax(7rem, 1fr) 2fr 3rem; gap: 12px; align-items: center; }
.fce-moy-lib { font: 500 14px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-moy-val { color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; text-align: right; }
.fce-barre { height: 8px; border-radius: 99px; background: var(--f-surface-2); border: 1px solid var(--f-filet); overflow: hidden; }
.fce-barre-fill { height: 100%; background: var(--f-encre); }
.fce-liens { display: grid; gap: 4px; }
.fce-lien-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.fce-lien-nom { flex: 1 1 10rem; min-width: 0; font: 500 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-lier select { flex: 1 1 12rem; min-width: 0; }
.fce-criteres { display: grid; gap: 16px; }
.fce-critere { display: grid; gap: 8px; }
.fce-notes-boutons { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.fce-verdict { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.fb-bouton.fce-note { min-height: 48px; padding: 0; }
.fb-bouton.fce-verdict-bouton { min-width: 96px; }
.fb-bouton.fce-note[aria-pressed="true"] { background: var(--f-encre); color: var(--f-fond); border-color: var(--f-encre); }
.fce-eval { display: grid; gap: 4px; padding: 12px 0; border-top: 1px solid var(--f-filet); justify-items: start; }
.fce-eval-top { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.fce-eval-sejour { font: 600 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-eval-meta { margin: 0; color: var(--f-encre-3); font: 400 12px/1.4 Inter, system-ui, sans-serif; }
.fce-eval-comm { margin: 0; font: 400 14px/1.5 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fce-eval-notes { display: grid; gap: 4px; width: 100%; padding-left: 12px; }
.fce-note-ligne { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.fce-note-comm { color: var(--f-encre-3); font: 400 12px/1.4 Inter, system-ui, sans-serif; }

/* ---------- Écrans larges, puis téléphone ---------- */
@media (min-width: 520px) {
  .fce-filtres-champs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .fce-grille { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
  .fce-filtres-champs { grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr); }
}
@media (max-width: 520px) {
  .fce-ligne { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .fce-moy { grid-template-columns: minmax(0, 1fr) 3rem; }
  .fce-moy .fce-moy-lib { grid-column: 1 / -1; }
}