/* 
 * Chapitre dépliable 
*/

/* Conteneur global */
.lcs-chapitres {
  margin: 2rem 0;
  font-family: "Segoe UI", Roboto, sans-serif;
}

.chapitre {
    border-style: solid;
    border-radius: 10px;
    margin-block: 10px;
    border-color: #e0e0e0;
}

/* Titre de chapitre */
.chapitre-title {
  padding: 14px 18px;
  margin: 0 0 8px 0;
  cursor: pointer;
  font-size: 1.2rem;
  font-weight: 600;
  border-radius: 4px;
  transition: background 0.2s ease;
}
.chapitre-title:hover {
  background: #eaeaea;
}

/* Contenu dépliable */
.chapitre-content {
  margin: 0 0 20px 0;
  padding: 0 12px;
  display: none;
}

.chapitre-content.open { 
	display: block; 
}

/* Liste des items */
.topic-list,
.quiz-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.topic-item,
.quiz-item {
  	padding: 20px;
	margin: 15px 0px;
	display: flex;
	flex-direction: column;
	border-style: solid;
	border-radius: 10px;
	border-color: #e0e0e0;
}

.topic-item:last-child,
.quiz-item:last-child {
  border-bottom: none;
}

.topic-play {
	border-color: #0a4d5c;
}

.topic-blocked {
	background: #f8fcfe;
    border-color: #a8dff0;
    opacity: 0.6;
}

.topic-blocked a {
  pointer-events: none;
  cursor: default;
  color: gray;
  text-decoration: none;
}

.quiz-play {
	border-color: #0a4d5c;
}

.quiz-blocked {
	background: #f8fcfe;
    border-color: #a8dff0;
    opacity: 0.6;
}

.quiz-blocked a {
  pointer-events: none;
  cursor: default;
  color: gray;
  text-decoration: none;
}

/* Titre cliquable */
.topic-item a,
.quiz-item a {
  font-weight: 600;
  font-size: 1rem;
  color: #0073aa;
  text-decoration: none;
	display: flex;
    gap: 10px;
    align-items: center;	
}
.topic-item a:hover,
.quiz-item a:hover {
  text-decoration: underline;
}

/* Description */
.topic-description,
.quiz-description {
  font-size: 0.95rem;
  color: #444;
  margin: 6px 0;
}

.quiz-score__value {
	padding: 4px 10px;
    border-radius: 4px;
    font-weight: 600;
    font-size: 12px;
    background: #d4f4dd;
    color: #2d7a3e;
}

/* Image */
.topic-image,
.quiz-image {
	max-width: 100px;
    border-style: solid;
    border-radius: 10px;
    border-color: #e0e0e0;
}

.topic-image img,
.quiz-image img {
  max-width: 120px;
  border-radius: 4px;
  margin: 8px 0;
}

/* Métadonnées */
.meta {
  font-size: 0.85rem;
  color: #666;
  margin-top: 4px;
}
.meta span {
  margin-right: 14px;
}

/* Icônes automatiques */
.meta .duration::before {
  content: "🕒 ";
}
.meta .comments::before {
  content: "💬 ";
}
.meta .quiz-success {
  color: #2e7d32;
  font-weight: 600;
}

/* 
 * Progression 
*/

.progress-stat {
    background: linear-gradient(135deg, #f0f9fc 0%, #ffffff 100%);
    padding: 25px;
    border-radius: 10px;
    text-align: center;
    border: 2px solid #d4eff7;
    transition: all 0.3s;
}

.progress-stat-value {
    font-size: 36px;
    font-weight: 700;
    color: #0a4d5c;
    margin-bottom: 8px;
}

.progress-stat-label {
    font-size: 14px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}