{% comment %}
  Self-styled post card that follows the site's light/dark mode. Useful for
  showing a static snapshot of a social-media post (or any quoted source) that
  can't be themed via its own embed. Not a live widget.

  Parameters:
    author      - author / page / profile name
    author_url  - link to the author (optional; defaults to href)
    avatar      - avatar image URL (optional; falls back to the author's initial)
    date        - human-readable date string (optional)
    image       - a single post image URL (optional)
    images      - a comma-separated list of image URLs (optional; use instead of `image`)
    href        - link to the original post / source
    link_text   - footer link label (optional; default 'Zobacz oryginał')
    width       - max width in px (optional; default 500)
    text        - post body; capture it first, then pass as text=<var>

{% endcomment %}
<div class="custom-card"{% if include.width %} style="--card-width:{{ include.width }}px"{% endif %}>
  <div class="custom-card__header">
    {% if include.avatar %}
      <img class="custom-card__avatar" src="{{ include.avatar }}" alt="{{ include.author }}">
    {% else %}
      <span class="custom-card__avatar custom-card__avatar--placeholder" aria-hidden="true">{{ include.author | default: '?' | strip | slice: 0 | upcase }}</span>
    {% endif %}
    <div class="custom-card__meta">
      <a class="custom-card__author" href="{{ include.author_url | default: include.href }}"
         target="_blank" rel="noopener noreferrer">{{ include.author }}</a>
      {% if include.date %}<span class="custom-card__date">{{ include.date }}</span>{% endif %}
    </div>
  </div>

  {% if include.text %}
    <div class="custom-card__text">{{ include.text | markdownify }}</div>
  {% endif %}

  {% assign _raw_images = include.images | default: include.image %}
  {% assign _clean_images = '' %}
  {% if _raw_images %}
    {% assign _split_images = _raw_images | split: ',' %}
    {% for _img in _split_images %}
      {% assign _img_url = _img | strip %}
      {% if _img_url != '' %}
        {% if _clean_images == '' %}
          {% assign _clean_images = _img_url %}
        {% else %}
          {% assign _clean_images = _clean_images | append: '|||' | append: _img_url %}
        {% endif %}
      {% endif %}
    {% endfor %}
  {% endif %}
  {% assign card_images = _clean_images | split: '|||' %}
  {% if card_images.size > 0 %}
    <div class="custom-card__images custom-card__images--{{ card_images.size }}">
      {%- for img_url in card_images -%}
        <a href="{{ include.href }}" target="_blank" rel="noopener noreferrer"><img src="{{ img_url }}" alt="{{ include.author }}" loading="lazy"></a>
      {%- endfor -%}
    </div>
  {% endif %}

  {% if include.href %}
    <a class="custom-card__footer" href="{{ include.href }}" target="_blank" rel="noopener noreferrer">
      {{ include.link_text | default: 'Zobacz oryginał' }}
    </a>
  {% endif %}
</div>