/* ========================================= */
/* FLOAT BUTTON */
/* ========================================= */

.ai-float-button{

    position:fixed;

    right:30px;

    bottom:30px;

    width:70px;

    height:70px;

    border-radius:50%;

    background:#1e88ff;

    display:flex;

    align-items:center;

    justify-content:center;

    z-index:9999;

    text-decoration:none;

    box-shadow:
    0 10px 35px rgba(30,136,255,.4);

}

.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:
    linear-gradient(
    135deg,
    #13213d,
    #0f172a
    );

    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;
}

.assistant-title small{

    display:block;

    color:#9fb3d1;
}

#closeAssistant{

    background:none;

    border:none;

    color:white;

    font-size:20px;

    cursor:pointer;
}

/* ========================================= */
/* MESSAGES */
/* ========================================= */

.assistant-messages{

    flex:1;

    overflow-y:auto;

    padding:20px;
}

.assistant-message{

    padding:14px;

    border-radius:16px;

    margin-bottom:12px;

    line-height:1.5;
}

.assistant-message.bot{

    background:#1c2537;

    color:white;
}

.assistant-message.user{

    background:#1e88ff;

    color:white;

    margin-left:50px;
}

/* ========================================= */
/* QUICK ACTIONS */
/* ========================================= */

.assistant-quick-actions{

    padding:12px;

    display:flex;

    gap:8px;

    flex-wrap:wrap;
}

.quick-question{

    background:#182437;

    color:white;

    border:none;

    border-radius:20px;

    padding:8px 14px;

    font-size:12px;

    cursor:pointer;
}

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

.assistant-input-area{

    padding:15px;

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

    display:flex;

    gap:10px;
}

#assistantInput{

    flex:1;

    border:none;

    border-radius:12px;

    padding:10px;

    resize:none;
}

#assistantSend{

    border:none;

    background:#1e88ff;

    color:white;

    border-radius:12px;

    padding:10px 16px;
}