/**
 * Premium Badge Animations
 * Noble Atlas - Elegante Gold-Animationen
 * 
 * @package Noble_Frontend_Display
 * @since 2.21.1
 */

/* Premium Badge Shimmer Animation */
@keyframes premium-shimmer {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* Pulse Animation für Online-Punkt */
@keyframes pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.7;
        transform: scale(1.1);
    }
}

/* Premium Badge Hover Effect */
.noble-premium-badge-animated {
    position: relative;
    transition: all 0.3s ease;
}

.noble-premium-badge-animated:hover {
    transform: translateY(-2px) scale(1.05);
}

/* Glow Effect */
.noble-premium-badge-animated::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.2), rgba(219, 193, 109, 0.2));
    border-radius: 22px;
    z-index: -1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.noble-premium-badge-animated:hover::after {
    opacity: 1;
}

/* Mobile: Reduce animations for performance */
@media (max-width: 768px) {
    .noble-premium-badge-animated {
        animation-duration: 4s; /* Slower on mobile */
    }
    
    .noble-premium-badge-animated:hover {
        transform: none; /* No transform on mobile */
    }
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .noble-premium-badge-animated,
    .noble-premium-badge-animated::after {
        animation: none !important;
    }
    
    .noble-premium-badge-animated:hover {
        transform: none;
    }
}