{% load allauth %}
{% if attrs.tags and "primary" in attrs.tags %}
  <span {% if attrs.title %}title="{{ attrs.title }}"{% endif %}
        class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-indigo-100 text-indigo-700">
    {% slot %}{% endslot %}
  </span>
{% elif attrs.tags and "secondary" in attrs.tags %}
  <span {% if attrs.title %}title="{{ attrs.title }}"{% endif %}
        class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-slate-100 text-slate-600">
    {% slot %}{% endslot %}
  </span>
{% elif attrs.tags and "warning" in attrs.tags %}
  <span {% if attrs.title %}title="{{ attrs.title }}"{% endif %}
        class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-yellow-100 text-yellow-700 cursor-help">
    {% slot %}{% endslot %}
  </span>
{% else %}
  <span {% if attrs.title %}title="{{ attrs.title }}"{% endif %}
        class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-slate-100 text-slate-600">
    {% slot %}{% endslot %}
  </span>
{% endif %}