/* SIMEDRA Quiz 0.12.0 — stiluri izolate sub .smdq
   Principiu: componenta se integrează în temă, nu concurează cu ea.
   Moștenește font-family și se sprijină pe alb + un singur accent, configurabil
   din shortcode: [simedra_quiz accent="#1d6fa3"].
   Nu există comutare automată pe modul întunecat — tema gazdă nu o are, iar un
   singur bloc întunecat într-o pagină luminoasă arată ca o eroare. */

.smdq {
	--smdq-accent: #1d6fa3;
	--smdq-accent-soft: #eaf3f9;
	--smdq-ink: #1f2933;
	--smdq-ink-2: #66737f;
	--smdq-card: #ffffff;
	--smdq-line: #dfe5ea;
	--smdq-line-2: #eef1f4;
	--smdq-ok: #16794a;
	--smdq-ok-soft: #e8f5ee;
	--smdq-bad: #b3303c;
	--smdq-bad-soft: #fcecee;
	--smdq-warn: #8a6114;
	--smdq-r: 10px;
	--smdq-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", "Roboto Mono", Menlo, Consolas, monospace;

	font-family: inherit;
	color: var(--smdq-ink);
	background: transparent;
	max-width: 840px;
	margin-inline: auto;
	line-height: 1.6;
}

.smdq *,
.smdq *::before,
.smdq *::after {
	box-sizing: border-box;
}

/* ---------- antet ---------- */

.smdq-eyebrow {
	font-family: var(--smdq-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--smdq-ink-2);
	margin: 0 0 6px;
}

.smdq-title {
	font-size: clamp(19px, 3vw, 25px);
	font-weight: 650;
	letter-spacing: -0.01em;
	margin: 0 0 4px;
	color: inherit;
}

.smdq-sub {
	color: var(--smdq-ink-2);
	font-size: 15px;
	margin: 0 0 24px;
}

/* ---------- configurare ---------- */

.smdq-field {
	margin-bottom: 24px;
}

.smdq-label {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--smdq-ink);
	margin-bottom: 10px;
}

.smdq-label b {
	font-family: var(--smdq-mono);
	font-size: 13px;
	font-weight: 600;
	color: var(--smdq-accent);
	font-variant-numeric: tabular-nums;
}

.smdq-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.smdq-chip {
	font: inherit;
	font-size: 14.5px;
	line-height: 1.35;
	background: var(--smdq-card);
	color: var(--smdq-ink);
	border: 1px solid var(--smdq-line);
	border-radius: 999px;
	padding: 8px 15px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	transition: border-color 0.12s, background 0.12s, box-shadow 0.12s;
}

.smdq-chip:hover:not([disabled]) {
	border-color: var(--smdq-accent);
	box-shadow: 0 1px 4px rgba(31, 41, 51, 0.07);
}

.smdq-chip[aria-pressed="true"] {
	background: var(--smdq-accent-soft);
	border-color: var(--smdq-accent);
	font-weight: 600;
}

.smdq-chip[disabled] {
	opacity: 0.4;
	cursor: not-allowed;
}

.smdq-chip .smdq-n {
	font-family: var(--smdq-mono);
	font-size: 11px;
	color: var(--smdq-ink-2);
	font-variant-numeric: tabular-nums;
}

.smdq-chip[aria-pressed="true"] .smdq-n {
	color: var(--smdq-accent);
}

.smdq input[type="range"] {
	width: 100%;
	accent-color: var(--smdq-accent);
}

/* ---------- butoane ---------- */

.smdq-btn {
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	background: var(--smdq-accent);
	color: #fff;
	border: 1px solid var(--smdq-accent);
	border-radius: 999px;
	padding: 11px 26px;
	cursor: pointer;
	transition: filter 0.12s;
}

.smdq-btn:hover:not([disabled]) {
	filter: brightness(1.1);
}

.smdq-btn[disabled] {
	opacity: 0.45;
	cursor: not-allowed;
}

.smdq-btn--ghost {
	background: transparent;
	color: var(--smdq-ink);
	border-color: var(--smdq-line);
}

