{% extends 'admin_pages/base_admin.html' %}
{% block title %}{{ title }} | Admin Panel{% endblock %}

{% block content %}
<h2 class="mb-4">{{ title }}</h2>

{% block breadcrumbs %}
<nav aria-label="breadcrumb" class="mb-3">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="{% url 'admin_page' %}">Home</a></li>
    <li class="breadcrumb-item"><a href="{% url 'product_list' %}">Products</a></li>
    <li class="breadcrumb-item active" aria-current="page">{{ title }}</li>
  </ol>
</nav>
{% endblock %}
<form method="post" enctype="multipart/form-data">
  {% csrf_token %}
  {{ form.non_field_errors }}

  <div class="row g-4">
    <div class="col-md-6">
      <div class="mb-3">
        {{ form.name.label_tag }}
        {{ form.name }}
      </div>
    </div>

    <div class="col-md-6">
      <div class="mb-3">
        {{ form.category.label_tag }}
        {{ form.category }}
      </div>
    </div>

    <div class="col-md-6">
      <div class="mb-3">
        {{ form.price.label_tag }}
        {{ form.price }}
      </div>
    </div>

    <div class="col-md-6">
      <div class="mb-3">
        {{ form.stock.label_tag }}
        {{ form.stock }}
      </div>
    </div>

    <div class="col-md-6">
      <div class="mb-3">
        {{ form.rating.label_tag }}
        {{ form.rating }}
      </div>
    </div>

    <div class="col-md-6 d-flex align-items-center">
      <div class="form-check mt-4">
        {{ form.is_featured }}
        {{ form.is_featured.label_tag }}
      </div>
    </div>

    <div class="col-md-12">
      <div class="mb-3">
        {{ form.description.label_tag }}
        {{ form.description }}
      </div>
    </div>

    <div class="col-md-6">
      <div class="mb-3">
        {{ form.image.label_tag }}
        {{ form.image }}
      </div>
    </div>
  </div>

  <div class="mt-4">
    <button type="submit" class="btn btn-success">Save</button>
    <a href="{% url 'product_list' %}" class="btn btn-secondary">Cancel</a>
  </div>
</form>
{% endblock %}