{#
    ProjectDetail "Le projet" info block - top-level content field group (NOT a `blocks[]`
    entry, see decision (a) in spec-driven-development/project-detail-redesign.md: always
    exactly one instance, directly under the hero, never reordered/duplicated).

    Parameters:
    - content (object): page content, reads `content.{projectInfoTitle, projectInfoText,
      projectInfoItems[]}` (`projectInfoItems[]` = `{label, value}[]`, arbitrary count)
    - editMode (bool)

    Right column is RepeatableObjectListEditor-managed in edit mode (assets/admin/editor/
    RepeatableObjectListEditor.ts, instantiated page-level for `#project-detail-info-items`
    in assets/admin/editor/index.ts) - `data-field="projectInfoItems[N][label]"` /
    `[value]` per item, index-contiguous (add/remove/drag-reorder reindexes items). Items are
    reordered by dragging their `data-repeatable-item-handle` handle.
#}
{% set items = content.projectInfoItems|default([]) %}
<div class="project-detail-info">
    <div class="project-detail-info__left">
        <h2 class="project-detail-info__title"{% if editMode|default(false) %} data-editable="true" data-editor-type="simple" data-field="projectInfoTitle" data-placeholder="Le projet"{% endif %}>{{ content.projectInfoTitle|default('Le projet') }}</h2>

        {% if (content.projectInfoText is defined and content.projectInfoText) or editMode|default(false) %}
            <div class="project-detail-info__text"{% if editMode|default(false) %} data-editable="true" data-field="projectInfoText" data-placeholder="Description du projet"{% endif %}>{{ content.projectInfoText|default('')|raw }}</div>
        {% endif %}
    </div>

    <div class="project-detail-info__right">
        <dl class="project-detail-info__items" id="project-detail-info-items" data-repeatable-list="true" data-repeatable-list-prefix="projectInfoItems">
            {% for item in items %}
                {# Public render hides items left without value (e.g. untouched creation defaults);
                   edit mode keeps them so index-contiguous `data-field`s stay intact. #}
                {% if editMode|default(false) or item.value|default('')|trim is not empty %}
                <div class="project-detail-info__item"{% if editMode|default(false) %} data-repeatable-item="true"{% endif %}>
                    <dt class="project-detail-info__item-label"{% if editMode|default(false) %} data-editable="true" data-editor-type="simple" data-field="projectInfoItems[{{ loop.index0 }}][label]" data-placeholder="Libellé"{% endif %}>{{ item.label }}</dt>
                    <dd class="project-detail-info__item-value"{% if editMode|default(false) %} data-editable="true" data-editor-type="simple" data-field="projectInfoItems[{{ loop.index0 }}][value]" data-placeholder="Valeur"{% endif %}>{{ item.value }}</dd>
                    {% if editMode|default(false) %}
                        <span class="project-detail-info__item-handle" data-repeatable-item-handle="true" role="presentation" title="Glisser pour réordonner">&#8942;&#8942;</span>
                        <button type="button" class="project-detail-info__item-remove" data-repeatable-item-remove="true" aria-label="Supprimer cet item">&#128465;</button>
                    {% endif %}
                </div>
                {% endif %}
            {% endfor %}
        </dl>

        {% if editMode|default(false) %}
            <button type="button" class="actualite-block__control actualite-block__control--add project-detail-info__add" data-repeatable-list-add="true">
                + Ajouter un item
            </button>

            {# Hidden single-item template, cloned by RepeatableObjectListEditor.ts when
               "Ajouter un item" is clicked - keeps editor markup in sync with the real
               render partial ("clone real markup" rule, same as the gallery block's
               single-image-slot template). Index placeholder `__INDEX__` is rewritten to the
               real trailing index on insertion. #}
            <template id="project-detail-info-item-template">
                <div class="project-detail-info__item" data-repeatable-item="true">
                    <dt class="project-detail-info__item-label" data-editable="true" data-editor-type="simple" data-field="projectInfoItems[__INDEX__][label]" data-placeholder="Libellé"></dt>
                    <dd class="project-detail-info__item-value" data-editable="true" data-editor-type="simple" data-field="projectInfoItems[__INDEX__][value]" data-placeholder="Valeur"></dd>
                    <span class="project-detail-info__item-handle" data-repeatable-item-handle="true" role="presentation" title="Glisser pour réordonner">&#8942;&#8942;</span>
                    <button type="button" class="project-detail-info__item-remove" data-repeatable-item-remove="true" aria-label="Supprimer cet item">&#128465;</button>
                </div>
            </template>
        {% endif %}
    </div>
</div>