{% extends 'base.html' %}
{% block title %}Building Form{% endblock %}

{% block content %}
<div class="container mt-3">

    <div class="card shadow-lg p-4">

        <h4 class="mb-3">
            <i class="bi bi-building-add"></i>
            {% if building %}Edit Building{% else %}Add Building{% endif %}
        </h4>

        <form method="post">
            {% csrf_token %}

            <!-- ================= NAME ================= -->
            <div class="mb-3">
                <label class="form-label">Building Name</label>
                <input 
                    type="text" 
                    name="name" 
                    class="form-control"
                    value="{{ building.name|default:'' }}"
                    required
                >
            </div>

            <!-- ================= LOCATION ================= -->
            <div class="mb-3">
                <label class="form-label">Location</label>
                <input 
                    type="text" 
                    name="location" 
                    class="form-control"
                    value="{{ building.location|default:'' }}"
                    required
                >
            </div>

            <!-- ================= CARETAKER ================= -->
            <div class="mb-4">
                <label class="form-label">Assign Caretaker</label>

                <select name="caretaker" class="form-select">
                    <option value="">-- Select Caretaker --</option>

                    {% for caretaker in caretakers %}
                        <option value="{{ caretaker.id }}"
                            {% if building and building.caretaker and building.caretaker.id == caretaker.id %}
                                selected
                            {% endif %}
                        >
                            {{ caretaker.username }}
                        </option>
                    {% endfor %}
                </select>

                <small class="text-muted">
                    Optional. Caretaker will manage units and maintenance.
                </small>
            </div>

            <!-- ================= ACTION ================= -->
            <button type="submit" class="btn btn-dark w-100">
                <i class="bi bi-check-circle"></i>
                {% if building %}Update Building{% else %}Create Building{% endif %}
            </button>

        </form>

    </div>

</div>
{% endblock %}