@extends('web.layouts.layout')

@section('content')

    <main class="mt-100">
        <!-- contact section-->
        <section class="section_padding contact-section">
            <form method="post"
                  action="{{route('web.contact.store')}}"
                  class="form d-block ajax-form">
                @csrf
                <div class="container">
                    <div class="card section_padding raddius-10 px-5 wow clip-image-bottom">
                        <h3 class="card-title size-3 orange-color fw-bold">
                            {{ __('visitormessages::visitor_messages.questions_priority') }}
                        </h3>
                        <p class="grey-text">
                            {{ __('visitormessages::visitor_messages.we_are_here_to_help') }}
                        </p>
                        <div class="row mt-4 mb-4">
                            <div class="col-md-6 col-lg-6 col-sm-12 col-x-12">
                                <div class="input-group mb-3">
                                    <input
                                        class="form-control {{ $errors->has('name') ? 'is-invalid' : '' }}"
                                        name="name" value="{{ old('name') }}"
                                        placeholder="{{ __('visitormessages::visitor_messages.name') }}"
                                        aria-label="{{ __('visitormessages::visitor_messages.name') }}"
                                        type="text" required/>
                                    <span class="input-group-text orange-color" id="basic-addon1"><i
                                            class="fa-light fa-user"></i></span>
                                </div>
                            </div>
                            <div class="col-md-6 col-lg-6 col-sm-12 col-x-12">
                                <div class="input-group mb-3">
                                    <input
                                        class="form-control {{ $errors->has('email') ? 'is-invalid' : '' }}"
                                        name="email" value="{{ old('email') }}"
                                        placeholder="{{ __('visitormessages::visitor_messages.email') }}"
                                        aria-label="{{ __('visitormessages::visitor_messages.email') }}"
                                        type="email"
                                        required/>
                                    <span class="input-group-text orange-color" id="basic-addon1"><i
                                            class="fa-light fa-envelope"></i></span>
                                </div>
                            </div>
                            <div class="col-md-12 col-lg-12 col-sm-12 col-x-12">
                                <div class="input-group mb-3">
                                    <input type="text"
                                           class="form-control {{ $errors->has('phone') ? 'is-invalid' : '' }}"
                                           name="phone" value="{{ old('phone') }}"
                                           placeholder="{{ __('visitormessages::visitor_messages.phone') }}"
                                           aria-label="{{ __('visitormessages::visitor_messages.phone') }}"
                                            maxlength="11"
                                            oninput="this.value = this.value.replace(/[^0-9]/g, '')"
                                           required/>
                                       <select name="country_code"
                                            class="form-control phone"
                                            dir="ltr"
                                            style="text-align: center;">
                                            @if(isset($countries))
                                                @foreach($countries as $country)
                                                    <option
                                                        value="{{ $country->iso2 }}" @selected(old('country_code') == $country->iso2)>
                                                        {{ $country->country_code }}
                                                    </option>
                                                @endforeach
                                            @endif
                                        </select>
                                    <span class="input-group-text orange-color" id="basic-addon1">
                                        <i class="fa-light fa-mobile"></i>
                                    </span>
                                </div>
                            </div>
                            {{-- <div class="col-md-6 col-lg-6 col-sm-12 col-x-12">
                                <div class="input-group mb-3">
                                    <input class="form-control {{ $errors->has('subject') ? 'is-invalid' : '' }}"
                                           name="subject" value="{{ old('subject') }}"
                                           placeholder="{{__('visitormessages::visitor_messages.subject')}}"
                                           type="text"
                                           required/>
                                </div>
                            </div> --}}
                            <div class="col-md-12 col-lg-12 col-sm-12 col-x-12">
                                <div class="input-group mb-3">
                                    <textarea
                                        class="form-control {{ $errors->has('message') ? 'is-invalid' : '' }}"
                                        name="message"
                                        placeholder="{{ __('visitormessages::visitor_messages.message') }}"
                                        rows="7" required>{{ old('message') }}</textarea>
                                    <span class="input-group-text orange-color" id="basic-addon1">
                                        <i class="fa-light fa-pen"></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="nav_btns d-inline mx-auto">
                            <button type="submit" class="btn btn-primary half-rounded hvr-txt-trans">
                                <div class="txt" data-text="{{ __('visitormessages::visitor_messages.send') }}">
                                  <span class="fs-7">
                                     {{ __('visitormessages::visitor_messages.send') }}
                                      {{-- __('visitormessages::visitor_messages.send_your_message2') --}}
                                    <img
                                        data-src="{{ asset('assets/web/images/icons/arrows.svg') }}"
                                        src="{{ asset('assets/web/images/icons/arrows.svg') }}"
                                        alt="arrows"
                                        class="lazyload img_contain ms-2"
                                    />
                                  </span>
                                </div>
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </section>
    </main>

@endsection

@push('stack_scripts')

@endpush