import os
import gradio as gr
from groq import Groq
import re
from duckduckgo_search import DDGS
from main import TimeAdvisor

# Custom CSS for styling
custom_css = """
html, body, .gradio-container {
    background: url('YOUR_NEW_IMAGE_URL') !important;
    background-size: cover !important;
    color: #2c3e50 !important; /* Dark text for readability */
}
#tt-header {
    text-align: center;
    background: linear-gradient(45deg, #2c3e50, #b59b6d); /* Deep navy to gold */
    padding: 20px;
    border-radius: 15px;
    color: white;
    border: 3px solid #8a6c4d;
}
#tt-header h1 {
    font-family: 'Garamond', serif;
    font-size: 2.5em !important;
    margin: 0;
}
#tt-header p {
    font-family: 'Georgia', serif;
}
.input-section {
    background: #e9dcc5 !important; /* Muted parchment */
    padding: 20px !important;
    border-radius: 15px !important;
    border: 2px solid #b59b6d !important;
}
.output-box {
    background: #2e2205 !important;
    padding: 25px !important;
    border-radius: 15px !important;
    border: 3px solid #8a6c4d !important;
    font-family: 'Georgia', serif !important;
    min-height: 200px !important;
    color: var(--text-color-primary) !important;
}
.gradio-container {
    background: url('https://img.freepik.com/free-photo/wooden-floor-background_53876-88628.jpg?t=st=1741254869~exp=1741258469~hmac=ab6efd526ec76fa0d1fae8ad5c5907e80b93cafbea5da290f64ddf6648b80a46&w=1380') !important;
    background-size: cover !important;
}
button {
    background: #2c3e50 !important; /* Deep navy */
    color: #f5e6d3 !important;
    border: 2px solid #b59b6d !important;
    font-family: 'Garamond', serif !important;
}
"""


def time_travel_assistant(api_key, query):
    os.environ["GROQ_API_KEY"] = api_key
    try:
        advisor = TimeAdvisor()
        output = advisor.agent_loop(query)
        return output
    except Exception as e:
        return f"🕰️💥 Time Machine Malfunction! 💥🕰️"

with gr.Blocks(css=custom_css, theme=gr.themes.Soft()) as app:
    with gr.Column(elem_id="tt-header"):
        gr.Markdown("""
        # 🕰️✨ Time Traveler's Style Guide ✨🌍
        *"Fashionably Anachronistic Since 3000 BCE"*
        """)
    
    with gr.Row(variant="panel", elem_classes="input-section"):
        api_key = gr.Textbox(
            label="🔑 Groq API Key. (Get your key at https://console.groq.com/keys)",
            placeholder="Enter your API key...",
            type="password",
            lines=1
        )
        user_query = gr.Textbox(
            label="🌍⏳ Your Time Destination",
            placeholder="Where/when are we blending in?",
            lines=2
        )
    
    submit_btn = gr.Button("🚀 Launch Temporal Consultant", variant="primary")
    
    with gr.Column(elem_classes="output-box"):
        output = gr.Markdown(
            label="🎩📜 Time Travel Briefing",
            elem_id="output-box",
            value="**Awaiting your temporal coordinates...**"
        )
    
    examples = gr.Examples(
        examples=[
            ["Ancient Mesopotamia"],
            ["Renaissance Venice"],
            ["Wild West Saloon 1870"],
            ["1980s Tokyo Street Fashion"]
        ],
        inputs=[user_query],
        outputs=[output],
        fn=time_travel_assistant,
        cache_examples=False
    )
    
    submit_btn.click(
        fn=time_travel_assistant,
        inputs=[api_key, user_query],
        outputs=output
    )

if __name__ == "__main__":
    app.launch()