/* Selectors are doubled under :root so they beat page/module panel styles that also use !important.
   BB answer-feedback standard: once a question is graded, the whole card edge lights up.
   Add .bb-q-right or .bb-q-wrong to the question's container (drill card, quick check, lab question).
   Matches the Intel quick checks (e.g. free/intel/a-plus-operating-system-types-and-file-systems). */
:root {
  --bb-q-ok: var(--theme-component-primary-1);
  --bb-q-ok-glow: var(--theme-component-primary-2);
  --bb-q-ok-wash: var(--theme-component-primary-3);
  --bb-q-bad: var(--theme-component-error-1);
  --bb-q-bad-glow: var(--theme-component-error-2);
  --bb-q-bad-wash: var(--theme-component-error-3);
}
html[data-bb-theme='patriotic'] {
  --bb-q-ok: var(--theme-component-primary-4);
  --bb-q-ok-glow: var(--theme-component-primary-5);
  --bb-q-ok-wash: var(--theme-component-primary-6);
  --bb-q-bad: var(--theme-component-error-4);
  --bb-q-bad-glow: var(--theme-component-error-5);
  --bb-q-bad-wash: var(--theme-component-error-6);
}

:root .bb-q-right.bb-q-right,
:root .bb-q-wrong.bb-q-wrong {
  transition: border-color 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}
:root .bb-q-right.bb-q-right {
  border-color: var(--bb-q-ok) !important;
  box-shadow: 0 0 0 1px var(--bb-q-ok), 0 0 28px -8px var(--bb-q-ok-glow) !important;
  background-image: linear-gradient(90deg, var(--bb-q-ok-wash), transparent 40%) !important;
}
:root .bb-q-wrong.bb-q-wrong {
  border-color: var(--bb-q-bad) !important;
  box-shadow: 0 0 0 1px var(--bb-q-bad), 0 0 28px -8px var(--bb-q-bad-glow) !important;
  background-image: linear-gradient(90deg, var(--bb-q-bad-wash), transparent 40%) !important;
}

@media (prefers-reduced-motion: reduce) {
  .bb-q-right, .bb-q-wrong { transition: none; }
}