.rating span {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
}

.rating input {
  display: none;
}

.rating label {
  text-indent: -1000em;
  display: inline-block;
  background-image: url('/images/star-outline.svg');
  width: 1em;
  height: 1em;
  background-size: contain;
  background-repeat: no-repeat;
  padding: 2px;
  padding-right: 15px;
  cursor: pointer;
}

.rating input:hover+label,
.rating input:hover~span label,
.rating input:focus+label,
.rating input:focus~span label,
.rating input:checked+label,
.rating input:checked~span label {
  background-image: url('/images/star.svg');
}