@php
$platform = \App\Models\ContactUsSetting::select('form_field')->first();
$fields = explode(',',$platform->form_field ?? '');
@endphp
<div class="text-left fw-bold">
  <b class="mb-1">{{ __('Dear User,')}}</b>
  <p><b>{{ __('Please enter your question below. Our support team will be dealing with it soon.')}}</b></p>
</div>
<form method="post" class="row" id="enquiries" action="{{ route('aboutStore')}}" onsubmit="return false;" enctype="multipart/form-data">


  @csrf


  @if (in_array("Name",$fields))
        <div class="col-md-4 col-sm-4 col-12 pb-3">
            <div class="form-group" id="section_name">
                  <div class="relative z-0 w-full group">
                <input class="rounded-lg p-2.5 w-full text-sm text-gray-900 bg-transparent border-gray-300 appearance-none focus:outline-none border-2 focus:ring-1 peer pl-15 h-11 form-control check-special" type="text" id="name"
                       placeholder="" name="first_name"
                       value=""/>
                <label for="first_name" class="col-form-label ml-2 p-2 py-0 peer-focus:font-medium absolute left-0 text-sm text-gray-600 duration-300 transform -translate-y-6 scale-75 top-3 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 peer-focus:text-indigo-400 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 bg-white peer-focus:z-10">{{__('First Name')}} <span class="text-danger">*</span></label>
                <div class="text-danger error-name" style="display: none;">{{ __('First Name is required.')}}</div>
            </div>
        </div>
    </div>
  @endif

   @if (in_array("Name",$fields))
        <div class="col-md-4 col-sm-4 col-12 pb-3">
            <div class="form-group" id="section_name">
                <div class="relative z-0 w-full group">
                <input class="rounded-lg p-2.5 w-full text-sm text-gray-900 bg-transparent border-gray-300 appearance-none focus:outline-none border-2 focus:ring-1 peer pl-15 h-11 form-control check-special" type="text" id="name"
                       placeholder="" name="last_name"
                       value=""/>
                <label for="last_name" class="col-form-label ml-2 p-2 py-0 peer-focus:font-medium absolute left-0 text-sm text-gray-600 duration-300 transform -translate-y-6 scale-75 top-3 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 peer-focus:text-indigo-400 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 bg-white peer-focus:z-10">{{__('Last Name')}} <span class="text-danger">*</span></label>
                <div class="text-danger error-name" style="display: none;">{{ __('Last Name is required.')}}</div>
            </div>
        </div>
    </div>
  @endif


  @if (in_array("Email",$fields))
        <div class="col-md-4 col-sm-4 col-12 pb-3">
            <div class="form-group" id="section_email">
                <div class="relative z-0 w-full group">
                <input class="email-validation rounded-lg p-2.5 w-full text-sm text-gray-900 bg-transparent border-gray-300 appearance-none focus:outline-none border-2 focus:ring-1 peer pl-15 h-11 form-control contact-form-email" type="email" id="email" placeholder=""
                        name="email"
                       value=""/>
                <label for="Email" class="col-form-label ml-2 p-2 py-0 peer-focus:font-medium absolute left-0 text-sm text-gray-600 duration-300 transform -translate-y-6 scale-75 top-3 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 peer-focus:text-indigo-400 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 bg-white peer-focus:z-10">{{__('Email')}} <span class="text-danger">*</span></label>

                <div class="text-danger error-email" style="display: none;">{{ __('Email is required.')}}</div>
                <div class="text-danger error-email-vaild" style="display: none;">{{ __('Email is not valid.')}}</div>
            </div>
        </div>
        </div>
  @endif

  @if (in_array("Category",$fields))
        <div class="col-md-6 col-sm-6 col-12 pb-3">
            <div class="form-group" id="section_category">
                <div class="relative z-0 w-full group">
                <label class="col-form-label ml-2 p-2 py-0 peer-focus:font-medium absolute left-0 text-sm text-gray-600 duration-300 transform -translate-y-6 scale-75 top-3 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 peer-focus:text-indigo-400 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 bg-white peer-focus:z-10" for="category">{{__('Category')}}*</label>
                <select id="category" class="form-select rounded-lg block py-2.5 px-2.5 w-full text-sm text-gray-800 bg-transparent border-2 border-gray-300 appearance-none dark:text-gray-400 dark:border-gray-700 focus:outline-none focus:ring-0 focus:border-gray-200 peer h-11" name="category">
                    <option value="">{{__('Choose category')}}</option>
                </select>
                <div class="text-danger error-category" style="display: none;">{{ __('Category is required.')}}</div>
            </div>
        </div>
        </div>
  @endif

      @if (in_array("Subject",$fields))

        <div class="col-md-6 col-sm-6 col-12 pb-3">

                <div class="form-group" id="section_email">
                    <div class="relative z-0 w-full group">
                    <input type="text" class="rounded-lg p-2.5 w-full text-sm text-gray-900 bg-transparent border-gray-300 appearance-none focus:outline-none border-2 focus:ring-1 peer pl-15 h-11 form-control" id="Subject" placeholder="" class="form-control"
                        name="subject">
                    <label class="col-form-label ml-2 p-2 py-0 peer-focus:font-medium absolute left-0 text-sm text-gray-600 duration-300 transform -translate-y-6 scale-75 top-3 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 peer-focus:text-indigo-400 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 bg-white peer-focus:z-10" for="Subject">{{__('Subject')}} <span class="text-danger">*</span></label>

                    <div class="text-danger error-subject" style="display: none;">{{ __('Subject is required.')}}</div>
                </div>
            </div>
        </div>
  @endif

  @if (in_array("Message",$fields))
        <div class="col-sm-12">
            <div class="form-group mb-0" id="section_description">
             <div class="relative z-0 w-full group">
                <label class="" for="message">{{__('Message')}}*</label>
                <textarea id="message" class="form-control" required minlength="5" name="description" placeholder="Message..."></textarea>
                <div class="text-danger error-message" style="display: none;">{{ __('Message is required.')}}</div>
            </div>
        </div>
        </div>
  @endif

  @if (in_array("File",$fields))
        <div class="col-md-12 col-sm-12 mt-2">
            <div class="form-group mt-3" id="section_email">
                <label class="flex gap-1 items-center">File Upload
                <svg style="fill: #1c364f;" width="22" height="22" data-toggle="tooltip" data-placement="top" title="{{__('The file must be a file of type of : '.Str::replace(',',' | ',getSiteSettings('attachment_types')).' and max file size is '.getSiteSettings('file_size').'MB and maximum '.getSiteSettings('attachment_limit').' file is allowed to upload.')}}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path d="M320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576zM288 224C288 206.3 302.3 192 320 192C337.7 192 352 206.3 352 224C352 241.7 337.7 256 320 256C302.3 256 288 241.7 288 224zM280 288L328 288C341.3 288 352 298.7 352 312L352 400L360 400C373.3 400 384 410.7 384 424C384 437.3 373.3 448 360 448L280 448C266.7 448 256 437.3 256 424C256 410.7 266.7 400 280 400L304 400L304 336L280 336C266.7 336 256 325.3 256 312C256 298.7 266.7 288 280 288z"/></svg>
                                      </label>
                <input class="rounded-lg p-2.5 w-full text-sm text-gray-900 bg-transparent border-gray-300 appearance-none focus:outline-none border-2 focus:ring-1 peer pl-15 h-11 form-control" type="file"  id="files" name="file[]" placeholder="{{ __('Choose files') }}*" data-fileuploader-limit="{{getSiteSettings('attachment_limit')}}" data-fileuploader-maxSize="{{getSiteSettings('file_size')}}" data-fileuploader-extensions="{{getSiteSettings('attachment_types')}}">

            </div>
        </div>
  @endif

  @if (in_array("Captcha",$fields))
    <div class="mb-3 recaptcha">
        <div class="g-recaptcha" data-sitekey="{{config('amplivo.nocaptcha_configuration.site_key')}}"></div>
        <div class="text-danger error-recaptcha" style="display: none;">{{ __('Please verify reCAPTCHA')}}</div>
    </div>
  @endif

  <div class="card-footer text-left">
    <button type="submit" class="btn btn-primary bg-primary send-msg" onclick="doAccountLoginContactFrom()"><i class="bi bi-box-arrow-in-right me-1"></i>{{ __('Send message')}}</button>
  </div>

</form>
<input type="hidden" id="fileExtensions" value="{{ getSiteSettings('attachment_types') }}">
<input type="hidden" id="fileLimit" value="{{ getSiteSettings('attachment_limit') }}">
<input type="hidden" id="fileMaxSize" value="{{ getSiteSettings('file_size') }}">
@push('scripts')
<script src="{{ asset('frontend/js/page-js/get-support-category.js') }}"></script>
@endpush