/* Mehra LMS - base styles. Override freely in your theme. */

/* Theme preset variables — overridden per-preset via wp_add_inline_style
   (see Mehra_LMS_Theme_Settings::css_overrides()). These are the Tutor
   Starter defaults, used if no preset has been selected yet. */
:root {
	--mlms-primary: #1e40af;
	--mlms-primary-hover: #1e3a8a;
	--mlms-success: #1a7f37;
	--mlms-danger: #b32d2e;
	--mlms-radius: 6px;
	--mlms-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--mlms-card-bg: #ffffff;
	--mlms-card-border: #e2e2e2;
	--mlms-page-bg: transparent;
	--mlms-text: #1a1a1a;
	--mlms-text-muted: #666666;
}

.mlms-course-grid,
.mlms-single-course,
.mlms-dashboard,
.mlms-otp-login,
.mlms-social-login,
.mlms-2fa-panel,
.mlms-sessions-panel,
.mlms-live-hub,
.mlms-event-calendar {
	font-family: var(--mlms-font);
	color: var(--mlms-text);
	background: var(--mlms-page-bg);
}

.mlms-course-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 24px;
	margin: 24px 0;
}

.mlms-course-card {
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	padding: 16px;
	background: var(--mlms-card-bg);
}

.mlms-course-card img {
	width: 100%;
	height: auto;
	border-radius: calc(var(--mlms-radius) - 2px);
	margin-bottom: 10px;
}

.mlms-course-card h3 {
	margin: 6px 0;
	font-size: 18px;
}

.mlms-course-meta {
	display: flex;

	justify-content: space-between;
	font-size: 13px;
	color: var(--mlms-text-muted);
	margin-bottom: 10px;
}

.mlms-price {
	font-weight: 700;
	color: var(--mlms-success);
}

.mlms-btn,
.mlms-btn-secondary {
	display: inline-block;
	padding: 10px 18px;
	border-radius: var(--mlms-radius);
	text-decoration: none;
	font-weight: 600;
	cursor: pointer;
	border: none;
	font-family: var(--mlms-font);
}

.mlms-btn {
	background: var(--mlms-primary);
	color: #fff;
}

.mlms-btn:hover {
	background: var(--mlms-primary-hover);
	color: #fff;
}

.mlms-btn-done {
	background: var(--mlms-success);
}

.mlms-btn-secondary {
	background: #f1f1f1;
	color: #222;
}

.mlms-single-course {
	max-width: 900px;
	margin: 0 auto;
}

.mlms-course-sidebar {
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	padding: 16px;
	margin: 20px 0;
	background: var(--mlms-card-bg);
}

.mlms-price-tag {
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 10px;
	color: var(--mlms-primary);
}

.mlms-progress-bar {
	background: #e2e2e2;
	border-radius: 20px;
	height: 14px;
	overflow: hidden;
	margin-bottom: 6px;
}

.mlms-progress-bar-sm {
	height: 8px;
	max-width: 160px;
}

.mlms-progress-fill {
	background: var(--mlms-success);
	height: 100%;
}

.mlms-curriculum-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mlms-curriculum-item {
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	padding: 10px 14px;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.mlms-curriculum-item.mlms-done {
	background: color-mix(in srgb, var(--mlms-success) 12%, var(--mlms-card-bg));
}

.mlms-locked-item {
	color: var(--mlms-text-muted);
}

.mlms-preview-tag {
	color: var(--mlms-primary);
	font-size: 12px;
}

.mlms-check {
	margin-left: auto;
	color: var(--mlms-success);
	font-weight: 700;
}

.mlms-video-wrap video,
.mlms-video-wrap iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: var(--mlms-radius);
	margin-bottom: 16px;
}

.mlms-locked {
	background: #fff8e6;
	border: 1px solid #f0d78c;
	border-radius: var(--mlms-radius);
	padding: 20px;
	text-align: center;
	color: #4a3b0a;
}

.mlms-quiz-question {
	border-bottom: 1px solid var(--mlms-card-border);
	padding: 12px 0;
}

.mlms-quiz-option {
	display: block;
	margin: 4px 0;
}

.mlms-quiz-result {
	margin-top: 14px;
	padding: 12px;
	border-radius: var(--mlms-radius);
}

