.quiz-overview-center-line {
  width: 1px;
  height: 20px;
}

.quiz-content-card {
  position: relative;
}
.quiz-content-card:after {
  content: "";
  position: absolute;
  top: 12px;
  left: 12px;
  right: 12px;
  bottom: -12px;
  border-radius: 32px;
  opacity: 0.5;
  background-color: var(--white);
  z-index: -1;
}
.quiz-content-card .quiz-content-separator {
  position: relative;
  height: 16px;
}
.quiz-content-card .quiz-content-separator:after, .quiz-content-card .quiz-content-separator:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: var(--gray);
  z-index: 2;
}
.quiz-content-card .quiz-content-separator:after {
  left: -23px;
}
.quiz-content-card .quiz-content-separator:before {
  right: -23px;
}
.quiz-content-card fieldset.question-step:not(:first-of-type) {
  display: none;
}

.quiz-holding-footer, .quiz-holding-footer__progressbar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 11;
}
.quiz-holding-footer__progressbar {
  width: 0;
  height: 4px;
  background-color: var(--primary);
  transition: all 0.3s ease;
}

.quiz-time-progress-container, .quiz-time-progress-container .progress-bar {
  height: 4px;
  transition: all 0.9s ease;
}

.question-multi-answers {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  width: 100%;
  border: none;
  border-radius: 0;
}
.question-multi-answers .answer-item {
  position: relative;
  width: 100%;
  height: 197px;
}
.question-multi-answers .answer-item .image-container {
  width: 100%;
  height: 100%;
}
.question-multi-answers .answer-item .image-container:after {
  display: none;
  opacity: 0;
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 0 0 16px 16px;
  background: linear-gradient(1deg, rgba(18, 31, 62, 0.9) 0%, rgba(18, 31, 62, 0) 100%);
}
.dark-mode .question-multi-answers .answer-item .image-container:after {
  background: linear-gradient(1deg, rgba(170, 184, 197, 0.9) 0%, rgba(170, 184, 197, 0) 100%);
}
.question-multi-answers .answer-item input[type=radio] {
  visibility: hidden;
  display: none;
}
.question-multi-answers .answer-item input[type=radio]:checked + .answer-label {
  border: solid 2px var(--primary) !important;
  background-color: #ffffff;
}
.question-multi-answers .answer-item input[type=radio]:checked + .answer-label .image-container:after {
  opacity: 1;
  display: block;
}
.question-multi-answers .answer-item input[type=radio]:checked + .answer-label.is-wrong-answer {
  border: solid 2px var(--danger) !important;
}
.question-multi-answers .answer-item input[type=radio]:checked + .answer-label.is-wrong-answer .image-container:after {
  opacity: 0;
  display: none;
}
.question-multi-answers .answer-item .correct-answer {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 4;
}

.quiz-question-media-card {
  width: 100%;
  max-width: 100%;
}
.quiz-question-media-card img {
  max-width: 100%;
  max-height: 100%;
}
.quiz-question-media-card .plyr.plyr--video {
  min-height: 384px !important;
}
