Spaces:

MCP-1st-Birthday
/

cx_ai_agent

Runtime error

muzakkirhussain011 Claude commited on 27 days ago

Commit

b2313f4

1 Parent(s): 3951741

Redesign UI to enterprise-grade Salesforce/Microsoft style

Complete UI/UX overhaul for non-technical end users:

## Visual Design
- Professional blue gradient header
- Salesforce-inspired color palette
- Card-based layout with shadows and hover effects
- Clean typography with Inter font
- Responsive design for all screen sizes

## New Dashboard Tab
- Quick stats cards (Prospects, Emails, Contacts)
- Quick action tiles for common tasks
- Getting started guide for new users

## Improved Research Tab
- Simple company name input (no technical jargon)
- Radio buttons for task type selection
- Popular companies quick-fill buttons
- Clean results panel with markdown output
- User-friendly progress messages

## New Tabs
- Prospects: Pipeline view placeholder
- Emails: Drafted emails placeholder
- Help: FAQ and documentation

## User Experience
- Hides technical details (logs, tool names)
- Friendly step descriptions instead of tool calls
- Clear error messages with helpful suggestions
- Results summary table with metrics

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Files changed (1) hide show

app.py +880 -366

app.py CHANGED Viewed

@@ -1,14 +1,8 @@
 """
-CX AI Agent - Autonomous MCP Agent with HuggingFace Inference Providers
-Main Entry Point for HuggingFace Spaces Deployment
-This application demonstrates TRUE MCP (Model Context Protocol) usage where:
-- AI (Qwen2.5-72B via HuggingFace) autonomously decides which MCP tools to call
-- NO hardcoded workflow - AI uses native tool calling
-- HuggingFace Inference Providers (Nebius, Together, Sambanova)
-- Free tier available with HuggingFace account
-- Works on free HuggingFace Spaces (no local model loading needed!)
 """
 import os
@@ -17,104 +11,454 @@ import asyncio
 import logging
 from pathlib import Path
 from dotenv import load_dotenv
 # Load environment variables
 load_dotenv()
-# Set in-memory MCP mode for HF Spaces (no separate server processes)
 os.environ["USE_IN_MEMORY_MCP"] = "true"
 # Import MCP components
 from mcp.registry import get_mcp_registry
 from mcp.agents.autonomous_agent_hf import AutonomousMCPAgentHF
-# Setup logging with both console and string capture
 import io
 import sys
-# Create a string buffer to capture logs
 log_capture_string = io.StringIO()
-# Setup logging with multiple handlers
 logging.basicConfig(
     level=logging.INFO,
     format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
     handlers=[
-        logging.StreamHandler(sys.stdout),  # Console output
-        logging.StreamHandler(log_capture_string)  # Capture for display
     ]
 )
 logger = logging.getLogger(__name__)
-# ============================================================================
-# DIAGNOSTIC: Check API Keys on Startup
-# ============================================================================
 print("\n" + "="*80)
-print("🚀 CX AI AGENT - AUTONOMOUS MCP WITH HUGGINGFACE INFERENCE")
 print("="*80)
-# Check HF_TOKEN
 hf_token = os.getenv('HF_TOKEN') or os.getenv('HF_API_TOKEN')
 if hf_token:
-    print(f"✅ HF_TOKEN is loaded (length: {len(hf_token)} chars)")
 else:
-    print("❌ HF_TOKEN NOT FOUND!")
-    print("   This is REQUIRED for HuggingFace Inference Providers")
-    print("   Get token at: https://huggingface.co/settings/tokens")
-    print("   Set in: Settings -> Repository secrets -> HF_TOKEN")
-# Check HF_PROVIDER (optional, defaults to nscale)
-hf_provider = os.getenv('HF_PROVIDER', 'nscale')
-print(f"📡 Inference Provider: {hf_provider}")
-print("   Available: nscale, nebius, together, sambanova, fireworks-ai, cerebras")
-# Check HF_MODEL (optional)
-hf_model = os.getenv('HF_MODEL', 'Qwen/Qwen3-4B-Instruct-2507')
-print(f"🤖 Model: {hf_model}")
-# Check SERPER_API_KEY (optional for web search)
 serper_key = os.getenv('SERPER_API_KEY')
 if serper_key:
-    print(f"✅ SERPER_API_KEY is loaded (length: {len(serper_key)} chars)")
 else:
-    print("⚠️  SERPER_API_KEY NOT FOUND")
-    print("   Web search will use fallback data")
-    print("   Get free key at: https://serper.dev")
-# Check if running in HF Space
 space_id = os.getenv('SPACE_ID')
 if space_id:
-    print(f"📍 Running in HuggingFace Space: {space_id}")
-else:
-    print("📍 Running locally")
 print("="*80 + "\n")
-# Initialize MCP registry (in-memory mode for HF Spaces)
 try:
     mcp_registry = get_mcp_registry()
-    print("✅ MCP Registry initialized (in-memory mode)")
-    print("   - Search MCP Server")
-    print("   - Store MCP Server")
-    print("   - Email MCP Server")
-    print("   - Calendar MCP Server")
 except Exception as e:
-    print(f"❌ MCP Registry initialization failed: {e}")
     raise
-async def run_autonomous_agent(task: str, progress=gr.Progress()):
-    """
-    Run the autonomous AI agent with MCP tool calling using HuggingFace Inference.
-    Args:
-        task: The task for the AI to complete autonomously
-    Yields:
-        Progress updates from the agent with logs
-    """
-    # Helper function to get recent logs
     def get_recent_logs(last_position=0):
         log_capture_string.seek(last_position)
         new_logs = log_capture_string.read()
@@ -123,42 +467,44 @@ async def run_autonomous_agent(task: str, progress=gr.Progress()):
     log_position = 0
-    if not task or not task.strip():
-        yield "❌ Error: Please provide a task description"
         return
-    # Check if HF token is available
     hf_token = os.getenv('HF_TOKEN') or os.getenv('HF_API_TOKEN')
     if not hf_token:
-        yield """❌ Error: HuggingFace token not found!
-Please set your HuggingFace token:
-1. Get a token from: https://huggingface.co/settings/tokens
-2. In HF Space: Settings → Repository secrets → Add:
-   Name: HF_TOKEN
-   Value: hf_your_token_here
-3. Restart the space
-For local development, set environment variable:
-export HF_TOKEN=hf_your_token_here
-"""
-        return
-    # Get provider and model from environment
     provider = os.getenv('HF_PROVIDER', 'nscale')
     model = os.getenv('HF_MODEL', 'Qwen/Qwen3-4B-Instruct-2507')
