Update app.py

app.py

@@ -53,37 +53,37 @@ def format_output(brand_input):
         """
     return html
 
-# Custom CSS for light background with dark-blue accents
+# Custom CSS for dark blue theme
 custom_css = """
-body { background-color: #f7f9fb; color: #1a1a1a; font-family: 'Roboto', sans-serif; }
-.interface-title { color: #0a1f44 !important; font-size: 2em !important; margin-bottom: 0.2em; }
-.interface-description { color: #333333 !important; margin-bottom: 1em; }
-#input-box textarea { background-color: #ffffff !important; color: #1a1a1a; border: 2px solid #0a1f44; border-radius: 8px; padding: 0.5em; }
-#input-box label { color: #0a1f44; font-weight: 600; }
-#output-cards .card { background-color: #ffffff; color: #1a1a1a; border-left: 4px solid #0a1f44; border-radius: 8px; padding: 1em; margin-bottom: 1em; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
-#output-cards h3 { margin-bottom: 0.4em; color: #0a1f44; font-size: 1.3em; }
-#output-cards .platform { font-size: 0.9em; color: #555555; }
-.gr-button { background-color: #0a1f44 !important; color: #ffffff !important; border-radius: 6px !important; }
-.gr-button:hover { background-color: #082d6b !important; }
+body { background-color: #0a1f44; color: #ffffff; font-family: 'Segoe UI', sans-serif; }
+.interface-title { color: #e0e0e0 !important; font-size: 2em !important; text-shadow: 1px 1px #000000; }
+.interface-description { color: #cccccc !important; font-size: 1.1em; margin-bottom: 1.5em; }
+#input-box textarea { background-color: #112857 !important; color: #ffffff; border: 2px solid #1e3a6e; border-radius: 8px; padding: 0.7em; }
+#input-box label { color: #ffffff !important; font-weight: 600; }
+.gr-button { background-color: #1e3a6e !important; color: #ffffff !important; border-radius: 6px !important; padding: 0.6em 1.2em !important; }
+.gr-button:hover { background-color: #162b53 !important; }
+#output-cards .card { background-color: #112857; color: #f0f0f0; border: 1px solid #1e3a6e; border-radius: 10px; padding: 1.2em; margin-bottom: 1.2em; box-shadow: 0 4px 8px rgba(0,0,0,0.5); }
+#output-cards h3 { margin-bottom: 0.5em; color: #ffc857; font-size: 1.4em; }
+#output-cards .platform { font-size: 0.9em; color: #dddddd; }
 """
 
 # Build the Gradio interface
 demo = gr.Interface(
     fn=format_output,
     inputs=gr.Textbox(
-        label="Describe your brand or campaign",
-        placeholder="e.g. Sustainable fashion brand targeting Gen Z in the US",
+        label="Enhance Your Social Media Marketing",
+        placeholder="e.g. Targeted fitness brand outreach for Gen Z",
         lines=3,
         elem_id="input-box"
     ),
     outputs=gr.HTML(elem_id="output-cards"),
-    title="InfluMatch – AI-Powered Influencer Recommender",
-    description="Enter your brand or campaign description to receive three top influencer matches with niche, region, and engagement details.",
+    title="InfluMatch: Targeted Influencer Discovery",
+    description="Leverage AI to pinpoint the perfect influencers for your niche and boost your social media campaigns.",
     examples=[
-        ["Skincare brand for Gen Z women in the US"],
-        ["High-end travel gear targeting adventure enthusiasts in Europe"],
-        ["Eco-friendly fitness apparel for millennials"],
-        ["Gourmet pet food brand seeking Instagram influencers in Canada"]
+        ["Sustainable fashion campaign targeting eco-conscious millennials"],
+        ["Tech gadget launch aimed at early adopters in the US"],
+        ["Healthy snack brand outreach for fitness enthusiasts"],
+        ["Luxury travel experiences for affluent couples in Europe"]
     ],
     css=custom_css,
     theme="default",