:root {
	--kklidi-lms-font-family: inherit;
	--kklidi-lms-content-width: 980px;
	--kklidi-lms-color-bg: var(--kklidi-lms-color-surface-page, #f3f6f9);
	--kklidi-lms-color-text: #172b4d;
	--kklidi-lms-color-text-soft: #334155;
	--kklidi-lms-color-content: #24364b;
	--kklidi-lms-color-card-copy: #506070;
	--kklidi-lms-color-muted: #64748b;
	--kklidi-lms-color-subtle: #6a7788;
	--kklidi-lms-color-primary: #1f76d2;
	--kklidi-lms-color-primary-hover: #155da8;
	--kklidi-lms-color-success: #16803c;
	--kklidi-lms-color-success-hover: #0f6b30;
	--kklidi-lms-color-danger: #b42318;
	--kklidi-lms-color-danger-bg: #fff1f0;
	--kklidi-lms-color-danger-border: #f4b8b2;
	--kklidi-lms-color-status-completed: var(--kklidi-lms-color-success);
	--kklidi-lms-color-status-completed-bg: #eaf7ef;
	--kklidi-lms-color-status-completed-border: #b9e5c8;
	--kklidi-lms-color-status-progress: #475569;
	--kklidi-lms-color-status-progress-bg: #f1f5f9;
	--kklidi-lms-color-status-progress-border: #cbd5e1;
	--kklidi-lms-color-border: #dbe3ec;
	--kklidi-lms-color-border-strong: #cbd5e1;
	--kklidi-lms-color-border-soft: #e5ebf1;
	--kklidi-lms-color-border-line: #edf1f5;
	--kklidi-lms-color-border-card: #e2e7ed;
	--kklidi-lms-color-border-hover: #c8d3df;
	--kklidi-lms-color-surface: #ffffff;
	--kklidi-lms-color-surface-muted: #eef2f6;
	--kklidi-lms-color-surface-soft: #f8fafc;
	--kklidi-lms-color-surface-page: #f3f6f9;
	--kklidi-lms-color-surface-hover: #eef5fc;
	--kklidi-lms-color-surface-secondary: #f4f7fa;
	--kklidi-lms-color-surface-section: #fbfcfe;
	--kklidi-lms-color-surface-control: #fbfcfd;
	--kklidi-lms-color-surface-primary-soft: #eaf3ff;
	--kklidi-lms-color-surface-primary-muted: #edf4ff;
	--kklidi-lms-color-surface-success-soft: #eaf7ef;
	--kklidi-lms-color-surface-progress: #e7edf3;
	--kklidi-lms-color-video-bg: #111827;
	--kklidi-lms-shadow-sm: 0 8px 22px rgba(16, 24, 40, 0.06);
	--kklidi-lms-shadow-md: 0 12px 34px rgba(16, 24, 40, 0.08);
	--kklidi-lms-shadow-card: 0 8px 22px rgba(16, 24, 40, 0.06);
	--kklidi-lms-shadow-card-hover: 0 14px 34px rgba(16, 24, 40, 0.1);
	--kklidi-lms-shadow-panel: 0 10px 28px rgba(16, 24, 40, 0.07);
	--kklidi-lms-shadow-player: 0 12px 34px rgba(16, 24, 40, 0.08);
	--kklidi-lms-shadow-soft: 0 10px 28px rgba(16, 24, 40, 0.06);
	--kklidi-lms-shadow-comments: 0 10px 24px rgba(16, 24, 40, 0.05);
	--kklidi-lms-radius: 8px;
	--kklidi-lms-radius-sm: 4px;
	--kklidi-lms-radius-md: 6px;
	--kklidi-lms-radius-lg: 12px;
	--kklidi-lms-radius-xl: 14px;
	--kklidi-lms-radius-pill: 999px;
	--kklidi-lms-font-size-xs: 12px;
	--kklidi-lms-font-size-sm: 13px;
	--kklidi-lms-font-size-md: 15px;
	--kklidi-lms-font-size-lg: 17px;
	--kklidi-lms-font-size-xl: 19px;
	--kklidi-lms-space-xs: 8px;
	--kklidi-lms-space-sm: 12px;
	--kklidi-lms-space-md: 18px;
	--kklidi-lms-space-lg: 24px;
	--kklidi-lms-space-xl: 30px;
	--kklidi-lms-mobile-edge: 16px;
	--kklidi-lms-mobile-control-size: 44px;
	--kklidi-lms-mobile-toc-top: var(--kklidi-lms-space-md);
	--kklidi-lms-mobile-toc-icon-width: 18px;
	--kklidi-lms-mobile-toc-icon-height: 14px;
	--kklidi-lms-mobile-toc-icon-stroke: 2px;
	--kklidi-lms-mobile-nav-offset: calc(var(--kklidi-lms-mobile-control-size) + var(--kklidi-lms-space-md));
	--kklidi-lms-mobile-control-x: 14px;
	--kklidi-lms-mobile-stage-bottom: 28px;
	--kklidi-lms-mobile-title-size-min: 20px;
	--kklidi-lms-mobile-title-size-max: 25px;
	--kklidi-lms-transition-fast: 160ms ease;
	--kklidi-lms-admin-bar-offset: 0px;
}

.kklidi-lms-grid,
.kklidi-lms-overview,
.kklidi-lms-player,
.kklidi-lms-learning-shell,
.kklidi-lms-classroom {
	font-family: var(--kklidi-lms-font-family);
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-classroom {
	max-width: 1180px;
	margin: 28px auto;
	padding: 0 18px 34px;
}

.kklidi-lms-classroom,
.kklidi-lms-classroom * {
	box-sizing: border-box;
}

.kklidi-lms-player,
.kklidi-lms-player *,
.kklidi-lms-player *::before,
.kklidi-lms-player *::after {
	box-sizing: border-box;
}

body.kklidi-lms-sidebar-lock {
	overflow: hidden;
}

.kklidi-lms-player .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.kklidi-lms-classroom-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 24px 26px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-panel);
}

.kklidi-lms-classroom-identity {
	display: flex;
	align-items: center;
	gap: 18px;
	min-width: 0;
}

.kklidi-lms-classroom-avatar,
.kklidi-lms-classroom-avatar-sm {
	flex: 0 0 auto;
	border-radius: 50%;
	background: var(--kklidi-lms-color-surface-muted);
}

.kklidi-lms-classroom-identity span,
.kklidi-lms-classroom-section-head span {
	display: block;
	margin-bottom: 6px;
	color: var(--kklidi-lms-color-primary);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 800;
	letter-spacing: 0;
	text-transform: uppercase;
}

.kklidi-lms-classroom-identity h2 {
	margin: 0;
	font-size: 24px;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-classroom-identity p {
	max-width: 620px;
	margin: 9px 0 0;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-md);
	line-height: 1.6;
}

.kklidi-lms-classroom-hero-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 10px;
}

.kklidi-lms-classroom-layout {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 22px;
	margin-top: 22px;
	align-items: start;
}

.kklidi-lms-classroom-sidebar {
	display: grid;
	gap: 14px;
	position: sticky;
	top: 28px;
}

.kklidi-lms-classroom-profile-card {
	display: grid;
	gap: 8px;
	justify-items: center;
	padding: 20px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-card);
	text-align: center;
}

.kklidi-lms-classroom-profile-card strong {
	margin-top: 4px;
	font-size: var(--kklidi-lms-font-size-lg);
	line-height: 1.35;
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-classroom-profile-card span {
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	overflow-wrap: anywhere;
}

.kklidi-lms-classroom-nav {
	display: grid;
	gap: 8px;
	padding: 12px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-card);
}

.kklidi-lms-classroom-nav a {
	display: flex;
	align-items: center;
	min-height: 42px;
	padding: 0 12px;
	border-radius: var(--kklidi-lms-radius-md);
	color: var(--kklidi-lms-color-text-soft);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 800;
	text-decoration: none;
}

.kklidi-lms-classroom-nav a:hover,
.kklidi-lms-classroom-nav a:focus-visible,
.kklidi-lms-classroom-nav a.is-active {
	background: var(--kklidi-lms-color-surface-hover);
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-classroom-sidebar-blocks {
	display: grid;
	gap: 12px;
}

.kklidi-lms-classroom-sidebar-block {
	display: grid;
	gap: 12px;
	padding: 16px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-card);
}

.kklidi-lms-classroom-sidebar-block h4 {
	margin: 0;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-md);
	line-height: 1.35;
	font-weight: 900;
}

.kklidi-lms-classroom-sidebar-block-content {
	min-width: 0;
	color: var(--kklidi-lms-color-text-soft);
	font-size: var(--kklidi-lms-font-size-sm);
	line-height: 1.65;
	overflow-wrap: anywhere;
}

.kklidi-lms-classroom-sidebar-block-content > *:first-child {
	margin-top: 0;
}

.kklidi-lms-classroom-sidebar-block-content > *:last-child {
	margin-bottom: 0;
}

.kklidi-lms-classroom-sidebar-block-content .kklidi-lms-button {
	width: 100%;
	justify-content: center;
}

.kklidi-lms-classroom-main {
	display: grid;
	gap: 22px;
	min-width: 0;
}

