/* Medicare Myths quiz (views/pages/myths-quiz.njk). The card, questions,
   buttons, and review block come from calculator.css, quiz.css, and
   part-d-penalty.css; this is the true/false feedback, the recap, and the
   share buttons. */

/* True and False side by side, same width. */
.myths-choices { flex-wrap: nowrap; }
.myths-choices .quiz__answer { flex: 1 1 0; min-width: 0; }

.myths-choices .quiz__answer:disabled { cursor: default; }
.myths-choices .quiz__answer:disabled:not(.is-picked):not(.is-correct) { opacity: 0.6; }
.myths-choices .quiz__answer.is-correct { border-color: var(--color-success); }
.myths-choices .quiz__answer.is-picked.is-wrong { border-color: var(--color-danger); }
.myths-choices .quiz__answer:disabled:hover { background: var(--color-primary-tint); }

/* The answer, right after they pick. */
.myths-feedback {
  margin-top: var(--space-m);
  background: #fff;
  border-radius: var(--radius-s);
  padding: var(--space-s) var(--space-m);
  text-align: left;
}
.myths-feedback__verdict {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: var(--text-m);
  margin: 0 0 var(--space-2xs);
}
.myths-feedback__verdict:focus { outline: none; }
.myths-feedback__verdict.is-right { color: var(--color-success); }
.myths-feedback__verdict.is-wrong { color: var(--color-primary-dark); }
.myths-feedback__fact {
  margin: 0 0 var(--space-2xs);
  line-height: 1.55;
  text-wrap: pretty;
}
.myths-feedback__link {
  display: inline-block;
  color: var(--color-primary);
  font-weight: 600;
}
.myths-feedback .iep-calc__submit { width: 100%; margin-top: var(--space-s); }

/* The recap under the score. */
.myths-recap {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-2xs);
}
.myths-recap__item {
  background: var(--color-bg);
  border-radius: var(--radius-s);
  padding: var(--space-2xs) var(--space-s);
  border-left: 4px solid var(--color-primary-light);
}
.myths-recap__item.is-right { border-left-color: var(--color-success); }
.myths-recap__item.is-wrong { border-left-color: var(--color-danger); }
.myths-recap__statement {
  margin: 0;
  color: var(--color-primary-dark);
  line-height: 1.45;
}
.myths-recap__meta {
  margin: 0.2rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem var(--space-s);
  font-size: var(--text-s);
}
.myths-recap__answer { color: var(--color-primary-dark); }
.myths-recap__mark { color: var(--color-text-muted); }
.myths-recap .myths-feedback__link { font-size: var(--text-s); }

/* Share. */
.myths-share__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-2xs);
}
/* The links sit in the same row as the buttons. */
.myths-share__links { display: contents; }
/* .btn sets display, which would otherwise override [hidden]. */
.myths-share [hidden] { display: none; }
.myths-share__status {
  text-align: center;
  margin: var(--space-2xs) 0 0;
  font-size: var(--text-s);
  color: var(--color-text-muted);
  min-height: 1.2em;
}