/* Erweiterte saisonale Effekte und Animationen */

/* Loading Screen saisonale Anpassungen */
body.theme-spring .loading-screen {
  background: linear-gradient(220deg, #1B4332 0%, #2D5A41 50%, #40916C 100%);
}

body.theme-summer .loading-screen {
  background: linear-gradient(220deg, #E65100 0%, #FF6F00 50%, #FF9800 100%);
}

body.theme-autumn .loading-screen {
  background: linear-gradient(220deg, #3E2723 0%, #5D4037 50%, #8D6E63 100%);
}

body.theme-winter .loading-screen {
  background: linear-gradient(220deg, #0D47A1 0%, #1565C0 50%, #1976D2 100%);
}

body.theme-halloween .loading-screen {
  background: linear-gradient(220deg, #1A0A00 0%, #2D1B00 50%, #4A2C00 100%);
}

body.theme-easter .loading-screen {
  background: linear-gradient(220deg, #4A148C 0%, #6A1B9A 50%, #8E24AA 100%);
}

/* Saisonale Partikel-Effekte für Loading Screen */
body.theme-spring .particle-1 { background: var(--star-color-1); }
body.theme-spring .particle-2 { background: var(--star-color-2); }
body.theme-spring .particle-3 { background: var(--star-color-3); }
body.theme-spring .particle-4 { background: var(--star-color-4); }

body.theme-summer .particle-1 { background: var(--star-color-1); animation-duration: 2s; }
body.theme-summer .particle-2 { background: var(--star-color-2); animation-duration: 1.5s; }
body.theme-summer .particle-3 { background: var(--star-color-3); animation-duration: 2.5s; }
body.theme-summer .particle-4 { background: var(--star-color-4); animation-duration: 1.8s; }

body.theme-autumn .particle-1 { background: var(--star-color-1); animation: autumnFloat 3s ease-in-out infinite; }
body.theme-autumn .particle-2 { background: var(--star-color-2); animation: autumnFloat 3.5s ease-in-out infinite; }
body.theme-autumn .particle-3 { background: var(--star-color-3); animation: autumnFloat 2.8s ease-in-out infinite; }
body.theme-autumn .particle-4 { background: var(--star-color-4); animation: autumnFloat 3.2s ease-in-out infinite; }

body.theme-winter .particle-1 { background: var(--star-color-1); animation: winterFloat 4s linear infinite; }
body.theme-winter .particle-2 { background: var(--star-color-2); animation: winterFloat 3.5s linear infinite; }
body.theme-winter .particle-3 { background: var(--star-color-3); animation: winterFloat 4.5s linear infinite; }
body.theme-winter .particle-4 { background: var(--star-color-4); animation: winterFloat 3.8s linear infinite; }

body.theme-halloween .particle-1 { background: var(--star-color-1); animation: halloweenBounce 1s ease-in-out infinite; }
body.theme-halloween .particle-2 { background: var(--star-color-2); animation: halloweenBounce 1.2s ease-in-out infinite; }
body.theme-halloween .particle-3 { background: var(--star-color-3); animation: halloweenBounce 0.8s ease-in-out infinite; }
body.theme-halloween .particle-4 { background: var(--star-color-4); animation: halloweenBounce 1.1s ease-in-out infinite; }

body.theme-easter .particle-1 { background: var(--star-color-1); animation: easterBounce 2s ease-in-out infinite; }
body.theme-easter .particle-2 { background: var(--star-color-2); animation: easterBounce 2.3s ease-in-out infinite; }
body.theme-easter .particle-3 { background: var(--star-color-3); animation: easterBounce 1.8s ease-in-out infinite; }
body.theme-easter .particle-4 { background: var(--star-color-4); animation: easterBounce 2.1s ease-in-out infinite; }

/* Zusätzliche Animationen */
@keyframes autumnFloat {
  0%, 100% { transform: translateY(0px) rotate(0deg); opacity: 0.7; }
  25% { transform: translateY(-15px) rotate(90deg); opacity: 1; }
  50% { transform: translateY(-30px) rotate(180deg); opacity: 0.8; }
  75% { transform: translateY(-15px) rotate(270deg); opacity: 1; }
}

@keyframes winterFloat {
  0% { transform: translateY(-20px) scale(0.8); opacity: 0; }
  50% { transform: translateY(0px) scale(1); opacity: 1; }
  100% { transform: translateY(20px) scale(0.8); opacity: 0; }
}

@keyframes halloweenBounce {
  0%, 100% { transform: scale(1) rotate(0deg); opacity: 0.8; }
  50% { transform: scale(1.3) rotate(180deg); opacity: 1; }
}

@keyframes easterBounce {
  0%, 100% { transform: translateY(0px) scale(1); }
  25% { transform: translateY(-10px) scale(1.1); }
  50% { transform: translateY(-20px) scale(1.2); }
  75% { transform: translateY(-10px) scale(1.1); }
}

/* Saisonale Player-Header Anpassungen */
body.theme-spring .player-header {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
}

body.theme-summer .player-header {
  background: linear-gradient(135deg, var(--primary), var(--accent));
}

body.theme-autumn .player-header {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
}

body.theme-winter .player-header {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
}

body.theme-halloween .player-header {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  animation: halloweenHeaderGlow 3s ease-in-out infinite;
}

body.theme-easter .player-header {
  background: linear-gradient(135deg, var(--primary), var(--accent));
  animation: easterHeaderShine 4s ease-in-out infinite;
}

@keyframes halloweenHeaderGlow {
  0%, 100% { filter: brightness(1) hue-rotate(0deg); }
  50% { filter: brightness(1.2) hue-rotate(30deg); }
}

@keyframes easterHeaderShine {
  0%, 100% { filter: brightness(1) saturate(1); }
  50% { filter: brightness(1.1) saturate(1.3); }
}

/* Saisonale Toast/Notification Styles */
body.theme-spring .toast {
  background: linear-gradient(45deg, var(--primary), var(--secondary));
  border-left: 4px solid var(--accent);
}

body.theme-summer .toast {
  background: linear-gradient(45deg, var(--primary), var(--accent));
  border-left: 4px solid var(--secondary);
}

body.theme-autumn .toast {
  background: linear-gradient(45deg, var(--primary), var(--secondary));
  border-left: 4px solid var(--accent);
}

body.theme-winter .toast {
  background: linear-gradient(45deg, var(--primary), var(--secondary));
  border-left: 4px solid var(--accent);
}

body.theme-halloween .toast {
  background: linear-gradient(45deg, var(--primary), var(--secondary));
  border-left: 4px solid var(--accent);
  animation: halloweenToastFlicker 2s ease-in-out infinite;
}

body.theme-easter .toast {
  background: linear-gradient(45deg, var(--primary), var(--accent));
  border-left: 4px solid var(--secondary);
  animation: easterToastShimmer 3s ease-in-out infinite;
}

@keyframes halloweenToastFlicker {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.85; }
}

@keyframes easterToastShimmer {
  0%, 100% { box-shadow: 0 4px 15px rgba(233, 30, 99, 0.3); }
  50% { box-shadow: 0 6px 20px rgba(156, 39, 176, 0.5); }
}

/* Saisonale Kategorie-Tab Styles */
body.theme-spring .category-tab.active {
  background: var(--primary);
  color: white;
  box-shadow: 0 4px 15px rgba(76, 175, 80, 0.4);
}

body.theme-summer .category-tab.active {
  background: var(--primary);
  color: white;
  box-shadow: 0 4px 15px rgba(255, 152, 0, 0.4);
}

body.theme-autumn .category-tab.active {
  background: var(--primary);
  color: white;
  box-shadow: 0 4px 15px rgba(255, 111, 0, 0.4);
}

body.theme-winter .category-tab.active {
  background: var(--primary);
  color: white;
  box-shadow: 0 4px 15px rgba(33, 150, 243, 0.4);
}

body.theme-halloween .category-tab.active {
  background: var(--primary);
  color: white;
  box-shadow: 0 4px 15px rgba(255, 102, 0, 0.5);
  animation: halloweenTabPulse 2s ease-in-out infinite;
}

body.theme-easter .category-tab.active {
  background: var(--primary);
  color: white;
  box-shadow: 0 4px 15px rgba(233, 30, 99, 0.4);
  animation: easterTabGlow 3s ease-in-out infinite;
}

@keyframes halloweenTabPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

@keyframes easterTabGlow {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.15); }
}

/* Saisonale Favorites Heart Animation */
body.theme-spring .heart.filled {
  color: var(--primary);
  animation: springHeartBeat 1.5s ease-in-out infinite;
}

body.theme-summer .heart.filled {
  color: var(--primary);
  animation: summerHeartBlaze 1s ease-in-out infinite;
}

body.theme-autumn .heart.filled {
  color: var(--primary);
  animation: autumnHeartFloat 2s ease-in-out infinite;
}

body.theme-winter .heart.filled {
  color: var(--primary);
  animation: winterHeartGlow 2.5s ease-in-out infinite;
}

body.theme-halloween .heart.filled {
  color: var(--primary);
  animation: halloweenHeartSpook 1s ease-in-out infinite;
}

body.theme-easter .heart.filled {
  color: var(--primary);
  animation: easterHeartBounce 1.2s ease-in-out infinite;
}

@keyframes springHeartBeat {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

@keyframes summerHeartBlaze {
  0%, 100% { transform: scale(1) rotate(0deg); }
  50% { transform: scale(1.15) rotate(5deg); }
}

@keyframes autumnHeartFloat {
  0%, 100% { transform: translateY(0px) scale(1); }
  50% { transform: translateY(-3px) scale(1.05); }
}

@keyframes winterHeartGlow {
  0%, 100% { filter: brightness(1) drop-shadow(0 0 5px currentColor); }
  50% { filter: brightness(1.2) drop-shadow(0 0 10px currentColor); }
}

@keyframes halloweenHeartSpook {
  0%, 100% { transform: scale(1) rotate(0deg); opacity: 1; }
  25% { transform: scale(1.2) rotate(-5deg); opacity: 0.8; }
  50% { transform: scale(0.9) rotate(5deg); opacity: 1; }
  75% { transform: scale(1.1) rotate(-3deg); opacity: 0.9; }
}

@keyframes easterHeartBounce {
  0%, 100% { transform: translateY(0px) scale(1); }
  25% { transform: translateY(-2px) scale(1.05); }
  50% { transform: translateY(-4px) scale(1.1); }
  75% { transform: translateY(-2px) scale(1.05); }
}