/**
 * JQC WiVi Skin - STEP 3 (Jamia blue box/card styling).
 *
 * External, CSS-only presentation layer for the WiVi quiz view.
 * WiVi owns all markup, behaviour and base CSS; this sheet only remaps
 * WiVi's Aurora presentation onto the verified Jamia Donation-button brand.
 *
 * @package JamiaQuizCompanion
 */

/* JQC design language, scoped to the WiVi Aurora quiz root. */
.oqm-quiz.oqm-theme-aurora,
.oqm-quiz.oqm-base-nova.oqm-theme-aurora {
	--jqc-ink: #16232b;
	--jqc-ink-soft: #5a6b74;
	--jqc-line: #e3e7ea;
	--jqc-surface: #ffffff;
	--jqc-surface-alt: #f5f7f8;
	--jqc-accent: #14417C;
	--jqc-accent-hover: #0D2B59;
	--jqc-accent-ink: #FFFFFF;
	--jqc-accent-soft: rgba(20, 65, 124, .07);
	--jqc-accent-line: rgba(20, 65, 124, .24);
	--jqc-accent-shadow: 0 10px 26px -12px rgba(20, 65, 124, .55);
	--jqc-radius: 14px;
	--jqc-shadow: 0 1px 2px rgba(22, 35, 43, .05), 0 8px 24px rgba(22, 35, 43, .06);
	--jqc-shadow-hover: 0 2px 6px rgba(22, 35, 43, .07), 0 16px 40px rgba(22, 35, 43, .1);
	--aur-accent: var(--jqc-accent);
	--aur-accent-2: var(--jqc-accent);
	--aur-accent-hover: var(--jqc-accent-hover);
	--aur-ink: var(--jqc-ink);
	--aur-muted: var(--jqc-ink-soft);
	--aur-line: var(--jqc-line);
	--aur-soft: var(--jqc-accent-soft);
	--aur-shadow: var(--jqc-shadow);
	--nv-accent: var(--jqc-accent);
	--nv-accent-hover: var(--jqc-accent-hover);
	--nv-accent-rgb: 20, 65, 124;
	--nv-accent-soft: var(--jqc-accent-soft);
	--nv-canvas: var(--jqc-surface-alt);
	--nv-blob-1: rgba(20, 65, 124, .10);
	--nv-blob-2: rgba(20, 65, 124, .06);
	--nv-card-bg: var(--jqc-surface);
	--nv-card-border: var(--jqc-line);
	--nv-card-shadow: var(--jqc-shadow);
	--nv-text: var(--jqc-ink);
	--nv-text-muted: var(--jqc-ink-soft);
	--nv-option-bg: var(--jqc-surface);
	--nv-option-border: var(--jqc-line);
	--nv-option-text: var(--jqc-ink);
	--nv-option-picked-bg: var(--jqc-accent-soft);
	--nv-option-picked-border: var(--jqc-accent);
	--nv-option-picked-text: var(--jqc-ink);
	--nv-option-letter-bg: var(--jqc-accent-soft);
	--nv-option-letter-text: var(--jqc-accent);
	--nv-option-radius: var(--jqc-radius);
	--nv-radius: var(--jqc-radius);
	--nv-radius-sm: 10px;
	--nv-shadow: var(--jqc-shadow);
	--nv-shadow-soft: var(--jqc-shadow);
	--nv-progress-bg: var(--jqc-line);
	--nv-progress-fill: var(--jqc-accent);
	--nv-progress-glow: rgba(20, 65, 124, .35);
	--nv-btn-primary-bg: var(--jqc-accent);
	--nv-btn-primary-hover: var(--jqc-accent-hover);
	--nv-btn-glow: rgba(20, 65, 124, .55);
	--nv-btn-radius: 999px;
	--nv-btn-secondary-bg: var(--jqc-surface);
	--nv-btn-secondary-text: var(--jqc-accent);
	--nv-btn-secondary-border: var(--jqc-accent-line);
	--nv-input-bg: var(--jqc-surface);
	--nv-input-border: var(--jqc-line);
	--nv-timer-bg: var(--jqc-accent-soft);
	--nv-timer-text: var(--jqc-accent);
}

