/**
 * LearnDash (LD30) overrides.
 *
 * BuddyBoss ships its own LD30 restyle, so these rules sit on top of two
 * layers. They are scoped to LearnDash's own wrappers rather than raised with
 * !important wherever possible — the one place !important is unavoidable is
 * LD's inline progress-bar colour, which is printed as a style attribute.
 */

/* ------------------------------------------------------- course listings */

.learndash-wrapper .ld-course-list-items {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
}

.learndash-wrapper .ld-course-list-items .ld_course_grid {
	width: 100%;
	margin: 0;
	padding: 0;
}

.learndash-wrapper .ld_course_grid .thumbnail.course {
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-lg);
	box-shadow: none;
	overflow: hidden;
	background: var(--rcm-card);
	height: 100%;
	display: flex;
	flex-direction: column;
}

.learndash-wrapper .ld_course_grid .thumbnail.course .caption {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	flex: 1;
	padding: 1rem 1.1rem 1.25rem;
}

.learndash-wrapper .ld_course_grid .thumbnail.course .entry-title {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-lg);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.3;
	margin: 0;
}

/* --------------------------------------------------------- course header */

.learndash-wrapper .ld-course-status {
	border-radius: var(--rcm-radius-lg);
	border-color: var(--rcm-border);
	background: var(--rcm-card);
}

.learndash-wrapper .ld-course-status.ld-course-status-enrolled {
	background: var(--rcm-navy-08);
	border-color: transparent;
}

.learndash-wrapper .ld-status.ld-status-progress {
	background: var(--rcm-gold-12);
	color: #7a5300;
}

.learndash-wrapper .ld-status.ld-status-complete {
	background: rgb(6 118 71 / 0.12);
	color: var(--rcm-success);
}

.learndash-wrapper .ld-status-icon.ld-status-complete {
	background-color: var(--rcm-success);
}

.learndash-wrapper .ld-status-icon.ld-status-in-progress {
	border-color: var(--rcm-gold);
}

/* LD prints the fill colour inline; matching its specificity requires this. */
.learndash-wrapper .ld-progress-bar .ld-progress-bar-percentage {
	background-color: var(--rcm-navy) !important;
	border-radius: var(--rcm-radius-pill);
}

.learndash-wrapper .ld-progress-bar {
	background-color: var(--rcm-muted);
	border-radius: var(--rcm-radius-pill);
	height: 0.5rem;
	border: 0;
}

/* -------------------------------------------------------------- buttons */

.learndash-wrapper .ld-button,
.learndash-wrapper .learndash_mark_complete_button,
.learndash-wrapper #btn-join {
	background-color: var(--rcm-navy);
	border-radius: var(--rcm-radius);
	font-family: var(--rcm-font-sans);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	padding: 0.8rem 1.4rem;
	transition: background-color 0.16s ease;
}

.learndash-wrapper .ld-button:hover,
.learndash-wrapper .learndash_mark_complete_button:hover,
.learndash-wrapper #btn-join:hover {
	background-color: var(--rcm-navy-hover);
}

/* "Mark complete" is the one action students hunt for at the end of a lesson,
   so it gets the gold accent rather than sitting in navy with everything else. */
.learndash-wrapper .ld-lesson-status .learndash_mark_complete_button {
	background-color: var(--rcm-gold);
	color: var(--rcm-gold-fg);
}

.learndash-wrapper .ld-lesson-status .learndash_mark_complete_button:hover {
	background-color: var(--rcm-gold-bright);
}

.learndash-wrapper .ld-button.ld-button-transparent {
	background: transparent;
	color: var(--rcm-navy);
	border: 1px solid var(--rcm-border);
}

/* ------------------------------------------------------ lesson curriculum */

.learndash-wrapper .ld-item-list-item {
	border-radius: var(--rcm-radius);
	border-color: var(--rcm-border);
	background: var(--rcm-card);
	margin-bottom: 0.5rem;
}

.learndash-wrapper .ld-item-list-item.ld-is-current-item {
	border-color: var(--rcm-navy);
	box-shadow: inset 3px 0 0 var(--rcm-navy);
}

