{% trans_default_domain 'admin' %}

{% set isVariant = offer.isVariant %}
{% set isReadonly = isReadonly|default(false) or isVariant %}

<div {{ attributes.defaults({ class: 'border-t border-gray-200 dark:border-gray-800 mt-6 pt-6' }) }}>
    <div class="space-y-6">
        {# Variant notice lives in the global edit_page_header block in
           page/offers/edit.html.twig — don't repeat it here. The
           isVariant flag is still folded into isReadonly above so we
           keep hiding the mutation controls below. #}
        {% if not isReadonly %}
        <div class="flex items-center gap-4">
            <twig:Admin:Dropdown position="left">
                <twig:block name="toggle">
                    <button type="button"
                            class="inline-flex items-center gap-x-1.5 rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 dark:bg-gray-800 dark:text-gray-100 dark:ring-gray-700 dark:hover:bg-gray-700">
                        Anhang hinzufügen
                        <twig:ux:icon name="ph:caret-down" class="-mr-1 h-5 w-5 text-gray-400" aria-hidden="true" />
                    </button>
                </twig:block>
                <twig:block name="dropdown">
                    <div class="py-1">
                        <a href="{{ path('admin_files', { storage: 'attachments', offer: offer.uuid }) }}"
                                data-turbo-frame="modal"
                                class="text-gray-700 block px-4 py-2 text-sm w-full text-left hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700">
                            Aus Dateien wählen
                        </a>
                        <button type="button"
                                class="text-gray-700 block px-4 py-2 text-sm w-full text-left hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-700"
                                data-action="live#action"
                                data-live-action-param="switchAttachmentAction"
                                data-live-mode-param="upload">
                            Neu hochladen
                        </button>
                    </div>
                </twig:block>
            </twig:Admin:Dropdown>

            {% if attachmentAction %}
                <button type="button"
                        class="text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200"
                        data-action="live#action"
                        data-live-action-param="resetAttachmentAction">
                    Abbrechen
                </button>
            {% endif %}
        </div>
        {% endif %}

        {% if not isReadonly and attachmentAction == 'upload' %}
            <div class="rounded-lg p-4 border border-gray-200 dark:border-gray-700">
                <h4 class="text-sm font-medium mb-4">Datei hochladen</h4>
                <div class="relative group" {{ stimulus_controller('symfony/ux-dropzone/dropzone') }} data-action="change->live#action" data-live-action-param="files|upload">
                    <input type="file"
                           name="attachment"
                           class="absolute inset-0 z-10 w-full h-full opacity-0 cursor-pointer"
                           data-symfony--ux-dropzone--dropzone-target="input">
                    <div class="py-8 border-2 border-dashed border-gray-300 rounded-lg text-center group-hover:border-primary-500 transition-colors"
                         data-symfony--ux-dropzone--dropzone-target="placeholder">
                        <p class="text-sm text-gray-500">{{ 'offers.dropzoneFilePlaceholder'|trans }}</p>
                    </div>
                    <div class="hidden py-8 border-2 border-dashed border-gray-300 rounded-lg text-center transition-colors"
                         data-symfony--ux-dropzone--dropzone-target="preview">
                        <div data-symfony--ux-dropzone--dropzone-target="previewImage" class="hidden"></div>
                        <div data-symfony--ux-dropzone--dropzone-target="previewFilename" class="text-sm font-medium"></div>
                        <button type="button" data-symfony--ux-dropzone--dropzone-target="previewClearButton" class="mt-2 text-xs text-red-600 hover:text-red-800 dark:text-red-500 dark:hover:text-red-400">Löschen</button>
                    </div>
                </div>
            </div>
        {% endif %}

        {% if offer.attachments|length > 0 %}
            <div class="space-y-4 mt-10">
                <h3 class="text-sm font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">Anhänge</h3>
                <div class="grid grid-cols-1 gap-2"
                     {{ isReadonly ? '' : stimulus_controller('ferienpass/admin-attachment-sortable') }}>
                    {% for oa in offer.attachments %}
                        {% set uuid = oa.attachment.uuid.toRfc4122 %}
                        <div class="group relative flex items-center justify-between p-3 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors"
                             data-id="{{ uuid }}">
                            <a href="{{ path('file_show', { storage: 'attachments', uuid: oa.attachment.uuid.toBase58 }) }}"
                               data-turbo-frame="slideover"
                               class="absolute inset-0 z-0"></a>
                            <div class="flex items-center gap-3 overflow-hidden relative z-10 pointer-events-none">
                                {% if not isReadonly %}
                                    <div class="drag-handle p-1 text-gray-400 hover:text-gray-600 cursor-move transition-colors pointer-events-auto">
                                        <twig:ux:icon name="ph:dots-six-vertical" class="h-4 w-4" />
                                    </div>
                                {% endif %}
                                <div class="shrink-0 w-8 h-8 flex items-center justify-center bg-gray-100 dark:bg-gray-900 rounded">
                                    {% if oa.attachment.path ends with '.pdf' %}
                                        <twig:ux:icon name="ph:file-pdf" class="w-5 h-5 text-red-500" />
                                    {% else %}
                                        <twig:ux:icon name="ph:warning" class="w-5 h-5 text-yellow-500" />
                                    {% endif %}
                                </div>
                                <div class="truncate">
                                    <p class="text-sm font-medium text-gray-900 dark:text-gray-100 truncate" title="{{ oa.attachment.path|split('/')|last }}">
                                        {{ oa.attachment.path|split('/')|last }}
                                    </p>
                                    {% if oa.agreementLetter %}
                                        <span class="inline-flex items-center rounded-md bg-green-50 px-1.5 py-0.5 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20">
                                            Einverständniserklärung
                                        </span>
                                    {% endif %}
                                </div>
                            </div>

                            {% if not isReadonly %}
                                <div class="flex items-center gap-2 relative z-10">
                                    <button type="button"
                                            class="p-2 text-gray-400 hover:text-red-600 dark:hover:text-red-500 transition-colors"
                                            data-action="live#action"
                                            data-live-action-param="unassignAttachment"
                                            data-live-uuid-param="{{ uuid }}"
                                            onclick="return confirm('Möchten Sie diesen Anhang wirklich von diesem Angebot entfernen?')">
                                        <twig:ux:icon name="ph:minus-circle" class="h-5 w-5" />
                                    </button>
                                </div>
                            {% endif %}
                        </div>
                    {% endfor %}
                </div>
            </div>
        {% else %}
            <div class="text-center py-12 bg-gray-50 rounded-lg border-2 border-dashed border-gray-200 dark:bg-gray-900 dark:border-gray-700 mt-10">
                <p class="text-gray-500 italic">Noch keine Anhänge hinterlegt.</p>
            </div>
        {% endif %}
    </div>

    {% if attachmentUnassigned %}
        <twig:Turbo:Stream:Prepend target="#notifications">
            <twig:Admin:Notification type="archived" title="Anhang entfernt" message="Der Anhang wurde vom Angebot entfernt, aber Sie finden das Dokument noch unter Dateien."/>
        </twig:Turbo:Stream:Prepend>
    {% endif %}
    {% if attachmentDeleted %}
        <twig:Turbo:Stream:Prepend target="#notifications">
            <twig:Admin:Notification type="deleted" title="Dokument gelöscht" message="Der Anhang wurde endgültig gelöscht."/>
        </twig:Turbo:Stream:Prepend>
    {% endif %}
    {% if attachmentUnassignedAndNotDeleted %}
        <twig:Turbo:Stream:Prepend target="#notifications">
            <twig:Admin:Notification type="archived" title="Anhang entfernt" message="Der Anhang wurde vom Angebot entfernt, jedoch nicht endgültig gelöscht, da er noch anderen Angeboten zugeordnet ist."/>
        </twig:Turbo:Stream:Prepend>
    {% endif %}
    {% if error %}
        <twig:Turbo:Stream:Prepend target="#notifications">
            <twig:Admin:Notification type="error" title="Ein Fehler ist aufgetreten" message="{{ error }}"/>
        </twig:Turbo:Stream:Prepend>
    {% endif %}
    {% if message|default %}
        <twig:Turbo:Stream:Prepend target="#notifications">
            <twig:Admin:Notification type="success" title="Daten gespeichert" :message="message" />
        </twig:Turbo:Stream:Prepend>
    {% endif %}

    <twig:Admin:Edit:Footer :isDirty="true" :isReadonly="isReadonly" :sections="sections" :section="section" :params="{uuid: offer.uuid}" :useLiveAction="true" />
</div>
