/* ==========================================================================
   Livre de paie — PST-01 (/app/paie/journal), lot E5 de l'audit EasyPaie.

   QUINZE COLONNES, AUCUNE RETIRÉE. À 1440 px la table mesurait ~1 490 px pour
   ~1 120 de place : ce n'étaient pas les montants (≈ 70 px chacun) mais les
   EN-TÊTES — capitales insécables et 16 px de rembourrage de chaque côté,
   « DONT INDEM. NON IMP. » occupait 190 px pour une colonne de chiffres. Les
   en-têtes passent donc sur deux lignes, calés en bas, avec un rembourrage de
   4 px ; les montants, eux, restent sur une ligne. Sous la largeur où cela ne
   suffit plus, la colonne Nom reste figée (lot 03, data-ancre="2").

   Sous 1024 px, la table passe en cartes (easypaie.css § 18) ; on y défait ce
   que l'ancrage et le survol Bootstrap posent cellule par cellule.
   ========================================================================== */
.appgrid .ljp-table { font-size: 13px; }
.appgrid .ljp-table > thead > tr > th {
  white-space: normal; vertical-align: bottom;
  padding-left: 4px; padding-right: 4px; line-height: 1.25;
}
.appgrid .ljp-table > tbody > tr > td,
.appgrid .ljp-table > tfoot > tr > td { white-space: nowrap; padding-left: 4px; padding-right: 4px; }
/* Le nom se lit en entier, quitte à tenir sur deux lignes. */
.appgrid .ljp-table > tbody > tr > td:nth-child(2) { white-space: normal; min-width: 8rem; }

@media (max-width: 1024px) {
  /* L'ancre figée n'a plus de colonne à garder : sans cela, le nom gardait son fond opaque et
     son filet d'ombre au milieu de la carte. */
  .appgrid .ljp-table.tbl-ancree > tbody > tr > td:nth-child(2),
  .appgrid .ljp-table.tbl-ancree > tfoot > tr > td:nth-child(2) {
    position: static; box-shadow: none; background: transparent;
  }
  .appgrid .ljp-table > tbody > tr > td:nth-child(2) { min-width: 0; }
}

/* --------------------------------------------------------------------------
   Lot E4 (2026-10-09) : la carte, sa tête et ses états, depuis que la table a
   quitté Bootstrap pour `.ep-table` (easypaie.css). Le survol est celui du
   module : il teint la rangée entière, en table comme en carte.
   -------------------------------------------------------------------------- */
.ljp-bandeau { margin-bottom: 12px; }
.ljp-avertissements { margin: 0; padding-left: 18px; }
.ljp-liste { margin-bottom: 0; }
/* La table défile dans la carte ; la tête de carte, elle, garde sa largeur. */
.ljp-defile { overflow-x: auto; }
/* Les en-têtes de `.ep-table` sont en capitales mono espacées de .14em : sur quinze colonnes de
   chiffres, la table débordait de 125 px à 1440 (banc paie-journal). Les capitales restent,
   la chasse fixe et l'espacement s'en vont, et l'en-tête passe sur deux lignes comme avant. */
.appgrid .ljp-table > thead > tr > th { font-family: inherit; letter-spacing: .04em; }
/* Pour la même raison, les montants gardent l'alignement et les chiffres tabulaires de
   `.ep-num`, mais pas sa chasse fixe : en mono, « 1 450 000 » prend un tiers de place de plus
   que dans la police du texte, et quinze colonnes ne tenaient plus. Les chiffres tabulaires
   suffisent à aligner une colonne au caractère près. */
.appgrid .ljp-table .ep-num { font-family: inherit; font-variant-numeric: tabular-nums; }
/* La pastille de statut, sans son point et resserrée : c'est la colonne la plus large après le nom. */
.appgrid .ljp-table .ep-pastille { padding: 2px 6px; }
.appgrid .ljp-table .ep-table__total .ep-num { font-size: 13px; font-weight: 600; }
.ljp-tete { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ljp-compte { font-size: 13px; font-weight: 400; color: var(--et-muted); }
.ljp-export { margin-left: auto; }
.ljp-etat { padding: 28px 16px; text-align: center; font-size: 13px; color: var(--et-muted); }
.ljp-matricule { font-family: var(--et-font-mono); font-weight: 600; }
/* Les colonnes « dont » et le coût patronal ne s'ajoutent pas au net : encre secondaire. */
.ljp-sec { color: var(--et-muted); }
.ljp-total-lbl { text-align: right; }
.ljp-dont td { font-weight: 500; }

@media (max-width: 1024px) {
  .ljp-export { min-height: 44px; }
}