{% set hasError = field.vars.errors|length > 0 %}
{% set isRequired = field.vars.required %}
{% set isCheckbox = field.vars.block_prefixes[1] == 'checkbox' %}
{% set isRadio = field.vars.block_prefixes[1] == 'radio' %}
{% set isExpanded = field.vars.expanded is defined and field.vars.expanded %}

{% if isExpanded and isRadio %}
    {% include 'quote_request/_form_radio.html.twig' with {
        field: field,
        attr: attr|default({})
    } %}
{% else %}
    <div class="{{ fullWidth|default(false) ? 'col-span-2' : '' }}">
        {% if not isCheckbox %}
            <label class="block text-sm font-medium {{ hasError ? 'text-red-700' : 'text-gray-700' }}">
                {{ field.vars.label|default('') }}
                {% if isRequired %}
                    <span class="text-red-500">*</span>
                {% endif %}
            </label>
        {% endif %}

        <div class="relative mt-1 rounded-md shadow-sm">
            {% set defaultClass = 'block w-full rounded-md shadow-sm py-2 px-3 focus:outline-none focus:ring-2 ' ~
                (hasError ? 'border-red-300 text-red-900 placeholder-red-300 focus:border-red-500 focus:ring-red-500' : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500') %}

            {{ form_widget(field, {
                attr: attr|default({})|merge({
                    'class': attr.class|default('') ~ ' ' ~ defaultClass,
                    'placeholder': placeholder|default(''),
                    'readonly': attr.readonly|default(false)
                })
            }) }}

            {% if isCheckbox %}
                <div class="ml-2 inline-block">
                    <label for="{{ field.vars.id }}" class="text-sm font-medium {{ hasError ? 'text-red-700' : 'text-gray-700' }}">
                        {{ field.vars.label|default('') }}
                        {% if isRequired %}
                            <span class="text-red-500">*</span>
                        {% endif %}
                    </label>
                </div>
            {% endif %}

            {% if hasError %}
                <div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
                    <svg class="h-5 w-5 text-red-500" fill="currentColor" viewBox="0 0 20 20">
                        <path fill-rule="evenodd"
                              d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z"
                              clip-rule="evenodd"></path>
                    </svg>
                </div>
            {% endif %}
        </div>

        {% if hasError %}
            <div class="mt-2 text-sm text-red-600">{{ form_errors(field) }}</div>
        {% endif %}
    </div>
{% endif %}