app.py

import gradio as gr
from datetime import datetime

menu_items = [
    ("Espresso", 2.50),
    ("Americano", 3.00),
    ("Latte", 4.50),
    ("Cappuccino", 4.25),
    ("Mocha", 4.75),
    ("Caramel Macchiato", 4.95),
    ("Iced Coffee", 3.50),
    ("Chai Latte", 4.25),
    ("Hot Chocolate", 3.25),
    ("Croissant", 2.75),
    ("Blueberry Muffin", 2.95),
]

cart = []

css = """
.gradio-container {
    background: #fff8f0;
}

#app-title {
    text-align: center;
    color: #5c3317;
}

.card {
    background: white;
    padding: 18px;
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.12);
}

button {
    border-radius: 10px !important;
    font-weight: bold !important;
}

.cart-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
}

.cart-table th {
    background: #f3d7bd;
    color: #2b1608;
    padding: 12px;
    font-size: 16px;
    font-weight: 900;
    text-align: left;
    border: 1px solid #2b1608;
}

.cart-table td {
    padding: 10px;
    border-bottom: 1px solid #ddd;
}


.cart-table tr:nth-child(even) {
    background: #f7eee7;
}

.total-box {
    font-size: 18px;
    font-weight: bold;
}
"""

def render_cart():
    if not cart:
        return "<p>Your cart is empty.</p>"

    html = """
    <table class='cart-table'>
        <tr>
            <th>#</th>
            <th>Item</th>
            <th>Size</th>
            <th>Milk</th>
            <th>Add-on</th>
            <th>Price</th>
        </tr>
    """

    for i, item in enumerate(cart):
        html += f"""
        <tr>
            <td>{i}</td>
            <td>{item['Item']}</td>
            <td>{item['Size']}</td>
            <td>{item['Milk']}</td>
            <td>{item['Add-on']}</td>
            <td>${item['Price']:.2f}</td>
        </tr>
        """

    html += "</table>"
    return html

def add_item(item, size, milk, addon):
    name, base_price = next(x for x in menu_items if x[0] == item)

    extra = 0
    if size == "Large":
        extra += 0.75
    if milk == "Oat Milk":
        extra += 0.50
    if milk == "Almond Milk":
        extra += 0.50
    if addon == "Extra Shot":
        extra += 0.75
    if addon == "Whipped Cream":
        extra += 0.50

    cart.append({
        "Item": name,
        "Size": size,
        "Milk": milk,
        "Add-on": addon,
        "Price": base_price + extra
    })

    return render_cart(), calculate_total()

def remove_item(index):
    try:
        index = int(index)
        if 0 <= index < len(cart):
            cart.pop(index)
    except:
        pass

    return render_cart(), calculate_total()

def clear_cart():
    cart.clear()
    return render_cart(), "", ""

def calculate_total():
    subtotal = sum(item["Price"] for item in cart)
    tax = subtotal * 0.06
    discount = subtotal * 0.05 if subtotal > 20 else 0
    total = subtotal + tax - discount

    return (
        f"Subtotal: ${subtotal:.2f}\n"
        f"Tax: ${tax:.2f}\n"
        f"Discount: ${discount:.2f}\n"
        f"Total: ${total:.2f}"
    )

def checkout():
    if not cart:
        return "Cart is empty."

    receipt = "COFFEE SHOP RECEIPT\n"
    receipt += "-" * 30 + "\n"
    receipt += f"Date: {datetime.now().strftime('%Y-%m-%d %I:%M %p')}\n\n"

    for item in cart:
        receipt += f"{item['Item']} | {item['Size']} | {item['Milk']} | {item['Add-on']} | ${item['Price']:.2f}\n"

    receipt += "\n" + calculate_total()
    receipt += "\n\nThank you!"

    cart.clear()
    return receipt

with gr.Blocks(css=css, title="Coffee Shop POS System") as demo:
    gr.Markdown("<h1 id='app-title'>☕ Coffee Shop POS System</h1>")

    with gr.Row():
        with gr.Column(elem_classes="card"):
            gr.Markdown("## Menu")
            item = gr.Dropdown([x[0] for x in menu_items], label="Menu Item", value="Latte")
            size = gr.Dropdown(["Small", "Medium", "Large"], label="Size", value="Medium")
            milk = gr.Dropdown(["Regular Milk", "Oat Milk", "Almond Milk"], label="Milk", value="Regular Milk")
            addon = gr.Dropdown(["None", "Extra Shot", "Whipped Cream"], label="Add-on", value="None")
            add_btn = gr.Button("Add to Cart", variant="primary")

        with gr.Column(elem_classes="card", scale=2):
            gr.Markdown("## Cart")
            cart_html = gr.HTML(render_cart())
            remove_index = gr.Number(label="Item Index to Remove", precision=0)
            remove_btn = gr.Button("Remove Item")
            clear_btn = gr.Button("Clear Cart")

        with gr.Column(elem_classes="card"):
            gr.Markdown("## Order Summary")
            total_box = gr.Textbox(label="Total", lines=5, elem_classes="total-box")
            total_btn = gr.Button("Calculate Total")
            checkout_btn = gr.Button("Checkout", variant="primary")
            receipt_box = gr.Textbox(label="Receipt", lines=12)

    add_btn.click(add_item, inputs=[item, size, milk, addon], outputs=[cart_html, total_box])
    remove_btn.click(remove_item, inputs=remove_index, outputs=[cart_html, total_box])
    clear_btn.click(clear_cart, outputs=[cart_html, total_box, receipt_box])
    total_btn.click(calculate_total, outputs=total_box)
    checkout_btn.click(checkout, outputs=receipt_box)

demo.launch()