{{--
|--------------------------------------------------------------------------
| QuoteBookingForm is common Component (Can be shown in any screen)
|--------------------------------------------------------------------------
| you can show this component in any screen by referring to the following
| snippet:
|-----------
|
| @component('components.QuoteBookingForm',[])
|
| @endcomponent
|
|-------------------------------------------------------------
|
--}}

<form  method="POST" action="{{ route('quote-booking') }}" id="first-quote-form" class="col-lg-6 col-sm-12">
  {{ csrf_field() }}
  <input type="hidden" class="form-control" name="case" id="case" value="first-quote"/>
  <small id="emailHelp" class="form-text text-muted">We'll never share your details with anyone else</small>
  <div class="form-group">
    <input type="text" class="form-control" name="name" id="name" placeholder="Name" required>
  </div>
  <div class="form-group">
    <select class="form-control" id="country" name="country_id">
      <option value="">Select Country</option>
      @foreach(\App\Http\Controllers\PassportAPI\QuoteController::getCountries() as $country)
          <option value="{{$country['id']}}">{{$country['name']}}</option>
      @endforeach
    </select>
  </div>
  <div class="form-group">
    <select class="form-control" id="category" name="category_id">
      <option value="">Select Category</option>
      @foreach(\App\Http\Controllers\PassportAPI\QuoteController::getCategories() as $category)
          <option value="{{$category['id']}}">{{$category['name']}}</option>
      @endforeach
    </select>
  </div>
  <div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
      <input id="email" type="email" class="form-control" name="email" value="{{Auth::user()->email}}" placeholder="Enter email" readonly>
      @if ($errors->has('email'))
          <span class="help-block">
            <p class="text-danger"><strong>{{ $errors->first('email') }}</strong></p>
          </span>
      @endif
  </div>
  <div class="form-group">
    <input class="form-control p-dash-quote-form-phone" type="tel" name="phone" id="phone" placeholder="Phone" required>
    <input type="hidden" class="form-control" name="country_code" id="country_code" value=""/>
  </div>
  <div class="form-group shadow-textarea">
    <label for="exampleFormControlTextarea6">
        <i class="fas fa-pencil-alt prefix"></i>
        Describe your problem
    </label>
  <textarea class="form-control z-depth-1" name="problemDesc" id="problemDesc" rows="3" placeholder="Write here..."></textarea>
</div>
<div class="d-inline">
  <button type="button" class="btn btn-primary" id="quote-submit">Submit</button>
  <button type="button" class="btn btn-danger float-right" id="create_quote_cancel">Cancel</button>
</div>
</form>

<link href="{{ asset('jquery-plugins/intl-tel-input-master/css/intlTelInput.css') }}" rel="stylesheet">
<!-- Use as a jQuery plugin -->
<script src="{{ asset('jquery-plugins/intl-tel-input-master/js/intlTelInput-jquery.js') }}"></script>