main_web.py

# FILE: main_web.py (Hugging Face Demo - FINAL, Mobile-First Pro Version)

import gradio as gr
import asyncio
import logging
import os
import sys
from typing import Optional, List, Dict, Any

# --- Basic Setup ---
APP_TITLE = "ZOTHEOS - Ethical Fusion AI"
logging.basicConfig(level=logging.INFO, format="%(asctime)s - %(name)s - %(levelname)s - %(message)s")
logger = logging.getLogger("ZOTHEOS_Interface_HF")

def get_asset_path(filename: str) -> str:
    return filename if os.path.exists(filename) else os.path.join('assets', filename)

logo_path_verified = get_asset_path("zotheos_logo.png")
GUMROAD_LINK = "https://zotheos.gumroad.com/l/jibfv" # Your actual Gumroad link

# --- Core Logic Imports ---
try:
    from modules.main_fusion_public import MainFusionPublic
except ImportError:
    MainFusionPublic = None
ai_system = MainFusionPublic() if MainFusionPublic else None

# --- ✅ DEFINITIVE "OBSIDIAN" MOBILE-FIRST CSS ---
zotheos_web_css = """
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;600;700&display=swap');

body {
    background: linear-gradient(135deg, #000000, #1c1c1c) !important;
    background-attachment: fixed !important;
    color: #f0f0f0 !important;
    font-family: 'Inter', sans-serif !important;
}
.gradio-container {
    background: transparent !important;
    max-width: 800px !important; /* Centered, comfortable width */
    margin: 0 auto !important; /* Horizontally center the entire app */
    padding: 1.5rem !important;
}
#main-column {
    display: flex;
    flex-direction: column;
    align-items: center; /* Center all content horizontally */
    width: 100%;
}
#header_logo img {
    max-height: 70px !important;
    filter: brightness(0) invert(1) !important;
    margin-bottom: 0.5rem !important;
}
#header_subtitle {
    font-family: 'Bebas Neue', cursive !important;
    font-size: 1.8rem !important; text-transform: uppercase !important;
    letter-spacing: 2px !important; text-align: center;
}
#header_tagline {
    color: #a0a0a0 !important; text-align: center;
    margin-top: -10px !important; margin-bottom: 2rem !important;
}
.gradio-accordion {
    background-color: #1a1a1a !important; border: 1px solid #333 !important;
}
.cta-button {
    background: #FFFFFF !important; color: #000000 !important;
    font-weight: bold !important;
}
.gradio-textbox textarea {
    font-size: 1.1rem !important;
}
#results_column { margin-top: 1.5rem; width: 100%; }
.result-box {
    background-color: rgba(18, 18, 18, 0.9) !important;
    border: 1px solid #333333 !important; padding: 1.5rem !important;
}
.result-box h2 {
    font-family: 'Bebas Neue', cursive !important; font-size: 1.5rem !important;
    border-bottom: 1px solid #333; padding-bottom: 0.75rem; margin-bottom: 1rem;
}
footer { display: none !important; }
"""

# --- Build Gradio Interface ---
def build_interface():
    zotheos_theme = gr.themes.Base(primary_hue=gr.themes.colors.neutral, secondary_hue=gr.themes.colors.neutral).set(
        button_primary_background_fill="white", button_primary_text_color="black", block_radius="12px"
    )

    with gr.Blocks(theme=zotheos_theme, css=zotheos_web_css, title=APP_TITLE) as demo:
        with gr.Column(elem_id="main-column"):
            # --- Header & CTA ---
            gr.Image(value=logo_path_verified, elem_id="header_logo", show_label=False, container=False, interactive=False)
            gr.Markdown("Ethical Fusion AI for Synthesized Intelligence", elem_id="header_subtitle")
            gr.Markdown("Fusing perspectives for deeper truth.", elem_id="header_tagline")

            with gr.Accordion("🔥 Get the Full Offline Desktop Version", open=True):
                gr.Markdown("This web demo uses smaller, slower models. For the full-power, GPU-accelerated, 100% private experience, download the ZOTHEOS Public Beta for your Windows PC.")
                gr.Button("Download Full Version on Gumroad", link=GUMROAD_LINK, elem_classes="cta-button")
            
            gr.Markdown("---")
            
            # --- Main Interaction ---
            query_input = gr.Textbox(label="Your Inquiry:", placeholder="e.g., What is universal peace?", lines=5)
            submit_button = gr.Button("Process Inquiry (Web Demo)", variant="primary")
            
            with gr.Column(elem_id="results_column", visible=False) as results_box:
                with gr.Column(elem_classes="result-box"):
                    synthesized_summary_output = gr.Markdown()
                with gr.Column(elem_classes="result-box", elem_id="fusion_output"):
                    fusion_output = gr.Markdown()

        # --- ✅ UNBREAKABLE EVENT HANDLER ---
        async def process_query_wrapper(query):
            if not ai_system:
                return gr.update(visible=True), "## SYSTEM OFFLINE\n\n[The AI engine failed to load.]", ""
            
            # Show a loading message
            yield gr.update(visible=True), "Synthesizing... Please wait.", ""

            response = await ai_system.process_query_with_fusion(query)
            summary = response.split("###")[0].strip()
            perspectives = "###" + response.split("###", 1)[1] if "###" in response else ""
            
            yield gr.update(visible=True), summary, perspectives

        submit_button.click(
            fn=process_query_wrapper,
            inputs=[query_input],
            outputs=[results_box, synthesized_summary_output, fusion_output]
        )
    return demo

# --- Main Execution Block ---
if __name__ == "__main__":
    logger.info("--- Initializing ZOTHEOS Hugging Face Demo (v2.1) ---")
    zotheos_interface = build_interface()
    logger.info("✅ HF Demo UI built successfully.")
    zotheos_interface.queue().launch()