/* Full-screen payment loading — transparent GIF only, no tile box */
.purchase-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: all;
}

.purchase-loading-overlay[hidden] {
  display: none !important;
}

.purchase-loading-overlay.is-active {
  animation: purchase-overlay-in 0.28s ease forwards;
}

.purchase-loading-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(245, 246, 248, 0.94);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.purchase-loading-core {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  text-align: center;
  padding: 1rem;
  background: transparent;
  box-shadow: none;
}

.payment-loading-gif {
  display: block;
  width: 8rem;
  height: 8rem;
  max-width: min(8rem, 40vw);
  max-height: min(8rem, 40vw);
  object-fit: contain;
  background: transparent !important;
  border: none;
  box-shadow: none;
  /* Knock out baked-in white GIF background on light overlay */
  mix-blend-mode: multiply;
}

.purchase-loading-fallback-spinner {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 999px;
  border: 3px solid rgba(75, 73, 225, 0.18);
  border-top-color: #4b49e1;
  animation: purchase-fallback-spin 0.85s linear infinite;
}

.purchase-loading-text {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #475569;
  letter-spacing: 0.01em;
}

html.purchase-loading-lock,
html.purchase-loading-lock body {
  overflow: hidden !important;
}

@keyframes purchase-overlay-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes purchase-fallback-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .purchase-loading-fallback-spinner {
    animation: none;
  }
}