/* ============================================================================
   EasyCompta — la vignette d'indicateur, une fois pour tout le module

   Le dessin est celui de la synthèse de trésorerie : fond de surface, filet
   fin, bord gauche de 4 px coloré par le rôle, libellé mono capitales de la
   même couleur, valeur mono, note discrète. Un écran choisit son rôle en
   posant --vig sur la vignette ; sans rien, elle est bleue.

   Anatomie : .n (libellé) · .v (valeur) · .s ou .l (note).
   ========================================================================== */

.appgrid .tb-kpi, .appgrid .dr-fait, .appgrid .af-fait, .appgrid .fb-fait,
.appgrid .p6-fait, .appgrid .p9-carte, .appgrid .p9-parite, .appgrid .t1-fait,
.appgrid .m2-fait, .appgrid .e3-fait, .appgrid .d4-fait, .appgrid .r1-fait,
.appgrid .f7-fait, .appgrid .x8-parite, .appgrid .r4-fait,
.appgrid .r2-fait, .appgrid .k-fait,
.appgrid .rm-fait, .appgrid .cn-fait, .appgrid .qe-fait, .appgrid .sf-fait, .appgrid .tv-fait,
.appgrid .rc-fait, .appgrid .dc-fait, .appgrid .exp-fait, .appgrid .plc-fait, .appgrid .se-fait, .appgrid .mr-fait, .appgrid .dv-fait, .appgrid .vv-fait, .appgrid .rv-fait, .appgrid .ba-fait, .appgrid .bl-fait, .appgrid .cr-fait, .appgrid .tf-fait, .appgrid .nx-fait, .appgrid .sy-fait, .appgrid .scp-fait, .appgrid .p5-fait, .appgrid .trt-kpi {
  padding: 6px 10px;
  background: var(--et-surface);
  border: 1px solid var(--et-hairline);
  border-left: 4px solid var(--vig, var(--et-form-blue));
  box-shadow: none;
}

.appgrid .tb-kpi .n, .appgrid .dr-fait .n, .appgrid .af-fait .n, .appgrid .fb-fait .n,
.appgrid .p6-fait .n, .appgrid .p9-parite .n, .appgrid .t1-fait .n, .appgrid .m2-fait .n,
.appgrid .e3-fait .n, .appgrid .d4-fait .n, .appgrid .r1-fait .n, .appgrid .r2-fait .n,
.appgrid .f7-fait .n, .appgrid .x8-parite .n, .appgrid .r4-fait .n,
.appgrid .k-fait .n, .appgrid .p9-carte .t,
.appgrid .rm-fait .n, .appgrid .cn-fait .n, .appgrid .qe-fait .n, .appgrid .sf-fait .n, .appgrid .tv-fait .n,
.appgrid .rc-fait .n, .appgrid .dc-fait .n, .appgrid .exp-fait .n, .appgrid .plc-fait .n, .appgrid .se-fait .n, .appgrid .mr-fait .n, .appgrid .dv-fait .n, .appgrid .vv-fait .n, .appgrid .rv-fait .n, .appgrid .ba-fait .n, .appgrid .bl-fait .n, .appgrid .cr-fait .n, .appgrid .tf-fait .n, .appgrid .nx-fait .n, .appgrid .sy-fait .n, .appgrid .scp-fait .n, .appgrid .p5-fait .n, .appgrid .trt-kpi .n {
  display: block;
  font-family: var(--et-font-mono);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--vig, var(--et-form-blue));
}

.appgrid .tb-kpi .v, .appgrid .dr-fait .v, .appgrid .af-fait .v, .appgrid .fb-fait .v,
.appgrid .p6-fait .v, .appgrid .p9-parite .v, .appgrid .t1-fait .v, .appgrid .m2-fait .v,
.appgrid .e3-fait .v, .appgrid .d4-fait .v, .appgrid .r1-fait .v, .appgrid .r2-fait .v,
.appgrid .f7-fait .v, .appgrid .x8-parite .v, .appgrid .r4-fait .v,
.appgrid .k-fait .v, .appgrid .p9-carte .s,
.appgrid .rm-fait .v, .appgrid .cn-fait .v, .appgrid .qe-fait .v, .appgrid .sf-fait .v, .appgrid .tv-fait .v,
.appgrid .rc-fait .v, .appgrid .dc-fait .v, .appgrid .exp-fait .v, .appgrid .plc-fait .v, .appgrid .se-fait .v, .appgrid .mr-fait .v, .appgrid .dv-fait .v, .appgrid .vv-fait .v, .appgrid .rv-fait .v, .appgrid .ba-fait .v, .appgrid .bl-fait .v, .appgrid .cr-fait .v, .appgrid .tf-fait .v, .appgrid .nx-fait .v, .appgrid .sy-fait .v, .appgrid .scp-fait .v, .appgrid .p5-fait .v, .appgrid .trt-kpi .v {
  display: block;
  font-family: var(--et-font-mono);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  margin-top: 1px;
  color: var(--et-ink);
}

