/**
 * Quad A Academy — frontend styling.
 * Dark cinematic surfaces, exact logo orange (#FF8C00).
 */

:root {
	/* ---- Colour tokens ---- */
	--qa-orange: #FF8C00;
	--qa-orange-deep: #E07B00;
	--qa-black: #0E0E10;
	--qa-charcoal: #1A1A1E;
	/* Codex-style lifted card: subtle white-overlay gradient over a dark panel. */
	--qa-panel: #18171d;
	--qa-line: rgba(255, 255, 255, .12);
	--qa-surface: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)), var(--qa-panel);
	--qa-graphite: #2A2A30;
	--qa-mist: #B9BCC4;          /* body text on dark — 7.0:1 on --qa-black (AAA) */
	--qa-white: #FFFFFF;
	--qa-success: #3DBE7B;
	--qa-danger: #E4572E;

	/* ---- Radius scale ---- */
	--qa-radius-sm: 8px;
	--qa-radius: 14px;          /* default card radius (kept for back-compat) */
	--qa-radius-pill: 999px;

	/* ---- Spacing scale (4px base; px so the 10px-root Pivot theme can't shrink it) ---- */
	--qa-space-1: 4px;
	--qa-space-2: 8px;
	--qa-space-3: 12px;
	--qa-space-4: 16px;
	--qa-space-5: 24px;
	--qa-space-6: 32px;
	--qa-space-7: 48px;
	--qa-space-8: 64px;

	/* ---- Typography scale (px — see [[quada-theme-10px-root-font]] gotcha) ---- */
	--qa-font-display: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
	--qa-font-body: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
	--qa-fs-xs: 12px;
	--qa-fs-sm: 14px;
	--qa-fs-base: 16px;
	--qa-fs-lg: 19px;
	--qa-fs-xl: 24px;
	--qa-fs-2xl: 30px;
	--qa-lh-tight: 1.25;
	--qa-lh-body: 1.6;

	/* ---- Interaction / a11y tokens ---- */
	--qa-touch-min: 44px;       /* WCAG 2.5.5 minimum touch target */
	--qa-focus-ring: 0 0 0 3px rgba(255,140,0,.55);
	--qa-focus-outline: 2px solid var(--qa-orange);

	/* ---- Responsive container ---- */
	--qa-container: 1180px;
}

/* ---------- Buttons ---------- */
.quada-btn {
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--qa-orange);
	color: var(--qa-black) !important;
	font-weight: 700;
	line-height: 1;
	text-decoration: none !important;
	border: none;
	border-radius: 999px;
	padding: 13px 28px;
	font-size: 15px;
	letter-spacing: 0.02em;
	text-align: center;
	cursor: pointer;
	transition: background .15s ease, transform .15s ease;
}
/* Sliding shine sweep on every button hover (left -> right) */
.quada-btn::after {
	content: '';
	position: absolute;
	top: 0;
	left: -75%;
	width: 60%;
	height: 100%;
	pointer-events: none;
	transform: skewX(-20deg);
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
	transition: left .6s ease;
}
.quada-btn:hover::after { left: 130%; }
.quada-btn:hover { background: var(--qa-orange-deep); transform: translateY(-1px); }
.quada-btn--block { display: flex; width: 100%; text-align: center; }
.quada-btn--lg { padding: 16px 40px; font-size: 17px; }
.quada-btn--ghost {
	background: transparent;
	color: var(--qa-orange) !important;
	border: 1.5px solid var(--qa-orange);
}
.quada-btn--ghost:hover { background: var(--qa-orange); color: var(--qa-black) !important; }

/* ---------- Cards ---------- */
.quada-card {
	background: var(--qa-charcoal);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 24px;
	color: var(--qa-white);
}
.quada-card--notice { text-align: center; max-width: 520px; margin: 32px auto; }
.quada-card--notice p { color: var(--qa-mist); margin-bottom: 16px; }
.quada-card--success { border-color: var(--qa-success); }
.quada-card h3, .quada-card h4 { color: var(--qa-white); margin-top: 0; }
.quada-empty { color: var(--qa-mist); font-style: italic; text-align: center; padding: 24px; }

/* ---------- Alerts ---------- */
.quada-alert {
	border-radius: 8px;
	padding: 10px 14px;
	font-size: 14px;
	margin-bottom: 14px;
}
.quada-alert--error { background: rgba(228, 87, 46, .12); color: #ff9c80; border: 1px solid rgba(228, 87, 46, .4); }
.quada-alert--success { background: rgba(61, 190, 123, .12); color: #7fe0ad; border: 1px solid rgba(61, 190, 123, .4); }

/* ---------- Auth / Apply panels ---------- */
.quada-auth { display: flex; justify-content: center; padding: 40px 16px; }
.quada-auth__panel {
	background: linear-gradient(160deg, var(--qa-black), var(--qa-charcoal));
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 40px 36px;
	width: 100%;
	max-width: 440px;
	color: var(--qa-white);
}
.quada-apply { max-width: 620px; margin: 32px auto; }
.quada-auth__logo { height: 56px; width: auto; margin-bottom: 20px; }
.quada-auth__panel h2 { color: var(--qa-white); margin: 0 0 4px; font-size: 24px; }
.quada-auth__sub { color: var(--qa-mist); font-size: 14px; margin: 0 0 22px; }
.quada-auth__panel label {
	display: block;
	color: var(--qa-mist);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-bottom: 16px;
}
.quada-auth__panel input,
.quada-auth__panel select,
.quada-auth__panel textarea {
	display: block;
	width: 100%;
	margin-top: 6px;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: 8px;
	color: var(--qa-white);
	padding: 11px 14px;
	font-size: 15px;
	box-sizing: border-box;
}
.quada-auth__panel input:focus,
.quada-auth__panel select:focus,
.quada-auth__panel textarea:focus {
	outline: 2px solid var(--qa-orange);
	outline-offset: 1px;
	border-color: var(--qa-orange);
}
.quada-auth__links { margin-top: 18px; text-align: center; font-size: 13px; color: var(--qa-mist); }
.quada-auth__links a { color: var(--qa-orange); text-decoration: none; }

/* ---------- Program catalog ---------- */
.quada-program-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
	gap: 22px;
	margin: 28px 0;
}
.quada-program-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; transition: border-color .15s ease, transform .15s ease; }
.quada-program-card:hover { border-color: var(--qa-orange); transform: translateY(-3px); }
.quada-program-card__media { position: relative; display: block; aspect-ratio: 16/9; background: var(--qa-black); }
.quada-program-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.quada-program-card__placeholder { object-fit: contain !important; padding: 24px; box-sizing: border-box; }
.quada-program-card__media .quada-badge,
.quada-program-card > .quada-badge {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	/* Lift the Paid / Free / Scholarship tag off the photo (2026-07). */
	box-shadow: 0 4px 14px rgba(0, 0, 0, .55), 0 1px 3px rgba(0, 0, 0, .5);
}
.quada-program-card__body { padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.quada-program-card__type {
	color: var(--qa-orange);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	margin: 0;
}
.quada-program-card__type a { color: inherit; text-decoration: none; }
.quada-program-card__body h3 { margin: 0; font-size: 19px; line-height: 1.3; }
.quada-program-card__body h3 a { color: var(--qa-white); text-decoration: none; }
.quada-program-card__excerpt { color: var(--qa-mist); font-size: 14px; margin: 0; flex: 1; }
.quada-program-card__meta {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin: 0;
	padding: 0;
	color: var(--qa-mist);
	font-size: 13px;
}
.quada-program-card__meta a { color: var(--qa-mist); text-decoration: none; }
.quada-program-single__footer {
	margin-top: 32px;
	padding: 24px;
	background: var(--qa-charcoal);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
}

/* ---------- Badges ---------- */
.quada-badge {
	display: inline-block;
	padding: 3px 12px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.quada-badge--free { background: var(--qa-success); color: #07301c; }
.quada-badge--paid { background: var(--qa-orange); color: var(--qa-black); }
.quada-badge--scholarship { background: #b9a6f5; color: #241b4d; }
.quada-badge--progress { background: rgba(61,190,123,.15); color: var(--qa-success); }
.quada-badge--status-active { background: rgba(61,190,123,.15); color: var(--qa-success); }
.quada-badge--status-completed { background: rgba(255,140,0,.15); color: var(--qa-orange); }
.quada-badge--status-suspended { background: rgba(228,87,46,.15); color: var(--qa-danger); }

/* ---------- Dashboard ---------- */
.quada-dashboard { display: flex; flex-direction: column; gap: 20px; }
.quada-dashboard__hero {
	display: flex;
	align-items: center;
	gap: 22px;
	background: linear-gradient(135deg, var(--qa-black) 0%, var(--qa-charcoal) 60%, #241a0e 100%);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 28px 32px;
}
.quada-dashboard__logo { height: 58px; width: auto; }
.quada-dashboard__hero h2 { color: var(--qa-white); margin: 0; font-size: 24px; }
.quada-dashboard__role {
	color: var(--qa-orange);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.16em;
	margin: 6px 0 0;
}
.quada-device-notice {
	background: rgba(255, 140, 0, .08);
	border: 1px solid rgba(255, 140, 0, .35);
	border-radius: 10px;
	color: var(--qa-mist);
	font-size: 13px;
	padding: 12px 16px;
	margin: 0;
}
.quada-section-title {
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	border-bottom: 2px solid var(--qa-orange);
	display: inline-block;
	padding-bottom: 6px;
	/* Uniform, tight 12px gap between every section title and the content below
	   it. The underline is on the inline-block, so margin-bottom moves the
	   content down. NOTE: on the dashboard, titles are direct children of the
	   flex column (`.quada-dashboard`, gap:20px); a −8px bottom margin below
	   trims that 20px flex gap back to an even 12px. */
	margin: 8px 0 12px;
}
/* A section title inside a card sits closer to its own card body. */
.quada-card > .quada-section-title:first-child { margin-top: 0; }
/* The element right after a section title must not add its own top margin —
   the title's gap is the single, even spacing (grids/cards previously carried
   extra top margin, giving 34–52px). */
.quada-section-title + * { margin-top: 0 !important; }
/* Dashboard flex-column children: the 20px flex gap alone would be too big and
   uneven vs the nested titles — pull the content up so the gap is 12px too. */
.quada-dashboard > .quada-section-title { margin-bottom: -8px; }
.quada-enrollment-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
	gap: 18px;
}
.quada-enrollment-card h4 { font-size: 17px; margin-bottom: 6px; }
.quada-enrollment-card__status {
	color: var(--qa-mist);
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0 0 14px;
}
.quada-enrollment-card--completed .quada-enrollment-card__status { color: var(--qa-success); }
.quada-enrollment-card__hint { color: var(--qa-mist); font-size: 13px; }
.quada-progress {
	height: 8px;
	background: var(--qa-black);
	border-radius: 999px;
	overflow: hidden;
	margin-bottom: 6px;
}
.quada-progress__bar {
	height: 100%;
	background: linear-gradient(90deg, var(--qa-orange-deep), var(--qa-orange));
	border-radius: 999px;
	transition: width .4s ease;
}
.quada-progress__label {
	color: var(--qa-orange);
	font-size: 13px;
	font-weight: 700;
	margin: 0 0 14px;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 600px) {
	.quada-dashboard__hero { flex-direction: column; text-align: center; gap: 12px; }
	.quada-program-single__footer { flex-direction: column; align-items: stretch; text-align: center; }
}

/* ---------- Course outline ---------- */
.quada-course { display: flex; flex-direction: column; gap: 18px; margin-top: 26px; }
.quada-course__progress-strip {
	display: flex;
	align-items: center;
	gap: 16px;
	background: var(--qa-charcoal);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 18px 22px;
	flex-wrap: wrap;
}
.quada-course__progress-strip .quada-progress { flex: 1; min-width: 160px; margin: 0; }
.quada-course__progress-strip .quada-progress__label { margin: 0; white-space: nowrap; }

.quada-module {
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	overflow: hidden;
}
.quada-module--locked { opacity: .55; }
.quada-module__head {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 18px 22px;
	border-bottom: 1px solid var(--qa-graphite);
}
.quada-module__index {
	font-size: 26px;
	font-weight: 800;
	color: var(--qa-orange);
	font-variant-numeric: tabular-nums;
}
.quada-module__head h3 { margin: 0; color: var(--qa-white); font-size: 18px; }
.quada-module__head p { margin: 4px 0 0; color: var(--qa-mist); font-size: 13px; }
.quada-module__state { margin-left: auto; color: var(--qa-success); font-size: 13px; white-space: nowrap; }
.quada-module--locked .quada-module__state { color: var(--qa-mist); }

.quada-lesson-list { list-style: none; margin: 0; padding: 6px 0; }
.quada-lesson-list li { margin: 0; }
.quada-lesson-list a {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 22px;
	color: var(--qa-white);
	text-decoration: none;
	transition: background .12s ease;
}
.quada-lesson-list a:hover { background: rgba(255, 140, 0, .07); }
.quada-lesson-list__type {
	flex: 0 0 76px;
	color: var(--qa-orange);
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}
.quada-lesson-list__title { flex: 1; font-size: 15px; }
.quada-lesson-list__dur { color: var(--qa-mist); font-size: 12px; }
.quada-lesson-list__check { color: var(--qa-success); font-weight: 700; width: 18px; }
.quada-lesson-list li.is-done .quada-lesson-list__title { color: var(--qa-mist); }

/* Module inline exam row */
.quada-module-exam-row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 22px 14px;
	margin: 0 0 0;
	border-top: 1px solid var(--qa-line);
	background: rgba(255, 140, 0, 0.04);
}
.quada-module-exam-row--already_passed { background: rgba(61, 190, 123, 0.06); }
.quada-module-exam-row--module_incomplete { opacity: .7; }
.quada-module-exam-row__icon { font-size: 16px; flex: 0 0 22px; }
.quada-module-exam-row__title { flex: 1; font-size: 14px; font-weight: 600; color: var(--qa-white); }
.quada-module-exam-row__status { font-size: 12px; color: var(--qa-mist); white-space: nowrap; }
.quada-module-exam-row--already_passed .quada-module-exam-row__status { color: var(--qa-success); }
.quada-module-exam-row--module_incomplete .quada-module-exam-row__title { color: var(--qa-mist); }

/* ---------- Lesson view ---------- */
.quada-lesson {
	display: flex; flex-direction: column; gap: 18px; margin-top: 12px;
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	padding: 26px 30px;
}
.quada-lesson__back { color: var(--qa-orange); text-decoration: none; font-size: 13px; }
.quada-lesson__title { margin: 0; }
.quada-lesson__media iframe { width: 100%; aspect-ratio: 16/9; height: auto; border-radius: var(--qa-radius); }
.quada-lesson__materials { background: var(--qa-surface); border: 1px solid var(--qa-line); border-radius: var(--qa-radius); padding: 20px 24px; }
.quada-material-list { list-style: none; margin: 14px 0 0; padding: 0; }
.quada-material-list li { display: flex; align-items: center; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--qa-graphite); margin: 0; }
.quada-material-list li:last-child { border-bottom: none; }
.quada-material-list__cat {
	flex: 0 0 90px;
	color: var(--qa-orange);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.12em;
}
.quada-material-list a { color: var(--qa-white); text-decoration: none; }
.quada-material-list a:hover { color: var(--qa-orange); }
.quada-lesson__actions { padding: 8px 0 24px; }

/* ---------- Exams ---------- */
.quada-exam { max-width: 760px; margin: 24px auto; }
/* Static exam intro / result screens sit on an appropriate grey panel. */
.quada-exam:not(.quada-exam--live) {
	background: var(--qa-surface);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 26px 28px;
}
.quada-exam__desc { color: var(--qa-mist); }
.quada-exam__facts {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 14px;
	margin: 20px 0 24px;
	padding: 16px;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	color: var(--qa-mist);
}
.quada-exam__facts li {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	min-height: 72px;
	padding: 16px 14px;
	background: rgba(255, 255, 255, .035);
	border: 1px solid var(--qa-graphite);
	border-radius: 8px;
	text-align: center;
}
.quada-exam__facts span {
	color: var(--qa-mist);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	line-height: 1.3;
	text-transform: uppercase;
}
.quada-exam__facts strong {
	color: var(--qa-white);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.1;
}
.quada-exam__history { list-style: none; margin: 14px 0 0; padding: 0; }
.quada-exam__history li {
	display: flex;
	justify-content: space-between;
	gap: 14px;
	padding: 8px 0;
	border-bottom: 1px solid var(--qa-graphite);
	font-size: 14px;
	margin: 0;
}
.quada-exam__history .is-pass { color: var(--qa-success); font-weight: 700; }
.quada-exam__history .is-fail { color: var(--qa-danger); font-weight: 700; }

.quada-exam--live { max-width: 820px; margin: 24px auto; }
.quada-exam__bar {
	position: sticky;
	top: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 16px 24px;
	margin-bottom: 22px;
}
.quada-exam__bar h2 { margin: 0; color: var(--qa-white); font-size: 20px; }
.quada-exam__timer {
	font-variant-numeric: tabular-nums;
	font-weight: 800;
	font-size: 26px;
	color: var(--qa-orange);
}
.quada-exam__timer.is-critical { color: var(--qa-danger); }

.quada-exam__question {
	background: var(--qa-surface);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 20px 24px;
	margin: 0 0 16px;
}
.quada-exam__question legend {
	/* Regular weight (2026-07 request — questions read too bold). */
	font-weight: 400;
	color: var(--qa-white);
	font-size: 16px;
	padding: 0 6px;
}
.quada-exam__question legend strong,
.quada-exam__qbody strong { font-weight: 600; }
.quada-exam__qnum { color: var(--qa-orange); margin-right: 8px; font-variant-numeric: tabular-nums; }
.quada-exam__qbody { color: var(--qa-mist); font-size: 16px; line-height: 1.6; margin-bottom: 14px; }
.quada-exam__option {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 15px 20px;
	margin: 10px 0;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: 10px;
	cursor: pointer;
	color: var(--qa-white);
	font-size: 16.5px;
	font-weight: 400;
	line-height: 1.5;
	transition: border-color .12s ease;
}
.quada-exam__option:hover { border-color: var(--qa-orange); }
.quada-exam__option input { accent-color: var(--qa-orange); }

.quada-exam__result { text-align: center; }
.quada-exam__score {
	font-size: 56px;
	font-weight: 800;
	margin: 8px 0 0;
	color: var(--qa-orange);
	font-variant-numeric: tabular-nums;
}
.quada-exam__result.is-pass .quada-exam__score { color: var(--qa-success); }
.quada-exam__result.is-fail .quada-exam__score { color: var(--qa-danger); }
.quada-exam__scoredetail { color: var(--qa-mist); margin-top: 2px; }
.quada-course__exams { margin-top: 28px; }
.quada-exam-card .quada-enrollment-card__status {
	display: flex;
	align-items: center;
	gap: 8px;
	line-height: 1.35;
	min-height: 18px;
}
.quada-exam-card__status-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex: 0 0 10px;
	background: var(--qa-orange);
	box-shadow: 0 0 0 3px rgba(255, 140, 0, .12);
}
.quada-exam-card--already_passed .quada-exam-card__status-dot {
	background: var(--qa-success);
	box-shadow: 0 0 0 3px rgba(61, 190, 123, .14);
}
.quada-exam-card--already_taken .quada-exam-card__status-dot,
.quada-exam-card--course_incomplete .quada-exam-card__status-dot,
.quada-exam-card--module_incomplete .quada-exam-card__status-dot {
	background: var(--qa-danger);
	box-shadow: 0 0 0 3px rgba(229, 62, 62, .12);
}
.quada-exam-card--retake_requested .quada-exam-card__status-dot {
	background: #f4b740;
	box-shadow: 0 0 0 3px rgba(244, 183, 64, .14);
}

/* ---------- Brand typography ---------- */
.quada-dashboard, .quada-auth__panel, .quada-card, .quada-exam, .quada-course, .quada-lesson {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.quada-dashboard h2, .quada-dashboard h3, .quada-dashboard h4,
.quada-auth__panel h2, .quada-card h3, .quada-card h4,
.quada-exam h2, .quada-lesson__title, .quada-module__head h3 {
	font-family: 'Poppins', 'Inter', sans-serif;
}

/* ---------- Glow + gradient polish ---------- */
.quada-glow { position: relative; overflow: hidden; }
.quada-glow::after {
	content: '';
	position: absolute;
	top: -60%;
	right: -10%;
	width: 55%;
	height: 220%;
	background: radial-gradient(ellipse at center, rgba(255, 140, 0, .18) 0%, transparent 65%);
	pointer-events: none;
}
.quada-card {
	/* !important defeats the parent theme's `section:nth-of-type(2n+1)` rule,
	   which paints odd <section> elements #f4f4f4 — that was showing through as
	   a white background behind the Announcements / Knowledge Base / Billing
	   cards (most visible on mobile). Every card variant wants this dark
	   surface; the --notice/--success variants only change border and text. */
	background: var(--qa-surface) !important;
	transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.quada-card:hover {
	border-color: rgba(255, 140, 0, .55);
	box-shadow: 0 10px 34px rgba(0, 0, 0, .45), 0 0 24px rgba(255, 140, 0, .08);
}
.quada-enrollment-card, .quada-chart-card { position: relative; overflow: hidden; }
.quada-enrollment-card::before, .quada-chart-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--qa-orange-deep), var(--qa-orange), transparent 80%);
	opacity: .85;
}