-    # Create autonomous agent
-    try:
-        output_text = f"⏳ Initializing HuggingFace Inference Agent...\n\n"
-        output_text += f"Provider: {provider}\n"
-        output_text += f"Model: {model}\n\n"
-        output_text += "No local model loading needed - using cloud inference!\n\n"
-        yield output_text
-        progress(0.1, desc="Initializing HuggingFace agent...")
         agent = AutonomousMCPAgentHF(
             mcp_registry=mcp_registry,
             hf_token=hf_token,
@@ -166,338 +512,506 @@ export HF_TOKEN=hf_your_token_here
             model=model
         )
-        # Get logs from initialization
-        new_logs, log_position = get_recent_logs(log_position)
-        output_text += "✅ Agent initialized successfully!\n\nStarting autonomous task...\n\n"
-        if new_logs.strip():
-            output_text += "\n" + "="*70 + "\n"
-            output_text += "📋 LOGS:\n"
-            output_text += "="*70 + "\n"
-            output_text += new_logs + "\n"
-            output_text += "="*70 + "\n\n"
-        yield output_text
-        progress(0.2, desc="Agent ready, starting task...")
-        logger.info(f"Agent initialized for task: {task}")
     except Exception as e:
-        error_msg = f"❌ Error initializing agent: {str(e)}\n\nPlease check:\n1. HF_TOKEN is valid\n2. Network connection available\n3. Provider '{provider}' supports model '{model}'\n\n"
-        # Include error logs
-        new_logs, log_position = get_recent_logs(log_position)
-        error_msg += "\n" + "="*70 + "\n"
-        error_msg += "📋 ERROR LOGS:\n"
-        error_msg += "="*70 + "\n"
-        error_msg += new_logs + "\n"
-        yield error_msg
         return
-    # Run agent autonomously
-    output_text = ""
-    iteration_count = 0
-    show_logs_every = 2  # Show logs every N iterations
     try:
         async for event in agent.run(task, max_iterations=15):
             event_type = event.get("type")
-            message = event.get("message", "")
-            # Update progress
-            if event_type == "iteration_start":
-                iteration_count = event.get("iteration", 0)
-                progress((iteration_count / 15), desc=f"Iteration {iteration_count}/15")
-                # Periodically show logs
-                if iteration_count % show_logs_every == 0:
-                    new_logs, log_position = get_recent_logs(log_position)
-                    if new_logs.strip():
-                        output_text += f"\n{'─'*70}\n"
-                        output_text += f"📋 Logs (Iteration {iteration_count}):\n"
-                        output_text += f"{'─'*70}\n"
-                        output_text += new_logs
-                        output_text += f"{'─'*70}\n\n"
-            # Format the message based on event type
-            if event_type == "agent_start":
-                output_text += f"\n{'='*70}\n"
-                output_text += f"🤖 {message}\n"
-                output_text += f"Task: {event.get('task', '')}\n"
-                output_text += f"Model: {event.get('model', 'Granite 4')}\n"
-                output_text += f"{'='*70}\n\n"
-            elif event_type == "iteration_start":
-                output_text += f"\n--- {message} ---\n"
-            elif event_type == "thought":
-                thought = event.get("thought", "")
-                output_text += f"\n💭 AI Reasoning:\n"
-                output_text += f"   {thought}\n"
-            elif event_type == "tool_call":
-                tool = event.get("tool")
                 tool_input = event.get("input", {})
-                output_text += f"\n🔧 {message}\n"
-                output_text += f"   Parameters: {tool_input}\n"
             elif event_type == "tool_result":
-                tool = event.get("tool")
                 result = event.get("result", {})
-                output_text += f"✅ {message}\n"
-                # Show some result details
-                if isinstance(result, dict):
-                    if "count" in result:
-                        output_text += f"   → Returned {result['count']} items\n"
-                    elif "status" in result:
-                        output_text += f"   → Status: {result['status']}\n"
-                    elif "prospect_id" in result:
-                        output_text += f"   → Prospect ID: {result['prospect_id']}\n"
-                    elif "company_id" in result:
-                        output_text += f"   → Company ID: {result['company_id']}\n"
-            elif event_type == "tool_error":
-                tool = event.get("tool")
-                error = event.get("error")
-                output_text += f"\n❌ {message}\n"
-                output_text += f"   Error: {error}\n"
-            elif event_type == "parse_error":
-                output_text += f"\n⚠️ {message}\n"
             elif event_type == "agent_complete":
                 final_answer = event.get("final_answer", "")
-                iterations = event.get("iterations", 0)
-                output_text += f"\n{'='*70}\n"
-                output_text += f"✅ {message}\n"
-                output_text += f"Completed in {iterations} iterations\n"
-                output_text += f"{'='*70}\n\n"
-                output_text += f"📋 **Final Answer:**\n\n{final_answer}\n"
-                # Show final logs
-                new_logs, log_position = get_recent_logs(log_position)
-                if new_logs.strip():
-                    output_text += f"\n\n{'='*70}\n"
-                    output_text += f"📋 FINAL LOGS:\n"
-                    output_text += f"{'='*70}\n"
-                    output_text += new_logs + "\n"
             elif event_type == "agent_error":
-                error = event.get("error")
-                output_text += f"\n❌ {message}\n"
-                output_text += f"Error: {error}\n"
-                # Show error logs
-                new_logs, log_position = get_recent_logs(log_position)
-                if new_logs.strip():
-                    output_text += f"\n{'─'*70}\n"
-                    output_text += f"📋 Error Logs:\n"
-                    output_text += f"{'─'*70}\n"
-                    output_text += new_logs + "\n"
             elif event_type == "agent_max_iterations":
-                iterations = event.get("iterations", 0)
-                output_text += f"\n⚠️ {message}\n"
-                output_text += f"The task may be too complex. Try breaking it into smaller tasks.\n"
-            yield output_text
     except Exception as e:
-        output_text += f"\n\n❌ Agent execution failed: {str(e)}\n"
-        logger.error(f"Agent execution error: {e}", exc_info=True)
-        # Show exception logs
-        new_logs, log_position = get_recent_logs(log_position)
-        if new_logs.strip():
-            output_text += f"\n{'='*70}\n"
-            output_text += f"📋 EXCEPTION LOGS:\n"
-            output_text += f"{'='*70}\n"
-            output_text += new_logs + "\n"
-            output_text += f"{'='*70}\n"
-        yield output_text
-def create_demo():
-    """Create Gradio demo interface"""
     with gr.Blocks(
-        title="CX AI Agent - Autonomous MCP with HuggingFace",
-        theme=gr.themes.Soft(),
-        css="""
-        .center-text { text-align: center; }
-        .highlight { background-color: #f0f7ff; padding: 15px; border-radius: 5px; }
-        """
     ) as demo:
