/* ==========================================================================
   LearnDash Udemy-style Single Course Layout
   ========================================================================== */

/* --- Variables --- */
:root {
	--udemy-dark: #1c1d1f;
	--udemy-dark-soft: #2d2f31;
	--udemy-purple: #5624d0;
	--udemy-purple-hover: #401b9c;
	--udemy-text: #1c1d1f;
	--udemy-text-light: #6a6f73;
	--udemy-border: #d1d7dc;
	--udemy-bg: #f7f9fa;
	--udemy-surface: #ffffff;
	--udemy-star: #e59819;
	--udemy-green: #19a463;
	--udemy-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
	--udemy-shadow-md: 0 8px 24px rgba(16, 24, 40, 0.12);
}

/* --- Wrapper reset on single course --- */
.learndash-wrapper.learndash-wrapper--course {
	max-width: none;
	padding: 0;
	background: #fff;
}

/* Hide the default LearnDash course-status bar and tab navigation
   because we rebuilt them as a sidebar card and content sections. */
.learndash-wrapper.learndash-wrapper--course .ld-course-status,
.learndash-wrapper.learndash-wrapper--course .ld-tabs .ld-tabs-navigation {
	display: none !important;
}

/* --- Hero --- */
.udemy-hero {
	background: linear-gradient(135deg, var(--udemy-dark) 0%, var(--udemy-dark-soft) 100%);
	color: #fff;
	padding: 56px 0 86px;
}

.udemy-hero__container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}

.udemy-hero__content {
	max-width: 700px;
}

.udemy-breadcrumbs {
	margin-bottom: 16px;
	font-size: 14px;
	color: #d9dcff;
}

.udemy-breadcrumbs a {
	color: #d9dcff;
	text-decoration: none;
}

.udemy-breadcrumbs a:hover {
	text-decoration: underline;
}

.udemy-breadcrumbs .ld-breadcrumbs {
	background: transparent;
	padding: 0;
	border: 0;
}

.udemy-breadcrumbs .ld-breadcrumbs-separator,
.udemy-breadcrumbs .ld-breadcrumbs-current-item {
	color: #fff;
}

.udemy-hero__title {
	font-size: 40px;
	line-height: 1.2;
	font-weight: 700;
	margin: 0 0 12px;
	color: #fff;
}

.udemy-hero__subtitle {
	font-size: 19px;
	line-height: 1.4;
	color: #f3f4f6;
	margin: 0 0 16px;
}

.udemy-hero__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
	font-size: 14px;
	margin-bottom: 12px;
}

.udemy-meta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.udemy-meta--rating .udemy-meta__value {
	color: #f3ca8c;
	font-weight: 700;
}

.udemy-meta__stars {
	color: var(--udemy-star);
	letter-spacing: -2px;
}

.udemy-meta__count {
	color: #d9dcff;
	text-decoration: underline;
}

.udemy-meta--updated,
.udemy-meta--students,
.udemy-meta--language,
.udemy-meta--lessons {
	color: #f7f9fa;
}

.udemy-hero__author {
	font-size: 14px;
	margin-bottom: 16px;
}

.udemy-hero__author a {
	color: #c0c4fc;
	text-decoration: underline;
	font-weight: 600;
}

.udemy-hero__progress {
	margin-top: 16px;
}

.udemy-hero__progress .ld-progress {
	background: rgba(255, 255, 255, 0.2);
	border-radius: 999px;
}

.udemy-hero__progress .ld-progress-bar {
	background: var(--udemy-purple);
	border-radius: 999px;
}

.udemy-hero__progress .ld-progress-stats {
	color: #fff;
}

/* Static overlap section between hero and content */
.udemy-static-overlap {
	position: relative;
	z-index: 14;
	margin-top: -42px;
	margin-bottom: -24px;
}

.udemy-static-overlap__container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}

.udemy-static-overlap__card {
	display: grid;
	grid-template-columns: 96px minmax(160px, 1fr) minmax(160px, 1fr);
	align-items: stretch;
	background: #fff;
	border: 1px solid var(--udemy-border);
	border-radius: 14px;
	overflow: clip;
	box-shadow: var(--udemy-shadow-md);
	max-width: 620px;
	width: calc(100% - 420px);
	min-width: 520px;
	margin-right: auto;
}

