/* =====================================================================
   Marcus Child — LearnDash learning pages, on-brand.
   Course index, lesson and topic pages. The paper canvas already shows
   through (#content is transparent); this brings the LearnDash components
   out of the grey placeholder world into the --mco-* system.
   Operate mode: brand lives in precise details, used with restraint.
   Tokens (--mco-*, fonts) come from custom.css, loaded before this file.
   ===================================================================== */

/* LearnDash colour variables → brand. Recolours the .ld-primary-* /
   .ld-secondary-* utility elements (inline accents, icons) in one place. */
.learndash-wrapper {
	--ld-primary-color: var(--mco-blue);
	--ld-primary-color-hover: #03597f;
	--ld-secondary-color: var(--mco-green-yellow);
	--ld-color-primary: var(--mco-blue);
}

/* ---------- Course banner / page header ---------- */
/* No cover photo → paper, not BuddyBoss's grey gradient (override its default). */
body.single-sfwd-courses .bb-learndash-banner:not(:has(.banner-img)),
body.single-sfwd-lessons .bb-learndash-banner:not(:has(.banner-img)),
body.single-sfwd-topic .bb-learndash-banner:not(:has(.banner-img)) {
	background: var(--mco-paper-soft) !important;
	background-image: none !important;
}
/* Kill BuddyBoss's dark cover-photo gradient overlay when there's no photo. */
body .bb-learndash-banner:not(:has(.banner-img))::before {
	display: none !important;
}
body .bb-learndash-banner:not(:has(.banner-img)) .entry-title {
	color: var(--mco-purple);
}
body .bb-learndash-banner:not(:has(.banner-img)) .bb-course-banner-inner .smexpert-course-header-type {
	color: var(--mco-blue);
}
.bb-learndash-banner .bb-course-banner-inner .smexpert-course-header-type {
	margin: 0 0 .4rem;
	color: var(--mco-blue);
	font-family: var(--mco-font-body);
	font-weight: 900;
	font-size: .78rem;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.bb-learndash-banner .entry-title,
.single-sfwd-lessons .bb-lms-header .entry-title,
.single-sfwd-topic .bb-lms-header .entry-title {
	position: relative;
	font-family: var(--mco-font-heading);
	font-weight: 700;
	color: var(--mco-purple);
	letter-spacing: -.01em;
	line-height: 1.12;
}
/* One restrained pen underline beneath the course title. */
.bb-learndash-banner .bb-course-banner-inner .entry-title::after {
	content: "";
	display: block;
	width: min(46%, 220px);
	height: 12px;
	margin: .6rem 0 0;
	background: url("../images/pen-underline-orange.svg") left center / 100% 12px no-repeat;
}
/* Cover-photo banners: switch the header ink to white for contrast. */
.bb-learndash-banner:has(.banner-img) .entry-title,
.bb-learndash-banner:has(.banner-img) .smexpert-course-header-type {
	color: var(--mco-white);
}
.bb-course-category a { color: var(--mco-blue); font-weight: 700; }

/* ---------- Progress ---------- */
.learndash-theme.single-sfwd-courses .ld-progress.ld-progress-inline .ld-progress-bar,
.single-item.groups.courses .ld-progress.ld-progress-inline .ld-progress-bar,
.learndash-wrapper .ld-progress .ld-progress-bar,
.course-progress-wrap .ld-progress-bar {
	height: 10px;
	background: rgba(18, 19, 21, .10);
	border-radius: 99px;
	overflow: hidden;
}
.learndash-theme.single-sfwd-courses .ld-progress .ld-progress-bar .ld-progress-bar-percentage,
.single-item.groups.courses .ld-progress .ld-progress-bar .ld-progress-bar-percentage,
.learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage,
.learndash-wrapper .ld-progress-bar-percentage.ld-secondary-background,
.course-progress-wrap .ld-progress-bar-percentage {
	height: 10px;
	background-color: var(--mco-green-yellow) !important;
	border-radius: 99px;
}
.learndash-wrapper .ld-progress-percentage.ld-secondary-color,
.learndash-wrapper .ld-progress-percentage,
.course-completion-rate {
	color: var(--mco-charcoal);
	font-weight: 700;
}

/* ---------- "Course Content" section heading ---------- */
.learndash-wrapper .ld-lesson-list .ld-section-heading h2,
.learndash-wrapper .ld-item-list .ld-section-heading h2 {
	font-family: var(--mco-font-heading);
	font-weight: 700;
	color: var(--mco-purple);
	font-size: clamp(1.5rem, 2.5vw, 2rem);
}

/* Lesson / topic page title (the BuddyBoss LMS header, not the banner). */
.learndash-wrapper--topic .bb-lms-header .lms-header-title h1,
.learndash-wrapper--lesson .bb-lms-header .lms-header-title h1,
.bb-lms-header .lms-header-title h1,
.bb-learndash-content-wrap .learndash-content-body > h1 {
	font-family: var(--mco-font-heading);
	color: var(--mco-purple);
}

/* Lesson / topic body headings take the editorial EB Garamond voice. */
.learndash-wrapper .learndash-content-body h2,
.learndash-wrapper .learndash-content-body h3,
#learndash-page-content .learndash_content_wrap h2,
#learndash-page-content .learndash_content_wrap h3 {
	font-family: var(--mco-font-heading);
	color: var(--mco-purple);
}

