/* CHAT ICON */

#chatbot-icon{
position:fixed;
bottom:25px;
right:25px;
width:60px;
height:60px;
background:linear-gradient(135deg,#ff6a3d,#ff8f6b);
color:white;
font-size:26px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
cursor:pointer;
z-index:9999;
box-shadow:0 10px 35px rgba(0,0,0,0.35);
}


/* CHAT WINDOW */

#chatbot-box{

position:fixed;
bottom:100px;
right:25px;

width:360px;
height:480px;

border-radius:18px;

background:rgba(255,255,255,0.08);
backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,0.15);

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

display:flex;
flex-direction:column;

overflow:hidden;

z-index:9999;

}


/* HEADER */

.chat-header{

padding:16px;
font-size:16px;
font-weight:600;
color:white;

background:linear-gradient(135deg,#ff6a3d,#ff8f6b);

}


/* CHAT BODY */

.chat-body{

flex:1;

padding:15px;

overflow-y:auto;

display:flex;

flex-direction:column;

gap:10px;

color:white;

}


/* BOT MESSAGE */

.chat-body .bot{

background:rgba(255,255,255,0.15);

padding:12px;

border-radius:10px;

max-width:80%;

}


/* USER MESSAGE */

.chat-body .user{

background:linear-gradient(135deg,#ff6a3d,#ff8f6b);

padding:12px;

border-radius:10px;

margin-left:auto;

color:white;

max-width:80%;

}


/* INPUT AREA */

.chat-input{

display:flex;

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

background:rgba(0,0,0,0.25);

}


/* INPUT */

.chat-input input{

flex:1;

border:none;

padding:14px;

background:transparent;

color:white;

outline:none;

}


/* PLACEHOLDER */

.chat-input input::placeholder{

color:rgba(255,255,255,0.6);

}


/* BUTTON */

.chat-input button{

background:linear-gradient(135deg,#ff6a3d,#ff8f6b);

border:none;

color:white;

padding:12px 18px;

cursor:pointer;

}