import streamlit as st
from src.model_load import ask
def interfaz():

    # Configuración de la página
    st.set_page_config(
        page_title="MathQA - Asistente de Matemáticas",
        page_icon="🧮",
        layout="centered",
        initial_sidebar_state="expanded"
    )

    # Paleta de colores neutra
    primary_color = "#010001"
    secondary_color = "#E7E6E7"
    background_color = "#FBFBFA"

    # Estilos CSS
    st.markdown(
        f"""
        <style>
        .stApp {{ background-color: {background_color}; }}
        .stTextInput>div>div>input {{
            color: {primary_color};
            background-color: {secondary_color};
            border-radius: 8px;
        }}
        .stButton>button {{
            color: {primary_color};
            background-color: {secondary_color};
            border-radius: 8px;
            transition: all 0.3s;
        }}
        .history-box {{
            border-left: 4px solid {secondary_color};
            padding: 1rem;
            margin: 1rem 0;
            background-color: {secondary_color
            };
            border-radius: 8px;
        }}
        </style>
        """,
        unsafe_allow_html=True
    )

    # Inicializar historial
    if 'history' not in st.session_state:
        st.session_state.history = []

    # Variable auxiliar para gestionar el input
    if 'temp_input' not in st.session_state:
        st.session_state.temp_input = ""

    # Título de la aplicación
    st.title("🧮 MathQA - Asistente de Matemáticas")
    st.markdown("")

    # Widget de entrada con variable auxiliar
    user_input = st.text_input(
        "Escribe tu pregunta matemática aquí:",
        value=st.session_state.temp_input,
        key="user_input",
        placeholder="Ej: ¿Que es una integral?"
    )

    # Botón de acción
    col1, col2, col3 = st.columns([5, 4, 4])  # Columnas vacías a los lados para centrar
    with col2:
        if st.button("Resolver pregunta"):
            if user_input:  # Accedemos al valor ingresado
                # Simular respuesta
                mock_answer = ask(user_input,retriever)
                
                # Agregar al historial
                st.session_state.history.insert(0, (user_input, mock_answer))
                
                # Limpiar la variable auxiliar
                st.session_state.temp_input = ""
                
                # Forzar actualización
                st.rerun()

    # Mostrar historial
    if st.session_state.history:
        st.markdown("---")
        st.subheader("Historial de Consultas")
        
        for idx, (pregunta, respuesta) in enumerate(st.session_state.history):
            with st.container():
                st.markdown(
                    f"""
                    <div class="history-box">
                        <strong>Pregunta {len(st.session_state.history)-idx}:</strong>
                        <p>{pregunta}</p>
                        <strong>Respuesta:</strong>
                        <p>{respuesta}</p>
                    </div>
                    """,
                    unsafe_allow_html=True
                )

    # Pie de página
    st.markdown("---")
    st.markdown("🔍 ¿Necesitas ayuda con álgebra, cálculo o geometría? ¡Estoy aquí para ayudarte!")