/* ============================================================
   MEGA Radio — Animation Keyframes & Effects
   ============================================================ */

/* === Card Float / Bob Animation === */
@keyframes cardFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}

/* === Glow Pulse (synced by JS to audio amplitude) === */
@keyframes glowPulse {
  0%, 100% {
    box-shadow:
      0 0 20px 4px var(--md-glow-color-subtle),
      0 0 60px 10px var(--md-glow-color-subtle),
      0 8px 32px rgba(0,0,0,0.4);
  }
  50% {
    box-shadow:
      0 0 30px 8px var(--md-glow-color),
      0 0 80px 20px var(--md-glow-color-subtle),
      0 8px 32px rgba(0,0,0,0.4);
  }
}

/* === Intense Glow (when audio is loud) === */
@keyframes glowIntense {
  0%, 100% {
    box-shadow:
      0 0 30px 8px var(--md-glow-color),
      0 0 80px 20px var(--md-glow-color),
      0 0 120px 30px var(--md-glow-color-subtle),
      0 12px 40px rgba(0,0,0,0.5);
  }
  50% {
    box-shadow:
      0 0 40px 12px var(--md-glow-color-strong),
      0 0 100px 30px var(--md-glow-color),
      0 0 150px 40px var(--md-glow-color-subtle),
      0 12px 40px rgba(0,0,0,0.5);
  }
}

/* === Ripple Effect for Buttons === */
@keyframes ripple {
  0%   { transform: scale(0); opacity: 0.4; }
  100% { transform: scale(4); opacity: 0; }
}

/* === Fade In === */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* === Fade In Scale === */
@keyframes fadeInScale {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}

/* === Slide Up (bottom sheets) === */
@keyframes slideUp {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}

/* === Slide Down === */
@keyframes slideDown {
  from { transform: translateY(0); }
  to   { transform: translateY(100%); }
}

/* === Spin (loading) === */
@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* === Scanning sweep === */
@keyframes scanSweep {
  0%   { left: 0%; }
  100% { left: 100%; }
}

/* === Equalizer Bar Bounce === */
@keyframes eqBounce1 {
  0%, 100% { height: 6px; }
  50%      { height: 20px; }
}
@keyframes eqBounce2 {
  0%, 100% { height: 14px; }
  50%      { height: 6px; }
}
@keyframes eqBounce3 {
  0%, 100% { height: 10px; }
  50%      { height: 24px; }
}

/* === Chip Press === */
@keyframes chipPress {
  0%   { transform: scale(1); }
  50%  { transform: scale(0.95); }
  100% { transform: scale(1); }
}

/* === Album Art Crossfade === */
@keyframes artFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* === Tuner Needle Shake === */
@keyframes needleShake {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(-2px); }
  75%      { transform: translateX(2px); }
}

/* === Song Info Slide In === */
@keyframes infoSlideIn {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* === Shimmer Loading Placeholder === */
@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.shimmer-loading {
  background: linear-gradient(
    90deg,
    var(--md-sys-color-surface-container) 25%,
    var(--md-sys-color-surface-container-high) 50%,
    var(--md-sys-color-surface-container) 75%
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s ease-in-out infinite;
}

/* === Volume Knob Rotate (decorative) === */
@keyframes volumeRotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(270deg); }
}

/* === Notification Toast === */
@keyframes toastIn {
  from { opacity: 0; transform: translateY(20px) scale(0.95); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes toastOut {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to   { opacity: 0; transform: translateY(20px) scale(0.95); }
}

/* === Liquid Glass Reflective Sheen Sweep === */
@keyframes liquidGlossSweep {
  0% { transform: translateX(-150%) rotate(25deg); }
  100% { transform: translateX(250%) rotate(25deg); }
}

/* === Fluid Liquid Glass Orb Float === */
@keyframes liquidOrbFloat {
  0%, 100% {
    transform: translateY(0) rotate(0deg) scale(1);
    box-shadow:
      0 12px 40px -8px hsla(var(--md-source), 80%, 45%, 0.35),
      inset 0 2px 3px 0 hsla(0, 0%, 100%, 0.85);
  }
  50% {
    transform: translateY(-8px) rotate(0.5deg) scale(1.02);
    box-shadow:
      0 20px 50px -10px hsla(var(--md-source), 85%, 50%, 0.5),
      inset 0 3px 5px 0 hsla(0, 0%, 100%, 0.95);
  }
}
