Update app.py

app.py

@@ -117,9 +117,9 @@ custom_css = """
 #logo-img { 
     display: block;
     margin: 0 auto;
-    width: 160px; 
+    width: 150px; 
     height: auto;
-    padding-bottom: 10px; /* Space below logo */
+    padding-bottom: 20px; /* Space below logo */
 }
 #disclaimer-footer { 
     width: 100%; 
@@ -132,13 +132,13 @@ custom_css = """
     margin-top: 20px;
 }
 .container { 
-    max-width: 1200px; 
+    max-width: 800px; 
     margin: 0 auto; 
-    padding: 10px;
+    padding: 20px;
 }
 .title { 
     color: #003366; 
-    margin-bottom: 5px;
+    margin-bottom: 10px;
     text-align: center; /* Center the title */
 }
 .chatbot { 
@@ -164,16 +164,18 @@ custom_css = """
     box-shadow: none !important;
 }
 .chatbot .message-content {
-    padding: 5px 5px; 
-    margin-bottom: 8px; 
-    max-width: 70%; 
-    word-wrap: break-word;
+    padding: 2px 8px; /* Reduced padding to make text bubbles smaller */
+    margin-bottom: 5px; /* Space between messages */
+    max-width: 60%; /* Restrict width to make it more compact */
+    word-wrap: break-word; /* Ensure text wraps properly */
+    display: inline-block; /* Align content properly */
 }
 .chatbot .message-bubble {
-    background-color: #FFFFFF; 
-    border-radius: 8px; 
-    box-sizing: border-box; 
-    display: inline-block; 
+    background-color: #FFFFFF; /* Ensure background is white */
+    border-radius: 5px; /* Smaller rounded corners */
+    box-sizing: border-box; /* Ensure padding is included in width */
+    display: inline-block; /* Align the bubble content properly */
+    margin: 2px 0; /* Reduce margin to minimize bubble size */
 }
 """