/* ===========================================================
   WEATHER ANIMATIONS
   =========================================================== */

/* Солнце — вращение + пульсация */
.weather-icon.sun {
    animation: sun-rotate 20s linear infinite, sun-pulse 3s ease-in-out infinite;
}
@keyframes sun-rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes sun-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.08); }
}

/* Дождь — капли падают */
.weather-icon.rain {
    animation: rain-fall 1.5s ease-in-out infinite;
}
@keyframes rain-fall {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

/* Снег — снежинки кружатся */
.weather-icon.snow {
    animation: snow-spin 4s linear infinite, snow-float 3s ease-in-out infinite;
}
@keyframes snow-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes snow-float {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-6px) rotate(180deg); }
}

/* Облако — плавает влево-вправо */
.weather-icon.cloud {
    animation: cloud-drift 4s ease-in-out infinite;
}
@keyframes cloud-drift {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(6px); }
}

/* Туман — мерцание */
.weather-icon.fog {
    animation: fog-fade 3s ease-in-out infinite;
}
@keyframes fog-fade {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* Гроза — вспышки молнии */
.weather-icon.storm {
    animation: storm-flash 2s ease-in-out infinite;
}
@keyframes storm-flash {
    0%, 100% { 
        transform: scale(1);
        filter: brightness(1);
    }
    10% { 
        transform: scale(1.05);
        filter: brightness(1.8);
    }
    20% {
        transform: scale(1);
        filter: brightness(1);
    }
}

/* Огонь — пламя колышется */
.weather-icon.fire {
    animation: fire-flicker 1.2s ease-in-out infinite;
}
@keyframes fire-flicker {
    0%, 100% { 
        transform: scale(1) rotate(0deg);
        filter: brightness(1);
    }
    25% {
        transform: scale(1.05) rotate(-2deg);
        filter: brightness(1.2);
    }
    50% {
        transform: scale(1.02) rotate(1deg);
        filter: brightness(1.1);
    }
    75% {
        transform: scale(1.08) rotate(-1deg);
        filter: brightness(1.3);
    }
}

/* Мороз — дрожание */
.weather-icon.frost {
    animation: frost-shiver 0.8s ease-in-out infinite;
}
@keyframes frost-shiver {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-2px); }
    75% { transform: translateX(2px); }
}