-        gr.Markdown("""
-        # 🤖 CX AI Agent - Autonomous MCP Demo
-        ### Powered by HuggingFace Inference Providers + Model Context Protocol
-        This demo shows **TRUE AI-driven MCP usage** where the AI:
-        - ✅ **Autonomously decides** which MCP tools to call (no hardcoded workflow!)
-        - ✅ **Native tool calling** via HuggingFace Inference Providers
-        - ✅ **Qwen3-4B-Instruct-2507** - Latest Qwen3 with strong tool calling
-        - ✅ **Calls MCP servers** (Search, Store, Email, Calendar)
-        - ✅ **Adapts to any task** in B2B sales automation
-        - ✅ **Cloud inference** - No local model loading needed!
-        ---
         """)
-        with gr.Row():
-            with gr.Column(scale=1):
-                gr.Markdown("""
-                ### 🎯 Available MCP Tools:
-                **🔍 Search**
-                - Web search
-                - News search
-                **💾 Store**
-                - Save/get prospects
-                - Save/get companies
-                - Save facts & contacts
-                - Check suppressions
-                **📧 Email**
-                - Send emails
-                - Track threads
-                **📅 Calendar**
-                - Meeting slots
-                - Calendar invites
                 """)
-            with gr.Column(scale=2):
-                task_input = gr.Textbox(
-                    label="📝 Task for AI Agent (be specific!)",
-                    placeholder="Example: Research Shopify and create a prospect profile with company info and recent news facts",
-                    lines=4,
-                    info="The AI will autonomously decide which MCP tools to use"
-                )
-                # Example tasks dropdown - covers all MCP modules
-                example_tasks = gr.Dropdown(
-                    label="💡 Example Tasks (click to use)",
-                    choices=[
-                        # === SEARCH + COMPANY/PROSPECT TASKS ===
-                        "Research Shopify and create a prospect profile with recent news",
-                        "Find information about Stripe and save company details and facts",
-                        "Research HubSpot and save company profile with industry insights",
-                        # === CONTACT FINDING TASKS ===
-                        "Find decision makers at Salesforce (CEO, CTO, VP Sales) and save their contact info",
-                        "Research Atlassian leadership team and save contacts with their roles and LinkedIn profiles",
-                        "Find key contacts at Zendesk including executives and department heads",
-                        # === EMAIL GENERATION TASKS ===
-                        "Research Slack, find their VP of Sales, and draft a personalized outreach email",
-                        "Create a cold email campaign: Research Monday.com, find contacts, and generate personalized emails",
-                        "Research Asana, save company info, find marketing director, and compose an introduction email",
-                        # === FULL PIPELINE TASKS ===
-                        "Complete B2B pipeline for Notion: research company, find CEO contact, save all data, and draft outreach email",
-                        "Full prospect workflow for Airtable: company research, decision maker contacts, facts, and email generation",
-                        # === CALENDAR/MEETING TASKS ===
-                        "Research Zoom and suggest meeting slots for a product demo with their team",
-                        "Find Calendly company info, save prospect, and generate a meeting invite for next week",
-                        # === MULTI-PROSPECT TASKS ===
-                        "Research 3 CRM companies (HubSpot, Pipedrive, Freshsales) and create prospect profiles for each",
-                        "Find and compare 2 project management tools (Jira, Linear) - save company details and key facts",
-                    ],
-                    interactive=True
-                )
-                def use_example(example):
-                    return example
-                example_tasks.change(fn=use_example, inputs=[example_tasks], outputs=[task_input])
-                run_btn = gr.Button(
-                    "🚀 Run Autonomous Agent",
-                    variant="primary",
-                    size="lg"
                 )
-        with gr.Row():
-            output = gr.Textbox(
-                label="🔄 Agent Progress & Results",
-                lines=30,
-                max_lines=50,
-                show_copy_button=True,
-                interactive=False
-            )
-        run_btn.click(
-            fn=run_autonomous_agent,
-            inputs=[task_input],
-            outputs=[output]
-        )
-        gr.Markdown("""
-        ---
-        ## 🎓 How It Works (Native Tool Calling)
-        The AI uses **native function calling** to autonomously complete tasks:
-        1. **Analyze** - AI understands the task
-        2. **Tool Call** - AI calls MCP tools with proper parameters
-        3. **Process Results** - AI receives and processes tool results
-        4. **Iterate** - AI continues calling tools as needed
-        5. **Summary** - AI provides final answer
-        **No hardcoded workflow!** The AI decides everything based on the task.
-        ## 🏆 True MCP Implementation
-        This demonstrates proper Model Context Protocol usage:
-        - ✅ **AI autonomous tool calling** (not manual invocation)
-        - ✅ **15 MCP tools** with proper schemas
-        - ✅ **4 MCP servers** (Search, Store, Email, Calendar)
-        - ✅ **Adapts to any B2B task** (not fixed pipeline)
-        - ✅ **HuggingFace Inference** (cloud-based, no local loading)
-        ## 💡 Tips for Best Results
-        - **Be specific** about what you want
-        - **Include details** like company names
-        - **Multi-step tasks** show AI decision-making best
-        - **Watch the tool calls** to see AI's actions
-        ## ⚙️ Configuration
-        **Required:**
-        - `HF_TOKEN` - HuggingFace API token
-        **Optional:**
-        - `HF_PROVIDER` - Inference provider (default: nscale)
-        - `HF_MODEL` - Model to use (default: Qwen/Qwen3-4B-Instruct-2507)
-        - `SERPER_API_KEY` - For real web search (free at serper.dev)
-        Set in HF Space: **Settings → Repository secrets**
-        ---
-        **Provider:** HuggingFace Inference Providers (Nscale, Nebius, etc.)
-        **Model:** Qwen/Qwen3-4B-Instruct-2507 (configurable)
-        **Protocol:** Model Context Protocol (MCP)
         """)
     return demo
 if __name__ == "__main__":
-    # Create and launch demo
-    demo = create_demo()
-    # Launch settings
     demo.launch(
         server_name="0.0.0.0",
         server_port=7860,
         show_error=True,
-        share=False  # Don't create public link by default
     )

 """
+CX AI Agent - Enterprise B2B Sales Intelligence Platform
+A modern, user-friendly interface for AI-powered sales automation.
+Designed for sales teams, not developers.
 """
 import os
 import logging
 from pathlib import Path
 from dotenv import load_dotenv
