/* CBT Engine — the exercise block ([cbt_exercise]) and its print sheet.
 * Question pieces live in cbt-shared.css; this file only frames them.
 * No !important; logical properties only. */

.cbt-exercise {
	margin: 2em 0;
	max-width: 100%;
	min-width: 0;
}
.cbt-exercise-title {
	font-size: 1.25em;
	font-weight: 700;
	color: var(--cbt-text-dark);
	margin: 0 0 0.75em;
	padding-block-end: 0.35em;
	border-block-end: 2px solid var(--cbt-border);
}
.cbt-exercise-body {
	min-width: 0;
}
.cbt-exercise-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin: 1.25em 0 0.5em;
}
.cbt-exercise.is-graded .cbt-exercise-actions [data-cbt-submit] {
	display: none;
}
.cbt-exercise-notice {
	border: 1px dashed var(--cbt-wrong);
	color: var(--cbt-wrong);
	background: var(--cbt-wrong-bg);
	padding: 10px 14px;
	border-radius: var(--cbt-radius);
	margin: 1em 0;
	font-size: 0.9em;
}

/* Static copy (before the script runs): blanks look like blanks. */
.cbt-gap-static {
	display: inline-block;
	width: var(--cbt-gap-width);
	border-block-end: 1px solid var(--cbt-border);
	vertical-align: middle;
	height: 1.6em;
}
.cbt-gap-static.is-short {
	width: var(--cbt-gap-width-short);
}

/* Layouts. */
.cbt-layout-two-column .cbt-group-body {
	columns: 2;
	column-gap: 40px;
}
.cbt-layout-two-column .cbt-group-body > * {
	break-inside: avoid;
}
.cbt-layout-two-column .cbt-box,
.cbt-layout-two-column .cbt-table-scroll,
.cbt-layout-two-column table {
	column-span: all;
}
@media (max-width: 767px) {
	.cbt-layout-two-column .cbt-group-body {
		columns: 1;
	}
}
.cbt-layout-compact {
	--cbt-line-height: 1.5;
}
.cbt-layout-compact .cbt-group {
	margin-block-end: 1.1em;
}
.cbt-layout-compact .cbt-q-choice {
	margin-block-end: 0.75em;
}
.cbt-layout-compact .cbt-mcq-container {
	gap: 0;
}
.cbt-layout-compact .cbt-mcq-option {
	padding: 1px 0;
}
.cbt-layout-compact .cbt-ui p,
.cbt-layout-compact p {
	margin-block-end: 0.4em;
}

/* Most often missed. */
.cbt-stats-box {
	margin: 1.25em 0;
	padding: 12px 16px;
	background: var(--cbt-bg);
	border: 1px solid var(--cbt-border-soft);
	border-radius: var(--cbt-radius);
	font-size: 0.925em;
}
.cbt-stats-title {
	font-weight: 700;
	margin: 0 0 6px;
	color: var(--cbt-primary);
}
.cbt-stats-list {
	margin: 0;
	padding-inline-start: 1.2em;
}

/* Printed answers (answers="public"). */
.cbt-answers {
	margin: 1.25em 0;
	border: 1px solid var(--cbt-border);
	border-radius: var(--cbt-radius);
	background: var(--cbt-white);
}
.cbt-answers > summary {
	cursor: pointer;
	padding: 10px 16px;
	font-weight: 700;
	color: var(--cbt-primary);
	list-style: revert;
}
.cbt-answers-list {
	margin: 0;
	padding: 6px 16px 14px 2.4em;
}
.cbt-answers-item {
	margin: 0 0 6px;
	list-style: none;
}
.cbt-answers-num {
	font-weight: 700;
	color: var(--cbt-text-muted);
	margin-inline-start: -2em;
	display: inline-block;
	min-width: 2em;
}
.cbt-answers-key {
	color: var(--cbt-correct);
}
.cbt-answers-explain {
	display: block;
	color: var(--cbt-text-muted);
	font-size: 0.925em;
	margin-block-start: 2px;
}

/* Print footer: hidden on screen, printed at the foot of every page. */
.cbt-print-footer {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Print sheet: questions first, answers on a new page, the site name   */
/* and the page address at the foot of every sheet.                    */
/* ------------------------------------------------------------------ */
@media print {
	body.cbt-print-only {
		visibility: hidden;
		overflow: visible;
		height: auto;
	}
	body.cbt-print-only .cbt-exercise.is-printing {
		visibility: visible;
		position: absolute;
		inset-inline-start: 0;
		top: 0;
		width: 100%;
		margin: 0;
		padding: 0 0 14mm;
		font-size: 11pt;
		line-height: 1.55;
		color: #000;
	}
	body.cbt-print-only .cbt-exercise.is-printing * {
		visibility: visible;
	}
	.cbt-exercise.is-printing .cbt-exercise-actions,
	.cbt-exercise.is-printing .cbt-stats-box,
	.cbt-exercise.is-printing .cbt-summary-actions,
	.cbt-exercise.is-printing .cbt-listen-from,
	.cbt-exercise.is-printing .cbt-choice-notice,
	.cbt-exercise.is-printing .cbt-exercise-audio,
	.cbt-exercise.is-printing audio {
		display: none;
	}
	.cbt-exercise.is-printing .cbt-answers {
		display: block;
		break-before: page;
		page-break-before: always;
		border: 0;
	}
	.cbt-exercise.is-printing .cbt-answers > summary {
		display: block;
		font-size: 1.2em;
		padding: 0 0 6px;
		border-block-end: 2px solid #000;
		list-style: none;
	}
	.cbt-exercise.is-printing .cbt-answers[open] > summary,
	.cbt-exercise.is-printing .cbt-answers-list {
		display: block;
	}
	.cbt-exercise.is-printing details.cbt-answers:not([open]) > *:not(summary) {
		display: block;
	}
	.cbt-exercise.is-printing .cbt-print-footer {
		display: block;
		position: fixed;
		bottom: 0;
		inset-inline-start: 0;
		width: 100%;
		text-align: center;
		font-size: 9pt;
		color: #444;
		border-block-start: 1px solid #999;
		padding-block-start: 3px;
		background: #fff;
	}
	.cbt-exercise.is-printing .cbt-qnum {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}
	.cbt-exercise.is-printing .cbt-gap,
	.cbt-exercise.is-printing .cbt-select {
		border: 0;
		border-block-end: 1px solid #000;
		border-radius: 0;
		background: transparent;
	}
	.cbt-exercise.is-printing .cbt-group,
	.cbt-exercise.is-printing .cbt-q-choice,
	.cbt-exercise.is-printing .cbt-box {
		break-inside: avoid;
	}
}
