sasdas

app.py

@@ -238,7 +238,7 @@ orchestrator = initialize_modules()
 
 # Custom CSS for enhanced UI with improved visibility and contrast
 custom_css = """
-/* Reset and base styles */
+/* Base Reset */
 * {
     margin: 0;
     padding: 0;
@@ -248,27 +248,27 @@ custom_css = """
 html, body {
     height: 100%;
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-    background-color: #1e1e2e !important;
-    color: #e0e0e0 !important;
+    background: #0f0f0f;
+    color: #e0e0e0;
     line-height: 1.6;
 }
 
-/* Main container */
+/* Container */
 .container {
     max-width: 1200px;
     margin: 0 auto;
     padding: 20px;
 }
 
-/* Header styles */
+/* Header */
 .header {
     text-align: center;
     margin-bottom: 30px;
     padding: 25px;
-    background: linear-gradient(135deg, #2563eb, #1d4ed8);
-    color: white;
+    background: linear-gradient(135deg, #1a1a1a, #262626);
     border-radius: 12px;
-    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.4);
+    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
+    color: #ffffff;
 }
 
 .title {
@@ -279,60 +279,49 @@ html, body {
 
 .subtitle {
     font-size: 1.2rem;
-    opacity: 0.95;
+    opacity: 0.85;
     margin-bottom: 15px;
 }
 
 .version-info {
     font-size: 1rem;
-    background: rgba(255, 255, 255, 0.15);
-    padding: 8px 15px;
+    background: rgba(255,255,255,0.05);
+    padding: 6px 12px;
     border-radius: 20px;
     display: inline-block;
     backdrop-filter: blur(5px);
 }
 
-/* Card styles */
+/* Card Style */
 .card {
-    background: #2d2d44 !important;
+    background: #1a1a1a;
     border-radius: 12px;
-    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);
+    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
     padding: 25px;
     margin-bottom: 25px;
+    border: 1px solid rgba(255,255,255,0.05);
     transition: all 0.3s ease;
-    border: 1px solid #3b82f6;
-    color: #e0e0e0 !important;
 }
 
 .card:hover {
     transform: translateY(-3px);
-    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
-}
-
-.input-section {
-    background: linear-gradient(to bottom right, #1e293b, #334155);
-    border: 1px solid #3b82f6;
+    box-shadow: 0 8px 25px rgba(0,0,0,0.4);
 }
 
-.output-section {
-    background: #1e293b !important;
-    border: 1px solid #3b82f6;
-}
-
-/* Section headings */
+/* Section Headers */
 .card h3 {
-    color: #60a5fa !important;
+    color: #00ffff;
     margin-bottom: 20px;
-    font-size: 1.4rem;
+    font-size: 1.3rem;
     font-weight: 600;
-    border-bottom: 2px solid #3b82f6;
+    border-bottom: 1px solid rgba(255,255,255,0.1);
     padding-bottom: 10px;
 }
 
-/* Button styles */
+/* Button */
 .btn-primary {
-    background: linear-gradient(135deg, #2563eb, #1d4ed8);
-    color: white !important;
+    background: linear-gradient(135deg, #00ffff, #0099cc);
+    color: #000000;
     border: none;
     padding: 14px 28px;
     font-size: 17px;
@@ -340,7 +329,7 @@ html, body {
     cursor: pointer;
     transition: all 0.3s ease;
     font-weight: 600;
-    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.4);
+    box-shadow: 0 4px 10px rgba(0,255,255,0.3);
     display: inline-block;
     width: 100%;
     text-align: center;
@@ -348,51 +337,46 @@ html, body {
 
 .btn-primary:hover {
     transform: translateY(-3px);
-    box-shadow: 0 6px 15px rgba(37, 99, 235, 0.6);
-    background: linear-gradient(135deg, #1d4ed8, #1e40af);
+    box-shadow: 0 6px 15px rgba(0,255,255,0.5);
+    background: linear-gradient(135deg, #00cccc, #0099cc);
 }
 
 .btn-primary:active {
     transform: translateY(1px);
-    box-shadow: 0 2px 5px rgba(37, 99, 235, 0.4);
+    box-shadow: 0 2px 8px rgba(0,255,255,0.3);
 }
 
-/* Input fields */
+/* Inputs */
 .gr-textbox, .gr-textbox input, .gr-textbox textarea {
-    color: #e0e0e0 !important;
-    background-color: #334155 !important;
-    border: 2px solid #3b82f6 !important;
+    color: #ffffff !important;
+    background-color: #262626 !important;
+    border: 2px solid #333333 !important;
     border-radius: 8px !important;
     padding: 12px 15px !important;
     font-size: 16px !important;
-    transition: border-color 0.3s ease;
     width: 100%;
 }
 
 .gr-textbox:focus, .gr-textbox input:focus, .gr-textbox textarea:focus {
-    border-color: #06b6d4 !important;
-    box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.3) !important;
+    border-color: #00ffff !important;
+    box-shadow: 0 0 0 3px rgba(0,255,255,0.3) !important;
 }
 
-/* File upload */
+/* File Upload */
 .gr-file {
-    border: 2px dashed #3b82f6 !important;
+    border: 2px dashed #333333 !important;
     border-radius: 8px !important;
     padding: 15px !important;
-    background-color: #334155 !important;
+    background-color: #262626 !important;
     color: #e0e0e0 !important;
 }
 
 .gr-file:hover {
-    border-color: #06b6d4 !important;
-    background-color: #1e293b !important;
+    border-color: #00ffff !important;
+    background-color: #1f1f1f !important;
 }
 
 /* Checkbox */
-.gr-checkbox {
-    margin: 15px 0;
-}
-
 .gr-checkbox label {
     font-size: 16px;
     color: #e0e0e0 !important;
@@ -400,39 +384,39 @@ html, body {
     align-items: center;
 }
 
-/* Streaming content area */
+/* Streaming Output */
 .streaming-content {
     white-space: pre-wrap;
     font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
-    background-color: #1e293b !important;
+    background-color: #1f1f1f !important;
     padding: 20px;
     border-radius: 10px;
     margin: 15px 0;
-    border-left: 5px solid #3b82f6;
-    box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.4);
+    border-left: 4px solid #00ffff;
+    box-shadow: inset 0 0 8px rgba(0,0,0,0.3);
     min-height: 150px;
     max-height: 700px;
     overflow-y: auto;
     color: #e0e0e0 !important;
     font-size: 16px;
     line-height: 1.7;
-    border: 1px solid #374151;
+    border: 1px solid #333333;
 }
 
 .streaming-content h2 {
-    color: #60a5fa !important;
-    border-bottom: 2px solid #3b82f6;
+    color: #00ffff !important;
+    border-bottom: 1px solid #333333;
     padding-bottom: 10px;
     margin-top: 0;
 }
 
 .streaming-content h3 {
-    color: #06b6d4 !important;
+    color: #00cccc !important;
     margin-top: 20px;
 }
 
 .streaming-content ul, .streaming-content ol {
-    padding-left: 30px;
+    padding-left: 25px;
     margin: 15px 0;
 }
 
@@ -440,23 +424,23 @@ html, body {
     margin-bottom: 8px;
 }
 
-/* Status indicator */
+/* Status Indicator */
 .status-indicator {
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 12px;
-    background: #334155;
+    background: #262626;
     border-radius: 8px;
     margin: 15px 0;
-    color: #60a5fa;
+    color: #00ffff;
     font-weight: 500;
-    border: 1px solid #3b82f6;
+    border: 1px solid #333333;
 }
 
 .spinner {
-    border: 4px solid #1e293b;
-    border-top: 4px solid #3b82f6;
+    border: 4px solid #111111;
+    border-top: 4px solid #00ffff;
     border-radius: 50%;
     width: 24px;
     height: 24px;
@@ -468,7 +452,6 @@ html, body {
 .progress-text {
     margin-left: 10px;
     font-weight: 500;
-    color: #e0e0e0 !important;
 }
 
 /* Footer */
@@ -476,36 +459,34 @@ html, body {
     text-align: center;
     margin-top: 30px;
     padding: 25px;
-    color: #9ca3af !important;
+    color: #888888;
     font-size: 0.95rem;
-    background: #1e293b;
+    background: #111111;
     border-radius: 10px;
-    border-top: 1px solid #3b82f6;
+    border-top: 1px solid #222222;
 }
 
 .footer p {
     margin: 8px 0;
-    color: #e0e0e0 !important;
 }
 
 .highlight {
-    background: linear-gradient(120deg, #2563eb, #1d4ed8);
+    background: linear-gradient(120deg, #00ffff, #0099cc);
     padding: 3px 8px;
     border-radius: 5px;
     font-weight: 600;
-    color: #ffffff;
+    color: #000000;
 }
 
-/* Markdown content */
+/* Markdown Styling */
 .gr-markdown {
     color: #e0e0e0 !important;
     line-height: 1.7;
-    background-color: #1e293b !important;
+    background-color: #1f1f1f !important;
 }
 
-.gr-markdown h1, .gr-markdown h2, .gr-markdown h3, 
-.gr-markdown h4, .gr-markdown h5, .gr-markdown h6 {
-    color: #60a5fa !important;
+.gr-markdown h1, .gr-markdown h2, .gr-markdown h3, .gr-markdown h4, .gr-markdown h5, .gr-markdown h6 {
+    color: #00ffff !important;
     margin-top: 1.5rem;
     margin-bottom: 1rem;
 }
@@ -516,29 +497,29 @@ html, body {
 }
 
 .gr-markdown a {
-    color: #06b6d4 !important;
+    color: #00cccc !important;
     text-decoration: underline;
 }
 
 .gr-markdown a:hover {
-    color: #0891b2 !important;
+    color: #00eeee !important;
 }
 
 .gr-markdown code {
-    background-color: #334155 !important;
+    background-color: #262626 !important;
     padding: 2px 6px !important;
     border-radius: 4px !important;
-    color: #f59e0b !important;
+    color: #ffcc00 !important;
     font-size: 0.95em !important;
 }
 
 .gr-markdown pre {
-    background-color: #334155 !important;
+    background-color: #262626 !important;
     padding: 15px !important;
     border-radius: 8px !important;
     overflow-x: auto !important;
     color: #e0e0e0 !important;
-    border: 1px solid #3b82f6 !important;
+    border: 1px solid #333333 !important;
 }
 
 .gr-markdown pre code {
@@ -548,9 +529,9 @@ html, body {
 }
 
 .gr-markdown blockquote {
-    border-left: 4px solid #3b82f6 !important;
+    border-left: 4px solid #00ffff !important;
     padding: 10px 20px !important;
-    background-color: #1e293b !important;
+    background-color: #1a1a1a !important;
     margin: 20px 0 !important;
     border-radius: 0 8px 8px 0 !important;
     color: #e0e0e0 !important;
@@ -563,67 +544,47 @@ html, body {
 }
 
 .gr-markdown table th, .gr-markdown table td {
-    border: 1px solid #3b82f6 !important;
+    border: 1px solid #333333 !important;
     padding: 10px !important;
     text-align: left !important;
     color: #e0e0e0 !important;
 }
 
 .gr-markdown table th {
-    background-color: #1d4ed8 !important;
+    background-color: #222222 !important;
     color: #ffffff !important;
 }
 
-/* Animations */
+/* Spinner Animation */
 @keyframes spin {
     0% { transform: rotate(0deg); }
     100% { transform: rotate(360deg); }
 }
 
-/* Responsive design */
+/* Responsive Design */
 @media (max-width: 768px) {
-    .container {
-        padding: 15px;
-    }
-    
-    .header {
-        padding: 20px 15px;
-    }
-    
     .title {
         font-size: 2rem;
     }
-    
+
     .subtitle {
         font-size: 1.1rem;
     }
-    
+
     .card {
         padding: 20px 15px;
     }
-    
+
     .btn-primary {
         padding: 12px 20px;
         font-size: 16px;
     }
-    
+
     .streaming-content {
         padding: 15px;
         font-size: 15px;
     }
 }
-
-/* High contrast mode support */
-@media (prefers-contrast: high) {
-    body {
-        background-color: #000000 !important;
-        color: #ffffff !important;
-    }
-    
-    .card {
-        border: 2px solid #ffffff;
-    }
-}
 """
 
 def research_assistant(query, file, use_ddg, progress=gr.Progress()):
@@ -692,4 +653,4 @@ with gr.Blocks(css=custom_css, title="Research Assistant") as demo:
     """)
 
 if __name__ == "__main__":
-    demo.launch(share=True)
+    demo.launch(share=True)