/* ==========================================================================
   SepehrDev — student experience
   Restyles Tutor LMS's own templates. No Tutor markup is replaced; these are
   overrides on the classes the plugin already outputs.
   ========================================================================== */

.sd-lms {
	background: var(--sd-bg-2);
}

/* --- Lesson view --------------------------------------------------------- */

/*
 * Tutor's "spotlight" lesson view is already distraction-free: full width,
 * curriculum sidebar, previous/next. The work here is typographic — making
 * it read as Persian and match the rest of the site.
 */
.tutor-course-topic-single-body,
.tutor-course-single-content-wrapper,
.tutor-lesson-content {
	font-family: var(--sd-font);
	line-height: 1.9;
}

.tutor-course-spotlight-wrapper,
.tutor-course-topic-single-header {
	font-family: var(--sd-font);
}

/* The lesson video should own the space above the fold. */
.tutor-video-player,
.tutor-lesson-video {
	border-radius: var(--sd-radius);
	overflow: hidden;
	background: var(--sd-dark-2);
}

.tutor-video-player iframe,
.tutor-lesson-video iframe {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
}

/* Our Cloudflare Stream wrapper inside a Tutor lesson. */
.tutor-course-topic-single-body .sd-video {
	margin-block-end: 1.75rem;
	border-radius: var(--sd-radius);
}

/* --- Curriculum sidebar -------------------------------------------------- */

.tutor-course-single-sidebar-wrapper,
.tutor-course-topics-sidebar {
	background: var(--sd-bg);
	border-inline-end: 1px solid var(--sd-line);
}

.tutor-course-topic-item,
.tutor-course-topic-item a {
	font-family: var(--sd-font);
	font-size: 0.95rem;
	line-height: 1.75;
}

/* The lesson currently playing needs to be obvious at a glance in a list of
   eighteen. */
.tutor-course-topic-item.is-active,
.tutor-course-topic-item.active,
.tutor-course-topic-item-active {
	background: var(--sd-accent-soft);
	border-inline-start: 3px solid var(--sd-accent);
	font-weight: 700;
}

/* --- Progress ------------------------------------------------------------ */

.tutor-progress-bar,
.tutor-progress-bar-wrap {
	border-radius: 999px;
	overflow: hidden;
	background: var(--sd-line-2);
}

.tutor-progress-value,
.tutor-progress-filled {
	background: var(--sd-accent);
}

.tutor-course-progress-wrapper {
	font-family: var(--sd-font);
}

/* --- Previous / next ----------------------------------------------------- */

/*
 * Tutor renders these as a left/right pair. In an RTL layout the browser
 * already mirrors the flex row, so the only thing to fix is the chevron
 * glyphs, which are directional characters rather than CSS.
 */
.tutor-lesson-sidebar-pagination,
.tutor-course-topic-single-footer {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: space-between;
	align-items: center;
	padding-block: 1.5rem;
	border-block-start: 1px solid var(--sd-line);
	margin-block-start: 2rem;
}

.tutor-lesson-sidebar-pagination a,
.tutor-course-topic-single-footer a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.7rem 1.25rem;
	border: 1px solid var(--sd-line);
	border-radius: var(--sd-radius-sm);
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	color: var(--sd-ink);
	background: var(--sd-bg);
	transition: border-color .15s ease, color .15s ease;
}

.tutor-lesson-sidebar-pagination a:hover,
.tutor-course-topic-single-footer a:hover {
	border-color: var(--sd-accent);
	color: var(--sd-accent);
}

/* --- Student dashboard --------------------------------------------------- */

.tutor-dashboard,
.tutor-dashboard-content {
	font-family: var(--sd-font);
}

.tutor-dashboard-content-inner {
	background: var(--sd-bg);
	border: 1px solid var(--sd-line);
	border-radius: var(--sd-radius);
	padding: clamp(1.25rem, 3vw, 2rem);
}

.tutor-dashboard-menu-item a {
	font-size: 0.97rem;
	border-radius: var(--sd-radius-sm);
}

.tutor-dashboard-menu-item.active a,
.tutor-dashboard-menu-item-active a {
	background: var(--sd-accent-soft);
	color: var(--sd-accent-ink);
	font-weight: 700;
}

/* Course cards in "دوره‌های من". */
.tutor-course-card,
.tutor-card {
	border: 1px solid var(--sd-line);
	border-radius: var(--sd-radius);
	overflow: hidden;
	background: var(--sd-bg);
	box-shadow: none;
	transition: border-color .15s ease, transform .15s ease;
}

.tutor-course-card:hover,
.tutor-card:hover {
	border-color: var(--sd-accent);
	transform: translateY(-2px);
}

.tutor-course-name,
.tutor-course-card__title {
	font-weight: 700;
	line-height: 1.6;
}

/* The primary action a returning student wants. */
.tutor-dashboard .tutor-btn-primary,
.tutor-course-card .tutor-btn-primary {
	background: var(--sd-accent);
	border-color: var(--sd-accent);
	color: #fff;
	font-family: var(--sd-font);
	font-weight: 700;
	border-radius: var(--sd-radius-sm);
}

.tutor-dashboard .tutor-btn-primary:hover {
	background: var(--sd-accent-ink);
	border-color: var(--sd-accent-ink);
}

/* --- Empty state --------------------------------------------------------- */

.sd-dashboard-empty {
	text-align: center;
	padding: clamp(2rem, 6vw, 3.5rem) 1.25rem;
	border: 1px dashed var(--sd-line);
	border-radius: var(--sd-radius);
	background: var(--sd-bg);
}

.sd-dashboard-empty h3 {
	font-size: 1.2rem;
	font-weight: 700;
	margin-block: 0 0.6rem;
}

.sd-dashboard-empty p {
	color: var(--sd-muted);
	margin-block-end: 1.5rem;
}

/* --- Access wall --------------------------------------------------------- */

/*
 * What a logged-out visitor sees if they land on a paid lesson URL. Tutor
 * decides that they cannot see it; this only makes the message look
 * deliberate rather than like an error.
 */
.tutor-course-content-list-item-lock,
.tutor-lesson-locked,
.tutor-alert-warning {
	border-radius: var(--sd-radius-sm);
	font-family: var(--sd-font);
}

/* --- Mobile -------------------------------------------------------------- */

@media (max-width: 767px) {
	/* Video and lesson navigation first; the curriculum collapses above. */
	.tutor-course-single-sidebar-wrapper,
	.tutor-course-topics-sidebar {
		border-inline-end: 0;
		border-block-end: 1px solid var(--sd-line);
	}

	.tutor-lesson-sidebar-pagination a,
	.tutor-course-topic-single-footer a {
		flex: 1 1 auto;
		justify-content: center;
	}

	.tutor-dashboard-content-inner {
		padding: 1rem;
	}
}