/**
 * @file
 * Per-lesson Key takeaways box + a short self-check quiz.
 */
.wl-edu-recap {
  margin: 2.5rem 0 0;
  padding: 1.1rem 1.35rem;
  background: rgba(0, 59, 255, 0.06);
  border: 1px solid rgba(0, 59, 255, 0.25);
  border-radius: var(--radius-lg, 12px);
}
.wl-edu-recap h2 { margin: 0 0 0.6rem; font-size: 1.05rem; }
.wl-edu-recap__list { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: 0.4rem; }

.wl-edu-quiz { margin: 2rem 0 0; }
.wl-edu-quiz > h2 { margin: 0 0 1rem; font-size: 1.15rem; }
.wl-edu-quiz__q {
  margin: 0 0 1.1rem;
  padding: 1.1rem 1.25rem;
  background: var(--color-bg-surface, #0b1020);
  border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.1));
  border-radius: var(--radius-lg, 12px);
}
.wl-edu-quiz__prompt { margin: 0 0 0.8rem; font-weight: 600; }
.wl-edu-quiz__opts { display: flex; flex-direction: column; gap: 0.5rem; }
.wl-edu-quiz__opt {
  text-align: left;
  padding: 0.6rem 0.85rem;
  border: 1px solid var(--color-border-subtle, rgba(255, 255, 255, 0.15));
  border-radius: var(--radius-md, 8px);
  background: transparent;
  color: var(--color-text-primary, #fff);
  font: inherit;
  cursor: pointer;
  transition: background-color 0.12s ease, border-color 0.12s ease;
}
.wl-edu-quiz__opt:hover:not(:disabled) { background: rgba(255, 255, 255, 0.05); border-color: var(--color-border-accent, rgba(255, 255, 255, 0.3)); }
.wl-edu-quiz__opt:disabled { cursor: default; }
.wl-edu-quiz__opt.is-correct {
  border-color: var(--color-success, #10b981);
  background: rgba(16, 185, 129, 0.12);
  color: #d1fae5;
}
.wl-edu-quiz__opt.is-wrong {
  border-color: var(--color-error, #ef4444);
  background: rgba(239, 68, 68, 0.1);
  color: #fecaca;
}
.wl-edu-quiz__opt.is-correct::after { content: "  ✓"; }
.wl-edu-quiz__opt.is-wrong::after { content: "  ✗"; }
.wl-edu-quiz__explain {
  margin: 0.8rem 0 0;
  padding-top: 0.7rem;
  border-top: 1px dashed var(--color-border-subtle, rgba(255, 255, 255, 0.12));
  font-size: 0.88rem;
  color: var(--color-text-secondary, rgba(255, 255, 255, 0.7));
}