/* ============================================================================
   ÉCRAN — OPÉRATIONS DE CHANGE (TRE-08)

   Feuille d'ÉCRAN. Préfixe .x8-, celui de la maquette de la passation
   (docs/modeles/design_handoff_easycompta, TRE-08).

   CE QUI N'EST PAS ICI : la bande de parités (.x8-parite / .x8-parites, dessinée
   par la feuille de module css/easycompta-vignette.css — c'est une vignette) et
   les fenêtres (.xp-*, css/easycompta-modal.css). Cette feuille pose les titres
   de section, les blocs de fiche et le petit tableau d'écriture.
   ========================================================================== */

.appgrid .x8-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; }

.appgrid .x8-ligne { cursor: pointer; }
.appgrid .x8-ligne:hover { background: var(--et-surface-3); }

.appgrid .x8-titre { display: flex; align-items: center; gap: 9px; margin: 18px 0 4px; padding-bottom: 5px; border-bottom: 2px solid var(--et-filet-fort); }
.appgrid .x8-titre::before { content: ""; flex: none; width: 3px; height: 14px; background: var(--et-form-blue); }
.appgrid .x8-titre 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); }
.appgrid .x8-note { margin: 6px 0 10px; max-width: 92ch; font-size: 12px; line-height: 1.6; color: var(--et-muted); }

.appgrid .x8-paire, .xp-corps .x8-paire { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }

@media (max-width: 1024px) {
  .appgrid .x8-paire, .xp-corps .x8-paire { grid-template-columns: minmax(0, 1fr); }
}