/**
 * @file
 * Styles for aggregated quiz feedback displays.
 */

.quiz-survey-embedded:has(.quiz-result-page) .quiz-survey-header {
  display: none;
}

.quiz-result-page {
  color: var(--green-900);
}

.quiz-result-page h3,
.quiz-question-aggregated-feedback h3 {
  color: var(--green-900);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 1.25rem;
}

.quiz-question-aggregated-feedback h3:last-child {
  margin-bottom: 0;
}

.feedback-header {
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
}

.feedback-header h3 {
  margin: 0 0 0.5rem 0;
  color: #333;
  font-size: 1.2rem;
  font-weight: 600;
}

.feedback-summary {
  color: #666;
  font-weight: 400;
  font-size: 0.9rem;
}

.feedback-question {
  line-height: 1.5;
  margin-bottom: 1.875rem;
}

.feedback-question p {
  margin-top: 0;
}

.feedback-question p:last-of-type {
  margin-bottom: 0;
}

.feedback-header {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 0.625rem;
}

.feedback-results {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 0;
}

.feedback-item {
  background: #fafafa;
  border: 1px solid #e4e4e4;
  border-radius: 4px;
  padding: 0.9375rem;
  margin: 0;
}

.feedback-label {
  color: var(--green-900);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.5;
  line-height: 1.4;
  margin-bottom: 10px;
}

.feedback-bar-container {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 0;
}

.feedback-bar-background {
  flex: 1;
  height: 20px;
  background: #fff;
  border-radius: 4px;
  position: relative;
  overflow: hidden;
}

.feedback-bar {
  height: 100%;
  border-radius: 4px;
  min-width: 2px;
  position: relative;
  transition: width 0.6s ease;
}

.feedback-item:nth-of-type(1) .feedback-bar {
  background: var(--green-800);
}

.feedback-item:nth-of-type(2) .feedback-bar {
  background: var(--lime);
}

.feedback-item:nth-of-type(3) .feedback-bar {
  background: #008672;
}

.feedback-item:nth-of-type(4) .feedback-bar {
  background: #0a4260;
}

.feedback-percentage {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1;
  position: absolute;
  top: 3px;
  left: 10px;
}

.feedback-item:nth-of-type(2) .feedback-percentage,
.feedback-percentage-inverse {
  color: var(--green-900);
}

/* Ranking specific styles */
.quiz-feedback-type-ranking {
}

/* True/false specific styles */
.quiz-question-answer {
  color: var(--green-900);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 0.625rem;
}

.quiz-question-feedback a {
  border-bottom: 1px solid var(--green-900);
}

.quiz-question-feedback a:focus {
  border-bottom: 1px solid var(--green-800);
}

.quiz-question-feedback a:hover {
  border-bottom: unset;
}

/* Anonymous user styles */
.quiz-survey-anonymous-message {
  margin-top: 1.875rem;
  overflow: hidden;
}

.quiz-survey-faux-results {
  padding-top: 1.875rem;
}

.faux-results-image {
  background: url(../img/faux-results.png) no-repeat left center;
  height: 393px;
  width: 100%;
}

.quiz-survey-login-prompt p {
  color: var(--green-900);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  margin-top: 0;
  margin-bottom: 1.875rem;
}