/* ==========================================================================
   VTCPass — pages : tarifs, paiement, garanties, journal des corrections
   ========================================================================== */
.tarifs-argument { font-weight: 700; }
.aucun-prelevement { display: flex; align-items: center; gap: var(--e-2); margin: 0; }
.aucun-prelevement .icon { color: var(--succes); }

.offres { display: grid; gap: var(--e-4); }
@media (min-width: 56rem) { .offres { grid-template-columns: repeat(3, 1fr); align-items: start; } }
.offre {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--e-3);
  padding: var(--e-5);
  background: var(--surface);
  border: 2px solid var(--ligne);
  border-radius: var(--r-feuille);
}
.offre-conseillee { border-color: var(--marque); box-shadow: inset 0 0 0 1px var(--marque); }
.offre-ruban {
  align-self: flex-start;
  margin: 0;
  padding: var(--e-1) var(--e-3);
  border-radius: var(--r-panneau);
  background: var(--bleu-autoroute);
  color: var(--blanc-panneau);
  font-family: var(--police-titre);
  font-weight: 800;
}
.offre-nom { margin: 0; font-size: var(--t-1); }
.offre-prix { margin: 0; display: flex; align-items: baseline; gap: var(--e-2); }
.offre-prix .chiffre { font-size: var(--t-4); line-height: 1; }
.offre-duree { margin: 0; color: var(--texte-doux); font-weight: 700; }
.offre-liste { padding-inline-start: var(--e-5); margin: 0; flex: 1; }
.offre .btn { margin-top: auto; }

.garanties { list-style: none; padding: 0; display: grid; gap: var(--e-3); max-width: none; }
.garanties li { display: flex; gap: var(--e-3); align-items: flex-start; margin: 0; padding: var(--e-4); background: var(--surface); border-radius: var(--r-bouton); border: 1px solid var(--ligne); }
.garanties .icon { width: 1.75rem; height: 1.75rem; flex: none; }
@media (min-width: 48rem) { .garanties { grid-template-columns: 1fr 1fr; } }

.recap-offre { display: flex; justify-content: space-between; align-items: baseline; gap: var(--e-3); font-size: var(--t-1); margin: 0; }
.recap-offre .chiffre { font-size: var(--t-3); }
.choix-renonciation { align-items: flex-start; font-weight: 400; }
.choix-renonciation input { margin-top: .2rem; }

.attente { display: flex; align-items: center; gap: var(--e-3); }
.roue {
  width: 1.5rem; height: 1.5rem; flex: none;
  border: 3px solid var(--ligne); border-top-color: var(--marque); border-radius: 50%;
  animation: tourne 900ms linear infinite;
}
@keyframes tourne { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .roue { animation: none; border-top-color: var(--ligne); } }

.journal { list-style: none; padding: 0; display: grid; gap: var(--e-4); max-width: none; }
.journal li { margin: 0; }
.journal-tete { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-3); margin: 0; font-weight: 700; }
.journal-diff p { margin: 0; }

.codes { list-style: none; padding: 0; display: grid; gap: var(--e-2); }
.codes li { margin: 0; }
code { font-family: ui-monospace, "Cascadia Mono", Menlo, Consolas, monospace; background: var(--fond); padding: .1em .4em; border-radius: 4px; font-size: .95em; }

/* Tableaux (relecture, admin) : défilement horizontal dans leur feuille sur mobile */
.feuille:has(> .tableau) { overflow-x: auto; }
.tableau { width: 100%; border-collapse: collapse; font-size: var(--t-0); }
.tableau th, .tableau td { padding: var(--e-2) var(--e-3); border-bottom: 1px solid var(--ligne); text-align: start; vertical-align: top; }
.tableau thead th { font-family: var(--police-titre); font-weight: 800; border-bottom-width: 2px; white-space: nowrap; }
.tableau tfoot th, .tableau tfoot td { font-weight: 700; border-bottom: 0; }

/* ---------- Landing ---------- */
.hero { display: grid; gap: var(--e-5); align-items: start; }
@media (min-width: 60rem) { .hero { grid-template-columns: 1.15fr 1fr; } }
.question-jouable { display: grid; gap: var(--e-3); }
.question-jouable .enonce { margin: 0; }
.proposition-bouton { width: 100%; font: inherit; color: var(--texte); text-align: start; cursor: pointer; }
.proposition-bouton:hover:not([disabled]) { border-color: var(--marque); }
.proposition-bouton[disabled] { cursor: default; }
.proposition-bouton.juste { border-color: var(--succes); }
.proposition-bouton.juste .proposition-lettre { background: var(--succes); border-color: var(--succes); color: var(--blanc-panneau); }
.proposition-bouton.choisie-fausse { border-color: var(--danger); }
.proposition-bouton.choisie-fausse .proposition-lettre { border-color: var(--danger); color: var(--danger); }
.question-jouable.est-juste.anime { animation: bordure-verte 700ms ease-out; }
.jouable-reponse { display: grid; gap: var(--e-3); }

