/* =====================================================
   Aura Glow Effects
   Hot Match: purple pulse + shimmer sweep
   Leaderboard podium: rank-colored pulse + rotating aura
   ===================================================== */

/* Wrap all motion in prefers-reduced-motion so users who
   opt out of animations still get the static glow ring */
@media (prefers-reduced-motion: no-preference) {

  /* ---- Hot Match pulse ---- */
  @keyframes hot-pulse {
    0%, 100% {
      box-shadow:
        0 0 0 1px rgba(168, 85, 247, 0.45),
        0 0 10px 2px rgba(168, 85, 247, 0.25);
    }
    50% {
      box-shadow:
        0 0 0 1px rgba(168, 85, 247, 0.85),
        0 0 22px 8px rgba(168, 85, 247, 0.50),
        0 0 40px 14px rgba(168, 85, 247, 0.20);
    }
  }

  /* ---- Hot Match shimmer (translates a skewed highlight across the card) ---- */
  @keyframes hot-shimmer {
    0%   { transform: translateX(-160%) skewX(-15deg); }
    100% { transform: translateX(420%)  skewX(-15deg); }
  }

  .match-card-hot {
    animation: hot-pulse 2s ease-in-out infinite;
  }

  /* Shimmer overlay — requires overflow:hidden on the card */
  .match-card-hot::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 35%;
    background: linear-gradient(
      105deg,
      transparent 0%,
      rgba(168, 85, 247, 0.07) 38%,
      rgba(220, 180, 255, 0.17) 50%,
      rgba(168, 85, 247, 0.07) 62%,
      transparent 100%
    );
    animation: hot-shimmer 4s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
  }

  /* ---- Podium rank 1 — Gold (3s, offset simulates rotating bright spot) ---- */
  @keyframes podium-aura-1 {
    0%, 100% {
      box-shadow:
        0 0 0 2px rgba(251, 191, 36, 0.55),
        0 0 16px 4px rgba(251, 191, 36, 0.30),
        -8px -4px 18px rgba(251, 191, 36, 0.45);
    }
    25% {
      box-shadow:
        0 0 0 2px rgba(251, 191, 36, 0.65),
        0 0 18px 5px rgba(251, 191, 36, 0.35),
         8px -8px 18px rgba(251, 191, 36, 0.55);
    }
    50% {
      box-shadow:
        0 0 0 2px rgba(251, 191, 36, 0.85),
        0 0 28px 10px rgba(251, 191, 36, 0.55),
         8px  8px 18px rgba(251, 191, 36, 0.45);
    }
    75% {
      box-shadow:
        0 0 0 2px rgba(251, 191, 36, 0.65),
        0 0 18px 5px rgba(251, 191, 36, 0.35),
        -8px  8px 18px rgba(251, 191, 36, 0.55);
    }
  }

  /* ---- Podium rank 2 — Silver (3.5s) ---- */
  @keyframes podium-aura-2 {
    0%, 100% {
      box-shadow:
        0 0 0 2px rgba(203, 213, 225, 0.45),
        0 0 13px 3px rgba(203, 213, 225, 0.25),
        -6px -3px 14px rgba(203, 213, 225, 0.38);
    }
    25% {
      box-shadow:
        0 0 0 2px rgba(203, 213, 225, 0.55),
        0 0 15px 4px rgba(203, 213, 225, 0.30),
         6px -6px 14px rgba(203, 213, 225, 0.45);
    }
    50% {
      box-shadow:
        0 0 0 2px rgba(203, 213, 225, 0.75),
        0 0 24px 8px rgba(203, 213, 225, 0.45),
         6px  6px 14px rgba(203, 213, 225, 0.38);
    }
    75% {
      box-shadow:
        0 0 0 2px rgba(203, 213, 225, 0.55),
        0 0 15px 4px rgba(203, 213, 225, 0.30),
        -6px  6px 14px rgba(203, 213, 225, 0.45);
    }
  }

  /* ---- Podium rank 3 — Bronze (3.2s) ---- */
  @keyframes podium-aura-3 {
    0%, 100% {
      box-shadow:
        0 0 0 2px rgba(217, 119, 6, 0.45),
        0 0 12px 3px rgba(217, 119, 6, 0.28),
        -6px -3px 13px rgba(217, 119, 6, 0.38);
    }
    25% {
      box-shadow:
        0 0 0 2px rgba(217, 119, 6, 0.55),
        0 0 14px 4px rgba(217, 119, 6, 0.32),
         6px -6px 13px rgba(217, 119, 6, 0.45);
    }
    50% {
      box-shadow:
        0 0 0 2px rgba(217, 119, 6, 0.75),
        0 0 22px 7px rgba(217, 119, 6, 0.48),
         6px  6px 13px rgba(217, 119, 6, 0.38);
    }
    75% {
      box-shadow:
        0 0 0 2px rgba(217, 119, 6, 0.55),
        0 0 14px 4px rgba(217, 119, 6, 0.32),
        -6px  6px 13px rgba(217, 119, 6, 0.45);
    }
  }

  .podium-aura-1 { animation: podium-aura-1 3.0s ease-in-out infinite; }
  .podium-aura-2 { animation: podium-aura-2 3.5s ease-in-out infinite; }
  .podium-aura-3 { animation: podium-aura-3 3.2s ease-in-out infinite; }

} /* end prefers-reduced-motion */

/* Static fallback glow (shown to users who prefer reduced motion) */
.match-card-hot {
  box-shadow:
    0 0 0 1px rgba(168, 85, 247, 0.55),
    0 0 14px 3px rgba(168, 85, 247, 0.30);
}
/* Hide shimmer pseudo-element for reduced-motion users — without animation it
   sits at translateX(0) and renders a visible purple strip on the card edge */
.match-card-hot::before {
  display: none;
}
.podium-aura-1 {
  box-shadow: 0 0 0 2px rgba(251, 191, 36, 0.60), 0 0 14px 4px rgba(251, 191, 36, 0.30);
}
.podium-aura-2 {
  box-shadow: 0 0 0 2px rgba(203, 213, 225, 0.50), 0 0 12px 3px rgba(203, 213, 225, 0.25);
}
.podium-aura-3 {
  box-shadow: 0 0 0 2px rgba(217, 119, 6, 0.50), 0 0 11px 3px rgba(217, 119, 6, 0.28);
}