.kklidi-lms-classroom-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
}

.kklidi-lms-classroom-stat {
	padding: 18px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-card);
}

.kklidi-lms-classroom-stat span {
	display: block;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 800;
}

.kklidi-lms-classroom-stat strong {
	display: block;
	margin-top: 8px;
	color: var(--kklidi-lms-color-text);
	font-size: 26px;
	line-height: 1;
	letter-spacing: 0;
}

.kklidi-lms-classroom-section {
	padding: 24px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-card);
}

.kklidi-lms-classroom-section-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 18px;
}

.kklidi-lms-classroom-section-head h3 {
	margin: 0;
	font-size: 22px;
	line-height: 1.35;
	letter-spacing: 0;
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-classroom-custom-tab-content {
	color: var(--kklidi-lms-color-content);
	font-size: var(--kklidi-lms-font-size-md);
	line-height: 1.75;
	overflow-wrap: anywhere;
}

.kklidi-lms-classroom-custom-tab-content > *,
.kklidi-lms-classroom-custom-tab-content .kklidi-dm-wrap {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
}

.kklidi-lms-classroom-custom-tab-content > *:first-child {
	margin-top: 0;
}

.kklidi-lms-classroom-custom-tab-content > *:last-child {
	margin-bottom: 0;
}

.kklidi-lms-classroom-course-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 18px;
}

.kklidi-lms-classroom-course-list {
	display: grid;
	gap: 14px;
}

.kklidi-lms-classroom-course {
	display: grid;
	grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
	align-items: stretch;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-section);
	overflow: hidden;
	transition: transform var(--kklidi-lms-transition-fast), border-color var(--kklidi-lms-transition-fast), box-shadow var(--kklidi-lms-transition-fast);
}

.kklidi-lms-classroom-course:hover {
	transform: translateY(-2px);
	border-color: var(--kklidi-lms-color-border-hover);
	box-shadow: var(--kklidi-lms-shadow-card-hover);
}

.kklidi-lms-classroom-course-thumb {
	display: grid;
	place-items: center;
	min-height: 168px;
	background: var(--kklidi-lms-color-surface-muted);
	color: var(--kklidi-lms-color-primary);
	text-decoration: none;
	overflow: hidden;
}

.kklidi-lms-classroom-course-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.kklidi-lms-classroom-course-thumb span {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--kklidi-lms-color-surface);
	font-size: 26px;
	font-weight: 900;
}

.kklidi-lms-classroom-course-body {
	display: grid;
	gap: 12px;
	padding: 20px;
}

.kklidi-lms-classroom-course-meta,
.kklidi-lms-classroom-course-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 800;
}

.kklidi-lms-classroom-course h4 {
	margin: 0;
	font-size: var(--kklidi-lms-font-size-xl);
	line-height: 1.35;
	letter-spacing: 0;
}

.kklidi-lms-classroom-course h4 a {
	color: var(--kklidi-lms-color-text);
	text-decoration: none;
}

.kklidi-lms-classroom-course p {
	margin: 0;
	color: var(--kklidi-lms-color-card-copy);
	font-size: var(--kklidi-lms-font-size-sm);
	line-height: 1.65;
	max-width: 680px;
}

.kklidi-lms-classroom-progress-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px;
}

.kklidi-lms-classroom-progress-row .kklidi-lms-progress {
	margin: 0;
}

.kklidi-lms-classroom-progress-row strong {
	min-width: 40px;
	text-align: right;
	font-size: var(--kklidi-lms-font-size-sm);
}

.kklidi-lms-classroom-course-foot {
	margin-top: 4px;
}

.kklidi-lms-classroom-course-foot .kklidi-lms-button {
	min-height: 38px;
	padding: 0 13px;
	font-size: var(--kklidi-lms-font-size-sm);
	white-space: nowrap;
}

.kklidi-lms-classroom-activity-list {
	display: grid;
	gap: 12px;
}

.kklidi-lms-classroom-activity-item {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-section);
}

.kklidi-lms-classroom-activity-item strong {
	display: block;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-md);
	line-height: 1.4;
}

.kklidi-lms-classroom-activity-item span {
	display: block;
	margin-top: 4px;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
}

.kklidi-lms-classroom-activity-meta {
	display: flex;
	align-items: center;
	gap: 8px;
}

.kklidi-lms-classroom-activity-meta span {
	min-width: 58px;
	margin: 0;
	padding: 7px 9px;
	border-radius: var(--kklidi-lms-radius-pill);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 900;
	text-align: center;
}

.kklidi-lms-status-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid transparent;
}

.kklidi-lms-status-badge--completed {
	border-color: var(--kklidi-lms-color-status-completed-border);
	background: var(--kklidi-lms-color-status-completed-bg);
	color: var(--kklidi-lms-color-status-completed);
}

.kklidi-lms-status-badge--in-progress {
	border-color: var(--kklidi-lms-color-status-progress-border);
	background: var(--kklidi-lms-color-status-progress-bg);
	color: var(--kklidi-lms-color-status-progress);
}

.kklidi-lms-classroom-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--kklidi-lms-space-sm);
	margin-top: var(--kklidi-lms-space-md);
}

.kklidi-lms-classroom-pagination a,
.kklidi-lms-classroom-pagination strong {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 38px;
	padding: 0 var(--kklidi-lms-space-sm);
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius-md);
	background: var(--kklidi-lms-color-surface);
	color: var(--kklidi-lms-color-text-soft);
	font-size: var(--kklidi-lms-font-size-sm);
	text-decoration: none;
}

.kklidi-lms-classroom-pagination a {
	color: var(--kklidi-lms-color-primary);
	font-weight: 700;
}

.kklidi-lms-classroom-pagination a:not(.is-disabled):hover {
	border-color: var(--kklidi-lms-color-border-hover);
	background: var(--kklidi-lms-color-surface-primary-muted);
	color: var(--kklidi-lms-color-primary-hover);
}

.kklidi-lms-classroom-pagination .is-disabled {
	color: var(--kklidi-lms-color-muted);
	opacity: 0.45;
	pointer-events: none;
}

.kklidi-lms-classroom-certificate-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

.kklidi-lms-classroom-certificate-note {
	margin: 0 0 6px;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	line-height: 1.65;
}

.kklidi-lms-classroom-certificate-summary {
	margin: 0 0 18px;
	color: var(--kklidi-lms-color-text-soft);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 700;
	line-height: 1.5;
}

.kklidi-lms-classroom-subsection {
	display: grid;
	gap: 14px;
}

.kklidi-lms-classroom-subsection + .kklidi-lms-classroom-subsection,
.kklidi-lms-classroom-subsection + .kklidi-lms-classroom-subnote {
	margin-top: 22px;
}

.kklidi-lms-classroom-subsection h4 {
	margin: 0;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-lg);
	line-height: 1.35;
	letter-spacing: 0;
}

.kklidi-lms-classroom-certificate-progress {
	margin-top: 22px;
	padding-top: 2px;
}

.kklidi-lms-classroom-certificate-progress summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 44px;
	padding: 10px 0;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-md);
	font-weight: 800;
	line-height: 1.35;
	cursor: pointer;
}

.kklidi-lms-classroom-certificate-progress summary::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.18s ease;
	opacity: 0.65;
}

.kklidi-lms-classroom-certificate-progress[open] summary::after {
	transform: rotate(225deg);
}

.kklidi-lms-classroom-certificate-progress summary::marker,
.kklidi-lms-classroom-certificate-progress summary::-webkit-details-marker {
	display: none;
	content: "";
}

.kklidi-lms-classroom-certificate-progress .kklidi-lms-classroom-certificate-grid {
	margin-top: 6px;
}

.kklidi-lms-classroom-certificate-progress .kklidi-lms-classroom-certificate-card {
	background: var(--kklidi-lms-color-surface);
}

.kklidi-lms-classroom-subnote {
	margin-bottom: 0;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	line-height: 1.65;
}

.kklidi-lms-classroom-certificate-card {
	display: grid;
	grid-template-columns: 86px minmax(0, 1fr);
	gap: 16px;
	padding: 18px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-section);
}

.kklidi-lms-classroom-certificate-mark {
	display: grid;
	place-items: center;
	min-height: 86px;
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-muted);
	text-align: center;
}

.kklidi-lms-classroom-certificate-mark span {
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 900;
}

.kklidi-lms-classroom-certificate-card.is-ready .kklidi-lms-classroom-certificate-mark {
	background: var(--kklidi-lms-color-surface-primary-soft);
}

.kklidi-lms-classroom-certificate-card.is-ready .kklidi-lms-classroom-certificate-mark span {
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-classroom-certificate-card.is-issued .kklidi-lms-classroom-certificate-mark {
	background: var(--kklidi-lms-color-surface-success-soft);
}

.kklidi-lms-classroom-certificate-card.is-issued .kklidi-lms-classroom-certificate-mark span {
	color: var(--kklidi-lms-color-success);
}

.kklidi-lms-classroom-certificate-body {
	display: grid;
	gap: 10px;
	min-width: 0;
}

.kklidi-lms-classroom-certificate-body h4 {
	margin: 0;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-lg);
	line-height: 1.35;
	letter-spacing: 0;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.kklidi-lms-classroom-certificate-body p {
	margin: 0;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	overflow-wrap: anywhere;
	word-break: break-word;
}

.kklidi-lms-classroom-certificate-body .kklidi-lms-progress {
	margin: 0;
}

.kklidi-lms-classroom-certificate-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.kklidi-lms-classroom-certificate-actions > span {
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
}

.kklidi-lms-classroom-additional-materials-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

.kklidi-lms-classroom-additional-materials-card {
	display: grid;
	grid-template-columns: 86px minmax(0, 1fr);
	gap: 16px;
	padding: 18px;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-section);
}

