/* QuizBack: the questions as trainees (and a trainer viewing a result) see them, on top of the shared ../../assets/style.css.
   The number-range boxes are the same as Reflect's score boxes (reflect/assets/style.css), kept as this module's own copy. */
.qb-page { max-width: 760px; }
.qb-form.panel { padding-top: 16px; }

.qb-q { border-top: 1px solid var(--line); padding: 1rem 0 1.4rem; }
.qb-q:first-child { border-top: 0; padding-top: 0.4rem; }
.qb-label { display: block; font-weight: 600; margin: 0 0 0.6rem; }
.qb-num { color: var(--muted); margin-right: 0.15em; }
.qb-label .req { color: var(--danger); }
.qb-q textarea { min-height: 0; }
.qb-q select { min-width: 12em; }
.qb-q.has-error .qb-label { color: #842029; }
.qb-error { margin: 0.5em 0 0; color: #842029; font-size: 0.95rem; }
.qb-error[hidden] { display: none; }

.qb-info { border-top: 0; padding: 0.4rem 0 0.8rem; }
.qb-info-text { white-space: pre-line; line-height: 1.45; }
.score-box.wide { width: auto; min-width: 4rem; padding: 0 1rem; }

.qb-tick { display: flex; align-items: center; gap: 10px; margin: 0.35em 0; font-weight: 400; cursor: pointer; }

.score-options { display: flex; justify-content: flex-end; gap: 0.5rem; flex-wrap: wrap; }
.score-option { position: relative; display: inline-block; margin: 0; font-weight: 400; cursor: pointer; }
.score-option input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.score-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  border: 2px solid #ccc;
  border-radius: 6px;
  font-size: 1.1rem;
  font-weight: 600;
  background: #fff;
  user-select: none;
  transition: background 0.15s, border-color 0.15s;
}
.score-option input:checked + .score-box { background: #90ee90; border-color: #90ee90; }
.score-option input:focus-visible + .score-box { outline: 2px solid var(--teal); outline-offset: 2px; }
.score-option input:disabled + .score-box { cursor: default; }
@media (max-width: 600px) {
  .score-box { width: 2.35rem; height: 2.35rem; font-size: 1rem; }
  .score-options { gap: 0.35rem; }
}

.qb-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 0.6rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.qb-actions .btn.big { margin-top: 0; }
.qb-actions .btn + .btn { margin-left: 0; }
.qb-status { min-height: 1.4em; margin: 0.8em 0 0; font-weight: 600; }
.qb-expiry { margin: 0.3em 0 0; color: var(--muted); }
