/* ─────────────────────────────────────────
   quiz.css  —  cartes QCM
   ───────────────────────────────────────── */

.quiz-card {
  align-self: flex-start;
  max-width: 88%;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.quiz-label {
  font-size: 10px;
  color: #4a8fd4;
  padding: 0 4px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.quiz-body {
  background: var(--bg-surface);
  border: 0.5px solid var(--border);
  border-radius: var(--radius);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.quiz-question {
  font-size: 13px;
  color: var(--text-primary);
  line-height: 1.6;
  white-space: pre-wrap;
}

.quiz-options {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

/* ── Bouton option ── */
.quiz-btn {
  background: var(--bg-app);
  border: 0.5px solid var(--border);
  border-radius: var(--radius);
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 12px;
  padding: 7px 11px;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.12s, color 0.12s;
}

.quiz-btn:hover:not(:disabled) {
  border-color: var(--accent-blue);
  color: var(--accent-blue);
}

/* États après réponse */
.quiz-btn:disabled {
  cursor: default;
}

.quiz-btn.correct {
  border-color: #3fb950;
  color: #3fb950;
  background: #0d2b0d;
}

.quiz-btn.wrong {
  border-color: #f87171;
  color: #f87171;
  background: #2b0d0d;
}

.quiz-btn.dimmed {
  opacity: 0.35;
}