#fab-ai{
    position:fixed;
    right:20px;
    bottom:20px;
    width:60px;
    height:60px;
    border-radius:50%;
    background:#16a34a;
    color:#fff;
    cursor:pointer;
    z-index:99999;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:26px;

    box-shadow:0 10px 30px rgba(0,0,0,.2);
}

#chatbox{
    position:fixed;
    right:20px;
    bottom:90px;

    width:380px;
    height:550px;

    background:#fff;
    border-radius:15px;

    display:none;

    overflow:hidden;

    z-index:99999;

    box-shadow:0 10px 40px rgba(0,0,0,.2);
    font-family:Arial, sans-serif;
}

.chat-header{
    background:#16a34a;
    color:#fff;
    padding:15px;
    font-weight:bold;
}

#chat-messages{
    height:430px;
    overflow:auto;
    padding:15px;
    background:#f8fafc;
}

.chat-message{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin-bottom:12px;
}

.chat-message--user{
    align-items:flex-end;
}

.chat-message--ai,
.chat-message--error{
    align-items:flex-start;
}

.chat-message__label{
    color:#64748b;
    font-size:11px;
    font-weight:700;
}

.chat-message__bubble{
    max-width:86%;
    padding:10px 12px;
    border-radius:8px;
    font-size:14px;
    line-height:1.45;
}

.chat-message--user .chat-message__bubble{
    background:#16a34a;
    color:#fff;
    border-bottom-right-radius:2px;
}

.chat-message--ai .chat-message__bubble{
    background:#fff;
    color:#0f172a;
    border:1px solid #e2e8f0;
    border-bottom-left-radius:2px;
}

.chat-message--error .chat-message__bubble{
    background:#fef2f2;
    color:#991b1b;
    border:1px solid #fecaca;
}

.chat-message__bubble p{
    margin:0 0 8px;
}

.chat-message__bubble p:last-child{
    margin-bottom:0;
}

.chat-message__bubble ul,
.chat-message__bubble ol{
    margin:6px 0 0;
    padding-left:20px;
}

.chat-message__bubble li{
    margin-bottom:5px;
}

.chat-typing{
    align-items:center;
    display:flex;
    gap:7px;
}

.chat-typing__dots{
    display:inline-flex;
    gap:3px;
}

.chat-typing__dots span{
    animation:chatTypingPulse 1s infinite ease-in-out;
    background:#64748b;
    border-radius:50%;
    display:block;
    height:5px;
    width:5px;
}

.chat-typing__dots span:nth-child(2){
    animation-delay:.15s;
}

.chat-typing__dots span:nth-child(3){
    animation-delay:.3s;
}

@keyframes chatTypingPulse{
    0%,
    80%,
    100%{
        opacity:.35;
        transform:translateY(0);
    }

    40%{
        opacity:1;
        transform:translateY(-3px);
    }
}

.chat-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:10px;
}

.chat-cs-button{
    width:auto;
    border:0;
    border-radius:6px;
    background:#128c7e;
    color:#fff;
    cursor:pointer;
    font-size:13px;
    font-weight:700;
    padding:8px 12px;
}

.chat-cs-button:hover{
    background:#0f766e;
}

.chat-footer{
    display:flex;
    border-top:1px solid #ddd;
}

.chat-footer input{
    flex:1;
    border:none;
    padding:12px;
}

.chat-footer button{
    width:90px;
}