{% load markdown_filters %}
<div class="card mm-embed" data-testid="agent-embed">
  <div class="card-header">
    <h5 class="mb-0">
      <i class="fa-solid fa-brain-circuit me-1"></i>
      <span data-testid="embed-entity-name">{{ agent.name }}</span>
    </h5>
    <small class="text-muted">{{ playbook.name }}</small>
  </div>
  <div class="card-body">
    {% if agent.description %}
    <div class="markdown-content mb-3" data-testid="embed-description">
      {{ agent.description|markdown }}
    </div>
    {% else %}
    <p class="text-muted mb-3">No description provided.</p>
    {% endif %}

    {% if activities %}
    <hr class="my-2">
    <h6 class="text-muted small text-uppercase mb-1">Used in Activities
      <span class="badge bg-secondary ms-1">{{ activities|length }}</span>
    </h6>
    <ul class="list-unstyled small mb-0">
      {% for act in activities %}
      <li>
        <i class="fa-solid fa-list-check text-primary me-1"></i>
        <a href="#" data-navigate-canvas="activity:{{ act.pk }}" class="text-decoration-none">{{ act.name }}</a>
      </li>
      {% endfor %}
    </ul>
    {% endif %}
  </div>
</div>