.xpressa-rating[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--subject,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--content {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: transparent !important;
  isolation: isolate;
  opacity: 1 !important;
  overflow: hidden;
  pointer-events: none;
  position: relative;
}

.xpressa-rating[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button::before,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--subject::before,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--content::before {
  animation: xpressa-rating-shimmer 1.25s ease-in-out infinite;
  background-color: rgb(127 127 127 / 14%);
  background-image: linear-gradient(
    105deg,
    var(--xpressa-rating-shimmer-base) 18%,
    var(--xpressa-rating-shimmer-highlight) 42%,
    var(--xpressa-rating-shimmer-base) 66%
  );
  background-position: 100% 0;
  background-size: 250% 100%;
  border: 1px solid var(--xpressa-rating-shimmer-base);
  border-radius: 0.25rem;
  content: "";
  inset: 2px;
  position: absolute;
  z-index: 0;
}

.xpressa-rating[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button > *,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--subject > *,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--content > * {
  visibility: hidden;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart) {
  background: transparent !important;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart) > * {
  color: transparent !important;
  visibility: visible;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart) > .xpressa-rating__vote-icon,
.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart) > .xpressa-rating__button-count {
  background: var(--xpressa-rating-shimmer-base) !important;
  flex-shrink: 0;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart) > .xpressa-rating__vote-icon {
  border-radius: 0.1875rem;
  fill: transparent;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart) > .xpressa-rating__button-label {
  background: linear-gradient(var(--xpressa-rating-shimmer-base), var(--xpressa-rating-shimmer-base)) center / 100% 0.5rem no-repeat;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button:not(.xpressa-rating__button--heart)::before {
  background-color: transparent;
  background-image: linear-gradient(
    105deg,
    transparent 20%,
    var(--xpressa-rating-shimmer-highlight) 50%,
    transparent 80%
  );
  background-position: 100% 0;
  background-size: 250% 100%;
  border: 0;
  border-radius: inherit;
  inset: 0;
}

.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button[data-xpressa-rating-value="down"]::before {
  animation-delay: 0.12s;
}

.xpressa-rating--subject[data-rating-loading="true"] .xpressa-rating__summary--subject::before,
.xpressa-rating--content[data-rating-loading="true"] .xpressa-rating__summary--content::before {
  border-radius: 999px;
}

.xpressa-rating[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button--heart::before {
  border: 0;
  border-radius: 999px;
  height: 2.75rem;
  inset: 0 auto auto 0;
  width: 2.75rem;
}

.xpressa-rating--subject[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__star::before {
  background-color: var(--xpressa-rating-star-shimmer-base);
  background-image: linear-gradient(
    105deg,
    var(--xpressa-rating-star-shimmer-base) 18%,
    var(--xpressa-rating-star-shimmer-highlight) 42%,
    var(--xpressa-rating-star-shimmer-base) 66%
  );
  border: 0;
  border-radius: 0;
  clip-path: polygon(
    50% 0%,
    61% 35%,
    98% 35%,
    68% 57%,
    79% 94%,
    50% 72%,
    21% 94%,
    32% 57%,
    2% 35%,
    39% 35%
  );
  height: 1.125rem;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width: 1.125rem;
}

.xpressa-rating--subject[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__star:nth-child(2)::before,
.xpressa-rating--content[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button[data-xpressa-rating-value="up"]::before {
  animation-delay: 0.08s;
}

.xpressa-rating--subject[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__star:nth-child(3)::before {
  animation-delay: 0.16s;
}

.xpressa-rating--subject[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__star:nth-child(4)::before {
  animation-delay: 0.24s;
}

.xpressa-rating--subject[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__star:nth-child(5)::before,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--subject::before,
.xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--content::before {
  animation-delay: 0.32s;
}

@keyframes xpressa-rating-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .xpressa-rating-skeleton__row::after,
  .xpressa-rating[data-rating-loading="true"] > .xpressa-rating__controls .xpressa-rating__button::before,
  .xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--subject::before,
  .xpressa-rating[data-rating-loading="true"] .xpressa-rating__summary--content::before {
    animation: none;
    background-position: 50% 0;
  }
}
