/* Comptabilité native Le Fil (js/compta/, spec docs/specs/2026-10-07-budget-accueil-design.md § 7) : écran « Comptes » d'un accueil et cahier /compta d'un séjour.
   Même langue que le budget (css/fil-budget.css, dont elle réutilise le socle : .fb, .fb-carte, .fb-bouton, .fb-feuille…) : encre, filets, couleur rare
   (ambre = ce qui reste à traiter, sapin = fait), pleine largeur, cibles de 44 px et plus. Préfixe fcm-. Remplace css/compta.css (classique, supprimé). */

.fcm-pile { display: block; }
.fcm-pile > * { margin: 0 0 12px; }
.fcm-titre-cahier { margin: 0 0 10px; font: 600 24px/1.25 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fcm-titre { font: 500 16px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fcm-sous { color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fcm-alerte { color: var(--f-attention); font: 500 14px/1.4 Inter, system-ui, sans-serif; }
.fcm-montant { font: 600 16px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fcm-saisie { margin-top: 0; }

/* Chiffres : caisse · banque · recettes · dépenses, puis le coût réel sur toute la largeur au téléphone */
.fcm-chiffres { margin-bottom: 12px; }
.fcm-chiffre--cout { grid-column: 1 / -1; }
.fcm-chiffre--cout .fb-chiffre-val { font-size: 30px; }
@media (min-width: 720px) { .fcm-chiffres { grid-template-columns: repeat(5, minmax(0, 1fr)); } .fcm-chiffre--cout { grid-column: auto; } .fcm-chiffre--cout .fb-chiffre-val { font-size: 24px; } }
.fcm-chiffres--deux { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 12px; }
.fcm-chiffres--deux .fb-chiffre-val { font-size: 24px; }

/* Listes touchables : brouillons, avances */
.fcm-liste { display: flex; flex-direction: column; margin-top: 4px; }
.fcm-brouillon { display: flex; align-items: stretch; gap: 8px; border-top: 1px solid var(--f-filet); }
.fcm-brouillon:first-child { border-top: 0; }
.fcm-brouillon-lib, .fcm-avance { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex: 1; min-width: 0; min-height: 60px; padding: 10px 0; border: 0; border-top: 1px solid var(--f-filet); background: transparent; color: var(--f-encre); text-align: left; font: inherit; cursor: pointer; }
.fcm-brouillon-lib { border-top: 0; }
.fcm-avance { width: 100%; }
.fcm-liste > .fcm-avance:first-child { border-top: 0; }
.fcm-brouillon-lib:hover, .fcm-avance:hover { background: var(--f-surface-2); }
.fcm-brouillon-texte, .fcm-avance-texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.fcm-avance-droite { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.fcm-brouillon > .fb-bouton { align-self: center; flex: none; }

/* Registre : une carte par pièce au téléphone, les 11 colonnes du cahier papier au bureau */
.fcm-defile { margin-top: 6px; }
.fcm-registre { display: block; }
.fcm-piece { box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "meta net" "lib lib" "vent vent" "sit sit"; gap: 4px 12px; width: 100%; min-height: 60px; padding: 12px 0; border: 0; border-top: 1px solid var(--f-filet); background: transparent; color: var(--f-encre); text-align: left; font: inherit; cursor: pointer; }
.fcm-registre > .fcm-piece:first-of-type { border-top: 0; }
button.fcm-piece:hover { background: var(--f-surface-2); }
.fcm-piece--tete { display: none; }
.fcm-piece--report, .fcm-piece--pied { cursor: default; color: var(--f-encre-2); }
.fcm-piece--pied { border-top: 2px solid var(--f-encre); font-weight: 600; }
.fcm-meta { grid-area: meta; display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; color: var(--f-encre-2); font: 500 14px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fcm-meta .fcm-c-num { color: var(--f-encre); font-weight: 600; }
.fcm-c { min-width: 0; overflow-wrap: anywhere; }
.fcm-c-lib { grid-area: lib; display: flex; flex-direction: column; gap: 2px; }
.fcm-c-vent { grid-area: vent; display: flex; flex-wrap: wrap; gap: 6px; }
.fcm-c-vent:empty { display: none; }
.fcm-c-sit { grid-area: sit; color: var(--f-encre-3); font: 400 12px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fcm-c-cr, .fcm-c-cd, .fcm-c-cs, .fcm-c-br, .fcm-c-bd, .fcm-c-bs { display: none; }
.fcm-net { grid-area: net; align-self: start; font: 600 16px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fcm-net[data-sens="gain"] { color: var(--f-fait); }
.fcm-net[data-sens="virement"] { color: var(--f-encre-2); }
.fcm-tag { display: inline-flex; justify-content: space-between; gap: 8px; padding: 3px 9px; border: 1px solid var(--f-filet); border-radius: 10px; font: 400 12px/1.4 Inter, system-ui, sans-serif; }
.fcm-tag-nature { color: var(--f-encre-2); }
.fcm-tag-montant { font-variant-numeric: tabular-nums; font-weight: 500; white-space: nowrap; }
@media (min-width: 1000px) { .fcm-c-vent { flex-direction: column; align-items: stretch; gap: 4px; } }
.fcm-piece.is-annulee .fcm-titre, .fcm-piece.is-annulee .fcm-net, .fcm-piece.is-annulee .fcm-c-vent { text-decoration: line-through; color: var(--f-encre-3); }
.fcm-piece.is-annulation .fcm-titre { font-style: italic; }
.fcm-piece--report .fcm-c-lib, .fcm-piece--pied .fcm-c-lib { font: 500 16px/1.3 Inter, system-ui, sans-serif; }
.fcm-piece--report .fcm-meta, .fcm-piece--pied .fcm-meta { display: none; }
.fcm-piece--report, .fcm-piece--pied { grid-template-areas: "lib" "sit"; grid-template-columns: minmax(0, 1fr); }
.fcm-piece--report .fcm-c-sit, .fcm-piece--pied .fcm-c-sit { color: var(--f-encre-2); font-size: 14px; }

@media (min-width: 1000px) {
  .fcm-registre { --fcm-cols: 36px 46px 46px minmax(140px, 2.6fr) repeat(6, minmax(66px, 0.8fr)) minmax(190px, 1.8fr); }
  .fcm-defile { overflow-x: auto; }
  .fcm-registre { min-width: 930px; }
  .fcm-piece { grid-template-columns: var(--fcm-cols); grid-template-areas: none; align-items: start; gap: 4px 8px; padding: 10px 0; }
  .fcm-meta { display: contents; }
  .fcm-c-lib, .fcm-c-vent, .fcm-net, .fcm-c-sit { grid-area: auto; }
  .fcm-net, .fcm-c-sit { display: none; }
  .fcm-c-cr, .fcm-c-cd, .fcm-c-cs, .fcm-c-br, .fcm-c-bd, .fcm-c-bs { display: block; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .fcm-c-num, .fcm-c-date, .fcm-c-mode { font: 500 14px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; color: var(--f-encre-2); }
  .fcm-c-num { color: var(--f-encre); font-weight: 600; }
  .fcm-piece--tete { display: grid; position: sticky; top: 0; cursor: default; color: var(--f-encre-2); font: 500 12px/1.3 Inter, system-ui, sans-serif; border-top: 0; border-bottom: 1px solid var(--f-encre); min-height: 0; }
  .fcm-piece--tete .fcm-c { display: block; white-space: normal; }
  .fcm-piece--tete .fcm-c-cr, .fcm-piece--tete .fcm-c-cd, .fcm-piece--tete .fcm-c-cs, .fcm-piece--tete .fcm-c-br, .fcm-piece--tete .fcm-c-bd, .fcm-piece--tete .fcm-c-bs { text-align: right; }
  .fcm-piece--report, .fcm-piece--pied { grid-template-areas: none; grid-template-columns: var(--fcm-cols); }
  .fcm-piece--report .fcm-meta, .fcm-piece--pied .fcm-meta { display: contents; }
  .fcm-piece--report .fcm-c-lib, .fcm-piece--pied .fcm-c-lib { font-size: 14px; }
  .fcm-c-cs, .fcm-c-bs { font-weight: 600; }
}

/* Ventilation UFCV (repliée) */
.fcm-ufcv { margin-top: 10px; }
.fcm-ufcv-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.fcm-ufcv-cellule { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--f-filet); border-radius: 14px; background: var(--f-surface-2); }
.fcm-ufcv-lib { color: var(--f-encre-2); font: 400 12px/1.4 Inter, system-ui, sans-serif; }
.fcm-ufcv-val { font: 600 16px/1.3 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }

/* Détail d'une pièce (feuille) */
.fcm-detail-titre { margin: 0 0 8px; font: 600 18px/1.3 Inter, system-ui, sans-serif; overflow-wrap: anywhere; }
.fcm-detail { margin: 0; }
.fcm-detail-ligne { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-top: 1px solid var(--f-filet); font: 400 14px/1.4 Inter, system-ui, sans-serif; }
.fcm-detail-ligne:first-child { border-top: 0; }
.fcm-detail dt { color: var(--f-encre-2); }
.fcm-detail dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fcm-detail-bouton { margin-top: 12px; }
.fcm-justif { display: block; max-width: 100%; max-height: 70dvh; margin: 0 auto; border-radius: 14px; }
.fcm-justif--pdf { width: 100%; height: 70dvh; border: 1px solid var(--f-filet); }
.fcm-fichier { padding: 10px 12px; }

/* Saisie : ventilation */
.fcm-vent-lignes { display: flex; flex-direction: column; gap: 8px; }
.fcm-vent-ligne { display: grid; grid-template-columns: minmax(0, 1fr) 112px auto; gap: 8px; align-items: center; }
.fcm-vent-ajout { margin-top: 6px; }
.fcm-reste { margin: 10px 0 0; padding: 12px 14px; border-radius: 14px; background: var(--f-surface-2); font: 500 14px/1.45 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.fcm-reste[data-etat="ok"] { color: var(--f-fait); }
.fcm-reste[data-etat="attention"] { color: var(--f-attention); }
.fcm-vers { margin: 0; min-height: 48px; display: flex; align-items: center; padding: 0 12px; border: 1px dashed var(--f-filet); border-radius: 14px; color: var(--f-encre-2); }
@media (max-width: 420px) { .fcm-vent-ligne { grid-template-columns: minmax(0, 1fr) 104px; } .fcm-vent-ligne > .fb-bouton { grid-column: 1 / -1; justify-self: end; } }

/* Contrôles et clôture */
.fcm-controle { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 4px 12px; align-items: baseline; padding: 12px 0; border-top: 1px solid var(--f-filet); }
.fcm-liste > .fcm-controle:first-child { border-top: 0; }
.fcm-controle-mot { color: var(--f-encre-2); font: 600 12px/1.4 Inter, system-ui, sans-serif; }
.fcm-controle[data-etat="ok"] .fcm-controle-mot { color: var(--f-fait); }
.fcm-controle[data-etat="attention"] .fcm-controle-mot { color: var(--f-attention); }
.fcm-controle-texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fcm-ecart { font: 600 14px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; color: var(--f-attention); white-space: nowrap; }
@media (max-width: 520px) { .fcm-controle { grid-template-columns: minmax(0, 1fr) auto; } .fcm-controle-mot { grid-column: 1 / -1; } }
.fcm-acquit { padding: 4px 0; border-top: 1px solid var(--f-filet); }

/* Remboursement */
.fcm-rembourse { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 56px; padding: 6px 0; border-top: 1px solid var(--f-filet); cursor: pointer; }
.fcm-rembourse input { width: 24px; height: 24px; margin: 0; accent-color: var(--f-encre); }
.fcm-rembourse-texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

/* Cahier pas encore ouvert */
.fcm-absent { max-width: 720px; }

@media print {
  .fcm .fb-segments, .fcm .fb-bouton, .fcm .fcm-exports, .fcm .fcm-saisie { display: none !important; }
  .fcm-defile { overflow: visible; }
  .fcm-registre { min-width: 0; }
}

/* Titre de la carte Registre : la situation se lit sous le titre au téléphone (jamais de débordement) */
.fcm-registre-carte .fb-carte-ligne { flex-wrap: wrap; row-gap: 2px; }
.fcm-registre-carte .fb-carte-total { white-space: normal; color: var(--f-encre-2); font: 400 14px/1.4 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums; }