/*
 * SmartEdu Hry — štýly hry typu kviz. Načítavajú sa len spolu s touto hrou.
 * Spoločné premenné a triedy (.se-hra, .je-spravna, .je-nespravna) sú v prehravac.css.
 */

.se-kviz-rezimy {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 14rem, 1fr ) );
	gap: 1rem;
	max-width: 50rem;
	margin: 2rem auto;
}

.se-kviz-rezim {
	display: grid;
	gap: 0.5rem;
	min-height: 8rem;
	padding: 1.5rem;
	border: 3px solid var( --wp--preset--color--primarna, #1d4ed8 );
	border-radius: 16px;
	background: var( --wp--preset--color--podklad, #fff );
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
}

.se-kviz-rezim strong {
	font-size: 1.5em;
}

.se-kviz-otazka-obal {
	max-width: 60rem;
	margin: 0 auto;
}

.se-kviz-otazka {
	margin: 0 0 1rem;
	font-size: clamp( 1.5em, 3vw, 2.25em );
	line-height: 1.25;
}

.se-kviz-obrazok {
	display: block;
	max-width: 100%;
	max-height: 40vh;
	width: auto;
	height: auto;
	margin: 0 auto 1rem;
	border-radius: 12px;
}

.se-kviz-cas {
	float: right;
	min-width: 3ch;
	margin: 0 0 0.5rem 1rem;
	font-size: 2.5em;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	text-align: right;
}

.se-kviz-cas.je-malo {
	color: var( --se-chyba );
}

.se-kviz-odpovede {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 16rem, 1fr ) );
	gap: 0.75rem;
	clear: both;
}

.se-kviz-odpoved {
	display: flex;
	gap: 0.75rem;
	align-items: center;
	min-height: 4rem;
	padding: 0.75rem 1rem;
	border: 3px solid var( --se-okraj );
	border-radius: 12px;
	background: var( --wp--preset--color--podklad, #fff );
	color: inherit;
	font: inherit;
	font-size: 1.15em;
	text-align: left;
	cursor: pointer;
}

.se-kviz-odpoved[aria-pressed="true"] {
	border-color: var( --wp--preset--color--primarna, #1d4ed8 );
	box-shadow: inset 0 0 0 3px var( --wp--preset--color--primarna, #1d4ed8 );
}

.se-kviz-pismeno {
	display: inline-grid;
	flex: none;
	place-items: center;
	width: 2.25em;
	height: 2.25em;
	border-radius: 50%;
	background: var( --wp--preset--color--text, #0f172a );
	color: var( --wp--preset--color--podklad, #fff );
	font-weight: 700;
}

.se-kviz-text {
	flex: 1;
}

.se-kviz-znak {
	font-size: 1.5em;
	font-weight: 800;
}

.se-kviz-odpoved:disabled {
	cursor: default;
	opacity: 1;
}

.se-kviz-vazba {
	min-height: 1.5em;
	margin: 1rem 0 0;
	padding: 0;
	font-size: 1.2em;
	font-weight: 700;
}

.se-kviz-vazba.je-spravna,
.se-kviz-vazba.je-nespravna {
	padding: 0.5rem 1rem;
	border: 2px solid;
	border-radius: 8px;
}

.se-kviz-akcie {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin: 1rem 0;
}

.se-kviz-napoveda {
	color: var( --wp--preset--color--text-jemny, #475569 );
	font-size: 0.9em;
}

.se-kviz--tabula .se-kviz-otazka {
	font-size: clamp( 2em, 4.5vw, 3.5em );
}

.se-kviz--tabula .se-kviz-odpoved {
	min-height: 6rem;
	font-size: 1.5em;
}

.se-kviz-prehlad {
	max-width: 48rem;
	margin: 1.5rem auto 0;
	padding-left: 1.5em;
	text-align: left;
}

.se-kviz-prehlad li {
	margin-bottom: 0.75rem;
	padding: 0.5rem 0.75rem;
	border-left: 6px solid;
	border-radius: 0;
}

.se-kviz-prehlad-znak {
	margin-right: 0.5em;
	font-weight: 800;
}

.se-kviz-prehlad-odpoved {
	display: block;
	font-size: 0.9em;
}