/* =====================================================================
 * SimpleSuite — LearnDash delivery polish (course + lesson, modern LD 5.x)
 *
 * CANONICAL MIRROR. This file is shipped in two places and MUST stay
 * byte-identical between them:
 *   - courseforge/assets/css/courseforge-ld-delivery.css   (product value-add;
 *       enqueued by CF_Delivery on any theme that runs LearnDash)
 *   - ss-theme/assets/css/learndash.css                    (the delivery theme
 *       Simple Theme ships with; enqueued by inc/learndash-templates.php)
 * CF yields to the theme handle when both are present (no double-load).
 *
 * Contract: no font-family (inherit the active theme / Launch preset);
 * no !important; colour + spacing from the chrome token contract so the
 * design auto-skins per site; squared house style. Scoped under
 * .simple-main-learndash (emitted by the Simple Theme LD templates).
 * ===================================================================== */

/* =====================================================================
 * CourseForge / Simple Theme — LearnDash MODERN course + lesson polish
 * PROTOTYPE (v0 draft for review). Not yet in the repo.
 *
 * Rules of the house:
 *   - NO font-family anywhere. Type inherits the active theme / Launch
 *     preset — the templates present whatever font the site is running.
 *   - NO !important. Everything wins on the .simple-main-learndash prefix.
 *   - Color + spacing come from the chrome token contract, so the design
 *     auto-skins to each fleet site's accent + neutrals.
 *   - Squared house style: border-radius:0 on every box we own. Circular
 *     glyphs (svg status icons) are left alone.
 * ===================================================================== */