/* L'unité qui suit la valeur reste discrète : elle ne la concurrence pas. */
.appgrid .tb-kpi .v small, .appgrid .dr-fait .v small, .appgrid .af-fait .v small,
.appgrid .fb-fait .v small, .appgrid .p6-fait .v small, .appgrid .k-fait .v small,
.appgrid .exp-fait .v small, .appgrid .plc-fait .v small, .appgrid .se-fait .v small, .appgrid .mr-fait .v small, .appgrid .dv-fait .v small, .appgrid .vv-fait .v small, .appgrid .rv-fait .v small, .appgrid .ba-fait .v small, .appgrid .bl-fait .v small, .appgrid .cr-fait .v small, .appgrid .tf-fait .v small, .appgrid .nx-fait .v small, .appgrid .sy-fait .v small, .appgrid .scp-fait .v small, .appgrid .p5-fait .v small, .appgrid .trt-kpi .v small {
  font-size: 11px;
  font-weight: 400;
  color: var(--et-muted);
}

.appgrid .tb-kpi .s, .appgrid .dr-fait .s, .appgrid .af-fait .s, .appgrid .fb-fait .s,
.appgrid .p6-fait .s, .appgrid .p9-parite .s, .appgrid .t1-fait .s, .appgrid .m2-fait .s,
.appgrid .e3-fait .s, .appgrid .d4-fait .s, .appgrid .r1-fait .s, .appgrid .r2-fait .s,
.appgrid .f7-fait .s, .appgrid .x8-parite .s, .appgrid .r4-fait .s,
.appgrid .k-fait .s, .appgrid .p9-carte .l,
.appgrid .rm-fait .s, .appgrid .cn-fait .s, .appgrid .qe-fait .s, .appgrid .sf-fait .s, .appgrid .tv-fait .s,
.appgrid .rc-fait .s, .appgrid .dc-fait .s, .appgrid .exp-fait .s, .appgrid .plc-fait .s, .appgrid .se-fait .s, .appgrid .mr-fait .s, .appgrid .dv-fait .s, .appgrid .vv-fait .s, .appgrid .rv-fait .s, .appgrid .ba-fait .s, .appgrid .bl-fait .s, .appgrid .cr-fait .s, .appgrid .tf-fait .s, .appgrid .nx-fait .s, .appgrid .sy-fait .s, .appgrid .scp-fait .s, .appgrid .p5-fait .s, .appgrid .trt-kpi .s {
  display: block;
  font-size: 11px;
  line-height: 1.3;
  margin-top: 1px;
  color: var(--et-faint);
}

/* Les bandes : vignettes détachées, même gouttière partout. Les écrans qui les
   collaient sur un fond de filet passent à la gouttière, comme la synthèse.

   LA GRILLE ELLE-MÊME EST ICI, ET NON DANS LES FEUILLES D'ÉCRAN. Elle n'y était
   pas : chaque écran redéclarait « quatre colonnes » de son côté, et le premier
   qui oubliait affichait ses quatre indicateurs empilés — un bogue invisible à
   la lecture du code, puisque la bande existait bien. Une bande de vignettes
   est un composant du gabarit ; sa géométrie appartient donc au gabarit, comme
   son repli à deux colonnes sous 1024 px qui vivait déjà ici. */
.appgrid .tb-kpis, .appgrid .dr-faits, .appgrid .p9-cartes, .appgrid .af-faits,
.appgrid .fb-faits, .appgrid .p6-faits, .appgrid .t1-faits, .appgrid .m2-faits,
.appgrid .e3-faits, .appgrid .d4-faits, .appgrid .r1-faits, .appgrid .r2-faits,
.appgrid .f7-faits, .appgrid .x8-parites, .appgrid .r4-faits,
.appgrid .k-faits,
.appgrid .rm-faits, .appgrid .cn-faits, .appgrid .qe-faits, .appgrid .sf-faits, .appgrid .tv-faits,
.appgrid .rc-faits, .appgrid .dc-faits, .appgrid .exp-faits, .appgrid .plc-faits, .appgrid .se-faits, .appgrid .mr-faits, .appgrid .dv-faits, .appgrid .vv-faits, .appgrid .rv-faits, .appgrid .ba-faits, .appgrid .bl-faits, .appgrid .cr-faits, .appgrid .tf-faits, .appgrid .nx-faits, .appgrid .sy-faits, .appgrid .scp-faits, .appgrid .p5-faits, .appgrid .trt-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
  background: transparent;
  border: 0;
}

@media (max-width: 1024px) {
  .appgrid .tb-kpis, .appgrid .dr-faits, .appgrid .p9-cartes, .appgrid .af-faits,
  .appgrid .fb-faits, .appgrid .p6-faits, .appgrid .t1-faits, .appgrid .m2-faits,
  .appgrid .e3-faits, .appgrid .d4-faits, .appgrid .r1-faits, .appgrid .r2-faits,
  .appgrid .f7-faits, .appgrid .x8-parites, .appgrid .r4-faits,
  .appgrid .k-faits,
  .appgrid .rm-faits, .appgrid .cn-faits, .appgrid .qe-faits, .appgrid .sf-faits, .appgrid .tv-faits,
  .appgrid .rc-faits, .appgrid .dc-faits, .appgrid .exp-faits, .appgrid .plc-faits, .appgrid .se-faits, .appgrid .mr-faits, .appgrid .dv-faits, .appgrid .vv-faits, .appgrid .rv-faits, .appgrid .ba-faits, .appgrid .bl-faits, .appgrid .cr-faits, .appgrid .tf-faits, .appgrid .nx-faits, .appgrid .sy-faits, .appgrid .scp-faits, .appgrid .p5-faits, .appgrid .trt-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}