<a href="{{ link }}" class="block rounded border border-stone-200 bg-white hover:bg-stone-50 transition-colors no-underline" data-fragment="link-card" data-app="artdag" data-hx-disable>
  <div class="flex flex-row items-center gap-3 p-3">
    <div class="flex-shrink-0 w-10 h-10 rounded bg-stone-100 flex items-center justify-center text-stone-500">
      {% if content_type == "recipe" %}
        <i class="fas fa-scroll text-sm"></i>
      {% elif content_type == "effect" %}
        <i class="fas fa-magic text-sm"></i>
      {% elif content_type == "run" %}
        <i class="fas fa-play-circle text-sm"></i>
      {% else %}
        <i class="fas fa-cube text-sm"></i>
      {% endif %}
    </div>
    <div class="flex-1 min-w-0">
      <div class="font-medium text-stone-900 text-sm truncate">{{ title }}</div>
      {% if description %}
        <div class="text-xs text-stone-500 clamp-2">{{ description }}</div>
      {% endif %}
      <div class="text-xs text-stone-400 mt-0.5">{{ content_type }} &middot; {{ cid[:12] }}&hellip;</div>
    </div>
  </div>
</a>
