{% load i18n %}
{% load crispy_forms_field %}

<div class="mb-3">
    <div class="join w-full" role="group" aria-label="{{ field.label }}">
            <input type="radio"
                   class="join-item btn btn-neutral btn-outline w-1/3 {% if field.errors %}input-error{% endif %}"
                   name="{{ field.html_name }}"
                   id="{{ field.html_name }}_none_tr"
                   value=""
                   aria-label="{% trans 'Unchanged' %}"
                   {% if not field.value %}checked{% endif %}>

        {% for choice in field.field.choices %}
            <input type="radio"
                   class="join-item btn btn-outline w-1/3 {% if forloop.first %}btn-success{% elif forloop.last %}btn-error{% else %}btn-primary{% endif %} {% if field.errors %}input-error{% endif %}"
                   name="{{ field.html_name }}"
                   id="{{ field.html_name }}_{{ forloop.counter }}_tr"
                   value="{{ choice.0 }}"
                   aria-label="{{ choice.1 }}"
                   {% if choice.0 == field.value %}checked{% endif %}>
        {% endfor %}
    </div>
    {% if field.errors %}
        <div class="text-error text-sm mt-1">
            {% for error in field.errors %}
                {{ error }}
            {% endfor %}
        </div>
    {% endif %}
    {% if field.help_text %}
        <small class="text-base-content/60 text-sm">{{ field.help_text }}</small>
    {% endif %}
</div>