.kklidi-lms-classroom-additional-materials-mark {
	display: grid;
	place-items: center;
	min-height: 86px;
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-muted);
	text-align: center;
}

.kklidi-lms-classroom-additional-materials-mark span {
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 900;
}

.kklidi-lms-classroom-additional-materials-card.is-ready .kklidi-lms-classroom-additional-materials-mark {
	background: var(--kklidi-lms-color-surface-success-soft);
}

.kklidi-lms-classroom-additional-materials-card.is-ready .kklidi-lms-classroom-additional-materials-mark span {
	color: var(--kklidi-lms-color-success);
}

.kklidi-lms-classroom-additional-materials-body {
	display: grid;
	gap: 10px;
	min-width: 0;
}

.kklidi-lms-classroom-additional-materials-body h4 {
	margin: 0;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-lg);
	line-height: 1.35;
	letter-spacing: 0;
}

.kklidi-lms-classroom-additional-materials-body p {
	margin: 0;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	line-height: 1.65;
}

.kklidi-lms-classroom-additional-materials-body .kklidi-lms-progress {
	margin: 0;
}

.kklidi-lms-classroom-additional-materials-course {
	font-weight: 800;
	color: var(--kklidi-lms-color-text-soft);
}

.kklidi-lms-classroom-additional-materials-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.kklidi-lms-classroom-additional-materials-actions > span {
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 800;
}

.kklidi-lms-classroom-profile-stack {
	display: grid;
	gap: 14px;
}

.kklidi-lms-classroom-profile-panel {
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-soft);
	overflow: hidden;
}

.kklidi-lms-classroom-profile-panel summary {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px 14px;
	align-items: center;
	padding: 18px 20px;
	cursor: pointer;
	list-style: none;
}

.kklidi-lms-classroom-profile-panel summary::-webkit-details-marker {
	display: none;
}

.kklidi-lms-classroom-profile-panel summary::after {
	content: "";
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--kklidi-lms-color-muted);
	border-bottom: 2px solid var(--kklidi-lms-color-muted);
	transform: rotate(45deg);
	transition: transform var(--kklidi-lms-transition-fast);
}

.kklidi-lms-classroom-profile-panel[open] summary::after {
	transform: rotate(225deg);
}

.kklidi-lms-classroom-profile-panel summary span {
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-lg);
	font-weight: 900;
}

.kklidi-lms-classroom-profile-panel summary small {
	grid-column: 1 / -1;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 700;
}

.kklidi-lms-classroom-profile-form {
	display: grid;
	gap: 18px;
	padding: 0 20px 20px;
}

.kklidi-lms-classroom-form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.kklidi-lms-classroom-form-grid label {
	display: grid;
	gap: 7px;
	margin: 0;
}

.kklidi-lms-classroom-form-grid label.is-full {
	grid-column: 1 / -1;
}

.kklidi-lms-classroom-form-grid span {
	color: var(--kklidi-lms-color-text-soft);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 800;
}

.kklidi-lms-classroom-form-grid input,
.kklidi-lms-classroom-form-grid textarea {
	width: 100%;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid var(--kklidi-lms-color-border-strong);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-control);
	color: var(--kklidi-lms-color-text);
	font: inherit;
	font-size: var(--kklidi-lms-font-size-md);
}

.kklidi-lms-classroom-form-grid input:disabled {
	color: var(--kklidi-lms-color-muted);
	background: var(--kklidi-lms-color-surface-muted);
}

.kklidi-lms-classroom-form-grid textarea {
	resize: vertical;
	line-height: 1.6;
}

.kklidi-lms-classroom-form-actions {
	display: flex;
	justify-content: flex-end;
}

.kklidi-lms-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
	margin: 30px 0;
}

.kklidi-lms-card {
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	padding: 22px;
	background: var(--kklidi-lms-color-surface);
	box-shadow: var(--kklidi-lms-shadow-card);
	transition: transform var(--kklidi-lms-transition-fast), box-shadow var(--kklidi-lms-transition-fast), border-color var(--kklidi-lms-transition-fast);
}

.kklidi-lms-card:hover {
	transform: translateY(-2px);
	border-color: var(--kklidi-lms-color-border-hover);
	box-shadow: var(--kklidi-lms-shadow-card-hover);
}

.kklidi-lms-card h3 {
	margin: 18px 0 10px;
	font-size: 21px;
	line-height: 1.35;
	letter-spacing: 0;
}

.kklidi-lms-card h3 a {
	color: var(--kklidi-lms-color-text);
	text-decoration: none;
}

.kklidi-lms-card p {
	margin: 0 0 18px;
	color: var(--kklidi-lms-color-card-copy);
	font-size: var(--kklidi-lms-font-size-md);
	line-height: 1.75;
}

.kklidi-lms-thumb {
	display: block;
	aspect-ratio: 16 / 9;
	background: var(--kklidi-lms-color-surface-muted);
	overflow: hidden;
	border-radius: var(--kklidi-lms-radius-md);
}

.kklidi-lms-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.kklidi-lms-progress {
	height: 7px;
	background: var(--kklidi-lms-color-surface-progress);
	border-radius: var(--kklidi-lms-radius-pill);
	overflow: hidden;
	margin: 16px 0;
}

.kklidi-lms-progress span {
	display: block;
	height: 100%;
	width: var(--kklidi-lms-progress-value, 0%);
	background: var(--kklidi-lms-color-primary);
	transition: width var(--kklidi-lms-transition-fast);
}

.kklidi-lms-button,
.kklidi-lms-actions button,
.kklidi-lms-secondary,
.kklidi-lms-certificate-link,
.kklidi-lms-comments .form-submit .submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 18px;
	border: 1px solid var(--kklidi-lms-color-primary, #1f76d2);
	border-radius: var(--kklidi-lms-radius-md, 6px);
	background: var(--kklidi-lms-color-primary, #1f76d2);
	color: var(--kklidi-lms-color-surface, #fff);
	text-decoration: none;
	cursor: pointer;
	font-size: var(--kklidi-lms-font-size-md);
	font-weight: 700;
	letter-spacing: 0;
	transition: background var(--kklidi-lms-transition-fast), border-color var(--kklidi-lms-transition-fast), color var(--kklidi-lms-transition-fast), box-shadow var(--kklidi-lms-transition-fast);
}

.kklidi-lms-button:focus-visible,
.kklidi-lms-actions button:focus-visible,
.kklidi-lms-secondary:focus-visible,
.kklidi-lms-certificate-link:focus-visible,
.kklidi-lms-comments .form-submit .submit:focus-visible,
.kklidi-lms-sidebar a:focus-visible,
.kklidi-lms-sidebar-mini button:focus-visible,
.kklidi-lms-sidebar-toggle:focus-visible,
.kklidi-lms-mobile-toc-toggle:focus-visible,
.kklidi-lms-focus-topbar a:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--kklidi-lms-color-primary) 30%, transparent);
	outline-offset: 2px;
}

.kklidi-lms-button:hover,
.kklidi-lms-actions button:hover,
.kklidi-lms-comments .form-submit .submit:hover {
	background: var(--kklidi-lms-color-primary-hover);
	border-color: var(--kklidi-lms-color-primary-hover);
	color: var(--kklidi-lms-color-surface);
}

.kklidi-lms-actions button:disabled,
.kklidi-lms-actions button:disabled:hover,
.kklidi-lms-actions .kklidi-lms-complete-done {
	border-color: var(--kklidi-lms-color-success);
	background: var(--kklidi-lms-color-success);
	color: var(--kklidi-lms-color-surface);
	cursor: default;
	opacity: 1;
}

