/*  ecran-etats-analytiques.css — ETA-07, les états analytiques (créé le 2026-09-23).

    Préfixe `.ea-`, vérifié libre avant d'être posé (docs/conventions-nommage.md : deux blocs
    homonymes ne cassent pas la construction, ils FUSIONNENT). La barre de critères, la rangée
    des mentions et la pastille de cellule sont celles des autres états du
    lot (`.glt-`, ecran-grand-livre.css) : elles ne sont
    pas redessinées ici. Cette feuille ne porte que ce qui est propre aux cinq états analytiques —
    l'arbre des sections, la ligne du non-ventilé, les colonnes du résultat, l'histogramme du
    budget et le croisement.
    Aucune couleur littérale. */

/* 1 · La barre : les sélecteurs d'axe et de section portent des libellés longs. */
.appgrid .ea-select { min-width: 200px; max-width: 320px; }
.appgrid .ea-coches { flex-direction: row; align-items: center; gap: var(--et-coches-gap); flex-wrap: wrap; }

/* 2 · Les tables. Les largeurs sont ICI et non dans la page (docs/conventions-responsive.md). */
.appgrid .ea-cadre { margin-bottom: 12px; }
.appgrid .ea-table { table-layout: fixed; min-width: 860px; }
.appgrid .ea-table td { white-space: nowrap; }
/* LES EN-TÊTES PASSENT À LA LIGNE : « Budget cumulé » et « Écart cumulé », en capitales espacées,
   se chevauchaient à 112 px (banc du 2026-09-23). Une cellule de chiffres ne se replie pas. */
.appgrid .ea-table thead th { white-space: normal; vertical-align: bottom; }
/* La note du non-ventilé passe sous son libellé plutôt que de déborder sur le débit. */
.appgrid .ea-table td.ea-cel-note { white-space: normal; }
.appgrid .ea-cel-note .ea-meta { display: block; margin-left: 0; font-weight: 400; }
.appgrid .ea-table td.ea-cel-libelle { overflow: hidden; text-overflow: ellipsis; }
.appgrid .ea-col-code { width: 110px; }
.appgrid .ea-col-lib { width: 240px; }
.appgrid .ea-col-mt { width: 112px; }
.appgrid .ea-col-nb { width: 64px; }
.appgrid .ea-col-date { width: 96px; }
.appgrid .ea-col-jal { width: 52px; }
.appgrid .ea-col-piece { width: 108px; }
.appgrid .ea-col-compte { width: 84px; }
.appgrid .ea-fort { font-weight: 600; }
.appgrid .ea-meta { margin-left: 8px; font-size: 12px; color: var(--et-muted); }
.appgrid .ea-vide-ligne { text-align: center; color: var(--et-muted); padding: 16px; }

/* L'arbre des sections : un groupe cumule ses feuilles — il se lit à sa graisse et à son fond,
   comme les ruptures des autres états ; la profondeur se lit au retrait du code. */
.appgrid .ea-groupe > td { background: var(--et-surface-2); font-weight: 600; }
.appgrid .ea-feuille { cursor: pointer; }
.appgrid .ea-feuille:hover > td { background: var(--et-survol); }
.appgrid .ea-niv-1 .ea-code { padding-left: 14px; }
.appgrid .ea-niv-2 .ea-code { padding-left: 28px; }
.appgrid .ea-niv-3 .ea-code { padding-left: 42px; }
.appgrid .ea-niv-4 .ea-code { padding-left: 56px; }
/* Le retrait est porté par une SPAN et non par la cellule : la colonne est ancrée (lot 03), et la
   cellule ancrée reprend son propre retrait — mesuré au banc, les codes restaient alignés. */
.appgrid .ea-code { display: inline-block; }
.appgrid .glt-chip.ea-fermee { margin-left: 6px; }

/* LE NON-VENTILÉ ouvre la balance, en ambre : c'est un signal de revue, pas une erreur. */
.appgrid .ea-nonventile > td { background: var(--et-avertissement-bg); color: var(--et-avertissement-ink); font-weight: 600; }

/* L'écart se lit dans le SENS de la maquette : au-delà du budget, l'encre de danger ; en deçà,
   celle du succès. Toujours le rang -ink : une couleur d'état n'est jamais écrite en color:. */
.appgrid .ea-table .est-depasse { color: var(--et-danger-ink); }
.appgrid .ea-table .est-sous { color: var(--et-succes-ink); }

/* 3 · Le résultat : la colonne « Non imputé » se distingue, le résultat net se renforce. */
.appgrid .ea-table .ea-nonimpute { background: var(--et-avertissement-bg); }
.appgrid .ea-resultat-net > td { border-top: 2px solid var(--et-hairline); }

/* 4 · Le grand livre : le brouillard en sourdine, comme aux grands livres. */
.appgrid .ea-brouillon > td { color: var(--et-muted); }

.appgrid .ea-histo {
    margin: 0 0 12px;
    padding: 10px 14px 8px;
    background: var(--et-surface);
    border: 1px solid var(--et-hairline);
}
.appgrid .ea-histo figcaption { display: flex; gap: var(--et-legende-gap); flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--et-muted); margin-bottom: var(--et-legende-ecart); }
.appgrid .ea-legende { display: inline-flex; align-items: center; gap: 6px; }
.appgrid .ea-legende > i { display: inline-block; width: 12px; height: 8px; }
.appgrid .ea-leg-barre { background: var(--et-form-blue); }
.appgrid .ea-leg-dessus { background: var(--et-avertissement-mark); }
.appgrid .ea-legende > i.ea-leg-trait { height: 2px; background: var(--et-ink); }
.appgrid .ea-histo svg { display: block; width: 100%; height: 150px; }
.appgrid .ea-barre { fill: var(--et-form-blue); }
.appgrid .ea-barre.est-dessus { fill: var(--et-avertissement-mark); }
.appgrid .ea-barre.est-avenir { fill-opacity: .35; }
.appgrid .ea-trait { stroke: var(--et-ink); stroke-width: 2; vector-effect: non-scaling-stroke; }
.appgrid .ea-axe-zero { stroke: var(--et-hairline); stroke-width: 1; vector-effect: non-scaling-stroke; }
.appgrid .ea-histo-mois {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    font-size: 12px;
    color: var(--et-muted);
    text-align: center;
}
.appgrid .ea-avenir > td { color: var(--et-muted); }
.appgrid .ea-lecture { font-size: 12px; color: var(--et-muted); }

/* 6 · Le croisement : la plus forte cellule de chaque section, teintée ; le « hors » en sourdine. */
.appgrid .ea-table td.ea-max { background: var(--et-tint); font-weight: 600; }
.appgrid .ea-table td.ea-hors { color: var(--et-muted); }

/* 7 · L'état vide : aucun axe défini. */
.appgrid .ea-vide { padding: 40px 16px; text-align: center; color: var(--et-muted); }
.appgrid .ea-vide-ico { display: block; font-size: 26px; margin-bottom: 8px; color: var(--et-inerte); }

@media (max-width: 720px) {
    .appgrid .ea-select { min-width: 0; max-width: none; width: 100%; }
}