from tinysql_model_demo import model_demo
from tinysql_dataset_viewer import dataset_viewer
import gradio as gr

custom_css = """
:root {
    --martian-orange: #FF6B4A;
    --martian-black: #0A0A0A;
}

.gradio-container {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    background-color: var(--martian-black) !important;
}

.tab-nav button {
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    padding: 0.75rem 1.5rem !important;
}

.tab-nav button.selected {
    border-bottom: 3px solid var(--martian-orange) !important;
    color: var(--martian-orange) !important;
}
"""

with gr.Blocks(css=custom_css, title="TinySQL Demo") as demo:
    with gr.Tabs():
        with gr.Tab("Model Demo"):
            model_demo()
        with gr.Tab("Dataset Viewer"):
            dataset_viewer()

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