.smdq-btn--ghost:hover:not([disabled]) {
	border-color: var(--smdq-accent);
	color: var(--smdq-accent);
	filter: none;
}

.smdq-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin-top: 26px;
}

.smdq :focus-visible {
	outline: 2px solid var(--smdq-accent);
	outline-offset: 2px;
}

/* ---------- rigla de progres ---------- */

.smdq-rule {
	display: flex;
	align-items: flex-end;
	gap: 2px;
	height: 26px;
	border-bottom: 1px solid var(--smdq-line);
	margin-bottom: 7px;
}

.smdq-tick {
	flex: 1 1 0;
	min-width: 3px;
	height: 8px;
	background: var(--smdq-line);
	border: 0;
	border-radius: 2px 2px 0 0;
	padding: 0;
	cursor: pointer;
	transition: height 0.15s, background 0.15s;
}

.smdq-tick[data-major="1"] { height: 13px; }
.smdq-tick[data-state="answered"] { background: var(--smdq-accent); }
.smdq-tick[data-state="current"] {
	background: var(--smdq-ink);
	height: 22px;
}

.smdq-rule-legend {
	display: flex;
	justify-content: space-between;
	font-family: var(--smdq-mono);
	font-size: 11.5px;
	color: var(--smdq-ink-2);
	margin-bottom: 20px;
	font-variant-numeric: tabular-nums;
}

/* ---------- cardul întrebării ---------- */

.smdq-card {
	background: var(--smdq-card);
	border: 1px solid var(--smdq-line);
	border-radius: var(--smdq-r);
	padding: clamp(18px, 2.6vw, 26px);
	box-shadow: 0 1px 3px rgba(31, 41, 51, 0.04);
}

.smdq-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 14px;
}

.smdq-tag {
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--smdq-ink-2);
	background: var(--smdq-line-2);
	border-radius: 999px;
	padding: 4px 11px;
}

.smdq-q {
	font-size: clamp(16px, 2vw, 18px);
	font-weight: 600;
	margin: 0 0 18px;
	white-space: pre-wrap;
	color: inherit;
}

.smdq-stmts {
	margin: 0 0 20px;
	padding-left: 1.7em;
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 15.5px;
}

.smdq-stmts li::marker {
	font-family: var(--smdq-mono);
	font-size: 12.5px;
	color: var(--smdq-ink-2);
}

/* ---------- variante ---------- */

.smdq-opts {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.smdq-opt {
	display: flex;
	gap: 13px;
	align-items: flex-start;
	border: 1px solid var(--smdq-line);
	border-radius: var(--smdq-r);
	padding: 13px 16px;
	cursor: pointer;
	background: var(--smdq-card);
	text-align: left;
	font: inherit;
	font-size: 15.5px;
	color: inherit;
	width: 100%;
	transition: border-color 0.12s, background 0.12s;
}

.smdq-opt:hover {
	border-color: var(--smdq-accent);
	background: var(--smdq-accent-soft);
}

.smdq-opt[aria-pressed="true"] {
	border-color: var(--smdq-accent);
	background: var(--smdq-accent-soft);
	box-shadow: inset 0 0 0 1px var(--smdq-accent);
}

.smdq-opt-key {
	font-family: var(--smdq-mono);
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.75;
	min-width: 1.5em;
	color: var(--smdq-ink-2);
}

.smdq-opt[aria-pressed="true"] .smdq-opt-key { color: var(--smdq-accent); }

.smdq-opt[data-verdict] { cursor: default; }
.smdq-opt[data-verdict]:hover { background: var(--smdq-card); }

.smdq-opt[data-verdict="ok"] {
	border-color: var(--smdq-ok);
	background: var(--smdq-ok-soft);
}
.smdq-opt[data-verdict="ok"]:hover { background: var(--smdq-ok-soft); }
.smdq-opt[data-verdict="ok"] .smdq-opt-key { color: var(--smdq-ok); }

.smdq-opt[data-verdict="bad"] {
	border-color: var(--smdq-bad);
	background: var(--smdq-bad-soft);
}
.smdq-opt[data-verdict="bad"]:hover { background: var(--smdq-bad-soft); }
.smdq-opt[data-verdict="bad"] .smdq-opt-key { color: var(--smdq-bad); }

.smdq-opt[data-verdict="missed"] {
	border-color: var(--smdq-ok);
	border-style: dashed;
}

/* ---------- rezultate ---------- */

.smdq-score {
	display: flex;
	align-items: baseline;
	gap: 15px;
	flex-wrap: wrap;
	border-bottom: 1px solid var(--smdq-line);
	padding-bottom: 18px;
	margin-bottom: 22px;
}

.smdq-score-big {
	font-family: var(--smdq-mono);
	font-size: clamp(32px, 6.5vw, 48px);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--smdq-accent);
	font-variant-numeric: tabular-nums;
}

