{% load i18n %}
{% load widget_tweaks %}

<div id="div_id_{{ field.html_name }}" class="form-group{% if field.errors %} has-error{% endif %}">
  <div class="controls">
    {% if field.label %}
      <label class="block mb-3 text-white control-label"
             for="{{ field.auto_id }}"
      >
        {{ field.label }}
        {% if not field.field.required %}
          <span class="text-muted">{% trans "(optional)" %}</span>
        {% endif %}
      </label>
    {% endif %}
    {{ field|add_class:'form-control rounded text-gray-100 bg-charcoal border border-1 border-slate w-full' }}
    {% if field.help_text %}
      <p class="help-block text-muted"><small>{{ field.help_text }}</small></p>
    {% endif %}
    {% for error in field.errors %}
      <p class="text-danger error">{{ error }}</p>
    {% endfor %}
  </div>
</div>
