/* =============================================================================
   La CELLULE D'IDENTITÉ d'une rangée de liste — feuille partagée (15-09-2026)
   =============================================================================

   Jumelle de `window.listRowTitle()` (core.js).

   ── POURQUOI ELLE EST SORTIE DE `ticket-row.css` ────────────────────────────
   « Pourquoi /jobs/121#tickets et /jobs/121#echanges n'ont pas la même
   présentation ? » (Olivier, 15-09-2026). Les deux onglets listent des objets
   qui se lisent PAREIL — un intitulé, un surtitre qui dit d'où ça vient, un
   résumé, des compteurs — et l'un était un tableau, l'autre des cartes de
   760 px. La seule façon que deux écrans se ressemblent pour de bon est qu'ils
   passent par le MÊME code : les règles de la cellule de titre sont donc ici,
   sous un nom qui ne parle plus de tickets, et `ticket-row.css` ne garde que
   ce qui est PROPRE à un ticket (pastilles, teintes de rangée, porteur).

   Rien n'a changé de valeur en déménageant : mêmes tailles, mêmes jetons,
   mêmes clamps. Un onglet qui adopte ce vocabulaire adopte du même coup
   l'apparence déjà livrée, sans une seule valeur recopiée.
*/

/* ── La VIGNETTE (première image jointe, aperçu d'une pièce) ───────────────── */
.lrow-thumb {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border-radius: var(--radius-sm, 0.25rem);
    overflow: hidden;
    background: var(--bg);
    border: 1px solid var(--border);
    display: block;
}

.lrow-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── La cellule ───────────────────────────────────────────────────────────── */
.lrow {
    display: flex;
    gap: 0.625rem;
    align-items: flex-start;
}

.lrow > .lrow-main {
    flex: 1;
    min-width: 0;
}

/* Le SURTITRE : d'où vient la ligne — le numéro de ticket sur /tickets, le
   demandeur sur une affaire, l'interlocuteur et le canal sur un échange. */
.lrow-sup {
    font-size: 0.7rem;
    color: var(--text-secondary);
}

.lrow-title {
    font-weight: 500;
    color: var(--text-primary);
}

/* Le RÉSUMÉ — trois lignes, puis coupé. C'est lui qui décide si l'on ouvre :
   réduit à une ligne, toutes les lignes deviennent interchangeables ; sans
   plafond, une seule mange la hauteur de l'écran. */
.lrow-desc {
    font-size: 0.775rem;
    color: var(--text-secondary);
    margin-top: 0.15rem;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Compteurs (commentaires, pièces jointes, messages) ───────────────────── */
.lrow-counts {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
    font-size: 0.75rem;
    color: var(--text-secondary);
}

.lrow-count {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

/* ── La rangée qui OUVRE quelque chose au clic ─────────────────────────────
   `.lrow-open` sur le `<tr>` : la ligne entière est la cible, et le clavier
   l'atteint (`tabindex="0"` côté balisage). Elle vit ici et non dans la
   feuille d'un écran — la rangée de ticket et celle d'un échange sont
   cliquables pour la même raison, et une seule des deux le serait si chacune
   portait sa propre règle. */
.table tbody tr.lrow-open {
    cursor: pointer;
}

.table tbody tr.lrow-open:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
}

/* Les pastilles d'une rangée de liste — un cran plus lisible que le badge par
   défaut, qui est calibré pour un intitulé de formulaire.

   ⚠ LE SÉLECTEUR EST RESSERRÉ, ET IL DOIT LE RESTER. `.table .badge` dans une
   feuille du SOCLE recalibrerait tous les badges de tous les tableaux des sept
   apps. Ancré sur `.lrow-open`, il ne touche que les listes qui ont adopté ce
   vocabulaire — et il les touche TOUTES, ce qui est le but : c'est par une
   calibration réservée à un seul écran que deux onglets voisins ont fini par
   ne plus se ressembler. */
tr.lrow-open .badge {
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.25rem 0.625rem;
    border-radius: 0.375rem;
    letter-spacing: 0.025em;
}