.learndash-wrapper .ld-item-list-item a.ld-item-name {
	font-weight: 600;
	color: var(--rcm-fg);
}

.learndash-wrapper .ld-item-list-item a.ld-item-name:hover {
	color: var(--rcm-navy);
}

.learndash-wrapper .ld-item-list-section-heading {
	font-family: var(--rcm-font-display);
	letter-spacing: -0.02em;
}

/* --------------------------------------------------------- focus mode */

.learndash-wrapper .ld-focus {
	background: var(--rcm-bg);
}

.learndash-wrapper .ld-focus-sidebar {
	background: var(--rcm-card);
	border-right-color: var(--rcm-border);
}

.learndash-wrapper .ld-focus-header {
	background: var(--rcm-card);
	border-bottom-color: var(--rcm-border);
}

.learndash-wrapper .ld-focus-sidebar .ld-course-navigation-heading {
	background: var(--rcm-navy-deep);
	color: #fff;
}

.learndash-wrapper .ld-focus-sidebar .ld-course-navigation-heading .ld-brand-color {
	color: var(--rcm-gold);
}

/* ----------------------------------------------------------------- quiz */

.learndash-wrapper .wpProQuiz_content .wpProQuiz_button,
.learndash-wrapper .wpProQuiz_content input[type="button"] {
	background-color: var(--rcm-navy);
	border-radius: var(--rcm-radius);
	font-weight: 600;
}

.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem {
	border-radius: var(--rcm-radius);
	border-color: var(--rcm-border);
}

.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionListItem:hover {
	border-color: var(--rcm-navy);
}

/* ------------------------------------------------- RCM course meta strip */

/* Course code, level, hours and fee, printed by inc/learndash.php above the
   LearnDash course content. Kept as one row so it reads like an exam header. */
.rcm-course-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	padding: 0.9rem 1.15rem;
	margin-bottom: 1.25rem;
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius);
}

.rcm-course-meta__item {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.rcm-course-meta__label {
	font-size: var(--rcm-text-xs);
	color: var(--rcm-muted-fg);
}

.rcm-course-meta__value {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

/* =========================================================================
 * SINGLE COURSE PAGE
 * Pitch and syllabus left, sticky purchase card right.
 * ====================================================================== */

.rcm-course {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
	align-items: start;
}

@media (min-width: 64rem) {
	.rcm-course {
		grid-template-columns: minmax(0, 1fr) 22rem;
		gap: 3rem;
	}
}

.rcm-course__main {
	min-width: 0;
}

.rcm-course__eyebrow {
	color: var(--rcm-navy);
}

.rcm-course__title {
	font-family: var(--rcm-font-display);
	font-size: clamp(2rem, 1.5rem + 2vw, 3rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.08;
	margin: 0.35rem 0 0;
}

.rcm-course__code {
	font-size: var(--rcm-text-base);
	color: var(--rcm-muted-fg);
	margin: 0.5rem 0 0;
}

.rcm-course__lede p {
	font-size: var(--rcm-text-lg);
	line-height: 1.6;
	color: var(--rcm-muted-fg);
	margin: 1.25rem 0 0;
}

/* -------------------------------------------------------- selling points */

.rcm-course__outcomes {
	list-style: none;
	margin: 1.75rem 0 0;
	padding: 0;
	display: grid;
	gap: 0.75rem;
}

.rcm-course__outcomes li {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	font-size: var(--rcm-text-base);
	line-height: 1.5;
}

.rcm-course__outcomes .rcm-icon {
	color: var(--rcm-navy);
	width: 1.15rem;
	height: 1.15rem;
	margin-top: 0.15rem;
}

.rcm-course__h2 {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-2xl);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 2.5rem 0 1rem;
}

/* --------------------------------------------------------------- syllabus */

/* One card with hairline dividers rather than separate cards per row: eight
   individually bordered rows reads as eight things to decide about, when it is
   really one list. */
.rcm-syllabus {
	list-style: none;
	margin: 0;
	padding: 0;
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-2xl);
	overflow: hidden;
}

.rcm-syllabus li + li .rcm-syllabus__row {
	border-top: 1px solid var(--rcm-border);
}

.rcm-syllabus__row {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1rem 1.25rem;
	color: inherit;
	text-decoration: none;
}

a.rcm-syllabus__row:hover {
	background: var(--rcm-muted);
}

.rcm-syllabus__n {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--rcm-muted);
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	color: var(--rcm-fg);
	font-variant-numeric: tabular-nums;
}