/* Local aliases → chrome tokens (single source of truth) */
.simple-main-learndash {
	--sl-ink: var(--wp--custom--simple-chrome--heading, #1A1A1A);
	--sl-body: var(--wp--custom--simple-chrome--text, #353535);
	--sl-muted: var(--wp--custom--simple-chrome--muted, #6a6a6a);
	--sl-line: var(--wp--custom--simple-chrome--hairline, #E5E5E5);
	--sl-surface: var(--wp--custom--simple-chrome--bg, #FFFFFF);
	--sl-accent: var(--wp--custom--simple-chrome--accent, #235af3);
	--sl-accent-soft: var(--wp--custom--simple-chrome--accent-soft, rgba(0,0,0,.05));

	/* Page gutter owned here so the hero can break out of it exactly. */
	--sl-gutter-x: clamp(24px, 4vw, 48px);
	--sl-gutter-y: clamp(32px, 6vw, 80px);
	padding-block: var(--sl-gutter-y);
	padding-inline: var(--sl-gutter-x);
}

@media (max-width: 600px) {
	.simple-main-learndash { --sl-gutter-x: 20px; }
}

/* ---------------------------------------------------------------------
 * 0. HERO — the course's featured/background image with a legibility
 * scrim, eyebrow, title and an icon meta row. Gives the page its
 * "design importance". Falls back to the ink token (a clean dark band)
 * when a course has no featured image. Image is set on the element (the
 * template's Cover block / featured image); this styles the frame.
 * ------------------------------------------------------------------- */
.simple-ld-hero {
	position: relative;
	/* Full-bleed: cancel the main gutter on top + both sides so the hero
	 * runs edge-to-edge and sits flush under the site header. */
	margin-top: calc(-1 * var(--sl-gutter-y));
	margin-inline: calc(-1 * var(--sl-gutter-x));
	margin-bottom: clamp(32px, 4vw, 56px);
	/* Ink fallback shows when a course has no featured image. */
	background-color: var(--wp--custom--simple-chrome--heading, #1A1A1A);
	overflow: hidden;
}

/* Background layer = the course featured image (core/post-featured-image
 * block), so the block template needs no PHP. Absent image → ink shows. */
.simple-ld-hero__bg {
	position: absolute;
	inset: 0;
	margin: 0;
	z-index: 0;
}
.simple-ld-hero__bg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Accent hairline top edge — a small piece of brand importance */
.simple-ld-hero::after {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: var(--wp--custom--simple-chrome--accent, #235af3);
	z-index: 2;
}

.simple-ld-hero__scrim {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: clamp(360px, 42vw, 560px);
	padding: clamp(32px, 5vw, 64px);
	background: linear-gradient(180deg,
		rgba(10, 15, 26, 0.20) 0%,
		rgba(10, 15, 26, 0.55) 52%,
		rgba(8, 12, 22, 0.88) 100%);
}

.simple-ld-hero__inner {
	width: 100%;
	max-width: 1100px;
	margin-inline: auto;
	color: #fff;
}

.simple-ld-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	margin: 0 0 14px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--custom--simple-chrome--accent, #235af3);
}

.simple-ld-hero__eyebrow svg {
	width: 13px;
	height: 13px;
	flex: 0 0 auto;
}

.simple-ld-hero__title {
	margin: 0;
	color: #fff;
	font-size: clamp(1.9rem, 4vw, 3.1rem);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.simple-ld-hero__sub {
	margin: 14px 0 0;
	max-width: 60ch;
	color: rgba(255, 255, 255, 0.86);
	font-size: clamp(1rem, 0.4vw + 0.95rem, 1.15rem);
	line-height: 1.55;
}

.simple-ld-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: clamp(20px, 3vw, 28px);
}

.simple-ld-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border: 1px solid rgba(255, 255, 255, 0.28);
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	font-size: 0.85rem;
	font-weight: 600;
	line-height: 1;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.simple-ld-chip svg {
	width: 17px;
	height: 17px;
	flex: 0 0 auto;
	color: var(--wp--custom--simple-chrome--accent, #235af3);
}

/* ---------------------------------------------------------------------
 * 1. Rebind modern LearnDash's brand accent to the site accent.
 * Modern LD cascades every accent (links, focus rings, active borders,
 * primary buttons) off --ld-color-brand-primary → blue #235af3. One
 * rebind turns all of it on-brand — no per-selector chase.
 * ------------------------------------------------------------------- */
.simple-main-learndash .learndash-wrapper,
.simple-main-learndash .learndash-wrapper--modern {
	--ld-color-primitives-blue-500: var(--sl-accent);
	--ld-color-brand-primary: var(--sl-accent);
	--ld-color-brand-tertiary: var(--sl-accent);
	--ld-radius: 0;
	--ld-border-radius: 0;
	--ld-border-radius-small: 0;
}

/* ---------------------------------------------------------------------
 * 2. Two-column layout. Modern .ld-layout only becomes multi-column when
 * LearnDash's JS stamps ld-breakpoint--large on the container; we make it
 * deterministic instead — single column (enrol card first) on mobile,
 * content-left / sticky-sidebar-right from 901px up. No JS dependency.
 * ------------------------------------------------------------------- */
.simple-main-learndash .ld-layout {
	align-items: start;
	grid-gap: clamp(28px, 4vw, 56px);
}

@media (min-width: 901px) {
	/* Two columns ONLY when a sidebar exists (the not-enrolled / enrollment
	 * view). The has-access view is .ld-layout--no-sidebar with a
	 * .ld-layout__header (progress) instead — it must stay single-column, or
	 * the header and content collide in one grid cell. */
	.simple-main-learndash .ld-layout:not(.ld-layout--no-sidebar) {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 340px;
		column-gap: clamp(32px, 4vw, 56px);
	}
	.simple-main-learndash .ld-layout:not(.ld-layout--no-sidebar) .ld-layout__content { grid-column: 1; grid-row: 1; }
	.simple-main-learndash .ld-layout:not(.ld-layout--no-sidebar) .ld-layout__sidebar {
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		top: 24px;
	}
}

/* Course progress header (has-access view) — a full-width block above the
 * content, not overlapping it. */
.simple-main-learndash .ld-layout__header {
	margin-bottom: clamp(20px, 3vw, 28px);
}

/* ---------------------------------------------------------------------
 * 3. Course intro (the tab panel above the curriculum) reads as a lead.
 * ------------------------------------------------------------------- */
.simple-main-learndash .ld-tab-bar {
	border: 0;
	margin-bottom: clamp(28px, 4vw, 44px);
}

.simple-main-learndash .ld-tab-bar__panel {
	color: var(--sl-body);
	font-size: clamp(1.0625rem, 0.4vw + 1rem, 1.1875rem);
	line-height: 1.65;
}

.simple-main-learndash .ld-tab-bar__panel > *:first-child { margin-top: 0; }
.simple-main-learndash .ld-tab-bar__panel > *:last-child  { margin-bottom: 0; }

/* ---------------------------------------------------------------------
 * 4. "Module Content" section heading.
 * text-transform:capitalize fixes the lowercase "module" the LD custom
 * label produces WITHOUT changing the label text itself (vocabulary is
 * preserved; only the rendered casing is normalised).
 * ------------------------------------------------------------------- */
.simple-main-learndash .ld-accordion__header { border: 0; padding: 0; }

.simple-main-learndash .ld-accordion__heading {
	display: flex;
	align-items: center;
	gap: 11px;
	text-transform: capitalize;
	color: var(--sl-ink);
	font-size: clamp(1.375rem, 1vw + 1.1rem, 1.75rem);
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.15;
	margin: 0 0 clamp(16px, 2vw, 22px);
	padding-bottom: 14px;
	border-bottom: 1px solid var(--sl-line);
}

/* Leading list glyph, accent-coloured, injected in CSS so it works on
 * LearnDash's own heading markup without a template change. */
.simple-main-learndash .ld-accordion__heading::before {
	content: "";
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	background-color: var(--sl-accent);
	-webkit-mask: var(--sl-icon-list) center / contain no-repeat;
	mask: var(--sl-icon-list) center / contain no-repeat;
}

.simple-main-learndash {
	--sl-icon-list: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h4v4H4zM10 5.75h10v2.5H10zM4 14h4v4H4zM10 14.75h10v2.5H10z'/%3E%3C/svg%3E");
}

/* ---------------------------------------------------------------------
 * 5. Curriculum — each session / quiz becomes a squared card with a
 * leading index chip, a clear title, and a chevron affordance. Hover
 * lifts the border to the accent and tints the ground.
 * ------------------------------------------------------------------- */
.simple-main-learndash .ld-accordion__section + .ld-accordion__section {
	margin-top: clamp(22px, 3vw, 30px);
}

.simple-main-learndash .ld-accordion__items--lessons { counter-reset: sl-lesson; }

.simple-main-learndash .ld-accordion__items--lessons,
.simple-main-learndash .ld-accordion__items--quizzes {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.simple-main-learndash .ld-accordion__item--lesson,
.simple-main-learndash .ld-accordion__item--quiz {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 15px 18px;
	border: 1px solid var(--sl-line);
	border-radius: 0;
	background: var(--sl-surface);
	transition: border-color .15s ease, background-color .15s ease;
}

.simple-main-learndash .ld-accordion__item--lesson:hover,
.simple-main-learndash .ld-accordion__item--quiz:hover,
.simple-main-learndash .ld-accordion__item--lesson:focus-within,
.simple-main-learndash .ld-accordion__item--quiz:focus-within {
	border-color: var(--sl-accent);
	background: var(--sl-accent-soft);
}

/* Leading index chip (course curriculum sessions only — NOT the lesson
 * sidebar nav, which reuses these card classes with its own lead glyph) */
.simple-main-learndash .ld-accordion__items--lessons > .ld-accordion__item--lesson { counter-increment: sl-lesson; }

.simple-main-learndash .ld-accordion__items--lessons > .ld-accordion__item--lesson::before {
	content: counter(sl-lesson, decimal-leading-zero);
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.35em;
	height: 2.35em;
	background: var(--sl-accent-soft);
	color: var(--sl-ink);
	font-weight: 700;
	font-size: 0.82rem;
	font-variant-numeric: tabular-nums;
}

/* Quiz glyph (LD's own inline svg) takes the chip's slot */
.simple-main-learndash .ld-accordion__item-icon {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	color: var(--sl-accent);
	margin: 0;
}

/* Title fills the row; drop the theme's content-link underline */
.simple-main-learndash .ld-accordion__item-header {
	flex: 1 1 auto;
	display: block;
	min-width: 0;
	padding: 0;
	border: 0;
	background: none;
}

.simple-main-learndash .ld-accordion__item-title-wrapper { margin: 0; }

.simple-main-learndash .ld-accordion__item-title {
	color: var(--sl-ink);
	text-decoration: none;
	font-weight: 600;
	line-height: 1.35;
}

.simple-main-learndash .ld-accordion__item-title:hover,
.simple-main-learndash .ld-accordion__item-title:focus {
	color: var(--sl-ink);
	text-decoration: none;
}

/* Chevron affordance (course curriculum only) */
.simple-main-learndash .ld-accordion__items--lessons > .ld-accordion__item--lesson::after,
.simple-main-learndash .ld-accordion__items--quizzes > .ld-accordion__item--quiz::after {
	content: "";
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	margin-left: auto;
	border-right: 2px solid var(--sl-muted);
	border-top: 2px solid var(--sl-muted);
	transform: rotate(45deg);
	transition: border-color .15s ease;
}

.simple-main-learndash .ld-accordion__items--lessons > .ld-accordion__item--lesson:hover::after,
.simple-main-learndash .ld-accordion__items--quizzes > .ld-accordion__item--quiz:hover::after {
	border-color: var(--sl-accent);
}

/* Lesson sidebar course-nav container */
.simple-main-learndash-lesson .simple-ld-coursenav {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.simple-main-learndash-lesson .simple-ld-coursenav__heading {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0 0 12px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sl-muted);
}

/* Quiz subsection label ("Final Quiz") as a quiet eyebrow */
.simple-main-learndash .ld-accordion__subheading {
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--sl-muted);
	margin: 0 0 12px;
}

/* ---------------------------------------------------------------------
 * 6. Sidebar — enrollment + details as squared cards.
 * ------------------------------------------------------------------- */
.simple-main-learndash .ld-enrollment,
.simple-main-learndash .ld-details {
	border: 1px solid var(--sl-line);
	border-radius: 0;
	background: var(--sl-surface);
	padding: clamp(20px, 2.4vw, 28px);
}

.simple-main-learndash .ld-details { margin-top: 16px; }

.simple-main-learndash .ld-enrollment__pricing { padding: 0; margin: 0 0 18px; border: 0; }

.simple-main-learndash .ld-enrollment__pricing-label,
.simple-main-learndash .ld-details__heading {
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--sl-muted);
	margin: 0 0 6px;
}

.simple-main-learndash .ld-enrollment__pricing-price {
	display: block;
	color: var(--sl-ink);
	font-weight: 700;
	font-size: clamp(1.5rem, 2vw + 1rem, 2rem);
	line-height: 1;
}

/* Primary CTA — accent fill, ink text (accessible on a light accent),
 * inverts to an ink fill on hover. Squared. */
.simple-main-learndash .ld-enrollment__join-button,
.simple-main-learndash .ld-button.learndash_mark_complete_button,
.simple-main-learndash #learndash_mark_complete_button,
.simple-main-learndash .ld-navigation__progress-mark-complete-button {
	display: inline-flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	padding: 14px 20px;
	background: var(--sl-accent);
	color: var(--sl-ink);
	border: 1px solid var(--sl-accent);
	border-radius: 0;
	font-weight: 700;
	line-height: 1.1;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

.simple-main-learndash .ld-enrollment__join-button:hover,
.simple-main-learndash .ld-enrollment__join-button:focus,
.simple-main-learndash .ld-button.learndash_mark_complete_button:hover,
.simple-main-learndash #learndash_mark_complete_button:hover,
.simple-main-learndash .ld-navigation__progress-mark-complete-button:hover {
	background: var(--sl-ink);
	color: var(--sl-surface);
	border-color: var(--sl-ink);
}

.simple-main-learndash .ld-enrollment__login {
	margin-top: 12px;
	text-align: center;
	color: var(--sl-muted);
	font-size: 0.9rem;
}

.simple-main-learndash .ld-enrollment__login-link {
	color: var(--sl-ink);
	text-underline-offset: 2px;
}

.simple-main-learndash .ld-details__item {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 9px 0;
	color: var(--sl-body);
}

.simple-main-learndash .ld-details__item + .ld-details__item {
	border-top: 1px solid var(--sl-line);
}

.simple-main-learndash .ld-details__icon-wrapper { margin: 0; }

.simple-main-learndash .ld-details__icon {
	width: 22px;
	height: 22px;
	color: var(--sl-accent);
}

.simple-main-learndash .ld-details__label {
	font-weight: 600;
	color: var(--sl-ink);
}

/* =====================================================================
 * LESSON PAGE — modern template (.ld-breadcrumbs--modern, .ld-progress-bar__*,
 * .ld-navigation__*). Built against the class vocabulary in modern.css;
 * verify once on a real enrolled lesson before deploy.
 * ===================================================================== */

/* 7·layout. On mobile, LearnDash stacks the sidebar first; for a lesson
 * the video + content should lead, with progress + nav below. */
@media (max-width: 900px) {
	.simple-main-learndash-lesson .ld-layout {
		display: flex;
		flex-direction: column;
	}
	.simple-main-learndash-lesson .ld-layout__content { order: 1; }
	.simple-main-learndash-lesson .ld-layout__sidebar { order: 2; margin-top: clamp(28px, 5vw, 40px); }
}

/* 7a. Breadcrumbs */
.simple-main-learndash .ld-breadcrumbs--modern {
	margin: 0 0 clamp(14px, 2vw, 20px);
	font-size: 0.8rem;
	color: var(--sl-muted);
}
.simple-main-learndash .ld-breadcrumbs__items {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.simple-main-learndash .ld-breadcrumbs__link {
	color: var(--sl-muted);
	text-decoration: none;
}
.simple-main-learndash .ld-breadcrumbs__link:hover { color: var(--sl-accent); }
.simple-main-learndash .ld-breadcrumbs__delimiter { color: var(--sl-line); }
.simple-main-learndash .ld-breadcrumbs__item[aria-current],
.simple-main-learndash .ld-breadcrumbs__item:last-child { color: var(--sl-ink); font-weight: 600; }

/* 7b. Lesson header (slim — no image hero; video leads instead) */
.simple-main-learndash-lesson .simple-ld-lesson-head {
	padding-bottom: clamp(16px, 2vw, 22px);
	margin-bottom: clamp(22px, 3vw, 30px);
	border-bottom: 1px solid var(--sl-line);
}
.simple-main-learndash-lesson .simple-ld-lesson-head__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--sl-accent);
}
.simple-main-learndash-lesson .simple-ld-lesson-head__title {
	margin: 0;
	color: var(--sl-ink);
	font-size: clamp(1.6rem, 3vw, 2.4rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.02em;
}

/* 7c. Video frame — squared, prominent, 16:9 */
.simple-main-learndash-lesson .simple-ld-video,
.simple-main-learndash-lesson .wp-video,
.simple-main-learndash-lesson video,
.simple-main-learndash-lesson .wp-block-embed__wrapper > iframe {
	display: block;
	width: 100%;
	max-width: 100%;
	border-radius: 0;
	margin: 0 0 clamp(22px, 3vw, 30px);
}
.simple-main-learndash-lesson .simple-ld-video {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--sl-ink);
	overflow: hidden;
}
.simple-main-learndash-lesson .simple-ld-video img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.55;
}
.simple-main-learndash-lesson .simple-ld-video__play {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 74px;
	height: 74px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--sl-accent);
	color: var(--sl-ink);
}
.simple-main-learndash-lesson .simple-ld-video__play svg { width: 30px; height: 30px; }

/* 7d. Lesson body measure */
.simple-main-learndash-lesson .simple-ld-lesson-body {
	color: var(--sl-body);
	font-size: 1.0625rem;
	line-height: 1.7;
}
.simple-main-learndash-lesson .simple-ld-lesson-body > *:first-child { margin-top: 0; }

/* 7e. Progress bar (modern .ld-progress-bar__*) */
.simple-main-learndash .ld-progress-bar {
	border: 1px solid var(--sl-line);
	border-radius: 0;
	background: var(--sl-surface);
	padding: clamp(16px, 2vw, 20px);
	margin-bottom: 16px;
}
.simple-main-learndash .ld-progress-bar__label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--sl-muted);
}
/* .ld-progress-bar__meter is a flex ROW: [percentage] [track] [steps label].
 * The track is __meter-background (NOT the meter itself). */
.simple-main-learndash .ld-progress-bar__meter {
	display: flex;
	align-items: center;
	gap: 12px;
}
.simple-main-learndash .ld-progress-bar__meter-background {
	flex: 1 1 auto;
	background: var(--sl-line);
	border-radius: 0;
	height: 8px;
	overflow: hidden;
}
.simple-main-learndash .ld-progress-bar__meter-foreground {
	background: var(--sl-accent);
	border-radius: 0;
	height: 100%;
}
.simple-main-learndash .ld-progress-bar__meter-label,
.simple-main-learndash .ld-progress-bar__meter-percentage {
	flex: 0 0 auto;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--sl-ink);
}

/* 7f. Sidebar course-nav accordion — current + completed states.
 * (Card base is shared with the course page rules above.) */
.simple-main-learndash-lesson .ld-accordion__item--lesson.is-current {
	border-color: var(--sl-accent);
	background: var(--sl-accent-soft);
	box-shadow: inset 3px 0 0 var(--sl-accent);
}
.simple-main-learndash-lesson .ld-accordion__item-status {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	margin-left: auto;
	color: var(--sl-accent);
}
.simple-main-learndash-lesson .ld-accordion__item--complete::after { display: none; }

/* 7g. Lesson navigation bar (modern .ld-navigation__*) */
.simple-main-learndash .ld-navigation {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-top: clamp(26px, 4vw, 40px);
	padding-top: clamp(20px, 3vw, 26px);
	border-top: 1px solid var(--sl-line);
}
.simple-main-learndash .ld-navigation__previous,
.simple-main-learndash .ld-navigation__next { flex: 0 0 auto; }
.simple-main-learndash .ld-navigation__next { margin-left: auto; }

.simple-main-learndash .ld-navigation__previous-link,
.simple-main-learndash .ld-navigation__next-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px;
	border: 1px solid var(--sl-line);
	border-radius: 0;
	color: var(--sl-ink);
	font-weight: 600;
	text-decoration: none;
	transition: border-color .15s ease, color .15s ease;
}
.simple-main-learndash .ld-navigation__previous-link:hover,
.simple-main-learndash .ld-navigation__next-link:hover {
	border-color: var(--sl-accent);
	color: var(--sl-accent);
}
.simple-main-learndash .ld-navigation__progress { order: 3; flex: 1 1 100%; }
.simple-main-learndash .ld-navigation__back-to-course-link {
	color: var(--sl-muted);
	text-decoration: none;
	font-size: 0.85rem;
}
.simple-main-learndash .ld-navigation__back-to-course-link:hover { color: var(--sl-accent); }

/* 7h. Inline icon sizing (these SVGs ship without width/height attrs). */
.simple-main-learndash-lesson .simple-ld-lesson-head__eyebrow svg { width: 14px; height: 14px; flex: 0 0 auto; }
.simple-main-learndash-lesson .simple-ld-coursenav__heading svg { width: 16px; height: 16px; flex: 0 0 auto; }
.simple-main-learndash-lesson .simple-ld-coursenav__heading { white-space: nowrap; }
.simple-main-learndash .ld-progress-bar__label svg { width: 15px; height: 15px; flex: 0 0 auto; }
.simple-main-learndash .ld-navigation__previous-link svg,
.simple-main-learndash .ld-navigation__next-link svg { width: 16px; height: 16px; flex: 0 0 auto; }
.simple-main-learndash .ld-navigation__back-to-course-link svg { width: 13px; height: 13px; flex: 0 0 auto; }
.simple-main-learndash-lesson .ld-accordion__item-status svg { width: 22px; height: 22px; }

/* =====================================================================
 * TITLE BASE — lesson / topic / quiz templates render a post-title (the
 * course uses the image hero instead). No font-family (Glenn 2026-08-12).
 * ===================================================================== */
.simple-main-learndash .simple-ld-title {
	color: var(--wp--custom--simple-chrome--heading, #1A1A1A);
	font-size: clamp(1.75rem, 3.5vw, 2.75rem);
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 0 0 clamp(20px, 3vw, 32px);
}

/* =====================================================================
 * LEGACY LD30 FALLBACK — squared corners for fleet sites still on the
 * pre-5.x LearnDash template. Inert on the modern template (those
 * selectors don't render there). Kept compact; the modern rules above
 * carry the real design.
 * ===================================================================== */
.simple-main-learndash .learndash-wrapper {
	--ld-radius: 0;
	--ld-border-radius: 0;
	--ld-border-radius-small: 0;
}
.simple-main-learndash .learndash-wrapper .ld-course-status,
.simple-main-learndash .learndash-wrapper .ld-status,
.simple-main-learndash .learndash-wrapper .ld-item-list .ld-item-list-item,
.simple-main-learndash .learndash-wrapper .ld-table-list,
.simple-main-learndash .learndash-wrapper .ld-progress .ld-progress-bar,
.simple-main-learndash .learndash-wrapper .ld-alert,
.simple-main-learndash .learndash-wrapper .ld-expand-button {
	border-radius: 0;
}