/*
 Remove the radio buttons from the page.
*/
input[type="radio"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

/*
 Limit the size of added images
*/
img {
  max-width: 575px;
}

main {
  width: 100vw;
  display: flex;
  flex-direction: column;
  padding: 0 3rem;
}

#question-section {
  font-size: 50px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#choices {
  font-size: 100px;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#choices > * {
  font-size: 100px;
  display: flex;
  width: 1000px;
}

.button-container {
  font-size: 100px;
  display: flex;
  justify-content: flex-start;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  gap: 2rem;
  margin: 1rem;
}

label {
  width: inherit;
  padding: 0.5rem 1rem;
  border-radius: 0.3rem;
}

label,
button {
  cursor: pointer;
}

/*
Style to indicate a selected, correct,
and/or incorrect answers.
*/
label:has(~ :checked) {
  border: 20px solid black;
}

label:has(~ .correct:checked) {
  border-color: green;
}

label:has(~ .incorrect:checked) {
  border-color: red;
}

label span {
  padding-left: 0.5rem;
}

.hidden {
  display: none !important;
}