/* ============================================================
   Maxify Calculator — Animations
   Spinners, transitions, loading states
   ============================================================ */

/* ---- Processing Ring Spinner ---- */
.mx-calculator .mx-processing-ring {
  width: 40px;
  height: 40px;
  border: 3px solid rgba(255, 255, 255, 0.1);
  border-top-color: var(--mx-accent, #0A7558);
  border-radius: 50%;
  animation: mxSpin 0.8s linear infinite;
  flex-shrink: 0;
}

@keyframes mxSpin {
  to { transform: rotate(360deg); }
}

/* ---- General Spinner ---- */
.mx-calculator .mx-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(255, 255, 255, 0.1);
  border-top-color: var(--mx-accent, #0A7558);
  border-radius: 50%;
  animation: mxSpin 0.8s linear infinite;
  margin: 0 auto 1rem;
}

/* ---- Fade In ---- */
.mx-calculator .mx-fade-in {
  animation: mxFadeIn 0.35s ease forwards;
}

@keyframes mxFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---- Slide In from Bottom ---- */
.mx-calculator .mx-slide-up {
  animation: mxSlideUp 0.4s ease forwards;
}

@keyframes mxSlideUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---- Pulse ---- */
.mx-calculator .mx-pulse {
  animation: mxPulse 2s ease-in-out infinite;
}

@keyframes mxPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* ---- Loading Step Pulse ---- */
.mx-calculator .mx-loading-step.mx-ls-active .mx-ls-dot {
  animation: mxPulse 1s ease-in-out infinite;
}

/* ---- Map Fade In ---- */
.mx-calculator .mx-preview-map-wrap {
  animation: mxFadeIn 0.5s ease forwards;
}

/* ---- Upload Success Check Pop ---- */
@keyframes mxCheckPop {
  0% { transform: scale(0); opacity: 0; }
  60% { transform: scale(1.2); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

/* ---- Gold Pulse Glow for Analyze Button ---- */
@keyframes mxGoldPulse {
  0%, 100% { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); }
  50% { box-shadow: 0 4px 24px rgba(212, 168, 67, 0.4), 0 0 12px rgba(212, 168, 67, 0.2); }
}

.mx-calculator .mx-btn-primary.mx-gold-pulse {
  animation: mxGoldPulse 1.5s ease-in-out infinite;
}

/* ---- Result Card Stagger ---- */
.mx-calculator .mx-result-card:nth-child(1) { animation: mxFadeIn 0.35s ease 0.0s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(2) { animation: mxFadeIn 0.35s ease 0.1s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(3) { animation: mxFadeIn 0.35s ease 0.2s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(4) { animation: mxFadeIn 0.35s ease 0.3s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(5) { animation: mxFadeIn 0.35s ease 0.4s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(6) { animation: mxFadeIn 0.35s ease 0.5s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(7) { animation: mxFadeIn 0.35s ease 0.6s forwards; opacity: 0; }
.mx-calculator .mx-result-card:nth-child(8) { animation: mxFadeIn 0.35s ease 0.7s forwards; opacity: 0; }