/* ---------- Hero progress ring ---------- */
.quada-dashboard__hero-ring {
	margin-left: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.quada-dashboard__hero-ring span {
	color: var(--qa-mist);
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-weight: 600;
}

/* ---------- Stat tiles ---------- */
.quada-tile-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 14px;
}
.quada-tile {
	background: var(--qa-surface);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	transition: border-color .18s ease, transform .18s ease;
}
.quada-tile:hover { border-color: rgba(255, 140, 0, .5); transform: translateY(-2px); }
.quada-tile__value {
	font-family: 'Poppins', sans-serif;
	color: var(--qa-orange);
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}
.quada-tile__label {
	color: var(--qa-mist);
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}
.quada-tile--ok .quada-tile__value { color: var(--qa-success); }
.quada-tile--due { border-color: rgba(228, 87, 46, .6); }
.quada-tile--due .quada-tile__value { color: var(--qa-danger); }

/* ---------- Charts ---------- */
.quada-chart-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 18px;
}
.quada-chart-card { padding: 20px 22px 16px; }
.quada-chart-wrap { position: relative; min-height: 220px; height: auto; margin-top: 14px; }
.quada-chart-wrap canvas { min-height: 220px; }

/* ---------- Billing ---------- */
.quada-billing { padding: 22px 26px; }
.quada-billing__banner {
	background: linear-gradient(120deg, rgba(228, 87, 46, .14), rgba(255, 140, 0, .08));
	border: 1px solid rgba(228, 87, 46, .45);
	border-radius: 10px;
	color: var(--qa-white);
	font-size: 14px;
	padding: 14px 18px;
	margin-bottom: 18px;
}
.quada-billing__instructions { color: var(--qa-mist); font-size: 13px; }
.quada-billing__table { width: 100%; border-collapse: collapse; font-size: 14px; }
.quada-billing__table th {
	text-align: left;
	color: var(--qa-orange) !important;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 12px 16px;
	background: linear-gradient(180deg, #2e2d35 0%, #252429 100%) !important;
	border-bottom: 2px solid var(--qa-orange);
}
.quada-billing__table td {
	padding: 12px 16px;
	border-bottom: 1px solid rgba(255,255,255,.07);
	color: var(--qa-mist) !important;
	background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
	vertical-align: middle;
}
.quada-billing__table tr:nth-child(even) td {
	background: linear-gradient(180deg, #232229 0%, #1f1e25 100%) !important;
}
.quada-billing__table tr:last-child td { border-bottom: none; }
.quada-billing__amount { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--qa-orange); }
.quada-btn--sm { padding: 7px 16px; font-size: 12px; }

/* ---------- Certificate cards ---------- */
.quada-cert-card { border-color: rgba(255, 140, 0, .45); }
.quada-cert-card__seal {
	position: absolute;
	top: 14px;
	right: 16px;
	width: 34px;
	height: 34px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, var(--qa-orange), var(--qa-orange-deep));
	color: var(--qa-black);
	font-size: 15px;
	box-shadow: 0 0 16px rgba(255, 140, 0, .4);
}

@media (max-width: 640px) {
	.quada-dashboard__hero-ring { margin: 0 auto; }
	/* Billing & Payments — stack into labelled cards on mobile instead of a
	   sideways-scrolling 6-column table. Each cell shows its column name from
	   the data-label attribute. */
	.quada-billing__table,
	.quada-billing__table tbody,
	.quada-billing__table tr,
	.quada-billing__table td { display: block; width: auto; }
	.quada-billing__table thead { display: none; }
	.quada-billing__table tr {
		background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
		border: 1px solid rgba(255,255,255,.08);
		border-radius: 12px;
		padding: 6px 14px 10px;
		margin-bottom: 12px;
	}
	.quada-billing__table tr:nth-child(even) td { background: none; }
	.quada-billing__table td {
		padding: 8px 0;
		border: none;
		border-bottom: 1px dashed rgba(255,255,255,.08);
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		text-align: right;
		color: var(--qa-white);
		font-size: 14px;
	}
	.quada-billing__table tr td:last-child { border-bottom: none; }
	.quada-billing__table td::before {
		content: attr(data-label);
		color: var(--qa-mist);
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: .08em;
		text-align: left;
		flex: none;
	}
}

/* ---------- Application form (M&E) ---------- */
.quada-apply-page { max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.quada-apply-hero {
	display: flex;
	align-items: center;
	gap: 22px;
	background: linear-gradient(135deg, var(--qa-black) 0%, var(--qa-charcoal) 55%, #241a0e 100%);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 26px 30px;
}
.quada-apply-hero img { height: 54px; width: auto; }
.quada-apply-hero h2 { color: var(--qa-white); margin: 0; font-family: 'Poppins', sans-serif; font-size: 23px; }
.quada-apply-hero p { color: var(--qa-mist); margin: 4px 0 0; font-size: 14px; }

.quada-form { display: flex; flex-direction: column; gap: 22px; }
/* Form typography (2026-07 owner request): Zorhan Pro / Gotham display,
   Fira Sans body — Zorhan Pro activates automatically if its font files are
   ever added; Gotham + Fira Sans are self-hosted in assets/fonts/. */
.quada-form, .quada-form input, .quada-form select, .quada-form textarea,
.quada-apply-hero p {
	font-family: 'Zorhan Pro', 'Fira Sans', var(--qa-font-body);
}
.quada-apply-hero h2 { font-family: 'Zorhan Pro', 'Gotham', var(--qa-font-display); }
.quada-form .quada-btn { font-family: 'Zorhan Pro', 'Gotham', var(--qa-font-display); }
.quada-form__section {
	background: linear-gradient(160deg, #1E1E23 0%, var(--qa-charcoal) 60%, #17171b 100%);
	border: 1px solid var(--qa-graphite);
	border-top: 3px solid rgba(255, 140, 0, .55);
	border-radius: var(--qa-radius);
	padding: 26px 30px 30px;
	margin: 0;
}
/* Sentence-case legends — no uppercase (2026-07 owner request). */
.quada-form__section legend {
	font-family: 'Zorhan Pro', 'Gotham', var(--qa-font-display);
	color: var(--qa-white);
	font-weight: 600;
	font-size: 18px;
	letter-spacing: 0;
	text-transform: none;
	padding: 0 10px 0 0;
	display: flex;
	align-items: center;
	gap: 10px;
}
.quada-form__section legend span {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	flex: none;
	border-radius: var(--qa-radius-pill);
	background: rgba(255, 140, 0, .14);
	border: 1px solid rgba(255, 140, 0, .5);
	color: var(--qa-orange);
	font-size: 13px;
	font-weight: 700;
	margin-right: 0;
}
.quada-form__hint { margin: 6px 0 0; font-size: 14px; color: var(--qa-mist); }
.quada-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px 24px;
	margin-top: 14px;
}
/* Readable sentence-case field labels (previously 11px ALL-CAPS). */
.quada-form__field {
	display: block;
	color: #D8DAE0;
	font-size: 14px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: normal;
	line-height: 1.45;
}
.quada-form__field em { color: var(--qa-orange); font-style: normal; }
.quada-form__field--wide { grid-column: 1 / -1; }
.quada-form__field input[type=text],
.quada-form__field input[type=tel],
.quada-form__field input[type=url],
.quada-form__field input[type=number],
.quada-form__field select,
.quada-form__field textarea {
	display: block;
	width: 100%;
	margin-top: 8px;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: 10px;
	color: var(--qa-white);
	padding: 13px 15px;
	font-size: 16px;
	font-family: 'Zorhan Pro', 'Fira Sans', var(--qa-font-body);
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	box-sizing: border-box;
	transition: border-color .15s ease;
}
.quada-form__field input[type=number] { max-width: 160px; }
.quada-form__field textarea { min-height: 92px; resize: vertical; }
.quada-form__field input:focus,
.quada-form__field select:focus,
.quada-form__field textarea:focus {
	outline: 2px solid var(--qa-orange);
	outline-offset: 1px;
	border-color: var(--qa-orange);
}
.quada-form__check {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 14px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	color: var(--qa-white);
	line-height: 1.55;
}
.quada-form__check input { accent-color: var(--qa-orange); width: 18px; height: 18px; flex: none; margin-top: 2px; }

/* Custom dropdowns: hide the native arrow, draw the chevron inset from the
   edge (2026-07 owner request — "arrow not close to the edge"). */
.quada-form__field select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23FF8C00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 18px center;
	padding-right: 48px;
	cursor: pointer;
}
.quada-form__field select option { background: var(--qa-charcoal); color: var(--qa-white); }

/* Question label above scales / checkbox lists. */
.quada-form__label {
	display: block;
	color: #D8DAE0;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 12px;
	line-height: 1.45;
}
.quada-form__label em { color: var(--qa-orange); font-style: normal; }

/* Line-bar rate scale: connected segments, filled up to the selection. */
.quada-scale__bar {
	display: flex;
	gap: 0;
}
.quada-scale__step {
	position: relative;
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding-top: 4px;
	cursor: pointer;
	text-align: center;
}
.quada-scale__step input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
/* the track */
.quada-scale__step::before {
	content: '';
	position: absolute;
	top: 12px;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--qa-graphite);
}
.quada-scale__step:first-child::before { left: 50%; }
.quada-scale__step:last-child::before { right: 50%; }
.quada-scale__dot {
	position: relative;
	z-index: 1;
	width: 19px;
	height: 19px;
	border-radius: 50%;
	background: var(--qa-black);
	border: 2px solid var(--qa-graphite);
	box-sizing: border-box;
	transition: border-color .15s, background .15s;
}
.quada-scale__text {
	font-size: 13px;
	color: var(--qa-mist);
	line-height: 1.35;
	max-width: 110px;
}
.quada-scale__step:hover .quada-scale__dot { border-color: var(--qa-orange); }
/* selected step + every step before it lights up (the "filled bar") */
.quada-scale__step:has(input:checked) .quada-scale__dot,
.quada-scale__step:has(~ .quada-scale__step input:checked) .quada-scale__dot {
	background: var(--qa-orange);
	border-color: var(--qa-orange);
}
.quada-scale__step:has(input:checked)::before,
.quada-scale__step:has(~ .quada-scale__step input:checked)::before {
	background: var(--qa-orange);
}
.quada-scale__step:has(input:checked) .quada-scale__text {
	color: var(--qa-white);
	font-weight: 600;
}
.quada-scale__step:has(input:focus-visible) .quada-scale__dot { outline: 2px solid var(--qa-orange); outline-offset: 2px; }

/* Multi-choice checkbox lists: clean two-column list, no pills. */
.quada-form .quada-checkbox-group {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 24px;
}
.quada-form .quada-check-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--qa-white);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.45;
	cursor: pointer;
}
.quada-form .quada-check-item input {
	accent-color: var(--qa-orange);
	width: 18px;
	height: 18px;
	flex: none;
	margin: 1px 0 0;
}
@media (max-width: 620px) {
	.quada-form__grid { grid-template-columns: 1fr; }
	.quada-form__section { padding: 22px 20px 24px; }
	.quada-form .quada-checkbox-group { grid-template-columns: 1fr; }
	.quada-scale__bar { flex-direction: column; align-items: flex-start; gap: 10px; }
	.quada-scale__step { flex-direction: row; padding: 0; gap: 10px; }
	.quada-scale__step::before { display: none; }
	.quada-scale__text { max-width: none; text-align: left; }
}

/* ---------- Store / WooCommerce buttons: readable text on the orange fill.
   Root cause: the theme paints WooCommerce-page anchor TEXT with the same
   accent variable it uses for the button FILL
   (body.woocommerce-page a:not(...) { color: var(--qa-wc-accent) !important }),
   so buttons showed orange words on the orange fill. Do NOT redefine
   --qa-wc-accent here — the theme also uses it for button backgrounds. */
.wp-block-button__link,
.add_to_cart_button,
.single_add_to_cart_button,
a.btn.btn-primary,
.btn.btn-primary,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .checkout-button {
	background: linear-gradient(135deg, var(--qa-orange) 0%, var(--qa-orange-deep) 100%) !important;
	color: #131315 !important;
	font-weight: 700;
	text-shadow: none;
}
/* Outrank the theme's (0,6,3) anchor-text rule for classic button anchors —
   repeated :is() inflates specificity without new markup. */
body.woocommerce-page a:is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button):is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button):is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button):is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button):is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button):is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button):is(.wp-block-button__link, .add_to_cart_button, .btn-primary, .checkout-button) {
	color: #131315 !important;
}
.wp-block-button__link:hover,
.add_to_cart_button:hover,
a.btn.btn-primary:hover,
.btn.btn-primary:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .checkout-button:hover {
	background: var(--qa-orange-deep) !important;
	color: #131315 !important;
}
/* Block cart/checkout buttons (Proceed to Checkout, Place Order) keep the
   theme's orange fill; just make their label dark instead of white. */
.wc-block-components-button:not(.is-link) .wc-block-components-button__text {
	color: #131315;
	font-weight: 700;
}

/* ---------- Program card facts (cohort, dates, seats) ---------- */
.quada-program-card__cohort { color: var(--qa-orange); font-weight: 700; }
.quada-program-card__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	font-size: 12px;
	color: var(--qa-mist);
	border-top: 1px solid var(--qa-graphite);
	padding-top: 12px;
}
.quada-program-card__facts .is-full { color: var(--qa-danger); font-weight: 700; }

/* ---------- Course params strip ---------- */
.quada-course__params {
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
	color: var(--qa-mist);
	font-size: 13px;
	margin: 0 0 -6px;
}
.quada-course__params span:first-child { color: var(--qa-orange); font-weight: 700; }

/* ---------- Course Manager (trainer) ---------- */
.quada-manage { display: flex; flex-direction: column; gap: 18px; margin-top: 16px; }
.quada-manage__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	background: linear-gradient(135deg, var(--qa-black) 0%, var(--qa-charcoal) 55%, #241a0e 100%);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	padding: 24px 28px;
}
.quada-manage__kicker {
	color: var(--qa-orange);
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	margin: 0 0 4px;
}
.quada-manage__head h2 { color: var(--qa-white); margin: 0; font-family: 'Poppins', sans-serif; }
.quada-manage__params {
	list-style: none;
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
	margin: 8px 0 0;
	padding: 0;
	color: var(--qa-mist);
	font-size: 13px;
}
.quada-manage__params li { margin: 0; }
.quada-manage__params strong { color: var(--qa-orange); }

