{% load i18n %}
{# Persistent file widget: shows existing file + replace/remove controls, or a normal file input. #}
{% if widget.has_file %}
  <div class="persistent-file" data-name="{{ widget.name }}">
    <div class="d-flex align-items-center gap-2">
      <i class="ti ti-paperclip"></i>
      {% if widget.file_url %}
        <a href="{{ widget.file_url }}" target="_blank" rel="noopener">{{ widget.display_name }}</a>
      {% else %}
        <span>{{ widget.display_name }}</span>
      {% endif %}
      <button type="button"
              class="btn btn-sm btn-ghost-secondary persistent-file-replace"
              data-bs-toggle="collapse"
              data-bs-target="#pf-replace-{{ widget.name }}">
        <i class="ti ti-refresh"></i> {% translate "Replace" %}
      </button>
      {% if widget.delete_url %}
        <button type="button"
                class="btn btn-sm btn-ghost-danger"
                hx-delete="{{ widget.delete_url }}"
                hx-swap="outerHTML"
                hx-target="closest .persistent-file"
                hx-confirm="{% translate 'Remove this uploaded file?' %}">
          <i class="ti ti-trash"></i> {% translate "Remove" %}
        </button>
      {% endif %}
    </div>
    <div id="pf-replace-{{ widget.name }}" class="collapse mt-2">
      <input type="file" name="{{ widget.name }}" class="form-control{% if widget.size_suffix %} form-control{{ widget.size_suffix }}{% endif %}"{% for key, val in widget.attrs.items %}{% if val is not False %} {{ key }}{% if val is not True %}="{{ val }}"{% endif %}{% endif %}{% endfor %}>
      <small class="form-hint">{% translate "Uploading a new file replaces the existing one." %}</small>
    </div>
  </div>
{% else %}
  <input type="file" name="{{ widget.name }}" class="form-control{% if widget.size_suffix %} form-control{{ widget.size_suffix }}{% endif %}"{% for key, val in widget.attrs.items %}{% if val is not False %} {{ key }}{% if val is not True %}="{{ val }}"{% endif %}{% endif %}{% endfor %}>
{% endif %}