.kklidi-lms-secondary {
	border-color: var(--kklidi-lms-color-border-strong);
	background: var(--kklidi-lms-color-surface);
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-secondary:hover {
	background: var(--kklidi-lms-color-surface-secondary);
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-card-actions,
.kklidi-lms-overview-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

.kklidi-lms-certificate-link {
	border: 1px solid var(--kklidi-lms-color-success);
	background: var(--kklidi-lms-color-success);
	color: var(--kklidi-lms-color-surface);
}

.kklidi-lms-certificate-link:hover {
	background: var(--kklidi-lms-color-success-hover);
	border-color: var(--kklidi-lms-color-success-hover);
	color: var(--kklidi-lms-color-surface);
}

.kklidi-lms-certificate-link.is-sidebar {
	box-sizing: border-box;
	width: 100%;
	margin-top: 14px;
}

.kklidi-lms-certificate-issue-form {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
}

.kklidi-lms-certificate-name {
	display: grid;
	gap: 5px;
	min-width: 180px;
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 700;
	color: var(--kklidi-lms-color-muted);
}

.kklidi-lms-certificate-name input {
	box-sizing: border-box;
	width: 100%;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--kklidi-lms-color-border-strong);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	color: var(--kklidi-lms-color-text);
	font: inherit;
	font-size: 14px;
}

.kklidi-lms-certificate-issue-form .is-sidebar,
.kklidi-lms-player-focus .kklidi-lms-certificate-issue-form,
.kklidi-lms-sidebar .kklidi-lms-certificate-issue-form {
	width: 100%;
}

.kklidi-lms-sidebar .kklidi-lms-certificate-name {
	width: 100%;
}

.kklidi-lms-certificate-issue-form .kklidi-lms-certificate-link {
	font-family: inherit;
}

.kklidi-lms-certificate-pending {
	margin-top: 14px;
	padding: 11px 12px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 700;
	line-height: 1.45;
}

.kklidi-lms-overview {
	margin-top: 34px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	overflow: hidden;
	box-shadow: var(--kklidi-lms-shadow-panel);
}

.kklidi-lms-curriculum-shortcode {
	width: 100%;
	margin-right: 0;
	margin-left: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	overflow: visible;
}

.kklidi-lms-curriculum-shortcode .kklidi-lms-curriculum-preview {
	width: 100%;
	margin-right: 0;
	margin-left: 0;
	padding-right: 0;
	padding-left: 0;
}

.kklidi-lms-overview-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 22px;
	padding: 26px 30px;
	background: var(--kklidi-lms-color-surface-soft);
	border-bottom: 1px solid var(--kklidi-lms-color-border);
}

.kklidi-lms-overview-head strong {
	color: var(--kklidi-lms-color-text);
	font-size: 18px;
}

.kklidi-lms-overview-head > div:first-child {
	min-width: 240px;
	flex: 1;
}

.kklidi-lms-curriculum-preview {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 10px;
}

.kklidi-lms-curriculum-section {
	margin: 0;
	padding: 0;
	border: 1px solid var(--kklidi-lms-color-border-card);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	box-shadow: 0 6px 18px rgba(16, 24, 40, 0.04);
	overflow: hidden;
	transition: border-color var(--kklidi-lms-transition-fast), box-shadow var(--kklidi-lms-transition-fast);
}

.kklidi-lms-curriculum-section:has(.kklidi-lms-curriculum-accordion[open]) {
	border-color: var(--kklidi-lms-color-border-strong);
	box-shadow: var(--kklidi-lms-shadow-soft);
}

.kklidi-lms-curriculum-accordion {
	margin: 0;
}

.kklidi-lms-curriculum-section-summary {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 66px;
	padding: 0 22px;
	color: var(--kklidi-lms-color-text);
	background: linear-gradient(180deg, var(--kklidi-lms-color-surface), var(--kklidi-lms-color-surface-control));
	cursor: pointer;
	list-style: none;
}

.kklidi-lms-curriculum-shortcode.is-flat .kklidi-lms-curriculum-section-summary {
	cursor: default;
}

.kklidi-lms-curriculum-section-summary::-webkit-details-marker {
	display: none;
}

.kklidi-lms-curriculum-section-summary::after {
	content: "";
	flex: 0 0 auto;
	margin-left: auto;
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--kklidi-lms-color-muted);
	border-bottom: 2px solid var(--kklidi-lms-color-muted);
	transform: rotate(45deg);
	transition: transform var(--kklidi-lms-transition-fast), border-color var(--kklidi-lms-transition-fast);
}

.kklidi-lms-curriculum-shortcode.is-flat .kklidi-lms-curriculum-section-summary::after {
	content: none;
}

.kklidi-lms-curriculum-accordion[open] .kklidi-lms-curriculum-section-summary::after {
	transform: rotate(225deg);
	border-color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-curriculum-accordion .kklidi-lms-curriculum-section-summary:hover {
	color: var(--kklidi-lms-color-primary);
	background: var(--kklidi-lms-color-surface-hover);
}

.kklidi-lms-curriculum-accordion .kklidi-lms-curriculum-section-summary:focus-visible {
	color: var(--kklidi-lms-color-primary);
	background: var(--kklidi-lms-color-surface-hover);
	outline: none;
	box-shadow: inset 0 0 0 2px rgba(31, 118, 210, 0.22);
}

.kklidi-lms-curriculum-section-title {
	min-width: 0;
	font-size: var(--kklidi-lms-font-size-lg);
	font-weight: 900;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

.kklidi-lms-curriculum-section-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-height: 26px;
	padding: 0 9px;
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-surface-muted);
	color: var(--kklidi-lms-color-text-soft);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 800;
	white-space: nowrap;
}

.kklidi-lms-curriculum-section ol {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--kklidi-lms-color-border-line);
}

.kklidi-lms-curriculum-section ol li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 15px 22px;
	border-bottom: 1px solid var(--kklidi-lms-color-border-line);
	color: var(--kklidi-lms-color-content);
	font-size: 16px;
	line-height: 1.55;
}

.kklidi-lms-curriculum-lesson-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	color: inherit;
	text-decoration: none;
}

.kklidi-lms-curriculum-lesson-link:hover {
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-curriculum-lesson-link.is-disabled {
	cursor: not-allowed;
	color: var(--kklidi-lms-color-muted);
}

.kklidi-lms-curriculum-lesson-link.is-disabled:hover {
	color: var(--kklidi-lms-color-muted);
}

.kklidi-lms-curriculum-lesson-title {
	min-width: 0;
	overflow-wrap: anywhere;
}

.kklidi-lms-curriculum-lesson-meta {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	flex: 0 0 auto;
}

.kklidi-lms-curriculum-lesson-meta b {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 30px;
	padding: 0 11px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-surface-soft);
	color: var(--kklidi-lms-color-primary);
	font-size: 13px;
	font-weight: 800;
	white-space: nowrap;
}

.kklidi-lms-curriculum-section ol li:last-child {
	border-bottom: 0;
}

.kklidi-lms-curriculum-preview small {
	color: var(--kklidi-lms-color-success);
	font-weight: 700;
}

.kklidi-lms-curriculum-preview small.is-sample {
	padding: 3px 8px;
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-surface-primary-muted);
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-curriculum-preview small.is-locked {
	padding: 3px 8px;
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-status-progress-bg);
	color: var(--kklidi-lms-color-status-progress);
}

.kklidi-lms-curriculum-section ol li.is-locked {
	background: var(--kklidi-lms-color-surface-section);
}