+from datetime import datetime
 # Load environment variables
 load_dotenv()
+# Set in-memory MCP mode for HF Spaces
 os.environ["USE_IN_MEMORY_MCP"] = "true"
 # Import MCP components
 from mcp.registry import get_mcp_registry
 from mcp.agents.autonomous_agent_hf import AutonomousMCPAgentHF
+# Setup logging
 import io
 import sys
 log_capture_string = io.StringIO()
 logging.basicConfig(
     level=logging.INFO,
     format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
     handlers=[
+        logging.StreamHandler(sys.stdout),
+        logging.StreamHandler(log_capture_string)
     ]
 )
 logger = logging.getLogger(__name__)
+# Startup diagnostics
 print("\n" + "="*80)
+print("🚀 CX AI AGENT - ENTERPRISE B2B SALES INTELLIGENCE")
 print("="*80)
 hf_token = os.getenv('HF_TOKEN') or os.getenv('HF_API_TOKEN')
 if hf_token:
+    print(f"✅ HF_TOKEN loaded")
 else:
+    print("❌ HF_TOKEN NOT FOUND - Required for AI features")
 serper_key = os.getenv('SERPER_API_KEY')
 if serper_key:
+    print(f"✅ SERPER_API_KEY loaded")
 else:
+    print("⚠️  SERPER_API_KEY not found - Web search limited")
 space_id = os.getenv('SPACE_ID')
 if space_id:
+    print(f"📍 Running in: {space_id}")
 print("="*80 + "\n")
+# Initialize MCP registry
 try:
     mcp_registry = get_mcp_registry()
+    print("✅ AI Services initialized")
 except Exception as e:
+    print(f"❌ Initialization failed: {e}")
     raise
+# ============================================================================
+# ENTERPRISE CSS THEME
+# ============================================================================
+ENTERPRISE_CSS = """
+/* ===== ENTERPRISE THEME - SALESFORCE/MICROSOFT INSPIRED ===== */
+/* Root variables */
+:root {
+    --primary-blue: #0176D3;
+    --primary-dark: #014486;
+    --success-green: #2E844A;
+    --warning-orange: #DD7A01;
+    --error-red: #EA001E;
+    --neutral-dark: #181818;
+    --neutral-gray: #706E6B;
+    --neutral-light: #F3F3F3;
+    --white: #FFFFFF;
+    --card-shadow: 0 2px 8px rgba(0,0,0,0.08);
+    --card-shadow-hover: 0 4px 16px rgba(0,0,0,0.12);
+}
+/* Main container */
+.gradio-container {
+    max-width: 1400px !important;
+    margin: 0 auto !important;
+    font-family: 'Salesforce Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+}
+/* Header styling */
+.main-header {
+    background: linear-gradient(135deg, #0176D3 0%, #014486 100%);
+    color: white;
+    padding: 24px 32px;
+    border-radius: 12px;
+    margin-bottom: 24px;
+    box-shadow: var(--card-shadow);
+}
+.main-header h1 {
+    margin: 0 0 8px 0;
+    font-size: 28px;
+    font-weight: 700;
+}
+.main-header p {
+    margin: 0;
+    opacity: 0.9;
+    font-size: 16px;
+}
+/* Stats cards */
+.stats-row {
+    display: flex;
+    gap: 16px;
+    margin-bottom: 24px;
+}
+.stat-card {
+    background: white;
+    border-radius: 12px;
+    padding: 20px 24px;
+    flex: 1;
+    box-shadow: var(--card-shadow);
+    border-left: 4px solid var(--primary-blue);
+    transition: all 0.2s ease;
+}
+.stat-card:hover {
+    box-shadow: var(--card-shadow-hover);
+    transform: translateY(-2px);
+}
+.stat-card .stat-value {
+    font-size: 32px;
+    font-weight: 700;
+    color: var(--neutral-dark);
+    margin-bottom: 4px;
+}
+.stat-card .stat-label {
+    font-size: 14px;
+    color: var(--neutral-gray);
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+}
+/* Action cards */
+.action-card {
+    background: white;
+    border-radius: 12px;
+    padding: 24px;
+    box-shadow: var(--card-shadow);
+    margin-bottom: 16px;
+    border: 1px solid #E5E5E5;
+}
+.action-card:hover {
+    border-color: var(--primary-blue);
+    box-shadow: var(--card-shadow-hover);
+}
+.action-card h3 {
+    margin: 0 0 12px 0;
+    color: var(--neutral-dark);
+    font-size: 18px;
+    font-weight: 600;
+}
+.action-card p {
+    margin: 0 0 16px 0;
+    color: var(--neutral-gray);
+    font-size: 14px;
+    line-height: 1.5;
+}
+/* Primary button */
+.primary-btn {
+    background: linear-gradient(135deg, #0176D3 0%, #014486 100%) !important;
+    color: white !important;
+    border: none !important;
+    border-radius: 8px !important;
+    padding: 12px 24px !important;
+    font-size: 16px !important;
+    font-weight: 600 !important;
+    cursor: pointer !important;
+    transition: all 0.2s ease !important;
+    box-shadow: 0 2px 4px rgba(1, 118, 211, 0.3) !important;
+}
+.primary-btn:hover {
+    transform: translateY(-1px) !important;
+    box-shadow: 0 4px 12px rgba(1, 118, 211, 0.4) !important;
+}
+/* Secondary button */
+.secondary-btn {
+    background: white !important;
+    color: var(--primary-blue) !important;
+    border: 2px solid var(--primary-blue) !important;
+    border-radius: 8px !important;
+    padding: 10px 20px !important;
+    font-weight: 600 !important;
+}
+/* Input fields */
+.input-field textarea, .input-field input {
+    border: 2px solid #E5E5E5 !important;
+    border-radius: 8px !important;
+    padding: 12px 16px !important;
+    font-size: 15px !important;
+    transition: all 0.2s ease !important;
+}
+.input-field textarea:focus, .input-field input:focus {
+    border-color: var(--primary-blue) !important;
+    box-shadow: 0 0 0 3px rgba(1, 118, 211, 0.1) !important;
+}
+/* Results panel */
+.results-panel {
+    background: #FAFBFC;
+    border-radius: 12px;
+    padding: 24px;
+    border: 1px solid #E5E5E5;
+}
+.results-panel h3 {
+    margin: 0 0 16px 0;
+    color: var(--neutral-dark);
+    font-size: 16px;
+    font-weight: 600;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+/* Progress indicator */
+.progress-bar {
+    height: 4px;
+    background: #E5E5E5;
+    border-radius: 2px;
+    overflow: hidden;
+    margin-bottom: 16px;
+}
+.progress-bar-fill {
+    height: 100%;
+    background: linear-gradient(90deg, #0176D3, #2E844A);
+    border-radius: 2px;
+    transition: width 0.3s ease;
+}
+/* Status badges */
+.badge {
+    display: inline-flex;
+    align-items: center;
+    padding: 4px 12px;
+    border-radius: 16px;
+    font-size: 12px;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+}
+.badge-success {
+    background: #E6F4EA;
+    color: #2E844A;
+}
+.badge-warning {
+    background: #FEF3E2;
+    color: #DD7A01;
+}
+.badge-info {
+    background: #E5F3FE;
+    color: #0176D3;
+}
+.badge-error {
+    background: #FDE7E9;
+    color: #EA001E;
+}
+/* Tabs styling */
+.tabs {
+    border: none !important;
+    background: transparent !important;
+}
+.tab-nav {
+    background: white !important;
+    border-radius: 12px 12px 0 0 !important;
+    padding: 8px 8px 0 8px !important;
+    border-bottom: 2px solid #E5E5E5 !important;
+}
+.tab-nav button {
+    border: none !important;
+    background: transparent !important;
+    padding: 12px 24px !important;
+    font-weight: 600 !important;
+    color: var(--neutral-gray) !important;
+    border-radius: 8px 8px 0 0 !important;
+    margin-right: 4px !important;
+}
+.tab-nav button.selected {
+    background: var(--primary-blue) !important;
+    color: white !important;
+}
+/* Quick action tiles */
+.quick-action {
+    background: white;
+    border: 2px solid #E5E5E5;
+    border-radius: 12px;
+    padding: 20px;
+    text-align: center;
+    cursor: pointer;
+    transition: all 0.2s ease;
+}
+.quick-action:hover {
+    border-color: var(--primary-blue);
+    background: #F8FBFE;
+    transform: translateY(-2px);
+}
+.quick-action-icon {
+    font-size: 32px;
+    margin-bottom: 12px;
+}
+.quick-action-title {
+    font-size: 14px;
+    font-weight: 600;
+    color: var(--neutral-dark);
+    margin-bottom: 4px;
+}
+.quick-action-desc {
+    font-size: 12px;
+    color: var(--neutral-gray);
+}
+/* Prospect card */
+.prospect-card {
+    background: white;
+    border-radius: 12px;
+    padding: 20px;
+    margin-bottom: 16px;
+    border: 1px solid #E5E5E5;
+    box-shadow: var(--card-shadow);
+}
+.prospect-card-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 16px;
+    padding-bottom: 16px;
+    border-bottom: 1px solid #E5E5E5;
+}
+.prospect-name {
+    font-size: 18px;
+    font-weight: 700;
+    color: var(--neutral-dark);
+}
+.fit-score {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+.fit-score-value {
+    font-size: 24px;
+    font-weight: 700;
+}
+.fit-score-high { color: #2E844A; }
+.fit-score-medium { color: #DD7A01; }
+.fit-score-low { color: #EA001E; }
+/* Hide technical elements for users */
+.technical-details {
+    display: none;
+}
+/* Responsive */
+@media (max-width: 768px) {
+    .stats-row {
+        flex-direction: column;
+    }
+    .main-header {
+        padding: 16px 20px;
+    }
+    .main-header h1 {
+        font-size: 22px;
+    }
+}
+/* Loading animation */
+.loading-spinner {
+    display: inline-block;
+    width: 20px;
+    height: 20px;
+    border: 2px solid #E5E5E5;
+    border-top-color: var(--primary-blue);
+    border-radius: 50%;
+    animation: spin 0.8s linear infinite;
+}
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}
+/* Output formatting */
+.output-section {
+    background: white;
+    border-radius: 8px;
+    padding: 16px;
+    margin-bottom: 12px;
+    border-left: 4px solid var(--primary-blue);
+}
+.output-section.success {
+    border-left-color: var(--success-green);
+}
+.output-section.warning {
+    border-left-color: var(--warning-orange);
+}
+.output-section.error {
+    border-left-color: var(--error-red);
+}
+"""
+# ============================================================================
+# AGENT EXECUTION
+# ============================================================================
+async def run_sales_agent(company_name: str, task_type: str, progress=gr.Progress()):
+    """Run the AI agent with user-friendly output formatting."""
     def get_recent_logs(last_position=0):
         log_capture_string.seek(last_position)
         new_logs = log_capture_string.read()
     log_position = 0
