@if ($formData)
    @foreach ($formData as $data)
        <div class="flex flex-col gap-1.5">

            {{-- Label --}}
            <label class="text-xs font-semibold text-primary-700 uppercase tracking-wide
                           @if ($data->is_required == 'required')
                               after:content-['*'] after:ml-0.5 after:text-accent-500
                           @endif">
                {{ __(keyToTitle($data->name)) }}
            </label>

            {{-- Text --}}
            @if ($data->type == 'text')
                <input type="text"
                       name="{{ $data->label }}"
                       value="{{ old($data->label) }}"
                       class="form--control w-full px-4 py-3 rounded-xl border-2 border-primary-200 text-primary-900 text-sm placeholder-primary-300 focus:outline-none focus:border-primary-500 transition-colors duration-200"
                       @if ($data->is_required == 'required') required @endif>

            {{-- Textarea --}}
            @elseif ($data->type == 'textarea')
                <textarea name="{{ $data->label }}"
                          class="form--control w-full px-4 py-3 rounded-xl border-2 border-primary-200 text-primary-900 text-sm placeholder-primary-300 focus:outline-none focus:border-primary-500 transition-colors duration-200 resize-none"
                          rows="4"
                          @if ($data->is_required == 'required') required @endif>{{ old($data->label) }}</textarea>

            {{-- Select --}}
            @elseif ($data->type == 'select')
                <select name="{{ $data->label }}"
                        class="form--control w-full px-4 py-3 rounded-xl border-2 border-primary-200 text-primary-900 text-sm focus:outline-none focus:border-primary-500 transition-colors duration-200 bg-white"
                        @if ($data->is_required == 'required') required @endif>
                    <option value="">@lang('Select One')</option>
                    @foreach ($data->options as $item)
                        <option value="{{ $item }}" @selected($item == old($data->label))>{{ __($item) }}</option>
                    @endforeach
                </select>

            {{-- Checkbox --}}
            @elseif ($data->type == 'checkbox')
                <div class="flex flex-col gap-2 mt-1">
                    @foreach ($data->options as $option)
                        <label for="{{ $data->label }}_{{ titleToKey($option) }}"
                               class="flex items-center gap-2.5 cursor-pointer group">
                            <input type="checkbox"
                                   name="{{ $data->label }}[]"
                                   value="{{ $option }}"
                                   id="{{ $data->label }}_{{ titleToKey($option) }}"
                                   class="w-4 h-4 rounded border-2 border-primary-300 text-primary-700 accent-primary-700 focus:ring-primary-500 cursor-pointer">
                            <span class="text-sm text-primary-800 group-hover:text-primary-600 transition-colors duration-150">
                                {{ $option }}
                            </span>
                        </label>
                    @endforeach
                </div>

            {{-- Radio --}}
            @elseif ($data->type == 'radio')
                <div class="flex flex-col gap-2 mt-1">
                    @foreach ($data->options as $option)
                        <label for="{{ $data->label }}_{{ titleToKey($option) }}"
                               class="flex items-center gap-2.5 cursor-pointer group">
                            <input type="radio"
                                   name="{{ $data->label }}"
                                   value="{{ $option }}"
                                   id="{{ $data->label }}_{{ titleToKey($option) }}"
                                   class="w-4 h-4 border-2 border-primary-300 text-primary-700 accent-primary-700 focus:ring-primary-500 cursor-pointer"
                                   @checked($option == old($data->label))>
                            <span class="text-sm text-primary-800 group-hover:text-primary-600 transition-colors duration-150">
                                {{ $option }}
                            </span>
                        </label>
                    @endforeach
                </div>

            {{-- File --}}
            @elseif ($data->type == 'file')
                <input type="file"
                       name="{{ $data->label }}"
                       class="form--control w-full text-sm text-primary-500
                              file:mr-3 file:py-2 file:px-4 file:rounded-lg
                              file:border-2 file:border-primary-200 file:text-xs
                              file:font-semibold file:text-primary-700 file:bg-primary-50
                              hover:file:bg-primary-100 file:transition-colors file:duration-200 file:cursor-pointer"
                       accept="@foreach (explode(',', $data->extensions) as $ext).{{ $ext }}, @endforeach"
                       @if ($data->is_required == 'required') required @endif>
                <p class="text-xs text-primary-400 mt-0.5">
                    @lang('Supported mimes'): <span class="font-medium text-primary-600">{{ $data->extensions }}</span>
                </p>

            @endif
        </div>
    @endforeach
@endif