/* style.css */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', sans-serif; background: #f8f9fa; height: 100vh; }
.login-form { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100vh; background: #fff; }
.login-form input { padding: 10px; width: 300px; margin: 10px; }
.container { display: flex; height: 100vh; }
.sidebar { background: #343a40; color: white; padding: 20px; width: 280px; display: flex; flex-direction: column; }
.sidebar h3, .sidebar h4 { margin: 10px 0; }
.sidebar a.logout { color: #ffc107; text-decoration: none; margin: 10px 0; }
.sidebar textarea, .sidebar input[type='file'] { width: 100%; margin: 10px 0; padding: 10px; border-radius: 5px; border: none; }
.sidebar button { background: #ffc107; border: none; padding: 10px; cursor: pointer; width: 100%; margin-bottom: 20px; }
.chat-area { flex: 1; display: flex; flex-direction: column; padding: 20px; }
.chat-box { flex: 1; overflow-y: auto; background: white; padding: 10px; border: 1px solid #ccc; margin-bottom: 10px; border-radius: 5px; }
.chat-input { display: flex; gap: 10px; }
.chat-input input { flex: 1; padding: 10px; border-radius: 5px; border: 1px solid #ccc; }
.chat-input button { padding: 10px; border-radius: 5px; background: #28a745; color: white; border: none; cursor: pointer; }