+    if not company_name or not company_name.strip():
+        yield format_error("Please enter a company name to research.")
         return
     hf_token = os.getenv('HF_TOKEN') or os.getenv('HF_API_TOKEN')
     if not hf_token:
+        yield format_error("AI services not configured. Please contact your administrator.")
+        return
+    # Build task based on type
+    task_templates = {
+        "full_research": f"Research {company_name} thoroughly: find company information, identify 3-5 key decision makers (CEO, VP Sales, CTO), save company profile and contacts, then draft a personalized outreach email to the primary contact.",
+        "company_profile": f"Research {company_name} and create a detailed company profile including industry, size, recent news, and key business insights. Save all information to the database.",
+        "find_contacts": f"Find decision makers at {company_name} including CEO, VP of Sales, CTO, and other executives. Save their contact information with names, titles, and any available LinkedIn profiles.",
+        "draft_email": f"Research {company_name}, understand their business challenges, and draft a personalized B2B sales outreach email that addresses their specific pain points.",
+        "competitive_intel": f"Research {company_name} and gather competitive intelligence including their products, market position, recent news, funding, and potential pain points we could address."
+    }
+    task = task_templates.get(task_type, task_templates["full_research"])
     provider = os.getenv('HF_PROVIDER', 'nscale')
     model = os.getenv('HF_MODEL', 'Qwen/Qwen3-4B-Instruct-2507')
+    # User-friendly output
+    output = f"""
+## 🔍 Researching: {company_name}
+**Task:** {get_task_label(task_type)}
+---
+### ⏳ Progress
+"""
+    yield output
+    progress(0.1, desc="Starting research...")
+    try:
         agent = AutonomousMCPAgentHF(
             mcp_registry=mcp_registry,
             hf_token=hf_token,
             model=model
         )
+        output += "✅ AI Agent initialized\n\n"
+        yield output
+        progress(0.2, desc="Agent ready...")
     except Exception as e:
