{#
  Renders a <picture> element with WebP source + PNG/JPEG fallback via LiipImagine.

  @param string path       — relative image path (e.g. 'images/characters/scout_ikona.png')
  @param string filter     — base filter name (e.g. 'char_icon') — appends '_webp' automatically
  @param string alt        — alt text
  @param string class      — CSS classes for <img> (default '')
  @param string loading    — 'lazy' or 'eager' (default 'lazy')
  @param int|null width    — explicit width attribute (optional)
  @param int|null height   — explicit height attribute (optional)
#}
{% macro picture(path, filter, alt, class, loading, width, height) %}
<picture>
    <source srcset="{{ path | imagine_filter(filter ~ '_webp') }}" type="image/webp">
    <img src="{{ path | imagine_filter(filter) }}"
         alt="{{ alt }}"
         {% if class %}class="{{ class }}"{% endif %}
         loading="{{ loading|default('lazy') }}"
         {% if width %}width="{{ width }}"{% endif %}
         {% if height %}height="{{ height }}"{% endif %}
    >
</picture>
{% endmacro %}