# import streamlit as st
# import pickle
# import sklearn
# from sklearn.preprocessing import RobustScaler, OneHotEncoder, LabelEncoder
# from sklearn.neighbors import KNeighborsClassifier
# import pandas as pd
# import numpy as np
# import matplotlib.pyplot as plt



# # st.markdown("""
# #     <style>
# #         .stApp {
# #             background-image: url('https://huggingface.co/spaces/shubham680/DiabetesPrediction/resolve/main/bg.jpg');
# #             background-size: cover;
# #             background-repeat: no-repeat;
# #             background-attachment: fixed;
# #         }
# #         .stTitle {
# #             color: #ffffff;
# #             font-size: 36px;
# #             font-weight: bold;
# #             text-align: center;
# #         }
# #     </style>
# # """, unsafe_allow_html=True)

# st.title("Introvert/Extrovert Prediction App")



# #with st.sidebar:
#     #st.header("Patient Information")
# time_spent = st.number_input("🕒 Time Spent Alone",min_value=0,max_value=11,step=1)
# stage_fear =  st.selectbox("🎤 Stage Fear",["Yes","No"])
# social_event =  st.number_input("🎉 Social Event Attendance",min_value=0,max_value=10,step=1)
# going_outside = st.number_input("🚶‍♂️ Going Outside Frequency",min_value=0,max_value=7,step=1)
# drained =  st.selectbox("😓 Drained After Socializing",["Yes","No"])
# friends =  st.number_input("👥 Friend Circle Size",min_value=0,max_value=15,step=1)
# post_frequency =  st.number_input("📱 Post Frequency on Social Media",min_value=0,max_value=10,step=1)




# with open("rs.pkl", "rb") as f:
#     rs = pickle.load(f)

# with open("ohe_drain.pkl", "rb") as f:
#     ohe_drain = pickle.load(f)

# with open("ohe_stage.pkl", "rb") as f:
#     ohe_stage = pickle.load(f)

# with open("le.pkl", "rb") as f:
#     le = pickle.load(f)

# with open("knn.pkl", "rb") as f:
#     knn = pickle.load(f)

# stage_encoded = ohe_stage.transform([[stage_fear]])[0]  # gender encoded using one hot encoding
# drain_encoded = ohe_drain.transform([[drained]])[0]


# numeric_features = np.array([[time_spent, social_event, going_outside, friends, post_frequency]])
# scaled_features = rs.transform(numeric_features)[0]

# st.write("Scaled Features:", scaled_features)


# final_input = np.concatenate((
#     scaled_features[:1],        
#     stage_encoded,              
#     scaled_features[1:3],       
#     drain_encoded,               
#     scaled_features[3:]          
# )).reshape(1, -1)



# prediction_labels = {
#     0: "Extrovert",
#     1: "Introvert"
# }




# if st.button("🔍 Predict"):
#     prediction = knn.predict(final_input)[0]
#     result_label = prediction_labels.get(prediction, "Unknown")

#     # Styled result box
#     st.markdown(
#         f"<div class='prediction-box'><strong>Predicted Personality:</strong> {result_label}</div>",
#         unsafe_allow_html=True
#     )




import streamlit as st
import pickle
import numpy as np

# --------- CSS Styling ---------
st.markdown("""
    <style>
        .stApp {
            background: linear-gradient(to right, #c9d6ff, #e2e2e2);
            font-family: 'Segoe UI', sans-serif;
        }
        .glass-card {
            background: rgba(255, 255, 255, 0.6);
            padding: 2rem;
            border-radius: 20px;
            box-shadow: 0 8px 32px rgba(31, 38, 135, 0.37);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.18);
            margin-top: 2rem;
        }
        .title {
            font-size: 48px;
            font-weight: bold;
            text-align: center;
            background: linear-gradient(to right, #141E30, #243B55);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .predict-button button {
            background-color: #6c63ff;
            color: white;
            font-size: 18px;
            font-weight: 600;
            border-radius: 12px;
            padding: 0.6em 1.5em;
            margin-top: 1rem;
        }
        .result-box {
            animation: fadeIn 1s ease-in-out;
            background: #141E30;
            color: white;
            padding: 1.5em;
            border-radius: 15px;
            text-align: center;
            margin-top: 2rem;
            font-size: 22px;
        }
        @keyframes fadeIn {
            from {opacity: 0;}
            to {opacity: 1;}
        }
    </style>
""", unsafe_allow_html=True)

