{% extends "base.html" %}
{% load static i18n %}

{% block title %}{% translate "Modifier le bâtiment" %} {{ building.code }} | StreetUp{% endblock %}

{% block content %}
<div class="container py-4">
    <!-- Breadcrumb & Title -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb mb-1">
                    <li class="breadcrumb-item"><a href="{% url 'assets:buildings_index' %}">{% translate "Bâtiments publics" %}</a></li>
                    <li class="breadcrumb-item"><a href="{% url 'assets:publicbuilding_detail' building.pk %}">{{ building.code }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page">{% translate "Modifier" %}</li>
                </ol>
            </nav>
            <h1 class="h3 mb-0">
                <i class="bi bi-pencil-square text-primary me-2"></i>{% translate "Modifier le bâtiment" %} {{ building.code }}
            </h1>
        </div>
        <div>
            <a href="{% url 'assets:publicbuilding_detail' building.pk %}" class="btn btn-outline-secondary">
                <i class="bi bi-arrow-left me-1"></i>{% translate "Annuler" %}
            </a>
        </div>
    </div>

    <form method="post" action="" class="needs-validation" novalidate>
        {% csrf_token %}

        {% if form.errors %}
            <div class="alert alert-danger alert-dismissible fade show mb-4" role="alert">
                <i class="bi bi-exclamation-triangle-fill me-2"></i>
                <strong>{% translate "Certains champs contiennent des erreurs." %}</strong> {% translate "Veuillez vérifier les informations ci-dessous." %}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        {% endif %}

        <!-- Card 1: Identités & Localisation -->
        <div class="card shadow-sm mb-4">
            <div class="card-header bg-light fw-bold">
                <i class="bi bi-info-circle me-2"></i>{% translate "Informations générales" %}
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-4">
                        <label for="{{ form.code.id_for_label }}" class="form-label fw-semibold">{% translate "Code du bâtiment" %} <span class="text-danger">*</span></label>
                        {{ form.code }}
                        {% if form.code.errors %}<div class="text-danger small mt-1">{{ form.code.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.name_fr.id_for_label }}" class="form-label fw-semibold">{% translate "Nom (FR)" %}</label>
                        {{ form.name_fr }}
                        {% if form.name_fr.errors %}<div class="text-danger small mt-1">{{ form.name_fr.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.name_nl.id_for_label }}" class="form-label fw-semibold">{% translate "Nom (NL)" %}</label>
                        {{ form.name_nl }}
                        {% if form.name_nl.errors %}<div class="text-danger small mt-1">{{ form.name_nl.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-12">
                        <label for="{{ form.address.id_for_label }}" class="form-label fw-semibold">{% translate "Adresse complète" %}</label>
                        {{ form.address }}
                        {% if form.address.errors %}<div class="text-danger small mt-1">{{ form.address.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-12">
                        <label for="{{ form.description.id_for_label }}" class="form-label fw-semibold">{% translate "Description" %}</label>
                        {{ form.description }}
                        {% if form.description.errors %}<div class="text-danger small mt-1">{{ form.description.errors.0 }}</div>{% endif %}
                    </div>
                </div>
            </div>
        </div>

        <!-- Card 2: Propriété & Gestion -->
        <div class="card shadow-sm mb-4">
            <div class="card-header bg-light fw-bold">
                <i class="bi bi-person-badge me-2"></i>{% translate "Propriété & Gestion" %}
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-4">
                        <label for="{{ form.owner.id_for_label }}" class="form-label fw-semibold">{% translate "Propriétaire" %}</label>
                        {{ form.owner }}
                        {% if form.owner.errors %}<div class="text-danger small mt-1">{{ form.owner.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.manager.id_for_label }}" class="form-label fw-semibold">{% translate "Gestionnaire référent" %}</label>
                        {{ form.manager }}
                        {% if form.manager.errors %}<div class="text-danger small mt-1">{{ form.manager.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.occupant_entity.id_for_label }}" class="form-label fw-semibold">{% translate "Direction / Service occupant" %}</label>
                        {{ form.occupant_entity }}
                        {% if form.occupant_entity.errors %}<div class="text-danger small mt-1">{{ form.occupant_entity.errors.0 }}</div>{% endif %}
                    </div>
                </div>
            </div>
        </div>

        <!-- Card 3: Usage & Caractéristiques physiques -->
        <div class="card shadow-sm mb-4">
            <div class="card-header bg-light fw-bold">
                <i class="bi bi-building-gear me-2"></i>{% translate "Usage & Caractéristiques physiques" %}
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label for="{{ form.usage_type.id_for_label }}" class="form-label fw-semibold">{% translate "Type d'usage principal" %}</label>
                        {{ form.usage_type }}
                        {% if form.usage_type.errors %}<div class="text-danger small mt-1">{{ form.usage_type.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-6">
                        <label for="{{ form.building_status.id_for_label }}" class="form-label fw-semibold">{% translate "Statut d'occupation" %}</label>
                        {{ form.building_status }}
                        {% if form.building_status.errors %}<div class="text-danger small mt-1">{{ form.building_status.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.construction_year.id_for_label }}" class="form-label fw-semibold">{% translate "Année de construction" %}</label>
                        {{ form.construction_year }}
                        {% if form.construction_year.errors %}<div class="text-danger small mt-1">{{ form.construction_year.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.floors_count.id_for_label }}" class="form-label fw-semibold">{% translate "Nombre d'étages hors-sol" %}</label>
                        {{ form.floors_count }}
                        {% if form.floors_count.errors %}<div class="text-danger small mt-1">{{ form.floors_count.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.basement_count.id_for_label }}" class="form-label fw-semibold">{% translate "Nombre de niveaux en sous-sol" %}</label>
                        {{ form.basement_count }}
                        {% if form.basement_count.errors %}<div class="text-danger small mt-1">{{ form.basement_count.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-6">
                        <label for="{{ form.total_surface_m2.id_for_label }}" class="form-label fw-semibold">{% translate "Surface brute totale (m²)" %}</label>
                        {{ form.total_surface_m2 }}
                        {% if form.total_surface_m2.errors %}<div class="text-danger small mt-1">{{ form.total_surface_m2.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-6">
                        <label for="{{ form.usable_surface_m2.id_for_label }}" class="form-label fw-semibold">{% translate "Surface utile (m²)" %}</label>
                        {{ form.usable_surface_m2 }}
                        {% if form.usable_surface_m2.errors %}<div class="text-danger small mt-1">{{ form.usable_surface_m2.errors.0 }}</div>{% endif %}
                    </div>
                </div>
            </div>
        </div>

        <!-- Card 4: Réglementation & Accueil du Public (ERP / PMR) -->
        <div class="card shadow-sm mb-4">
            <div class="card-header bg-light fw-bold">
                <i class="bi bi-shield-check me-2"></i>{% translate "Accueil & Sécurité du Public (ERP / PMR)" %}
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6 d-flex align-items-center">
                        <div class="form-check mt-3">
                            {{ form.is_erp }}
                            <label for="{{ form.is_erp.id_for_label }}" class="form-check-label fw-semibold">
                                {% translate "Bâtiment recevant du public (ERP / PMR)" %}
                            </label>
                        </div>
                    </div>
                    <div class="col-md-6 d-flex align-items-center">
                        <div class="form-check mt-3">
                            {{ form.pmr_accessible }}
                            <label for="{{ form.pmr_accessible.id_for_label }}" class="form-check-label fw-semibold">
                                {% translate "Accessible PMR" %}
                            </label>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.erp_category.id_for_label }}" class="form-label fw-semibold">{% translate "Catégorie d'accueil / ERP" %}</label>
                        {{ form.erp_category }}
                        {% if form.erp_category.errors %}<div class="text-danger small mt-1">{{ form.erp_category.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.erp_type.id_for_label }}" class="form-label fw-semibold">{% translate "Type d'établissement / ERP" %}</label>
                        {{ form.erp_type }}
                        {% if form.erp_type.errors %}<div class="text-danger small mt-1">{{ form.erp_type.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-4">
                        <label for="{{ form.max_capacity.id_for_label }}" class="form-label fw-semibold">{% translate "Jauge maximale d'accueil du public" %}</label>
                        {{ form.max_capacity }}
                        {% if form.max_capacity.errors %}<div class="text-danger small mt-1">{{ form.max_capacity.errors.0 }}</div>{% endif %}
                    </div>
                </div>
            </div>
        </div>

        <!-- Card 5: Diagnostics & Énergie -->
        <div class="card shadow-sm mb-4">
            <div class="card-header bg-light fw-bold">
                <i class="bi bi-lightning-charge me-2"></i>{% translate "Diagnostics & Énergie" %}
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label for="{{ form.dpe_rating.id_for_label }}" class="form-label fw-semibold">{% translate "Performance Énergétique (PEB / DPE / EPC)" %}</label>
                        {{ form.dpe_rating }}
                        {% if form.dpe_rating.errors %}<div class="text-danger small mt-1">{{ form.dpe_rating.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-6">
                        <label for="{{ form.ges_rating.id_for_label }}" class="form-label fw-semibold">{% translate "Émissions de Carbone & GES" %}</label>
                        {{ form.ges_rating }}
                        {% if form.ges_rating.errors %}<div class="text-danger small mt-1">{{ form.ges_rating.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-6 d-flex align-items-center">
                        <div class="form-check mt-2">
                            {{ form.has_asbestos_diag }}
                            <label for="{{ form.has_asbestos_diag.id_for_label }}" class="form-check-label fw-semibold">
                                {% translate "Diagnostic Amiante réalisé" %}
                            </label>
                        </div>
                    </div>
                    <div class="col-md-6 d-flex align-items-center">
                        <div class="form-check mt-2">
                            {{ form.has_lead_diag }}
                            <label for="{{ form.has_lead_diag.id_for_label }}" class="form-check-label fw-semibold">
                                {% translate "Diagnostic Plomb réalisé" %}
                            </label>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Card 6: Géolocalisation (Coordonnées) -->
        <div class="card shadow-sm mb-4">
            <div class="card-header bg-light fw-bold">
                <i class="bi bi-geo-alt me-2"></i>{% translate "Coordonnées géographiques (GPS WGS84)" %}
            </div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-6">
                        <label for="{{ form.lat.id_for_label }}" class="form-label fw-semibold">{% translate "Latitude" %}</label>
                        {{ form.lat }}
                        {% if form.lat.errors %}<div class="text-danger small mt-1">{{ form.lat.errors.0 }}</div>{% endif %}
                    </div>
                    <div class="col-md-6">
                        <label for="{{ form.lon.id_for_label }}" class="form-label fw-semibold">{% translate "Longitude" %}</label>
                        {{ form.lon }}
                        {% if form.lon.errors %}<div class="text-danger small mt-1">{{ form.lon.errors.0 }}</div>{% endif %}
                    </div>
                </div>
            </div>
        </div>

        <!-- Form Submit & Cancel -->
        <div class="d-flex justify-content-end gap-2 mb-5">
            <a href="{% url 'assets:publicbuilding_detail' building.pk %}" class="btn btn-secondary px-4">
                <i class="bi bi-x-lg me-1"></i>{% translate "Annuler" %}
            </a>
            <button type="submit" class="btn btn-primary px-4">
                <i class="bi bi-check-circle me-1"></i>{% translate "Enregistrer les modifications" %}
            </button>
        </div>
    </form>
</div>
{% endblock %}