.chatbot-float-btn{

    position:fixed;
    left:30px;
    bottom:30px;
    width:135px;
    height:135px;
    border:none;
    cursor:pointer;
    border-radius:50%;
    overflow:visible;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    isolation:isolate;
    background:
        radial-gradient(circle at 30% 15%,
            rgba(255,255,255,.22),
            rgba(255,255,255,.05) 22%,
            rgba(25,25,25,.95) 65%,
            rgba(10,10,10,.98) 100%);
    backdrop-filter:blur(18px);
    box-shadow:
        inset 0 2px 2px rgba(255,255,255,.35),
        inset 0 -12px 25px rgba(0,0,0,.55),
        0 0 0 3px #FFD84E,
        0 0 18px rgba(255,214,82,.55),
        0 0 45px rgba(255,214,82,.28),
        0 18px 40px rgba(0,0,0,.45);
    animation:chatbotFloat 3s ease-in-out infinite;
    transition:.35s;

}
.chatbot-float-btn::before{

    content:"";
    position:absolute;
    top:8px;
    left:14px;
    right:14px;
    height:46px;
    border-radius:50%;
    background:

        linear-gradient(
            rgba(255,255,255,.35),
            rgba(255,255,255,0)
        );
    filter:blur(1px);

}
.chatbot-float-btn::after{

    content:"";
    position:absolute;
    inset:-10px;
    border-radius:50%;
    border:2px solid rgba(255,214,82,.45);
    animation:pulseBot 2.8s infinite;

}
.chatbot-float-btn__icon{

    width:690px;
    height:690px;
    margin-top:2px;
    background:
    url("../../images/icons/chatbot-ai-right.png")
    center/contain no-repeat;
    z-index:3;

}
.chatbot-float-btn__label{

    margin-top:8px;
    width:90px;
    color:white;
    text-align:center;
    font-size:.20rem;
    line-height:1.05;
    font-weight:200;
    text-transform:uppercase;
    text-shadow:
        0 2px 4px rgba(0,0,0,.6);
    z-index:3;

}
.chatbot-float-btn__bubble{

    position:absolute;
    right:-8px;
    top:16px;
    width:28px;
    height:28px;
    border-radius:50%;
    background:
        radial-gradient(circle at 35% 25%,
        #FFF2A6,
        #FFD84E 70%,
        #F0B800);
    box-shadow:

        0 0 18px rgba(255,214,82,.75),
        0 4px 10px rgba(0,0,0,.35);

}

.chatbot-float-btn__bubble::before{

    content:"...";
    position:absolute;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#4a3a00;
    font-size:20px;
    font-weight:900;

}
.chatbot-float-btn:hover{

    transform:

        translateY(-6px)
        scale(1.05);

    box-shadow:

        inset 0 2px 2px rgba(255,255,255,.45),
        inset 0 -12px 25px rgba(0,0,0,.55),
        0 0 0 3px #FFD84E,
        0 0 30px rgba(255,214,82,.85),
        0 0 60px rgba(255,214,82,.45),
        0 25px 50px rgba(0,0,0,.5);

}
@keyframes chatbotFloat{

    0%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
    100%{transform:translateY(0);}

}

@keyframes pulseBot{

    0%{
        transform:scale(1);
        opacity:.7;
    }

    100%{

        transform:scale(1.15);
        opacity:0;

    }

}