.cartouche-bleu { background: var(--bleu-autoroute); color: var(--blanc-panneau); min-width: 2rem; height: 2rem; font-size: var(--t-0); }

.simulateur { display: grid; gap: var(--e-4); }
.simu-lignes { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--e-3); max-width: none; }
.simu-ligne {
  display: grid;
  grid-template-columns: 1fr 3.5rem;
  gap: var(--e-1) var(--e-3);
  align-items: center;
  margin: 0;
  padding: var(--e-2) var(--e-3);
  border-inline-start: 6px solid var(--ligne);
  border-radius: var(--r-panneau);
  background: var(--fond);
}
.simu-ligne[data-statut="valide"] { border-inline-start-color: var(--succes); }
.simu-ligne[data-statut="risque"] { border-inline-start-color: var(--ambre-chantier); }
.simu-ligne[data-statut="elimine"] { border-inline-start-color: var(--danger); }
.simu-label { grid-column: 1 / -1; display: flex; gap: var(--e-2); align-items: center; font-weight: 700; }
.simu-label small { font-weight: 400; }
.simu-ligne input[type="range"] { width: 100%; min-height: var(--cible); accent-color: var(--marque); }
.simu-valeur { text-align: end; font-size: var(--t-1); }
.simu-verdict { padding: var(--e-4); border-radius: var(--r-panneau); background: var(--surface); border: 2px solid var(--ligne); }
.simu-verdict p { margin: 0; }
.simu-verdict .signal { font-size: var(--t-1); font-family: var(--police-titre); font-weight: 800; }
.simu-detail { margin-top: var(--e-2) !important; }
.grille-notes { display: grid; gap: var(--e-3); grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }
.champ-note { margin: 0; }
.champ-note label { display: flex; gap: var(--e-2); align-items: center; }
.simu-plan { padding: var(--e-4); border-radius: var(--r-panneau); border: 2px solid var(--marque); }
.simu-titre-plan { font-weight: 700; }

.offres-compactes { grid-template-columns: 1fr 1fr; }
.offres-compactes .offre { text-decoration: none; color: var(--texte); }
.offres-compactes .offre:hover { border-color: var(--marque); }

.contenu-editorial h2 { font-size: var(--t-2); margin-top: var(--e-6); }
.contenu-editorial h3 { font-size: var(--t-1); margin-top: var(--e-5); }
.contenu-editorial > :first-child { margin-top: 0; }
.contenu-editorial > :last-child { margin-bottom: 0; }
.faq { border-top: 1px solid var(--ligne); }

/* Pages légales */
.legal h2 { font-size: var(--t-1); margin-top: var(--e-6); }
.legal dl { display: grid; grid-template-columns: max-content 1fr; gap: var(--e-1) var(--e-4); }
.legal dt { font-weight: 700; }
.legal dd { margin: 0; }
@media (max-width: 40rem) { .legal dl { grid-template-columns: 1fr; } .legal dd { margin-bottom: var(--e-2); } }

/* ---------- Administration ---------- */
.admin-nav ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--e-2); max-width: none; }
.admin-nav li { margin: 0; }
.admin-nav a {
  display: inline-flex; align-items: center; min-height: var(--cible); padding: 0 var(--e-3);
  border-radius: var(--r-bouton); border: 2px solid var(--ligne); background: var(--surface);
  color: var(--texte); text-decoration: none; font-weight: 700;
}
.admin-nav a[aria-current="page"] { border-color: var(--marque); background: var(--marque); color: var(--sur-marque); }
.stat-grand { font-size: var(--t-4); margin: 0; }
.etat { display: inline-flex; align-items: center; gap: var(--e-1); font-weight: 700; white-space: nowrap; }
.etat-alerte { color: var(--danger); }
.etat-ok { color: var(--succes); }
.tableau-saisie input:not([type="checkbox"]) { min-height: 40px; padding: var(--e-1) var(--e-2); width: auto; max-width: 14rem; }
.tableau-saisie input[type="checkbox"] { width: 1.3rem; height: 1.3rem; accent-color: var(--marque); }
.tableau tr.inactif { opacity: .55; }
.tableau caption { text-align: start; margin-bottom: var(--e-3); }

/* Fiches de chapitre */
.fiche-contenu h3 { font-size: var(--t-1); margin-top: var(--e-5); }
.fiche-contenu > :first-child { margin-top: 0; }