{% extends 'layouts/base.html' %}
{% load price_tags %}

{% block title %}{{ food.name }}{% endblock %}

{% block content %}
<div class="card shadow-sm border-0">
    <div class="row g-0">
        <div class="col-md-5">
            {% if food.image %}
                <img src="{{ food.image.url }}" class="img-fluid rounded-start w-100" alt="{{ food.name }}" style="height: 100%; min-height: 320px; object-fit: cover;">
            {% endif %}
        </div>

        <div class="col-md-7">
            <div class="card-body p-4 h-100 d-flex flex-column">
                <div class="mb-2">
                    <span class="badge bg-secondary">{{ food.category.name }}</span>
                </div>

                <h1 class="h4 mb-3">{{ food.name }}</h1>

                {% if food.short_description %}
                    <p class="text-muted">{{ food.short_description }}</p>
                {% endif %}

                {% if food.description %}
                    <p>{{ food.description }}</p>
                {% endif %}

                <div class="mt-auto">
                    <p class="fw-bold fs-5 text-success mb-4">{{ food.price|price_format }} تومان</p>

                    {% if food.is_available %}
                        {% if request.user.is_authenticated %}
                            <div class="d-flex align-items-center gap-2 flex-wrap">
                                <form method="post" action="{% url 'cart:cart-decrease' food.id %}">
                                    {% csrf_token %}
                                    <input type="hidden" name="next" value="{{ request.get_full_path }}">
                                    <button type="submit" class="btn btn-outline-secondary" {% if cart_quantity == 0 %}disabled{% endif %}>
                                        -
                                    </button>
                                </form>

                                <span class="fw-bold px-3">{{ cart_quantity }}</span>

                                <form method="post" action="{% url 'cart:cart-add' food.id %}">
                                    {% csrf_token %}
                                    <input type="hidden" name="next" value="{{ request.get_full_path }}">
                                    <button type="submit" class="btn btn-dark">
                                        +
                                    </button>
                                </form>

                                <a href="{% url 'cart:cart-detail' %}" class="btn btn-outline-primary">
                                    مشاهده سبد خرید
                                </a>
                            </div>
                        {% else %}
                            <a href="{% url 'accounts:login' %}?next={{ request.get_full_path }}" class="btn btn-dark">
                                ورود برای افزودن به سبد خرید
                            </a>
                        {% endif %}
                    {% else %}
                        <span class="badge bg-danger">ناموجود</span>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}