# calculator_app.py

import streamlit as st

st.set_page_config(page_title="Interactive Calculator", page_icon="🧮", layout="centered")

st.markdown("<h1 style='text-align: center;'>🧮 Simple Calculator App</h1>", unsafe_allow_html=True)
st.markdown("<p style='text-align: center; color: gray;'>Perform basic math operations easily and quickly😉!</p>", unsafe_allow_html=True)

# --- Layout with columns and containers ---
with st.container():
    col1, col2 = st.columns(2)
    
    with col1:
        num1 = st.number_input("🔢 Enter First Number", value=0.0, step=1.0)
    with col2:
        num2 = st.number_input("🔢 Enter Second Number", value=0.0, step=1.0)

with st.container():
    operation = st.radio(
        "🧩 Choose Operation",
        options=["➕ Addition", "➖ Subtraction", "✖️ Multiplication", "➗ Division"],
        horizontal=True
    )

# --- Perform calculation ---
st.markdown("---")
if st.button("🎯 Calculate"):
    st.subheader("📄 Result Details:")
    if operation == "➕ Addition":
        result = num1 + num2
        st.success(f"✅ {num1} + {num2} = {result}")
    elif operation == "➖ Subtraction":
        result = num1 - num2
        st.success(f"✅ {num1} - {num2} = {result}")
    elif operation == "✖️ Multiplication":
        result = num1 * num2
        st.success(f"✅ {num1} × {num2} = {result}")
    elif operation == "➗ Division":
        if num2 == 0:
            st.error("❌ Cannot divide by zero!")
        else:
            result = num1 / num2
            st.success(f"✅ {num1} ÷ {num2} = {result}")
else:
    st.info("Please enter values and select an operation, then press 'Calculate'.🤗")

# Footer
st.markdown("---")
st.markdown("<p style='text-align: center; font-size: 12px; color: gray;'>Build by ALISHBA😏</p>", unsafe_allow_html=True)