.oqm-quiz.oqm-theme-aurora .oqm-nova-intro-aside {
	background: var(--jqc-accent);
	color: var(--jqc-accent-ink);
}
.oqm-quiz.oqm-theme-aurora .oqm-nova-intro-aside::after { background: radial-gradient(circle, rgba(255, 255, 255, .14), transparent 70%); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-intro-trophy { background: rgba(255, 255, 255, .14); color: var(--jqc-accent-ink); border: 1px solid rgba(255, 255, 255, .24); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-aside-title,
.oqm-quiz.oqm-theme-aurora .oqm-nova-aside-desc,
.oqm-quiz.oqm-theme-aurora .oqm-nova-aside-meta li { color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-aside-desc { opacity: .82; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-aside-meta li { opacity: .94; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-intro-main .oqm-quiz-category,
.oqm-quiz.oqm-theme-aurora .oqm-nova-timer { color: var(--jqc-accent) !important; -webkit-text-fill-color: var(--jqc-accent) !important; background: var(--jqc-accent-soft); border-color: var(--jqc-accent-line); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-check { background: var(--jqc-accent-soft); color: var(--jqc-accent); }

.oqm-quiz.oqm-theme-aurora .oqm-start-quiz-btn,
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-primary { background: var(--jqc-accent) !important; color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; border-color: transparent !important; border-radius: 999px; box-shadow: var(--jqc-accent-shadow); transition: all .25s ease; transform: none; filter: none; }
.oqm-quiz.oqm-theme-aurora .oqm-start-quiz-btn:hover,
.oqm-quiz.oqm-theme-aurora .oqm-start-quiz-btn:focus-visible,
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-primary:hover,
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-primary:focus-visible { background: var(--jqc-accent-hover) !important; color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; border-color: var(--jqc-accent-hover) !important; box-shadow: var(--jqc-accent-shadow); transform: none; filter: none; }
.oqm-quiz.oqm-theme-aurora .oqm-start-quiz-btn::before,
.oqm-quiz.oqm-theme-aurora .oqm-start-quiz-btn:hover::before,
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-primary::after { display: none; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn:active { transform: none; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-secondary { background: var(--jqc-surface) !important; color: var(--jqc-accent) !important; -webkit-text-fill-color: var(--jqc-accent) !important; border-color: var(--jqc-accent-line) !important; box-shadow: none !important; transition: all .25s ease; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-secondary:hover,
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-secondary:focus-visible { background: var(--jqc-accent-hover) !important; color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; border-color: var(--jqc-accent-hover) !important; transform: none; }

.oqm-quiz.oqm-theme-aurora .oqm-nova-option:hover { border-color: var(--jqc-accent); background: var(--jqc-accent-soft); box-shadow: none; transform: none; filter: none; transition: all .25s ease; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-option::before { display: none; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-option-letter { background: var(--jqc-accent-soft); color: var(--jqc-accent) !important; -webkit-text-fill-color: var(--jqc-accent) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-option.oqm-nova-picked { border-color: var(--jqc-accent); background: var(--jqc-accent-soft); box-shadow: 0 8px 20px rgba(20, 65, 124, .14); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-option.oqm-nova-picked .oqm-nova-option-letter { background: var(--jqc-accent); color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-option.oqm-nova-picked .oqm-nova-option-icon { color: var(--jqc-accent); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-progress-bar { background: var(--jqc-accent); box-shadow: 0 0 12px var(--nv-progress-glow); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn:focus-visible,
.oqm-quiz.oqm-theme-aurora .oqm-nova-option:focus-visible { outline: 3px solid rgba(20, 65, 124, .32); outline-offset: 3px; }

.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen.oqm-nova-card { background: var(--jqc-surface); border: 1px solid var(--jqc-accent-line); border-radius: var(--jqc-radius); box-shadow: 0 14px 36px rgba(20, 65, 124, .12); overflow: hidden; }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-header { background: var(--jqc-accent); border-bottom-color: var(--jqc-accent); color: var(--jqc-accent-ink); }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-counter,
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-quiz-title { color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-timer { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .28); color: var(--jqc-accent-ink) !important; -webkit-text-fill-color: var(--jqc-accent-ink) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-progress { background: rgba(255, 255, 255, .22); }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-progress-bar { background: var(--jqc-accent-ink); box-shadow: 0 0 12px rgba(255, 255, 255, .32); }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-question { background: var(--jqc-surface); }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-q-num { color: var(--jqc-accent) !important; -webkit-text-fill-color: var(--jqc-accent) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-q-title { color: var(--jqc-ink) !important; -webkit-text-fill-color: var(--jqc-ink) !important; }
.oqm-quiz.oqm-theme-aurora .oqm-theme-question-screen .oqm-nova-footer { background: var(--jqc-surface-alt); border-top-color: var(--jqc-line); }

/* Remaining WiVi boxes: colour-only Jamia blue treatment. */
.oqm-quiz.oqm-theme-aurora .oqm-theme-intro-screen.oqm-nova-card,
.oqm-quiz.oqm-theme-aurora .oqm-theme-result-screen.oqm-nova-card,
.oqm-quiz.oqm-theme-aurora .oqm-theme-review-screen.oqm-nova-card,
.oqm-quiz.oqm-theme-aurora .oqm-theme-blocked { background: var(--jqc-surface); border-color: var(--jqc-accent-line); box-shadow: var(--jqc-shadow); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-option,
.oqm-quiz.oqm-theme-aurora .oqm-nova-stat,
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-stat,
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-item,
.oqm-quiz.oqm-theme-aurora .oqm-answer-dot { background: var(--jqc-surface); border-color: var(--jqc-line); color: var(--jqc-ink); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-item:hover,
.oqm-quiz.oqm-theme-aurora .oqm-answer-dot:hover { background: var(--jqc-accent-soft); border-color: var(--jqc-accent); box-shadow: none; transform: none; filter: none; transition: all .25s ease; }
.oqm-quiz.oqm-theme-aurora .oqm-nova-result,
.oqm-quiz.oqm-theme-aurora .oqm-nova-review,
.oqm-quiz.oqm-theme-aurora .oqm-theme-answer-review,
.oqm-quiz.oqm-theme-aurora .oqm-modal-content,
.oqm-quiz.oqm-theme-aurora .oqm-solution-modal-content { background: var(--jqc-surface); border-color: var(--jqc-line); color: var(--jqc-ink); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-summary,
.oqm-quiz.oqm-theme-aurora .oqm-nova-result-stats { background: var(--jqc-surface-alt); border-color: var(--jqc-line); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-result-icon,
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-badge,
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-num,
.oqm-quiz.oqm-theme-aurora .oqm-nova-review-qnum { color: var(--jqc-accent); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-score-ring-fill { stroke: var(--jqc-accent); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-score-ring-track { stroke: var(--jqc-line); }
.oqm-quiz.oqm-theme-aurora .oqm-nova-btn-ghost:hover,
.oqm-quiz.oqm-theme-aurora .oqm-answer-dot.is-active,
.oqm-quiz.oqm-theme-aurora .oqm-answer-dot[aria-current="true"] { background: var(--jqc-accent-soft); border-color: var(--jqc-accent); color: var(--jqc-accent); }

@media (prefers-reduced-motion: reduce) {
	.oqm-quiz.oqm-theme-aurora .oqm-nova-btn,
	.oqm-quiz.oqm-theme-aurora .oqm-nova-option { transition-duration: .01ms; }
}


/* JQC Solutions modal skin (presentation only; WiVi owns markup). */
.oqm-solution-modal{--jqc-ink:#16232b;--jqc-ink-soft:#5a6b74;--jqc-line:#e3e7ea;--jqc-surface:#fff;--jqc-surface-alt:#f5f7f8;--jqc-accent:#14417C;--jqc-accent-soft:rgba(20,65,124,.07);--jqc-ok:#1f8a4c;--jqc-ok-soft:#eefaf2;--jqc-bad:#c0392f;--jqc-bad-soft:#fdf1f0;font-family:inherit;color:var(--jqc-ink);padding:20px}
.oqm-solution-modal .oqm-modal-backdrop{background:rgba(13,43,89,.55)}
.oqm-solution-panel{border-radius:18px;border:1px solid var(--jqc-line);box-shadow:0 24px 60px -18px rgba(13,43,89,.45);width:min(680px,100%)}
.oqm-solution-header{background:var(--jqc-accent);color:#fff;border-bottom:none;padding:16px 22px}
.oqm-solution-header h3{color:#fff;font-size:1.05rem;font-weight:700;letter-spacing:.01em}
.oqm-solution-close-btn{color:#fff;opacity:.85;width:32px;height:32px;border-radius:50%;font-size:22px;transition:background .15s ease,opacity .15s ease}
.oqm-solution-close-btn:hover{opacity:1;background:rgba(255,255,255,.16)}

.oqm-solution-body{padding:22px 24px 24px;background:var(--jqc-surface)}
.oqm-solution-q-num{width:30px;height:30px;font-size:13px;box-shadow:0 6px 14px -8px rgba(22,35,43,.8)}
.oqm-sol-correct .oqm-solution-q-num{background:var(--jqc-ok)}
.oqm-sol-wrong .oqm-solution-q-num{background:var(--jqc-bad)}
.oqm-sol-skipped .oqm-solution-q-num{background:var(--jqc-ink-soft)}
.oqm-solution-q-text{font-size:1rem;font-weight:600;color:var(--jqc-ink);margin-bottom:16px}
.oqm-solution-opt{border:1px solid var(--jqc-line);border-radius:12px;background:var(--jqc-surface);color:var(--jqc-ink);padding:12px 14px;padding-right:116px}
.oqm-solution-opt-num{background:var(--jqc-accent-soft);color:var(--jqc-accent);font-size:13px}
.oqm-solution-opt.is-correct{border-color:rgba(31,138,76,.55);background:var(--jqc-ok-soft)}
.oqm-solution-opt.is-correct .oqm-solution-opt-num{background:rgba(31,138,76,.14);color:var(--jqc-ok)}
.oqm-solution-opt.is-wrong{border-color:rgba(192,57,47,.5);background:var(--jqc-bad-soft)}
.oqm-solution-opt.is-wrong .oqm-solution-opt-num{background:rgba(192,57,47,.12);color:var(--jqc-bad)}

.oqm-sol-tag{color:var(--jqc-ok);background:rgba(31,138,76,.12);border-radius:999px;padding:4px 10px;letter-spacing:.02em;text-transform:uppercase}
.oqm-sol-tag-wrong{color:var(--jqc-bad);background:rgba(192,57,47,.12)}
.oqm-solution-explain{background:var(--jqc-surface-alt);border-left:4px solid var(--jqc-accent);border-radius:12px;color:var(--jqc-ink)}
.oqm-solution-nav{background:var(--jqc-surface);border:1px solid var(--jqc-line);color:var(--jqc-accent);width:40px;height:56px;border-radius:12px;box-shadow:0 10px 24px -14px rgba(13,43,89,.7);transition:background .15s ease,color .15s ease}
.oqm-solution-nav:hover:not(:disabled){background:var(--jqc-accent);color:#fff}
.oqm-solution-footer{background:var(--jqc-surface-alt);border-top:1px solid var(--jqc-line);padding:14px 18px;gap:8px}
.oqm-sol-footer-dot{width:32px;height:32px;font-size:12px;box-shadow:0 4px 10px -6px rgba(22,35,43,.8);transition:transform .15s ease}
.oqm-sol-footer-dot:hover{transform:translateY(-1px)}
.oqm-sol-dot-correct{background:var(--jqc-ok)}
.oqm-sol-dot-wrong{background:var(--jqc-bad)}
.oqm-sol-dot-skipped{background:var(--jqc-ink-soft)}
.oqm-sol-footer-dot.is-active,.oqm-sol-footer-dot[aria-current="true"]{outline:2px solid var(--jqc-accent);outline-offset:2px;box-shadow:none}
@media (max-width:640px){.oqm-solution-modal{padding:12px}.oqm-solution-header{padding:14px 16px}.oqm-solution-body{padding:18px 16px}.oqm-solution-opt{padding-right:14px}.oqm-sol-tag{position:static;transform:none;margin-left:auto}.oqm-sol-footer-dot{width:28px;height:28px}}