+        yield format_error(f"Could not start AI agent. Please try again later.")
         return
+    # Track results for summary
+    results = {
+        "company_saved": False,
+        "contacts_found": 0,
+        "facts_gathered": 0,
+        "email_drafted": False,
+        "steps_completed": []
+    }
     try:
+        iteration = 0
         async for event in agent.run(task, max_iterations=15):
             event_type = event.get("type")
+            iteration += 1
+            progress_pct = min(0.2 + (iteration * 0.05), 0.9)
+            if event_type == "tool_call":
+                tool = event.get("tool", "")
                 tool_input = event.get("input", {})
+                # User-friendly tool descriptions
+                step_desc = get_friendly_step(tool, tool_input, company_name)
+                if step_desc:
+                    output += f"🔄 {step_desc}\n"
+                    results["steps_completed"].append(step_desc)
+                    yield output
+                    progress(progress_pct, desc=step_desc[:50])
             elif event_type == "tool_result":
+                tool = event.get("tool", "")
                 result = event.get("result", {})
+                # Track results
+                if tool == "save_company":
+                    results["company_saved"] = True
+                    output += "   ✅ Company profile saved\n"
+                elif tool == "save_contact":
+                    results["contacts_found"] += 1
+                    output += f"   ✅ Contact #{results['contacts_found']} saved\n"
+                elif tool == "save_fact":
+                    results["facts_gathered"] += 1
+                elif tool == "save_prospect":
+                    output += "   ✅ Prospect record created\n"
+                elif tool in ["search_web", "search_news"]:
+                    count = result.get("count", 0) if isinstance(result, dict) else 0
+                    output += f"   ✅ Found {count} results\n"
+                elif tool == "send_email":
+                    results["email_drafted"] = True
+                    output += "   ✅ Email drafted\n"
+                yield output
+            elif event_type == "tool_error":
+                # Don't show errors to users, just continue
+                pass
             elif event_type == "agent_complete":
                 final_answer = event.get("final_answer", "")
+                # Format final summary
+                output += "\n---\n\n"
+                output += "## ✅ Research Complete!\n\n"
+                output += format_results_summary(results, company_name)
+                output += "\n### 📋 Detailed Findings\n\n"
+                output += final_answer
+                yield output
+                progress(1.0, desc="Complete!")
             elif event_type == "agent_error":
+                output += f"\n⚠️ Encountered an issue, but partial results may be available.\n"
+                yield output
             elif event_type == "agent_max_iterations":
+                output += "\n---\n\n"
+                output += "## ⏱️ Research Summary\n\n"
+                output += format_results_summary(results, company_name)
+                output += "\n*Research time limit reached. Results above are partial.*\n"
+                yield output
     except Exception as e:
+        output += f"\n\n⚠️ Research interrupted. Partial results may be available above.\n"
+        yield output
+def get_task_label(task_type: str) -> str:
+    """Get user-friendly task label."""
+    labels = {
+        "full_research": "Complete prospect research with contacts and email",
+        "company_profile": "Company profile and insights",
+        "find_contacts": "Find decision makers",
+        "draft_email": "Draft personalized outreach email",
+        "competitive_intel": "Competitive intelligence gathering"
+    }
+    return labels.get(task_type, "Research task")
+def get_friendly_step(tool: str, tool_input: dict, company: str) -> str:
+    """Convert technical tool names to user-friendly descriptions."""
+    friendly = {
+        "search_web": f"Searching for {company} information...",
+        "search_news": f"Finding recent news about {company}...",
+        "save_company": f"Saving {company} company profile...",
+        "save_prospect": f"Creating prospect record for {company}...",
+        "save_contact": f"Saving contact: {tool_input.get('name', 'decision maker')}...",
+        "save_fact": "Recording business insight...",
+        "get_company": f"Retrieving {company} data...",
+        "get_prospect": "Loading prospect information...",
+        "list_prospects": "Checking existing prospects...",
+        "send_email": "Drafting outreach email...",
+        "get_thread": "Loading email thread...",
+        "suggest_slots": "Finding available meeting times...",
+        "generate_ics": "Creating calendar invite..."
+    }
+    return friendly.get(tool, "")
+def format_results_summary(results: dict, company: str) -> str:
+    """Format a user-friendly results summary."""
+    summary = f"### 📊 Results for {company}\n\n"
+    summary += "| Metric | Status |\n"
+    summary += "|--------|--------|\n"
+    summary += f"| Company Profile | {'✅ Saved' if results['company_saved'] else '⏳ Pending'} |\n"
+    summary += f"| Contacts Found | {results['contacts_found']} decision makers |\n"
+    summary += f"| Business Insights | {results['facts_gathered']} facts gathered |\n"
+    summary += f"| Outreach Email | {'✅ Drafted' if results['email_drafted'] else '⏳ Pending'} |\n\n"
+    return summary
+def format_error(message: str) -> str:
+    """Format user-friendly error message."""
+    return f"""
+## ⚠️ Unable to Complete Request
+{message}
+**Need help?** Try:
+- Checking your internet connection
+- Using a different company name
+- Refreshing the page
+If the problem persists, please try again in a few minutes.
+"""
+# ============================================================================
+# GRADIO UI - ENTERPRISE DESIGN
+# ============================================================================
+def create_enterprise_ui():
+    """Create enterprise-grade Gradio interface."""
     with gr.Blocks(
+        title="CX AI Agent - B2B Sales Intelligence",
+        theme=gr.themes.Soft(
+            primary_hue="blue",
+            secondary_hue="slate",
+            neutral_hue="slate",
+            font=gr.themes.GoogleFont("Inter")
+        ),
+        css=ENTERPRISE_CSS
     ) as demo:
+        # ===== HEADER =====
+        gr.HTML("""
+        <div class="main-header">
+            <h1>🚀 CX AI Agent</h1>
+            <p>Enterprise B2B Sales Intelligence Platform — AI-Powered Prospect Research & Outreach</p>
+        </div>
         """)
+        # ===== MAIN TABS =====
+        with gr.Tabs() as tabs:
+            # ===== TAB 1: DASHBOARD =====
+            with gr.Tab("📊 Dashboard", id="dashboard"):
+                gr.HTML("""
+                <div style="padding: 20px 0;">
+                    <h2 style="margin: 0 0 20px 0; color: #181818;">Welcome to Your Sales Command Center</h2>
+                </div>
                 """)
