/* Bot Selector微动画效果 */

/* 呼吸灯发光效果 */
@keyframes glowPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(254, 181, 101, 0.4);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 10px 5px rgba(254, 181, 101, 0.6);
        transform: scale(1.05);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(254, 181, 101, 0.4);
        transform: scale(1);
    }
}

/* 上下轻微浮动动画 */
@keyframes floatUpDown {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

/* 横向轻微抖动动画 */
@keyframes gentleShake {
    0%, 100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(-3px);
    }
    75% {
        transform: translateX(3px);
    }
}

/* 应用在bot selector下拉按钮上的动画效果 */
.dropbtn.animate-attention {
    animation: glowPulse 1.5s infinite;
    position: relative;
    z-index: 5;
}

/* 移动端适配 */
@media screen and (max-width: 576px) {
    .dropbtn.animate-attention {
        animation-duration: 2s;
        /* 为移动端增加更明显的效果 */
        padding: 6px 9px !important; /* 略大于原本的padding */
    }
    
    /* 为移动端定制更明显的动画 */
    @keyframes glowPulse {
        0% {
            box-shadow: 0 0 0 0 rgba(254, 181, 101, 0.4);
            transform: scale(1);
        }
        50% {
            box-shadow: 0 0 12px 8px rgba(254, 181, 101, 0.6); /* 更大更明显的阴影 */
            transform: scale(1.08); /* 略大的缩放 */
        }
        100% {
            box-shadow: 0 0 0 0 rgba(254, 181, 101, 0.4);
            transform: scale(1);
        }
    }
}

/* 移除提示箭头动画 */
.dropbtn.animate-attention::after {
    content: none;
}

/* 动画结束后的淡出效果 */
@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.animation-ending {
    animation: fadeOut 1s forwards;
}