/* Arquivo de animações para o Tomo-AI */

/* Animação de flutuação para o mascote */
@keyframes float {
    0% {
        transform: translateY(0) rotate(0deg);
    }
    25% {
        transform: translateY(-8px) rotate(2deg);
    }
    50% {
        transform: translateY(-12px) rotate(0deg);
    }
    75% {
        transform: translateY(-8px) rotate(-2deg);
    }
    100% {
        transform: translateY(0) rotate(0deg);
    }
}

/* Animação de pulsação da sombra */
@keyframes shadow-pulse {
    0%, 100% {
        opacity: 0.6;
        transform: scale(1);
    }
    50% {
        opacity: 0.3;
        transform: scale(0.85);
    }
}

/* Animação para as bolhas */
@keyframes bubble-float {
    0% {
        transform: translate(0, 0);
        opacity: 0;
    }
    10% {
        opacity: var(--bubble-opacity, 0.7);
    }
    100% {
        transform: translate(var(--move-x, 100px), var(--move-y, -150px));
        opacity: 0;
    }
}

/* Animação para mensagens surgindo */
@keyframes pop-in {
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Animação para o modal de configurações */
@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes pop-up {
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Animação para o indicador de digitação */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Animação de bounce para botões */
@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Animação de brilho para elementos decorativos */
@keyframes glowing {
    0%, 100% {
        filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0));
    }
    50% {
        filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.7));
    }
}

/* Animação para elementos decorativos que flutuam */
@keyframes float-gentle {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

/* Animação para decorações especiais */
@keyframes sparkle {
    0%, 100% {
        opacity: 0.2;
        filter: blur(2px);
    }
    50% {
        opacity: 0.8;
        filter: blur(0px);
    }
}

/* Aplica animações aos elementos específicos */
.flower-top-center .svg-decoration,
.sprout-form-right .svg-decoration,
.flower-chat-right .svg-decoration,
.leaf-chat-left-bottom .svg-decoration {
    animation: glowing 5s ease-in-out infinite alternate;
}
