{% extends "admin_base" %}

{% block title %}Modifier — {{ resource.title | default(value="Élément") }}{% endblock %}

{% block breadcrumb %}
  <span class="breadcrumb-sep">/</span>
  <a href="/admin/{{ resource.key }}/list">{{ resource.title | default(value="Éléments") }}</a>
  <span class="breadcrumb-sep">/</span>
  <span>Modifier</span>
{% endblock %}

{% block content %}

  <header class="page-header">
    <h1>Modifier — {{ resource.title | default(value="Élément") }}</h1>
  </header>

  <div class="card" style="max-width:60%;">
    <div class="card-header">
      <h2>Informations</h2>
    </div>
    <div class="card-body">
      <form method="POST" action="/admin/{{ resource.key }}/{{ object_id }}/edit">
        <div class="form-grid">
          {% if form_fields is defined and form_fields.html is defined and form_fields.html %}
            {{ form_fields.html | safe }}
          {% else %}
            <p>Aucun champ disponible pour le moment.</p>
          {% endif %}
        </div>
        <div class="form-actions">
          <a href="/admin/{{ resource.key }}/list" class="btn btn-secondary">Annuler</a>
          <button type="submit" class="btn btn-primary">Enregistrer</button>
        </div>
      </form>
    </div>
  </div>

{% endblock %}

{% block extra_js %}
{{ super() }}
<script>
  document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('input[type="password"]').forEach(function (el) {
      el.placeholder = '••••••••';
      el.disabled = true;
    });
  });
</script>
{% endblock %}