/**
 * @file
 * Course final exam styling.
 */
.wl-edu-fq {
  margin: 1.5rem 0;
  border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.14));
  border-radius: 12px;
  background: var(--color-surface-raised, rgba(255, 255, 255, 0.03));
  overflow: hidden;
}
.wl-edu-fq__track { height: 4px; background: rgba(255, 255, 255, 0.08); }
.wl-edu-fq__bar { height: 100%; background: #5b8dff; width: 0; transition: width 0.3s ease; }
.wl-edu-fq__stage { padding: 1.3rem 1.3rem 1.5rem; }

.wl-edu-fq__prog { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-muted, rgba(255, 255, 255, 0.45)); margin-bottom: 0.5rem; }
.wl-edu-fq__q { margin: 0 0 1rem; font-size: 1.1rem; font-weight: 600; line-height: 1.4; color: var(--color-text-primary, #fff); }
.wl-edu-fq__opts { display: flex; flex-direction: column; gap: 0.5rem; }
.wl-edu-fq__opt {
  text-align: left; padding: 0.7rem 0.9rem; border-radius: 9px; cursor: pointer;
  font: inherit; font-size: 0.9rem; color: var(--color-text-primary, #fff);
  background: rgba(0, 0, 0, 0.26); border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.14));
  transition: border-color 0.12s ease, background 0.12s ease;
}
.wl-edu-fq__opt:hover:not(:disabled) { border-color: var(--color-accent-secondary, #5b8dff); background: rgba(91, 141, 255, 0.08); }
.wl-edu-fq__opt:disabled { cursor: default; }
.wl-edu-fq__opt.is-correct { border-color: #34d399; background: rgba(52, 211, 153, 0.14); color: #d6ffe9; }
.wl-edu-fq__opt.is-wrong { border-color: #f87171; background: rgba(248, 113, 113, 0.12); color: #ffdada; }

.wl-edu-fq__explain {
  margin: 0.9rem 0 0; padding: 0.7rem 0.85rem; border-radius: 8px; font-size: 0.86rem; line-height: 1.5;
  background: rgba(0, 0, 0, 0.28); border-left: 2px solid var(--color-accent-secondary, #5b8dff);
  color: var(--color-text-muted, rgba(255, 255, 255, 0.82));
}
.wl-edu-fq__nav { margin-top: 1rem; }
.wl-edu-fq__next, .wl-edu-fq__restart {
  padding: 0.6rem 1.1rem; border-radius: 8px; cursor: pointer; font-weight: 700; font-size: 0.9rem;
  color: #fff; background: var(--color-accent-secondary, #1a4eff); border: 1px solid var(--color-accent-secondary, #1a4eff);
}
.wl-edu-fq__next:hover, .wl-edu-fq__restart:hover { filter: brightness(1.08); }

.wl-edu-fq__result { text-align: center; padding: 1rem 0.5rem; }
.wl-edu-fq__score { font-size: 3rem; font-weight: 800; line-height: 1; color: #5b8dff; }
.wl-edu-fq__pct { font-size: 0.9rem; color: var(--color-text-muted, rgba(255, 255, 255, 0.5)); margin-top: 0.2rem; }
.wl-edu-fq__tier { margin: 1rem 0 0.3rem; font-size: 1.5rem; }
.wl-edu-fq__msg { margin: 0 auto 1.2rem; max-width: 50ch; color: var(--color-text-muted, rgba(255, 255, 255, 0.75)); line-height: 1.5; text-wrap: balance; }