/* ---------- Lesson rows → hand-cut white cards on the paper ---------- */
.learndash-wrapper .ld-lesson-list.ld-item-list .ld-item-list-item {
	margin-bottom: 1rem;
	border: 0;
	box-shadow: none;
}
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-item-preview {
	background: var(--mco-white);
	border: 1px solid rgba(18, 19, 21, .10);
	border-radius: 7px 11px 8px 10px;
	box-shadow: 0 10px 22px var(--mco-shadow);
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-item-preview:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 28px rgba(18, 19, 21, .18);
}
.learndash-wrapper .ld-item-list .ld-item-list-item.ld-expanded {
	box-shadow: none;
}
.learndash-wrapper .ld-item-list .ld-item-list-item.ld-expanded .ld-item-list-item-preview {
	background: var(--mco-white);
	border-color: rgba(71, 0, 66, .45);
}
.learndash-wrapper .ld-item-list-item a.ld-item-name .ld-item-title,
.learndash-wrapper .ld-item-list-item a.ld-item-name {
	color: var(--mco-charcoal);
	font-weight: 700;
}
.learndash-wrapper .ld-item-list-item .ld-item-list-item-preview:hover a.ld-item-name .ld-item-title {
	color: var(--mco-blue);
}
.learndash-wrapper .ld-item-details,
.learndash-wrapper .ld-item-list-item .ld-item-components span {
	color: #55575a;
}

/* Status icons: incomplete = open blue ring, complete = green-yellow tick. */
.learndash-wrapper .ld-status-icon.ld-status-incomplete {
	border: 2px solid var(--mco-blue);
	background: transparent;
}
.learndash-wrapper .ld-status-icon.ld-status-complete {
	background-color: var(--mco-green-yellow);
	color: var(--mco-charcoal);
}

/* Nested topic table under each lesson. */
.learndash-wrapper .ld-table-list .ld-table-list-item-preview {
	background: transparent;
	transition: background-color .15s ease;
}
.learndash-wrapper .ld-table-list .ld-table-list-item-preview:hover {
	background: var(--mco-paper-soft);
}
/* Expanded lesson's topic-table header (BuddyBoss ships it dark w/ black text). */
.learndash-wrapper .ld-table-list .ld-table-list-header {
	background: var(--mco-paper-soft);
}
.learndash-wrapper .ld-table-list-header .ld-table-list-lesson-details,
.learndash-wrapper .ld-table-list-header .ld-table-list-title,
.learndash-wrapper .ld-lesson-list-progress {
	color: var(--mco-charcoal) !important;
}

/* Expand / collapse control: quiet outline, not a solid grey slab. */
.learndash-wrapper .ld-item-list .ld-item-list-actions .ld-expand-button,
.learndash-wrapper .ld-item-list .ld-item-list-actions .ld-expand-button.ld-primary-background {
	background: transparent;
	color: var(--mco-blue);
	border: 1px solid rgba(4, 115, 160, .4);
}
.learndash-wrapper .ld-item-list .ld-item-list-actions .ld-expand-button:hover {
	background: rgba(4, 115, 160, .08);
}

/* ---------- Buttons ---------- */
/* Primary action (Mark Complete, Continue/Start) = the green-yellow button. */
body .learndash-wrapper .learndash_content_wrap .learndash_mark_complete_button,
.bb-single-course-sidebar .bb-button-wrap .learndash_join_button a.button {
	background-color: var(--mco-green-yellow) !important;
	border: 2px solid transparent !important;
	border-radius: 6px 8px 6px 7px !important;
	color: var(--mco-white) !important;
	font-family: var(--mco-font-body);
	font-weight: 800;
	box-shadow: 0 5px 0 rgba(18, 19, 21, .12);
	text-shadow: 0 1px 1px rgba(18, 19, 21, .32);
	transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}
body .learndash-wrapper .learndash_content_wrap .learndash_mark_complete_button:hover,
.bb-single-course-sidebar .bb-button-wrap .learndash_join_button a.button:hover {
	background-color: #978c04 !important;
	transform: translateY(-2px);
	box-shadow: 0 7px 0 rgba(18, 19, 21, .14);
}

/* Lesson/topic navigation: secondary to Mark Complete, so keep it calm. */
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a {
	background-color: var(--mco-charcoal);
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a.next-link {
	background-color: var(--mco-blue);
}
#learndash-page-content .sfwd-course-nav .learndash_next_prev_link a:hover {
	background-color: #03597f;
}

