Update app.py

journal. chat.

app.py

@@ -1004,10 +1004,66 @@ def export_data() -> str:
 
 # Define custom CSS
 custom_css = """
-.response-area {background-color: #f9f9f9; border-radius: 5px; padding: 10px;}
-.input-area {border: 1px solid #ccc; border-radius: 5px;}
-.history-display {font-family: monospace; background-color: #f0f0f0;}
-.analytics-display {font-family: monospace; background-color: #e8f4f8;}
+/* Full-screen layout: remove padding and margins, use full width */
+.gradio-container {
+    width: 100vw !important;
+    max-width: 100% !important;
+    padding: 0 !important;
+    margin: 0 !important;
+    background-color: #000000 !important; /* Black background */
+    color: #ffffff !important; /* White text for contrast */
+}
+
+/* Remove padding and ensure full-width components */
+.response-area, .input-area, .history-display, .analytics-display {
+    padding: 0 !important;
+    margin: 0 !important;
+    width: 100% !important;
+    box-sizing: border-box !important;
+    border: 1px solid #333333 !important; /* Subtle border for visibility */
+}
+
+/* Textbox and input styling */
+.response-area, .history-display, .analytics-display {
+    background-color: #1a1a1a !important; /* Dark gray for textboxes to improve readability */
+    color: #ffffff !important;
+    border-radius: 0 !important; /* Remove rounded corners for full-screen look */
+}
+
+/* Input area */
+.input-area {
+    background-color: #1a1a1a !important;
+    color: #ffffff !important;
+    border: 1px solid #333333 !important;
+}
+
+/* Font styling */
+* {
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+    font-size: 16px !important; /* Slightly larger for readability */
+}
+
+/* Button styling for contrast */
+button {
+    background-color: #333333 !important;
+    color: #ffffff !important;
+    border: 1px solid #555555 !important;
+}
+button:hover {
+    background-color: #555555 !important;
+}
+
+/* Dropdown styling */
+select {
+    background-color: #1a1a1a !important;
+    color: #ffffff !important;
+    border: 1px solid #333333 !important;
+}
+
+/* Markdown text */
+.markdown {
+    color: #ffffff !important;
+}
 """
 
 # Initialize storage and components