/* Shared "pending" visual for any button being guarded by MoonfallClickGuard.
   Reuses the spinner keyframes from foundry.css so cards/forge/lobby/etc.
   share a single rotation animation. */

@keyframes mf-pending-spin {
  to { transform: rotate(360deg); }
}

.btn-pending {
  position: relative;
  cursor: progress !important;
  color: rgba(238, 219, 241, 0.55) !important;
  pointer-events: none;
}

.btn-pending > * {
  opacity: 0.5;
}

.btn-pending::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 1.2vmin;
  width: 2.4vmin;
  height: 2.4vmin;
  margin-top: -1.2vmin;
  border-radius: 50%;
  border: 0.32vmin solid rgba(238, 219, 241, 0.25);
  border-top-color: rgba(238, 219, 241, 0.95);
  animation: mf-pending-spin 0.9s linear infinite;
  pointer-events: none;
}

button[disabled].btn-pending {
  opacity: 0.85;
}

/* Full-screen pending overlay used for high-blast-radius transitions
   (creating room, joining room, starting solo/tutorial, etc.). */
.pending-overlay {
  position: fixed;
  inset: 0;
  background: rgba(8, 6, 18, 0.78);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 10002;
  color: #eedbf1;
  font-size: 3.2vmin;
  letter-spacing: 0.04em;
  animation: notification-fade-in 0.25s ease-out;
  gap: 2vmin;
  pointer-events: all;
}

.pending-overlay-spinner {
  width: 7vmin;
  height: 7vmin;
  border-radius: 50%;
  border: 0.6vmin solid rgba(238, 219, 241, 0.18);
  border-top-color: rgba(238, 219, 241, 0.95);
  animation: mf-pending-spin 1s linear infinite;
}

.pending-overlay-text {
  text-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  max-width: 60vmin;
  text-align: center;
}

.pending-overlay.fade-out {
  animation: notification-fade-out 0.3s ease-in forwards;
}

/* Honor reduced-motion preferences. */
@media (prefers-reduced-motion: reduce) {
  .btn-pending::after,
  .pending-overlay-spinner {
    animation-duration: 2.5s;
  }
}