/* ============================================================
   ACCESSIBLE ANSWER FEEDBACK THEME
   Load after quiz-style-v8.css
   Toggle with: body.accessible-theme
   ============================================================ */

body.accessible-theme {
  --answer-correct-bg: #e8f1ff;
  --answer-correct-bg-2: #cfe2ff;
  --answer-correct-border: #1d4ed8;
  --answer-correct-text: #102a60;

  --answer-wrong-bg: #fff1e6;
  --answer-wrong-bg-2: #ffd8a8;
  --answer-wrong-border: #c2410c;
  --answer-wrong-text: #5f1a0a;

  --answer-partial-bg: #f3e8ff;
  --answer-partial-border: #7c3aed;
  --answer-partial-text: #3b0764;
}

body.accessible-theme .feedback.correct {
  background: var(--answer-correct-bg) !important;
  border: 2px solid var(--answer-correct-border) !important;
  color: var(--answer-correct-text) !important;
}

body.accessible-theme .feedback.incorrect {
  background:
    repeating-linear-gradient(
      45deg,
      var(--answer-wrong-bg),
      var(--answer-wrong-bg) 10px,
      var(--answer-wrong-bg-2) 10px,
      var(--answer-wrong-bg-2) 20px
    ) !important;
  border: 2px dashed var(--answer-wrong-border) !important;
  color: var(--answer-wrong-text) !important;
  font-weight: 900;
}

body.accessible-theme .feedback.partial {
  background: var(--answer-partial-bg) !important;
  border: 2px solid var(--answer-partial-border) !important;
  color: var(--answer-partial-text) !important;
  font-weight: 900;
}

body.accessible-theme .choice {
  border-left: 12px solid transparent;
  padding-left: 8px;
  box-sizing: border-box;
}

body.accessible-theme .choice.correct,
body.accessible-theme .choice.correct-answer,
body.accessible-theme .choice.is-correct,
body.accessible-theme .choice[style*="#d4edda"],
body.accessible-theme .choice[style*="rgb(212, 237, 218)"] {
  background: var(--answer-correct-bg) !important;
  border-left-color: var(--answer-correct-border) !important;
  outline: 2px solid var(--answer-correct-border) !important;
  color: var(--answer-correct-text) !important;
  font-weight: 900;
  padding: 4px 8px !important;
}

body.accessible-theme .choice.incorrect,
body.accessible-theme .choice.wrong,
body.accessible-theme .choice.incorrect-answer,
body.accessible-theme .choice.is-incorrect,
body.accessible-theme .choice[style*="#f8d7da"],
body.accessible-theme .choice[style*="rgb(248, 215, 218)"] {
  background:
    repeating-linear-gradient(
      45deg,
      var(--answer-wrong-bg),
      var(--answer-wrong-bg) 10px,
      var(--answer-wrong-bg-2) 10px,
      var(--answer-wrong-bg-2) 20px
    ) !important;
  border-left-color: var(--answer-wrong-border) !important;
  outline: 2px dashed var(--answer-wrong-border) !important;
  color: var(--answer-wrong-text) !important;
  font-weight: 900;
  padding: 4px 8px !important;
}

body.accessible-theme .choice.correct::after,
body.accessible-theme .choice.correct-answer::after,
body.accessible-theme .choice.is-correct::after,
body.accessible-theme .choice[style*="#d4edda"]::after,
body.accessible-theme .choice[style*="rgb(212, 237, 218)"]::after {
  content: "  ✓";
  font-weight: 900;
  color: var(--answer-correct-text);
}

body.accessible-theme .choice.incorrect::after,
body.accessible-theme .choice.wrong::after,
body.accessible-theme .choice.incorrect-answer::after,
body.accessible-theme .choice.is-incorrect::after,
body.accessible-theme .choice[style*="#f8d7da"]::after,
body.accessible-theme .choice[style*="rgb(248, 215, 218)"]::after {
  content: "  ✗";
  font-weight: 900;
  color: var(--answer-wrong-text);
}

body.accessible-theme .timing-grid .timing-cell.correct {
  background: var(--answer-correct-bg) !important;
  outline: 2px solid var(--answer-correct-border) !important;
  color: var(--answer-correct-text) !important;
}

body.accessible-theme .timing-grid .timing-cell.incorrect {
  background:
    repeating-linear-gradient(
      45deg,
      var(--answer-wrong-bg),
      var(--answer-wrong-bg) 8px,
      var(--answer-wrong-bg-2) 8px,
      var(--answer-wrong-bg-2) 16px
    ) !important;
  outline: 2px dashed var(--answer-wrong-border) !important;
  color: var(--answer-wrong-text) !important;
}

body.accessible-theme input[type="text"] {
  background: #fff;
  border: 2px solid #333;
}

body.accessible-theme input[type="text"].correct,
body.accessible-theme input[type="text"].is-correct,
body.accessible-theme input[type="text"][style*="#d4edda"],
body.accessible-theme input[type="text"][style*="rgb(212, 237, 218)"] {
  background: var(--answer-correct-bg) !important;
  border: 3px solid var(--answer-correct-border) !important;
  box-shadow: 0 0 0 2px #1d4ed833 !important;
  color: var(--answer-correct-text) !important;
  font-weight: 900;
}

body.accessible-theme input[type="text"].incorrect,
body.accessible-theme input[type="text"].wrong,
body.accessible-theme input[type="text"].is-incorrect,
body.accessible-theme input[type="text"][style*="#f8d7da"],
body.accessible-theme input[type="text"][style*="rgb(248, 215, 218)"] {
  background:
    repeating-linear-gradient(
      45deg,
      var(--answer-wrong-bg),
      var(--answer-wrong-bg) 6px,
      var(--answer-wrong-bg-2) 6px,
      var(--answer-wrong-bg-2) 12px
    ) !important;
  border: 1px dashed var(--answer-wrong-border) !important;
  color: var(--answer-wrong-text) !important;
}

.theme-toggle {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 9999;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: white;
  border: 1px solid #bbb;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 13px;
  box-shadow: 0 2px 8px #0002;
}

.theme-switch {
  width: 42px;
  height: 22px;
  padding: 2px;
  border: 2px solid #003262;
  border-radius: 999px;
  background: #ddd;
  cursor: pointer;
}

.theme-switch span {
  display: block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #003262;
  transition: transform 0.15s;
}

.theme-switch[aria-checked="true"] {
  background: #e8f1ff;
}

.theme-switch[aria-checked="true"] span {
  transform: translateX(18px);
}

@media print {
  .theme-toggle {
    display: none !important;
  }
}