/* ==========================================================================
   ACEVORI EXAM ENGINE
   Cover · Runner · Question navigator · Results · Review
   ==========================================================================
   Loaded only on exam and test pages.

   Every selector here targets markup we own, so there are no specificity
   fights and not a single !important — the opposite of the Tutor skin this
   replaces, which spent hundreds of lines out-ranking a plugin's stylesheet
   and broke whenever that plugin updated.
   ========================================================================== */

/* ---------- Exam page: hero stats ---------- */
.av-exam-stats { display: flex; flex-wrap: wrap; gap: var(--av-space-4); margin: var(--av-space-3) 0 var(--av-space-4); }
.av-exam-stat { display: flex; flex-direction: column; }
.av-exam-stat__num { font-family: var(--av-font-heading); font-size: clamp(24px, 5vw, 34px); font-weight: 800; color: var(--av-primary); line-height: 1.1; }
.av-exam-stat__lbl { font-size: 11.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--av-text-muted); }

/* ---------- Exam page: the list of full-length tests ---------- */
.av-test-list { display: flex; flex-direction: column; gap: 12px; }
.av-test-card {
  display: flex; align-items: center; gap: var(--av-space-3);
  padding: var(--av-space-3); background: var(--av-bg-white);
  border: 1px solid var(--av-border); border-radius: var(--av-radius-lg);
  box-shadow: var(--av-shadow-sm);
}
.av-test-card.is-locked { opacity: 0.72; }
.av-test-card__num {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 42px; height: 42px; border-radius: var(--av-radius-md);
  background: var(--av-primary); color: var(--av-text-on-primary);
  font-family: var(--av-font-heading); font-weight: 800; font-size: 16px;
}
.av-test-card__body { flex: 1 1 auto; min-width: 0; }
.av-test-card__name { margin: 0 0 4px; font-family: var(--av-font-heading); font-size: 16px; font-weight: 700; color: var(--av-primary); }
.av-test-card__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--av-text-muted); }
.av-test-card__result { margin-top: 6px; font-size: 13px; font-weight: 600; }
.av-test-card__result.is-pass { color: #1C7731; }
.av-test-card__result.is-fail { color: var(--av-cta-hover); }
.av-test-card__action { flex: 0 0 auto; }

/* ---------- Cover screen ---------- */
.av-back-link { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--av-text-muted); text-decoration: none; margin-bottom: var(--av-space-2); }
.av-back-link:hover { color: var(--av-primary); }
.av-cover-stats {
  display: flex; flex-wrap: wrap; gap: var(--av-space-4);
  margin: var(--av-space-3) 0; padding: var(--av-space-3);
  background: var(--av-bg-white); border: 1px solid var(--av-border);
  border-radius: var(--av-radius-lg);
}
.av-cover-stats div { display: flex; flex-direction: column; }
.av-cover-stats strong { font-family: var(--av-font-heading); font-size: 26px; font-weight: 800; color: var(--av-primary); line-height: 1.1; }
.av-cover-stats span { font-size: 11.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--av-text-muted); }
.av-cover-brief { margin-bottom: var(--av-space-3); color: var(--av-text-secondary); }
.av-cover-start { margin: 0 0 var(--av-space-4); }
.av-btn--lg { font-size: 16px; padding: 16px 32px; }
.av-cover-empty { padding: var(--av-space-3); background: var(--av-secondary-soft); border-radius: var(--av-radius-md); color: var(--av-secondary-dark); font-weight: 600; }