.udemy-static-overlap__premium {
	background: linear-gradient(180deg, #5b2abf 0%, #5624d0 100%);
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 8px;
}

.udemy-static-overlap__premium-icon {
	font-size: 14px;
	line-height: 1;
}

.udemy-static-overlap__premium-icon svg {
	width: 17px;
	height: 17px;
	display: block;
	fill: currentColor;
}

.udemy-static-overlap__premium-text {
	font-size: 16px;
	font-weight: 700;
}

.udemy-static-overlap__message,
.udemy-static-overlap__metric {
	padding: 12px 14px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.udemy-static-overlap__message {
	gap: 6px;
}

.udemy-static-overlap__line {
	margin: 0;
	font-size: 14px;
	line-height: 1.25;
	color: var(--udemy-text);
}

.udemy-static-overlap__link {
	font-size: 14px;
	line-height: 1.3;
	color: var(--udemy-purple);
	text-decoration: underline;
}

.udemy-static-overlap__metric {
	text-align: center;
	border-left: 1px solid #eceff3;
	gap: 4px;
}

.udemy-static-overlap__metric--learners {
	justify-content: center;
	align-items: center;
	text-align: center;
}

.udemy-static-overlap__metric-value {
	font-size: 20px;
	line-height: 1;
	font-weight: 700;
	color: #222;
}

.udemy-static-overlap__stars {
	font-size: 12px;
	line-height: 1;
	letter-spacing: 1px;
	color: #f4b420;
}

.udemy-static-overlap__sub {
	font-size: 12px;
	line-height: 1.2;
	color: #6d7380;
}

.udemy-static-overlap__icon {
	font-size: 14px;
	line-height: 1;
	color: #2e3342;
}

.udemy-static-overlap__icon svg {
	width: 22px;
	height: 22px;
	display: block;
	fill: currentColor;
}

.udemy-static-overlap + .udemy-layout {
	padding-top: 56px;
}

/* --- Layout --- */
.udemy-layout {
	padding: 32px 0 72px;
	background: linear-gradient(180deg, #fff 0%, #fbfbfd 100%);
}

.udemy-layout__container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
	display: flex;
	gap: 44px;
	align-items: flex-start;
	flex-direction: row-reverse;
}

.udemy-main {
	flex: 1 1 0;
	min-width: 0;
}

.udemy-sidebar {
	flex: 0 0 340px;
	position: sticky;
	top: 24px;
	align-self: flex-start;
	margin-top: -250px;
	z-index: 10;
}

.udemy-sidebar__inner {
	position: static;
	box-shadow: var(--udemy-shadow-md);
	border: 1px solid var(--udemy-border);
	background: var(--udemy-surface);
	border-radius: 12px;
	overflow: hidden;
}

/* --- Sidebar card --- */
.udemy-sidebar-card__media {
	position: relative;
	background: #000;
}

.udemy-sidebar-card__media img,
.udemy-sidebar-card__media iframe,
.udemy-sidebar-card__media video {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.udemy-video-wrapper {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	background: #000;
}

.udemy-video-wrapper iframe,
.udemy-video-wrapper video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: auto;
}

.udemy-sidebar-card__body {
	padding: 22px;
}

.udemy-sidebar-card__status {
	margin-bottom: 16px;
}

.udemy-sidebar-card__status .ld-progress {
	margin-bottom: 12px;
}

.udemy-sidebar-card__status .ld-status {
	font-size: 12px;
	padding: 4px 8px;
}

.udemy-sidebar-card__price {
	font-size: 34px;
	font-weight: 700;
	color: var(--udemy-text);
	margin-bottom: 16px;
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.udemy-price__recurring {
	font-size: 16px;
	font-weight: 400;
	color: var(--udemy-text-light);
}

.udemy-price__free {
	color: var(--udemy-green);
}

.udemy-price__closed {
	color: var(--udemy-text-light);
}

.udemy-sidebar-card__action {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 12px;
}

/* Defensive reset for LearnDash/Elementor wrappers around action buttons. */
.udemy-sidebar-card__action > * {
	margin: 0 !important;
}

.udemy-sidebar-card__action > * + * {
	margin-top: 0 !important;
}

/* Force any LearnDash / WooCommerce button in the sidebar to full-width purple. */
.udemy-sidebar-card__action .ld-button,
.udemy-sidebar-card__action input[type="submit"],
.udemy-sidebar-card__action .btn-join,
.udemy-sidebar-card__action .btn-pricing,
.udemy-sidebar-card__action .woocommerce a.button,
.udemy-sidebar-card__action .woocommerce button.button,
.udemy-sidebar-card__action a.udemy-sidebar-login-btn,
.udemy-sidebar-card__action .udemy-button {
	display: block !important;
	width: 100%;
	text-align: center;
	justify-content: center;
	background-color: var(--udemy-purple) !important;
	border-color: var(--udemy-purple) !important;
	color: #fff !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	padding: 14px 16px !important;
	border-radius: 8px !important;
	transition: background 0.2s ease;
	box-sizing: border-box;
}

.udemy-sidebar-card__action .ld-button:hover,
.udemy-sidebar-card__action input[type="submit"]:hover,
.udemy-sidebar-card__action .btn-join:hover,
.udemy-sidebar-card__action .btn-pricing:hover,
.udemy-sidebar-card__action .woocommerce a.button:hover,
.udemy-sidebar-card__action .woocommerce button.button:hover,
.udemy-sidebar-card__action a.udemy-sidebar-login-btn:hover,
.udemy-sidebar-card__action .udemy-button:hover {
	background-color: var(--udemy-purple-hover) !important;
	border-color: var(--udemy-purple-hover) !important;
}

.udemy-sidebar-card__guarantee {
	font-size: 12px;
	text-align: center;
	color: var(--udemy-text-light);
	margin: 0 0 20px;
}

.udemy-closed-message {
	display: block;
	font-size: 14px;
	color: var(--udemy-text-light);
	text-align: center;
}

.udemy-login-or {
	display: block;
	font-size: 14px;
	text-align: center;
	margin-top: 12px;
	color: var(--udemy-text);
}

.udemy-login-text {
	color: var(--udemy-purple);
	text-decoration: underline;
	font-weight: 700;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font-size: inherit;
}

.udemy-sidebar-card__includes h3 {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 12px;
	color: var(--udemy-text);
}

.udemy-sidebar-card__includes ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.udemy-sidebar-card__includes li {
	position: relative;
	padding-left: 30px;
	margin-bottom: 10px;
	font-size: 14px;
	color: var(--udemy-text);
}

.udemy-sidebar-card__includes li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	color: var(--udemy-text-light);
}

/* --- Main sections --- */
.udemy-section {
	margin-bottom: 36px;
}

.udemy-section__title {
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 18px;
	color: var(--udemy-text);
}

.udemy-section__body {
	font-size: 16px;
	line-height: 1.6;
	color: var(--udemy-text);
}

.udemy-section__body p {
	margin: 0 0 16px;
}

.udemy-section__body p:last-child {
	margin-bottom: 0;
}

.udemy-section__body img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 8px;
	margin: 12px 0;
}

.udemy-section__body figure {
	max-width: 100%;
	margin: 16px 0;
}

.udemy-section__body iframe,
.udemy-section__body video {
	max-width: 100%;
	width: 100%;
	height: auto;
	border: 0;
	border-radius: 8px;
}

.udemy-description--top {
	background: #fff;
	border: 1px solid var(--udemy-border);
	border-radius: 10px;
	box-shadow: var(--udemy-shadow-sm);
	padding: 24px;
}

.udemy-related-courses__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.udemy-related-card {
	background: #fff;
	border: 1px solid var(--udemy-border);
	border-radius: 10px;
	overflow: hidden;
	box-shadow: var(--udemy-shadow-sm);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.udemy-related-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--udemy-shadow-md);
}