.rcm-syllabus__row.is-complete .rcm-syllabus__n {
	background: var(--rcm-success);
	color: #fff;
}

.rcm-syllabus__body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.rcm-syllabus__title {
	font-weight: 600;
	line-height: 1.35;
}

.rcm-syllabus__kind {
	font-size: var(--rcm-text-sm);
	color: var(--rcm-muted-fg);
	margin-top: 0.1rem;
}

.rcm-syllabus__time {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	flex: 0 0 auto;
	font-size: var(--rcm-text-sm);
	color: var(--rcm-muted-fg);
	font-variant-numeric: tabular-nums;
}

.rcm-syllabus__time .rcm-icon {
	width: 0.95rem;
	height: 0.95rem;
}

/* ------------------------------------------------------------ buy card */

.rcm-course__aside {
	min-width: 0;
}

@media (min-width: 64rem) {
	.rcm-course__aside {
		position: sticky;
		top: 6rem;
	}
}

.rcm-buycard {
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-2xl);
	box-shadow: var(--rcm-shadow-soft);
	padding: 1.75rem;
}

.rcm-buycard__price {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-3xl);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--rcm-navy);
	margin: 0;
	line-height: 1.1;
}

.rcm-buycard__note {
	font-size: var(--rcm-text-sm);
	color: var(--rcm-muted-fg);
	margin: 0.35rem 0 1.25rem;
}

/* Padded so it is a thumb-sized target, not a 16px line of text. */
.rcm-buycard__more {
	display: block;
	margin-top: 1rem;
	padding: 0.6rem 0;
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	color: var(--rcm-navy);
	text-decoration: none;
}

.rcm-buycard__more:hover {
	text-decoration: underline;
}

/* Reassurance under the buy button: a student paying by card wants to know
   the course opens without a phone call. */
.rcm-buycard__terms {
	font-size: var(--rcm-text-xs);
	color: var(--rcm-muted-fg);
	margin: 0.75rem 0 0;
	text-align: center;
}

/* Topics and quizzes sit under the lesson they belong to, so the shape of the
   course is readable at a glance rather than a flat list of twenty rows. */
.rcm-syllabus__row.is-nested {
	padding-left: 2.75rem;
	background: rgb(238 240 246 / 0.45);
}

.rcm-syllabus__row.is-nested .rcm-syllabus__n {
	width: 1.5rem;
	height: 1.5rem;
	font-size: var(--rcm-text-xs);
}

.rcm-syllabus__row.is-nested .rcm-syllabus__title {
	font-weight: 500;
	font-size: var(--rcm-text-sm);
}

.rcm-course__body,
.rcm-course__materials {
	margin-top: 1.5rem;
}

.rcm-course__materials {
	padding: 1.25rem 1.5rem;
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-2xl);
}

.rcm-course__materials ul {
	margin: 0;
	padding-left: 1.1rem;
}

.rcm-course__materials li {
	margin-bottom: 0.4rem;
}

/* Zoom meeting details, for students joining from the app rather than the
   link. Tabular figures so an eleven-digit ID is readable in groups. */
.rcm-zoom {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.35rem 1rem;
	margin: 1rem 0 0;
	padding: 0.9rem 1rem;
	background: var(--rcm-muted);
	border-radius: var(--rcm-radius);
	font-size: var(--rcm-text-sm);
}

.rcm-zoom dt {
	color: var(--rcm-muted-fg);
	margin: 0;
}

.rcm-zoom dd {
	margin: 0;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.02em;
	text-align: right;
	user-select: all;
}

