front ajusted for dark mode

app.py

@@ -526,15 +526,16 @@ with gr.Blocks(title="Climate Q&A", css_paths=os.getcwd()+ "/style.css", theme=t
                             
 ### Citation
 """)
-                
-                # Display citation label and text)
-                gr.Textbox(
-                    value=CITATION_TEXT,
-                    label=CITATION_LABEL,
-                    interactive=False,
-                    show_copy_button=True,
-                    lines=len(CITATION_TEXT.split('\n')),
-                )
+                with gr.Accordion(CITATION_LABEL,elem_id="citation", open = False,):
+                    # # Display citation label and text)
+                    gr.Textbox(
+                        value=CITATION_TEXT,
+                        label="",
+                        interactive=False,
+                        show_copy_button=True,
+                        lines=len(CITATION_TEXT.split('\n')),
+                    )
+
 
 
     def start_chat(query,history):

style.css

@@ -96,6 +96,8 @@ a {
     color:#dc2626!important;
     /* margin-right:1px; */
 }
+
+
 .card {
     background-color: white;
     border-radius: 10px;
@@ -310,10 +312,16 @@ footer {
 }
 
 
+body.dark .container > .wrap{
+    background-color: #374151 !important;
+    color:white !important;
+}
+
 body.dark .card{
     background-color: #374151;
 }
 
+
 body.dark .card-content h2{
     color:#f4dbd3 !important;
 }
@@ -325,7 +333,15 @@ body.dark .card-footer {
 body.dark .card-footer span {
     color:white !important;
 }
-
+body.dark .gradio-container .contain .card-image > .card-content{
+    background-color: #404652 !important;
+}
+body.dark .gradio-container .contain .card > .card-content{
+    background-color: #404652 !important;
+}
+body.dark .card-footer{
+    background-color: #24272e !important;
+}
 
 .doc-ref{
     color:#dc2626!important;