.udemy-related-card__image-link {
	display: block;
	background: #f1f3f6;
}

.udemy-related-card__image {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	object-fit: cover;
}

.udemy-related-card__image--placeholder {
	background: linear-gradient(135deg, #f3f4f8 0%, #e6e9f1 100%);
}

.udemy-related-card__body {
	padding: 12px 14px 14px;
}

.udemy-related-card__title {
	margin: 0;
	font-size: 15px;
	line-height: 1.35;
	font-weight: 700;
}

.udemy-related-card__title a {
	color: var(--udemy-text);
	text-decoration: none;
}

.udemy-related-card__title a:hover {
	color: var(--udemy-purple);
	text-decoration: underline;
}

.udemy-related-card__badges {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
	flex-wrap: wrap;
}

.udemy-related-card__badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 8px;
	font-size: 12px;
	line-height: 1;
	font-weight: 700;
	border-radius: 999px;
	border: 1px solid transparent;
}

.udemy-related-card__badge--price {
	color: #3d216e;
	background: #f3eeff;
	border-color: #ddd0ff;
}

.udemy-related-card__badge--rating {
	color: #7a4b00;
	background: #fff6dd;
	border-color: #f3dd9d;
}

.udemy-related-card__badge-star {
	color: #d79600;
	font-size: 11px;
}