/* =========================================================================
 * PROGRAMME PAGE
 * ====================================================================== */

.rcm-progintro {
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
}

.rcm-progintro .rcm-program__icon {
	flex: 0 0 auto;
}

.rcm-progintro__body {
	min-width: 0;
}

.rcm-progintro__board {
	color: var(--rcm-navy);
	margin: 0.35rem 0 0;
}

.rcm-progintro__title {
	font-family: var(--rcm-font-display);
	font-size: clamp(1.9rem, 1.4rem + 2vw, 2.75rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	line-height: 1.1;
	margin: 0.15rem 0 0;
}

.rcm-progintro__lede p {
	font-size: var(--rcm-text-lg);
	line-height: 1.6;
	color: var(--rcm-muted-fg);
	max-width: 44rem;
	margin: 0.9rem 0 0;
}

.rcm-progintro__fee {
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	color: var(--rcm-fg);
	margin: 1rem 0 0;
}

/* ------------------------------------------------------------- levels */

.rcm-level__title {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-2xl);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 1rem;
}

/* One card with hairline dividers, not one card per paper: eighteen bordered
   boxes reads as eighteen decisions when it is really one list. */
.rcm-papers {
	list-style: none;
	margin: 0;
	padding: 0;
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-2xl);
	overflow: hidden;
}

.rcm-papers li + li .rcm-paper-row {
	border-top: 1px solid var(--rcm-border);
}

.rcm-paper-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.1rem 1.35rem;
	color: inherit;
	text-decoration: none;
}

.rcm-paper-row:hover {
	background: var(--rcm-muted);
}

.rcm-paper-row__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.4rem;
	min-width: 0;
}

.rcm-paper-row__title {
	font-weight: 600;
	line-height: 1.35;
}

.rcm-paper-row__end {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex: 0 0 auto;
}

.rcm-paper-row__price {
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	color: var(--rcm-navy);
	font-variant-numeric: tabular-nums;
}

/* On a phone the price and button drop under the title rather than squeezing
   it to nothing. */
@media (max-width: 40rem) {
	.rcm-paper-row {
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
	}

	.rcm-paper-row__end {
		justify-content: space-between;
	}
}

.rcm-bundle__blurb {
	font-size: var(--rcm-text-base);
	line-height: 1.6;
	color: var(--rcm-muted-fg);
	max-width: 44rem;
	margin: -0.5rem 0 1rem;
}

/* =========================================================================
 * PROGRAMME LAYOUT
 * ====================================================================== */

.rcm-proglayout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
	max-width: var(--rcm-container);
	margin-inline: auto;
	padding-inline: var(--rcm-gutter);
}

/* The sidebar appears once there is room for it to be a column rather than a
   stack of cards pushed under the papers. */
@media (min-width: 64rem) {
	.rcm-proglayout {
		grid-template-columns: minmax(0, 1fr) 20rem;
		align-items: start;
	}
}

/* Sections inside the layout are already inside a container, so they must not
   add their own gutter or centre themselves again. */
.rcm-proglayout__main > .rcm-section {
	max-width: none;
	margin-inline: 0;
	padding-inline: 0;
}

.rcm-progaside {
	display: grid;
	gap: 1rem;
	position: sticky;
	top: 5.5rem;
}

.rcm-progaside__card {
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-2xl);
	padding: 1.35rem;
}

.rcm-progaside__card--dark {
	background: var(--rcm-navy-deep);
	border-color: transparent;
	color: #fff;
}

.rcm-progaside__card--quiet {
	background: var(--rcm-muted);
	border-color: transparent;
}

.rcm-progaside__price {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-2xl);
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--rcm-navy);
	margin: 0;
}

.rcm-progaside__note {
	font-size: var(--rcm-text-xs);
	color: var(--rcm-muted-fg);
	margin: 0.2rem 0 0;
}

.rcm-progaside__count {
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	margin: 0.9rem 0 0;
}

.rcm-progaside__eyebrow {
	color: var(--rcm-gold);
	margin: 0;
}

