.star-ratings {
  position: relative;
  display: inline-block;
  font-size: 21px;
  line-height: 1;
  letter-spacing: 3px;
  unicode-bidi: bidi-override;
  -webkit-text-stroke: 1px var(--color-theme-primary);
}

/* filled stars */
.star-ratings .fill-ratings {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  overflow: hidden;
  color: var(--color-theme-primary);
  z-index: 1;
}

.star-ratings .fill-ratings span {
  display: inline-block;
}

/* empty stars */
.star-ratings .empty-ratings {
  color: var(--color-theme-primary);
  opacity: 0.35;
  z-index: 0;
}

.star-ratings .empty-ratings span {
  display: inline-block;
}