/**
 * LearnDash Lessons List Widget — Base Layout Styles
 *
 * Only structural/layout rules are defined here — no colours, no typography.
 * All visual styling is handled through the Elementor editor controls.
 *
 */

/* ── List reset ─────────────────────────────────────────────────────────── */
.guw-lessons-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

/* ── Row ────────────────────────────────────────────────────────────────── */
.guw-lesson-row {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;           /* allow wrapping on smaller screens */
	align-items: center;
	gap: 12px;                 /* overridable via Elementor row-gap controls */
	text-decoration: none;
	width: 100%;
	box-sizing: border-box;
}

/* ── Lesson Overview Container ────────────────────────────────────────────────────────────────── */
.lesson-overview-container {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 12px;                 /* overridable via Elementor row-gap controls */
	text-decoration: none;
	width: 100%;
	box-sizing: border-box;
}

/* ── Lesson number ──────────────────────────────────────────────────────── */
.guw-lesson-number {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 17px;
}

/* ── Lesson Completion icon wrapper ────────────────────────────────────────────── */
.guw-completion-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* Size, background, border and border-radius set via Elementor controls */
}

.guw-completion-icon svg,
.guw-completion-icon i {
	display: block;
}

.guw-completion-icon svg[data-status="complete"],
.guw-completion-icon i[data-status="complete"] {
	scale: 0.5;
}

.guw-completion-icon svg[data-status="incomplete"],
.guw-completion-icon i[data-status="incomplete"] {
	scale: 1.25;
}

/* ── Body (title + meta) — grows to fill available space ───────────────── */
.guw-lesson-body {
	flex: 1 1 0;
	min-width: 0;              /* allow text to truncate inside flex */
	display: flex;
	flex-direction: column;
	gap: 4px;
}

/* ── Title ──────────────────────────────────────────────────────────────── */
.guw-lesson-title {
	display: block;
	text-decoration: none;
}

/* ── Meta row (topics / quizzes / inline duration) ───────────────────────────────── */
.guw-lesson-meta {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.guw-lesson-meta .guw-meta-topics,
.guw-lesson-meta .guw-meta-quizzes,
.guw-lesson-meta .guw-meta-duration {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	white-space: nowrap;
}

/* Separator dot between meta items */
.guw-lesson-meta > * + *::before {
	content: "·";
	margin-right: 6px;
	opacity: 0.5;
}

/* ── Right-side duration column ─────────────────────────────────────────── */
.guw-lesson-duration {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	white-space: nowrap;
}

.guw-lesson-duration svg,
.guw-lesson-duration i {
	flex-shrink: 0;
}

/* ── Chevron ────────────────────────────────────────────────────────────── */
.guw-lesson-chevron {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.guw-lesson-chevron svg,
.guw-lesson-chevron i {
	display: block;
	transform: rotate(90deg);
}

.expanded .guw-lesson-chevron svg,
.expanded .guw-lesson-chevron i {
	transform: rotate(270deg);
}

/* ── Clickable row cursor ───────────────────────────────────────────────── */
.guw-lesson-row.is-clickable {
	cursor: pointer;
}

/* ── Topics/Quizzes Container ───────────────────────────────────────────────── */
.topics-quizzes-container {
	display: grid;
	grid-template-rows: 0fr; /* start with rows collapsed */
	overflow: hidden;
	transition: all 0.2s ease-in-out;
	width: 100%;
}

.topics-quizzes-container.expanded {
	grid-template-rows: 1fr; /* expand to full height when expanded */
}

.topics-quizzes-container .topic-quizzes-wrapper {
	min-height: 0; /* ensure children can shrink properly when container is collapsed */
}

/* ── Topic/Quiz Individual Containers ─────────────────────────────────────────────────── */
.topic-item,
.quiz-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	padding: 4px 0;
}

.guw-topic-quiz-completion-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* Size, background, border and border-radius set via Elementor controls */
}

.guw-topic-quiz-completion-icon svg,
.guw-topic-quiz-completion-icon i {
	display: block;
}

.guw-topic-quiz-completion-icon svg[data-status="complete"],
.guw-topic-quiz-completion-icon i[data-status="complete"] {
	scale: 0.5;
}

.guw-topic-quiz-completion-icon svg[data-status="incomplete"],
.guw-topic-quiz-completion-icon i[data-status="incomplete"] {
	scale: 1.5;
}

/* ── No-lessons message ─────────────────────────────────────────────────── */
.guw-no-lessons {
	margin: 0;
}