.rcm-progaside__sitting {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-xl);
	font-weight: 700;
	margin: 0.3rem 0 0;
}

.rcm-progaside__days {
	font-size: var(--rcm-text-sm);
	color: rgb(255 255 255 / 0.7);
	margin: 0.15rem 0 0;
}

.rcm-progaside__heading {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-base);
	font-weight: 700;
	margin: 0 0 0.75rem;
}

.rcm-progaside__classes {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.65rem;
}

.rcm-progaside__classes a {
	display: grid;
	gap: 0.1rem;
	color: inherit;
	text-decoration: none;
}

.rcm-progaside__classes a:hover .rcm-progaside__class {
	color: var(--rcm-navy);
}

.rcm-progaside__class {
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	line-height: 1.35;
}

.rcm-progaside__when {
	font-size: var(--rcm-text-xs);
	color: var(--rcm-muted-fg);
}

.rcm-progaside__more {
	display: inline-block;
	margin-top: 0.9rem;
	font-size: var(--rcm-text-sm);
	font-weight: 600;
	color: var(--rcm-navy);
}

.rcm-progaside__paybill {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-2xl);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.02em;
	margin: 0;
}

/* A price row showing a sale carries a struck-through original; underlining it
   as well made it read as a broken link. */
.rcm-paper-row__price del,
.rcm-paper-row__price ins {
	text-decoration-color: var(--rcm-muted-fg);
}

.rcm-paper-row__price ins {
	text-decoration: none;
}

.rcm-paper-row__price del {
	color: var(--rcm-muted-fg);
	font-weight: 500;
	margin-right: 0.35rem;
}

/* =========================================================================
 * TIMETABLE
 * ====================================================================== */

.rcm-day + .rcm-day {
	margin-top: 2rem;
}

.rcm-day__title {
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-lg);
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 0.75rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid var(--rcm-navy-12);
}

.rcm-day__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.5rem;
}

.rcm-classrow {
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr) auto;
	align-items: center;
	gap: 1rem;
	padding: 0.9rem 1.1rem;
	background: var(--rcm-card);
	border: 1px solid var(--rcm-border);
	border-radius: var(--rcm-radius-lg);
	color: inherit;
	text-decoration: none;
	transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.rcm-classrow:hover {
	border-color: var(--rcm-navy-12);
	box-shadow: var(--rcm-shadow-soft);
}

/* A class running now is the one thing on this page somebody needs to find
   immediately. */
.rcm-classrow--now {
	border-color: var(--rcm-gold);
	background: var(--rcm-gold-08, #fffaf0);
}

.rcm-classrow__time {
	display: grid;
	gap: 0.1rem;
	font-family: var(--rcm-font-display);
	font-size: var(--rcm-text-lg);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--rcm-navy);
}

.rcm-classrow__mins {
	font-family: var(--rcm-font-sans);
	font-size: var(--rcm-text-xs);
	font-weight: 500;
	color: var(--rcm-muted-fg);
}

.rcm-classrow__body {
	display: grid;
	gap: 0.15rem;
	min-width: 0;
}

.rcm-classrow__title {
	font-weight: 600;
	line-height: 1.35;
}

.rcm-classrow__meta {
	font-size: var(--rcm-text-sm);
	color: var(--rcm-muted-fg);
}

.rcm-classrow__end {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex: 0 0 auto;
}

.rcm-badge--live {
	background: var(--rcm-gold);
	color: var(--rcm-navy-deep);
	font-weight: 700;
}

@media (max-width: 40rem) {
	.rcm-classrow {
		grid-template-columns: 4.5rem minmax(0, 1fr);
		row-gap: 0.6rem;
	}

	/* The action moves under the title rather than squeezing a third column
	   into a phone. */
	.rcm-classrow__end {
		grid-column: 2;
		justify-content: flex-start;
	}
}

/* A join button that is not open yet. Visible, so a student can see it is
   there and will work, but plainly not pressable. */
.rcm-btn.is-waiting {
	opacity: 0.55;
	pointer-events: none;
	cursor: default;
}