.udemy-related-card__badge-count {
	font-weight: 600;
	opacity: 0.8;
}

/* What you'll learn */
.udemy-what-youll-learn {
	border: 1px solid var(--udemy-border);
	padding: 24px;
	background: #fff;
	border-radius: 10px;
	box-shadow: var(--udemy-shadow-sm);
}

.udemy-checklist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px 24px;
}

.udemy-checklist li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 14px;
	line-height: 1.4;
}

.udemy-checklist__icon {
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--udemy-text-light);
	font-weight: 700;
}

/* Course content */
.udemy-course-content .udemy-section__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
	gap: 16px;
	flex-wrap: wrap;
}

.udemy-course-content .udemy-section__title {
	margin-bottom: 0;
	flex: 1 1 auto;
	min-width: 0;
}

.udemy-course-content .udemy-expand-all {
	border-radius: 999px !important;
	font-size: 14px !important;
	padding: 8px 14px !important;
	background: #fff !important;
	color: var(--udemy-text) !important;
	border: 1px solid var(--udemy-text) !important;
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: max-content !important;
	white-space: nowrap !important;
	margin-left: auto;
	align-self: center;
}

.udemy-course-content .udemy-expand-all:hover {
	background: var(--udemy-bg) !important;
}

/* LearnDash listing overrides */
.udemy-course-content .ld-item-list {
	border: 1px solid var(--udemy-border);
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: var(--udemy-shadow-sm);
}

.udemy-course-content .ld-lesson-list .ld-section-heading {
	display: none;
}

.udemy-course-content .ld-item-list-item {
	border-bottom: 1px solid var(--udemy-border);
}

.udemy-course-content .ld-item-list-item:hover {
	background: #fcfcfd;
}

.udemy-course-content .ld-item-list-item:last-child {
	border-bottom: 0;
}

.udemy-course-content .ld-item-list-item .ld-item-title {
	font-weight: 700;
	color: var(--udemy-text);
}

.udemy-course-content .ld-item-list-item .ld-item-details {
	color: var(--udemy-text-light);
	font-size: 14px;
}

.udemy-course-content .ld-item-list-item-preview {
	color: var(--udemy-purple);
}

.udemy-course-content .ld-table-list {
	border: 0;
	background: var(--udemy-bg);
}

.udemy-course-content .ld-table-list-item {
	border-bottom: 1px solid var(--udemy-border);
}

.udemy-course-content .ld-table-list-item:last-child {
	border-bottom: 0;
}

/* Section collapse: each section's lessons/topics/quizzes live inside a
   single .udemy-section-body wrapper. LearnDash's native JS
   (ldToggleExpandableElement) animates this wrapper's max-height and
   toggles [hidden] on it directly, so we just need it to clip overflow
   and transition smoothly. */
.udemy-course-content .udemy-section-body {
	overflow: hidden;
	transition: max-height 0.3s ease;
}

.udemy-course-content .udemy-section-heading__toggle .ld-icon-arrow-down {
	transition: transform 0.2s ease;
}

.udemy-course-content .udemy-section-heading__toggle[aria-expanded="true"] .ld-icon-arrow-down {
	transform: rotate(180deg);
}

