/* Radiobuttons ausblenden */
.smileys input[type="radio"] {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  position: absolute;
}

/* Labels standardmäßig grau */
.smileys label {
  cursor: pointer;
  color: var(--fontColor);
  margin-right: 10px;
  display: inline-block;
}

.smileys img {
  width: 30px;
  height: 30px;
  vertical-align: middle; /* sorgt für sauberes Ausrichten */
}

@media (max-width: 640px) {
  .smileys label {
    margin-right: 5px;
  }
  .smileys img {
    width: 21px;
    height: 21px;
  }
}

/* Farbe ändern, wenn ausgewählt */
.smileys input[type="radio"]:checked + label {
  color: var(--mainColor);
}

/* Optional: Farbe auch beim Hover */
.smileys label:hover {
  color: var(--mainColor);
}

.criterion {
  margin-bottom: 32px;
}