@extends('zendesk.layouts.app')
    @section('title')
        {{ __('create_candidate') }}
    @endsection
    @section('content')
    
            <div class="container-fluid">
                <form action="{{ route('zendesk.candidateStore') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="card">
                        <div class="card-header">
                            <h4 class="card-title line-height-36">{{ __('create') }}</h4>
                            <button type="submit"
                                class="btn bg-success float-right d-flex align-items-center justify-content-center">
                                <i class="fas fa-plus mr-1"></i>
                                {{ __('save') }}
                            </button>
                            <a href="{{ route('zendesk.candidateIndex') }}"
                            class="btn bg-secondary float-right d-flex align-items-center justify-content-center mr-2"
                            >Back</a>
                        </div>
                    </div>
                    <div class="card">

                        <div class="card-body tab-content">

                            <div class="accordion" id="accordionExample">
                                <div class="card">
                                    <div class="card-header fw-bold accordion-bg-light" data-toggle="collapse"
                                        data-target="#collapseOne" aria-expanded="true">
                                        <span class="title">{{ __('profile_details') }}</span>
                                        <span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>
                                    </div>
                                    <div id="collapseOne" class="collapse show" data-parent="">

                                        <div class="card-body">

                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="First name" :required="true"/>
                                                        <x-forms.input type="text" name="name"
                                                            placeholder="First Name"
                                                            value="{{ old('name') }}" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Middle Name" :required="false" />
                                                        <x-forms.input type="text" name="middle_name"
                                                            placeholder="Middle name"
                                                            value="{{ old('middle_name') }}" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Last Name" :required="false" />
                                                        <x-forms.input type="text" name="last_name"
                                                            placeholder="Last Name"
                                                            value="{{ old('last_name') }}" />
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row">

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="phone" :required="false"/>
                                                        <x-forms.input value="{{ old('phone') }}"
                                                            type="text" name="phone" placeholder="phone" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Alternate Phone" :required="false" />
                                                        <x-forms.input type="text"
                                                            value="{{ old('alternate_phone') }}"
                                                            name="alternate_phone" placeholder="Alternate Phone" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="gender" :required="false" />
                                                        <select name="gender" id="gender"
                                                            class="form-control @error('gender') is-invalid @enderror">
                                                            <option value="male">
                                                                {{ __('male') }}</option>
                                                            <option value="female"
                                                                >
                                                                {{ __('female') }}</option>
                                                            <option value="other"
                                                                >
                                                                {{ __('other') }}</option>
                                                        </select>
                                                        @error('gender')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>

                                            </div>
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="email" :required="true"/>
                                                        <x-forms.input value="{{ old('email') }}"
                                                            type="email" name="email" placeholder="email" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="secondary_email" :required="false" />
                                                        <x-forms.input
                                                            value="{{ old('secondary_email') }}"
                                                            type="email" name="secondary_email"
                                                            placeholder="secondary_email" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="marital_status" :required="false"/>
                                                        <select id="marital_status" name="marital_status"
                                                            class="form-control @error('marital_status') is-invalid @enderror">
                                                            <option>{{ __('marital_status') }}</option>
                                                            <option value="married">
                                                                {{ __('married') }}</option>
                                                            <option value="single">
                                                                {{ __('single') }}</option>
                                                        </select>
                                                        @error('marital_status')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                {{-- <div class="col-md-4">
                                                        <div class="form-group">
                                                            <div class="form-group">
                                                                <x-forms.label name="password" :required="false" />
                                                                <x-forms.input type="password" name="password" placeholder="password" />
                                                            </div>
                                                        </div>
                                                    </div> --}}

                                            </div>
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="{{ __('student_category') }}"
                                                            :required="false" />
                                                        <select name="student_category" id="student_category"
                                                            class="form-control  @error('student_category') is-invalid @enderror">
                                                            <option value="" class="d-none">
                                                                {{ __('select_student_category') }}
                                                            </option>
                                                            <option
                                                                {{ 'Gold' == old('student_category') ? 'selected' : '' }}
                                                                value="Gold">{{ __('Gold') }}</option>
                                                            <option
                                                                {{ 'Silver' == old('student_category') ? 'selected' : '' }}
                                                                value="Silver">{{ __('Silver') }}</option>
                                                            <option
                                                                {{ 'Bronze' == old('student_category') ? 'selected' : '' }}
                                                                value="Bronze">{{ __('Bronze') }}</option>
                                                        </select>
                                                        @error('student_category')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>


                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="{{ __('passport_number') }}"
                                                            :required="false" />
                                                        <input type="text"
                                                            class="form-control @error('passport_number') is-invalid @enderror"
                                                            name="passport_number"
                                                            value="{{ old('passport_number') }}"
                                                            id="passport_number"
                                                            placeholder="{{ __('passport_number') }}">
                                                        @error('passport_number')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                {{-- <div class="col-md-4">
                                                        <div class="form-group">
                                                            <x-forms.label name="profession" :required="false" />
                                                            <select name="profession_id" id="profession"
                                                                class="select2bs4 form-control @error('profession_id') is-invalid @enderror">
                                                                @foreach ($professions as $profession)
                                                                <option
                                                                    {{ $profession->id == old('profession_id') ? 'selected' : '' }}
                                                                    value="{{ $profession->id }}">
                                                                    {{ $profession->name }}
                                                                </option>
                                                                @endforeach
                                                            </select>
                                                            @error('profession_id')
                                                                <span class="invalid-feedback" role="alert">{{ __($message) }}</span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group">
                                                            <x-forms.label name="experience" :required="false" />
                                                            <select name="experience" id="experience"
                                                                class="form-control select2bs4 @error('experience') is-invalid @enderror">
                                                                @foreach ($experiences as $experience)
                                                                <option
                                                                {{ old('experience') == $experience->id ? 'selected' : '' }}
                                                                value="{{ $experience->id }}">{{ $experience->name }}
                                                                </option>
                                                                @endforeach
                                                            </select>
                                                            @error('experience')
                                                                <span class="invalid-feedback" role="alert">{{ __($message) }}</span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group">
                                                            <x-forms.label name="job_role" :required="false" />
                                                            <select name="role_id"
                                                                class="form-control select2bs4 @error('role_id') is-invalid @enderror"
                                                                id="role_id">
                                                                @foreach ($job_roles as $role)
                                                                <option
                                                                {{ old('role_id') == $role->id ? 'selected' : '' }}
                                                                value="{{ $role->id }}"> {{ $role->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            @error('role_id')
                                                                <span class="invalid-feedback" role="alert">{{ __($message) }}</span>
                                                            @enderror
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group">
                                                            <x-forms.label name="education" :required="false" />
                                                            <select name="education" id="education"
                                                                class="form-control select2bs4 @error('education') is-invalid @enderror">
                                                                @foreach ($educations as $education)
                                                                    <option {{ $education->id == old('education_id') ? 'selected' : '' }}
                                                                        value="{{ $education->id }}"> {{ $education->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            @error('education')
                                                                <span class="invalid-feedback" role="alert">{{ __($message) }}</span>
                                                            @enderror
                                                        </div>
                                                    </div> --}}

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="birth_date" :required="false" />
                                                        <input type="text"
                                                            
                                                            class="form-control @error('birth_date') is-invalid @enderror"
                                                            name="birth_date" id="birth_date"
                                                            placeholder="{{ __('birth_date') }}">
                                                        @error('birth_date')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>


                                            


                                            </div>

                                            <div class="row">

                                                <div class="form-group col-sm-4">
                                                    <x-forms.label name="country" :required="false" />
                                                    <select name="country_id"
                                                    class="form-control @error('country_id') is-invalid @enderror w-100-p select2bs4"
                                                    id="countrySelect">
                                                    <option>Country</option>
                                                    <option>+91</option>
                                                    </select>
                                                    <x-forms.error name="country_id" />
                                                </div>
                                                <div class="form-group col-sm-4">
                                                    <x-forms.label name="state" :required="false"/>
                                                    <x-forms.input type="text" name="state_id"
                                                    value="{{ old('state_id') }}"
                                                    placeholder="State" />
                            
                                                    <x-forms.error name="state_id" />
                                                </div>
                                                <div class="form-group col-sm-4">
                                                    <x-forms.label name="city" :required="false" />
                                                    <x-forms.input type="text" name="city_id"
                                                    value="{{ old('city_id') }}"
                                                    placeholder="City" />
                                                    <x-forms.error name="city_id" />
                                                </div>
                                            </div>

                                            <div class="row">
                                            

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="stages"
                                                            :required="false" />
                                                            <select name="stages"
                                                            class="form-control @error('stages') is-invalid @enderror w-100-p select2bs4"
                                                            id="stageSelect">
                                                            <option>stages</option>
                                                            </select>
                                                    </div>
                                                </div>

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="source"
                                                            :required="false" />
                                                            <select name="source"
                                                            class="form-control @error('source') is-invalid @enderror w-100-p select2bs44"
                                                            id="source">
                                                            <option value="" class="d-none">
                                                                {{ __('select') }} {{ __('source') }}
                                                            </option>
                                                            @foreach ($sourcesData as $sd)
                                                            <optgroup label="{{ $sd->name }}"> 
                                                                @foreach ($sd->source as $ssd)
                                                                <option
                                                                {{ old('sourcesData') == $ssd->name ? 'selected' : '' }}
                                                                value="{{ $ssd->name }}"> {{ $ssd->name }}</option>
                                                                @endforeach
                                                            </optgroup>
                                                            @endforeach
                                                            </select>
                                                    </div>
                                                </div>

                                        
                                            
                                            </div>


                                            <div class="row">
                                                <div class="form-group col-12">
                                                    <x-forms.label name="{{ __('address') }}" :required="false" />
                                                    <textarea type="text" class="form-control" name="address" placeholder="Enter Address">{{ old('address') }}</textarea>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="form-group col-12">
                                                    <label class="form-lebel">
                                                        {{ __('notes') }}
                                                    </label>
                                                    <textarea id="editor3" type="text" class="form-control" name="notes"
                                                        placeholder="{{ __('enter') }}  {{ __('notes') }}">{{ old('notes') }}</textarea>
                                                    @error('notes')
                                                        <span
                                                            class="text-danger font-size-13"><strong>{{ $message }}</strong></span>
                                                    @enderror
                                                </div>
                                            </div>



                                        </div>
                                    </div>
                                </div>
                                <div class="card">
                                    <div class="card-header collapsed fw-bold accordion-bg-light"
                                        data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false"
                                        aria-controls="collapseTwo">
                                        <span class="title"> {{ __('education') }}</span>
                                        <span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>
                                    </div>
                                    <div id="collapseTwo" class="collapse" data-parent="">
                                        <div class="card-body">
                    
                                        
                                            <div class="card"><div class="card-body">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    
                                                    <div class="form-group">
                                                        <x-forms.label name="Qualification" :required="false"/>
                                                        <select  name="qua[0][qualification]"
                                                        class="form-control  w-100-p">
                                                        <option value="10th" >10th</option>
                                                        <option value="12th" >12th</option>
                                                        <option value="Bachelor" >Bachelor</option>
                                                        <option value="Master" >Master</option>
                                                        <option value="Other" >Other</option>
                                                    
                                                        </select>
                                                        
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Institute Name" :required="false" />
                                                        <x-forms.input type="text" name="qua[0][institute_name]"
                                                            value="{{ old('institute_name') }}"
                                                            placeholder="Institute Name" />
                                                    </div>
                                                </div>

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Education Board" :required="false"/>
                                                        <x-forms.input type="text" name="qua[0][education_board]"
                                                            value="{{ old('education_board') }}"
                                                            placeholder="Education Board" />
                                                    </div>
                                                </div>
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Passing Year" :required="false" :required="false"/>
                                                        <x-forms.input type="text" name="qua[0][passing_year]"
                                                            value="{{ old('passing_year') }}"
                                                            placeholder="Passing Year" />
                                                    </div>
                                                </div>

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="Grade/Percentage" :required="false"/>
                                                        <x-forms.input type="text" name="qua[0][grade_percentage]"
                                                            value="{{ old('grade_percentage') }}"
                                                            placeholder="Grade/Percentage" />
                                                    </div>
                                                </div>
                                                {{-- <div class="col-md-4">
                                                    <div class="">
                                                    <x-forms.label name="Add More" :required="false"/>
                                                    
                                                    <div class="addBtn">
                                                        <a role="button" class="btn bg-primary text-light"><i class="fas fa-plus"></i></a>
                                                    
                                                    </div>
                                                    </div>
                                                </div> --}}
                                            </div>
                                                </div></div>
                                            
                                            <div class="row" id="addRow">
                                                <div class="addBtn ">
                                                    <a role="button" class="btn bg-primary float-right text-light add-row-btn">
                                                        <i class="fas fa-plus"> Add More</i>
                                                    </a>
                                                </div>
                                            </div>

                                            <div class="row">
                                                
                                                <div class="col-md-3">
                                                    <div class="form-group">
                                                        <x-forms.label name="language_proficiency_req"
                                                            :required="false" />
                                                        <select name="language_proficiency_req"
                                                            class="form-control w-100-p" id="language_proficiency_req">
                                                            {{-- <option value="">
                                                                    {{ __('all') }}
                                                                </option> --}}
                                                                <option
                                                                    {{ old('language_proficiency_req') == '0' ? 'selected' : '' }}
                                                                    value="0">
                                                                    {{ __('no') }}
                                                                </option>
                                                            <option
                                                                {{ old('language_proficiency_req') == '1' ? 'selected' : '' }}
                                                                value="1">
                                                                {{ __('yes') }}
                                                            </option>
                                                        </select>
                                                    </div>
                                                </div>

                                                <div class="col-md-3 optional-field">
                                                    <div class="form-group">
                                                        <x-forms.label name="Test Name" :required="false" />
                                                        <x-forms.input type="text" name="test_name" id="test_name"
                                                            value="{{ old('test_name') }}"
                                                            placeholder="Test Name" />
                                                    </div>
                                                </div>
                                                <div class="col-md-3 optional-field">
                                                    <div class="form-group">
                                                        <x-forms.label name="Test Scores" :required="false" />
                                                        <x-forms.input type="text" name="test_scores" id="test_scores"
                                                            value="{{ old('grade_percentage') }}"
                                                            placeholder="Test Scores" />
                                                    </div>
                                                </div>

                                                <div class="col-md-3 optional-field">
                                                    <div class="form-group">
                                                        <x-forms.label name="Test Taken Date" :required="false" />
                                                        <x-forms.input type="text" name="test_taken_date" id="test_taken_date"
                                                            value="{{ old('test_taken_date') }}"
                                                            placeholder="Test Taken Date" />
                                                    </div>
                                                </div>
                                            </div>




                                        </div>
                                    </div>
                                </div>
                                <div class="card">
                                    <div class="card-header collapsed fw-bold accordion-bg-light"
                                        data-toggle="collapse" data-target="#collapseThree" aria-expanded="false">
                                        <span class="title">{{ __('destination') }}</span>
                                        <span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>
                                    </div>
                                    <div id="collapseThree" class="collapse" data-parent="">
                                        <div class="card-body">
                                            <div class="row">
                                                {{-- <div class="form-group col-4">
                                                    <x-forms.label name="preferred_country" :required="false" />
                                                    <select name="preferred_country"
                                                    class="form-control @error('preferred_country') is-invalid @enderror w-100-p select2bs4"
                                                    id="preferredCountrySelect">
                                                    <option>Country</option>
                                                    <option>+91</option>
                                                    </select>
                                                    <x-forms.error name="preferred_country" />
                                                </div> --}}

                                                <div class="form-group col-4">
                                                    <x-forms.label name="preferred_country" :required="false" />
                                                    <select name="preferred_country[]"
                                                        class="form-control select2bs4 {{ error('preferred_country') }}"
                                                        id="preferred_country" multiple>
                                                        <option value="" class="d-none">
                                                            {{ __('select_country') }}
                                                        </option>
                                                        @isset($countries)
                                                        @foreach ($countries as $country)
                                                            <option

                                                            @if (!empty($preferred_country_ids)) 
                                                                @foreach ($preferred_country_ids as $key => $preferred_country_id)
                                                                    {{ $country->id == old('preferred_country') ? 'selected' : '' }}   
                                                                @endforeach 
                                                            @endif
                                                                {{-- {{ $country->id == old('preferred_country', @$candidate->destination[0]->preferred_country) ? 'selected' : '' }} --}}
                                                                value="{{ $country->id }}">
                                                                {{ $country->name }}
                                                            </option>
                                                        @endforeach
                                                        @endisset
                                                    </select>
                                                    <x-forms.error name="preferred_country" />
                                                </div>

                                                {{-- <div class="form-group col-4">
                                                    <x-forms.label name="{{ __('preferred_state') }}" />
                                                    <x-forms.input type="text" name="preferred_state"
                                                            value="{{ old('preferred_state', @$candidate->destination[0]->preferred_state) }}"
                                                            placeholder="{{ __('preferred_state') }}" />
                                                    <x-forms.error name="preferred_state" />
                                                </div> --}}


                                                <div class="form-group col-4">

                                                    <x-forms.label name="{{ __('preferred_city') }}" :required="false" />

                                                    <x-forms.input type="text" name="preferred_city"
                                                            value="{{ old('preferred_city') }}"
                                                            placeholder="{{ __('preferred_city') }}" />
                                                    <x-forms.error name="preferred_city" />
                                                </div>

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="{{ __('preferred_program') }}"
                                                            :required="false" />
                                                        <select name="preferred_program" id="preferred_program"
                                                            class="form-control  select2bs4 @error('preferred_program') is-invalid @enderror">
                                                            <option value="" class="d-none">
                                                                {{ __('select_preferred_program') }}
                                                            </option>
                                                            <option
                                                                {{ 'Bachelors' == old('preferred_program') ? 'selected' : '' }}
                                                                value="Bachelors">{{ __('Bachelors') }}</option>
                                                            <option
                                                                {{ 'Masters' == old('preferred_program') ? 'selected' : '' }}
                                                                value="Masters">{{ __('Masters') }}</option>
                                                            <option
                                                                {{ 'PhD' == old('preferred_program') ? 'selected' : '' }}
                                                                value="PhD">{{ __('PhD') }}</option>
                                                        </select>
                                                        @error('preferred_program')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>

                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <x-forms.label name="{{ __('intake') }}"
                                                            :required="false" />
                                                        <select name="intake" id="intake"
                                                            class="form-control  select2bs4 @error('intake') is-invalid @enderror">
                                                            <option value="" class="d-none">
                                                                {{ __('select_intake') }}
                                                            </option>
                                                            <option
                                                                {{ "Sept'23" == old('intake') ? 'selected' : '' }}
                                                                value="Sept'23">Sept'23</option>
                                                            <option
                                                                {{ "Jan'24" == old('intake') ? 'selected' : '' }}
                                                                value="Jan'24">Jan'24</option>
                                                            <option
                                                                {{ "May'24" == old('intake') ? 'selected' : '' }}
                                                                value="May'24">May'24</option>
                                                            <option
                                                                {{ "E46 Sept'24" == old('intake') ? 'selected' : '' }}
                                                                value="E46 Sept'24">E46 Sept'24</option>
                                                        </select>
                                                        @error('intake')
                                                            <span class="invalid-feedback"
                                                                role="alert">{{ __($message) }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="form-group col-4">
                                                    <x-forms.label name="Preferred Course" :required="false" />
                                                    <textarea type="text" class="form-control" name="preferred_course" placeholder="Enter Preferred Course">{{ old('preferred_course') }}</textarea>
                                                </div>
                                            </div>





                                        </div>
                                    </div>
                                </div>
                            

                                {{-- <div class="card">
                                    <div class="card-header collapsed fw-bold accordion-bg-light"
                                        data-toggle="collapse" data-target="#collapseSix" aria-expanded="false"
                                        aria-controls="collapseSix">
                                        <span class="title">Documents</span>
                                        <span class="accicon"><i class="fas fa-angle-down rotate-icon"></i></span>
                                    </div>
                                    <div id="collapseSix" class="collapse" data-parent="">
                                        <div class="card-body">
                                            -- Documents --
                                        </div>
                                    </div>
                                </div> --}}
                            </div>
                        </div>
                    </div>
            
                </form>
            </div>

    @endsection

    @section('style')
        <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2/css/select2.min.css">
        <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
        <link rel="stylesheet" href="{{ asset('backend') }}/plugins/dropify/css/dropify.min.css">
        <link rel="stylesheet" href="{{ asset('frontend') }}/secondary-theme/assets/css/bootstrap-datepicker.min.css">
        {{-- <link rel="stylesheet" href="{{ asset('frontend') }}/secondary-theme/assets/css/bootstrap-datepicker.min.css"> --}}


    <style>
        .ck-editor__editable_inline {
            min-height: 300px;
        }

        .select2-results__option[aria-selected=true] {
            display: none;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
            color: #fff;
            border: 1px solid #fff;
            background: #007bff;
            border-radius: 30px;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
            color: #fff;
        }

        .card-header .title {
            font-size: 17px;
            color: #000;
        }

        .card-header .accicon {
            float: right;
            font-size: 20px;
            width: 1.2em;
        }

        .card-header {
            cursor: pointer;
            border-bottom: none;
        }

        .card {
            border: 1px solid #ddd;
        }

        .card-body {
            border-top: 1px solid #ddd;
        }

        .card-header:not(.collapsed) .rotate-icon {
            transform: rotate(180deg);
        }
    </style>

    @endsection

    @section('script')
        <script src="{{ asset('backend/plugins/select2/js/select2.full.min.js') }}"></script>
        <script src="{{ asset('frontend/secondary-theme/assets/js/bootstrap-datepicker.min.js')}}"></script>

        <script src="{{ asset('backend') }}/plugins/dropify/js/dropify.min.js"></script>

        <script src="{{ asset('frontend/secondary-theme/assets/js/bootstrap-datepicker.min.js') }}"></script>
        {{-- <script src="{{ asset('frontend') }}/secondary-theme/assets/js/ckeditor.min.js"></script> --}}
        <script>
            $('.select2-taggable').select2({
                theme: 'bootstrap4',
                tags: true
            })


            $('#customFile').on('change', function(event) {
                $('#defaulthide').addClass('d-block')
                $('#defaulthide').removeClass('d-none')
            });
            // dropify image
            $('.dropify').dropify();
            //init datepicker
            $(document).ready(function() {
                $('#birth_date').datepicker({
                    format: 'dd-mm-yyyy'
                });

                $('#test_taken_date').datepicker({
                    format: 'dd-mm-yyyy'
                });
            });

            
            //Initialize Select2 Elements
            $('.select2bs4').select2({
                theme: 'bootstrap4'
            })

            $('.select2bs44').select2({
                theme: 'bootstrap4',
                placeholder: 'Select Source'
            })

            $(document).ready(function() {
            
                $.ajax({
                    url: "{{ url('stageArray.php') }}",
                    success: function(res) {
                    $("#stageSelect").html(res);
                    }
                });

                $.ajax({
                url: "{{ url('countryArray.php') }}",
                success: function(res) {
                    $("#countrySelect").html(res);
                }
                });

                $(".optional-field").hide();
                $("#language_proficiency_req").change(function(){
                    var req_yes = this.value;
                    
                    $("#test_taken_date, #test_scores, #test_name").val(" ");
                    $(".optional-field").hide();
                    if(req_yes == "1"){
                        $(".optional-field").show();
                    }
                
                });

                $('#preferred_country').on('change', function() {
                    console.log("test");
                    var country_id = this.value;
                    $.ajax({
                        url: "{{ route('admin.universityGetStateByCountry') }}",
                        type: "POST",
                        data: {
                            country_id: country_id,
                            _token: '{{ csrf_token() }}'
                        },
                        dataType: 'json',
                        success: function(result) {
                            $('#preferred_state').html(
                                    '<option value="">{{ __('select_state') }}</option>')
                                .removeAttr(
                                    'disabled');
                            $.each(result.states, function(key, value) {
                                $("#preferred_state").append('<option value="' +
                                    value.id + '">' + value.name +
                                    '</option>');
                            });
                        }
                    });

                });
            });
            // view cities by state
            $(document).ready(function() {
                $('#preferred_state').on('change', function() {
                    var state_id = this.value;
                    $.ajax({
                        url: "{{ route('admin.universityGetCityByCountry') }}",
                        type: "POST",
                        data: {
                            state_id: state_id,
                            _token: '{{ csrf_token() }}'
                        },
                        dataType: 'json',
                        success: function(result) {

                        console.log(result);
                            $('#preferred_city').html(
                                    '<option value="">{{ __('select_city') }}</option>')
                                .removeAttr(
                                    'disabled');
                            $.each(result.cities, function(key, value) {
                                $("#preferred_city").append('<option value="' +
                                    value.id + '">' + value.name +
                                    '</option>');
                            });
                        }
                    });

                });
            });
        </script>
        <script>
                    function formatRows(index) {
                var row = `
                    <div class="card"><div class="card-body">
                    <div class="row">
                        <div class="col-md-4">
                            <input type="text" name="qua[${index}][id]"
                                value="" placeholder="id" hidden/>
                            <div class="form-group">
                                <x-forms.label name="Qualification" />
                                <select name="qua[${index}][qualification]"
                                    class="form-control w-100-p">
                                    <option value="" >Select Qualification</option>
                                    <option value="10th" >10th</option>
                                    <option value="12th" >12th</option>
                                    <option value="Bachelor">Bachelor</option>
                                    <option value="Master">Master</option>
                                    <option value="Other">Other</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <x-forms.label name="Institute Name" :required="false" />
                                <x-forms.input type="text" name="qua[${index}][institute_name]"
                                    value=""
                                    placeholder="Institute Name" />
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="form-group">
                                <x-forms.label name="Education Board" />
                                <x-forms.input type="text" name="qua[${index}][education_board]"
                                    value=""
                                    placeholder="Education Board" />
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <x-forms.label name="Passing Year" :required="false" />
                                <x-forms.input type="text" name="qua[${index}][passing_year]"
                                    value=""
                                    placeholder="Passing Year" />
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="form-group">
                                <x-forms.label name="Grade/Percentage" />
                                <x-forms.input type="text" name="qua[${index}][grade_percentage]"
                                    value=""
                                    placeholder="Grade/Percentage" />
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="">
                            <x-forms.label name="Delete Row" />
                            <div>
                                <a role="button" onClick="deleteRow(this)" class="btn bg-danger text-light"><i class="fas fa-times"></i></a>
                            </div>
                            </div>
                        </div>
                    </div>
                    </div></div>
                `;
                return row;
            }
        
            function deleteRow(trash) {
                $(trash).closest('.card').remove();
            };
        

            var currentIndex = 1;
            function addRow() {
            $(formatRows(currentIndex)).insertBefore('#addRow');
                currentIndex++; 
            }

            $('.addBtn').click(function() {
                addRow();
            });
            </script>
    @endsection