.smdq-bars {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 28px;
}

.smdq-bar-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 60px;
	gap: 12px;
	align-items: center;
	font-size: 14.5px;
}

.smdq-bar-track {
	height: 7px;
	background: var(--smdq-line-2);
	border-radius: 999px;
	overflow: hidden;
	margin-top: 6px;
}

.smdq-bar-fill {
	height: 100%;
	background: var(--smdq-accent);
	border-radius: 999px;
}

.smdq-bar-num {
	font-family: var(--smdq-mono);
	font-size: 12.5px;
	text-align: right;
	color: var(--smdq-ink-2);
	font-variant-numeric: tabular-nums;
}

.smdq-review {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.smdq-expl {
	margin: 16px 0 0;
	padding: 12px 16px;
	border-left: 3px solid var(--smdq-accent);
	background: var(--smdq-accent-soft);
	border-radius: 0 var(--smdq-r) var(--smdq-r) 0;
	font-size: 14.5px;
	white-space: pre-wrap;
}

.smdq-prov {
	margin: 16px 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--smdq-line-2);
	font-size: 12px;
	color: var(--smdq-ink-2);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 9px;
}

.smdq-flag {
	color: var(--smdq-warn);
	background: #fdf6e6;
	border-radius: 999px;
	padding: 3px 9px;
	font-size: 11px;
	font-weight: 600;
}

/* ---------- mesaje ---------- */

.smdq-msg {
	border: 1px solid var(--smdq-line);
	border-left-width: 4px;
	border-radius: var(--smdq-r);
	padding: 14px 18px;
	font-size: 14.5px;
	background: var(--smdq-card);
}

.smdq-msg--error { border-left-color: var(--smdq-bad); }
.smdq-msg--info { border-left-color: var(--smdq-accent); }

.smdq-msg code {
	font-family: var(--smdq-mono);
	font-size: 12.5px;
	background: var(--smdq-line-2);
	border-radius: 4px;
	padding: 1px 5px;
}

.smdq-msg ul {
	margin: 8px 0 0;
	padding-left: 1.3em;
}

.smdq-muted {
	color: var(--smdq-ink-2);
	font-size: 13.5px;
}

.smdq-timer {
	font-family: var(--smdq-mono);
	font-variant-numeric: tabular-nums;
	color: var(--smdq-ink-2);
}

@media (prefers-reduced-motion: reduce) {
	.smdq * { transition: none !important; }
}

/* ---------- KaTeX în context de listă/variante ---------- */
.smdq .katex {
	font-size: 1.05em;
}

.smdq-q .katex,
.smdq-stmts .katex,
.smdq-opt .katex {
	white-space: normal;
}

/* formulele nerandate (sintaxă invalidă) rămân lizibile, nu roșu-alarmă */
.smdq .katex-error {
	color: var(--smdq-ink) !important;
	font-family: var(--smdq-mono);
	font-size: 0.92em;
}

/* ---------- schema de circuit ---------- */
.smdq-fig {
	margin: 0 0 20px;
	padding: 16px;
	border: 1px solid var(--smdq-line);
	border-radius: var(--smdq-r);
	background: #fff;              /* schemele au fundal transparent si trasee inchise */
	text-align: center;
}

