/* recommandeur-quantification.html : besoins propres au recommandeur (jetons de :root uniquement, voir DESIGN_SYSTEM.md). */

/* Champ VRAM sous la liste des GPU */
.vram-unit{margin-top:var(--space-2xs)}

/* Format recommandé : grand chiffre du résultat, coloré selon le niveau de qualité posé par le script
   (data-level : ok = perte négligeable, warn = perte légère, crit = dégradation marquée ou aucun format) */
.reco{display:grid;gap:var(--space-2xs);padding:var(--space-m) 1.25rem;border-bottom:1px solid var(--rule-strong)}
.reco__fmt{font-size:clamp(2rem,1.5rem + 2vw,3rem);font-weight:250;line-height:1;letter-spacing:-.035em;color:var(--ink);overflow-wrap:anywhere}
.reco__fmt[data-level="ok"]{color:var(--ok)}
.reco__fmt[data-level="warn"],.reco__fmt[data-level="crit"]{color:var(--orange-ink)}
.reco__why{font-size:var(--step-small);line-height:1.5;color:var(--ink-2)}

/* Tableau de tous les formats (lignes générées par le script ; ligne recommandée = tr.is-highlight) */
.formats{display:grid;gap:var(--space-s);min-width:0}
#tblBody td:first-child{font-weight:600;color:var(--fg);white-space:nowrap}
#tblBody td:nth-child(n+2):nth-child(-n+4){font-family:var(--font-mono);white-space:nowrap}

/* Sous 40rem, le tableau passe en lignes empilées (.table--reflow, site.css § 9) : on lève la largeur minimale de
   .table-scroll>.table (§ 20), sinon les 40rem restent imposés à la table passée en display:block */
@media (max-width:39.99rem){
  .formats .table{--table-min:0}
  /* Ligne recommandée empilée : l'accent orange et le retrait portent sur toute la fiche, pas sur la seule première cellule */
  .formats tbody tr.is-highlight{padding-inline:.75rem;background:var(--paper-2);box-shadow:inset 3px 0 0 var(--orange)}
  .formats tbody tr.is-highlight>:first-child{padding-left:0;box-shadow:none}
  /* Fiche compacte : le format en titre sur sa propre ligne, puis Bits / Poids / Empreinte, puis VRAM / Qualité,
     pour garder la ligne recommandée et ses voisines à l'écran ensemble */
  .formats tbody tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--space-s)}
  .formats tbody td:first-child{grid-column:1/-1}
  .formats tbody td:first-child::before{display:none}
  .formats tbody td:last-child{grid-column:span 2}
}