Changed made in UI

app.py

@@ -48,17 +48,17 @@ def clear_session(session_id):
 
 with gr.Blocks(css="""
 body {
-  background-color: #121212;
-  color: #E0E0E0;
+  background-color: #1e1e1e;
+  color: #ddd;
   font-family: 'Segoe UI', sans-serif;
 }
 .header {
   text-align: center;
   font-size: 1.8rem;
   padding: 1rem;
-  background-color: #1F1F1F;
+  background-color: #2c2c2c;
   color: #ffffff;
-  border-bottom: 1px solid #333;
+  border-bottom: 1px solid #444;
 }
 .chatbot {
   flex: 1;
@@ -67,28 +67,21 @@ body {
   height: 65vh;
   overflow-y: auto;
   padding: 1rem;
-  background-color: #1E1E1E;
-  border-radius: 12px;
-  margin-bottom: 1rem;
 }
 .chatbot .message {
-  width: fit-content;
-  max-width: 75%;
-  padding: 12px 18px;
-  margin: 8px 0;
-  border-radius: 16px;
-  line-height: 1.5;
-  word-break: break-word;
+  margin: 6px 0;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  line-height: 1.6;
+  font-size: 1rem;
 }
 .chatbot .message.user {
-  background-color: #2979FF;
-  color: white;
   align-self: flex-end;
+  color: #90caf9;
 }
 .chatbot .message.bot {
-  background-color: #2C2C2C;
-  color: #E0E0E0;
   align-self: flex-start;
+  color: #e0e0e0;
 }
 .input-section {
   display: flex;
@@ -96,15 +89,12 @@ body {
   align-items: center;
   margin-top: auto;
 }
-input, button {
-  font-size: 1rem;
-}
 .send-button {
   background-color: #2979FF;
   color: white;
-  border: none;
   padding: 10px 16px;
-  border-radius: 12px;
+  border-radius: 8px;
+  border: none;
   cursor: pointer;
 }
 .send-button:hover {
@@ -118,7 +108,7 @@ input, button {
 }
 """) as demo:
 
-    gr.Markdown("## 🤖 Smart Assistant Chat", elem_classes="header")
+    gr.Markdown("## 🤖 Smart Assistant", elem_classes="header")
 
     state = gr.State([])