body{
font-family:Arial, sans-serif;
background:#0f172a;
display:flex;
justify-content:center;
align-items:center;
height:100vh;
margin:0;
}

.chat-container{
width:420px;
background:#1e293b;
border-radius:12px;
box-shadow:0 0 20px rgba(0,0,0,0.5);
display:flex;
flex-direction:column;
overflow:hidden;
}

header{
background:#2563eb;
color:white;
padding:14px;
text-align:center;
}

#chatbox{
flex:1;
padding:15px;
overflow-y:auto;
background:#111827;
}

.message{
padding:10px;
margin-bottom:10px;
border-radius:8px;
max-width:75%;
font-size:14px;
}

.user{
background:#2563eb;
color:white;
margin-left:auto;
}

.bot{
background:#374151;
color:white;
}

.input-area{
display:flex;
border-top:1px solid #333;
}

input{
flex:1;
padding:12px;
border:none;
outline:none;
}

button{
padding:12px 18px;
border:none;
background:#2563eb;
color:white;
cursor:pointer;
}

button:hover{
background:#3b82f6;
}