Update app.py

app.py

@@ -146,7 +146,7 @@ custom_css = """
 .chatbot { 
     border: none;  /* Remove the blue border */
     border-radius: 5px; 
-    padding: 10px; 
+    padding: 5px;  /* Reduce padding around the chat area */
     margin-bottom: 15px;
 }
 .button-row { 
@@ -165,14 +165,18 @@ custom_css = """
     border: none !important;
     box-shadow: none !important;
 }
-/* Adjust padding and margin to prevent overlap */
+/* Adjust padding, margin, and width for chat bubbles */
 .chatbot .message-content {
-    padding: 10px 15px; /* Add padding for better spacing */
-    margin-bottom: 5px; /* Space between messages */
+    padding: 5px 10px; /* Smaller padding for better sizing */
+    margin-bottom: 8px; /* Space between messages */
+    max-width: 70%; /* Restrict maximum width for better appearance */
+    word-wrap: break-word; /* Ensure text wraps properly */
 }
 .chatbot .message-bubble {
     background-color: #FFFFFF; /* Ensure background is white */
     border-radius: 8px; /* Rounded corners for messages */
+    box-sizing: border-box; /* Ensure padding is included in width */
+    display: inline-block; /* Align the bubble content properly */
 }
 """