<!-- Nitro Input Field - Complete Alpine.js Abstraction -->
<div>
    {% if label %}
    <label class="block text-xs text-gray-600 mb-1">
        {{ label }}{% if required %} *{% endif %}
    </label>
    {% endif %}
    <input
        type="{{ type }}"
        class="w-full rounded-lg border-gray-300"
        {% if placeholder %}placeholder="{{ placeholder }}"{% endif %}
        x-model="{{ safe_field }}"
        @input="call('_sync_field', {field: '{{ field }}', value: {{ safe_field }}})"
        :class="{'border-red-500': {{ error_path }}}"
        {{ extra_attrs|safe }}
        {% if debug %}data-nitro-debug="nitro_input: field='{{ field }}'"{% endif %}
    >
</div>