.kklidi-lms-player {
	display: grid;
	grid-template-columns: minmax(270px, 340px) minmax(0, 1fr);
	gap: 0;
	align-items: stretch;
	margin-top: 34px;
	border: 1px solid var(--kklidi-lms-color-border, #dbe3ec);
	border-radius: var(--kklidi-lms-radius-lg, 12px);
	background: var(--kklidi-lms-color-surface, #fff);
	overflow: hidden;
	box-shadow: var(--kklidi-lms-shadow-md, 0 12px 34px rgba(16, 24, 40, 0.08));
}

.kklidi-lms-player.is-sidebar-collapsed {
	grid-template-columns: 76px minmax(0, 1fr);
}

.kklidi-lms-focus-body {
	margin: 0;
	background: var(--kklidi-lms-color-bg, #f3f6f9);
	color: var(--kklidi-lms-color-text, #172b4d);
	font-family: var(--kklidi-lms-font-family);
}

.kklidi-lms-focus-body .kklidi-lms-player-focus {
	min-height: 100vh;
	height: auto;
	margin: 0;
	border: 0;
	border-radius: 0;
	grid-template-columns: 360px minmax(0, 1fr);
	box-shadow: none;
}

.kklidi-lms-focus-body .kklidi-lms-player-focus.is-sidebar-collapsed {
	grid-template-columns: 76px minmax(0, 1fr);
}

.kklidi-lms-focus-body #wpadminbar ~ .kklidi-lms-player-focus {
	min-height: calc(100vh - 32px);
}

.kklidi-lms-sidebar {
	position: sticky;
	top: 24px;
	align-self: start;
	display: grid;
	box-sizing: border-box;
	border-right: 1px solid var(--kklidi-lms-color-border, #dbe3ec);
	background: var(--kklidi-lms-color-surface-soft, #f8fafc);
	min-height: 560px;
}

.kklidi-lms-player-focus .kklidi-lms-sidebar {
	position: static;
	align-self: stretch;
	height: auto;
	min-height: 100vh;
	max-height: none;
	overflow: visible;
}

.kklidi-lms-focus-body.admin-bar .kklidi-lms-player-focus .kklidi-lms-sidebar {
	min-height: calc(100vh - 32px);
}

.kklidi-lms-sidebar-mini,
.kklidi-lms-sidebar-panel {
	min-width: 0;
}

.kklidi-lms-sidebar-mini {
	display: none;
	align-content: start;
	justify-items: center;
	gap: 10px;
	padding: 20px 10px;
	color: var(--kklidi-lms-color-text-soft);
	text-align: center;
}

.kklidi-lms-sidebar-mini button,
.kklidi-lms-sidebar-toggle,
.kklidi-lms-mobile-toc-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	min-height: 38px;
	border: 1px solid var(--kklidi-lms-color-border, #dbe3ec);
	border-radius: var(--kklidi-lms-radius-md, 6px);
	background: var(--kklidi-lms-color-surface, #fff);
	color: var(--kklidi-lms-color-text-soft, #334155);
	cursor: pointer;
	font: inherit;
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 900;
	line-height: 1;
}

.kklidi-lms-sidebar-mini button:hover,
.kklidi-lms-sidebar-toggle:hover,
.kklidi-lms-mobile-toc-toggle:hover {
	border-color: var(--kklidi-lms-color-border-hover);
	background: var(--kklidi-lms-color-surface-hover);
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-sidebar-mini strong {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: 50%;
	background: var(--kklidi-lms-color-surface);
	color: var(--kklidi-lms-color-primary);
	font-size: 12px;
	font-weight: 900;
}

.kklidi-lms-sidebar-mini span {
	color: var(--kklidi-lms-color-muted);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: 0;
}

.kklidi-lms-sidebar-mini small {
	writing-mode: vertical-rl;
	color: var(--kklidi-lms-color-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0;
}

.kklidi-lms-sidebar-panel {
	display: flex;
	min-height: 0;
	max-height: calc(100vh - 48px);
	flex-direction: column;
	padding: var(--kklidi-lms-space-lg, 24px);
}

.kklidi-lms-player-focus .kklidi-lms-sidebar-panel {
	max-height: 100vh;
}

.kklidi-lms-focus-body.admin-bar .kklidi-lms-player-focus .kklidi-lms-sidebar-panel {
	max-height: calc(100vh - 32px);
}

.kklidi-lms-player.is-sidebar-collapsed .kklidi-lms-sidebar-mini {
	display: grid;
}

.kklidi-lms-player.is-sidebar-collapsed .kklidi-lms-sidebar-panel {
	display: none;
}

.kklidi-lms-sidebar-title {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 12px;
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-sidebar-title h3 {
	margin: 0;
	font-size: 19px;
	line-height: 1.45;
	letter-spacing: 0;
}

.kklidi-lms-sidebar-title span {
	flex: 0 0 auto;
	padding: 5px 9px;
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-surface-primary-soft);
	color: var(--kklidi-lms-color-primary);
	font-size: var(--kklidi-lms-font-size-xs);
	font-weight: 800;
}

.kklidi-lms-sidebar-progress-summary {
	display: grid;
	gap: 4px;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 800;
}

.kklidi-lms-sidebar-progress-summary strong {
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-md);
}

.kklidi-lms-sidebar-progress-summary span {
	color: var(--kklidi-lms-color-primary);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 900;
}

.kklidi-lms-sidebar-scroll {
	flex: 1 1 auto;
	min-height: 0;
	margin-top: 18px;
	overflow: auto;
	scrollbar-gutter: stable;
}

.kklidi-lms-sidebar ol {
	margin: 0;
	padding-left: 0;
	list-style: none;
}

.kklidi-lms-sidebar li {
	margin: 0;
	border-bottom: 1px solid var(--kklidi-lms-color-border-soft);
}

.kklidi-lms-sidebar li.kklidi-lms-sidebar-section {
	margin-top: 18px;
	padding: 0 12px 8px;
	border-bottom: 0;
	color: var(--kklidi-lms-color-subtle);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.35;
	text-transform: uppercase;
}

.kklidi-lms-sidebar li.kklidi-lms-sidebar-section:first-child {
	margin-top: 0;
}

.kklidi-lms-sidebar li.kklidi-lms-sidebar-section-group {
	border-bottom: 0;
}

.kklidi-lms-sidebar-section-toggle {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 8px;
	width: 100%;
	min-height: 46px;
	padding: 8px 10px;
	border: 0;
	border-bottom: 1px solid var(--kklidi-lms-color-border-soft);
	background: transparent;
	color: var(--kklidi-lms-color-subtle);
	cursor: pointer;
	font: inherit;
	text-align: left;
}

.kklidi-lms-sidebar-section-toggle:hover,
.kklidi-lms-sidebar-section-toggle:focus-visible {
	background: var(--kklidi-lms-color-surface-hover);
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-sidebar-section-toggle:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--kklidi-lms-color-primary) 30%, transparent);
	outline-offset: 2px;
}

.kklidi-lms-sidebar-section-toggle span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	font-size: 12px;
	font-weight: 900;
	line-height: 1.35;
	text-transform: uppercase;
}

.kklidi-lms-sidebar-section-toggle span::before {
	content: "";
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
	transition: transform var(--kklidi-lms-transition-fast);
}

.kklidi-lms-sidebar-section-toggle[aria-expanded="true"] span::before {
	transform: rotate(45deg) translateY(-2px);
}

.kklidi-lms-sidebar-section-toggle small {
	color: var(--kklidi-lms-color-muted);
	font-size: 11px;
	font-weight: 800;
	white-space: nowrap;
}

.kklidi-lms-sidebar-section-lessons {
	margin: 0;
	padding: 0;
	list-style: none;
}

.kklidi-lms-sidebar li:last-child {
	border-bottom: 0;
}

.kklidi-lms-sidebar a {
	display: block;
	padding: 15px 12px;
	color: var(--kklidi-lms-color-text-soft);
	text-decoration: none;
	border-left: 4px solid transparent;
	border-radius: var(--kklidi-lms-radius-sm);
	font-size: 15px;
	line-height: 1.55;
}

.kklidi-lms-sidebar a:hover {
	background: var(--kklidi-lms-color-surface-hover);
	color: var(--kklidi-lms-color-text);
}

.kklidi-lms-sidebar li.is-locked span {
	display: block;
	padding: 15px 12px;
	border-left: 4px solid transparent;
	border-radius: var(--kklidi-lms-radius-sm);
	color: var(--kklidi-lms-color-muted);
	cursor: not-allowed;
	font-size: 15px;
	line-height: 1.55;
}

.kklidi-lms-sidebar li.is-current a {
	background: var(--kklidi-lms-color-surface-primary-soft);
	border-left-color: var(--kklidi-lms-color-primary);
	color: var(--kklidi-lms-color-primary-hover);
	font-weight: 800;
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--kklidi-lms-color-primary) 18%, transparent);
}

.kklidi-lms-sidebar li.is-complete a::before {
	content: attr(data-kklidi-complete-label) " ";
	color: var(--kklidi-lms-color-success);
	font-size: 12px;
	font-weight: 800;
}

.kklidi-lms-mobile-toc-toggle,
.kklidi-lms-sidebar-overlay {
	display: none;
}

.kklidi-lms-stage {
	min-width: 0;
	padding: 34px 38px 28px;
	background: var(--kklidi-lms-color-surface, #fff);
	overflow-x: clip;
}

.kklidi-lms-player-focus .kklidi-lms-stage {
	padding: 0;
	background: var(--kklidi-lms-color-surface);
}

.kklidi-lms-player-focus .kklidi-lms-stage > h2,
.kklidi-lms-player-focus .kklidi-lms-content,
.kklidi-lms-player-focus .kklidi-lms-comments,
.kklidi-lms-player-focus .kklidi-lms-actions {
	max-width: var(--kklidi-lms-content-width, 980px);
	margin-left: auto;
	margin-right: auto;
	padding-left: 38px;
	padding-right: 38px;
}

.kklidi-lms-stage > h2 {
	margin: 0 0 24px;
	color: var(--kklidi-lms-color-text);
	font-size: 31px;
	line-height: 1.3;
	letter-spacing: 0;
}

.kklidi-lms-focus-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	min-height: 64px;
	padding: 0 34px;
	border-bottom: 1px solid var(--kklidi-lms-color-border);
	background: var(--kklidi-lms-color-surface);
}

.kklidi-lms-focus-nav {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.kklidi-lms-focus-topbar a {
	color: var(--kklidi-lms-color-text-soft);
	text-decoration: none;
	font-size: 14px;
	font-weight: 800;
}

.kklidi-lms-focus-nav a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 0 12px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-surface-soft);
	white-space: nowrap;
}

.kklidi-lms-focus-nav a:hover {
	color: var(--kklidi-lms-color-primary);
	border-color: color-mix(in srgb, var(--kklidi-lms-color-primary) 34%, var(--kklidi-lms-color-border));
}

.kklidi-lms-focus-topbar strong {
	min-width: 0;
	overflow: hidden;
	color: var(--kklidi-lms-color-text);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.kklidi-lms-focus-brand {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	flex: 0 0 auto;
	max-width: 220px;
	min-height: 38px;
	padding: 0;
	color: var(--kklidi-lms-color-text);
	text-decoration: none;
}

.kklidi-lms-focus-brand span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 800;
	line-height: 1.3;
}

.kklidi-lms-focus-brand:hover {
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-focus-logo {
	display: block;
	width: auto;
	max-width: 150px;
	height: var(--kklidi-lms-focus-logo-height, 34px);
	max-height: var(--kklidi-lms-focus-logo-height, 34px);
	object-fit: contain;
}

.kklidi-lms-player-focus .kklidi-lms-stage > h2 {
	margin-top: 36px;
}

.kklidi-lms-video {
	aspect-ratio: 16 / 9;
	max-width: 100%;
	background: var(--kklidi-lms-color-video-bg, #111827);
	border-radius: var(--kklidi-lms-radius-lg, 12px);
	overflow: hidden;
	margin: 0 0 30px;
}

.kklidi-lms-player-focus .kklidi-lms-video {
	border-radius: 0;
	margin-bottom: 34px;
}

.kklidi-lms-video iframe,
.kklidi-lms-video video {
	width: 100%;
	height: 100%;
	display: block;
}

.kklidi-lms-content {
	color: var(--kklidi-lms-color-content);
	font-size: var(--kklidi-lms-font-size-lg);
	line-height: 1.9;
}

.kklidi-lms-content iframe,
.kklidi-lms-content video,
.kklidi-lms-content embed,
.kklidi-lms-content object {
	display: block;
	max-width: 100%;
	border: 0;
}

.kklidi-lms-content iframe[src*="youtube"],
.kklidi-lms-content iframe[src*="vimeo"] {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	margin: 0 0 30px;
	background: var(--kklidi-lms-color-video-bg, #111827);
	border-radius: var(--kklidi-lms-radius-lg, 12px);
	overflow: hidden;
}

.kklidi-lms-content p {
	margin: 0 0 22px;
}

.kklidi-lms-content h2,
.kklidi-lms-content h3,
.kklidi-lms-content h4 {
	margin: 34px 0 16px;
	color: var(--kklidi-lms-color-text);
	line-height: 1.35;
	letter-spacing: 0;
}

.kklidi-lms-notice {
	padding: 18px 20px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface-soft);
	color: var(--kklidi-lms-color-text-soft);
	font-family: var(--kklidi-lms-font-family);
}

.kklidi-lms-notice.is-error {
	border-color: var(--kklidi-lms-color-danger-border);
	background: var(--kklidi-lms-color-danger-bg);
	color: var(--kklidi-lms-color-danger);
}

.kklidi-lms-empty,
.kklidi-lms-admin-note {
	padding: 24px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius);
	background: var(--kklidi-lms-color-surface);
	color: var(--kklidi-lms-color-text-soft);
	box-shadow: var(--kklidi-lms-shadow-soft);
	font-family: var(--kklidi-lms-font-family);
}

.kklidi-lms-empty strong {
	display: block;
	margin-bottom: 8px;
	color: var(--kklidi-lms-color-text);
	font-size: 19px;
}

.kklidi-lms-empty p {
	margin: 0;
}

.kklidi-lms-admin-note {
	margin: 18px 0;
	background: var(--kklidi-lms-color-surface-soft);
}

.kklidi-lms-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--kklidi-lms-space-sm, 12px);
	margin-top: var(--kklidi-lms-space-xl, 30px);
	margin-bottom: var(--kklidi-lms-space-md, 18px);
	padding: var(--kklidi-lms-space-md, 18px);
	border: 1px solid var(--kklidi-lms-color-border-soft, #e5ebf1);
	border-radius: var(--kklidi-lms-radius-lg, 12px);
	background: var(--kklidi-lms-color-surface-soft, #f8fafc);
}

.kklidi-lms-actions form {
	margin: 0;
}

.kklidi-lms-actions > span {
	min-width: 96px;
}

.kklidi-lms-sample-notice {
	flex: 1 1 auto;
	color: var(--kklidi-lms-color-muted);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
}

.kklidi-lms-course-intro {
	max-width: 860px;
	margin-bottom: 14px;
	color: var(--kklidi-lms-color-content);
	font-size: 17px;
	line-height: 1.85;
}

.kklidi-lms-comments {
	margin-top: var(--kklidi-lms-space-md, 18px);
	margin-bottom: var(--kklidi-lms-space-md, 18px);
	border: 1px solid var(--kklidi-lms-color-border-soft, #e5ebf1);
	border-radius: var(--kklidi-lms-radius-lg, 12px);
	background: var(--kklidi-lms-color-surface, #fff);
	color: var(--kklidi-lms-color-content, #24364b);
	box-shadow: var(--kklidi-lms-shadow-sm, 0 8px 22px rgba(16, 24, 40, 0.06));
	overflow: hidden;
}

.kklidi-lms-comments summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--kklidi-lms-space-sm, 12px);
	min-height: 64px;
	padding: var(--kklidi-lms-space-md, 18px) var(--kklidi-lms-space-lg, 24px);
	cursor: pointer;
	list-style: none;
}

.kklidi-lms-comments summary::-webkit-details-marker {
	display: none;
}

.kklidi-lms-comments summary span {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.kklidi-lms-comments summary strong {
	color: var(--kklidi-lms-color-text);
	font-size: 17px;
	line-height: 1.4;
	letter-spacing: 0;
}

.kklidi-lms-comments summary small {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	height: 24px;
	padding: 0 9px;
	border-radius: var(--kklidi-lms-radius-pill);
	background: var(--kklidi-lms-color-surface-primary-muted);
	color: var(--kklidi-lms-color-primary);
	font-size: 12px;
	font-weight: 800;
}

.kklidi-lms-comments summary b {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--kklidi-lms-color-primary);
	font-size: 14px;
	font-weight: 800;
}

.kklidi-lms-comments summary b::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform var(--kklidi-lms-transition-fast);
}

.kklidi-lms-comments[open] summary {
	border-bottom: 1px solid var(--kklidi-lms-color-border-soft);
}

.kklidi-lms-comments[open] summary b::after {
	transform: rotate(225deg) translateY(-1px);
}

.kklidi-lms-comments-panel {
	padding: var(--kklidi-lms-space-lg, 24px);
}

.kklidi-lms-comment-empty {
	margin: 0 0 22px;
	padding: 16px 18px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius-md);
	background: var(--kklidi-lms-color-surface-soft);
	color: var(--kklidi-lms-color-muted);
}

.kklidi-lms-comment-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
	margin: -6px 0 26px;
	font-size: var(--kklidi-lms-font-size-sm);
}

.kklidi-lms-comment-pagination span {
	display: inline-flex;
}

.kklidi-lms-comment-pagination a,
.kklidi-lms-comment-pagination .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	min-height: 34px;
	padding: 6px 10px;
	border: 1px solid var(--kklidi-lms-color-border);
	border-radius: var(--kklidi-lms-radius-sm);
	color: var(--kklidi-lms-color-muted);
	text-decoration: none;
}