# --------- Title ---------
st.markdown("<div class='title'>🧠 Introvert vs Extrovert Personality Predictor</div>", unsafe_allow_html=True)

# --------- Input Form ---------
with st.container():
    st.markdown("<div class='glass-card'>", unsafe_allow_html=True)

    st.markdown("#### 👤 Input Your Social Behavior Details")

    col1, col2 = st.columns(2)

    with col1:
        time_spent = st.slider("🕒 Time Spent Alone", 0, 11, 5)
        stage_fear = st.radio("🎤 Stage Fear", ["Yes", "No"])
        going_outside = st.slider("🚶 Going Outside Frequency", 0, 7, 3)

    with col2:
        social_event = st.slider("🎉 Social Event Attendance", 0, 10, 5)
        drained = st.radio("😓 Drained After Socializing", ["Yes", "No"])
        friends = st.slider("👥 Friend Circle Size", 0, 15, 7)
        post_frequency = st.slider("📱 Social Media Post Frequency", 0, 10, 3)

    # --------- Load Pickles ---------
    with open("rs.pkl", "rb") as f:
        rs = pickle.load(f)
    with open("ohe_drain.pkl", "rb") as f:
        ohe_drain = pickle.load(f)
    with open("ohe_stage.pkl", "rb") as f:
        ohe_stage = pickle.load(f)
    with open("le.pkl", "rb") as f:
        le = pickle.load(f)
    with open("knn.pkl", "rb") as f:
        knn = pickle.load(f)

    # --------- Encoding & Scaling ---------
    stage_encoded = ohe_stage.transform([[stage_fear]])[0]
    drain_encoded = ohe_drain.transform([[drained]])[0]

    numeric_features = np.array([[time_spent, social_event, going_outside, friends, post_frequency]])
    scaled_features = rs.transform(numeric_features)[0]

    final_input = np.concatenate((
        scaled_features[:1],
        stage_encoded,
        scaled_features[1:3],
        drain_encoded,
        scaled_features[3:]
    )).reshape(1, -1)

    prediction_labels = {0: "🌟 Extrovert", 1: "🌙 Introvert"}

    st.markdown("</div>", unsafe_allow_html=True)  # Close glass card




        # --- Prediction Button & Result ---
    result_placeholder = st.empty()  # 👈 Reserve space near the button
    
    if st.button("🔍 Predict", key="predict", help="Click to see your personality"):
        prediction = knn.predict(final_input)[0]  # --> return 1d array further taking it as scalar value
        proba = knn.predict_proba(final_input)[0]  # --> returns 2d array containing both probablity taking as 1d array.
        

        label = prediction_labels.get(prediction, "❓ Unknown")
        confidence = proba[prediction] * 100
    
        result_html = f"""
            <div class='result-box'>
                🔮 <strong>Predicted Personality:</strong> {label}<br>
                📊 <strong>Confidence:</strong> {confidence:.2f}%
            </div>
        """
        result_placeholder.markdown(result_html, unsafe_allow_html=True)



    #     # --- Prediction Button & Result ---
    # result_placeholder = st.empty()  # 👈 Reserve space near the button
    
    # if st.button("🔍 Predict", key="predict", help="Click to see your personality"):
    #     prediction = knn.predict(final_input)[0]
    #     proba = knn.predict_proba(final_input)[0]
    #     label = prediction_labels.get(prediction, "❓ Unknown")
    
    #     result_html = f"""
    #         <div class='result-box'>
    #             🔮 <strong>Predicted Personality:</strong> {label}<br><br>
    #             📊 <strong>Probabilities:</strong><br>
    #             🌟 Extrovert: {proba[0]*100:.2f}%<br>
    #             🌙 Introvert: {proba[1]*100:.2f}%
    #         </div>
    #     """
    #     result_placeholder.markdown(result_html, unsafe_allow_html=True)





    #     # --- Prediction Button & Result ---
    # result_placeholder = st.empty()  # 👈 Reserve space near the button

    # if st.button("🔍 Predict", key="predict", help="Click to see your personality"):
    #     prediction = knn.predict(final_input)[0]
    #     label = prediction_labels.get(prediction, "❓ Unknown")

    #     result_html = f"""
    #         <div class='result-box'>
    #             🔮 <strong>Predicted Personality:</strong> {label}
    #         </div>
    #     """
    #     result_placeholder.markdown(result_html, unsafe_allow_html=True)  # 👈 result shows instantly in place