/* Copyright (c) 2026 LB IT Cloud SAS. All rights reserved.
   Proprietary source of the LB IT Cloud website. See LICENSE.

   La page d'inventaire : la liste de ce qu'eXact relève sur un poste.

   POURQUOI PAS legal.css, qui est pourtant la feuille des pages de référence.
   Celle-là dessine UNE COLONNE ÉTROITE de prose — 780 px, interlignage généreux —
   parce qu'on y cherche une ligne : un SIRET, un hébergeur. Ici on parcourt une
   liste de plusieurs centaines de champs groupés par famille, et la forme utile
   est un tableau à deux colonnes aussi large que la page le permet : le nom du
   groupe à gauche, ses champs à droite. Charger legal.css pour en élargir les
   règles depuis un second fichier, ce serait deux feuilles qui se disputent la
   même classe — la dérive que ce dépôt évite partout ailleurs.

   Ce qui est réutilisé l'est vraiment : `.facts` / `.fact` de site.css portent les
   chiffres de tête, `.pagehero`, `.wrap`, `.kicker`, `.lead` et `.cards` viennent
   de site.css sans une ligne ici. */

/* ---------------------------------------------------------------------------
   LA COLONNE

   Plus large que la prose, moins large que le wrap : au-delà, l'œil perd la
   ligne entre le nom du groupe et ses champs, qui est précisément le lien que
   cette page demande de suivre.
   --------------------------------------------------------------------------- */
.inv { max-width: 1000px; }
.inv h2 {
  font-family: var(--display); font-size: 25px; font-weight: 760; font-stretch: 72%; letter-spacing: -.005em; color: var(--ink);
  margin: 48px 0 6px; padding-top: 26px; border-top: 1px solid var(--line);
}
.inv h3 { width: fit-content; border-bottom: 2px solid var(--touch); padding-bottom: 3px; font-size: 20px; font-weight: 760; font-stretch: 72%; color: var(--ink); margin: 26px 0 6px; }
/* La prose garde une mesure de lecture : c'est la grille des champs qui prend la largeur. */
.inv p { color: var(--ink-2); font-size: 16px; line-height: 1.65; margin-bottom: 14px; max-width: 70ch; }
.inv p.lead { margin-top: 12px; }

/* La remarque qui suit un tableau — la phrase qui dit d'où vient la mesure, ou
   ce qu'elle permet. Détachée, parce qu'elle ne se lit pas dans la foulée des
   champs mais après eux. */
.invnote {
  font-size: 14px; color: var(--ink-3); border-left: 2px solid var(--a1-line);
  padding-left: 14px; margin: 16px 0 0;
}

/* ---------------------------------------------------------------------------
   GROUPE → CHAMPS

   Une liste de définitions, pas un tableau : ce sont des paires, et un lecteur
   d'écran les annonce comme telles. Le nom du groupe tient sur une colonne fixe
   pour que l'œil descende une ligne droite plutôt qu'un bord dentelé.
   --------------------------------------------------------------------------- */
.invgrid { display: grid; gap: 0; margin-top: 18px; }
.invrow {
  display: grid; grid-template-columns: 250px 1fr; gap: 20px;
  padding: 13px 0; border-bottom: 1px solid var(--line);
}
.invrow:last-child { border-bottom: 0; }
.invrow dt { font-size: 14.5px; font-weight: 650; color: var(--ink); }
.invrow dd { margin: 0; font-size: 14.5px; color: var(--ink-2); line-height: 1.65; }

/* ---------------------------------------------------------------------------
   LES SEPT TABLES, en tête de page

   Le seul vrai tableau de la page, parce que ses quatre colonnes sont des
   grandeurs qu'on compare entre lignes — un nombre de colonnes, une cadence.
   Les en-têtes et les nombres sont dans la police des références et des mesures.
   --------------------------------------------------------------------------- */
.invtables { width: 100%; border-collapse: collapse; margin-top: 22px; font-size: 14.5px; }
.invtables th {
  text-align: left; font: 500 10.5px/1.4 var(--mono);
  letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3);
  padding: 0 14px 10px 0; border-bottom: 1px solid var(--line);
}
.invtables td { padding: 12px 14px 12px 0; border-bottom: 1px solid var(--line); color: var(--ink-2); vertical-align: top; }
/* La première colonne portait le NOM de la table, qui ne devait pas se couper — d'où un
   `white-space: nowrap` ici jusqu'au 18/09/2026. Les noms sont partis ; la première
   colonne est maintenant une phrase, et elle doit revenir à la ligne. */
.invtables td:first-child { color: var(--ink); font-weight: 600; }
.invtables td.num { font: 600 13.5px/1.5 var(--mono); font-variant-numeric: tabular-nums; color: var(--a1); white-space: nowrap; }

/* ---------------------------------------------------------------------------
   CE QUI N'EST PAS COLLECTÉ

   Sur une page qui vend la collecte profonde, c'est la section que le lecteur
   cherche sans l'avouer. Elle est donc traitée comme une affirmation — un
   panneau, pas une note de bas de page — et en vert : c'est une garantie, pas
   un avertissement. Taillé en chanfrein comme les plaques du site depuis le
   09/10/2026, donc un aplat sans bordure : une bordure découpée perd ses
   diagonales (voir THE CHAMFER dans site.css).
   --------------------------------------------------------------------------- */
.nope {
  --cut: 16px;
  background: var(--ok-bg); padding: 26px 28px; margin-top: 22px;
  clip-path: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));
}
@supports (corner-shape: bevel) {
  .nope { clip-path: none; border-radius: var(--cut) 0 var(--cut) 0; corner-shape: bevel; }
}
.nope h3 { margin-top: 0; }
.nope ul { margin: 0; padding-left: 20px; }
.nope li { font-size: 14.5px; color: var(--ink-2); line-height: 1.7; margin-bottom: 9px; }
.nope li:last-child { margin-bottom: 0; }
.nope li b { color: var(--ink); font-weight: 700; }

@media (max-width: 760px) {
  .invrow { grid-template-columns: 1fr; gap: 3px; }
  /* La cadence, et pas une autre : trois colonnes ne tiennent pas sur un téléphone, et
     c'est celle dont l'absence coûte le moins — ce que porte la table est le sujet de la
     ligne, le nombre de colonnes est le chiffre qu'on vient chercher. La règle visait la
     DEUXIÈME colonne jusqu'au 18/09/2026, quand la première portait le nom de la table.
     Le nom est parti, tout a glissé d'un rang, et la règle laissée en place aurait caché
     le nombre. */
  .invtables th:nth-child(3), .invtables td:nth-child(3) { display: none; }
}