.mlms-quiz-result.pass {
	background: #e9f9ee;
	color: #1a7f37;
}

.mlms-quiz-result.fail {
	background: #fdecea;
	color: #b32d2e;
}

.mlms-dashboard-table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 16px;
}

.mlms-dashboard-table th,
.mlms-dashboard-table td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid #eee;
}

.mlms-notice {
	color: #b32d2e;
	font-weight: 600;
}

.mlms-checkout-buttons {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.mlms-pay-stripe {
	background: #635bff;
}

.mlms-pay-razorpay {
	background: #02042b;
}

.mlms-coupon-row {
	display: flex;
	gap: 6px;
	margin-bottom: 6px;
}

.mlms-coupon-input {
	flex: 1;
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 6px;
}

.mlms-coupon-message {
	font-size: 13px;
	margin: 0 0 10px;
}

.mlms-cert-earned {
	background: #fff8e6;
	border: 1px solid #f0d78c;
	border-radius: 8px;
	padding: 16px;
	margin-top: 16px;
	text-align: center;
}

.mlms-puzzle-list {
	list-style: none;
	margin: 0 0 10px;
	padding: 0;
	max-width: 400px;
}

.mlms-puzzle-item {
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	padding: 10px 14px;
	margin-bottom: 6px;
	cursor: grab;
}

.mlms-puzzle-item:active {
	cursor: grabbing;
}

.mlms-graph-svg {
	max-width: 100%;
}

.mlms-scale-input {
	accent-color: #1e40af;
}

.mlms-social-login {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 16px 0;
}

.mlms-social-btn {
	text-align: center;
}

.mlms-otp-login {
	max-width: 340px;
}

.mlms-otp-tabs {
	display: flex;
	gap: 6px;
	margin-bottom: 10px;
}

.mlms-otp-tab {
	flex: 1;
	padding: 8px;
	border: 1px solid #ccc;
	background: #f4f4f4;
	border-radius: 6px;
	cursor: pointer;
}

.mlms-otp-tab.active {
	background: #1e40af;
	color: #fff;
	border-color: #1e40af;
}

.mlms-otp-identifier,
.mlms-otp-code {
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 6px;
	margin-bottom: 8px;
	width: 100%;
}

.mlms-otp-message,
.mlms-sessions-message {
	font-size: 13px;
	margin-top: 8px;
}

.mlms-consent-row {
	margin: 10px 0;
	font-size: 13px;
}

.mlms-course-filters {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin: 16px 0 20px;
}

.mlms-course-filters select {
	padding: 8px 12px;
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	background: var(--mlms-card-bg);
	color: var(--mlms-text);
	font-family: var(--mlms-font);
}

.mlms-level-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	padding: 2px 8px;
	border-radius: 20px;
	margin: 4px 0;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.mlms-level-beginner {
	background: #e6f4ea;
	color: #1a7f37;
}

.mlms-level-intermediate {
	background: #fff4e0;
	color: #b45309;
}

.mlms-level-advanced {
	background: #fde8e8;
	color: #b32d2e;
}

.mlms-course-pager {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin-top: 24px;
}

.mlms-no-results {
	grid-column: 1 / -1;
	text-align: center;
	color: var(--mlms-text-muted);
	padding: 30px 0;
}

.mlms-2fa-panel,
.mlms-sessions-panel {
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	padding: 16px;
	margin: 20px 0;
	background: var(--mlms-card-bg);
}

.mlms-manual-payment {
	background: #f7f7f7;
	border: 1px solid #ddd;
	border-radius: var(--mlms-radius);
	padding: 14px;
	margin-top: 10px;
}

.mlms-live-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	padding: 12px 16px;
	margin-bottom: 10px;
	background: var(--mlms-card-bg);
}

.mlms-live-row-active {
	border-color: var(--mlms-danger);
	background: #fdf3f3;
}

.mlms-notifications-list {
	margin-bottom: 20px;
}

.mlms-notification {
	border: 1px solid var(--mlms-card-border);
	border-radius: var(--mlms-radius);
	padding: 10px 14px;
	margin-bottom: 8px;
	background: var(--mlms-card-bg);
	cursor: pointer;
}

.mlms-notification-unread {
	background: #eef4ff;
	border-color: #c7d9fb;
}

.mlms-notification p {
	margin: 4px 0;
}