/* ==========================================================================
   Ordre de virement (lot F.3 de l'audit EasyPaie, 2026-10-03)
   Pages/Paie/Virements.razor — porté de « Ordre de virement.dc.html ».

   Mobilier d'écran en .vir-* par-dessus easypaie.css : indicateurs, bandeaux, lignes de
   blocage, tables, pastilles et modales viennent du module. Jetons seulement.
   ========================================================================== */
.appgrid .vir-vide { padding: 44px; text-align: center; color: var(--et-muted); }
.appgrid .vir-glyphe { flex: none; font-size: 16px; line-height: 1.4; }

.appgrid .vir-bloquants { margin-bottom: 14px; }
.appgrid .vir-bloquants__tete { margin: 0; border-width: 0 0 1px; }
.appgrid .vir-montant { flex: none; font-family: var(--et-font-mono); font-size: 14px; color: var(--et-ink); align-self: center; }

/* position: relative — le libellé masqué d'une colonne d'actions ne sort pas du cadre défilant. */
.appgrid .vir-table-cadre { position: relative; overflow-x: auto; }
.appgrid .vir-table { min-width: 640px; }
.appgrid .vir-table thead th { white-space: normal; vertical-align: bottom; }
.appgrid .vir-vide-ligne { padding: 24px 12px; text-align: center; color: var(--et-muted); }
.appgrid .vir-banque { font-weight: 600; color: var(--et-ink); }
.appgrid .vir-produite { font-size: 12px; color: var(--et-muted); max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.appgrid .vir-ligne--hors td { background: var(--et-surface-3); }
.appgrid .vir-geste { padding: 0 8px; color: var(--et-lien); font-weight: 600; white-space: nowrap; }
.appgrid .vir-geste:disabled { color: var(--et-faint); }
.appgrid .vir-rejet { color: var(--et-danger-ink); font-weight: 600; }
.appgrid .vir-motif { font-size: 13px; color: var(--et-muted); }
/* Sur une rangée de rejet à traiter (fond ambré), l'encre faite pour ce fond — même règle qu'easypaie.css § 7. */
.appgrid .ep-rangee--critique .vir-motif { color: var(--et-muted-sur-alerte); }
.appgrid .vir-mono { font-family: var(--et-font-mono); font-size: 12px; }
.appgrid .vir-deplier { margin-left: auto; }
.appgrid .vir-rapproche { font-size: 13px; color: var(--et-succes-ink); font-weight: 600; }
.appgrid .vir-methode { padding: 10px 18px 14px; font-size: 12px; line-height: 1.5; color: var(--et-muted); border-top: 1px solid var(--et-hairline); }
.appgrid .vir-cloture { margin-top: 14px; flex-wrap: nowrap; }
.appgrid .vir-cloture > div { min-width: 0; }

.appgrid .vir-form { display: flex; flex-direction: column; gap: 12px; }
.appgrid .vir-saisie { width: 100%; resize: vertical; }
.appgrid .vir-saisie-court { max-width: 140px; }

@media (max-width: 1024px) {
  /* Lot E5 : les trois tables passent en cartes (easypaie.css § 18) — le plancher de
     640 px qui les faisait défiler tombe, et ce qui s'abrégeait se lit en entier. */
  .appgrid .vir-table.ep-cartes { min-width: 0; }
  .appgrid .vir-table.ep-cartes .vir-produite { max-width: none; }
  .appgrid .vir-table.ep-cartes .ep-insecable { white-space: normal; overflow-wrap: anywhere; }
  .appgrid .vir-table.ep-cartes .vir-geste { padding-left: 0; }
}
@media (max-width: 720px) {
  .appgrid .vir-bloquants .ep-ligne { flex-wrap: wrap; }
  /* Les deux gestes d'un salarié non payable (« Compléter le dossier », « Payer hors virement »)
     tenaient côte à côte en 364 px : à 390, le second sortait de la carte. Ils passent à la ligne. */
  .appgrid .vir-bloquants .ep-ligne__actions { flex-wrap: wrap; min-width: 0; max-width: 100%; }
}