/*
 * Habillage de LearnDash (modèle LD30) aux couleurs ABCampus.
 *
 * LES COULEURS NE SONT PAS ICI. Elles se règlent dans LearnDash :
 *   LearnDash LMS > Réglages > Général > Éléments de conception
 *     Couleur accentuée ......... #FFB200  (ambre)
 *     Couleur de progression .... #6E7C12  (olive foncé)
 *     Notifications ............. #C63A22  (corail foncé)
 *
 * LearnDash régénère alors sa propre feuille en ligne avec ces valeurs.
 * C'est la méthode prévue par le plugin, et elle couvre bien plus
 * d'éléments qu'une liste de surcharges CSS ne pourrait en atteindre.
 *
 * Cette feuille ne s'occupe donc que de la FORME : typographies, rayons,
 * ombres, espacements, et mise en valeur de la vidéo. Aucun !important
 * n'est nécessaire, aucune bataille de spécificité.
 */

/* ---- La vidéo, élément central de nos leçons -------------------------- */

/* Elle déborde de la colonne de texte pour occuper toute la largeur utile.
   margin-left:50% + translateX(-50%) recentre un élément plus large que
   son parent, ce que margin:auto ne sait pas faire en cas de débordement. */
.learndash-wrapper .ld-tab-content .wp-block-embed.is-type-video,
.learndash-wrapper .ld-tab-content .wp-block-video {
	margin-bottom: var(--wp--preset--spacing--40);
	margin-left: 50%;
	margin-top: var(--wp--preset--spacing--30);
	max-width: none;
	transform: translateX(-50%);
	width: min(920px, calc(100vw - 3rem));
}

.learndash-wrapper .ld-tab-content .wp-block-embed.is-type-video iframe,
.learndash-wrapper .ld-tab-content .wp-block-video video {
	border-radius: 18px;
	box-shadow: 0 18px 40px -22px rgba(22, 16, 70, 0.45);
	display: block;
}

/* ---- Onglets « Leçon / Documents » ------------------------------------ */

.learndash-wrapper .ld-tabs .ld-tabs-navigation {
	border-bottom: 1px solid var(--wp--preset--color--line);
	gap: 4px;
}

.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab {
	font-family: var(--wp--preset--font-family--fredoka);
	font-size: 15px;
	font-weight: 500;
	padding: 12px 18px;
	text-transform: none;
}

.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active {
	font-weight: 600;
}

.learndash-wrapper .ld-tabs .ld-tabs-content .ld-tab-content {
	padding-top: var(--wp--preset--spacing--30);
}

/* ---- Bandeau de situation : fil d'Ariane + étiquette d'état ----------- */

/* LearnDash le pose sur un gris bleuté étranger à la charte : on le réduit
   à une simple ligne de séparation.
   Attention, le conteneur change de nom selon le type de contenu :
   ld-lesson-status, ld-topic-status, ld-quiz-status, ld-course-status.
   Les quatre doivent être listés — n'en traiter qu'un laissait les notions
   avec leur fond gris. */
.learndash-wrapper .ld-lesson-status,
.learndash-wrapper .ld-topic-status,
.learndash-wrapper .ld-quiz-status,
.learndash-wrapper .ld-course-status {
	background: transparent;
	border: none;
	border-bottom: 1px solid var(--wp--preset--color--line);
	border-radius: 0;
	margin-bottom: var(--wp--preset--spacing--30);
	padding: 0 0 14px;
}

/* Sur une leçon, une notion ou un quiz, la barre de progression fait double
   emploi avec l'étiquette d'état : on ne garde que l'étiquette. Les
   formations, elles, conservent leur progression. */
.single-sfwd-lessons .learndash-wrapper .ld-lesson-status .ld-progress,
.single-sfwd-lessons .learndash-wrapper .ld-topic-status .ld-progress,
.single-sfwd-topic .learndash-wrapper .ld-lesson-status .ld-progress,
.single-sfwd-topic .learndash-wrapper .ld-topic-status .ld-progress,
.single-sfwd-quiz .learndash-wrapper .ld-lesson-status .ld-progress,
.single-sfwd-quiz .learndash-wrapper .ld-quiz-status .ld-progress {
	display: none;
}

