/**
 * The quiz popup -- what it has that the shared shell does not: the line with
 * the quiz's dates, the consent checkbox, and the link half's rows, which show
 * values rather than ask for them.
 */

/* The dates of the quiz on sale, above the first field. A caption-sized line,
   in the captions' grey: it informs, nothing in it is to be acted on.
   `padding: 0` because the theme pads every paragraph at the bottom. */
.etest-quiz__window {
	margin: var(--etest-caption-gap) 0 0;
	padding: 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--etest-caption-color);
}

/* --- consent ------------------------------------------------------------ */

/* a label, so the theme's !important on `form label` applies here too and has
   to be claimed back, as the registration's role options do */
.etest-popup .etest-quiz__check {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
	color: #000 !important;
	cursor: pointer;
}

/* level with the first line of the sentence, not its middle */
.etest-quiz__check input {
	flex: 0 0 auto;
	margin: 3px 0 0;
}

/* --- the link half ------------------------------------------------------- */

/* A value, not a field: the height of an input's text without its box, so the
   rows keep the form's rhythm while plainly not inviting a click -- the same
   treatment as the school on the testing popup. */
.etest-quiz__value {
	padding: 2px 0 4px;
	font-weight: 600;
	line-height: 1.4;
}

/* the countdown is the one thing on this screen that is waiting for something,
   so it is the largest; tabular figures keep the digits from jittering as they
   tick */
.etest-quiz__clock {
	font-size: 28px;
	font-variant-numeric: tabular-nums;
	line-height: 1.2;
}