.self_care-quiz-questions {
  text-align: center;
}

.yes_icon::before, .no_icon::before {
  font-family: 'Material Icons', 'Material Symbols Outlined';
  opacity: 0.5;
  display: inline-block;
  vertical-align: middle;
  font-size: 1em;
}

.yes_icon::before {
  content: "\e5ca";
}

.no_icon::before {
  content: "\e5cd";
}

input[type="radio"] {
  appearance: none;
  margin: 0;
  width: 1em;
  height: 1em;
  border: none; /* Optional: removes any default border */
  background: transparent; /* Optional: makes the background transparent */
}

input[type="radio"] + .yes_icon::before, input[type="radio"] + .no_icon::before {
  cursor: pointer;
}

/* Green color when 'yes' option is checked */
input[type="radio"]:checked + .yes_icon::before {
  opacity: 1; /* Makes the icon fully opaque when selected */
  color: green; /* Specific color for 'yes' */
}

/* Red color when 'no' option is checked */
input[type="radio"]:checked + .no_icon::before {
  opacity: 1; /* Makes the icon fully opaque when selected */
  color: red; /* Specific color for 'no' */
}

.question-icon {
  opacity: 0.5;
  font-size: 7em;
}

.feedback {
  display: none;
}

.feedback-item {
    display: none;
    border: 2px solid #000;
    padding: 10px;
    margin: 10px;
    background-color: transparent;
    width: calc(100% - 24px);
    box-sizing: border-box;
    border-radius: 10px;
    position: relative; /* Added so the ::before pseudo-element is positioned relative to this box */
    text-align: center; /* Centers the content inside */
}
.question {
    border: 2px solid #000;
    padding: 10px;
    margin: 10px;
    background-color: transparent;
    width: calc(100% - 24px);
    box-sizing: border-box;
    border-radius: 10px;
    position: relative; /* Added so the ::before pseudo-element is positioned relative to this box */
    text-align: center; /* Centers the content inside */
}

.shower::before, .teeth::before, .clothes::before, .food::before, .water::before, .alcohol::before, .sleep::before, .exercise::before, .doctor::before, .cleanliness::before, .breaks::before, .work-life::before, .relaxation::before, .stress::before, .outdoors::before, .friends::before, .screen-time::before, .medication::before, .mental-health::before, .social-media::before, .financial::before, .purpose::before {
  font-family: 'Material Symbols Outlined';
  display: inline-block; /* Aligns the icon with the text properly */
  font-size: 5em;
  opacity: 0.5;
  vertical-align: middle; /* Centers the icon vertically relative to adjacent text */
}


.shower::before { content: '\f061'; }
.teeth::before { content: '\e0a6'; }
.clothes::before { content: '\ef7b'; }
.food::before { content: '\e56c'; }
.water::before { content: '\f69d'; }
.alcohol::before { content: '\ea60'; }
.sleep::before { content: '\e53a'; }
.exercise::before { content: '\f81f'; }
.doctor::before { content: '\f805'; }
.cleanliness::before { content: '\ea44'; }
.breaks::before { content: '\e8b5'; }
.work-life::before { content: '\eaf6'; }
.relaxation::before { content: '\ea78'; }
.stress::before { content: '\f6a2'; }
.outdoors::before { content: '\e407'; }
.friends::before { content: '\f857'; }
.screen-time::before { content: '\f6ab'; }
.medication::before { content: '\e11f'; }
.mental-health::before { content: '\ea4a'; }
.social-media::before { content: '\e80d'; }
.financial::before { content: '\e2eb'; }
.purpose::before { content: '\e55e'; }

label.yes_answer, label.no_answer {
  cursor: pointer; /* Ensure the cursor changes to a pointer when hovering over the labels */
}
#shareButton {
  display: none;
}
.share-my-plan-button-container {
  text-align: center;
}