.learndash-wrapper .ld-breadcrumbs,
.learndash-wrapper .ld-breadcrumbs a,
.learndash-wrapper .ld-breadcrumbs span {
	font-size: 15px;
	text-decoration: none;
}

.learndash-wrapper .ld-breadcrumbs {
	background: transparent;
	border: none;
	margin-bottom: 0;
	padding: 0;
}

.learndash-wrapper .ld-breadcrumbs a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.learndash-wrapper .ld-status {
	border-radius: 20px;
	font-family: var(--wp--preset--font-family--fredoka);
	font-weight: 500;
	letter-spacing: 0.06em;
}

/* ---- Listes de leçons et de notions ----------------------------------- */

.learndash-wrapper .ld-item-list .ld-item-list-item {
	background: var(--wp--preset--color--surface);
	border: none;
	border-radius: 16px;
	box-shadow: var(--wp--preset--shadow--light);
	margin-bottom: 12px;
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.learndash-wrapper .ld-item-list .ld-item-list-item:hover {
	box-shadow: var(--wp--preset--shadow--natural);
	transform: translateY(-2px);
}

.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-name,
.learndash-wrapper .ld-table-list .ld-topic-title {
	font-family: var(--wp--preset--font-family--fredoka);
	font-size: 16px;
	font-weight: 500;
}

.learndash-wrapper .ld-table-list .ld-table-list-header {
	border-radius: 16px 16px 0 0;
	font-family: var(--wp--preset--font-family--fredoka);
}

.learndash-wrapper .ld-table-list .ld-table-list-items {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 0 0 16px 16px;
	border-top: none;
	overflow: hidden;
}

.learndash-wrapper .ld-table-list-item-preview:hover {
	background: var(--wp--preset--color--surface-warm);
}

/* ---- Barre de progression --------------------------------------------- */

.learndash-wrapper .ld-progress .ld-progress-bar,
.learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage {
	border-radius: 20px;
	height: 10px;
}

/* ---- Boutons ----------------------------------------------------------- */

/* Seule la forme : la couleur vient du réglage « Couleur accentuée ». */
.learndash-wrapper .ld-button,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button {
	border-radius: 14px;
	font-family: var(--wp--preset--font-family--hanken-grotesk);
	font-size: 15px;
	font-weight: 700;
	padding: 13px 26px;
	text-transform: none;
}

.learndash-wrapper .ld-expand-button {
	border-radius: 12px;
	font-weight: 600;
}

/* ---- Actions de bas de page ------------------------------------------- */

.learndash-wrapper .ld-content-actions {
	border-top: 1px solid var(--wp--preset--color--line);
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--30);
}

/* ---- Quiz -------------------------------------------------------------- */

.learndash-wrapper .wpProQuiz_content .wpProQuiz_header,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_text {
	font-family: var(--wp--preset--font-family--hanken-grotesk);
}

/* Une réponse = une carte cliquable */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 14px;
	margin-bottom: 10px;
	transition: border-color 0.15s ease;
}

.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem label {
	cursor: pointer;
	display: block;
	padding: 14px 18px;
}

.learndash-wrapper .wpProQuiz_content .wpProQuiz_response {
	border-radius: 14px;
	margin-top: 14px;
	padding: 16px 18px;
}

/* ---- Accessibilité ----------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.learndash-wrapper .ld-item-list .ld-item-list-item,
	.learndash-wrapper .ld-item-list .ld-item-list-item:hover {
		transform: none;
		transition: none;
	}
}

/* ---- Mobile ------------------------------------------------------------ */

@media (max-width: 782px) {
	.learndash-wrapper .ld-tab-content .wp-block-embed.is-type-video,
	.learndash-wrapper .ld-tab-content .wp-block-video {
		margin-left: 0;
		transform: none;
		width: 100%;
	}

	.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab {
		font-size: 14px;
		padding: 10px 12px;
	}
}