/* ========================================= /
/ FLOAT BUTTON /
/ ========================================= */
.ai-float-button{

    position:fixed;

    right:30px;

    bottom:30px;

    width:70px;

    height:70px;

    border-radius:50%;

    background:transparent;

    display:flex;

    align-items:center;

    justify-content:center;

    z-index:9999;

    text-decoration:none;

    box-shadow:

    0 0 25px rgba(0,180,255,.35);

}


.ai-float-button img{

width:34px;

height:34px;


}


/* ========================================= /
/ PULSE /
/ ========================================= */

.ai-pulse{

position:absolute;

width:100%;

height:100%;

border-radius:50%;

background:rgba(30,136,255,.4);

animation:pulse 2s infinite;

}

@keyframes pulse{

0%{

    transform:scale(1);

    opacity:1;
}

100%{

    transform:scale(1.6);

    opacity:0;
}

}
/* ========================================= /
/ PANEL /
/ ========================================= */

.assistant-panel{

position:fixed;

right:30px;

bottom:120px;

width:420px;

height:620px;

background:#101827;

border-radius:25px;

overflow:hidden;

z-index:9999;

display:none;

flex-direction:column;

box-shadow:
0 20px 60px rgba(0,0,0,.45);

}

.assistant-panel.active{

display:flex;

}

/* ========================================= /
/ HEADER /
/ ========================================= */

.assistant-header{

background:#13213d;

padding:18px;

display:flex;

justify-content:space-between;

align-items:center;

}

.assistant-title{

display:flex;

align-items:center;

gap:12px;

color:white;

}

.assistant-title img{

width:36px;

height:36px;

}

#closeAssistant{

background:none;

border:none;

color:white;

font-size:20px;

cursor:pointer;

}

/* ========================================= /
/ MENSAJES /
/ ========================================= */

.assistant-messages{

flex:1;

overflow-y:auto;

padding:20px;

}

.assistant-message{

padding:14px;

border-radius:16px;

margin-bottom:12px;

}

.assistant-message.bot{

background:#1c2537;

color:white;

}

.assistant-message.user{

background:#1e88ff;

color:white;

margin-left:50px;

}

/* ========================================= /
/ INPUT /
/ ========================================= */

.assistant-input-area{

padding:15px;

display:flex;

gap:10px;

border-top:1px solid rgba(255,255,255,.08);

}

#assistantInput{

flex:1;

border:none;

border-radius:12px;

padding:10px;

}

#assistantSend{

border:none;

background:#1e88ff;

color:white;

border-radius:12px;

padding:10px 16px;

}

.ai-float-button img{
    background:yellow !important;
}
.ai-float-button img{

    background:transparent !important;

    border:none !important;

    box-shadow:none !important;

}