+                # Quick Stats Row
+                with gr.Row():
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="stat-card">
+                            <div class="stat-value">—</div>
+                            <div class="stat-label">Prospects Today</div>
+                        </div>
+                        """)
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="stat-card" style="border-left-color: #2E844A;">
+                            <div class="stat-value">—</div>
+                            <div class="stat-label">Emails Drafted</div>
+                        </div>
+                        """)
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="stat-card" style="border-left-color: #DD7A01;">
+                            <div class="stat-value">—</div>
+                            <div class="stat-label">Contacts Found</div>
+                        </div>
+                        """)
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="stat-card" style="border-left-color: #9050E9;">
+                            <div class="stat-value">AI</div>
+                            <div class="stat-label">Powered By</div>
+                        </div>
+                        """)
+                gr.HTML("<div style='height: 24px;'></div>")
+                # Quick Actions
+                gr.HTML("""
+                <h3 style="margin: 0 0 16px 0; color: #181818; font-size: 18px;">⚡ Quick Actions</h3>
+                """)
+                with gr.Row():
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="quick-action" onclick="document.querySelector('[data-testid=tab-research]')?.click()">
+                            <div class="quick-action-icon">🔍</div>
+                            <div class="quick-action-title">Research Company</div>
+                            <div class="quick-action-desc">Deep-dive into any prospect</div>
+                        </div>
+                        """)
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="quick-action">
+                            <div class="quick-action-icon">👥</div>
+                            <div class="quick-action-title">Find Contacts</div>
+                            <div class="quick-action-desc">Discover decision makers</div>
+                        </div>
+                        """)
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="quick-action">
+                            <div class="quick-action-icon">✉️</div>
+                            <div class="quick-action-title">Draft Email</div>
+                            <div class="quick-action-desc">AI-written outreach</div>
+                        </div>
+                        """)
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="quick-action">
+                            <div class="quick-action-icon">📈</div>
+                            <div class="quick-action-title">View Pipeline</div>
+                            <div class="quick-action-desc">Track all prospects</div>
+                        </div>
+                        """)
+                gr.HTML("<div style='height: 24px;'></div>")
+                # Getting Started
+                gr.HTML("""
+                <div class="action-card">
+                    <h3>🎯 Getting Started</h3>
+                    <p>CX AI Agent helps your sales team research prospects, find decision makers, and draft personalized outreach emails — all powered by AI.</p>
+                    <ol style="color: #706E6B; margin: 0; padding-left: 20px;">
+                        <li style="margin-bottom: 8px;"><strong>Research a Company</strong> — Enter any company name to gather intelligence</li>
+                        <li style="margin-bottom: 8px;"><strong>Find Decision Makers</strong> — AI identifies key contacts (CEO, VP Sales, etc.)</li>
+                        <li style="margin-bottom: 8px;"><strong>Draft Personalized Email</strong> — Get AI-written outreach based on research</li>
+                        <li><strong>Export & Send</strong> — Use the generated content in your sales workflow</li>
+                    </ol>
+                </div>
+                """)
+            # ===== TAB 2: RESEARCH =====
+            with gr.Tab("🔍 Research", id="research"):
+                gr.HTML("""
+                <div style="padding: 20px 0 10px 0;">
+                    <h2 style="margin: 0 0 8px 0; color: #181818;">Prospect Research</h2>
+                    <p style="margin: 0; color: #706E6B;">Enter a company name to start AI-powered research</p>
+                </div>
+                """)
+                with gr.Row():
+                    # Left Panel - Input
+                    with gr.Column(scale=1):
+                        gr.HTML("""
+                        <div class="action-card">
+                            <h3>🏢 Company Information</h3>
+                        """)
+                        company_input = gr.Textbox(
+                            label="Company Name",
+                            placeholder="e.g., Salesforce, HubSpot, Stripe...",
+                            lines=1,
+                            max_lines=1,
+                            elem_classes=["input-field"]
+                        )
+                        task_type = gr.Radio(
+                            label="What would you like to do?",
+                            choices=[
+                                ("🔍 Full Research (Recommended)", "full_research"),
+                                ("🏢 Company Profile Only", "company_profile"),
+                                ("👥 Find Decision Makers", "find_contacts"),
+                                ("✉️ Draft Outreach Email", "draft_email"),
+                                ("📊 Competitive Intelligence", "competitive_intel")
+                            ],
+                            value="full_research"
+                        )
+                        gr.HTML("<div style='height: 16px;'></div>")
+                        research_btn = gr.Button(
+                            "🚀 Start Research",
+                            variant="primary",
+                            size="lg",
+                            elem_classes=["primary-btn"]
+                        )
+                        gr.HTML("</div>")  # Close action-card
+                        # Popular Companies
+                        gr.HTML("""
+                        <div class="action-card" style="margin-top: 16px;">
+                            <h3>💡 Popular Companies</h3>
+                            <p>Click to quick-fill:</p>
+                        </div>
+                        """)
+                        with gr.Row():
+                            ex1 = gr.Button("Salesforce", size="sm", variant="secondary")
+                            ex2 = gr.Button("HubSpot", size="sm", variant="secondary")
+                            ex3 = gr.Button("Stripe", size="sm", variant="secondary")
+                        with gr.Row():
+                            ex4 = gr.Button("Shopify", size="sm", variant="secondary")
+                            ex5 = gr.Button("Zendesk", size="sm", variant="secondary")
+                            ex6 = gr.Button("Slack", size="sm", variant="secondary")
+                        # Quick fill handlers
+                        ex1.click(lambda: "Salesforce", outputs=company_input)
+                        ex2.click(lambda: "HubSpot", outputs=company_input)
+                        ex3.click(lambda: "Stripe", outputs=company_input)
+                        ex4.click(lambda: "Shopify", outputs=company_input)
+                        ex5.click(lambda: "Zendesk", outputs=company_input)
+                        ex6.click(lambda: "Slack", outputs=company_input)
+                    # Right Panel - Results
+                    with gr.Column(scale=2):
+                        gr.HTML("""
+                        <div class="results-panel">
+                            <h3>📋 Research Results</h3>
+                        """)
+                        research_output = gr.Markdown(
+                            value="*Enter a company name and click 'Start Research' to begin.*",
+                            elem_classes=["results-content"]
+                        )
+                        gr.HTML("</div>")
+                # Connect button to function
+                research_btn.click(
+                    fn=run_sales_agent,
+                    inputs=[company_input, task_type],
+                    outputs=[research_output]
                 )