.smdq-fig img {
	display: block;
	/* Latime NORMALIZATA, nu dimensiunea intrinseca a fisierului.
	   Un <img> foloseste width/height din SVG; schemele salvate doar cu viewBox
	   primesc o dimensiune implicita mica, de unde desene de jumatate de marime
	   langa altele mari. SVG-ul fiind vectorial, scalarea nu pierde calitate. */
	width: 100%;
	/* 460px = latimea `viewBox` a peste 75% dintre scheme (mediana, percentila 25
	   si 75 coincid). Toate ajung astfel la aceeasi latime pe ecran. Uniformizarea
	   la MINIM (366) ar fi micsorat intreaga colectie ca sa acomodeze trei grile
	   de antrenament, iar cele doua scheme foarte late ar fi devenit miniaturi. */
	max-width: 460px;
	height: auto;
	margin: 0 auto;
}

.smdq-fig figcaption {
	margin-top: 12px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--smdq-ink-2);
	text-align: left;
}

.smdq-schema-txt {
	margin: 0 0 18px;
	padding: 12px 16px;
	border-left: 3px solid var(--smdq-line);
	background: var(--smdq-line-2);
	border-radius: 0 var(--smdq-r) var(--smdq-r) 0;
	font-size: 14.5px;
}

/* etichetele de sesiune sunt lungi — nu le lasam sa sparga randul */
.smdq-chip {
	max-width: 100%;
	text-align: left;
}

/* fara titlu intern (title=""), eticheta are nevoie de aer sub ea */
.smdq-eyebrow + .smdq-sub {
	margin-top: 10px;
}

/* ---------- corectare imediata, sub variante ---------- */
.smdq-fb {
	margin-top: 18px;
	padding: 14px 16px;
	border-radius: var(--smdq-r);
	border-left: 4px solid;
	font-size: 14.5px;
}

.smdq-fb--ok {
	background: var(--smdq-ok-soft);
	border-left-color: var(--smdq-ok);
}

.smdq-fb--bad {
	background: var(--smdq-bad-soft);
	border-left-color: var(--smdq-bad);
}

.smdq-fb-head {
	margin: 0;
	font-weight: 600;
	display: flex;
	align-items: baseline;
	gap: 9px;
}

.smdq-fb-mark {
	font-family: var(--smdq-mono);
	font-size: 17px;
	line-height: 1;
}

.smdq-fb--ok .smdq-fb-mark { color: var(--smdq-ok); }
.smdq-fb--bad .smdq-fb-mark { color: var(--smdq-bad); }

.smdq-fb-expl {
	margin: 10px 0 0;
	font-weight: 400;
	white-space: pre-wrap;
	line-height: 1.6;
}

.smdq-fb .smdq-prov {
	border-top-color: rgba(31, 41, 51, 0.12);
}

/* variantele devin inerte dupa raspuns */
.smdq-opt:not(button) { cursor: default; }
.smdq-opt:not(button):hover {
	background: var(--smdq-card);
	border-color: var(--smdq-line);
}
.smdq-opt:not(button)[data-verdict="ok"]:hover {
	background: var(--smdq-ok-soft);
	border-color: var(--smdq-ok);
}
.smdq-opt:not(button)[data-verdict="bad"]:hover {
	background: var(--smdq-bad-soft);
	border-color: var(--smdq-bad);
}

/* rigla: diviziunile arata corect/gresit, nu doar „raspuns” */
.smdq-tick[data-state="ok"] { background: var(--smdq-ok); }
.smdq-tick[data-state="bad"] { background: var(--smdq-bad); }

/* ---------- identificatori pentru regasire in Qdrant ---------- */
.smdq-id {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: -8px 0 16px;
	font-family: var(--smdq-mono);
	font-size: 11px;
	color: var(--smdq-ink-2);
}

.smdq-id-copy {
	font: inherit;
	color: var(--smdq-ink-2);
	background: var(--smdq-line-2);
	border: 0;
	border-radius: 4px;
	padding: 2px 7px;
	cursor: pointer;
}

.smdq-id-copy:hover {
	background: var(--smdq-accent-soft);
	color: var(--smdq-accent);
}
