{% extends "assets/detail_generic.html" %}
{% load i18n %}
{% load static %}
{% load asset_tags %}

{# ══════════════════════════════════════════════════════════════════════════════ #}
{#  EN-TÊTE SPÉCIFIQUE ARBRE                                                     #}
{# ══════════════════════════════════════════════════════════════════════════════ #}
{% block asset_header_title %}
<div class="d-flex align-items-center gap-3">
    <div class="rounded-circle bg-success-subtle p-2 d-flex align-items-center justify-content-center" style="width: 46px; height: 46px;">
        <i class="bi bi-tree-fill text-success" style="font-size: 1.6rem;"></i>
    </div>
    <div>
        <div class="d-flex align-items-center gap-2 flex-wrap">
            <h2 class="mb-0" style="color: var(--brand-color); font-size: 1.25rem;">
                {% translate "Arbre" %} : {{ asset.code }}
            </h2>
            {% if asset.name_fr %}
                <span class="text-secondary fw-semibold">&mdash; {{ asset.name_fr }}</span>
            {% elif asset.model %}
                <span class="text-secondary fw-semibold">&mdash; {{ asset.model.get_name }}</span>
            {% endif %}

            {# Badges d'état en un coup d'œil #}
            {% if asset.status == 'active' %}
                <span class="badge bg-success ms-1">{{ asset.get_status_display }}</span>
            {% elif asset.status == 'damaged' or asset.status == 'to_replace' %}
                <span class="badge bg-warning text-dark ms-1">{{ asset.get_status_display }}</span>
            {% else %}
                <span class="badge bg-secondary ms-1">{{ asset.get_status_display }}</span>
            {% endif %}

            {# Badge Vitalité #}
            {% if asset.vitality == 'strong' %}
                <span class="badge bg-success-subtle text-success border border-success ms-1"><i class="bi bi-heart-pulse-fill me-1"></i>{% translate "Vitalité forte" %}</span>
            {% elif asset.vitality == 'normal' %}
                <span class="badge bg-info-subtle text-info-emphasis border border-info ms-1"><i class="bi bi-heart-pulse me-1"></i>{% translate "Vitalité normale" %}</span>
            {% elif asset.vitality == 'weak' %}
                <span class="badge bg-warning-subtle text-warning-emphasis border border-warning ms-1"><i class="bi bi-exclamation-circle me-1"></i>{% translate "Vitalité faible" %}</span>
            {% elif asset.vitality == 'declining' or asset.vitality == 'dead' %}
                <span class="badge bg-danger ms-1"><i class="bi bi-exclamation-triangle-fill me-1"></i>{{ asset.get_vitality_display }}</span>
            {% endif %}

            {# Badge Stade #}
            {% if asset.development_stage %}
                <span class="badge bg-light text-secondary border ms-1">{{ asset.get_development_stage_display }}</span>
            {% endif %}

            {# Badge Risque #}
            {% if asset.risk_level == 'high' or asset.risk_level == 'imminent_danger' %}
                <span class="badge bg-danger ms-1"><i class="bi bi-shield-exclamation me-1"></i>{{ asset.get_risk_level_display }}</span>
            {% elif asset.risk_level == 'moderate' %}
                <span class="badge bg-warning text-dark ms-1">{{ asset.get_risk_level_display }}</span>
            {% endif %}

            {# Badge Arbre Remarquable #}
            {% if asset.is_remarkable %}
                <span class="badge bg-warning text-dark ms-1 shadow-sm"><i class="bi bi-star-fill text-warning me-1"></i>{% translate "Arbre remarquable" %}</span>
            {% endif %}
        </div>

        <div class="d-flex align-items-center gap-2 mt-1" style="font-size: 0.8rem; color: #6c757d;">
            <i class="bi bi-flower1"></i>
            {% if asset.model.scientific_name %}
                <em>{{ asset.model.scientific_name }}</em>
                <span>&bull;</span>
            {% endif %}
            <span>{{ thematic.name|default:"Nature" }} &mdash; {% translate "Arbres" %}</span>
            {% if asset.location %}
                <span>&bull;</span>
                <i class="bi bi-geo-alt"></i>
                <span>{{ asset.location.name }}</span>
            {% endif %}
        </div>
    </div>
</div>
{% endblock asset_header_title %}

{% block asset_header_title_readonly %}
<div class="d-flex align-items-center gap-3">
    <div class="rounded-circle bg-success-subtle p-2 d-flex align-items-center justify-content-center" style="width: 46px; height: 46px;">
        <i class="bi bi-tree-fill text-success" style="font-size: 1.6rem;"></i>
    </div>
    <div>
        <div class="d-flex align-items-center gap-2 flex-wrap">
            <h2 class="mb-0" style="color: var(--brand-color); font-size: 1.25rem;">
                {% translate "Arbre" %} : {{ asset.code }}
            </h2>
            {% if asset.name_fr %}
                <span class="text-secondary fw-semibold">&mdash; {{ asset.name_fr }}</span>
            {% elif asset.model %}
                <span class="text-secondary fw-semibold">&mdash; {{ asset.model.get_name }}</span>
            {% endif %}

            {# Badges d'état #}
            {% if asset.status == 'active' %}
                <span class="badge bg-success ms-1">{{ asset.get_status_display }}</span>
            {% elif asset.status == 'damaged' or asset.status == 'to_replace' %}
                <span class="badge bg-warning text-dark ms-1">{{ asset.get_status_display }}</span>
            {% else %}
                <span class="badge bg-secondary ms-1">{{ asset.get_status_display }}</span>
            {% endif %}

            {# Badge Vitalité #}
            {% if asset.vitality == 'strong' %}
                <span class="badge bg-success-subtle text-success border border-success ms-1"><i class="bi bi-heart-pulse-fill me-1"></i>{% translate "Vitalité forte" %}</span>
            {% elif asset.vitality == 'normal' %}
                <span class="badge bg-info-subtle text-info-emphasis border border-info ms-1"><i class="bi bi-heart-pulse me-1"></i>{% translate "Vitalité normale" %}</span>
            {% elif asset.vitality == 'weak' %}
                <span class="badge bg-warning-subtle text-warning-emphasis border border-warning ms-1"><i class="bi bi-exclamation-circle me-1"></i>{% translate "Vitalité faible" %}</span>
            {% elif asset.vitality == 'declining' or asset.vitality == 'dead' %}
                <span class="badge bg-danger ms-1"><i class="bi bi-exclamation-triangle-fill me-1"></i>{{ asset.get_vitality_display }}</span>
            {% endif %}

            {# Badge Stade #}
            {% if asset.development_stage %}
                <span class="badge bg-light text-secondary border ms-1">{{ asset.get_development_stage_display }}</span>
            {% endif %}

            {# Badge Risque #}
            {% if asset.risk_level == 'high' or asset.risk_level == 'imminent_danger' %}
                <span class="badge bg-danger ms-1"><i class="bi bi-shield-exclamation me-1"></i>{{ asset.get_risk_level_display }}</span>
            {% elif asset.risk_level == 'moderate' %}
                <span class="badge bg-warning text-dark ms-1">{{ asset.get_risk_level_display }}</span>
            {% endif %}

            {# Badge Arbre Remarquable #}
            {% if asset.is_remarkable %}
                <span class="badge bg-warning text-dark ms-1 shadow-sm"><i class="bi bi-star-fill text-warning me-1"></i>{% translate "Arbre remarquable" %}</span>
            {% endif %}
        </div>

        <div class="d-flex align-items-center gap-2 mt-1" style="font-size: 0.85rem; color: #6c757d;">
            <i class="bi bi-flower1"></i>
            {% if asset.model.scientific_name %}
                <em>{{ asset.model.scientific_name }}</em>
                <span>&bull;</span>
            {% endif %}
            <span>{{ thematic.name|default:"Nature" }} &mdash; {% translate "Arbres" %}</span>
            {% if asset.location %}
                <span>&bull;</span>
                <i class="bi bi-geo-alt"></i>
                <span>{{ asset.location.name }}</span>
            {% endif %}
        </div>
    </div>
</div>
{% endblock asset_header_title_readonly %}


{# ══════════════════════════════════════════════════════════════════════════════ #}
{#  COLONNE PRINCIPALE : CARTES MÉTIER ARBRE                                     #}
{# ══════════════════════════════════════════════════════════════════════════════ #}
{% block main_asset_content %}

{# ── CARTE 1 : IDENTITÉ DE L'ARBRE ── #}
<div class="card mb-3 shadow-sm border-0">
    <div class="card-header bg-light d-flex align-items-center justify-content-between">
        <h5 class="mb-0 fs-6 fw-bold" style="color: var(--brand-color);">
            <i class="bi bi-info-circle text-primary me-2"></i>{% translate "Identité & Informations générales" %}
        </h5>
        {% if asset.tag_number %}
        <span class="badge bg-secondary-subtle text-secondary border">
            <i class="bi bi-tag me-1"></i>{{ asset.tag_number }}
        </span>
        {% endif %}
    </div>
    <div class="card-body">
        <table class="table table-striped mb-0 align-middle">
            <tbody>
                <!-- Code -->
                <tr class="asset-editable-field" data-field="code" data-can-edit="{% if 'code' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th style="width: 32%;">{% translate "Code d'inventaire" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value fw-semibold">{{ asset.code }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.code }}">
                        </div>
                    </td>
                </tr>

                <!-- N° de bague / Plaquette -->
                <tr class="asset-editable-field" data-field="tag_number" data-can-edit="{% if 'tag_number' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "N° de plaquette / Bague" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.tag_number|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.tag_number|default:'' }}" placeholder="{% translate 'Ex: B-48010' %}">
                        </div>
                    </td>
                </tr>

                <!-- Nom commun FR -->
                <tr class="asset-editable-field" data-field="name_fr" data-can-edit="{% if 'name_fr' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Nom commun (FR)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.name_fr|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.name_fr|default:'' }}" placeholder="{% translate 'Ex: Érable plane' %}">
                        </div>
                    </td>
                </tr>

                <!-- Nom commun NL -->
                <tr class="asset-editable-field" data-field="name_nl" data-can-edit="{% if 'name_nl' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Nom commun (NL)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.name_nl|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.name_nl|default:'' }}" placeholder="{% translate 'Ex: Noorse esdoorn' %}">
                        </div>
                    </td>
                </tr>

                <!-- Référence externe -->
                {% if asset.external_reference or 'external_reference' in allowed_update_fields %}
                <tr class="asset-editable-field" data-field="external_reference" data-can-edit="{% if 'external_reference' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Référence externe" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.external_reference|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.external_reference|default:'' }}">
                        </div>
                    </td>
                </tr>
                {% endif %}

                <!-- Date de plantation (remplace 'Installé le') -->
                <tr class="asset-editable-field" data-field="installation_date" data-can-edit="{% if 'installation_date' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Date de plantation" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.installation_date %}
                                    <i class="bi bi-calendar-event me-1 text-muted"></i>{{ asset.installation_date|date:"d/m/Y" }}
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <input type="date" class="form-control form-control-sm" value="{{ asset.installation_date|date:'Y-m-d'|default:'' }}">
                        </div>
                    </td>
                </tr>

                <!-- Statut -->
                <tr class="asset-editable-field" data-field="status" data-can-edit="{% if 'status' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Statut" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.status == 'active' %}
                                    <span class="badge bg-success">{{ asset.get_status_display }}</span>
                                {% elif asset.status == 'damaged' %}
                                    <span class="badge bg-warning">{{ asset.get_status_display }}</span>
                                {% elif asset.status == 'to_replace' %}
                                    <span class="badge bg-danger">{{ asset.get_status_display }}</span>
                                {% else %}
                                    <span class="badge bg-secondary">{{ asset.get_status_display }}</span>
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                {% for value, label in status_choices %}
                                <option value="{{ value }}" {% if value == asset.status %}selected{% endif %}>{{ label }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Statut de validation -->
                {% if asset.validation_status is not None or 'validation_status' in allowed_update_fields %}
                <tr class="asset-editable-field" data-field="validation_status" data-can-edit="{% if 'validation_status' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Statut de validation" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.validation_status == 'validated' %}
                                    <span class="badge bg-success">{{ asset.get_validation_status_display }}</span>
                                {% elif asset.validation_status == 'to_be_validated' %}
                                    <span class="badge bg-warning text-dark">{{ asset.get_validation_status_display }}</span>
                                {% elif asset.validation_status == 'to_be_completed' %}
                                    <span class="badge bg-info text-dark">{{ asset.get_validation_status_display }}</span>
                                {% elif asset.validation_status == 'rejected' %}
                                    <span class="badge bg-danger">{{ asset.get_validation_status_display }}</span>
                                {% else %}
                                    <span class="badge bg-secondary">{{ asset.get_validation_status_display|default:"-" }}</span>
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for value, label in validation_status_choices %}
                                <option value="{{ value }}" {% if value == asset.validation_status %}selected{% endif %}>{{ label }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>
                {% endif %}

                <!-- Catégorie -->
                <tr class="asset-editable-field" data-field="category" data-can-edit="{% if 'category' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Catégorie" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.category|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for cat in categories %}
                                <option value="{{ cat.id }}" {% if cat.id == asset.category_id %}selected{% endif %}>{{ cat.get_name }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Projet / Financement -->
                {% if asset.funding_program or 'funding_program' in allowed_update_fields %}
                <tr class="asset-editable-field" data-field="funding_program" data-can-edit="{% if 'funding_program' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Programme / Projet" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.funding_program|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.funding_program|default:'' }}">
                        </div>
                    </td>
                </tr>
                {% endif %}

                <!-- Note / Observations générales -->
                <tr class="asset-editable-field" data-field="note" data-can-edit="{% if 'note' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Note générale" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value text-muted">{{ asset.note|default:"-"|linebreaksbr }}</span>
                        </div>
                        <div class="field-edit d-none">
                            <textarea class="form-control form-control-sm" rows="2">{{ asset.note|default:'' }}</textarea>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>


{# ── CARTE 2 : DENDROMÉTRIE & DIMENSIONS ── #}
<div class="card mb-3 shadow-sm border-0">
    <div class="card-header bg-light">
        <h5 class="mb-0 fs-6 fw-bold" style="color: var(--brand-color);">
            <i class="bi bi-rulers text-success me-2"></i>{% translate "Fiche dendrométrique & Dimensions" %}
        </h5>
    </div>
    <div class="card-body">
        {# Mini-widgets d'indicateurs visuels #}
        <div class="row g-2 mb-3">
            <div class="col-4">
                <div class="p-2 border rounded text-center bg-light-subtle">
                    <div class="small text-muted mb-1"><i class="bi bi-arrow-up-down text-success me-1"></i>{% translate "Hauteur" %}</div>
                    <div class="fs-5 fw-bold text-success">
                        {% if asset.height %}{{ asset.height }} <small class="text-muted fw-normal" style="font-size: 0.75rem;">m</small>{% else %}<span class="text-muted fs-6">&mdash;</span>{% endif %}
                    </div>
                </div>
            </div>
            <div class="col-4">
                <div class="p-2 border rounded text-center bg-light-subtle">
                    <div class="small text-muted mb-1"><i class="bi bi-circle text-primary me-1"></i>{% translate "Circonférence" %}</div>
                    <div class="fs-5 fw-bold text-primary">
                        {% if asset.circumference %}{{ asset.circumference }} <small class="text-muted fw-normal" style="font-size: 0.75rem;">cm</small>{% else %}<span class="text-muted fs-6">&mdash;</span>{% endif %}
                    </div>
                </div>
            </div>
            <div class="col-4">
                <div class="p-2 border rounded text-center bg-light-subtle">
                    <div class="small text-muted mb-1"><i class="bi bi-arrows-expand text-info me-1"></i>{% translate "Houppier" %}</div>
                    <div class="fs-5 fw-bold text-info-emphasis">
                        {% if asset.crown_diameter %}{{ asset.crown_diameter }} <small class="text-muted fw-normal" style="font-size: 0.75rem;">m</small>{% else %}<span class="text-muted fs-6">&mdash;</span>{% endif %}
                    </div>
                </div>
            </div>
        </div>

        <table class="table table-striped mb-0 align-middle">
            <tbody>
                <!-- Hauteur totale -->
                <tr class="asset-editable-field" data-field="height" data-can-edit="{% if 'height' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th style="width: 32%;">{% translate "Hauteur totale (m)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{% if asset.height %}{{ asset.height }} m{% else %}-{% endif %}</span></div>
                        <div class="field-edit d-none">
                            <input type="number" step="0.1" class="form-control form-control-sm" value="{{ asset.height|default:'' }}">
                        </div>
                    </td>
                </tr>

                <!-- Circonférence du tronc -->
                <tr class="asset-editable-field" data-field="circumference" data-can-edit="{% if 'circumference' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Circonférence à 1,30 m (cm)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{% if asset.circumference %}{{ asset.circumference }} cm{% else %}-{% endif %}</span></div>
                        <div class="field-edit d-none">
                            <input type="number" step="1" class="form-control form-control-sm" value="{{ asset.circumference|default:'' }}" placeholder="{% translate 'En cm' %}">
                        </div>
                    </td>
                </tr>

                <!-- Diamètre du houppier -->
                <tr class="asset-editable-field" data-field="crown_diameter" data-can-edit="{% if 'crown_diameter' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Diamètre du houppier (m)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{% if asset.crown_diameter %}{{ asset.crown_diameter }} m{% else %}-{% endif %}</span></div>
                        <div class="field-edit d-none">
                            <input type="number" step="0.5" class="form-control form-control-sm" value="{{ asset.crown_diameter|default:'' }}">
                        </div>
                    </td>
                </tr>

                <!-- Hauteur sous couronne -->
                <tr class="asset-editable-field" data-field="crown_clearance" data-can-edit="{% if 'crown_clearance' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Hauteur sous couronne (gabarit)" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.crown_clearance %}{{ asset.crown_clearance }} m{% else %}-{% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <input type="number" step="0.1" class="form-control form-control-sm" value="{{ asset.crown_clearance|default:'' }}" placeholder="{% translate 'Ex: 4.5' %}">
                        </div>
                    </td>
                </tr>

                <!-- Stade de développement -->
                <tr class="asset-editable-field" data-field="development_stage" data-can-edit="{% if 'development_stage' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Stade de développement" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.development_stage %}
                                    <span class="badge bg-secondary-subtle text-secondary border">{{ asset.get_development_stage_display }}</span>
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.DEVELOPMENT_STAGE_CHOICES %}
                                <option value="{{ val }}" {% if asset.development_stage == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Rayon de protection racinaire -->
                <tr class="asset-editable-field" data-field="protection_buffer" data-can-edit="{% if 'protection_buffer' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Protection racinaire (m)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{% if asset.protection_buffer %}{{ asset.protection_buffer }} m{% else %}-{% endif %}</span></div>
                        <div class="field-edit d-none">
                            <input type="number" step="0.5" class="form-control form-control-sm" value="{{ asset.protection_buffer|default:'' }}">
                        </div>
                    </td>
                </tr>

                <!-- Profondeur de fosse -->
                <tr class="asset-editable-field" data-field="depth" data-can-edit="{% if 'depth' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Profondeur de fosse (m)" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{% if asset.depth %}{{ asset.depth }} m{% else %}-{% endif %}</span></div>
                        <div class="field-edit d-none">
                            <input type="number" step="0.1" class="form-control form-control-sm" value="{{ asset.depth|default:'' }}">
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>


{# ── CARTE 3 : DIAGNOSTIC SANITAIRE & SÉCURITÉ ── #}
<div class="card mb-3 shadow-sm border-0">
    <div class="card-header bg-light d-flex align-items-center justify-content-between">
        <h5 class="mb-0 fs-6 fw-bold" style="color: var(--brand-color);">
            <i class="bi bi-shield-check text-warning me-2"></i>{% translate "Diagnostic sanitaire & Sécurité" %}
        </h5>
        {% if asset.is_remarkable %}
        <span class="badge bg-warning text-dark"><i class="bi bi-star-fill text-warning me-1"></i>Remarquable</span>
        {% endif %}
    </div>
    <div class="card-body">
        <table class="table table-striped mb-0 align-middle">
            <tbody>
                <!-- Vigueur / Vitalité -->
                <tr class="asset-editable-field" data-field="vitality" data-can-edit="{% if 'vitality' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th style="width: 32%;">{% translate "Vigueur / Vitalité" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.vitality == 'strong' %}
                                    <span class="badge bg-success">{{ asset.get_vitality_display }}</span>
                                {% elif asset.vitality == 'normal' %}
                                    <span class="badge bg-info text-dark">{{ asset.get_vitality_display }}</span>
                                {% elif asset.vitality == 'weak' %}
                                    <span class="badge bg-warning text-dark">{{ asset.get_vitality_display }}</span>
                                {% elif asset.vitality == 'declining' or asset.vitality == 'dead' %}
                                    <span class="badge bg-danger">{{ asset.get_vitality_display }}</span>
                                {% else %}
                                    <span class="text-muted">-</span>
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.VITALITY_CHOICES %}
                                <option value="{{ val }}" {% if asset.vitality == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- État mécanique -->
                <tr class="asset-editable-field" data-field="mechanical_state" data-can-edit="{% if 'mechanical_state' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "État mécanique" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.mechanical_state == 'good' %}
                                    <span class="text-success"><i class="bi bi-check-circle-fill me-1"></i>{{ asset.get_mechanical_state_display }}</span>
                                {% elif asset.mechanical_state == 'fair' %}
                                    <span class="text-warning-emphasis"><i class="bi bi-info-circle-fill me-1"></i>{{ asset.get_mechanical_state_display }}</span>
                                {% elif asset.mechanical_state %}
                                    <span class="text-danger"><i class="bi bi-exclamation-triangle-fill me-1"></i>{{ asset.get_mechanical_state_display }}</span>
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.MECHANICAL_STATE_CHOICES %}
                                <option value="{{ val }}" {% if asset.mechanical_state == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Niveau de risque -->
                <tr class="asset-editable-field" data-field="risk_level" data-can-edit="{% if 'risk_level' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Niveau de risque" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.risk_level == 'low' %}
                                    <span class="badge bg-success-subtle text-success border border-success">{{ asset.get_risk_level_display }}</span>
                                {% elif asset.risk_level == 'moderate' %}
                                    <span class="badge bg-warning text-dark">{{ asset.get_risk_level_display }}</span>
                                {% elif asset.risk_level == 'high' or asset.risk_level == 'imminent_danger' %}
                                    <span class="badge bg-danger">{{ asset.get_risk_level_display }}</span>
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.RISK_LEVEL_CHOICES %}
                                <option value="{{ val }}" {% if asset.risk_level == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Arbre remarquable -->
                <tr class="asset-editable-field" data-field="is_remarkable" data-can-edit="{% if 'is_remarkable' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Arbre remarquable / classé" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.is_remarkable %}
                                    <span class="badge bg-warning text-dark"><i class="bi bi-star-fill text-warning me-1"></i>{% translate "Oui" %}</span>
                                {% else %}
                                    <span class="text-muted">{% translate "Non" %}</span>
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="false" {% if not asset.is_remarkable %}selected{% endif %}>{% translate "Non" %}</option>
                                <option value="true" {% if asset.is_remarkable %}selected{% endif %}>{% translate "Oui" %}</option>
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Défauts constatés & Pathologies -->
                <tr class="asset-editable-field" data-field="health_defects" data-can-edit="{% if 'health_defects' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Défauts & Pathologies" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">{{ asset.health_defects|default:"-"|linebreaksbr }}</span>
                        </div>
                        <div class="field-edit d-none">
                            <textarea class="form-control form-control-sm" rows="3" placeholder="{% translate 'Ex: Cavité au collet, branches mortes au houppier N-E, suie...' %}">{{ asset.health_defects|default:'' }}</textarea>
                        </div>
                    </td>
                </tr>

                <!-- Dernier diagnostic phytosanitaire -->
                <tr class="asset-editable-field" data-field="last_phytosanitary_date" data-can-edit="{% if 'last_phytosanitary_date' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Dernier diagnostic" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.last_phytosanitary_date %}
                                    <i class="bi bi-check2-circle text-success me-1"></i>{{ asset.last_phytosanitary_date|date:"d/m/Y" }}
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <input type="date" class="form-control form-control-sm" value="{{ asset.last_phytosanitary_date|date:'Y-m-d'|default:'' }}">
                        </div>
                    </td>
                </tr>

                <!-- Prochaine inspection préconisée -->
                <tr class="asset-editable-field" data-field="next_inspection_date" data-can-edit="{% if 'next_inspection_date' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Prochaine inspection" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.next_inspection_date %}
                                    <i class="bi bi-clock-history text-info me-1"></i>{{ asset.next_inspection_date|date:"d/m/Y" }}
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <input type="date" class="form-control form-control-sm" value="{{ asset.next_inspection_date|date:'Y-m-d'|default:'' }}">
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>


{# ── CARTE 4 : IMPLANTATION & CONDUITE DE TAILLE ── #}
<div class="card mb-3 shadow-sm border-0">
    <div class="card-header bg-light">
        <h5 class="mb-0 fs-6 fw-bold" style="color: var(--brand-color);">
            <i class="bi bi-geo-alt text-info me-2"></i>{% translate "Implantation & Conduite de taille" %}
        </h5>
    </div>
    <div class="card-body">
        <table class="table table-striped mb-0 align-middle">
            <tbody>
                <!-- Contexte d'implantation -->
                <tr class="asset-editable-field" data-field="implantation_context" data-can-edit="{% if 'implantation_context' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th style="width: 32%;">{% translate "Contexte" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.get_implantation_context_display|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.IMPLANTATION_CHOICES %}
                                <option value="{{ val }}" {% if asset.implantation_context == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Type de pied / Fosse -->
                <tr class="asset-editable-field" data-field="pit_type" data-can-edit="{% if 'pit_type' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Type de pied / Fosse" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.get_pit_type_display|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.PIT_TYPE_CHOICES %}
                                <option value="{{ val }}" {% if asset.pit_type == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Protection / Tuteurage -->
                <tr class="asset-editable-field" data-field="protection_type" data-can-edit="{% if 'protection_type' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Protection / Tuteurage" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.get_protection_type_display|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.PROTECTION_CHOICES %}
                                <option value="{{ val }}" {% if asset.protection_type == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Contraintes urbaines -->
                <tr class="asset-editable-field" data-field="urban_constraints" data-can-edit="{% if 'urban_constraints' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Contraintes environnantes" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value">{{ asset.urban_constraints|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <input type="text" class="form-control form-control-sm" value="{{ asset.urban_constraints|default:'' }}" placeholder="{% translate 'Ex: Lignes aériennes, proximité façade...' %}">
                        </div>
                    </td>
                </tr>

                <!-- Type de taille -->
                <tr class="asset-editable-field" data-field="pruning_type" data-can-edit="{% if 'pruning_type' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Conduite de taille" %}</th>
                    <td>
                        <div class="field-display"><span class="field-value fw-medium">{{ asset.get_pruning_type_display|default:"-" }}</span></div>
                        <div class="field-edit d-none">
                            <select class="form-select form-select-sm">
                                <option value="">-</option>
                                {% for val, lbl in asset.PRUNING_CHOICES %}
                                <option value="{{ val }}" {% if asset.pruning_type == val %}selected{% endif %}>{{ lbl }}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </td>
                </tr>

                <!-- Périodicité de taille -->
                <tr class="asset-editable-field" data-field="pruning_frequency_years" data-can-edit="{% if 'pruning_frequency_years' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Périodicité de taille" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.pruning_frequency_years %}
                                    {% blocktranslate with n=asset.pruning_frequency_years %}Tous les {{ n }} an(s){% endblocktranslate %}
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <input type="number" step="1" min="1" max="20" class="form-control form-control-sm" value="{{ asset.pruning_frequency_years|default:'' }}" placeholder="{% translate 'Nombre d années' %}">
                        </div>
                    </td>
                </tr>

                <!-- Dernière taille / élagage -->
                <tr class="asset-editable-field" data-field="last_pruning_date" data-can-edit="{% if 'last_pruning_date' in allowed_update_fields %}true{% else %}false{% endif %}">
                    <th>{% translate "Dernière taille" %}</th>
                    <td>
                        <div class="field-display">
                            <span class="field-value">
                                {% if asset.last_pruning_date %}
                                    {{ asset.last_pruning_date|date:"d/m/Y" }}
                                {% else %}
                                    -
                                {% endif %}
                            </span>
                        </div>
                        <div class="field-edit d-none">
                            <input type="date" class="form-control form-control-sm" value="{{ asset.last_pruning_date|date:'Y-m-d'|default:'' }}">
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

{% endblock main_asset_content %}


{# ══════════════════════════════════════════════════════════════════════════════ #}
{#  COLONNE LATÉRALE : ESSENCE BOTANIQUE                                         #}
{# ══════════════════════════════════════════════════════════════════════════════ #}
{% block model_card %}
{% asset_model_card asset card_title="Essence botanique" %}
{% endblock model_card %}