.quada-manage__module {
	background: linear-gradient(160deg, #1E1E23, #17171b);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	overflow: hidden;
}
.quada-manage__module > header {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 22px;
	border-bottom: 1px solid var(--qa-graphite);
}
.quada-manage__module > header h3 { margin: 0; color: var(--qa-white); font-size: 17px; font-family: 'Poppins', sans-serif; }
.quada-manage__module > header p { margin: 3px 0 0; color: var(--qa-mist); font-size: 12px; }
.quada-manage__module > header .quada-btn { margin-left: auto; white-space: nowrap; }
.quada-manage__lessons { list-style: none; margin: 0; padding: 4px 0; }
.quada-manage__lessons li {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 10px 22px;
	margin: 0;
	color: var(--qa-white);
	border-bottom: 1px dashed rgba(42, 42, 48, .8);
	font-size: 14px;
}
.quada-manage__lessons li:last-child { border-bottom: none; }
/* Long lesson titles must shrink instead of pushing the Edit button off-screen
   (audit 2026-07-26: Edit clipped at 390px on flex-nowrap rows). */
.quada-manage__lesson-title { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.quada-manage__lessons li > a,
.quada-manage__lessons li > .quada-btn { margin-left: auto; flex: 0 0 auto; }
@media (max-width: 640px) {
	.quada-manage__lessons li { flex-wrap: wrap; gap: 8px 14px; padding: 10px 16px; }
	.quada-manage__lessons li > a,
	.quada-manage__lessons li > .quada-btn { margin-left: 0; }
	/* student course view rows: same shrink safety */
	.quada-module__head { flex-wrap: wrap; }
	.quada-module__head h3 { min-width: 0; overflow-wrap: anywhere; font-size: 16.5px; }
	.quada-lesson-list__title { min-width: 0; overflow-wrap: anywhere; }
	.quada-module-exam-row { flex-wrap: wrap; gap: 8px 12px; }
}
.quada-manage__addrow {
	display: flex;
	gap: 10px;
	padding: 14px 22px;
	background: rgba(255, 140, 0, .04);
	align-items: center;
	flex-wrap: wrap;
}
.quada-manage__addrow input[type=text] {
	flex: 1;
	min-width: 200px;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: 10px;
	color: var(--qa-white);
	padding: 10px 14px;
	font-size: 14px;
}
.quada-manage__addrow select {
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: 10px;
	color: var(--qa-white);
	padding: 10px 12px;
	font-size: 13px;
}
.quada-manage__addmodule {
	border: 1px dashed var(--qa-graphite);
	border-radius: var(--qa-radius);
	background: transparent;
}
.quada-manage__form { max-width: 100%; }

/* ---------- Study timer bar ---------- */
.quada-studybar {
	background: linear-gradient(120deg, rgba(255,140,0,.10), rgba(255,140,0,.03));
	border: 1px solid rgba(255,140,0,.4);
	border-radius: var(--qa-radius);
	padding: 14px 18px;
	margin: 4px 0 18px;
}
.quada-studybar.is-done {
	background: rgba(61,190,123,.10);
	border-color: rgba(61,190,123,.45);
}
.quada-studybar__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 10px;
}
.quada-studybar__label { color: var(--qa-white); font-size: 13px; font-weight: 600; }
.quada-studybar.is-done .quada-studybar__label { color: var(--qa-success); }
.quada-studybar__timer {
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-variant-numeric: tabular-nums;
	font-size: 22px;
	font-weight: 800;
	color: var(--qa-orange);
	white-space: nowrap;
}
.quada-studybar.is-done .quada-studybar__timer { color: var(--qa-success); }

/* ---------- Locked materials ---------- */
.quada-lesson__materials.is-locked { position: relative; }
.quada-materials-lock {
	color: var(--qa-orange);
	font-size: 13px;
	font-weight: 600;
	margin: 12px 0;
	padding: 10px 14px;
	background: rgba(255,140,0,.08);
	border: 1px dashed rgba(255,140,0,.4);
	border-radius: 8px;
}
.quada-material-list__locked {
	color: #7a7a82;
	cursor: not-allowed;
	user-select: none;
}

/* ====================== LANDING PAGE ====================== */
.quada-landing { display: flex; flex-direction: column; gap: 64px; }

/* Hero */
.quada-hero {
	text-align: center;
	padding: 70px 24px 60px;
	background: radial-gradient(ellipse at top, #1a1206 0%, #000 70%);
	border: 1px solid var(--qa-graphite);
	border-radius: 22px;
	position: relative;
	overflow: hidden;
}
.quada-hero__logo { height: 88px; width: auto; margin-bottom: 26px; }
.quada-hero__title {
	font-family: 'Poppins', sans-serif;
	font-size: clamp(30px, 5vw, 54px);
	font-weight: 700;
	color: #fff !important;
	margin: 0 0 16px;
	letter-spacing: -0.01em;
	background: linear-gradient(90deg, #fff 30%, var(--qa-orange));
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent;
}
.quada-hero__sub { max-width: 720px; margin: 0 auto 30px; color: var(--qa-mist); font-size: 17px; line-height: 1.6; }
.quada-hero__cta { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.quada-hero__stats {
	list-style: none; display: flex; gap: 50px; justify-content: center;
	margin: 44px 0 0; padding: 30px 0 0; border-top: 1px solid var(--qa-graphite);
}
.quada-hero__stats li { display: flex; flex-direction: column; gap: 4px; }
.quada-hero__stats strong { font-family: 'Poppins', sans-serif; font-size: 34px; color: var(--qa-orange); }
.quada-hero__stats span { color: var(--qa-mist); font-size: 12px; text-transform: uppercase; letter-spacing: 0.14em; }

/* Sections */
.quada-landing__section { text-align: center; }
.quada-landing__heading {
	font-family: 'Poppins', sans-serif; font-size: clamp(24px, 3.5vw, 36px);
	color: #fff !important; margin: 0 0 10px;
}
.quada-landing__lead { color: var(--qa-mist); max-width: 640px; margin: 0 auto 36px; font-size: 16px; }
.quada-landing__center { margin-top: 36px; }

/* Offerings */
.quada-offerings {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 22px; text-align: left;
}
.quada-offering {
	background: linear-gradient(160deg, #1E1E23 0%, #121214 60%, #0a0a0c 100%);
	border: 1px solid var(--qa-graphite); border-radius: 18px; padding: 28px 26px;
	display: flex; flex-direction: column; gap: 12px; position: relative; overflow: hidden;
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.quada-offering::before {
	content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
	background: linear-gradient(90deg, var(--qa-orange-deep), var(--qa-orange), transparent 85%);
}
.quada-offering:hover { transform: translateY(-5px); border-color: rgba(255,140,0,.55); box-shadow: 0 16px 40px rgba(0,0,0,.5), 0 0 28px rgba(255,140,0,.1); }
.quada-offering__icon { font-size: 34px; }
.quada-offering__tag { color: var(--qa-orange); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.14em; }
.quada-offering h3 { margin: 0; font-size: 20px; }
.quada-offering p { color: var(--qa-mist); font-size: 14px; margin: 0; flex: 1; }
.quada-offering__meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--qa-mist); font-size: 13px; }
.quada-offering__link { color: var(--qa-orange); font-weight: 700; text-decoration: none; font-size: 14px; }

/* Why grid */
.quada-why__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 20px; text-align: left; }
.quada-why__item { background: #0d0d0f; border: 1px solid var(--qa-graphite); border-radius: 16px; padding: 24px; }
.quada-why__item span { font-size: 30px; }
.quada-why__item h4 { color: #fff !important; margin: 12px 0 6px; font-size: 17px; }
.quada-why__item p { color: var(--qa-mist); font-size: 14px; margin: 0; }

/* Testimonials */
.quada-testimonials { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; text-align: left; }
.quada-testimonial {
	margin: 0; background: linear-gradient(160deg, #18120a, #0d0d0f);
	border: 1px solid rgba(255,140,0,.28); border-radius: 16px; padding: 26px;
}
.quada-testimonial blockquote { margin: 0 0 16px; color: #e9e9ee; font-size: 15px; line-height: 1.6; font-style: italic; }
.quada-testimonial figcaption { display: flex; flex-direction: column; }
.quada-testimonial figcaption strong { color: var(--qa-orange); }
.quada-testimonial figcaption span { color: var(--qa-mist); font-size: 13px; }

/* CTA */
.quada-cta {
	text-align: center; padding: 56px 24px;
	background: radial-gradient(ellipse at center, #1a1206 0%, #000 75%);
	border: 1px solid rgba(255,140,0,.35); border-radius: 22px;
}
.quada-cta h2 { font-family: 'Poppins', sans-serif; color: #fff !important; font-size: clamp(24px,3.5vw,34px); margin: 0 0 10px; }
.quada-cta p { color: var(--qa-mist); margin: 0 0 26px; }

/* ====================== v1.3 polish ====================== */

/* Prevent theme injecting white backgrounds on miscellaneous dashboard tables */
.quada-dashboard table:not(.quada-table):not(.quada-billing__table) {
	background: transparent !important;
	background-color: transparent !important;
	color: var(--qa-mist);
}
.quada-billing { background: linear-gradient(160deg, #1E1E23 0%, #121214 60%, #0a0a0c 100%) !important; }

/* Program card — title overlaid on the image */
.quada-program-card__media { aspect-ratio: 16/10; }
.quada-program-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; filter: brightness(.82); transition: transform .4s ease, filter .3s ease; }
.quada-program-card:hover .quada-program-card__media img { transform: scale(1.05); filter: brightness(.95); }
.quada-program-card__overlay {
	position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 20px 16px;
	background: linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.55) 55%, transparent 100%);
}
.quada-program-card__overlay-type { color: var(--qa-orange); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.16em; display: block; margin-bottom: 4px; }
.quada-program-card__overlay-type a { color: inherit; text-decoration: none; }
.quada-program-card__overlay-title { color: #fff !important; margin: 0; font-size: 19px; line-height: 1.25; font-family: 'Poppins', sans-serif; }
.quada-program-card__body { padding: 18px 20px 22px; }

/* Landing offering — image card with overlay */
.quada-offering { display: flex; flex-direction: column; text-decoration: none; padding: 0; }
.quada-offering__media {
	position: relative; aspect-ratio: 16/10; background-size: cover; background-position: center;
	display: flex; align-items: flex-end;
}
.quada-offering__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.92), rgba(0,0,0,.25) 60%, rgba(0,0,0,.35)); }
.quada-offering__media .quada-badge { position: absolute; top: 14px; right: 14px; z-index: 2; }
.quada-offering__overlay { position: relative; z-index: 2; padding: 22px 22px 18px; }
.quada-offering__overlay .quada-offering__tag { color: var(--qa-orange); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.14em; }
.quada-offering__overlay h3 { color: #fff !important; margin: 6px 0 0; font-size: 21px; }
.quada-offering__body { padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 14px; flex: 1; }
.quada-offering__body p { color: var(--qa-mist); font-size: 14px; margin: 0; flex: 1; }
.quada-offering__meta { display: flex; align-items: center; justify-content: space-between; color: var(--qa-mist); font-size: 13px; }
.quada-offering__link { color: var(--qa-orange); font-weight: 700; }

/* Program detail page */
.quada-program-detail { display: flex; flex-direction: column; gap: 30px; margin-top: 18px; }
.quada-program-detail__hero { position: relative; border-radius: 18px; overflow: hidden; max-height: 380px; }
.quada-program-detail__hero img { width: 100%; height: 100%; max-height: 380px; object-fit: cover; display: block; filter: brightness(.7); }
.quada-program-detail__hero-overlay { position: absolute; left: 0; right: 0; bottom: 0; padding: 50px 36px 30px; background: linear-gradient(to top, rgba(0,0,0,.95), transparent); }
.quada-program-detail__type { color: var(--qa-orange); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.16em; }
.quada-program-detail__hero-overlay h2 { color: #fff !important; margin: 8px 0 0; font-size: clamp(24px, 4vw, 40px); font-family: 'Poppins', sans-serif; }
.quada-program-detail__facts {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1px;
	background: var(--qa-graphite); border: 1px solid var(--qa-graphite); border-radius: 14px; overflow: hidden;
}
.quada-program-detail__facts > div { background: #121214; padding: 18px 20px; display: flex; flex-direction: column; gap: 6px; }
.quada-program-detail__fact-label { color: var(--qa-mist); font-size: 10px; text-transform: uppercase; letter-spacing: 0.12em; }
.quada-program-detail__facts strong { color: #fff; font-size: 15px; }

/* Module breakdown accordion */
.quada-breakdown { display: flex; flex-direction: column; gap: 12px; margin-top: 0; }
.quada-breakdown__module { background: linear-gradient(160deg, #1E1E23, #121214); border: 1px solid var(--qa-graphite); border-radius: 14px; overflow: hidden; }
.quada-breakdown__module summary {
	display: flex; align-items: center; gap: 16px; padding: 18px 22px; cursor: pointer; list-style: none;
}
.quada-breakdown__module summary::-webkit-details-marker { display: none; }
.quada-breakdown__num { color: var(--qa-orange); font-weight: 800; font-size: 18px; font-variant-numeric: tabular-nums; }
.quada-breakdown__title { color: #fff; font-weight: 600; font-size: 17px; flex: 1; font-family: 'Poppins', sans-serif; }
.quada-breakdown__count { color: var(--qa-mist); font-size: 12px; white-space: nowrap; }
.quada-breakdown__desc { color: var(--qa-mist); font-size: 14px; margin: 0 22px 8px; }
.quada-breakdown__lessons { list-style: none; margin: 0; padding: 4px 0 12px; }
.quada-breakdown__lessons li { display: flex; align-items: center; gap: 14px; padding: 9px 22px; border-top: 1px dashed rgba(42,42,48,.7); }
.quada-breakdown__ltype { flex: 0 0 80px; color: var(--qa-orange); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; }
.quada-breakdown__lname { flex: 1; color: #fff; font-size: 14px; }
.quada-breakdown__ldur { color: var(--qa-mist); font-size: 12px; }
.quada-program-detail__cta { text-align: center; padding: 10px 0 8px; }
.quada-program-detail__enrolled { color: var(--qa-mist); font-size: 13.5px; margin: 12px 0 0; }

/* "What you will study" — mobile: roomier headers, lesson rows stack so the
   type tag, name and duration each get a full line instead of a cramped row. */
@media (max-width: 640px) {
	.quada-breakdown__module summary { gap: 10px; padding: 15px 16px; flex-wrap: wrap; align-items: baseline; }
	.quada-breakdown__num { font-size: 16px; }
	.quada-breakdown__title { font-size: 15.5px; line-height: 1.3; flex: 1 1 auto; min-width: 0; }
	.quada-breakdown__count { flex: 1 0 100%; margin-left: 26px; font-size: 11.5px; }
	.quada-breakdown__desc { margin: 0 16px 8px; font-size: 13.5px; }
	.quada-breakdown__lessons li {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-areas: "type dur" "name name";
		gap: 3px 10px;
		align-items: center;
		padding: 11px 16px;
	}
	.quada-breakdown__ltype { grid-area: type; flex: none; font-size: 9.5px; }
	.quada-breakdown__ldur  { grid-area: dur; justify-self: end; }
	.quada-breakdown__lname { grid-area: name; font-size: 14.5px; line-height: 1.35; }
}

/* Hero CTA spacing fix + general breathing room */
.quada-hero__cta { display: flex; gap: 18px; justify-content: center; flex-wrap: wrap; margin-top: 6px; }
.quada-hero__cta .quada-btn { margin: 0; min-width: 190px; }
.quada-landing { gap: 80px; }
.quada-landing__section { padding: 0 4px; }
@media (max-width: 600px) {
	.quada-hero__cta { flex-direction: column; align-items: center; }
	.quada-hero__cta .quada-btn { width: 100%; max-width: 320px; }
	.quada-program-detail__hero-overlay { padding: 36px 20px 22px; }
}

/* ====================== v1.4 — hero CTA + nav user chip polish ====================== */
.quada-hero { padding: 80px 28px 64px; }
.quada-hero__sub { margin-bottom: 38px; }
.quada-hero__cta {
	display: flex;
	gap: 22px;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	margin: 0 0 8px;
}
.quada-hero__cta .quada-btn { margin: 0; min-width: 210px; text-align: center; }
.quada-hero__cta .quada-btn--ghost { background: rgba(255,140,0,.06); }
.quada-hero__cta .quada-btn--ghost:hover { background: var(--qa-orange); }
.quada-hero__stats { margin-top: 50px; gap: 60px; }
@media (max-width: 600px) {
	.quada-hero__cta { flex-direction: column; gap: 14px; }
	.quada-hero__cta .quada-btn { width: 100%; max-width: 320px; }
	.quada-hero__stats { gap: 34px; }
}

/* ====================== v1.5 — card + hero redesign (definitive) ====================== */

/* --- Program cards: equal height, strong legible overlay, clean body --- */
.quada-program-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
	gap: 26px;
	margin: 30px 0;
	align-items: stretch;
}
.quada-program-card {
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 0;
	overflow: hidden;
	border-radius: 16px;
	background: linear-gradient(165deg, #1b1b20 0%, #121214 55%, #0b0b0d 100%);
	border: 1px solid var(--qa-graphite);
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.quada-program-card:hover {
	transform: translateY(-4px);
	border-color: rgba(255,140,0,.5);
	box-shadow: 0 16px 40px rgba(0,0,0,.55), 0 0 26px rgba(255,140,0,.08);
}
.quada-program-card__media {
	position: relative;
	flex: 0 0 auto;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	display: block;
	background: #000;
}
.quada-program-card__media img {
	width: 100%; height: 100%;
	object-fit: cover; display: block;
	filter: brightness(.74);
	transition: transform .5s ease, filter .3s ease;
}
.quada-program-card:hover .quada-program-card__media img { transform: scale(1.06); filter: brightness(.9); }
.quada-program-card__media .quada-badge { position: absolute; top: 14px; right: 14px; z-index: 3; }
.quada-program-card__overlay {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
	padding: 54px 18px 16px;
	background: linear-gradient(to top, #000 4%, rgba(0,0,0,.78) 42%, rgba(0,0,0,.15) 80%, transparent 100%);
}
.quada-program-card__overlay-type { color: var(--qa-orange); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.16em; display: block; margin-bottom: 5px; text-shadow: 0 1px 6px rgba(0,0,0,.8); }
.quada-program-card__overlay-type a { color: inherit; text-decoration: none; }
.quada-program-card__overlay-title { color: #fff !important; margin: 0; font-size: 20px; line-height: 1.22; font-family: 'Poppins', sans-serif; font-weight: 600; text-shadow: 0 2px 10px rgba(0,0,0,.9); }
.quada-program-card__overlay-title a { color: #fff; text-decoration: none; }
.quada-program-card__overlay-title a:hover { color: var(--qa-orange); }
.quada-program-card__body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 20px 22px 22px;
}
.quada-program-card__excerpt { color: var(--qa-mist); font-size: 14px; line-height: 1.55; margin: 0; }

/* Clean meta chips instead of scattered bullet text */
.quada-program-card__meta { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.quada-program-card__meta li { list-style: none; margin: 0; }
.quada-program-card__meta li::marker { content: none; }
.quada-chip {
	display: inline-flex;
	align-items: center;
	background: rgba(255, 255, 255, .05);
	border: 1px solid var(--qa-graphite);
	border-radius: 999px;
	padding: 5px 12px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--qa-mist);
	white-space: normal;
	overflow-wrap: anywhere;
	max-width: 100%;
	box-sizing: border-box;
}
.quada-chip--cohort {
	background: rgba(255, 140, 0, .12);
	border-color: rgba(255, 140, 0, .45);
	color: var(--qa-orange);
}

.quada-program-card__facts { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; color: var(--qa-mist); border-top: none; padding-top: 0; }
.quada-program-card__facts .is-full { color: var(--qa-danger); font-weight: 700; }

/* Footer: price clearly anchored opposite the CTA */
.quada-program-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-top: auto;
	padding-top: 16px;
	border-top: 1px solid var(--qa-graphite);
}
.quada-program-card__pricewrap { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.quada-program-card__price-label {
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--qa-mist);
}
.quada-program-card__price,
.quada-course__price {
	color: var(--qa-orange);
	font-weight: 800;
	font-size: 20px;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
	font-family: 'Poppins', sans-serif;
}
.quada-program-card__price--free { color: var(--qa-success); }
.quada-program-card__footer .quada-btn { margin: 0; flex-shrink: 0; white-space: nowrap; }

/* --- Hero: centered, even glow (no lopsided corner gradient) --- */
.quada-hero.quada-glow { overflow: hidden; }
.quada-hero.quada-glow::after { display: none !important; }
.quada-hero {
	background: radial-gradient(ellipse 70% 80% at 50% -10%, #20160a 0%, #0a0a0c 55%, #000 100%);
	border: 1px solid var(--qa-graphite);
}
.quada-cta.quada-glow::after { display: none !important; }
.quada-cta { background: radial-gradient(ellipse 60% 90% at 50% 50%, #20160a 0%, #000 78%); }

/* ====================== v1.6 — robust background-image card media ====================== */
.quada-program-card__media {
	position: relative;
	flex: 0 0 auto;
	aspect-ratio: 16 / 10;
	width: 100%;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
	background-color: #0a0a0c;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	text-decoration: none;
	transition: filter .3s ease;
}
.quada-program-card__media::before {
	content: '';
	position: absolute; inset: 0;
	background: linear-gradient(to top, #000 4%, rgba(0,0,0,.72) 40%, rgba(0,0,0,.1) 78%, transparent 100%);
	z-index: 1;
}
.quada-program-card:hover .quada-program-card__media { filter: brightness(1.08); }
.quada-program-card__media .quada-badge { position: absolute; top: 14px; right: 14px; z-index: 3; }
.quada-program-card__overlay { position: relative; z-index: 2; width: 100%; padding: 0 18px 16px; background: none; }
/* Neutralise the old <img> rule remnants */
.quada-program-card__media img { display: none !important; }

/* ====================== v1.7 — codex-style hero, login, detail banner ====================== */

/* --- Full-bleed cinematic landing hero (matches quad-a-academy-codex) --- */
.qa-landing-hero {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	left: 0;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-top: -24px;
	background-color: #07070a;
	border-bottom: 1px solid rgba(255,140,0,.22);
	overflow: hidden;
}
.qa-landing-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background-image: var(--qa-hero-bg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	filter: grayscale(1) contrast(1.05) brightness(.72);
}
.qa-landing-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(90deg, rgba(4,4,6,.97) 0%, rgba(4,4,6,.85) 50%, rgba(4,4,6,.62) 100%),
		linear-gradient(to bottom, rgba(4,4,6,.88) 0%, rgba(4,4,6,.4) 22%, transparent 46%),
		linear-gradient(to top, rgba(4,4,6,.66) 0%, transparent 34%);
}
.qa-landing-hero__inner { position: relative; z-index: 2; }
.qa-landing-hero__inner {
	/* Image is full-bleed; content fits within the same centred content column
	   as the rest of the landing page (max 1200px, 28px gutters). */
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
	padding: 96px 28px 84px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
}
.qa-landing-hero__logo { height: 184px; width: auto; max-width: 100%; margin-bottom: 28px; }
.qa-kicker {
	color: var(--qa-orange);
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.18em;
	margin: 0 0 14px;
}
.qa-landing-hero h1 {
	color: #fff !important;
	font-family: 'Poppins', 'Inter', sans-serif;
	font-weight: 700;
	font-size: clamp(34px, 5vw, 64px);
	line-height: 1.07;
	letter-spacing: -0.01em;
	margin: 0;
	max-width: 940px;
}
.qa-landing-hero__lead {
	color: var(--qa-mist);
	font-size: 18px;
	line-height: 1.6;
	max-width: 680px;
	margin: 22px 0 0;
}
.qa-landing-actions { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 36px; margin-bottom: 0; }
.qa-landing-hero__stats {
	list-style: none; display: flex; flex-wrap: wrap; gap: 28px 72px; width: 100%; max-width: 760px;
	margin: 48px 0 0; padding: 32px 0 0;
	border-top: 1px solid rgba(255,255,255,.14);
}
.qa-landing-hero__stats li { display: flex; flex-direction: column; gap: 4px; }
.qa-landing-hero__stats strong { font-family: 'Poppins', sans-serif; font-size: 32px; color: var(--qa-orange); }
.qa-landing-hero__stats span { color: var(--qa-mist); font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; }
@media (max-width: 900px) {
	/* On smaller screens the content takes the full width again. */
	.qa-landing-hero__inner { max-width: 100%; padding-left: 28px; }
}
@media (max-width: 640px) {
	.qa-landing-hero__inner { max-width: 100%; padding: 64px 22px 56px; }
	.qa-landing-hero__logo { height: 132px; }
	.qa-landing-actions { flex-direction: column; align-items: stretch; width: 100%; }
	.qa-landing-actions .quada-btn { width: 100%; text-align: center; }
	.qa-landing-hero__stats { gap: 28px; margin-top: 64px; padding-top: 40px; }
}

/* --- Program detail hero: clean cinematic banner (no duplicate title) --- */
.quada-program-detail__hero {
	width: 100%;
	aspect-ratio: 21 / 8;
	min-height: 220px;
	border-radius: 18px;
	background-size: cover;
	background-position: center;
	background-color: #0a0a0c;
	position: relative;
	box-shadow: inset 0 -70px 90px -30px rgba(0,0,0,.85);
}

/* --- Login / auth: gradient kept inside the card only; page stays solid black --- */
.quada-auth {
	position: relative;
	padding: 60px 16px;
	/* transparent: the codex ambient body gradient shows through (2026-07-26) */
	background: transparent;
}
.quada-auth__panel {
	background:
		radial-gradient(circle at 50% 0%, rgba(255,140,0,.10), transparent 60%),
		linear-gradient(165deg, #1b1a20 0%, #141318 55%, #0d0d10 100%);
	border: 1px solid rgba(255,140,0,.20);
	border-radius: 20px;
	padding: 46px 40px 40px;
	max-width: 460px;
	box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.02) inset;
	text-align: center;
}
.quada-auth__logo { height: 112px; width: auto; margin: 0 auto 20px; display: block; }
.quada-auth__panel h2 { font-family: 'Poppins', sans-serif; font-size: 26px; text-align: center; }
.quada-auth__sub { text-align: center; }
.quada-auth__panel form { text-align: left; margin-top: 8px; }
.quada-auth__panel label { margin-bottom: 18px; }
.quada-auth__panel .quada-btn { margin-top: 6px; }

/* ====================== v1.8 — readability & polish fixes ====================== */

/* --- Module cards: solid grey gradient background for text legibility --- */
.quada-module {
	background: linear-gradient(160deg, #2a2a32 0%, #1f1f26 45%, #161619 100%) !important;
	border: 1px solid var(--qa-graphite) !important;
}
.quada-module__head {
	background: rgba(0,0,0,.30);
}
.quada-module--locked {
	opacity: .55;
}

/* --- Lesson study time badge in course outline --- */
.quada-lesson-list__study-time {
	color: var(--qa-orange);
	font-size: 11px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	padding: 3px 10px;
	background: rgba(255,140,0,.10);
	border-radius: 6px;
	border: 1px solid rgba(255,140,0,.25);
}
.quada-lesson-list__study-time::before {
	content: '⏱ ';
}
.quada-lesson-list__study-time.is-met {
	color: var(--qa-success);
	background: rgba(61,190,123,.10);
	border-color: rgba(61,190,123,.30);
}
.quada-lesson-list__study-time.is-met::before {
	content: '✓ ';
}

/* --- Dashboard cards: smooth grey gradient for enrollment & chart cards --- */
.quada-enrollment-card,
.quada-chart-card {
	background: linear-gradient(160deg, #24242c 0%, #1c1c22 45%, #141417 100%) !important;
}

/* --- Exam cards in course outline: grey gradient background --- */
.quada-course__exams .quada-enrollment-card {
	background: linear-gradient(160deg, #2a2a30 0%, #202026 45%, #16161a 100%) !important;
	border-color: var(--qa-graphite);
}

/* --- Enrollment grid: top spacing --- */
.quada-enrollment-grid {
	margin-top: 18px;
}

/* --- Landing hero stats: spacing + override Pivot theme .article-body ul bleed --- */
ul.qa-landing-hero__stats,
.qa-landing-hero__stats {
	margin-top: 64px !important;
	margin-bottom: 0 !important;
	margin-left: 0 !important;
	padding-top: 38px !important;
	padding-left: 0 !important;
	list-style: none !important;
}

/* --- Landing hero: top breathing room --- */
.qa-landing-hero__inner {
	padding-top: 110px !important;
}
@media (max-width: 640px) {
	.qa-landing-hero__inner { padding-top: 76px !important; }
}

/* --- Logos in cards: larger --- */
.quada-dashboard__logo {
	height: 82px;
	width: auto;
}
.quada-apply-hero img {
	height: 76px;
}
.qa-landing-hero__logo {
	height: 210px;
}

/* --- Tile cards: matching grey gradient --- */
.quada-tile {
	background: linear-gradient(160deg, #24242c 0%, #1c1c22 45%, #141417 100%);
}

/* --- Cert cards: grey gradient to match --- */
.quada-cert-card {
	background: linear-gradient(160deg, #24242c 0%, #1c1c22 45%, #141417 100%) !important;
}

/* ========== Cohort tab bar ========== */
.quada-cohort-tabs {
	display: flex;
	gap: 6px;
	padding: 4px;
	background: var(--qa-charcoal);
	border-radius: var(--qa-radius);
	margin-bottom: 24px;
	overflow-x: auto;
}
.quada-cohort-tab {
	flex: 1 0 auto;
	padding: 10px 18px;
	border: none;
	border-radius: 10px;
	background: transparent;
	color: var(--qa-mist);
	font-weight: 600;
	font-size: .85rem;
	cursor: pointer;
	transition: background .2s, color .2s;
	white-space: nowrap;
	text-decoration: none;
}
.quada-cohort-tab:hover { background: rgba(255,255,255,.06); color: var(--qa-white); }
.quada-cohort-tab--active { background: var(--qa-orange); color: var(--qa-black); }
.quada-cohort-tab__count {
	display: inline-block;
	background: rgba(255,255,255,.15);
	padding: 1px 7px;
	border-radius: 8px;
	font-size: .75rem;
	margin-left: 6px;
}
.quada-cohort-tab--active .quada-cohort-tab__count { background: rgba(0,0,0,.15); }
.quada-cohort-tab__count--full { background: rgba(228,87,46,.2); color: var(--qa-danger); }

/* ========== Student stat cards ========== */
.quada-student-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 16px;
	margin-top: 16px;
}
.quada-student-card {
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	padding: 16px;
}
.quada-student-card summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.quada-student-card summary::-webkit-details-marker { display: none; }
.quada-student-card summary::after {
	content: '▸';
	color: var(--qa-mist);
	transition: transform .2s;
	flex-shrink: 0;
}
.quada-student-card[open] summary::after { transform: rotate(90deg); }
.quada-student-card__info {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.quada-student-card__info strong {
	color: var(--qa-white);
	font-size: .95rem;
}
.quada-student-card__email {
	color: var(--qa-mist);
	font-size: .78rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.quada-student-card__stats {
	display: flex;
	gap: 6px;
	flex-shrink: 0;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.quada-student-card__badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: .75rem;
	padding: 3px 8px;
	border-radius: 6px;
	font-weight: 600;
}
.quada-student-card__badge--progress { background: rgba(61,190,123,.15); color: var(--qa-success); }
.quada-student-card__badge--exam { background: rgba(255,140,0,.15); color: var(--qa-orange); }
.quada-student-card__detail {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--qa-line);
	font-size: .85rem;
	color: var(--qa-mist);
}
.quada-student-card__detail table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 10px;
}
.quada-student-card__detail th,
.quada-student-card__detail td {
	padding: 6px 8px;
	text-align: left;
	border-bottom: 1px solid var(--qa-line);
	font-size: .8rem;
}
.quada-student-card__detail th { color: var(--qa-mist); font-weight: 600; }
.quada-student-card__detail td { color: var(--qa-white); }

/* ========== Cohort stats tiles ========== */
.quada-cohort-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 12px;
	margin-bottom: 20px;
}
.quada-cohort-stat {
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	padding: 14px;
	text-align: center;
}
.quada-cohort-stat__value {
	display: block;
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--qa-orange);
}
.quada-cohort-stat__label {
	font-size: .75rem;
	color: var(--qa-mist);
	text-transform: uppercase;
	letter-spacing: .5px;
}

/* ========== Report builder form ========== */
.quada-report-builder {
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	padding: 24px;
	margin-top: 20px;
}
.quada-report-builder h3 {
	color: var(--qa-white);
	margin: 0 0 16px;
}
.quada-report-builder label {
	display: block;
	color: var(--qa-mist);
	font-size: .85rem;
	margin-bottom: 14px;
}
.quada-report-builder input[type="text"],
.quada-report-builder select,
.quada-report-builder textarea {
	width: 100%;
	background: var(--qa-charcoal);
	border: 1px solid var(--qa-line);
	border-radius: 8px;
	color: var(--qa-white);
	padding: 10px 12px;
	font-size: .9rem;
	margin-top: 4px;
}
.quada-report-builder textarea { min-height: 80px; resize: vertical; }
.quada-report-sections {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 8px;
	margin: 12px 0 18px;
}
.quada-report-sections label {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--qa-charcoal);
	border-radius: 8px;
	font-size: .82rem;
	color: var(--qa-white);
	cursor: pointer;
	transition: background .15s;
}
.quada-report-sections label:hover { background: var(--qa-graphite); }
.quada-report-sections input[type="checkbox"] { accent-color: var(--qa-orange); }

.quada-reports-list {
	list-style: none;
	padding: 0;
	margin-top: 16px;
}
.quada-reports-list li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 14px;
	background: var(--qa-charcoal);
	border-radius: 8px;
	margin-bottom: 8px;
	color: var(--qa-white);
	font-size: .85rem;
}
.quada-reports-list time { color: var(--qa-mist); font-size: .78rem; }

/* ========== Feedback course toggle ========== */
.quada-feedback-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 18px;
}
.quada-feedback-tab {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--qa-surface);
	border: 1px solid var(--qa-graphite);
	color: var(--qa-mist);
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.2;
	padding: 10px 18px;
	border-radius: 999px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.quada-feedback-tab:hover { border-color: var(--qa-orange); color: var(--qa-white); }
.quada-feedback-tab.is-active {
	background: var(--qa-orange);
	border-color: var(--qa-orange);
	color: var(--qa-black);
}
.quada-feedback-tab__check {
	font-size: 12px;
	font-weight: 800;
	color: var(--qa-success);
}
.quada-feedback-tab.is-active .quada-feedback-tab__check { color: var(--qa-black); }
.quada-feedback-panel[hidden] { display: none; }

/* ========== Feedback star ratings ========== */
.quada-feedback-form {
	max-width: 680px;
}
.quada-feedback-form fieldset {
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	padding: 20px 24px;
	margin-bottom: 20px;
}
.quada-feedback-form legend {
	color: var(--qa-orange);
	font-weight: 700;
	font-size: .95rem;
	padding: 0 8px;
}
.quada-star-group {
	margin-bottom: 16px;
}
.quada-star-group__label {
	display: block;
	color: var(--qa-mist);
	font-size: .85rem;
	margin-bottom: 6px;
}
.quada-stars {
	display: inline-flex;
	flex-direction: row-reverse;
	gap: 2px;
}
.quada-stars input { display: none; }
.quada-stars label {
	cursor: pointer;
	font-size: 1.5rem;
	color: var(--qa-graphite);
	transition: color .15s;
}
.quada-stars label::before { content: '★'; }
.quada-stars input:checked ~ label,
.quada-stars label:hover,
.quada-stars label:hover ~ label { color: var(--qa-orange); }

.quada-feedback-form textarea,
.quada-feedback-form select {
	width: 100%;
	background: var(--qa-charcoal);
	border: 1px solid var(--qa-line);
	border-radius: 8px;
	color: var(--qa-white);
	padding: 10px 12px;
	font-size: .9rem;
	margin-top: 4px;
}
.quada-feedback-form textarea { min-height: 60px; resize: vertical; }

/* ========== Pre-assessment radio & checkbox groups ========== */
.quada-radio-group,
.quada-checkbox-group {
	margin-bottom: 16px;
}
.quada-radio-group__label,
.quada-checkbox-group__label {
	display: block;
	color: var(--qa-mist);
	font-weight: 600;
	font-size: .85rem;
	margin-bottom: 8px;
}
.quada-radio-group__options,
.quada-checkbox-group__options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.quada-radio-group__options label,
.quada-checkbox-group__options label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: var(--qa-charcoal);
	border: 1px solid var(--qa-line);
	border-radius: 8px;
	color: var(--qa-white);
	font-size: .85rem;
	cursor: pointer;
	transition: border-color .15s, background .15s;
}
.quada-radio-group__options label:hover,
.quada-checkbox-group__options label:hover {
	border-color: var(--qa-orange);
	background: rgba(255,140,0,.06);
}
.quada-radio-group__options input,
.quada-checkbox-group__options input {
	accent-color: var(--qa-orange);
}

/* ========== Dashboard section tabs ========== */
.quada-dash-tabs {
	display: flex;
	gap: 4px;
	border-bottom: 2px solid var(--qa-line);
	margin-bottom: 24px;
	padding-bottom: 0;
}
.quada-dash-tab {
	padding: 10px 20px;
	border: none;
	background: transparent;
	color: var(--qa-mist);
	font-weight: 600;
	font-size: .9rem;
	cursor: pointer;
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
	transition: color .15s, border-color .15s;
}
.quada-dash-tab:hover { color: var(--qa-white); }
.quada-dash-tab.active {
	color: var(--qa-orange);
	border-bottom-color: var(--qa-orange);
}
.quada-dash-section { display: none; }
.quada-dash-section.active { display: block; }

/* ========== FAQ accordion ==========
   px units only — the Pivot theme sets html{font-size:10px}, so rem values
   rendered ~9px here ([[quada-theme-10px-root-font]] gotcha). No own margins:
   .quada-program-detail's 30px flex gap is the single source of section
   rhythm (the old 32px margin stacked on the gap → 62px hole after
   "What you will study"). */
.quada-program-detail__faq { margin: 0; }
/* The theme gives every <section> 64px vertical padding — inside the program
   detail that stacked with the 30px container gap into ~160px holes between
   blocks. The container gap is the only rhythm here. */
.quada-program-detail section { padding: 0; }
.quada-faq-list { display: flex; flex-direction: column; gap: 12px; margin-top: 0; }
.quada-faq-item {
	background: var(--qa-surface);
	border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius);
	overflow: hidden;
}
.quada-faq-item summary {
	padding: 18px 22px;
	cursor: pointer;
	font-weight: 600;
	color: var(--qa-white);
	font-size: 16px;
	line-height: 1.45;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
}
.quada-faq-item summary::-webkit-details-marker { display: none; }
.quada-faq-item summary::after {
	content: '+';
	font-size: 20px;
	line-height: 1;
	color: var(--qa-orange);
	flex: none;
	transition: transform .2s;
}
.quada-faq-item[open] summary::after { content: '−'; }
.quada-faq-item__answer {
	padding: 0 22px 18px;
	color: var(--qa-mist);
	font-size: 15px;
	line-height: 1.65;
}
.quada-faq-item__answer p { margin: 0 0 10px; }
.quada-faq-item__answer p:last-child { margin-bottom: 0; }
@media (max-width: 600px) {
	.quada-faq-item summary { padding: 15px 16px; font-size: 15px; }
	.quada-faq-item__answer { padding: 0 16px 15px; font-size: 14px; }
	.quada-program-detail { gap: 24px; }
}

/* ========== Form actions row ========== */
.quada-form__actions {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 16px;
}

/* ========== v1.9 — readability & spacing fixes ========== */

/* --- Chart grid: prevent card text overflow and ensure spacing --- */
.quada-chart-grid {
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 22px;
}
.quada-chart-card {
	min-width: 0;
	overflow: hidden;
}
.quada-chart-card .quada-section-title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
	display: block;
}

/* --- Course manager module sections: soft grey gradient background --- */
.quada-manage__module {
	background: linear-gradient(160deg, #2e2e36 0%, #252530 35%, #1e1e26 70%, #18181e 100%) !important;
	border: 1px solid var(--qa-graphite) !important;
}
.quada-manage__module > header {
	background: linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01)) !important;
}

/* --- Exam sections in manage view: soft grey gradient --- */
.quada-manage .quada-course__exams .quada-card {
	background: linear-gradient(160deg, #2e2e36 0%, #252530 35%, #1e1e26 70%, #18181e 100%) !important;
}

/* --- All academy tables: uniform dark-grey gradient design --- */
.quada-table-wrap {
	background: linear-gradient(160deg, #28282f 0%, #212128 40%, #1a1a20 80%, #151518 100%);
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	overflow: hidden;
	margin: 1.6rem 0;
}
.quada-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
.quada-table th {
	text-align: left;
	color: var(--qa-orange) !important;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding: 12px 16px;
	background: linear-gradient(180deg, #2e2d35 0%, #252429 100%) !important;
	border-bottom: 2px solid var(--qa-orange);
}
.quada-table td {
	padding: 12px 16px;
	border-bottom: 1px solid rgba(255,255,255,.07);
	color: var(--qa-mist) !important;
	background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
	vertical-align: middle;
}
.quada-table tbody tr:nth-child(even) td {
	background: linear-gradient(180deg, #232229 0%, #1f1e25 100%) !important;
}
.quada-table tbody tr:last-child td {
	border-bottom: none;
}
.quada-table tbody tr:hover td {
	background: linear-gradient(180deg, #2c2b33 0%, #28272f 100%) !important;
}

/* Trainer tables (Pending Applications / Pending Payments / Retake Requests)
   stack into labelled cards on mobile — each cell shows its column name from
   the data-label attribute, no sideways scroll. */
@media (max-width: 640px) {
	.quada-table-wrap { background: none; border: none; overflow: visible; }
	.quada-table,
	.quada-table tbody,
	.quada-table tr,
	.quada-table td { display: block; width: auto; }
	.quada-table thead { display: none; }
	.quada-table tbody tr,
	.quada-table tbody tr:nth-child(even) {
		background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
		border: 1px solid var(--qa-graphite);
		border-radius: 12px;
		padding: 6px 14px 10px;
		margin-bottom: 12px;
		overflow: hidden;
	}
	.quada-table tbody td,
	.quada-table tbody tr:nth-child(even) td {
		background: none !important;
		border: none;
		border-bottom: 1px dashed rgba(255,255,255,.08);
		padding: 9px 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		text-align: right;
		font-size: 14px;
		flex-wrap: wrap;
	}
	.quada-table tbody tr td:last-child { border-bottom: none; }
	.quada-table tbody td::before {
		content: attr(data-label);
		color: var(--qa-orange);
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: .08em;
		text-align: left;
		flex: none;
	}
	/* the actions cell: label on its own line, buttons full-width below */
	.quada-table tbody td[data-label="Decision"] { flex-direction: column; align-items: stretch; text-align: left; gap: 8px; }
	.quada-table tbody td[data-label="Decision"] .quada-btn { display: block; text-align: center; }
}

/* --- Enrollment grid cards: prevent title overflow --- */
.quada-enrollment-card h4 {
	word-break: break-word;
	overflow-wrap: break-word;
	hyphens: auto;
	line-height: 1.3;
}

/* =========================================================
   CAPP Lesson Body — student-facing lesson content styles
   ========================================================= */

/* Banner strip at the top of each lesson */
.quada-lesson-body .quada-lesson-banner {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	background: var(--qa-graphite);
	border-left: 4px solid var(--qa-orange);
	border-radius: 8px;
	padding: 12px 18px;
	margin-bottom: 32px;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--qa-mist);
}
.quada-lesson-body .quada-lesson-banner .qlb-code {
	color: var(--qa-orange);
}
.quada-lesson-body .quada-lesson-banner .qlb-duration,
.quada-lesson-body .quada-lesson-banner .qlb-mode {
	color: var(--qa-white);
	opacity: 0.7;
}

/* Headings */
.quada-lesson-body h2 {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--qa-white);
	margin: 2rem 0 0.6rem;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--qa-line);
}
.quada-lesson-body h3 {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--qa-orange);
	margin: 1.4rem 0 0.4rem;
}
.quada-lesson-body h4 {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--qa-white);
	margin: 1.2rem 0 0.3rem;
}

/* Body text */
.quada-lesson-body p {
	color: var(--qa-mist);
	line-height: 1.75;
	margin-bottom: 1rem;
}

/* Lists */
.quada-lesson-body ul,
.quada-lesson-body ol {
	color: var(--qa-mist);
	line-height: 1.75;
	padding-left: 1.4rem;
	margin-bottom: 1rem;
}
.quada-lesson-body ul li,
.quada-lesson-body ol li {
	margin-bottom: 0.4rem;
}
.quada-lesson-body li strong {
	color: var(--qa-white);
}

/* Code / pre */
.quada-lesson-body code {
	background: var(--qa-graphite);
	color: var(--qa-orange);
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 0.85em;
	font-family: "Fira Code", "Consolas", monospace;
}
.quada-lesson-body pre {
	background: var(--qa-graphite);
	border-radius: 8px;
	padding: 16px 20px;
	overflow-x: auto;
	margin-bottom: 1.2rem;
}
.quada-lesson-body pre code {
	background: none;
	padding: 0;
	color: var(--qa-mist);
	font-size: 0.82rem;
	line-height: 1.7;
}

/* Activity block */
.quada-lesson-body .quada-activity {
	background: linear-gradient(135deg, rgba(255,140,0,.07), rgba(255,140,0,.03));
	border: 1px solid rgba(255,140,0,.3);
	border-radius: 10px;
	padding: 20px 24px;
	margin: 1.5rem 0;
}
.quada-lesson-body .quada-activity h3 {
	color: var(--qa-orange);
	margin-top: 0;
}

/* Key terms DL */
.quada-lesson-body .quada-terms dl {
	display: grid;
	grid-template-columns: minmax(160px, 220px) 1fr;
	gap: 0;
	background: var(--qa-graphite);
	border-radius: 10px;
	overflow: hidden;
	margin-bottom: 1.2rem;
}
.quada-lesson-body .quada-terms dt,
.quada-lesson-body .quada-terms dd {
	padding: 10px 14px;
	border-bottom: 1px solid var(--qa-line);
	font-size: 0.9375rem;
	margin: 0;
}
.quada-lesson-body .quada-terms dt {
	font-weight: 700;
	color: var(--qa-orange);
	border-right: 1px solid var(--qa-line);
}
.quada-lesson-body .quada-terms dd {
	color: var(--qa-mist);
}

/* Knowledge check */
.quada-lesson-body .quada-quiz {
	background: var(--qa-graphite);
	border-radius: 10px;
	padding: 16px 24px;
	margin: 1rem 0;
}
.quada-lesson-body .quada-quiz ol {
	color: var(--qa-mist);
	margin: 0;
}

/* ── Lesson tables: soft dark-grey gradient ── */
.quada-lesson__content table,
.quada-lesson-body table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1.6rem;
	font-size: 14px;
	border-radius: 8px;
	overflow: hidden;
}
.quada-lesson__content table th,
.quada-lesson-body table th {
	background: linear-gradient(180deg, #2e2d35 0%, #252429 100%) !important;
	color: var(--qa-orange) !important;
	font-weight: 700;
	padding: 10px 16px;
	text-align: left;
	border-bottom: 2px solid var(--qa-orange);
	white-space: nowrap;
}
.quada-lesson__content table td,
.quada-lesson-body table td {
	padding: 10px 16px;
	color: var(--qa-mist) !important;
	background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.07);
	vertical-align: top;
	line-height: 1.5;
}
.quada-lesson__content table tr:nth-child(even) td,
.quada-lesson-body table tr:nth-child(even) td {
	background: linear-gradient(180deg, #232229 0%, #1f1e25 100%) !important;
}
.quada-lesson__content table tr:hover td,
.quada-lesson-body table tr:hover td {
	background: linear-gradient(180deg, #2c2b33 0%, #28272f 100%) !important;
}
.quada-lesson__content table tr:last-child td,
.quada-lesson-body table tr:last-child td {
	border-bottom: none;
}

/* HR dividers */
.quada-lesson-body hr {
	border: none;
	border-top: 1px solid var(--qa-line);
	margin: 2rem 0;
}

/* kbd elements */
.quada-lesson-body kbd {
	background: var(--qa-graphite);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: 4px;
	padding: 2px 7px;
	font-size: 0.82em;
	color: var(--qa-white);
	font-family: monospace;
}

/* ─── Trainer preview exam banner ────────────────────────────────────────── */
.quada-trainer-banner {
	background: #7c4a00;
	border: 2px solid var(--qa-orange);
	color: var(--qa-orange);
	border-radius: 8px;
	padding: 10px 16px;
	font-size: 0.875rem;
	margin-bottom: 1.5rem;
	text-align: center;
	letter-spacing: 0.03em;
}
.quada-trainer-banner--footer { margin-top: 2rem; margin-bottom: 0; }
.quada-exam--preview .quada-exam__option.is-correct-answer {
	border: 1px solid var(--qa-orange);
	background: rgba(255,140,0,.08);
	border-radius: 6px;
}
.quada-answer-tick {
	margin-left: auto;
	color: var(--qa-orange);
	font-size: 0.8rem;
	font-weight: 700;
}

/* ─── Anti-cheat overlay ─────────────────────────────────────────────────── */
.quada-ac-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.85);
	z-index: 9999;
	align-items: center;
	justify-content: center;
}
.quada-ac-overlay.is-visible { display: flex; }
.quada-ac-overlay__box {
	background: var(--qa-graphite);
	border: 2px solid var(--qa-orange);
	border-radius: 12px;
	padding: 2rem 2.5rem;
	max-width: 480px;
	text-align: center;
}
.quada-ac-overlay__title {
	color: var(--qa-orange);
	font-size: 1.25rem;
	margin-bottom: 0.75rem;
}
.quada-ac-overlay__msg {
	color: var(--qa-mist);
	margin-bottom: 1.5rem;
	line-height: 1.6;
}
.quada-ac-overlay.is-final .quada-ac-overlay__box {
	border-color: #e53e3e;
}
.quada-ac-overlay.is-final .quada-ac-overlay__title {
	color: #e53e3e;
}

/* ─── Exam instruction modal ─────────────────────────────────────────────── */
.quada-instr-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.8);
	z-index: 9990;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.quada-instr-overlay.is-open { display: flex; }
.quada-instr-box {
	background: var(--qa-surface);
	border: 1px solid rgba(255, 140, 0, .48);
	border-radius: var(--qa-radius);
	box-shadow: 0 24px 80px rgba(0, 0, 0, .55);
	padding: 28px;
	max-width: 640px;
	width: 100%;
	text-align: left;
}
.quada-instr-head {
	margin-bottom: 20px;
	text-align: left;
}
.quada-instr-kicker {
	color: var(--qa-orange);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .14em;
	margin: 0 0 6px;
	text-transform: uppercase;
}
.quada-instr-title {
	color: var(--qa-white);
	font-size: 26px;
	font-family: 'Poppins', sans-serif;
	margin: 0;
}
.quada-instr-subtitle {
	color: var(--qa-mist);
	margin: 8px 0 0;
	line-height: 1.55;
}
.quada-instr-summary {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 22px 0 24px;
	align-items: stretch;
}
/* Defensive: ignore any stray <br> auto-inserted between grid/flex boxes. */
.quada-instr-summary br,
.quada-exam__facts br { display: none; }
.quada-instr-summary span {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-width: 0;
	padding: 18px 12px;
	background: var(--qa-black);
	border: 1px solid var(--qa-graphite);
	border-radius: 8px;
	color: var(--qa-mist);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	line-height: 1.3;
	text-align: center;
	text-transform: uppercase;
}
.quada-instr-summary strong {
	display: block;
	color: var(--qa-white);
	font-size: 20px;
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1.1;
	text-transform: none;
}
.quada-instr-rules {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 0 28px !important;
}
.quada-instr-rules li {
	list-style: none !important;
	color: var(--qa-mist);
	padding: 12px 0 12px 26px;
	border-bottom: 1px solid var(--qa-line);
	position: relative;
	line-height: 1.6;
	font-size: 14px;
	text-align: left;
}
.quada-instr-rules li::before {
	content: '▸';
	color: var(--qa-orange);
	position: absolute;
	left: 0;
	top: 10px;
}
.quada-instr-rules li:last-child { border-bottom: none; }
.quada-instr-actions {
	display: flex;
	gap: 1rem;
	justify-content: flex-end;
	align-items: center;
	padding-top: 8px;
}
.quada-instr-actions .quada-btn {
	min-width: 180px;
	text-align: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 28px;
	font-size: 15px;
}
@media (max-width: 560px) {
	.quada-instr-box { padding: 22px; }
	.quada-instr-summary { grid-template-columns: 1fr; }
	.quada-instr-actions { flex-direction: column-reverse; }
	.quada-instr-actions .quada-btn { width: 100%; }
}

/* ─── Exam intro panel — wider + better typography ───────────────────────── */
.quada-exam.quada-auth__panel {
	max-width: 720px;
	text-align: left;
	padding: 40px 44px 36px;
}
.quada-exam.quada-auth__panel h2 {
	font-size: 30px;
	text-align: left;
	margin: 0 0 10px;
	line-height: 1.25;
}
.quada-exam.quada-auth__panel .quada-exam__desc {
	font-size: 15px;
	line-height: 1.65;
	color: var(--qa-mist);
	margin-bottom: 22px;
}
.quada-exam.quada-auth__panel > .quada-btn {
	margin-top: 24px;
	font-size: 17px;
	padding: 16px 36px;
	letter-spacing: 0.03em;
}
.quada-exam.quada-auth__panel .quada-lesson__back {
	font-size: 13px;
	color: var(--qa-mist);
	text-decoration: none;
	display: inline-block;
	margin-bottom: 18px;
}
.quada-exam.quada-auth__panel .quada-lesson__back:hover { color: var(--qa-orange); }

/* ─── One-question-at-a-time live exam ───────────────────────────────────── */
.quada-exam__title {
	font-weight: 700;
	color: var(--qa-white);
	font-size: 22px;
	font-family: 'Poppins', sans-serif;
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.quada-exam__progress-label {
	color: var(--qa-orange);
	font-size: 16px;
	font-weight: 700;
	white-space: nowrap;
}
.quada-exam__stepbar {
	height: 5px;
	background: var(--qa-line);
	border-radius: 3px;
	margin: 0.75rem 0 1.75rem;
	overflow: hidden;
}
.quada-exam__stepbar-fill {
	height: 100%;
	background: var(--qa-orange);
	border-radius: 3px;
	transition: width 0.35s ease;
}
/* Scope to live exam — preserve card styling in trainer preview */
.quada-exam--live .quada-exam__question {
	border: 1px solid var(--qa-graphite);
	border-radius: var(--qa-radius);
	background: var(--qa-surface);
	padding: 28px 28px 20px;
	margin: 0 0 1.5rem;
}
.quada-exam--live .quada-exam__question legend {
	font-size: 22px;
	font-weight: 700;
	padding: 0 8px;
	line-height: 1.45;
	font-family: 'Poppins', sans-serif;
}
@keyframes qaSlideIn {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: translateY(0); }
}
.quada-exam--live .quada-exam__question:not([style*="none"]) {
	animation: qaSlideIn 0.22s ease;
}
.quada-exam__nav {
	display: flex;
	gap: 1rem;
	align-items: center;
	padding: 1.5rem 0 0.5rem;
	margin-top: 0.5rem;
	border-top: 1px solid var(--qa-line);
}
.quada-exam__nav .quada-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-width: 140px;
	padding: 13px 28px;
	font-size: 15px;
	gap: 6px;
}
.quada-exam__nav #qa-next,
.quada-exam__nav #qa-submit { margin-left: auto; }
/* Submit button — distinct from Next */
.quada-btn--submit {
	background: var(--qa-success, #22c55e);
	color: #000 !important;
	font-size: 16px;
	padding: 14px 40px;
	min-width: 180px;
}
.quada-btn--submit:hover { background: #16a34a; }

/* -------------------------------------------------------------------------
   Lesson content design system (LOOP-3.6) — brand-styled, px-based for the
   10px-root-font theme, vector-first for 2G.
   ------------------------------------------------------------------------- */
.quada-lesson__content { font-size: 16px; line-height: 1.72; color: #dcdce0; background: #141417; padding: 24px 26px; border-radius: 12px; }
.quada-lesson__content p { margin: 0 0 14px; }
.quada-lesson__content h3 {
	font-size: 19px; font-weight: 700; color: #ffffff;
	margin: 30px 0 12px; padding: 2px 0 2px 14px; border-left: 4px solid #FF8C00;
}
.quada-lesson-intro { font-size: 17px; color: #b9b9c0; margin-bottom: 22px; }

.quada-lh {
	display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
	background: #000000; color: #fff; border: 1px solid #2a2a30; border-radius: 10px; padding: 13px 18px; margin: 0 0 22px;
}
.quada-lh__code { background: #FF8C00; color: #0E0E10; font-weight: 700; font-size: 13px; padding: 4px 10px; border-radius: 6px; letter-spacing: .3px; }
.quada-lh__title { font-weight: 600; font-size: 15px; color: #fff; }
.quada-lh__meta { margin-left: auto; font-size: 13px; color: #8a8a92; }

.quada-objectives { background: #1c1c22; border: 1px solid #2c2c34; border-left: 4px solid #FF8C00; border-radius: 8px; padding: 14px 20px; margin: 0 0 24px; }
.quada-objectives__label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: #FF8C00; margin-bottom: 6px; }
.quada-objectives ul { margin: 0; padding-left: 20px; }
.quada-objectives li { margin: 4px 0; }

.quada-figure { margin: 22px 0; background: #0b0b0d; border: 1px solid #2a2a30; border-radius: 8px; padding: 16px; text-align: center; }
.quada-figure svg { max-width: 100%; height: auto; display: block; margin: 0 auto; }
.quada-figure figcaption { font-size: 13px; color: #9a9aa2; margin-top: 10px; }

.quada-table { width: 100%; border-collapse: collapse; margin: 22px 0; font-size: 14px; color: #dcdce0; }
.quada-table thead th { background: #FF8C00; color: #0E0E10; font-weight: 700; text-align: left; padding: 10px 12px; }
.quada-table thead th:not(:first-child), .quada-table tbody td:not(:first-child) { text-align: right; }
.quada-table tbody td { padding: 9px 12px; border-bottom: 1px solid #2a2a30; }
.quada-table tbody tr:nth-child(odd) { background: #161619; }
.quada-table tbody tr:nth-child(even) { background: #1d1d22; }

.quada-eq { background: #000000; color: #FF8C00; font-family: "DejaVu Sans Mono", Menlo, monospace; font-size: 16px; text-align: center; padding: 12px 16px; border-radius: 6px; margin: 16px 0; border: 1px solid #2a2a30; }

.quada-callout { border-radius: 8px; padding: 13px 18px; margin: 18px 0; border-left: 4px solid #555; color: #dcdce0; }
.quada-callout__label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
.quada-callout p { margin: 0; }
.quada-callout--key { background: #13202e; border-left-color: #3a9bdc; }
.quada-callout--key .quada-callout__label { color: #5db4ee; }
.quada-callout--field { background: #2a1d0c; border-left-color: #FF8C00; }
.quada-callout--field .quada-callout__label { color: #ffb05a; }
.quada-callout--example { background: #13230f; border-left-color: #6db33a; }
.quada-callout--example .quada-callout__label { color: #92d05d; }

.quada-summary { background: #1c1c22; border: 1px solid #2c2c34; border-left: 4px solid #FF8C00; border-radius: 10px; padding: 6px 22px 18px; margin: 26px 0 0; }
.quada-summary h3 { border: 0; padding: 0; margin: 16px 0 8px; color: #fff; }
.quada-summary ul { margin: 0; padding-left: 20px; }
/* ============================================================
   Quad-A round-3 additions: program-card hover + WooCommerce
   (px units — the Pivot theme sets html{font-size:10px})
   ============================================================ */

/* Program cards: greyscale the media (background image) by default, full
   colour on hover. The pricing badge is rendered OUTSIDE .quada-program-card__media
   (a direct child of the card) so it stays in full colour and keeps its
   top-right corner position. */
.quada-program-card{ position:relative; }
/* (whole-div grayscale removed 2026-07-26 — it washed out the type tag and
   title overlaid on the image; the B&W effect now lives on ::after above) */
.quada-program-card > .quada-badge{ position:absolute; top:14px; right:14px; z-index:6; filter:none; }

/* ---------- WooCommerce: cart / checkout / account / order ---------- */
.woocommerce, .woocommerce-page{ font-size:16px; line-height:1.6; color:#1f1f24; }
.woocommerce .woocommerce-billing-fields h3,
.woocommerce-checkout h3, .woocommerce-account h2, .woocommerce h2,
.woocommerce #order_review_heading{
	font-size:20px; font-weight:700; color:#0E0E10; margin:18px 0 12px;
	padding-bottom:8px; border-bottom:2px solid #FF8C00;
}
/* Layout width for checkout */
.woocommerce-checkout .woocommerce, .woocommerce-cart .woocommerce,
.woocommerce-account .woocommerce, .woocommerce-order-received .woocommerce{
	max-width:1080px; margin-left:auto; margin-right:auto;
}
/* Form fields */
.woocommerce form .form-row label{ font-size:14px; font-weight:600; color:#33333a; margin-bottom:4px; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .select2-container .select2-selection,
.woocommerce form .form-row select,
.woocommerce #order_comments{
	font-size:15px; padding:12px 14px; border:1px solid #d4d4dc; border-radius:8px;
	background:#fff; color:#1f1f24; box-shadow:none; min-height:46px; line-height:1.4;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{
	border-color:#FF8C00; outline:none; box-shadow:0 0 0 3px rgba(255,140,0,.18);
}
.select2-container--default .select2-selection--single .select2-selection__rendered{ line-height:44px; font-size:15px; }
.select2-container--default .select2-selection--single{ height:46px; }
/* Tables (cart + order review) */
.woocommerce table.shop_table{ border:1px solid #e6e6ec; border-radius:10px; border-collapse:separate; overflow:hidden; font-size:15px; }
.woocommerce table.shop_table thead th,
.woocommerce table.shop_table tfoot th{ background:#0E0E10; color:#fff; font-weight:700; padding:14px; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td{ padding:14px; border-top:1px solid #eee; }
.woocommerce table.shop_table tfoot .order-total .amount{ color:#FF8C00; font-size:18px; }
/* Buttons */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #place_order, .woocommerce #payment #place_order,
.woocommerce a.button.alt, .woocommerce button.button.alt{
	background:#FF8C00; color:#0E0E10; font-weight:700; font-size:16px;
	border:none; border-radius:8px; padding:14px 26px; text-transform:none;
	transition:background .2s ease, transform .1s ease; box-shadow:none;
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce #place_order:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{
	background:#e67e00; color:#0E0E10; transform:translateY(-1px);
}
#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment{
	background:#faf8f4; border:1px solid #ececf1; border-radius:12px;
}
.woocommerce-checkout #payment ul.payment_methods{ border-bottom:1px solid #ececf1; padding:16px 18px; }
.woocommerce-checkout #payment ul.payment_methods li{ font-size:15px; margin:6px 0; }
.woocommerce-checkout #payment ul.payment_methods li input{ margin-right:8px; }
.woocommerce-checkout #payment div.payment_box{ background:#fff; border-radius:8px; font-size:14px; }
.woocommerce-checkout #payment div.payment_box::before{ border-bottom-color:#fff; }
.woocommerce #payment .place-order{ padding:18px; }
/* Notices */
.woocommerce-info, .woocommerce-message, .woocommerce-noticed{
	border-top-color:#FF8C00; background:#fff7ee; font-size:15px; border-radius:8px;
}
.woocommerce-info::before, .woocommerce-message::before{ color:#FF8C00; }
.woocommerce-error{ border-top-color:#b00020; background:#fdecec; border-radius:8px; }
/* Order received / thank-you */
.woocommerce ul.order_details{ background:#faf8f4; border-radius:10px; padding:20px; }
.woocommerce ul.order_details li{ border-right:1px solid #e2e2e8; font-size:13px; }
.woocommerce ul.order_details li strong{ font-size:17px; color:#0E0E10; }
/* Coupon row */
.woocommerce .cart .coupon .input-text{ min-width:180px; }
@media (max-width:782px){
	.woocommerce-checkout .col2-set .col-1, .woocommerce-checkout .col2-set .col-2{ width:100%; float:none; }
}

/* ============================================================
   Wave 4 (LOOP-3.4) — accessibility + responsive hardening layer.
   Appended last so it overrides earlier rules. WCAG 2.1 AA.
   See _loop-state/BUILD-FRONTEND.md.
   ============================================================ */

/* ---- Screen-reader-only utility + skip link (WCAG 2.4.1, 1.3.1) ---- */
.quada-sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0);
	white-space: nowrap; border: 0;
}
.quada-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	background: var(--qa-orange);
	color: var(--qa-black);
	font-weight: 700;
	padding: 12px 20px;
	border-radius: 0 0 var(--qa-radius-sm) 0;
	text-decoration: none;
}
.quada-skip-link:focus {
	left: 0;
}

/* ---- Visible keyboard focus everywhere (WCAG 2.4.7).
   Mouse clicks stay clean via :focus-visible; keyboard users get the ring. ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.quada-btn:focus-visible,
.quada-program-card a:focus-visible,
summary:focus-visible {
	outline: var(--qa-focus-outline);
	outline-offset: 2px;
	box-shadow: var(--qa-focus-ring);
	border-radius: var(--qa-radius-sm);
}
/* Keep focus-within on cards so the whole card lifts when a child is focused. */
.quada-program-card:focus-within {
	outline: var(--qa-focus-outline);
	outline-offset: 2px;
}

/* ---- Touch-target floor (WCAG 2.5.5 / 2.5.8): 44x44 for anything tappable ---- */
.quada-btn,
.quada-btn--sm,
.quada-exam__nav .quada-btn,
.quada-instr-actions .quada-btn,
.quada-tabs a,
.quada-pagination a,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #place_order {
	min-height: var(--qa-touch-min);
}
/* Icon-only / small controls keep a 44px hit area even if visually smaller. */
.quada-iconbtn,
.quada-remove,
.remove,
.quada-qty button {
	min-width: var(--qa-touch-min);
	min-height: var(--qa-touch-min);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
/* Form controls comfortable for touch (auth + apply panels). */
.quada-auth__panel input,
.quada-auth__panel select,
.quada-auth__panel textarea,
.quada-apply input,
.quada-apply select,
.quada-apply textarea {
	min-height: var(--qa-touch-min);
}

/* ---- Reduced motion (WCAG 2.3.3): kill the shine sweep, slide-ins, transitions ---- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.quada-btn::after { display: none; }
	.quada-exam--live .quada-exam__question:not([style*="none"]) { animation: none; }
}

/* ---- Canonical responsive breakpoints (320 / 375 / 768 / 1024 / 1440).
   The card/stat/chart grids already use auto-fit/auto-fill minmax(), so they
   reflow fluidly from 1 column at 320px up to 4 at 1440px with no fixed-column
   query needed — do NOT override them. These rules add only what fluid grids
   can't: a desktop line-length cap and small-phone overflow safety. ---- */

/* Desktop ≥1440: cap line length so content doesn't stretch edge-to-edge. */
@media (min-width: 1440px) {
	.quada-dashboard,
	.quada-catalog,
	.quada-landing__inner,
	.quada-course,
	.quada-lesson {
		max-width: var(--qa-container);
		margin-left: auto;
		margin-right: auto;
	}
}

/* Small phone ≤375: stack the lesson header, wrap long words, make wide
   tables scroll inside their box instead of overflowing the viewport. */
@media (max-width: 480px) {
	.quada-lh { flex-direction: column; align-items: flex-start; }
	.quada-lh__meta { margin-left: 0; }
	.quada-lesson__content { padding: 18px 16px; word-break: break-word; }
	.quada-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* 320px hard floor: keep CTAs and panels inside the narrowest supported screen. */
@media (max-width: 360px) {
	.quada-btn { padding-left: 18px; padding-right: 18px; }
	.quada-auth__panel { padding: 28px 20px; }
}

/* =========================================================================
   Engagement row — gamification, leaderboard, announcements, knowledge base
   (My Academy dashboard). Px units so the 10px-root Pivot theme can't shrink.
   ========================================================================= */
.quada-engage-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin: 24px 0;
	align-items: stretch;
}
.quada-engage-grid--2 { grid-template-columns: repeat(2, 1fr); }
.quada-engage-grid > .quada-engage { height: 100%; }
@media (max-width: 1024px) {
	.quada-engage-grid,
	.quada-engage-grid--2 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
	.quada-engage-grid,
	.quada-engage-grid--2 { grid-template-columns: 1fr; }
}
.quada-engage { display: flex; flex-direction: column; padding: 28px; }
.quada-engage .quada-section-title { margin: 0 0 12px; }

/* ---- My Learning Points card (gamification) ---- */
.quada-points { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.quada-points__value { font-size: 44px; font-weight: 800; color: var(--qa-orange); line-height: 1; }
.quada-points__label { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--qa-mist); }
.quada-points__meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.quada-points__badge-none { font-size: 13px; color: var(--qa-mist); }
.quada-points__rank { font-weight: 700; color: var(--qa-white); font-size: 14px; }
.quada-points__log { list-style: none; margin: 18px 0 0; padding: 0; }
.quada-points__log li {
	display: flex; justify-content: space-between; gap: 12px;
	padding: 9px 0; border-top: 1px solid var(--qa-line); font-size: 13px;
}
.quada-points__log-reason { color: var(--qa-mist); }
.quada-points__log-pts { color: var(--qa-orange); font-weight: 700; font-variant-numeric: tabular-nums; }
.quada-points__cta { margin-top: auto; align-self: flex-start; }

/* ---- Leaderboard (FEAT-2 design — followed from quada-merged-c) ---- */
.quada-leaderboard { width: 100%; }
.quada-leaderboard__me {
	display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px;
	padding: 16px; margin-bottom: 16px;
	background: var(--qa-black); color: var(--qa-white); border-radius: var(--qa-radius-sm);
}
.quada-leaderboard__me-points { font-size: 28px; font-weight: 700; color: var(--qa-orange); line-height: 1; }
.quada-leaderboard__me-label { font-size: 13px; text-transform: uppercase; letter-spacing: 1px; opacity: .8; }
.quada-leaderboard__me-rank { margin-left: auto; font-size: 14px; }
.quada-leaderboard__list { list-style: none; margin: 0; padding: 0; }
.quada-leaderboard__row {
	display: flex; align-items: center; gap: 12px;
	padding: 10px 12px; border-bottom: 1px solid var(--qa-line);
}
.quada-leaderboard__row.is-me { background: rgba(255,140,0,.12); border-radius: 6px; }
.quada-leaderboard__rank { width: 28px; font-weight: 700; color: var(--qa-mist); text-align: center; }
.quada-leaderboard__name { flex: 1; font-weight: 600; color: var(--qa-white); }
.quada-leaderboard__points { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--qa-orange); }
.quada-leaderboard__full { margin-top: 14px; align-self: flex-start; }

/* ---- Badge tiers (FEAT-2) ---- */
.quada-badge--bronze   { background: #b0712a; color: #fff; }
.quada-badge--silver   { background: #8a8a92; color: #fff; }
.quada-badge--gold     { background: #d4a017; color: var(--qa-black); }
.quada-badge--platinum { background: #3a7a7a; color: #fff; }

/* ---- Announcements ---- */
/* ---- Announcements (full-width table after billing) ---- */
.quada-announce-board { padding: 0; overflow: hidden; }
.quada-announce-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.quada-announce-table th {
	text-align: left;
	color: var(--qa-orange) !important;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em;
	padding: 12px 16px;
	background: linear-gradient(180deg, #2e2d35 0%, #252429 100%);
	border-bottom: 2px solid var(--qa-orange);
}
.quada-announce-table td {
	padding: 14px 16px;
	border-bottom: 1px solid rgba(255,255,255,.07);
	color: var(--qa-mist);
	vertical-align: top;
	background: linear-gradient(180deg, #27262d 0%, #222128 100%);
}
.quada-announce-table tr:nth-child(even) td { background: linear-gradient(180deg, #232229 0%, #1f1e25 100%); }
.quada-announce-table tr:last-child td { border-bottom: none; }
.quada-announce-table__date { white-space: nowrap; width: 1%; font-variant-numeric: tabular-nums; }
.quada-announce-table__priority { white-space: nowrap; width: 1%; }
/* A coloured left accent on the row keyed to priority. */
.quada-announce-row--high  td:first-child { box-shadow: inset 4px 0 0 #E5B53C; }
.quada-announce-row--urgent td:first-child { box-shadow: inset 4px 0 0 var(--qa-danger); }
.quada-announce-row--normal td:first-child { box-shadow: inset 4px 0 0 var(--qa-orange); }
.quada-announce-table__title { display: block; font-weight: 700; color: var(--qa-white); font-size: 15px; margin-bottom: 4px; }
.quada-announce-table__body { display: block; color: var(--qa-mist); font-size: 13px; }
.quada-announce-table__body p { margin: 0 0 6px; }
.quada-announce-table__body p:last-child { margin-bottom: 0; }
.quada-announce__pin { color: var(--qa-orange); }
.quada-announce-badge--normal { background: var(--qa-graphite); color: var(--qa-white); }
.quada-announce-badge--high   { background: #E5B53C; color: var(--qa-black); }
.quada-announce-badge--urgent { background: var(--qa-danger); color: #fff; }
/* Mobile: the 3-column table becomes a stack of cards — no sideways scroll.
   Each announcement: priority badge + date on top, then title + body. */
@media (max-width: 640px) {
	.quada-announce-table,
	.quada-announce-table tbody,
	.quada-announce-table tr,
	.quada-announce-table td { display: block; width: auto; }
	.quada-announce-table thead { display: none; }
	.quada-announce-table tr {
		background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
		border-bottom: 1px solid rgba(255,255,255,.07);
		padding: 14px 16px 16px;
	}
	.quada-announce-table tr:nth-child(even) td { background: none; }
	.quada-announce-table td { padding: 0; border: none; background: none; }
	.quada-announce-row td:first-child,
	.quada-announce-row--high td:first-child,
	.quada-announce-row--urgent td:first-child,
	.quada-announce-row--normal td:first-child { box-shadow: none; }
	/* coloured accent moves to the whole card's left edge */
	.quada-announce-row { border-left: 4px solid var(--qa-orange); }
	.quada-announce-row--high { border-left-color: #E5B53C; }
	.quada-announce-row--urgent { border-left-color: var(--qa-danger); }
	.quada-announce-table__priority { display: inline-block; margin-bottom: 8px; }
	.quada-announce-table__date {
		display: inline-block; width: auto; margin-left: 10px;
		font-size: 12px; color: var(--qa-mist);
	}
	.quada-announce-table__title { font-size: 16px; margin-bottom: 6px; }
	.quada-announce-table__body { font-size: 14px; line-height: 1.6; }
}

/* Defeat the parent theme's `.article-body table tr:nth-child(2n)` #f5f5f5
   stripe (dashboard lives inside .article-body) on the dashboard tables at all
   widths — cells carry the dark design, never the theme's white. */
.quada-announce-table td, .quada-announce-table th,
.quada-kb-table td, .quada-kb-table th,
.quada-billing__table td, .quada-billing__table th { background-color: transparent; }
.quada-announce-table tbody tr, .quada-kb-table tbody tr, .quada-billing__table tbody tr { background: transparent; }

/* ---- Knowledge Base (full-width table after announcements) ---- */
.quada-kb-board__lead { color: var(--qa-mist); font-size: 14px; margin: 0 0 16px; line-height: 1.5; }
.quada-kb-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.quada-kb-table th {
	text-align: left;
	color: var(--qa-orange) !important;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em;
	padding: 12px 16px;
	background: linear-gradient(180deg, #2e2d35 0%, #252429 100%);
	border-bottom: 2px solid var(--qa-orange);
}
.quada-kb-table td {
	padding: 14px 16px;
	border-bottom: 1px solid rgba(255,255,255,.07);
	color: var(--qa-mist);
	vertical-align: top;
	background: linear-gradient(180deg, #27262d 0%, #222128 100%);
}
.quada-kb-table tr:nth-child(even) td { background: linear-gradient(180deg, #232229 0%, #1f1e25 100%); }
.quada-kb-table tr:last-child td { border-bottom: none; }
.quada-kb-table__topic { white-space: nowrap; width: 1%; }
.quada-kb-row td:first-child { box-shadow: inset 4px 0 0 var(--qa-orange); }
.quada-kb-table__date { white-space: nowrap; width: 1%; font-variant-numeric: tabular-nums; }
.quada-kb-table__title { display: block; font-weight: 700; color: var(--qa-white); font-size: 15px; text-decoration: none; margin-bottom: 4px; }
.quada-kb-table__title:hover { color: var(--qa-orange); }
.quada-kb-table__excerpt { display: block; color: var(--qa-mist); font-size: 13px; line-height: 1.5; }
.quada-kb-topic { background: var(--qa-graphite); color: var(--qa-white); }
.quada-kb-board__cta { margin-top: 16px; display: inline-block; }
/* Mobile: KB table becomes stacked cards — topic badge + date, then title +
   excerpt — instead of a sideways-scrolling table. */
@media (max-width: 640px) {
	.quada-kb-table,
	.quada-kb-table tbody,
	.quada-kb-table tr,
	.quada-kb-table td { display: block; width: auto; }
	.quada-kb-table thead { display: none; }
	.quada-kb-table tr {
		background: linear-gradient(180deg, #27262d 0%, #222128 100%) !important;
		border-bottom: 1px solid rgba(255,255,255,.07);
		border-left: 4px solid var(--qa-orange);
		padding: 14px 16px 16px;
	}
	.quada-kb-table tr:nth-child(even) td { background: none; }
	.quada-kb-table td { padding: 0; border: none; background: none; }
	.quada-kb-row td:first-child { box-shadow: none; }
	.quada-kb-table__topic { display: inline-block; width: auto; margin-bottom: 8px; }
	.quada-kb-table__date {
		display: inline-block; width: auto; margin-left: 10px;
		font-size: 12px; color: var(--qa-mist);
	}
	.quada-kb-table__title { font-size: 16px; margin-bottom: 6px; }
	.quada-kb-table__excerpt { font-size: 14px; line-height: 1.6; }
}

/* ---- Knowledge base card + browser ---- */
.quada-engage__lead { color: var(--qa-mist); font-size: 14px; margin: 0 0 14px; line-height: 1.5; }
/* Suppress the parent theme's square list markers on dashboard lists. */
.quada-kb-list,
.quada-points__log,
.quada-leaderboard__list { list-style: none !important; }
.quada-kb-list__item::before,
.quada-kb-list__item::marker,
.quada-points__log li::before,
.quada-points__log li::marker,
.quada-leaderboard__row::before,
.quada-leaderboard__row::marker { content: none !important; display: none !important; }
.quada-kb-list { list-style: none; margin: 0 0 18px; padding: 0; flex: 1 1 auto; }
.quada-kb-list__item { border-top: 1px solid var(--qa-line); list-style: none; }
.quada-kb-list__item:first-child { border-top: none; }
.quada-kb-list__link {
	display: flex; flex-direction: column; gap: 4px;
	padding: 12px 12px 12px 26px; position: relative;
	text-decoration: none; border-radius: var(--qa-radius-sm);
	transition: background .15s ease;
}
.quada-kb-list__link::before {
	content: '›'; position: absolute; left: 8px; top: 11px;
	color: var(--qa-orange); font-weight: 700; font-size: 16px; line-height: 1;
}
.quada-kb-list__link:hover { background: rgba(255,140,0,.07); }
.quada-kb-list__title { color: var(--qa-white); font-weight: 600; font-size: 14px; line-height: 1.35; }
.quada-kb-list__link:hover .quada-kb-list__title { color: var(--qa-orange); }
.quada-kb-list__excerpt { color: var(--qa-mist); font-size: 12.5px; line-height: 1.5; }
.quada-engage--kb__cta { align-self: flex-start; margin-top: auto; }
.quada-engage--kb .quada-btn { margin-top: auto; align-self: flex-start; }

.quada-kb { margin: 24px 0; }
.quada-kb__search { display: flex; gap: 10px; margin-bottom: 18px; flex-wrap: wrap; }
.quada-kb__search input[type="search"] {
	flex: 1 1 240px; padding: 10px 14px; font-size: 15px;
	background: var(--qa-charcoal); border: 1px solid var(--qa-line);
	border-radius: var(--qa-radius-sm); color: var(--qa-white);
}
.quada-kb__topics { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.quada-kb__topics .quada-chip.is-active { background: var(--qa-orange); color: var(--qa-black); }
.quada-chip__count { opacity: .7; font-size: 11px; }
.quada-kb__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.quada-kb__item { display: flex; flex-direction: column; }
.quada-kb__thumb img { width: 100%; height: auto; border-radius: var(--qa-radius-sm); margin-bottom: 10px; }
.quada-kb__title { font-size: 16px; margin: 0 0 6px; }
.quada-kb__title a { color: var(--qa-white); text-decoration: none; }
.quada-kb__title a:hover { color: var(--qa-orange); }
.quada-kb__excerpt { color: var(--qa-mist); font-size: 13px; flex: 1 1 auto; }
.quada-kb__more { color: var(--qa-orange); font-weight: 600; font-size: 13px; text-decoration: none; margin-top: 8px; }
.quada-kb__pagination { display: flex; align-items: center; gap: 14px; justify-content: center; margin-top: 22px; }
.quada-kb__page-of { color: var(--qa-mist); font-size: 13px; }

/* ====================== v0.6.4 — click-to-load media facade + audio lesson ====================== */
.quada-media-facade{position:relative;display:block;width:100%;aspect-ratio:16/9;border:1px solid #2A2A30;
	border-radius:12px;overflow:hidden;cursor:pointer;background:#101012;padding:0;}
.quada-media-facade img{width:100%;height:100%;object-fit:cover;display:block;opacity:.85;}
.quada-media-facade__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
	width:68px;height:68px;border-radius:50%;background:rgba(255,140,0,.92);color:#000;font-size:26px;
	display:flex;align-items:center;justify-content:center;padding-left:6px;box-sizing:border-box;
	transition:transform .15s;}
.quada-media-facade:hover .quada-media-facade__play,
.quada-media-facade:focus .quada-media-facade__play{transform:translate(-50%,-50%) scale(1.08);}
.quada-media-facade__hint{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);
	background:rgba(0,0,0,.72);color:#fff;font-size:12px;font-weight:600;letter-spacing:.04em;
	padding:5px 14px;border-radius:999px;white-space:nowrap;}
.quada-media-facade--plain{display:flex;align-items:center;justify-content:center;
	background:linear-gradient(135deg,#141416,#1d1d22);}
.quada-media-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;}
.quada-media-frame iframe{width:100%;height:100%;border:0;display:block;}
.quada-lesson__audio{display:flex;flex-direction:column;gap:8px;margin:0 0 18px;padding:14px 16px;
	background:#101012;border:1px solid #2A2A30;border-radius:12px;}
.quada-lesson__audio-label{color:#FF8C00;font-size:13px;font-weight:700;letter-spacing:.05em;}
.quada-lesson__audio audio{width:100%;}

/* ====================== v0.6.5 — program upsell card (assessed practicum) ====================== */
.quada-program-detail__upsell { margin: 0; } /* section rhythm comes from the container gap */
.quada-upsell-card { border: 1px solid rgba(255,140,0,.35); border-radius: 12px; padding: 22px 24px; background: rgba(255,140,0,.05); display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.quada-upsell-card__body { flex: 1 1 320px; color: var(--qa-mist); font-size: 14.5px; }
.quada-upsell-card__body p { margin: 0; }
.quada-upsell-card__action { display: flex; align-items: center; gap: 16px; }
.quada-upsell-card__price { color: var(--qa-orange); font-size: 22px; font-weight: 700; }
.quada-upsell-card__price del { color: var(--qa-mist); font-size: 15px; }
@media (max-width: 600px) {
	.quada-upsell-card { flex-direction: column; align-items: stretch; text-align: center; }
	.quada-upsell-card__action { flex-direction: column; }
}

/* ====================== v0.6.6 — assignment submissions + grading queue ====================== */
.quada-assignment__notice { border: 1px solid rgba(255,140,0,.35); border-radius: 12px; padding: 18px 22px; margin: 18px 0; background: rgba(255,140,0,.05); color: var(--qa-mist); }
.quada-assignment__notice--ok { border-color: rgba(80,200,120,.45); background: rgba(80,200,120,.07); }
.quada-assignment__history { margin: 24px 0; }
.quada-submission { border: 1px solid rgba(42,42,48,.9); border-radius: 12px; padding: 16px 20px; margin: 12px 0; }
.quada-submission > header { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.quada-submission__attempt { color: #fff; font-weight: 700; }
.quada-submission__date { color: var(--qa-mist); font-size: 13px; }
.quada-submission__grade { color: var(--qa-orange); font-weight: 700; margin: 10px 0 4px; }
.quada-submission__feedback { color: var(--qa-mist); font-size: 14.5px; }
.quada-assignment__form { margin: 26px 0; }
.quada-assignment__form label { display: block; color: #fff; font-size: 14px; margin-bottom: 6px; }
.quada-assignment__form input[type="file"], .quada-assignment__form input[type="url"], .quada-assignment__form textarea { width: 100%; background: rgba(20,20,24,.8); border: 1px solid rgba(42,42,48,.9); border-radius: 8px; color: #fff; padding: 10px 12px; font-size: 14px; }
.quada-sub-queue { margin: 30px 0; }
.quada-sub-queue__empty { color: var(--qa-mist); }
.quada-sub-queue__item { border: 1px solid rgba(42,42,48,.9); border-radius: 12px; padding: 14px 20px; margin: 12px 0; }
.quada-sub-queue__item > summary { cursor: pointer; color: #fff; }
.quada-sub-queue__files { margin: 12px 0; padding-left: 18px; }
.quada-sub-queue__files a { color: var(--qa-orange); }
.quada-sub-queue__notes { color: var(--qa-mist); font-size: 14.5px; border-left: 3px solid rgba(255,140,0,.4); padding-left: 14px; margin: 10px 0; }
.quada-sub-queue__item form label { display: block; color: #fff; font-size: 14px; margin: 10px 0 4px; }
.quada-sub-queue__item form input[type="number"], .quada-sub-queue__item form textarea { width: 100%; max-width: 640px; background: rgba(20,20,24,.8); border: 1px solid rgba(42,42,48,.9); border-radius: 8px; color: #fff; padding: 8px 12px; }

.quada-chip--practicum { border-color: rgba(255,140,0,.5); color: var(--qa-orange); }

/* ============================================================
   Quad-A lesson readability vocabulary (2026-07)
   AI-supervision rollout: insight callout, checklist, numbered
   steps, glossary list. Additive only. px units (Pivot theme
   sets html{font-size:10px}), colours from the :root tokens.
   ============================================================ */
.quada-lesson h4 { font-family: var(--qa-font-display); font-size: 17px; color: #fff; margin: 20px 0 6px; }
.quada-callout ul, .quada-callout ol { margin: 6px 0 0; padding-left: 20px; }
.quada-callout li { margin: 4px 0; }

/* Insight / pitfall callout — a fourth emphasis colour (violet) distinct
   from key(blue)/field(orange)/example(green). */
.quada-callout--insight { background: #241826; border-left-color: #c07bd6; }
.quada-callout--insight .quada-callout__label { color: #d79bea; }

/* Supervision checklist — boxed, scannable, orange check badges. */
.quada-checklist { background: #16160f; border: 1px solid #2c2c34; border-left: 4px solid #FF8C00;
  border-radius: 10px; padding: 14px 20px 16px; margin: 22px 0; }
.quada-checklist__label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: #ffb05a; margin-bottom: 8px; }
.quada-checklist ul { list-style: none; margin: 0; padding: 0; }
.quada-checklist li { position: relative; padding: 8px 0 8px 32px; color: #dcdce0; line-height: 1.55;
  border-top: 1px solid rgba(255,255,255,.06); }
.quada-checklist li:first-child { border-top: 0; }
.quada-checklist li::before { content: "\2713"; position: absolute; left: 0; top: 8px;
  width: 20px; height: 20px; text-align: center; line-height: 20px; font-size: 12px; font-weight: 700;
  color: #0E0E10; background: #FF8C00; border-radius: 5px; }

/* Numbered insight steps — visual number badges for ordered reasoning. */
ol.quada-steps { counter-reset: qastep; margin: 18px 0; padding: 0; list-style: none; }
ol.quada-steps > li { counter-increment: qastep; position: relative; padding: 3px 0 14px 46px;
  color: #dcdce0; line-height: 1.6; }
ol.quada-steps > li::before { content: counter(qastep); position: absolute; left: 0; top: 0;
  width: 30px; height: 30px; text-align: center; line-height: 30px; font-weight: 700; font-size: 14px;
  color: #0E0E10; background: #FF8C00; border-radius: 50%; }
ol.quada-steps > li strong { color: #fff; }

/* Glossary as a definition list — term + meaning, scannable. */
dl.quada-glossary { margin: 14px 0 0; }
dl.quada-glossary dt { font-weight: 700; color: #ffb05a; margin: 12px 0 2px; }
dl.quada-glossary dd { margin: 0; color: #dcdce0; line-height: 1.55; }

/* ============================================================
   Quad-A AI-instructor avatar slot (2026-07) — top of lesson.
   Provider-agnostic responsive 16:9 embed. px units.
   ============================================================ */
.quada-avatar { margin: 0 0 26px; background: #141018; border: 1px solid #2c2c34;
  border-left: 4px solid #FF8C00; border-radius: 12px; padding: 14px 16px 16px; }
.quada-avatar__label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: #ffb05a; margin-bottom: 10px; }
.quada-avatar__frame { position: relative; width: 100%; padding-top: 56.25%; border-radius: 8px;
  overflow: hidden; background: #000; }
.quada-avatar__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.quada-avatar__video { width: 100%; border-radius: 8px; background: #000; display: block; }
.quada-avatar__hint { margin: 10px 0 0; font-size: 13px; color: #9a9aa2; }

/* ============================================================
   Quad-A lesson breathing room (2026-07) — more vertical rhythm.
   Overrides earlier rules (later in file wins). px units.
   ============================================================ */
.quada-lesson__content { line-height: 1.78; padding: 28px 30px; }
.quada-lesson__content p { margin: 0 0 18px; }
.quada-lesson__content h3 { margin: 40px 0 14px; }
.quada-lesson h4 { margin: 30px 0 8px; }
.quada-lesson__content ul, .quada-lesson__content ol { margin: 0 0 18px; padding-left: 22px; }
.quada-lesson__content li { margin: 7px 0; }
.quada-figure { margin: 30px 0; }
.quada-callout { margin: 24px 0; padding: 16px 20px; }
.quada-checklist { margin: 28px 0; }
ol.quada-steps { margin: 24px 0; }
ol.quada-steps > li { padding-bottom: 18px; }
dl.quada-glossary dd { margin-bottom: 6px; }
.quada-summary { padding: 10px 26px 22px; margin-top: 34px; }
@media (max-width: 640px) {
	.quada-lesson__content { padding: 20px 16px; }
}

/* ===== Codex card treatment (approved 2026-07-26) =====
   Top-edge glow: a lit 1px inner edge plus a soft orange highlight fading at
   the corners, on every .quada-card site-wide. */
.quada-card {
	position: relative;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 18px 40px rgba(0, 0, 0, .42);
}
.quada-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 12%;
	right: 12%;
	height: 1px;
	pointer-events: none;
	z-index: 3;
	background: linear-gradient(90deg, transparent, rgba(255, 170, 60, .75), transparent);
}
/* Programme card images: black & white until hover colours them in.
   The grayscale lives on an ::after COPY of the background photo at z-index 0
   — BELOW the dark scrim (::before, z1), the type tag + title (overlay, z2)
   and the Paid/Free badge (z3+), so all of those keep their full colour. */
.quada-program-card__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: inherit; /* copies the inline background-image */
	background-size: cover;
	background-position: center;
	filter: grayscale(1) contrast(1.04);
	opacity: 1;
	transition: opacity .45s ease;
	z-index: 0;
	pointer-events: none;
}
.quada-program-card:hover .quada-program-card__media::after,
.quada-program-card:focus-within .quada-program-card__media::after {
	opacity: 0; /* fades out to reveal the colour photo underneath */
}
@media (prefers-reduced-motion: reduce) {
	.quada-program-card__media::after { transition: none; }
}

/* Auth panels (login / verify) get the same codex top-edge glow as cards. */
.quada-auth__panel {
	position: relative;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 30px 80px rgba(0, 0, 0, .6);
}
.quada-auth__panel::before {
	content: '';
	position: absolute;
	top: 0;
	left: 15%;
	right: 15%;
	height: 1px;
	pointer-events: none;
	z-index: 3;
	background: linear-gradient(90deg, transparent, rgba(255, 170, 60, .8), transparent);
}

/* Course thumbnail inside table cells (retake requests etc.). */
.quada-course-thumb-cell { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.quada-course-thumb {
	width: 46px;
	height: 30px;
	object-fit: cover;
	border-radius: 6px;
	border: 1px solid var(--qa-graphite);
	flex: 0 0 auto;
}

/* Checkout: collapsible bank details on the Direct Bank Transfer method.
   (The block checkout strips <details>, so a link + checkout.js toggles the
   .quada-bacs-open class; detail paragraphs stay hidden until then.) */
.quada-bacs-toggle { color: var(--qa-orange) !important; font-weight: 600; text-decoration: none; cursor: pointer; }
.quada-bacs-toggle:hover { text-decoration: underline; }
/* Class attributes are stripped by the block checkout, so target by
   structure: the toggle paragraph's following <p> siblings are the details. */
.wc-block-components-radio-control-accordion-content div > p:has(> a[href="#"]) ~ p,
.payment_method_bacs p:has(> a[href="#"]) ~ p,
.quada-bacs-detail { display: none; }
.wc-block-components-radio-control-accordion-content div > p:has(> a[href="#"]) > a,
.payment_method_bacs p:has(> a[href="#"]) > a { color: var(--qa-orange) !important; font-weight: 600; text-decoration: none; }
.quada-bacs-open > p:has(> a[href="#"]) ~ p,
.quada-bacs-open .quada-bacs-detail {
	display: block !important;
	border-left: 3px solid rgba(255, 140, 0, .5);
	padding-left: 14px;
}

/* Chips must never spill: wrap long labels inside the pill (2026-07) */
.quada-chip { max-width: 100%; white-space: normal; line-height: 1.35; text-align: center; }
.quada-program-card { overflow: hidden; }

/* ------------------------------------------------------------------
   Outline icon set (2026-07) — replaces the emoji previously used as
   icons. Single-stroke SVGs inherit currentColor, so each icon takes
   the colour of the text it sits in and stays crisp at any size.
   ------------------------------------------------------------------ */
.quada-icon { display: inline-block; vertical-align: -0.16em; flex: 0 0 auto; }
.quada-why__icon .quada-icon { color: var(--qa-orange, #FF8C00); vertical-align: middle; }
.quada-announce__pin .quada-icon,
.quada-module__index .quada-icon { color: var(--qa-orange, #FF8C00); vertical-align: middle; }
/* Icons sitting ON an orange-filled holder must be black, not orange —
   the certificate star was orange-on-orange and invisible (2026-07). */
.quada-cert-card__seal .quada-icon { color: var(--qa-black, #0E0E10); vertical-align: middle; }
.quada-cert-card__seal .quada-icon svg,
.quada-cert-card__seal svg { fill: currentColor; stroke: currentColor; }
.quada-media-facade__play .quada-icon { color: #fff; vertical-align: middle; }
.quada-lesson-list__check .quada-icon,
.quada-feedback-tab__check .quada-icon { color: var(--qa-orange, #FF8C00); }
.quada-module-exam-row__icon .quada-icon { vertical-align: middle; }

/* ------------------------------------------------------------------
   Mobile hardening (2026-07-26) — theme list-rule bleed + small-screen
   layout. Pivot's ".article-body ul" (0,1,1) forces square inside
   bullets and margin-left:30px onto every plugin list, shoving lesson
   rows / exam facts off-centre and crushing titles on phones. The
   attribute selectors below out-rank it for every quada-* UL.
   ------------------------------------------------------------------ */
.article-body ul[class^="quada-"],
.article-body ul[class*=" quada-"],
ul[class^="quada-"],
ul[class*=" quada-"] {
	list-style: none;
	list-style-position: outside;
	margin-left: 0;
}
/* Re-assert component padding the theme reset (.article-body ul{padding:0})
   would otherwise win over. */
.article-body ul.quada-lesson-list { padding: 6px 0; }
.article-body ul.quada-exam__facts { padding: 16px; }

/* Lesson rows: on phones the fixed-width type/duration columns starved
   the title (one word per line). Stack instead — badge + duration +
   check on the first line, title full-width beneath. */
@media (max-width: 640px) {
	.quada-lesson-list a { flex-wrap: wrap; gap: 6px 10px; padding: 14px 16px; }
	.quada-lesson-list__type { flex: 0 0 auto; }
	.quada-lesson-list__dur { margin-left: auto; order: 2; }
	.quada-lesson-list__check { order: 3; width: auto; }
	.quada-lesson-list__title { order: 4; flex: 1 1 100%; min-width: 0; line-height: 1.45; }

	/* Live-exam sticky bar: title, progress and timer wrap instead of
	   fighting for one row. */
	.quada-exam__bar { flex-wrap: wrap; gap: 8px 16px; padding: 12px 16px; }
	.quada-exam__bar h2 { font-size: 17px; }
	.quada-exam__timer { font-size: 22px; }
}

/* Tables inside reading/exam content and trainer student cards must
   scroll within themselves — the page body never scrolls sideways.
   .quada-table previously only got this at 480px; tablets need it too. */
@media (max-width: 782px) {
	.quada-table,
	.quada-student-card__exams,
	.quada-lesson__content table,
	.quada-exam__qbody table {
		display: block;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/* ------------------------------------------------------------------
   Per-lesson practical assignments (2026-07). Every lesson in the paid
   catalogue carries a brief; the card sits under the lesson body and a
   "Task" chip marks the lesson in the module outline.
   ------------------------------------------------------------------ */
.quada-lesson-list__task {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex: 0 0 auto;
	padding: 2px 9px;
	border: 1px solid rgba(255, 140, 0, .45);
	border-radius: 999px;
	color: var(--qa-orange);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	white-space: nowrap;
}
.quada-lesson-assignment {
	margin: 26px 0 0;
	padding: 20px 22px;
	background: rgba(255, 140, 0, .05);
	border: 1px solid rgba(255, 140, 0, .35);
	border-radius: var(--qa-radius);
}
.quada-lesson-assignment .quada-section-title { margin-top: 0; }
.quada-lesson-assignment__row {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}
.quada-lesson-assignment__body { flex: 1 1 240px; min-width: 0; }
.quada-lesson-assignment__title {
	margin: 0;
	color: var(--qa-white);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	overflow-wrap: anywhere;
}
.quada-lesson-assignment__meta,
.quada-lesson-assignment__status { margin: 4px 0 0; color: var(--qa-mist); font-size: 13px; }
.quada-lesson-assignment--graded .quada-lesson-assignment__status { color: var(--qa-success); font-weight: 600; }
.quada-lesson-assignment--graded { border-color: rgba(61, 190, 123, .4); background: rgba(61, 190, 123, .05); }
.quada-lesson-assignment--submitted .quada-lesson-assignment__status { color: #f4b740; }
.quada-lesson-assignment__row > .quada-btn { flex: 0 0 auto; }

/* Assignment brief: the seeded briefs use h4 sections, ordered steps and a
   marking table. Keep the table inside its own scroll box on phones. */
.quada-assignment__brief h4 {
	margin: 22px 0 8px;
	color: var(--qa-orange);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.quada-assignment__brief ul,
.quada-assignment__brief ol { margin: 0 0 8px; padding-left: 22px; color: var(--qa-mist); }
.quada-assignment__brief li { margin: 0 0 6px; line-height: 1.6; }
.quada-assignment__brief .quada-rubric { width: 100%; border-collapse: collapse; margin: 4px 0 8px; font-size: 14px; }
.quada-assignment__brief .quada-rubric th,
.quada-assignment__brief .quada-rubric td {
	padding: 9px 12px;
	border-bottom: 1px solid var(--qa-graphite);
	text-align: left;
	vertical-align: top;
}
.quada-assignment__brief .quada-rubric th { color: var(--qa-white); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.quada-assignment__brief .quada-rubric td:last-child,
.quada-assignment__brief .quada-rubric th:last-child { text-align: right; white-space: nowrap; }
.quada-assignment__brief .quada-rubric tfoot td { font-weight: 700; color: var(--qa-white); border-bottom: none; }
.quada-assignment__submitline { color: var(--qa-mist); font-size: 14px; }
@media (max-width: 782px) {
	.quada-assignment__brief .quada-rubric { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Brief body lists/headings are unclassed markup inside the_content, so the
   theme's `.article-body ul` (0,1,1) and its heading colours out-rank a bare
   element selector. Scope through the brief wrapper to win. */
.article-body .quada-assignment__brief ul,
.quada-assignment__brief ul,
.article-body .quada-assignment__brief ol,
.quada-assignment__brief ol {
	list-style-position: outside;
	margin-left: 0;
	padding-left: 24px;
}
.article-body .quada-assignment__brief ul,
.quada-assignment__brief ul { list-style-type: disc; }
.article-body .quada-assignment__brief ol,
.quada-assignment__brief ol { list-style-type: decimal; }
.article-body .quada-assignment__brief h4,
.quada-assignment__brief h4 {
	/* The child theme sets a blanket `h4 { color: var(--qa-white) !important }`,
	   so the section headings inside a brief have to answer in kind. */
	color: var(--qa-orange) !important;
}

/* ------------------------------------------------------------------
   No white table backgrounds anywhere in academy content (2026-07-27
   request). The theme paints `.article-body table tr:nth-child(2n)` and
   `.article-body table thead tr` a solid #f5f5f5, which beats a plain
   element selector and left white text sitting on white rows in the
   assignment marking tables. These rules out-rank it on both specificity
   and priority, so no academy table can inherit a light row again.
   ------------------------------------------------------------------ */
.article-body .quada-assignment__brief table,
.article-body .quada-assignment__brief tr,
.article-body .quada-assignment__brief thead tr,
.article-body .quada-assignment__brief tbody tr,
.article-body .quada-assignment__brief tfoot tr,
.article-body .quada-assignment__brief th,
.article-body .quada-assignment__brief td,
.article-body .quada-lesson table, .article-body .quada-lesson tr,
.article-body .quada-lesson thead tr, .article-body .quada-lesson th,
.article-body .quada-lesson td,
.article-body .quada-exam table, .article-body .quada-exam tr,
.article-body .quada-exam thead tr, .article-body .quada-exam th,
.article-body .quada-exam td,
.article-body .quada-course table, .article-body .quada-course tr,
.article-body .quada-course thead tr, .article-body .quada-course th,
.article-body .quada-course td,
.quada-assignment__brief table, .quada-assignment__brief tr,
.quada-assignment__brief thead tr, .quada-assignment__brief tbody tr,
.quada-assignment__brief tfoot tr, .quada-assignment__brief th,
.quada-assignment__brief td,
.quada-lesson table, .quada-lesson tr, .quada-lesson thead tr,
.quada-lesson th, .quada-lesson td,
.quada-exam table, .quada-exam tr, .quada-exam thead tr,
.quada-exam th, .quada-exam td,
.quada-course table, .quada-course tr, .quada-course thead tr,
.quada-course th, .quada-course td,
.quada-card table, .quada-card tr, .quada-card thead tr,
.quada-card th, .quada-card td,
.quada-dashboard table, .quada-dashboard tr, .quada-dashboard thead tr {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
}

/* Data tables keep their deliberate orange head and dark zebra striping,
   which also has to beat the theme's light rows. */
.quada-table thead th,
.article-body .quada-table thead th {
	background: #FF8C00 !important;
	background-color: #FF8C00 !important;
	color: #0E0E10 !important;
}
.quada-table tbody tr:nth-child(odd) td,
.article-body .quada-table tbody tr:nth-child(odd) td { background-color: #161619 !important; }
.quada-table tbody tr:nth-child(even) td,
.article-body .quada-table tbody tr:nth-child(even) td { background-color: #1d1d22 !important; }

/* The marking table reads as a table without needing fills: an orange
   header rule and hairline row separators on the dark panel. */
.quada-assignment__brief .quada-rubric thead tr,
.article-body .quada-assignment__brief .quada-rubric thead tr { border-bottom: 2px solid var(--qa-orange); }
.quada-assignment__brief .quada-rubric th,
.article-body .quada-assignment__brief .quada-rubric th { color: var(--qa-orange) !important; }
.quada-assignment__brief .quada-rubric td,
.article-body .quada-assignment__brief .quada-rubric td { color: var(--qa-mist) !important; }
.quada-assignment__brief .quada-rubric tfoot td,
.article-body .quada-assignment__brief .quada-rubric tfoot td {
	color: var(--qa-white) !important;
	border-top: 1px solid var(--qa-graphite);
}

/* Text inside any academy table must never inherit a dark-on-dark colour. */
.quada-lesson table, .quada-exam table, .quada-assignment__brief table,
.quada-course table, .quada-card table { color: var(--qa-mist); }
.quada-lesson table th, .quada-exam table th,
.quada-assignment__brief table th, .quada-course table th { color: var(--qa-white); }

/* ------------------------------------------------------------------ */
/* Program-card media: slight zoom on hover, scrim kept intact.
   The media div paints its photo as a background-image, which cannot be
   transformed, so both photo layers are pseudo-element copies:
     ::before = colour copy            (z0, zooms)
     ::after  = grayscale copy         (z1, zooms, fades out on hover)
     overlay  = dark scrim + title     (z2)
     badge    = Paid/Free              (z3)
   The scrim moves onto the overlay so it never scales with the photo
   and the title keeps the same contrast at rest and on hover.         */
/* ------------------------------------------------------------------ */
.quada-program-card__media::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 0;
	background: inherit;
	background-size: cover;
	background-position: center;
	transform: scale(1.001);
	transition: transform .55s ease;
	will-change: transform;
	pointer-events: none;
}
.quada-program-card__media::after {
	z-index: 1;
	transform: scale(1.001);
	transition: opacity .45s ease, transform .55s ease;
	will-change: transform, opacity;
}
.quada-program-card:hover .quada-program-card__media::before,
.quada-program-card:focus-within .quada-program-card__media::before,
.quada-program-card:hover .quada-program-card__media::after,
.quada-program-card:focus-within .quada-program-card__media::after {
	transform: scale(1.09);
}
/* Scrim now lives on the overlay (was ::before), so the title stays
   readable over the zoomed photo. */
.quada-program-card__overlay {
	padding: 58px 18px 16px;
	background: linear-gradient(to top, #000 4%, rgba(0,0,0,.8) 40%, rgba(0,0,0,.28) 74%, transparent 100%);
}
@media (prefers-reduced-motion: reduce) {
	.quada-program-card__media::before,
	.quada-program-card__media::after { transition: opacity .45s ease; }
	.quada-program-card:hover .quada-program-card__media::before,
	.quada-program-card:hover .quada-program-card__media::after { transform: none; }
}

/* ------------------------------------------------------------------ */
/* Trainer profiles on program + course pages (before the modules).    */
/* ------------------------------------------------------------------ */
.quada-trainers { margin: 26px 0 0; }
.quada-trainer-card {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	background: linear-gradient(165deg, #1b1b20 0%, #121214 60%, #0c0c0e 100%);
	border: 1px solid var(--qa-graphite);
	border-radius: 16px;
	padding: 22px 24px;
	margin: 0 0 16px;
}
.quada-trainer-card__photo {
	width: 116px;
	height: 116px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 auto;
	border: 2px solid rgba(255, 140, 0, .5);
	box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
	background: #000;
}
.quada-trainer-card__photo--initial {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--qa-orange);
	font-family: 'Poppins', sans-serif;
	font-size: 40px;
	font-weight: 600;
}
.quada-trainer-card__body { flex: 1 1 auto; min-width: 0; }
.quada-trainer-card__name {
	margin: 0 0 3px;
	color: var(--qa-white);
	font-family: 'Poppins', sans-serif;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.25;
}
.quada-trainer-card__tagline {
	margin: 0 0 10px;
	color: var(--qa-orange);
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
}
.quada-trainer-card__bio { color: var(--qa-mist); font-size: 14px; line-height: 1.62; }
.quada-trainer-card__bio p { margin: 0 0 10px; color: var(--qa-mist); font-size: 14px; line-height: 1.62; }
.quada-trainer-card__bio p:last-child { margin-bottom: 0; }
/* ------------------------------------------------------------------ */
/* Class meetings, trainer side (Trainer Studio panel).
   Native select/date/time controls default to a white background, which
   looked broken sitting on the dark card, and an 8px grid gap ran the
   labels into their fields. Controls are themed explicitly here and
   `color-scheme: dark` is set so the browser's own calendar and clock
   pickers render dark rather than white.                              */
/* ------------------------------------------------------------------ */
.quada-meet-admin {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
	gap: 22px;
	margin: 18px 0 30px;
	align-items: start;
}
.quada-meet-admin__course { padding: 22px 24px 24px; }
.quada-meet-admin__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	padding-bottom: 14px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--qa-graphite);
}
.quada-meet-admin__title {
	margin: 0;
	color: var(--qa-white) !important;
	font-family: 'Poppins', sans-serif;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	overflow-wrap: anywhere;
}
.quada-meet-admin__status {
	flex: 0 0 auto;
	padding: 5px 11px;
	border-radius: 999px;
	border: 1px solid var(--qa-graphite);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	white-space: nowrap;
}
.quada-meet-admin__status.is-scheduled { color: #7ddba0; border-color: rgba(125, 219, 160, .4); background: rgba(125, 219, 160, .09); }
.quada-meet-admin__status.is-pending { color: var(--qa-orange); border-color: rgba(255, 140, 0, .4); background: rgba(255, 140, 0, .08); }
.quada-meet-admin__summary {
	margin: 0 0 18px;
	padding: 11px 14px;
	border-left: 3px solid var(--qa-orange);
	background: rgba(255, 140, 0, .06);
	border-radius: 0 8px 8px 0;
	color: var(--qa-mist) !important;
	font-size: 13px;
	line-height: 1.55;
}
.quada-meet-admin__form { display: block; }
.quada-meet-admin__field { margin: 0 0 18px; }
.quada-meet-admin__label {
	display: block;
	margin-bottom: 7px;
	color: var(--qa-orange);
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
}
.quada-meet-admin__input,
.quada-meet-admin select.quada-meet-admin__input,
.quada-meet-admin input.quada-meet-admin__input {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	background: rgba(255, 255, 255, .05) !important;
	color: var(--qa-white) !important;
	border: 1px solid var(--qa-graphite);
	border-radius: 8px;
	font-family: inherit;
	font-size: 14px;
	line-height: 1.4;
	color-scheme: dark;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.quada-meet-admin__input::placeholder { color: var(--qa-mist); opacity: .6; }
.quada-meet-admin__input:focus,
.quada-meet-admin__input:focus-visible {
	outline: none;
	border-color: rgba(255, 140, 0, .65);
	box-shadow: 0 0 0 3px rgba(255, 140, 0, .14);
}
.quada-meet-admin__hint {
	display: block;
	margin-top: 6px;
	color: var(--qa-mist) !important;
	font-size: 12px;
	line-height: 1.5;
	opacity: .85;
}
.quada-meet-admin__times { display: flex; align-items: center; gap: 10px; }
.quada-meet-admin__times .quada-meet-admin__input { width: auto; flex: 1 1 0; min-width: 0; }
.quada-meet-admin__sep { flex: 0 0 auto; color: var(--qa-mist); font-size: 13px; }
.quada-meet-admin__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid var(--qa-graphite);
}
@media (max-width: 560px) {
	.quada-meet-admin { grid-template-columns: 1fr; gap: 18px; }
	.quada-meet-admin__course { padding: 18px 16px 20px; }
	.quada-meet-admin__actions .quada-btn { width: 100%; text-align: center; }
}

/* ------------------------------------------------------------------ */
/* Weekly class meetings card (student-facing, on the course page).
   Deliberately NOT a table: the theme paints `.article-body table thead
   tr` and `tr:nth-child(2n)` solid #f5f5f5, which out-ranks a plain
   element selector and left this card with white rows and near-white
   text on top (the same trap as the assignment marking tables in
   0.7.30). A list of rows sidesteps the theme entirely and stacks
   cleanly on a phone instead of squeezing three columns.             */
/* ------------------------------------------------------------------ */
.quada-meetings {
	margin: 26px 0 0;
	padding: 22px 24px 18px;
	background: linear-gradient(165deg, #1b1b20 0%, #121214 60%, #0c0c0e 100%);
	border: 1px solid var(--qa-graphite);
	border-radius: 16px;
}
.quada-meetings .quada-section-title { margin: 0 0 14px; }
.quada-meetings__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.quada-meetings__list > li { list-style: none; margin: 0; }
.quada-meetings__list > li::marker { content: none; }
.quada-meetings__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	padding: 13px 16px;
	background: rgba(255, 255, 255, .035) !important;
	border: 1px solid var(--qa-graphite);
	border-left: 3px solid rgba(255, 140, 0, .45);
	border-radius: 10px;
}
.quada-meetings__item.is-intro {
	background: rgba(255, 140, 0, .07) !important;
	border-left-color: var(--qa-orange);
}
.quada-meetings__main { min-width: 0; flex: 1 1 260px; }
.quada-meetings__kind {
	display: block;
	color: var(--qa-orange);
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .16em;
	margin-bottom: 3px;
}
.quada-meetings__label {
	display: block;
	color: var(--qa-white) !important;
	font-family: 'Poppins', sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	overflow-wrap: anywhere;
}
.quada-meetings__when {
	display: block;
	margin-top: 4px;
	color: var(--qa-mist) !important;
	font-size: 13px;
	line-height: 1.5;
}
.quada-meetings__time::before { content: " · "; color: var(--qa-graphite); }
.quada-meetings__action { flex: 0 0 auto; }
.quada-meetings__place,
.quada-meetings__pending {
	display: inline-block;
	color: var(--qa-mist) !important;
	font-size: 12.5px;
	line-height: 1.45;
	max-width: 230px;
}
.quada-meetings__pending { opacity: .8; font-style: italic; }
.quada-btn--sm { padding: 8px 14px; font-size: 12.5px; }
.quada-meetings__note {
	margin: 14px 0 0;
	color: var(--qa-mist) !important;
	font-size: 12.5px;
	line-height: 1.55;
}

/* The one session that matters today sits open at the top; the rest of the
   course collapses behind a toggle the student opens. */
.quada-meetings__item.is-featured {
	background: rgba(255, 140, 0, .1) !important;
	border-color: rgba(255, 140, 0, .38);
	border-left-width: 4px;
	border-left-color: var(--qa-orange);
	padding: 17px 18px;
	margin-bottom: 12px;
}
.quada-meetings__item.is-featured .quada-meetings__label { font-size: 17px; }
.quada-meetings__item.is-featured .quada-meetings__when { font-size: 13.5px; }
.quada-meetings__part {
	margin-left: 7px;
	padding: 1px 6px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .09);
	color: var(--qa-mist);
	font-size: 9.5px;
	letter-spacing: .08em;
}
.quada-meetings__rest { margin: 0; }
.quada-meetings__rest > summary {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	cursor: pointer;
	list-style: none;
	padding: 7px 0;
	color: var(--qa-orange);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
}
.quada-meetings__rest > summary::-webkit-details-marker { display: none; }
.quada-meetings__rest > summary::after {
	content: '';
	width: 7px; height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform .2s ease;
}
.quada-meetings__rest[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
.quada-meetings__rest > summary:hover,
.quada-meetings__rest > summary:focus-visible { color: var(--qa-white); }
.quada-meetings__rest .quada-meetings__list { margin-top: 8px; }

/* ------------------------------------------------------------------ */
/* Compact trainer strip on the course page. The full biographies live
   on the public programme page; here a student only needs to know who
   is teaching before they pick a module.                              */
/* ------------------------------------------------------------------ */
.quada-trainer-strip { margin: 26px 0 0; }
.quada-trainer-strip .quada-section-title { margin-bottom: 12px; }
.quada-trainer-strip__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.quada-trainer-strip__list > li::marker { content: none; }
.quada-trainer-strip__item {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 10px 16px 10px 10px;
	background: rgba(255, 255, 255, .04) !important;
	border: 1px solid var(--qa-graphite);
	border-radius: 999px;
	min-width: 0;
}
.quada-trainer-strip__photo {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 auto;
	border: 2px solid rgba(255, 140, 0, .5);
	background: #000;
}
.quada-trainer-strip__photo--initial {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--qa-orange);
	font-family: 'Poppins', sans-serif;
	font-size: 19px;
	font-weight: 600;
}
.quada-trainer-strip__text { min-width: 0; }
.quada-trainer-strip__name {
	display: block;
	color: var(--qa-white) !important;
	font-family: 'Poppins', sans-serif;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.3;
}
.quada-trainer-strip__role {
	display: block;
	margin-top: 1px;
	color: var(--qa-mist) !important;
	font-size: 11px;
	line-height: 1.4;
}
@media (max-width: 560px) {
	.quada-trainer-strip__list { flex-direction: column; }
	.quada-trainer-strip__item { width: 100%; border-radius: 12px; }
}
@media (max-width: 640px) {
	.quada-meetings { padding: 18px 16px 14px; }
	.quada-meetings__item { flex-direction: column; align-items: flex-start; gap: 10px; }
	.quada-meetings__action { width: 100%; }
	.quada-meetings__place, .quada-meetings__pending { max-width: none; }
	.quada-meetings__time { display: block; }
	.quada-meetings__time::before { content: none; }
}

.quada-trainer-card__more { margin: 2px 0 0; }
.quada-trainer-card__more > summary {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
	list-style: none;
	color: var(--qa-orange);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	padding: 4px 0;
}
.quada-trainer-card__more > summary::-webkit-details-marker { display: none; }
.quada-trainer-card__more > summary::after {
	content: '';
	width: 7px; height: 7px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform .2s ease;
}
.quada-trainer-card__more[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
.quada-trainer-card__more > summary:hover,
.quada-trainer-card__more > summary:focus-visible { color: var(--qa-white); }
.quada-trainer-card__more .quada-trainer-card__bio { margin-top: 8px; }

.quada-trainer-card__focus {
	margin: 12px 0 0;
	padding: 10px 14px;
	border-left: 3px solid var(--qa-orange);
	background: rgba(255, 140, 0, .07);
	border-radius: 0 8px 8px 0;
	color: var(--qa-white);
	font-size: 13.5px;
	line-height: 1.55;
}
.quada-trainer-card__focus-label {
	display: block;
	color: var(--qa-orange);
	font-size: 10.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .16em;
	margin-bottom: 3px;
}
@media (max-width: 560px) {
	.quada-trainer-card { flex-direction: column; align-items: center; text-align: center; padding: 20px 16px; }
	.quada-trainer-card__photo { width: 96px; height: 96px; }
	.quada-trainer-card__focus { text-align: left; }
}
