/* 
   🏛️ ATLAS-CIV-CLICKER | CARDS FX MODULE
   
   MENSCH:
   Dieses Modul beherbergt alle kaiserlichen Spezialeffekte, Animationen 
   und visuellen Rückmeldungen (Glow, Shake, Flash). Es sorgt dafür, dass 
   sich das Imperium "lebendig" anfühlt.
   
   KI:
   @ui-fx @animations @glow-effects @v7.9.9
*/

/* --- 1. Aktive Status-Effekte (Glows) --- */

/* Rubin-Fieber Glow (Lila) */
.glass-premium-card.ruby-event-active {
    border: 1.5px solid #d946ef !important;
    animation: ruby-event-glow 2.5s infinite alternate ease-in-out;
}

@keyframes ruby-event-glow {
    from { box-shadow: 0 0 20px rgba(217, 70, 239, 0.2); }
    to { box-shadow: 0 0 45px rgba(217, 70, 239, 0.5); }
}

/* Rubin-Boost Glow */
.glass-premium-card.boost-active {
    border: 1.5px solid #d946ef !important;
    animation: boost-glow-pulse 2s infinite alternate ease-in-out !important;
}

@keyframes boost-glow-pulse {
    0% { 
        box-shadow: 0 0 20px rgba(217, 70, 239, 0.15), inset 0 0 0px rgba(217, 70, 239, 0); 
        transform: scale(1);
    }
    100% { 
        box-shadow: 0 0 40px rgba(217, 70, 239, 0.3), inset 0 0 20px rgba(217, 70, 239, 0.3); 
        background: rgba(217, 70, 239, 0.1) !important;
        transform: scale(0.995);
    }
}

/* Dualer Glow (Event + Boost) */
.glass-premium-card.global-event-active.boost-active {
    border: 2px solid #fff !important;
    animation: dual-glow-pulse 3s infinite alternate ease-in-out !important;
}

@keyframes dual-glow-pulse {
    0% { border-color: var(--color-gold); box-shadow: 0 0 30px rgba(245, 158, 11, 0.4); }
    50% { border-color: #fff; box-shadow: 0 0 50px rgba(255, 255, 255, 0.4), 0 0 80px rgba(217, 70, 239, 0.5); }
    100% { border-color: #d946ef; box-shadow: 0 0 70px rgba(217, 70, 239, 0.7); }
}

/* --- 2. Produktions- & Forschungs-FX --- */

/* ZWECK: Visuelle Rückmeldung bei aktiver Produktion. */
.active-building .building-banner img {
    animation: prodPulse 2s infinite ease-in-out;
}

@keyframes prodPulse {
    0% { transform: scale(1); filter: brightness(1); }
    50% { transform: scale(1.05); filter: brightness(1.2); }
    100% { transform: scale(1); filter: brightness(1); }
}

/* Elite-Forschungs Glow */
.hud-research-indicator.elite-active {
    animation: hudEliteGlow 2s infinite alternate ease-in-out;
}

@keyframes hudEliteGlow {
    from { color: var(--color-gold); filter: drop-shadow(0 0 2px var(--color-gold)); }
    to { color: #fff; filter: drop-shadow(0 0 8px var(--color-gold)); }
}

/* --- 3. Interaktions-FX (Flash & Shake) --- */

/* Premium Crit Flash (Weiß-Gold) */
.premium-crit-flash {
    animation: premiumFlash 0.4s ease-out !important;
}

@keyframes premiumFlash {
    0% { filter: brightness(1) contrast(1); }
    50% { filter: brightness(1.5) contrast(1.2); box-shadow: 0 0 50px rgba(255, 255, 255, 0.5), 0 0 100px var(--color-gold); }
    100% { filter: brightness(1) contrast(1); }
}

/* Karten-Schütteln (Fehler/Impact) */
.card-shake {
    animation: cardShakeAnim 0.3s cubic-bezier(.36,.07,.19,.97) both !important;
}

/* 🏛️ ELITE COMBINATION: Flash & Shake gleichzeitig */
.fx-crit-shake-flash {
    animation: premiumFlash 0.4s ease-out, critShakeElite 0.3s cubic-bezier(.36,.07,.19,.97) both !important;
    backface-visibility: hidden;
    will-change: transform, filter;
    transition: none !important;
}

@keyframes critShakeElite {
    10%, 90% { transform: translate3d(-3px, 0, 0) rotate(-0.5deg); }
    20%, 80% { transform: translate3d(5px, 0, 0) rotate(1deg); }
    30%, 50%, 70% { transform: translate3d(-8px, 0, 0) rotate(-1.5deg); }
    40%, 60% { transform: translate3d(8px, 0, 0) rotate(1.5deg); }
}

/* --- 4. Spezial-Badges FX --- */

.status-event-badge {
    animation: badge-pulse 2s infinite alternate ease-in-out;
}

@keyframes badge-pulse {
    from { opacity: 0.9; transform: scale(1); }
    to { opacity: 1; transform: scale(1.05); box-shadow: 0 4px 20px rgba(245, 158, 11, 0.6); }
}