// vue/app/shared/SuccessModal/index.styl
// Стили исключительно для модального окна успеха

.success-content
    .success-icon
        animation: successIconAppear 0.6s ease-out forwards
        
        svg
            transition: all 0.3s ease
            
            &:hover
                transform: scale(1.05)
                filter: drop-shadow(0 4px 8px rgba(34, 197, 94, 0.3))

// Анимация появления иконки
@keyframes successIconAppear
    0%
        opacity: 0
        transform: scale(0.5) rotate(-180deg)
    60%
        opacity: 1
        transform: scale(1.1) rotate(10deg)
    100%
        opacity: 1
        transform: scale(1) rotate(0deg)

// Адаптивность для мобильных устройств
@media (max-width: 640px)
    .success-content
        .success-icon
            svg
                width: 4rem
                height: 4rem