.kklidi-lms-comment-pagination .current {
	border-color: var(--kklidi-lms-color-primary);
	color: var(--kklidi-lms-color-primary);
	font-weight: 800;
}

.kklidi-lms-comment-pagination a:hover,
.kklidi-lms-comment-pagination a:focus-visible {
	border-color: var(--kklidi-lms-color-primary);
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-comment-list {
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
}

.kklidi-lms-comments .comment-reply-title {
	margin: 22px 0 14px;
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-xl);
	letter-spacing: 0;
}

.kklidi-lms-comment-list .kklidi-lms-comment-item {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	list-style: none;
	overflow-wrap: anywhere;
}

.kklidi-lms-comment-list .children {
	margin: 10px 0 0 36px;
	padding: 0 0 0 14px;
	border-left: 1px solid var(--kklidi-lms-color-border-soft);
	list-style: none;
}

.kklidi-lms-comment-list .children .kklidi-lms-comment-item {
	margin-bottom: 0;
	background: transparent;
	box-shadow: none;
}

.kklidi-lms-comment-list .children .kklidi-lms-comment-item::before {
	content: none;
	display: none;
}

.kklidi-lms-comment-body {
	display: flex;
	gap: 12px;
	padding: 18px 0;
	border-bottom: 1px solid var(--kklidi-lms-color-border-line);
}

.kklidi-lms-comment-list > .kklidi-lms-comment-item:first-child > .kklidi-lms-comment-body {
	padding-top: 0;
}

.kklidi-lms-comment-list > .kklidi-lms-comment-item:last-child > .kklidi-lms-comment-body,
.kklidi-lms-comment-list .children > .kklidi-lms-comment-item:last-child > .kklidi-lms-comment-body {
	border-bottom: 0;
}

.kklidi-lms-comment-avatar {
	flex: 0 0 auto;
	width: 36px;
}

.kklidi-lms-comment-avatar img {
	display: block;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
}

.kklidi-lms-comment-main {
	flex: 1 1 auto;
	min-width: 0;
}

.kklidi-lms-comment-header {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 6px 10px;
	min-width: 0;
}

.kklidi-lms-comment-author {
	color: var(--kklidi-lms-color-text);
	font-size: var(--kklidi-lms-font-size-md);
	font-weight: 800;
	line-height: 1.35;
}

.kklidi-lms-comment-date {
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-xs);
	line-height: 1.4;
	text-decoration: none;
}

.kklidi-lms-comment-date:hover,
.kklidi-lms-comment-date:focus-visible {
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-comment-content {
	margin-top: 8px;
	color: var(--kklidi-lms-color-content);
	font-size: var(--kklidi-lms-font-size-md);
	line-height: 1.75;
	overflow-wrap: anywhere;
	word-break: break-word;
}

.kklidi-lms-comment-content p {
	margin: 0 0 10px;
}

.kklidi-lms-comment-content p:last-child {
	margin-bottom: 0;
}

.kklidi-lms-comment-actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 12px;
	margin-top: 10px;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
}

