{% extends "base.html" %}  <!-- Assuming you have a base template -->
{% load i18n %}  <!-- Load the internationalization template tags -->

{% block content %}

  <div class="row g-3">
        <div class="col-sm-6 col-md-8">
            <h2>{% if form.instance.pk %}{{ _("Edit Opportunity") }}{% else %}{{ _("Add New Opportunity") }}{% endif %}</h2>
        </div>
        <div class="col-sm-6 col-md-8">
<form class="row g-3" method="post" class="form" novalidate>
    {% csrf_token %}
    
        <!-- Customer -->
        <div class="col-sm-6 col-md-4">
            <div class="form-floating">
                <select class="form-control" id="{{ form.customer.id_for_label }}" name="{{ form.customer.name }}">
                    {% for value, label in form.customer.field.choices %}
                        <option value="{{ value }}" {% if form.customer.value == value %}selected{% endif %}>{{ label }}</option>
                    {% endfor %}
                </select>
                <label for="{{ form.customer.id_for_label }}">{{ _("Customer") }}</label>
            </div>
            {{ form.customer.errors }}
        </div>

        <!-- Car -->
        <div class="col-sm-6 col-md-4">
            <div class="form-floating">
                <select class="form-control" id="{{ form.car.id_for_label }}" name="{{ form.car.name }}">
                    {% for value, label in form.car.field.choices %}
                        <option value="{{ value }}" {% if form.car.value == value %}selected{% endif %}>{{ label }}</option>
                    {% endfor %}
                </select>
                <label for="{{ form.car.id_for_label }}">{{ _("Car") }}</label>
            </div>
            {{ form.car.errors }}
        </div>

        <!-- Stage -->
        <div class="col-sm-6 col-md-4">
            <div class="form-floating">
                <select class="form-control" id="{{ form.stage.id_for_label }}" name="{{ form.stage.name }}">
                    {% for value, label in form.stage.field.choices %}
                        <option value="{{ value }}" {% if form.stage.value == value %}selected{% endif %}>{{ label }}</option>
                    {% endfor %}
                </select>
                <label for="{{ form.stage.id_for_label }}">{{ _("Stage") }}</label>
            </div>
            {{ form.stage.errors }}
        </div>

        <!-- Probability -->
        <div class="col-sm-6 col-md-4">
            <div class="form-floating">
                <input type="number" class="form-control" id="{{ form.probability.id_for_label }}" name="{{ form.probability.name }}" value="{{ form.probability.value|default:'' }}" placeholder="{{ _('Enter probability') }}">
                <label for="{{ form.probability.id_for_label }}">{{ _("Probability") }}</label>
            </div>
            {{ form.probability.errors }}
        </div>

        <!-- Staff -->
        <div class="col-sm-6 col-md-4">
            <div class="form-floating">
                <select class="form-control" id="{{ form.staff.id_for_label }}" name="{{ form.staff.name }}">
                    {% for value, label in form.staff.field.choices %}
                        <option value="{{ value }}" {% if form.staff.value == value %}selected{% endif %}>{{ label }}</option>
                    {% endfor %}
                </select>
                <label for="{{ form.staff.id_for_label }}">{{ _("Staff") }}</label>
            </div>
            {{ form.staff.errors }}
        </div>

        <!-- closing date-->
        <div class="col-sm-6 col-md-4">
            <div class="form-floating">
                        <input type="date" class="form-control" id="{{ form.closing_date.id_for_label }}" name="{{ form.closing_date.name }}" value="{{ form.closing_date.value|date:'Y-m-d' }}">
                        <label for="{{ form.closing_date.id_for_label }}">{{ _("Closing Date")}}</label>
                        {{ form.closing_date.errors }}
                    </div>
            {{ form.closing_date.errors }}
        </div>

    <!-- Buttons -->
    <div class="row mt-4">
        <div class="col-sm-12">
            <button type="submit" class="btn btn-primary">{{ _("Save") }}</button>
            <a href="{% url 'opportunity_list' %}" class="btn btn-secondary">{{ _("Cancel") }}</a>
        </div>
    </div>
</form>
        </div>
  </div>
{% endblock %}