{# State badge. Usage: {% include "_state_badge.html" with state="ACTIVE" %} #}
{% load scoped_tags %}
{% with color=state|state_color %}
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium
  {% if color == 'green' %}bg-green-50 text-green-700 ring-1 ring-green-600/20
  {% elif color == 'yellow' %}bg-yellow-50 text-yellow-700 ring-1 ring-yellow-600/20
  {% elif color == 'blue' %}bg-blue-50 text-blue-700 ring-1 ring-blue-600/20
  {% elif color == 'red' %}bg-red-50 text-red-700 ring-1 ring-red-600/20
  {% elif color == 'orange' %}bg-orange-50 text-orange-700 ring-1 ring-orange-600/20
  {% else %}bg-slate-50 text-slate-600 ring-1 ring-slate-500/20{% endif %}">
  {{ state|enum_display }}
</span>
{% endwith %}