.kklidi-lms-comment-actions a {
	color: inherit;
	text-decoration: none;
	font-weight: 700;
}

.kklidi-lms-comment-actions .comment-reply-link,
.kklidi-lms-comment-actions .comment-edit-link {
	display: inline;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	font-size: inherit;
	line-height: inherit;
}

.kklidi-lms-comment-actions a:hover,
.kklidi-lms-comment-actions a:focus-visible {
	color: var(--kklidi-lms-color-primary);
	text-decoration: none;
}

.kklidi-lms-comment-edit a {
	font-weight: 600;
	opacity: 0.8;
}

.kklidi-lms-comment-awaiting-moderation {
	margin: 8px 0 0;
	color: var(--kklidi-lms-color-muted);
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 700;
}

.kklidi-lms-comments .comment-reply-title small {
	display: inline-flex;
	margin-left: 8px;
	font-size: var(--kklidi-lms-font-size-sm);
	font-weight: 600;
}

.kklidi-lms-comments .comment-reply-title small a {
	color: var(--kklidi-lms-color-muted);
	text-decoration: none;
}

.kklidi-lms-comments .comment-reply-title small a:hover,
.kklidi-lms-comments .comment-reply-title small a:focus-visible {
	color: var(--kklidi-lms-color-primary);
}