/* ---------- Breadcrumbs / info bar ---------- */
.learndash-wrapper .bb-ld-info-bar .ld-breadcrumbs {
	border-bottom: 2px solid rgba(4, 115, 160, .28);
}
.learndash-wrapper .ld-breadcrumbs a,
.learndash-wrapper .ld-breadcrumbs .ld-breadcrumbs-segments a,
.bb-lms-header .ld-breadcrumbs a {
	color: var(--mco-blue);
}

/* ---------- Status pills ---------- */
/* .ld-primary-background paints these solid, so text must be white to read. */
.learndash-wrapper .bb-ld-status .ld-status.ld-status-complete,
.learndash-wrapper .bb-ld-status .ld-status.ld-status-complete.ld-primary-background {
	background-color: var(--mco-green-yellow) !important;
	color: var(--mco-charcoal) !important;
}
.learndash-wrapper .bb-ld-status .ld-status.ld-status-progress,
.learndash-wrapper .bb-ld-status .ld-status.ld-status-progress.ld-primary-background {
	background-color: var(--mco-blue) !important;
	color: var(--mco-white) !important;
}

/* ---------- Course-index sidebar: dark "Progress" panel ---------- */
.bb-course-preview-content {
	background-color: var(--mco-charcoal);
	color: var(--mco-white);
}
.bb-course-preview-content .course-completion-rate,
.bb-course-preview-content .ld-progress-percentage,
.bb-course-preview-content .ld-progress-percentage.ld-secondary-color {
	color: var(--mco-white) !important;
}

/* ---------- Topic/lesson focus sidebar: light panel (matches frontend) ----
   BuddyBoss's lesson/topic text colours assume a light background, so keep it
   light and give it brand accents rather than fighting every default. */
.lms-topic-sidebar-course-navigation-contents {
	background-color: var(--mco-white);
	color: var(--mco-charcoal);
}
.lms-topic-sidebar-wrapper .lms-topic-sidebar-progress,
.lms-topic-sidebar-wrapper .course-completion-rate,
.lms-topic-sidebar-wrapper .ld-progress-percentage {
	color: var(--mco-charcoal);
}
.lms-topic-sidebar-wrapper ol.bb-lessons-list,
.lms-topic-sidebar-wrapper li.lms-lesson-item,
.lms-topic-sidebar-wrapper .lms-toggle-lesson,
.lms-topic-sidebar-wrapper .lms-lesson-item-title {
	color: var(--mco-charcoal);
}
.lms-topic-sidebar-wrapper .lms-topic-item a {
	color: #33353a;
}
.lms-topic-sidebar-wrapper .lms-topic-item a:hover {
	color: var(--mco-blue);
	background: var(--mco-paper-soft);
}
/* Lesson headers (BuddyBoss paints these with the grey placeholder tokens
   and white text) → paper chips with charcoal ink. The white text lives on
   child spans, so the colour has to reach the descendants too. */
.lms-topic-sidebar-wrapper .bb-lesson-head {
	background: var(--mco-paper-soft) !important;
	border-radius: 6px 8px 6px 7px;
}
.lms-topic-sidebar-wrapper .bb-lesson-head,
.lms-topic-sidebar-wrapper .bb-lesson-head * {
	color: var(--mco-charcoal) !important;
}
/* The open lesson gets a marker-underline accent (keeps the paper chip). */
.lms-topic-sidebar-wrapper .lms-lesson-item:not(.lms-lesson-turnover) .bb-lesson-head {
	box-shadow: inset 0 -3px 0 var(--mco-green-yellow);
}
/* Current topic within the open lesson. */
.lms-topic-sidebar-wrapper .lms-topic-item.current > a {
	color: var(--mco-blue);
	font-weight: 700;
	background: rgba(4, 115, 160, .07);
}
.lms-topic-sidebar-course-navigation .ld-course-navigation .course-entry-title {
	font-family: var(--mco-font-heading);
	color: var(--mco-charcoal);
}

/* ---------- Content tabs (Content / Materials) ---------- */
.bb-ld-tabs .ld-tabs-navigation .ld-tab-title.ld-active,
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active {
	color: var(--mco-purple);
	border-bottom-color: var(--mco-green-yellow);
}

/* ---------- Certificate success alert ---------- */
.learndash-wrapper .ld-alert.ld-alert-certificate.ld-alert-success {
	border-color: rgba(174, 161, 5, .5);
	background: rgba(174, 161, 5, .10);
}

@media screen and (prefers-reduced-motion: reduce) {
	.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-item-preview,
	body .learndash-wrapper .learndash_content_wrap .learndash_mark_complete_button,
	.bb-single-course-sidebar .bb-button-wrap .learndash_join_button a.button {
		transition: none;
	}
}
