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

{% block title %}{{ page_title }}{% endblock %}

{% block content %}
<div class="card shadow-sm">
    <div class="card-body p-4">
        <h1 class="h4 mb-4">{{ page_title }}</h1>

        <form method="post" enctype="multipart/form-data" novalidate>
            {% csrf_token %}

            {% if form.non_field_errors %}
                <div class="alert alert-danger">{{ form.non_field_errors }}</div>
            {% endif %}

            <div class="row">
                <div class="col-md-6 mb-3">
                    <label class="form-label">{{ form.category.label }}</label>
                    {{ form.category }}
                    {% for error in form.category.errors %}
                        <div class="text-danger small mt-1">{{ error }}</div>
                    {% endfor %}
                </div>

                <div class="col-md-6 mb-3">
                    <label class="form-label">{{ form.name.label }}</label>
                    {{ form.name }}
                    {% for error in form.name.errors %}
                        <div class="text-danger small mt-1">{{ error }}</div>
                    {% endfor %}
                </div>

                <div class="col-12 mb-3">
                    <label class="form-label">{{ form.short_description.label }}</label>
                    {{ form.short_description }}
                    {% for error in form.short_description.errors %}
                        <div class="text-danger small mt-1">{{ error }}</div>
                    {% endfor %}
                </div>

                <div class="col-12 mb-3">
                    <label class="form-label">{{ form.description.label }}</label>
                    {{ form.description }}
                    {% for error in form.description.errors %}
                        <div class="text-danger small mt-1">{{ error }}</div>
                    {% endfor %}
                </div>

                <div class="col-md-6 mb-3">
                    <label class="form-label">{{ form.price.label }}</label>
                    {{ form.price }}
                    {% for error in form.price.errors %}
                        <div class="text-danger small mt-1">{{ error }}</div>
                    {% endfor %}
                </div>

                <div class="col-md-6 mb-3">
                    <label class="form-label">{{ form.image.label }}</label>
                    {{ form.image }}
                    {% for error in form.image.errors %}
                        <div class="text-danger small mt-1">{{ error }}</div>
                    {% endfor %}
                </div>

                <div class="col-md-6 mb-3">
                    <div class="form-check">
                        {{ form.is_available }}
                        <label class="form-check-label">{{ form.is_available.label }}</label>
                    </div>
                </div>

                <div class="col-md-6 mb-3">
                    <div class="form-check">
                        {{ form.is_active }}
                        <label class="form-check-label">{{ form.is_active.label }}</label>
                    </div>
                </div>
            </div>

            <button type="submit" class="btn btn-dark">ذخیره</button>
            <a href="{% url 'menu:dashboard-food-list' %}" class="btn btn-outline-secondary">بازگشت</a>
        </form>
    </div>
</div>
{% endblock %}