.av-attempt-list { display: flex; flex-direction: column; gap: 8px; }
.av-attempt-row {
  display: flex; align-items: center; gap: var(--av-space-2);
  padding: 13px var(--av-space-2); background: var(--av-bg-white);
  border: 1px solid var(--av-border); border-radius: var(--av-radius-md);
  text-decoration: none; color: var(--av-text);
}
.av-attempt-row:hover { border-color: var(--av-secondary); }
.av-attempt-row__date { flex: 1 1 auto; font-size: 13.5px; color: var(--av-text-secondary); }
.av-attempt-row__score { font-family: var(--av-font-heading); font-weight: 800; color: var(--av-primary); }
.av-attempt-row__badge { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 4px 10px; border-radius: var(--av-radius-full); }
.av-attempt-row__badge.is-pass { background: #EAF6EC; color: #1C7731; }
.av-attempt-row__badge.is-fail { background: var(--av-cta-light); color: var(--av-cta-hover); }
.av-attempt-row__go { color: var(--av-text-muted); display: inline-flex; }

/* ==========================================================================
   RUNNER
   ========================================================================== */
.av-runner {
  min-height: 100vh;
  min-height: 100dvh; /* tracks the collapsing mobile URL bar */
  background: var(--av-bg);
  padding-bottom: calc(var(--av-space-8) + env(safe-area-inset-bottom));
}

.av-runner__bar {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: var(--av-space-2);
  padding: 12px var(--av-space-2);
  background: var(--av-bg-white); border-bottom: 1px solid var(--av-border);
  box-shadow: var(--av-shadow-sm);
}
.av-runner__title { flex: 1 1 auto; min-width: 0; font-family: var(--av-font-heading); font-weight: 700; font-size: 14px; color: var(--av-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.av-runner__timer {
  flex: 0 0 auto; padding: 7px 14px; border-radius: var(--av-radius-full);
  background: var(--av-secondary-soft); border: 1px solid var(--av-secondary);
  color: var(--av-secondary-dark); font-family: var(--av-font-heading);
  font-weight: 800; font-size: 15px;
  /* Tabular figures stop the clock jittering as digits change width. */
  font-variant-numeric: tabular-nums;
}
.av-runner__timer.is-low { background: var(--av-cta-light); border-color: var(--av-cta); color: var(--av-cta-hover); }
.av-runner__timer.is-critical { background: var(--av-cta); border-color: var(--av-cta); color: #FFFFFF; animation: avPulse 1s ease-in-out infinite; }
@keyframes avPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }

.av-runner__progress { flex: 0 0 auto; font-size: 13px; font-weight: 600; color: var(--av-text-muted); font-variant-numeric: tabular-nums; }
.av-runner__submit {
  flex: 0 0 auto; min-height: 40px; padding: 9px 18px; border: 0;
  border-radius: var(--av-radius-full); background: var(--av-cta); color: #FFFFFF;
  font-family: var(--av-font-heading); font-weight: 700; font-size: 13.5px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.av-runner__submit:hover:not(:disabled) { background: var(--av-cta-hover); }
.av-runner__submit:disabled { opacity: 0.6; cursor: not-allowed; }

.av-runner__body { max-width: 820px; margin: 0 auto; padding: var(--av-space-3) var(--av-space-2); }

/* ---------- One question ---------- */
.av-q {
  background: var(--av-bg-white); border: 1px solid var(--av-border);
  border-radius: var(--av-radius-xl); padding: clamp(20px, 4vw, 34px);
  box-shadow: var(--av-shadow-md);
}
.av-q__head { display: flex; align-items: center; justify-content: space-between; gap: var(--av-space-2); margin-bottom: var(--av-space-2); }
.av-q__num { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--av-text-muted); }

.av-q__flag {
  display: inline-flex; align-items: center; gap: 7px; min-height: 38px;
  padding: 7px 13px; border: 1px solid var(--av-border);
  border-radius: var(--av-radius-full); background: var(--av-bg);
  color: var(--av-text-muted); font-family: var(--av-font-body);
  font-size: 12.5px; font-weight: 600; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--av-duration-fast) ease, border-color var(--av-duration-fast) ease, color var(--av-duration-fast) ease;
}
.av-q__flag.is-flagged { background: var(--av-secondary-soft); border-color: var(--av-secondary); color: var(--av-secondary-dark); }

.av-q__text { margin: 0 0 var(--av-space-3); font-family: var(--av-font-heading); font-size: clamp(17px, 2.4vw, 21px); font-weight: 700; line-height: 1.4; color: var(--av-primary); }

.av-q__options { display: flex; flex-direction: column; gap: 10px; }
.av-q__option {
  position: relative;
  display: flex; align-items: center; gap: 12px; min-height: 54px;
  padding: 13px 16px; background: var(--av-bg);
  border: 1.5px solid var(--av-border); border-radius: var(--av-radius-md);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: border-color var(--av-duration-fast) ease, background var(--av-duration-fast) ease, box-shadow var(--av-duration-fast) ease;
}
.av-q__option:hover { border-color: var(--av-secondary); background: var(--av-secondary-soft); }
.av-q__option.is-chosen { border-color: var(--av-primary); background: var(--av-primary-tint); box-shadow: 0 0 0 3px rgba(61, 26, 77, 0.08); }
/* The native radio is hidden but still focusable, so keyboard and screen
   readers keep working while we style the row instead. */
.av-q__option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.av-q__option:focus-within { outline: 2px solid var(--av-secondary); outline-offset: 2px; }
.av-q__letter {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  border: 1.5px solid var(--av-border-strong);
  font-family: var(--av-font-heading); font-size: 12.5px; font-weight: 800; color: var(--av-text-muted);
}
.av-q__option.is-chosen .av-q__letter { background: var(--av-primary); border-color: var(--av-primary); color: #FFFFFF; }
.av-q__label { font-size: 15px; line-height: 1.5; color: var(--av-text); }

.av-runner__nav { display: flex; gap: 12px; margin: var(--av-space-3) 0; }
.av-runner__nav .av-btn { flex: 1 1 0; justify-content: center; }

/* ---------- Question navigator ---------- */
.av-navigator { background: var(--av-bg-white); border: 1px solid var(--av-border); border-radius: var(--av-radius-lg); padding: var(--av-space-2); box-shadow: var(--av-shadow-sm); }
.av-navigator__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.av-navigator__title { margin: 0; font-family: var(--av-font-heading); font-size: 13px; font-weight: 700; color: var(--av-primary); }
.av-navigator__key { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--av-text-muted); }
.av-navigator__k { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.av-navigator__k--done { background: var(--av-primary); }
.av-navigator__k--flag { background: var(--av-secondary); margin-left: 8px; }

/* Capped height so a 120-question paper cannot push the question off-screen. */
.av-navigator__grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
  gap: 7px; max-height: 210px; overflow-y: auto; overscroll-behavior: contain;
}
.av-navigator__cell {
  aspect-ratio: 1; min-height: 44px;
  border: 1.5px solid var(--av-border); border-radius: 9px;
  background: var(--av-bg); color: var(--av-text-secondary);
  font-family: var(--av-font-heading); font-size: 13px; font-weight: 700;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: background var(--av-duration-fast) ease, border-color var(--av-duration-fast) ease;
}
.av-navigator__cell.is-done { background: var(--av-primary); border-color: var(--av-primary); color: #FFFFFF; }
/* Flagged is an underline rather than a fill, so a question can read as both
   answered AND flagged at once. */
.av-navigator__cell.is-flagged { border-color: var(--av-secondary); box-shadow: inset 0 -3px 0 var(--av-secondary); }
.av-navigator__cell.is-current { outline: 2px solid var(--av-cta); outline-offset: 2px; }

/* ==========================================================================
   RESULTS & REVIEW
   ========================================================================== */
.av-result-card { background: var(--av-bg-white); border: 1px solid var(--av-border); border-radius: var(--av-radius-xl); padding: var(--av-space-4); box-shadow: var(--av-shadow-md); margin-bottom: var(--av-space-4); }
.av-result-card.is-pass { border-color: #6FC482; }
.av-result-card.is-fail { border-color: var(--av-cta); }
.av-result-card__score { display: flex; align-items: center; gap: var(--av-space-2); flex-wrap: wrap; }
.av-result-card__pct { font-family: var(--av-font-heading); font-size: clamp(40px, 10vw, 60px); font-weight: 800; color: var(--av-primary); line-height: 1; }
.av-result-badge { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 6px 14px; border-radius: var(--av-radius-full); }
.av-result-badge.is-pass { background: #EAF6EC; color: #1C7731; }
.av-result-badge.is-fail { background: var(--av-cta-light); color: var(--av-cta-hover); }
.av-result-card__facts { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: var(--av-space-3) 0; font-size: 14px; color: var(--av-text-secondary); }
.av-result-card__facts strong { color: var(--av-primary); font-family: var(--av-font-heading); }
.av-result-card__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.av-result-heading { margin: var(--av-space-5) 0 var(--av-space-2); }

/* ---------- Per-topic breakdown ---------- */
.av-domain-list { display: flex; flex-direction: column; gap: 14px; margin-bottom: var(--av-space-4); }
.av-domain__head { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; margin-bottom: 6px; }
.av-domain__name { font-weight: 600; color: var(--av-primary); }
.av-domain__score { color: var(--av-text-muted); font-variant-numeric: tabular-nums; }
.av-domain__bar { height: 8px; background: var(--av-bg-alt); border-radius: var(--av-radius-full); overflow: hidden; }
.av-domain__fill { height: 100%; background: var(--av-cta); border-radius: var(--av-radius-full); }
.av-domain__fill.is-good { background: #1C7731; }

/* ---------- Answer review ---------- */
.av-review-list { display: flex; flex-direction: column; gap: 14px; }
.av-review { background: var(--av-bg-white); border: 1px solid var(--av-border); border-radius: var(--av-radius-lg); padding: var(--av-space-3); }
.av-review.is-right { border-left: 4px solid #1C7731; }
.av-review.is-wrong { border-left: 4px solid #D92D20; }
.av-review.is-blank { border-left: 4px solid var(--av-border-strong); }
.av-review__head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.av-review__num { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; border-radius: 50%; background: var(--av-primary); color: #FFFFFF; font-family: var(--av-font-heading); font-size: 12px; font-weight: 800; }
.av-review__status { font-size: 11.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--av-text-muted); }
.av-review__q { margin: 0 0 12px; font-family: var(--av-font-heading); font-size: 16px; font-weight: 700; line-height: 1.45; color: var(--av-primary); }
.av-review__options { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.av-review__option { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--av-border); border-radius: var(--av-radius-sm); font-size: 14.5px; }
.av-review__option.is-correct { border-color: #1C7731; background: #EAF6EC; }
.av-review__option.is-chosen { border-color: #D92D20; background: #FEE4E2; }
.av-review__letter { flex: 0 0 auto; font-family: var(--av-font-heading); font-weight: 800; color: var(--av-text-muted); }
.av-review__text { flex: 1 1 auto; }
/* Text labels, not colour alone — this has to survive greyscale printing and
   colour-blind readers. */
.av-review__tag { flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; }
.av-review__option.is-correct .av-review__tag { color: #1C7731; }
.av-review__option.is-chosen .av-review__tag { color: #A5231A; }
.av-review__why { padding: 12px 14px; background: var(--av-secondary-soft); border-left: 3px solid var(--av-secondary); border-radius: var(--av-radius-sm); font-size: 14px; line-height: 1.6; color: var(--av-text-secondary); }

/* ---------- Phones ---------- */
@media (max-width: 640px) {
  .av-runner__bar { flex-wrap: wrap; padding: 10px 12px; }
  .av-runner__title { flex: 1 1 100%; order: -1; font-size: 13px; }
  .av-runner__submit { margin-left: auto; }
  .av-test-card { flex-wrap: wrap; }
  .av-test-card__action { flex: 1 1 100%; }
  .av-test-card__action .av-btn { width: 100%; justify-content: center; }
  .av-navigator__grid { max-height: 168px; }
  .av-result-card { padding: var(--av-space-3); }
}

/* ---------- Print / Save as PDF ---------- */
@media print {
  .av-nav, .av-footer, .av-runner__bar, .av-navigator,
  .av-result-card__actions, .av-back-link, .av-pdf-btn { display: none !important; }
  .av-review, .av-result-card { break-inside: avoid; page-break-inside: avoid; box-shadow: none !important; }
  .av-review__option.is-correct, .av-review__option.is-chosen, .av-review__why {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
}


/* ==========================================================================
   EXAM CHROME — deliberately minimal header and footer
   ==========================================================================
   The full site nav is absent from exam pages on purpose. Someone sitting a
   timed paper has one job, and a row of links to Home, All Exams, Flashcards
   and Contact is an invitation to lose an attempt by wandering off.

   Mid-attempt the brand stops being a link too: a stray tap on a logo is the
   single easiest way to abandon a timed exam by accident.
   ========================================================================== */
.av-exam-chrome {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--av-bg-white);
  border-bottom: 1px solid var(--av-border);
}

.av-exam-chrome__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--av-space-2);
  max-width: var(--av-max-width);
  margin: 0 auto;
  padding: 12px var(--av-space-2);
}

.av-exam-chrome__logo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--av-font-heading);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--av-primary);
  text-decoration: none;
}

.av-exam-chrome__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--av-secondary);
}

.av-exam-chrome__actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.av-exam-chrome__link {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 9px 15px;
  border-radius: var(--av-radius-full);
  font-family: var(--av-font-heading);
  font-size: 13.5px;
  font-weight: 700;
  color: var(--av-primary);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--av-duration-fast) ease, color var(--av-duration-fast) ease;
}

.av-exam-chrome__link:hover {
  background: var(--av-primary-tint);
}

/* Log Out is present but never competes with the primary action. */
.av-exam-chrome__link--quiet {
  color: var(--av-text-muted);
  font-weight: 600;
}

.av-exam-chrome__link--cta {
  background: var(--av-cta);
  color: #FFFFFF;
}

.av-exam-chrome__link--cta:hover {
  background: var(--av-cta-hover);
  color: #FFFFFF;
}

/* ---------- Disclaimer-only footer ---------- */
.av-exam-foot {
  margin-top: var(--av-space-8);
  padding: var(--av-space-4) 0 calc(var(--av-space-4) + env(safe-area-inset-bottom));
  background: var(--av-bg-alt);
  border-top: 1px solid var(--av-border);
}

.av-exam-foot__inner {
  max-width: var(--av-narrow-width);
  margin: 0 auto;
  padding: 0 var(--av-space-2);
  text-align: center;
}

.av-exam-foot__text {
  margin: 0 0 10px;
  font-family: var(--av-font-body);
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--av-text-muted);
}

.av-exam-foot__meta {
  margin: 0;
  font-size: 12px;
  color: var(--av-text-muted);
}

.av-exam-foot__meta a {
  color: var(--av-text-secondary);
  font-weight: 600;
  text-decoration: none;
}

.av-exam-foot__meta a:hover {
  color: var(--av-primary);
}

/* ---------- Start-test failure notice ---------- */
.av-cover-error {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 var(--av-space-3);
  padding: 14px 16px;
  border-radius: var(--av-radius-md);
  border-left: 4px solid var(--av-cta);
  background: var(--av-cta-light);
  color: var(--av-cta-hover);
  font-size: 14px;
  line-height: 1.55;
}

.av-cover-error strong {
  font-family: var(--av-font-heading);
  font-weight: 700;
}

/* Admin-only setup warnings read as guidance, not as a student-facing error. */
.av-cover-error--admin {
  border-left-color: var(--av-secondary);
  background: var(--av-secondary-soft);
  color: var(--av-secondary-dark);
}

.av-cover-error--admin ul {
  margin: 6px 0 0;
  padding-left: 20px;
  list-style: disc;
}

@media (max-width: 640px) {
  .av-exam-chrome__inner { padding: 10px 12px; }
  .av-exam-chrome__logo { font-size: 18px; }
  .av-exam-chrome__link { padding: 8px 12px; font-size: 13px; }
}
