.str-btn.is-loading,
.str-tickets-btn.is-loading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  cursor: progress;
}

.str-btn.is-loading::before,
.str-tickets-btn.is-loading::before {
  content: "";
  position: absolute;
  inset: 0;
  width: var(--str-btn-load, 72%);
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--str-color-surface-2, #f1f5f9) 50%,
    transparent 100%
  );
  animation: str-btn-load-pulse calc(var(--str-duration-dramatic, 800ms) + var(--str-duration-slow, 300ms)) var(--str-ease-in-out, cubic-bezier(0.4, 0, 0.2, 1)) infinite;
  transition: width var(--str-duration-normal, 200ms) var(--str-ease-out, cubic-bezier(0, 0, 0.2, 1));
  pointer-events: none;
}

@keyframes str-btn-load-pulse {
  0% {
    width: 26%;
  }
  50% {
    width: 84%;
  }
  100% {
    width: 42%;
  }
}
