/* ============================================================================
   ÉCRAN — COMPTES, CHÉQUIERS ET SIGNATAIRES (TRE-01)

   Feuille d'ÉCRAN : ces classes servent au premier écran du domaine Trésorerie
   (docs/modeles/design_handoff_easycompta, TRE-01), et à lui seul. Le préfixe
   .t1- est celui de la maquette, gardé pour que l'écran et sa référence de
   conception se lisent en regard.

   CE QUI N'EST PAS ICI : la vignette d'indicateur. .t1-fait et .t1-faits sont
   dessinés par css/easycompta-vignette.css, gabarit du MODULE — fond, filet,
   bord gauche coloré par --vig, mono capitales. Cette feuille ne pose que la
   grille qui les range, jamais leur apparence : deux dessins de vignette, c'est
   exactement ce que la passation a tranché.

   AUCUNE COULEUR EN DUR : tout vient des jetons --et-*.
   ========================================================================== */

/* La barre d'onglets Comptes / Chéquiers / Signataires n'est PAS ici : c'est
   .eca-onglets, du gabarit de module (css/easycompta-onglets.css) — quatre
   écrans du domaine la portent. */

/* La bande d'indicateurs : quatre colonnes, deux sous 1024 px (le repli est
   dans la feuille de vignette, avec le reste du gabarit). */

/* Une ligne de compte s'ouvre au clic : elle se comporte comme un lien. */
.appgrid .t1-ligne:hover { background: var(--et-surface-3); cursor: pointer; }
.appgrid .t1-ligne.est-choisie { background: var(--et-tint); }
.appgrid .t1-terne td { opacity: .55; }

/* Blocs de la fiche, en fenêtre : un groupe, ses champs, son aide. */
.xp-corps .t1-bloc, .appgrid .t1-bloc { padding: 12px 0; border-bottom: 1px solid var(--et-hairline); }
.xp-corps .t1-bloc:last-child, .appgrid .t1-bloc:last-child { border-bottom: 0; }
.xp-corps .t1-groupe, .appgrid .t1-groupe { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.xp-corps .t1-groupe::before, .appgrid .t1-groupe::before { content: ""; flex: none; width: 3px; height: 14px; background: var(--et-form-blue); }
.xp-corps .t1-groupe > span, .appgrid .t1-groupe > span { font-family: var(--et-font-mono); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--et-table-head-encre); }

.xp-corps .t1-form, .appgrid .t1-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 14px; }
.xp-corps .t1-large, .appgrid .t1-large { grid-column: 1 / -1; }
.xp-corps .t1-lab, .appgrid .t1-lab { display: block; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--et-muted); margin-bottom: 2px; }
.xp-corps .t1-val, .appgrid .t1-val { font-family: var(--et-font-mono); font-size: 14px; color: var(--et-ink); }
.xp-corps .t1-aide, .appgrid .t1-aide { margin-top: 3px; font-size: 12px; color: var(--et-faint); line-height: 1.45; }

/* Une ligne de la fiche : carte, signataire, état du compte. */
.xp-corps .t1-item { display: flex; align-items: baseline; gap: 8px; padding: 4px 0; border-bottom: 1px solid var(--et-hairline); }
.xp-corps .t1-item:last-child { border-bottom: 0; }

.appgrid .t1-chip, .xp-corps .t1-chip { display: inline-block; padding: 1px 7px; background: var(--et-surface-3); border: 1px solid var(--et-form-border); font-family: var(--et-font-mono); font-size: 12px; font-weight: 600; white-space: nowrap; }

/* Le mot de la fin sous chaque table : d'où viennent les données, ce que la
   règle empêche. La passation en fait une partie de l'écran, pas une note. */
.appgrid .t1-mot { margin-top: 10px; font-size: 12px; color: var(--et-muted); line-height: 1.6; }

@media (max-width: 1024px) {
  .appgrid .t1-form { grid-template-columns: minmax(0, 1fr); }
}