/* -------------------
   Listes à l’intérieur des bulles de messages
------------------- */
#messages .message-content ol,
#messages .message-content ul {
  margin: 0.5em 0 0.75em 1.5em; /* espace avant/après + indentation */
  padding: 0;
  list-style-position: outside;     /* numéros/puces à l’extérieur */
}

#messages .message-content li {
  margin: 0.3em 0;
  line-height: 1.5;
  list-style: auto; /* conserve le type (disc/decimal) */
}

/* Neutralisation d’anciennes marges négatives éventuelles */
#messages li,
#messages .message-content li {
  margin-bottom: 0.3em !important;
  list-style: auto;
}

/* -------------------
   Listes UL / OL - Traitement unifié
------------------- */
/* UL et OL : traitement unifié pour les éléments li */
ol li, ul li {
  position: relative;
  margin: -0.8em 2em; /* espacement et indentation uniforme */
  padding-left: 1.4em; /* espace pour la puce ou le numéro */
  list-style: auto;
}

/* Style spécifique pour les marqueurs des listes ordonnées */
ol li::marker {
  font-weight: 600;
  color: #fbbf24; /* amber-400 */
}

ul li::marker {
  font-weight: 600;
  color: #fbbf24; /* amber-400 */
}

/* -------------------
   Paragraphe générique
------------------- */
p {
  background: #caecf422;
  padding: 0.5em 1em;
  border-radius: 1em;
}

/* -------------------
   MathJax - amélioration du rendu des équations
------------------- */

.mjx-chtml {
  font-size: 1.9em !important; /* Taille de base pour toutes les équations */
  line-height: 2;
  margin: 0.5em 0;
}

/* Équations en ligne */
.mjx-chtml[role="math"] {
  display: inline-block;
  vertical-align: middle;
  padding: 0.2em 0;
}

/* Équations en bloc (affichage) */
.MathJax_Display {
  display: block;
  margin: 1em 0;
  text-align: center;
  padding: 0.5em 0;
  overflow-x: auto; /* Permet le défilement horizontal pour les équations larges */
}

/* Conteneurs MathJax */
.mjx-math {
  margin: 0.2em 0;
}

/* Ajout de styles pour les équations dans les listes */
ol li .mjx-chtml,
ul li .mjx-chtml {
  margin: 0.3em 0;
}

/* -------------------
   Animations
------------------- */
@keyframes fadeSlideIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* -------------------
   Feedback / Corrections
------------------- */
.correct, .incorrect, .strong, .improve, .rappel,
.bonneReponse, .resolution, .remediation {
  animation: fadeSlideIn 0.4s ease-out both;
  margin: 0.4em 0;
}

/* ✅ Bonne réponse globale */
.correct {
  color: #22c55e; /* vert vif */
  font-weight: 600;
}

/* ❌ Retour global incorrect */
.incorrect {
  color: #f87171; /* rouge clair */
  font-weight: 500;
}

/* 👏 Mise en avant d’un point fort */
.strong {
  color: #38bdf8; /* bleu clair */
  font-weight: 500;
}

/* ⚠️ Axe d’amélioration */
.improve {
  color: #facc15; /* jaune/ambre */
  font-weight: 500;
}

/* 🧠 Rappel pédagogique */
.rappel {
  color: #a78bfa; /* violet doux */
  font-style: italic;
}

/* 🎯 Bonne réponse précise */
.bonneReponse {
  color: #ef4444; /* rouge vif */
  font-weight: 700;
}

/* ✍️ Étapes de résolution */
.resolution {
  color: #2dd4bf; /* turquoise */
  border-left: 3px solid #2dd4bf;
  padding-left: 0.5em;
}

/* 🧩 Mini-exercice de remédiation */
.remediation {
  background: rgba(34, 211, 238, 0.08); /* bleu clair translucide */
  border: 1px solid rgba(34, 211, 238, 0.3);
  border-radius: 0.5em;
  padding: 0.6em 0.8em;
}

/* Styles supplémentaires pour les conteneurs de messages */
#messages .message-content {
  overflow-x: auto; /* Permet le défilement horizontal si nécessaire */
}

/* Amélioration de la visibilité des équations dans les listes */
ol li .MathJax_Display,
ul li .MathJax_Display {
  margin: 0.5em 0;
}

/* Style pour les équations en ligne dans les paragraphes */
p .mjx-chtml {
  margin: 0 0.2em;
  vertical-align: middle;
}

/* Style pour les équations dans les éléments de liste */
li .mjx-chtml {
  margin: 0.2em 0;
}

/* Style pour les équations en bloc dans les éléments de liste */
li .MathJax_Display {
  margin: 0.5em 0;
}