.kklidi-lms-comments textarea,
.kklidi-lms-comments input[type="text"],
.kklidi-lms-comments input[type="email"],
.kklidi-lms-comments input[type="url"] {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	border: 1px solid var(--kklidi-lms-color-border-strong, #cbd5e1);
	border-radius: var(--kklidi-lms-radius-lg, 12px);
	padding: 13px 14px;
	color: var(--kklidi-lms-color-text, #172b4d);
	font-size: 15px;
	line-height: 1.6;
	background: var(--kklidi-lms-color-surface-control, #fbfcfd);
}

.kklidi-lms-comments textarea {
	min-height: 108px;
	resize: vertical;
}

.kklidi-lms-comments textarea:focus,
.kklidi-lms-comments input[type="text"]:focus,
.kklidi-lms-comments input[type="email"]:focus,
.kklidi-lms-comments input[type="url"]:focus {
	border-color: var(--kklidi-lms-color-primary);
	outline: 3px solid color-mix(in srgb, var(--kklidi-lms-color-primary) 18%, transparent);
	outline-offset: 1px;
}

.kklidi-lms-comments .comment-form-comment {
	margin: 0 0 12px;
}

.kklidi-lms-comments .form-submit {
	margin: 14px 0 0;
}

.kklidi-lms-comments label {
	display: block;
	margin-bottom: 6px;
	color: var(--kklidi-lms-color-text-soft);
	font-size: 14px;
	font-weight: 700;
}

.kklidi-lms-comments .comment-form-cookies-consent {
	display: flex;
	align-items: center;
	gap: 8px;
}

.kklidi-lms-comments .comment-form-cookies-consent label {
	margin: 0;
	font-weight: 500;
}

@media (max-width: 768px) {
	.kklidi-lms-classroom-layout {
		grid-template-columns: 1fr;
	}

	.kklidi-lms-classroom-sidebar {
		position: static;
	}

	.kklidi-lms-classroom-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.kklidi-lms-player,
	.kklidi-lms-focus-body .kklidi-lms-player-focus,
	.kklidi-lms-player.is-sidebar-collapsed,
	.kklidi-lms-focus-body .kklidi-lms-player-focus.is-sidebar-collapsed {
		grid-template-columns: 1fr;
	}

	.kklidi-lms-player-focus {
		position: relative;
	}

	.kklidi-lms-mobile-toc-toggle {
		display: inline-flex;
		position: absolute;
		top: var(--kklidi-lms-mobile-toc-top, 18px);
		left: var(--kklidi-lms-mobile-edge, 16px);
		z-index: 40;
		box-sizing: border-box;
		width: var(--kklidi-lms-mobile-control-size, 44px);
		height: var(--kklidi-lms-mobile-control-size, 44px);
		min-height: var(--kklidi-lms-mobile-control-size, 44px);
		margin: 0;
		padding: 0;
		border-radius: var(--kklidi-lms-radius-pill, 999px);
		box-shadow: var(--kklidi-lms-shadow-sm, 0 8px 22px rgba(16, 24, 40, 0.06));
		line-height: 1;
		overflow: hidden;
		text-indent: -999px;
		white-space: nowrap;
	}

	.kklidi-lms-mobile-toc-toggle::before {
		content: "";
		width: var(--kklidi-lms-mobile-toc-icon-width, 18px);
		height: var(--kklidi-lms-mobile-toc-icon-height, 14px);
		background:
			linear-gradient(currentColor, currentColor) 0 0 / var(--kklidi-lms-mobile-toc-icon-width, 18px) var(--kklidi-lms-mobile-toc-icon-stroke, 2px) no-repeat,
			linear-gradient(currentColor, currentColor) 0 calc((var(--kklidi-lms-mobile-toc-icon-height, 14px) - var(--kklidi-lms-mobile-toc-icon-stroke, 2px)) / 2) / var(--kklidi-lms-mobile-toc-icon-width, 18px) var(--kklidi-lms-mobile-toc-icon-stroke, 2px) no-repeat,
			linear-gradient(currentColor, currentColor) 0 calc(var(--kklidi-lms-mobile-toc-icon-height, 14px) - var(--kklidi-lms-mobile-toc-icon-stroke, 2px)) / var(--kklidi-lms-mobile-toc-icon-width, 18px) var(--kklidi-lms-mobile-toc-icon-stroke, 2px) no-repeat;
	}

	.kklidi-lms-focus-body.admin-bar .kklidi-lms-mobile-toc-toggle {
		top: var(--kklidi-lms-mobile-toc-top, 18px);
	}

	.kklidi-lms-sidebar,
	.kklidi-lms-player-focus .kklidi-lms-sidebar,
	.kklidi-lms-focus-body.admin-bar .kklidi-lms-player-focus .kklidi-lms-sidebar {
		position: fixed;
		top: var(--kklidi-lms-admin-bar-offset, 0px);
		right: auto;
		bottom: 0;
		left: 0;
		z-index: 60;
		align-self: auto;
		width: 100vw;
		max-width: none;
		height: calc(100dvh - var(--kklidi-lms-admin-bar-offset, 0px));
		min-height: calc(100dvh - var(--kklidi-lms-admin-bar-offset, 0px));
		max-height: calc(100dvh - var(--kklidi-lms-admin-bar-offset, 0px));
		border-right: 0;
		border-bottom: 0;
		background: var(--kklidi-lms-color-surface, #fff);
		box-shadow: none;
		overflow: hidden;
		opacity: 0;
		pointer-events: none;
		transform: none;
		visibility: hidden;
		transition: opacity var(--kklidi-lms-transition-fast), visibility var(--kklidi-lms-transition-fast);
	}

	.kklidi-lms-player.is-sidebar-open .kklidi-lms-sidebar,
	.kklidi-lms-player.kklidi-lms-player-focus.is-sidebar-open > .kklidi-lms-sidebar,
	.kklidi-lms-focus-body .kklidi-lms-player-focus.is-sidebar-open .kklidi-lms-sidebar,
	.kklidi-lms-focus-body.admin-bar .kklidi-lms-player-focus.is-sidebar-open .kklidi-lms-sidebar {
		opacity: 1;
		pointer-events: auto;
		transform: none;
		visibility: visible;
	}

	.kklidi-lms-sidebar-panel,
	.kklidi-lms-player-focus .kklidi-lms-sidebar-panel,
	.kklidi-lms-focus-body.admin-bar .kklidi-lms-player-focus .kklidi-lms-sidebar-panel {
		display: flex;
		flex-direction: column;
		height: 100%;
		min-height: 0;
		max-height: calc(100dvh - var(--kklidi-lms-admin-bar-offset, 0px));
		padding: calc(var(--kklidi-lms-space-md, 18px) + env(safe-area-inset-top, 0px)) var(--kklidi-lms-space-md, 18px) calc(var(--kklidi-lms-space-md, 18px) + env(safe-area-inset-bottom, 0px));
		background: var(--kklidi-lms-color-surface, #fff);
		overflow: hidden;
	}

	.kklidi-lms-sidebar-title {
		position: sticky;
		top: 0;
		z-index: 2;
		align-items: center;
		margin: calc(var(--kklidi-lms-space-xs, 8px) * -1) calc(var(--kklidi-lms-space-md, 18px) * -1) var(--kklidi-lms-space-sm, 12px);
		padding: var(--kklidi-lms-space-xs, 8px) var(--kklidi-lms-space-md, 18px) var(--kklidi-lms-space-sm, 12px);
		border-bottom: 1px solid var(--kklidi-lms-color-border-soft, #e5ebf1);
		background: var(--kklidi-lms-color-surface, #fff);
	}

	.kklidi-lms-sidebar-title h3 {
		display: -webkit-box;
		max-height: 3.1em;
		overflow: hidden;
		font-size: var(--kklidi-lms-font-size-lg, 17px);
		line-height: 1.5;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.kklidi-lms-sidebar-title span {
		padding: 4px 8px;
		font-size: 11px;
	}

	.kklidi-lms-sidebar-toggle {
		flex: 0 0 auto;
		width: var(--kklidi-lms-mobile-control-size, 44px);
		min-width: var(--kklidi-lms-mobile-control-size, 44px);
		height: var(--kklidi-lms-mobile-control-size, 44px);
		padding: 0;
		border-radius: var(--kklidi-lms-radius-pill, 999px);
	}

	.kklidi-lms-sidebar-progress-summary {
		margin-bottom: var(--kklidi-lms-space-sm, 12px);
		padding: var(--kklidi-lms-space-sm, 12px);
		border: 1px solid var(--kklidi-lms-color-border-soft, #e5ebf1);
		border-radius: var(--kklidi-lms-radius-lg, 12px);
		background: var(--kklidi-lms-color-surface-soft, #f8fafc);
	}

	.kklidi-lms-certificate-pending,
	.kklidi-lms-sidebar .kklidi-lms-certificate-issue-form {
		margin-top: 0;
		margin-bottom: var(--kklidi-lms-space-sm, 12px);
	}

	.kklidi-lms-sidebar .kklidi-lms-certificate-issue-form .kklidi-lms-button,
	.kklidi-lms-sidebar .kklidi-lms-certificate-issue-form .kklidi-lms-secondary,
	.kklidi-lms-sidebar .kklidi-lms-certificate-link {
		width: 100%;
		justify-content: center;
	}

	.kklidi-lms-sidebar-scroll {
		flex: 1 1 auto;
		min-height: 0;
		margin: 0 calc(var(--kklidi-lms-space-xs, 8px) * -1) 0 0;
		padding-right: var(--kklidi-lms-space-xs, 8px);
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.kklidi-lms-sidebar-mini {
		display: none;
	}

	.kklidi-lms-player.is-sidebar-collapsed .kklidi-lms-sidebar-mini {
		display: none;
	}

	.kklidi-lms-player.is-sidebar-collapsed .kklidi-lms-sidebar-panel {
		display: flex;
	}

	.kklidi-lms-player.is-sidebar-open .kklidi-lms-sidebar-toggle span[aria-hidden="true"] {
		font-size: 0;
	}

	.kklidi-lms-player.is-sidebar-open .kklidi-lms-sidebar-toggle span[aria-hidden="true"]::before {
		content: "\00d7";
		font-size: 20px;
		line-height: 1;
	}

	.kklidi-lms-sidebar-overlay {
		position: fixed;
		inset: var(--kklidi-lms-admin-bar-offset, 0px) 0 0;
		z-index: 55;
		background: color-mix(in srgb, var(--kklidi-lms-color-text, #172b4d) 42%, transparent);
	}

	.kklidi-lms-player.is-sidebar-open .kklidi-lms-sidebar-overlay {
		display: block;
	}

	.kklidi-lms-stage {
		width: 100%;
		padding: var(--kklidi-lms-space-md, 18px) var(--kklidi-lms-space-md, 18px) var(--kklidi-lms-space-xl, 30px);
	}
}

@media (max-width: 768px) {
	.kklidi-lms-classroom {
		padding: 0 12px 24px;
	}

	.kklidi-lms-classroom-hero,
	.kklidi-lms-classroom-identity,
	.kklidi-lms-classroom-section-head,
	.kklidi-lms-classroom-course-foot {
		align-items: flex-start;
		flex-direction: column;
	}

	.kklidi-lms-classroom-hero {
		padding: 20px;
	}

	.kklidi-lms-classroom-identity h2 {
		font-size: 21px;
	}

	.kklidi-lms-classroom-identity p {
		font-size: var(--kklidi-lms-font-size-sm);
	}

	.kklidi-lms-classroom-hero-actions,
	.kklidi-lms-classroom-hero-actions .kklidi-lms-button,
	.kklidi-lms-classroom-hero-actions .kklidi-lms-secondary {
		width: 100%;
	}

	.kklidi-lms-classroom-stats,
	.kklidi-lms-classroom-form-grid {
		grid-template-columns: 1fr;
	}

	.kklidi-lms-classroom-nav {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.kklidi-lms-classroom-course,
	.kklidi-lms-classroom-activity-item,
	.kklidi-lms-classroom-certificate-card,
	.kklidi-lms-classroom-additional-materials-card {
		grid-template-columns: 1fr;
	}

	.kklidi-lms-classroom-course-thumb {
		min-height: auto;
		aspect-ratio: 16 / 9;
	}

	.kklidi-lms-classroom-activity-meta {
		justify-content: flex-start;
	}

	.kklidi-lms-classroom-section {
		padding: 20px;
	}

	.kklidi-lms-classroom-course-foot .kklidi-lms-button,
	.kklidi-lms-classroom-form-actions .kklidi-lms-button {
		width: 100%;
	}

	.kklidi-lms-overview-head {
		align-items: stretch;
		flex-direction: column;
		padding: 22px;
	}

	.kklidi-lms-curriculum-section-summary {
		align-items: center;
		min-height: 0;
		padding: 16px 18px;
	}

	.kklidi-lms-curriculum-section ol li {
		padding: 15px 18px;
	}

	.kklidi-lms-curriculum-section-title {
		font-size: var(--kklidi-lms-font-size-md);
	}

	.kklidi-lms-curriculum-section-count {
		min-height: 24px;
		padding: 0 8px;
	}

	.kklidi-lms-curriculum-lesson-link {
		align-items: flex-start;
		flex-direction: column;
		gap: 10px;
	}

	.kklidi-lms-curriculum-lesson-meta {
		width: 100%;
		justify-content: space-between;
	}

	.kklidi-lms-stage {
		padding: var(--kklidi-lms-space-md, 18px) var(--kklidi-lms-mobile-edge, 16px) var(--kklidi-lms-mobile-stage-bottom, 28px);
	}

	.kklidi-lms-stage > h2 {
		font-size: var(--kklidi-lms-mobile-title-size-max, 25px);
		margin-bottom: var(--kklidi-lms-space-md, 18px);
	}

	.kklidi-lms-player-focus .kklidi-lms-stage > h2,
	.kklidi-lms-player-focus .kklidi-lms-content,
	.kklidi-lms-player-focus .kklidi-lms-comments,
	.kklidi-lms-player-focus .kklidi-lms-actions {
		padding-left: var(--kklidi-lms-mobile-edge, 16px);
		padding-right: var(--kklidi-lms-mobile-edge, 16px);
	}

	.kklidi-lms-focus-topbar {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		align-items: center;
		gap: var(--kklidi-lms-mobile-edge, 16px);
		min-height: 0;
		margin-top: 0;
		padding: var(--kklidi-lms-mobile-toc-top, 18px) var(--kklidi-lms-mobile-edge, 16px) var(--kklidi-lms-mobile-edge, 16px);
	}

	.kklidi-lms-focus-nav {
		width: 100%;
		min-width: 0;
		padding-left: var(--kklidi-lms-mobile-nav-offset, 62px);
	}

	.kklidi-lms-focus-nav a {
		flex: 1 1 auto;
		width: 100%;
		min-height: var(--kklidi-lms-mobile-control-size, 44px);
		padding: 0 var(--kklidi-lms-mobile-control-x, 14px);
		border-radius: var(--kklidi-lms-radius-pill, 999px);
	}

	.kklidi-lms-focus-topbar strong {
		display: block;
		margin: 0;
		width: 100%;
		color: var(--kklidi-lms-color-text, #172b4d);
		font-size: clamp(var(--kklidi-lms-mobile-title-size-min, 20px), 5vw, var(--kklidi-lms-mobile-title-size-max, 25px));
		line-height: 1.4;
		text-align: left;
		white-space: normal;
		overflow-wrap: anywhere;
		word-break: keep-all;
	}

	.kklidi-lms-focus-brand {
		display: none;
	}

	.kklidi-lms-comments summary {
		align-items: flex-start;
		flex-direction: column;
		min-height: 58px;
		padding: 16px;
		gap: 8px;
	}

	.kklidi-lms-comments-panel {
		padding: 16px;
	}

	.kklidi-lms-comment-list .children {
		margin-left: 6px;
		padding-left: 10px;
	}

	.kklidi-lms-comment-body {
		gap: 10px;
		padding: 16px 0;
	}

	.kklidi-lms-comment-avatar,
	.kklidi-lms-comment-avatar img {
		width: 32px;
		height: 32px;
	}

	.kklidi-lms-comment-header {
		gap: 4px 8px;
	}

	.kklidi-lms-comment-actions {
		gap: 8px 10px;
	}

	.kklidi-lms-comments .form-submit .submit {
		width: 100%;
	}

	.kklidi-lms-actions {
		align-items: stretch;
		flex-direction: column;
		padding: 16px;
	}

	.kklidi-lms-actions a,
	.kklidi-lms-actions form,
	.kklidi-lms-actions button {
		width: 100%;
	}

	.kklidi-lms-actions > span:empty {
		display: none;
	}
}