/* Lesson row alignment */
.udemy-course-content .ld-item-list-item-preview {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 16px 18px !important;
	gap: 16px;
}

.udemy-course-content .ld-item-list-item-preview .ld-tooltip {
	flex: 1 1 auto;
	min-width: 0;
}

.udemy-course-content .ld-item-list-item-preview .ld-item-name {
	display: flex !important;
	align-items: center !important;
	gap: 12px;
}

.udemy-course-content .ld-item-list-item-preview .ld-status-icon {
	flex-shrink: 0;
}

.udemy-course-content .ld-item-list-item-preview .ld-item-title {
	font-weight: 600 !important;
	font-size: 15px;
	line-height: 1.4;
}

.udemy-course-content .ld-item-list-item-preview .ld-item-components {
	font-weight: 400;
	color: var(--udemy-text-light);
}

.udemy-course-content .ld-item-list-item-preview .ld-item-details {
	flex: 0 0 auto;
	margin-left: 0 !important;
}

.udemy-course-content .ld-item-list-item-preview .ld-expand-button {
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	color: var(--udemy-text) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
}

.udemy-course-content .ld-item-list-item-preview .ld-expand-button .ld-icon {
	background: transparent !important;
	color: var(--udemy-purple) !important;
}

/* Section headings */
.udemy-course-content .ld-item-list-section-heading {
	background: var(--udemy-bg);
	padding: 14px 18px;
	border-bottom: 1px solid var(--udemy-border);
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

.udemy-course-content .ld-item-list-section-heading .ld-lesson-section-heading {
	font-size: 17px;
	font-weight: 700;
	color: var(--udemy-text);
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
}

.udemy-course-content .udemy-section-heading__toggle {
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	color: var(--udemy-text) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	display: inline-flex;
	align-items: center;
	gap: 2px;
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: max-content !important;
	white-space: nowrap !important;
	margin-left: auto;
}

.udemy-course-content .udemy-section-heading__toggle .ld-icon {
	background: transparent !important;
	color: var(--udemy-purple) !important;
}

/* Topics table */
.udemy-course-content .ld-table-list {
	background: #fff;
	border: 0;
}

.udemy-course-content .ld-table-list-header {
	display: none;
}

.udemy-course-content .ld-table-list-item {
	padding: 0;
}

.udemy-course-content .ld-table-list-item-preview {
	display: flex !important;
	align-items: center !important;
	gap: 12px;
	padding: 12px 20px 12px 48px !important;
}

.udemy-course-content .ld-table-list-item-preview .ld-status-icon {
	flex-shrink: 0;
}

.udemy-course-content .ld-table-list-item-preview .ld-topic-title {
	font-size: 14px;
	color: var(--udemy-text);
}

/* Instructor */
.udemy-instructor__card {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	background: #fff;
	border: 1px solid var(--udemy-border);
	border-radius: 10px;
	padding: 20px;
	box-shadow: var(--udemy-shadow-sm);
}

.udemy-instructor__avatar {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
}

.udemy-instructor__info {
	flex: 1 1 auto;
}

.udemy-instructor__name {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 4px;
}

.udemy-instructor__name a {
	color: var(--udemy-purple);
	text-decoration: none;
}

.udemy-instructor__role {
	font-size: 14px;
	color: var(--udemy-text-light);
	margin: 0 0 12px;
}

.udemy-instructor__bio {
	font-size: 15px;
	line-height: 1.6;
	color: var(--udemy-text);
}

/* Responsive */
@media (max-width: 980px) {
	.udemy-related-courses__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.udemy-static-overlap__card {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		grid-template-columns: 112px 1fr 1fr;
		grid-template-areas: "premium rating learners";
	}

	.udemy-static-overlap__premium {
		grid-area: premium;
	}

	.udemy-static-overlap__metric {
		padding: 14px 12px;
		border-top: 0;
	}

	.udemy-static-overlap__metric:first-of-type {
		grid-area: rating;
		border-left: 1px solid #eceff3;
	}

	.udemy-static-overlap__metric--learners {
		grid-area: learners;
	}

	.udemy-static-overlap__premium-text {
		font-size: 16px;
	}

	.udemy-static-overlap__line {
		font-size: 14px;
	}

	.udemy-static-overlap__link {
		font-size: 14px;
	}

	.udemy-static-overlap__metric-value {
		font-size: 20px;
	}

	.udemy-static-overlap__sub {
		font-size: 12px;
	}

	.udemy-static-overlap {
		margin-top: -48px;
		margin-bottom: -18px;
	}

	.udemy-static-overlap + .udemy-layout {
		padding-top: 46px;
	}

	.udemy-course-content .ld-item-list-section-heading {
		gap: 10px;
	}

	.udemy-course-content .ld-item-list-section-heading .ld-lesson-section-heading {
		font-size: 16px;
		line-height: 1.35;
	}

	.udemy-course-content .udemy-section-heading__toggle {
		font-size: 13px !important;
	}

	.udemy-layout__container {
		flex-direction: column;
		gap: 32px;
	}

	.udemy-sidebar {
		flex: 1 1 auto;
		width: 100%;
		position: static;
		top: auto;
		margin-top: 0;
		order: -1;
	}

	.udemy-sidebar__inner {
		position: static;
	}

	.udemy-main {
		width: 100%;
	}

	.udemy-hero__title {
		font-size: 32px;
	}

	.udemy-hero__subtitle {
		font-size: 17px;
	}
}

@media (max-width: 600px) {
	.udemy-related-courses__grid {
		grid-template-columns: 1fr;
	}

	.udemy-static-overlap__card {
		grid-template-columns: 1fr;
		grid-template-areas:
			"premium"
			"rating"
			"learners";
	}

	.udemy-static-overlap__premium {
		flex-direction: row;
		gap: 10px;
		padding: 14px;
	}

	.udemy-static-overlap__metric {
		border-left: 0;
		border-top: 1px solid #eceff3;
	}

	.udemy-static-overlap__line {
		font-size: 13px;
	}

	.udemy-static-overlap__link {
		font-size: 13px;
	}

	.udemy-static-overlap__metric-value {
		font-size: 18px;
	}

	.udemy-static-overlap__sub {
		font-size: 11px;
	}

	.udemy-static-overlap {
		margin-top: -40px;
		margin-bottom: -8px;
	}

	.udemy-static-overlap__container {
		padding: 0 14px;
	}

	.udemy-static-overlap__card {
		border-radius: 10px;
	}

	.udemy-static-overlap + .udemy-layout {
		padding-top: 34px;
	}

	.udemy-hero {
		padding: 42px 0 54px;
	}

	.udemy-hero__title {
		font-size: 28px;
	}

	.udemy-sidebar__inner {
		border-radius: 10px;
	}

	.udemy-checklist {
		grid-template-columns: 1fr;
	}

	.udemy-course-content .udemy-section__header {
		flex-direction: column;
		align-items: flex-start;
	}

	.udemy-course-content .udemy-expand-all {
		margin-left: 0;
		align-self: flex-start;
	}

	.udemy-course-content .ld-item-list-item-preview {
		padding: 14px 16px !important;
	}

	.udemy-course-content .ld-item-list-section-heading {
		flex-wrap: wrap;
		gap: 8px 12px;
	}

	.udemy-course-content .ld-item-list-section-heading .ld-lesson-section-heading {
		font-size: 16px;
		line-height: 1.35;
		flex: 1 1 100%;
	}

	.udemy-course-content .udemy-section-heading__toggle {
		margin-left: 0;
		font-size: 13px !important;
	}

	.udemy-course-content .ld-table-list-item-preview {
		padding-left: 32px !important;
	}
}

/* Description & Materials */
.udemy-description-materials .udemy-section {
	border-bottom: 1px solid var(--udemy-border);
	padding-bottom: 32px;
	margin-bottom: 32px;
	background: #fff;
	border-radius: 10px;
	padding: 24px;
	box-shadow: var(--udemy-shadow-sm);
}

.udemy-description-materials .udemy-section:last-child {
	border-bottom: 0;
	padding-bottom: 24px;
	margin-bottom: 0;
}

/* Requirements */
.udemy-requirements {
	border-top: 1px solid var(--udemy-border);
	padding-top: 32px;
}