+            # ===== TAB 3: PROSPECTS =====
+            with gr.Tab("👥 Prospects", id="prospects"):
+                gr.HTML("""
+                <div style="padding: 20px 0 10px 0;">
+                    <h2 style="margin: 0 0 8px 0; color: #181818;">Prospect Pipeline</h2>
+                    <p style="margin: 0; color: #706E6B;">View and manage your researched prospects</p>
+                </div>
+                """)
+                gr.HTML("""
+                <div class="action-card">
+                    <h3>📋 Your Prospects</h3>
+                    <p>Prospects you research will appear here. Start by researching a company in the Research tab.</p>
+                    <div style="text-align: center; padding: 40px 20px; color: #706E6B;">
+                        <div style="font-size: 48px; margin-bottom: 16px;">📁</div>
+                        <div style="font-size: 16px; margin-bottom: 8px;">No prospects yet</div>
+                        <div style="font-size: 14px;">Research your first company to get started</div>
+                    </div>
+                </div>
+                """)
+            # ===== TAB 4: EMAILS =====
+            with gr.Tab("✉️ Emails", id="emails"):
+                gr.HTML("""
+                <div style="padding: 20px 0 10px 0;">
+                    <h2 style="margin: 0 0 8px 0; color: #181818;">Email Drafts</h2>
+                    <p style="margin: 0; color: #706E6B;">AI-generated outreach emails ready for review</p>
+                </div>
+                """)
+                gr.HTML("""
+                <div class="action-card">
+                    <h3>📧 Drafted Emails</h3>
+                    <p>When you research prospects with the "Draft Email" option, your AI-generated emails will appear here.</p>
+                    <div style="text-align: center; padding: 40px 20px; color: #706E6B;">
+                        <div style="font-size: 48px; margin-bottom: 16px;">✉️</div>
+                        <div style="font-size: 16px; margin-bottom: 8px;">No emails drafted yet</div>
+                        <div style="font-size: 14px;">Research a company with email drafting to get started</div>
+                    </div>
+                </div>
+                """)
+            # ===== TAB 5: HELP =====
+            with gr.Tab("❓ Help", id="help"):
+                gr.HTML("""
+                <div style="padding: 20px 0 10px 0;">
+                    <h2 style="margin: 0 0 8px 0; color: #181818;">Help & Documentation</h2>
+                    <p style="margin: 0; color: #706E6B;">Learn how to use CX AI Agent effectively</p>
+                </div>
+                """)
+                with gr.Row():
+                    with gr.Column():
+                        gr.HTML("""
+                        <div class="action-card">
+                            <h3>🎯 What is CX AI Agent?</h3>
+                            <p>CX AI Agent is an AI-powered B2B sales intelligence platform that helps your team:</p>
+                            <ul style="color: #706E6B; margin: 16px 0; padding-left: 20px;">
+                                <li style="margin-bottom: 8px;"><strong>Research Companies</strong> — Automatically gather company information, news, and insights</li>
+                                <li style="margin-bottom: 8px;"><strong>Find Decision Makers</strong> — Identify CEOs, VPs, and other key contacts</li>
+                                <li style="margin-bottom: 8px;"><strong>Draft Personalized Emails</strong> — Generate outreach that addresses specific pain points</li>
+                                <li><strong>Save Time</strong> — What takes hours manually is done in minutes</li>
+                            </ul>
+                        </div>
+                        <div class="action-card">
+                            <h3>🚀 How to Research a Company</h3>
+                            <ol style="color: #706E6B; margin: 16px 0; padding-left: 20px;">
+                                <li style="margin-bottom: 8px;">Go to the <strong>Research</strong> tab</li>
+                                <li style="margin-bottom: 8px;">Enter a company name (e.g., "Salesforce")</li>
+                                <li style="margin-bottom: 8px;">Select what you want to do (Full Research is recommended)</li>
+                                <li style="margin-bottom: 8px;">Click <strong>Start Research</strong></li>
+                                <li>Wait 1-2 minutes for AI to complete the research</li>
+                            </ol>
+                        </div>
+                        """)
+                    with gr.Column():
+                        gr.HTML("""
+                        <div class="action-card">
+                            <h3>💡 Tips for Best Results</h3>
+                            <ul style="color: #706E6B; margin: 16px 0; padding-left: 20px;">
+                                <li style="margin-bottom: 8px;"><strong>Use official company names</strong> — "Salesforce" works better than "SF"</li>
+                                <li style="margin-bottom: 8px;"><strong>Start with Full Research</strong> — Gets you the most comprehensive results</li>
+                                <li style="margin-bottom: 8px;"><strong>Be patient</strong> — AI research takes 1-2 minutes to complete</li>
+                                <li><strong>Review AI outputs</strong> — Always verify before sending emails</li>
+                            </ul>
+                        </div>
+                        <div class="action-card">
+                            <h3>❓ Frequently Asked Questions</h3>
+                            <details style="margin-bottom: 12px;">
+                                <summary style="cursor: pointer; font-weight: 600; color: #181818;">How accurate is the research?</summary>
+                                <p style="margin: 8px 0 0 0; color: #706E6B;">AI searches the web in real-time for current information. However, always verify critical details before using in outreach.</p>
+                            </details>
+                            <details style="margin-bottom: 12px;">
+                                <summary style="cursor: pointer; font-weight: 600; color: #181818;">How long does research take?</summary>
+                                <p style="margin: 8px 0 0 0; color: #706E6B;">Most research completes in 1-2 minutes depending on complexity.</p>
+                            </details>
+                            <details style="margin-bottom: 12px;">
+                                <summary style="cursor: pointer; font-weight: 600; color: #181818;">Can I research multiple companies?</summary>
+                                <p style="margin: 8px 0 0 0; color: #706E6B;">Currently, research one company at a time for best results.</p>
+                            </details>
+                            <details>
+                                <summary style="cursor: pointer; font-weight: 600; color: #181818;">Is my data secure?</summary>
+                                <p style="margin: 8px 0 0 0; color: #706E6B;">Yes, all data is processed securely and not shared with third parties.</p>
+                            </details>
+                        </div>
+                        """)
+        # ===== FOOTER =====
+        gr.HTML("""
+        <div style="text-align: center; padding: 24px; color: #706E6B; border-top: 1px solid #E5E5E5; margin-top: 24px;">
+            <p style="margin: 0 0 8px 0; font-size: 14px;">CX AI Agent — Enterprise B2B Sales Intelligence</p>
+            <p style="margin: 0; font-size: 12px;">Powered by AI • Built for Sales Teams</p>
+        </div>
         """)
     return demo
 if __name__ == "__main__":
+    demo = create_enterprise_ui()
     demo.launch(
         server_name="0.0.0.0",
         server_port=7860,
         show_error=True,
+        share=False
     )