/*
 * Punchbox — (c) 2026 Alexis Clement. Tous droits reserves.
 * Logiciel proprietaire. Toute reproduction ou diffusion interdite sans
 * autorisation ecrite.
 */

/* video-reglages.css — panneau de réglages vidéo (mission pb-video-lisibilite).
 * Isolé de style.css pour que la fusion reste triviale (plusieurs missions
 * touchent la feuille principale en même temps). Réutilise les variables de la
 * charte (--vert, --secondaire, --mono…) définies dans style.css. */

/* Ligne de contraste : le RATIO chiffré et le VERDICT en toutes lettres. Le
 * niveau n'est JAMAIS signalé par la seule couleur (règle d'accessibilité de la
 * mission) — un mot et un symbole le portent ; la couleur ne fait que renforcer. */
.video-contraste {
  margin: 10px 0 4px;
  font-size: .9rem;
  line-height: 1.45;
  color: var(--secondaire);
}
.video-contraste .contraste-ratio {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.video-contraste .contraste-verdict { font-weight: 700; }
.video-contraste[data-niveau="lisible"]   .contraste-verdict { color: var(--vert); }
.video-contraste[data-niveau="limite"]    .contraste-verdict { color: #d79a1f; }
.video-contraste[data-niveau="illisible"] .contraste-verdict { color: #d9584a; }
.video-contraste[data-niveau="image"]      { font-style: italic; }

/* Bouton « corriger la couleur » : discret, texte-lien, pas un bouton plein —
 * c'est une proposition, pas une action principale (on n'interdit rien). */
.video-corriger {
  display: inline-block;
  margin: 2px 0 4px;
  padding: 2px 0;
  background: none;
  border: none;
  border-bottom: 1px solid currentColor;
  color: var(--vert);
  font: inherit;
  font-size: .88rem;
  cursor: pointer;
}
.video-corriger:hover,
.video-corriger:focus-visible { color: var(--texte); }

/* Aperçu de couleur cible à droite du bouton (facultatif, purement décoratif). */
.video-corriger .pastille {
  display: inline-block;
  width: .8em; height: .8em;
  margin-inline-start: .4em;
  border: 1px solid rgba(128,128,128,.5);
  border-radius: 2px;
  vertical-align: middle;
}