/**
 * ev-mcq-card.css
 * Unified MCQ card (.evx-mcq) — same design as the Exam Board page (taxonomy-exam.css §5).
 * Used by: single-mcq_set.php, taxonomy-mcq_topic.php, taxonomy-mcq_subject.php
 * Requires ev-global.css (tokens). Load AFTER ev-mcq-taxonomy.css / single-mcq-set.css.
 */

.evx-mcqs { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.evx-mcqs-wrap { padding: 4px 0 6px; }

.evx-mcq {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 14px;
	box-shadow: 0 4px 16px rgba(11,29,58,.06);
	padding: 22px 24px 16px;
	min-width: 0;
}
.evx-mcq__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.evx-mcq__tags { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.evx-mcq-tag { display: inline-block; padding: 4px 12px; border-radius: 8px; font-size: 13px; font-weight: 600; line-height: 1.4; }
.evx-mcq-tag--subject { background: var(--green-pale); color: var(--green-dark); font-weight: 800; }
.evx-mcq-tag--topic   { background: var(--navy-pale);  color: var(--text-mid); }
.evx-mcq__right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.evx-mcq__num { color: var(--text-light); font-size: 13px; font-weight: 500; white-space: nowrap; }
.evx-mcq-comment {
	display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px;
	background: var(--navy-pale); border: 1px solid var(--border); border-radius: 9px;
	color: var(--navy); font-size: 13px; transition: background .15s, color .15s;
}
.evx-mcq-comment b { font-weight: 800; }
.evx-mcq-comment:hover { background: var(--teal-pale); color: var(--teal-deep); }

.evx-mcq__q { margin: 0 0 18px; padding: 0; font-family: var(--font-display); font-size: 20px; font-weight: 800; line-height: 1.45; color: var(--navy); }
.evx-mcq__q a { color: inherit; }
.evx-mcq__q a:hover { color: var(--teal-deep); }

.evx-mcq-opts { display: grid; gap: 8px; margin: 0 0 14px; padding: 0; list-style: none; }
.evx-mcq-opt {
	display: flex; align-items: center; gap: 12px; padding: 10px 14px;
	border: 1px solid var(--border); border-radius: 10px; background: #fff;
	color: #000; font-size: 16px; line-height: 1.4;
}
.evx-mcq-opt__key {
	display: inline-grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px;
	border-radius: 7px; background: var(--navy-pale); color: var(--navy); font-size: 13px; font-weight: 800;
}
.evx-mcq-opt__txt { min-width: 0; overflow-wrap: anywhere; }
.evx-mcq-opt__tick { margin-left: auto; display: inline-flex; color: var(--green-dark); }
.evx-mcq-opt.is-correct { border-color: var(--green-dark); background: var(--green-pale); color: #000; font-weight: 800; font-size: 18px; }
.evx-mcq-opt.is-correct .evx-mcq-opt__key { color: #000; }
.evx-mcq-opt.is-wrong { border-color: var(--rose); background: var(--red-pale); }
.evx-mcq-opt.is-wrong .evx-mcq-opt__key { background: var(--rose); color: #fff; }

/* Practice mode (single MCQ set): options are tappable until answered */
.evx-mcq--practice .evx-mcq-opt { cursor: pointer; transition: border-color .15s, background .15s; }
.evx-mcq--practice:not(.is-done) .evx-mcq-opt:hover { border-color: var(--teal-dark); background: var(--g50); }
.evx-mcq--practice.is-done .evx-mcq-opt { cursor: default; }
.evx-mcq--practice .evx-mcq-answer-row[hidden],
.evx-mcq--practice .evx-mcq-exp[hidden] { display: none; }

.evx-mcq-answer-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 0 0 12px; }
.evx-mcq-answer { margin: 0; color: var(--green-dark); font-size: 16px; font-weight: 800; }
.evx-mcq-readexp { display: inline-flex; align-items: center; gap: 6px; color: var(--green-dark); font-size: 14px; font-weight: 700; }
.evx-mcq-readexp:hover { color: var(--green-deep); text-decoration: underline; }

.evx-mcq-exp { margin: 0 0 12px; }
.evx-mcq-exp > summary { display: inline-block; color: var(--teal-dark); font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
.evx-mcq-exp > summary::-webkit-details-marker { display: none; }
.evx-mcq-exp[open] > div { margin-top: 8px; padding: 10px 12px; border-left: 3px solid var(--teal); border-radius: 5px; background: var(--teal-pale); color: var(--text-mid); font-size: 14px; line-height: 1.6; }
.evx-mcq-exp[open] > div p { margin: 0; }

.evx-mcq__foot {
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 18px;
	padding-top: 10px; border-top: 1px solid var(--border); color: var(--text-light); font-size: 13px;
}
.evx-mcq__foot b { color: #000; font-weight: 800; }
.evx-mcq-readexp { white-space: nowrap; }

@media (max-width: 600px) {
	.evx-mcq { padding: 14px; }
	.evx-mcq__q { font-size: 18px; }
	.evx-mcq-opt { font-size: 15px; padding: 9px 10px; gap: 10px; }
	.evx-mcq-opt.is-correct { font-size: 17px; }
	.evx-mcq__num { display: none; }
}

/* ── Specificity guard ─────────────────────────────────────────────
   Topic / subject pages wrap everything in .evs-page, whose resets
   (.evs-page ul/ol/h3/p {margin:0;padding:0}, .evs-page a {color:inherit})
   out-rank the single-class rules above. Re-assert the card spacing/colours. */
.evs-page .evx-mcqs { margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.evs-page .evx-mcqs > li { margin: 0; padding: 0; list-style: none; }
.evs-page .evx-mcq__q { margin: 0 0 18px; padding: 0; font-family: var(--font-display); font-size: 20px; font-weight: 800; line-height: 1.45; color: var(--navy); }
.evs-page .evx-mcq__q a { color: inherit; }
.evs-page .evx-mcq__q a:hover { color: var(--teal-deep); }
.evs-page .evx-mcq-opts { margin: 0 0 14px; padding: 0; list-style: none; display: grid; gap: 8px; }
.evs-page .evx-mcq-opt { margin: 0; color: #000; }
.evs-page .evx-mcq-opt.is-correct { color: #000; font-size: 18px; font-weight: 800; }
.evs-page .evx-mcq-answer-row { margin: 0 0 12px; }
.evs-page .evx-mcq-answer { margin: 0; color: var(--green-dark); }
.evs-page .evx-mcq-readexp { color: var(--green-dark); }
.evs-page .evx-mcq-readexp:hover { color: var(--green-deep); }
.evs-page .evx-mcq-comment { color: var(--navy); }
.evs-page .evx-mcq-comment:hover { color: var(--teal-deep); }
.evs-page .evx-mcq__num { margin: 0; }
@media (max-width: 600px) {
	.evs-page .evx-mcq__q { font-size: 18px; }
	.evs-page .evx-mcq-opt.is-correct { font-size: 17px; }
}

.evs-page .evx-mcq { padding: 22px 24px 16px; }
.evs-page .evx-mcq__top { margin-bottom: 16px; }
.evs-page .evx-mcq-exp { margin: 0 0 14px; }
.evs-page .evx-mcq-exp > summary { color: var(--teal-dark); }
.evs-page .evx-mcq__foot { margin-top: 4px; padding-top: 12px; }
@media (max-width: 600px) {
	.evx-mcq, .evs-page .evx-mcq { padding: 16px 14px 14px; }
	.evx-mcq__top, .evs-page .evx-mcq__top { margin-bottom: 12px; }
	.evx-mcq__q, .evs-page .evx-mcq__q { margin-bottom: 14px; }
}
/* Subjects landing page: MCQ panel and responsive filtering/pagination. */
.evs-page .evs-qpanel { min-width:0; margin:26px 0; }
.evs-page .evs-qpanel .evs-panel__head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:18px; }
.evs-page .evs-mcq-filter { display:flex; align-items:center; gap:8px; }
.evs-page .evs-mcq-filter select { max-width:100%; min-height:40px; border:1px solid var(--border, #dbe2e9); border-radius:8px; padding:7px 10px; }
.evs-page .evs-mcq-pagination { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin:22px 0 4px; }
.evs-page .evs-mcq-pagination a { display:grid; place-items:center; min-width:42px; min-height:42px; padding:8px; border:1px solid var(--border, #dbe2e9); border-radius:8px; text-decoration:none; }
.evs-page .evs-mcq-pagination a[aria-current="page"] { background:var(--navy, #15263d); color:#fff; }
@media (max-width:600px) { .evs-page .evs-qpanel .evs-panel__head { align-items:stretch; } .evs-page .evs-mcq-filter { width:100%; justify-content:space-between; } .evs-page .evx-mcq__top { flex-wrap:wrap; } .evs-page .evx-mcq__right { flex-shrink:1; } .evs-page .evx-mcq-readexp { white-space:normal; } }

/* Universal question card: responsive interaction and overflow protection. */
.evx-mcq { width: 100%; box-sizing: border-box; overflow-wrap: anywhere; }
.evx-mcq :is(a,summary,[role="button"]):focus-visible { outline: 3px solid var(--teal, #087f80); outline-offset: 3px; }
.evx-mcq--practice .evx-mcq-opt { min-height: 44px; }
.evx-mcq__top,.evx-mcq-answer-row { min-width: 0; }
@media (max-width: 480px) {
 .evx-mcq { padding: 14px 12px; border-radius: 12px; }
 .evx-mcq__top { flex-wrap: wrap; }
 .evx-mcq__right { margin-left: auto; }
 .evx-mcq-opt { min-height: 44px; }
 .evx-mcq-readexp { white-space: normal; }
}

/* ExamVillage universal MCQ card — refreshed visual system. */
.evx-mcq,.evs-page .evx-mcq{background:#fff;border:1px solid var(--border,#dce6f4);border-radius:20px;box-shadow:0 6px 26px rgba(12,32,72,.055);padding:26px 28px 20px}
.evx-mcq__top,.evs-page .evx-mcq__top{margin-bottom:22px}
.evx-mcq__tags{gap:10px}
.evx-mcq-tag{padding:7px 14px;border-radius:10px;font-size:14px;line-height:1.4}
.evx-mcq-tag--subject{background:#e9fbf3;color:#00976b}
.evx-mcq-tag--topic{background:#edf1ff;color:#304a79}
.evx-mcq-comment{padding:8px 12px;border-radius:11px;background:#edf2ff;color:#102a58;border-color:#dbe5f6}
.evx-mcq__q,.evs-page .evx-mcq__q{font-size:22px;line-height:1.42;letter-spacing:-.015em;color:#071b42;margin:0 0 22px;font-weight:800}
.evx-mcq__question-prefix{color:#123b91;white-space:nowrap;margin-right:7px;font-weight:850}
.evx-mcq-opts,.evs-page .evx-mcq-opts{gap:10px;margin:0 0 16px}
.evx-mcq-opt{min-height:60px;padding:11px 16px;border-radius:12px;border-color:#dce6f4;font-size:17px;gap:16px}
.evx-mcq-opt__key{width:36px;height:36px;flex-basis:36px;border-radius:10px;background:#edf2ff;color:#071b42;font-size:16px}
.evx-mcq-opt.is-correct{border-color:#00a773;background:#eafbf3;font-size:18px;color:#071b42}
.evx-mcq-opt.is-correct .evx-mcq-opt__key{color:#071b42}
.evx-mcq-opt__tick{color:#009d72}
.evx-mcq-answer-row,.evs-page .evx-mcq-answer-row{margin-bottom:16px}
.evx-mcq-answer,.evs-page .evx-mcq-answer{font-size:17px;color:#009b70}
.evx-mcq-readexp,.evs-page .evx-mcq-readexp{font-size:15px;color:#009b70}
.evx-mcq__foot,.evs-page .evx-mcq__foot{padding-top:15px;margin-top:0;border-top:1px solid #dce6f4;color:#7083a5;font-size:13px}
.evx-mcq__foot b{color:#071b42}
@media(max-width:600px){.evx-mcq,.evs-page .evx-mcq{padding:17px 15px;border-radius:15px}.evx-mcq__top,.evs-page .evx-mcq__top{margin-bottom:17px}.evx-mcq__q,.evs-page .evx-mcq__q{font-size:19px;margin-bottom:17px}.evx-mcq-opt{min-height:54px;padding:9px 11px;font-size:16px;gap:11px}.evx-mcq-opt__key{width:32px;height:32px;flex-basis:32px}.evx-mcq-opt.is-correct,.evs-page .evx-mcq-opt.is-correct{font-size:17px}.evx-mcq-answer-row{align-items:flex-start}.evx-mcq__foot{gap:8px}}


/* ExamVillage universal question-card appearance — loaded on every template. */
.evx-mcq, .ev-mcq-item { background: #fff; border: 1px solid var(--border, #dbe5f3); border-radius: 18px; box-shadow: 0 4px 18px rgba(12,35,74,.05); padding: 24px; }
.evx-mcq .evx-mcq__top, .ev-mcq-item .ev-mcq-item__top { margin-bottom: 20px; }
.evx-mcq .evx-mcq__q, .ev-mcq-item .ev-mcq-item__q { color: var(--navy,#081c42); font-size: 21.5px; font-weight: 800; line-height: 1.42; margin: 0 0 20px; }
.evx-mcq__question-prefix { display: inline; color: #103b89; font: inherit; font-weight: 900; margin-right: .32em; white-space: nowrap; }
.evx-mcq .evx-mcq-opt, .ev-mcq-item .ev-mcq-option { border: 1px solid #dce6f5; background: #fff; border-radius: 12px; padding: 14px 16px; min-height: 58px; }
.evx-mcq .evx-mcq-opt.is-correct, .ev-mcq-item .ev-mcq-option.is-correct { border-color: #009c70; background: #e9fbf3; }
.evx-mcq .evx-mcq-opt__key, .ev-mcq-item .ev-mcq-option__key { background: #edf2ff; border-radius: 9px; color: #0a2450; font-weight: 800; }
.evx-mcq .evx-mcq-answer, .evx-mcq .evx-mcq-readexp { color: #00986d; font-weight: 800; }
.evx-mcq .evx-mcq__foot { border-top: 1px solid #dce6f5; padding-top: 14px; }
.evx-mcq .evx-mcq__num, .ev-mcq-item .ev-mcq-item__num { display: none !important; }
@media(max-width:600px){ .evx-mcq,.ev-mcq-item{padding:16px;border-radius:14px} .evx-mcq .evx-mcq-opt,.ev-mcq-item .ev-mcq-option{padding:11px;min-height:52px} }

/* Single source of truth for all universal MCQ card visual rules. */
.evx-mcq { background:#fff; border:1px solid var(--border,#dce6f5); border-radius:18px; box-shadow:0 4px 18px rgba(12,35,74,.05); padding:24px; }
.evx-mcq .evx-mcq__q { font-size:21.5px; line-height:1.42; margin:0 0 20px; }
.evx-mcq__question-prefix { display:inline; color:#103b89; font:inherit; font-weight:900; margin-right:.32em; white-space:nowrap; }
.evx-mcq .evx-mcq-opt { border:1px solid #dce6f5; background:#fff; border-radius:12px; padding:14px 16px; min-height:58px; }
.evx-mcq .evx-mcq-opt.is-correct { border-color:#009c70; background:#e9fbf3; }
.evx-mcq .evx-mcq-opt__key { background:#edf2ff; border-radius:9px; color:#0a2450; font-weight:800; }
.evx-mcq .evx-mcq-answer,.evx-mcq .evx-mcq-readexp { color:#00986d; font-weight:800; }
.evx-mcq .evx-mcq__foot { border-top:1px solid #dce6f5; padding-top:14px; }
@media(max-width:600px){.evx-mcq{padding:16px;border-radius:14px}.evx-mcq .evx-mcq-opt{padding:11px;min-height:52px}}
