/**
 * Curriculum-specific layout: header stats, Module accordion, Phase
 * headings, Lesson rows. Shared tokens/nav/card base styles live in
 * tri-sp-student-shell.css (loaded first as a dependency).
 */

.tri-sp-curriculum__stats {
	color: var(--tri-sp-gold-strong);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin: 0 0 32px;
}

.tri-sp-curriculum__unassigned {
	margin-bottom: 24px;
}

.tri-sp-curriculum__unassigned-title {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--tri-sp-text-muted);
	margin: 0 0 12px;
}

.tri-sp-modules {
	display: flex;
	flex-direction: column;
}

.tri-sp-module {
	border-bottom: 1px solid var(--tri-sp-border);
}

.tri-sp-module:first-child {
	border-top: 1px solid var(--tri-sp-border);
}

.tri-sp-module__heading {
	margin: 0;
}

.tri-sp-module__toggle {
	display: flex;
	align-items: center;
	gap: 28px;
	width: 100%;
	background: #0E1416;
	border: 1px solid #CA964F33;
	color: inherit;
	font: inherit;
	text-align: left;
	padding: 18px 8px;
	cursor: pointer;
}

/*
 * Chunk 6.6 — Elementor's Global Kit `button` rule (`.elementor-kit-47604
 * button`, specificity (0,1,1)) beat the plain rule above (0,1,0) once the
 * theme's normal template started rendering these pages (Chunk 6.5),
 * filling every Module row with Elementor's global accent-color background
 * and white text instead of the intended card-bg row with subtle gold border
 * — confirmed live via `getMatchedStylesForNode` (computed background-color
 * was Elementor's `--e-global-color-accent`, not the card background).
 * Re-declared here at (0,2,0), which already beats (0,1,1) on the B (class)
 * column alone — no !important needed.
 */
.tri-sp-curriculum .tri-sp-module__toggle {
	background: #0E1416;
	border: 1px solid #CA964F33;
	color: inherit;
}

.tri-sp-module__toggle:hover {
	background: rgba(255, 255, 255, 0.03);
}

.tri-sp-module__number {
	flex: 0 0 auto;
	font-family: var(--tri-sp-font-heading);
	font-size: 26px;
	color: var(--tri-sp-gold-strong);
	width: 48px;
}

.tri-sp-module__titles {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.tri-sp-module__title {
	font-weight: 600;
	font-size: 15px;
	overflow-wrap: break-word;
}

.tri-sp-module__subtitle {
	font-style: italic;
	color: var(--tri-sp-text-muted);
	font-size: 13px;
}

.tri-sp-module__meta {
	flex: 0 0 auto;
	display: flex;
	gap: 16px;
	font-size: 12px;
	color: var(--tri-sp-text-muted);
	white-space: nowrap;
}

.tri-sp-module__status {
	flex: 0 0 auto;
	text-align: right;
	min-width: 96px;
}

.tri-sp-module__percentage {
	display: block;
	font-weight: 700;
	color: var(--tri-sp-gold-strong);
}

.tri-sp-module__status-label {
	display: block;
	font-size: 10px;
	letter-spacing: 0.05em;
	color: var(--tri-sp-text-muted);
}

.tri-sp-module__chevron {
	flex: 0 0 auto;
	width: 10px;
	height: 10px;
	border-right: 2px solid var(--tri-sp-text-muted);
	border-bottom: 2px solid var(--tri-sp-text-muted);
	transform: rotate(45deg);
	transition: transform 0.15s ease;
}

.tri-sp-module.is-open .tri-sp-module__chevron {
	transform: rotate(-135deg);
}

.tri-sp-module__panel {
	padding: 4px 8px 24px 68px;
}

.tri-sp-phase {
	margin-top: 16px;
}

.tri-sp-phase__title {
	font-size: 13px;
	font-weight: 700;
	color: var(--tri-sp-gold-strong);
	letter-spacing: 0.03em;
	margin: 0 0 8px;
}

.tri-sp-phase__count {
	color: var(--tri-sp-text-muted);
	font-weight: 400;
}

/* .tri-sp-lesson-list / .tri-sp-lesson-row* / .tri-sp-save-toggle* moved to
   tri-sp-student-shell.css (Chunk 5) — shared with Saved Lessons. */

@media (max-width: 768px) {
	.tri-sp-module__toggle {
		flex-wrap: wrap;
		gap: 8px 16px;
	}

	.tri-sp-module__meta {
		order: 3;
		flex-basis: 100%;
	}

	.tri-sp-module__panel {
		padding-left: 16px;
	}
}