{#
/**
 * @file
 * Output list template.
 *
 * Available variables:
 * - outputs: Array of output information keyed by type.
 * - show_details: Whether to show file details.
 */
#}
{% if outputs %}
<div class="ffmpeg-output-list">
  <div class="ffmpeg-output-grid">
    {% for type, output in outputs %}
      <div class="ffmpeg-output-item ffmpeg-output-item--{{ type|replace({':': '-'}) }}">
        <div class="ffmpeg-output-header">
          <span class="ffmpeg-output-type">{{ output.label|default(type|upper) }}</span>
          {% set file_count = output.values|length %}
          <span class="ffmpeg-output-count">
            {% if file_count == 1 %}
              {{ '1 file'|t }}
            {% else %}
              {{ '@count files'|t({'@count': file_count}) }}
            {% endif %}
          </span>
        </div>

        {% if output.values %}
          <ul class="ffmpeg-output-files">
            {% for file in output.values %}
              <li class="ffmpeg-output-file">
                <a href="{{ file.url }}" target="_blank" rel="noopener noreferrer" class="ffmpeg-file-link">
                  {{ file.filename }}
                </a>
                {% if show_details and file.size %}
                  <span class="ffmpeg-file-size">
                    {% if file.size < 1048576 %}
                      {{ '@size KB'|t({'@size': (file.size / 1024)|number_format(1)}) }}
                    {% else %}
                      {{ '@size MB'|t({'@size': (file.size / 1048576)|number_format(2)}) }}
                    {% endif %}
                  </span>
                {% endif %}
              </li>
            {% endfor %}
          </ul>
        {% endif %}
      </div>
    {% endfor %}
  </div>
</div>
{% endif %}
