@extends('user.layouts.app')

<link href=" /css/file-upload-with-preview.min.css" rel="stylesheet" type="text/css" />

@section('content')
    <div class="container-fluid">
        <div class="header">
            <h1 class="header-title" style="margin-top:-40px !important;">
                Settings
            </h1>
        </div>

        <div class="row" style="margin-top:-40px !important;">
            <div class="col-md-3 col-xl-2">

                <div class="card">
                    <div class="card-header">
                        <h5 class="card-title mb-0">Profile Settings</h5>
                    </div>

                    <div class="list-group list-group-flush" role="tablist">
                        <a class="list-group-item list-group-item-action active" data-bs-toggle="list" href="#account"
                            role="tab">
                            Account
                        </a>
                        <a class="list-group-item list-group-item-action" id="password_tab" data-bs-toggle="list" href="#password"
                            role="tab">
                            Password
                        </a>
                        <a class="list-group-item list-group-item-action" data-bs-toggle="list" href="#all_profiles"
                            role="tab">
                            All Profiles
                        </a>
                        <a class="list-group-item list-group-item-action" onclick="setprofiles();" data-bs-toggle="list" href="#apply_new"
                            role="tab">
                            Apply New Profile
                        </a>
                        <a class="list-group-item list-group-item-action" data-bs-toggle="list" href="#id_card"
                            role="tab">
                            Download Identity Card
                        </a>
                        {{-- <a class="list-group-item list-group-item-action" data-bs-toggle="list" href="#" role="tab">
										Widgets
									</a>
									<a class="list-group-item list-group-item-action" data-bs-toggle="list" href="#" role="tab">
										Your data
									</a>
									<a class="list-group-item list-group-item-action" data-bs-toggle="list" href="#" role="tab">
										Delete account
									</a> --}}
                    </div>
                </div>
            </div>

            <div class="col-md-9 col-xl-10">
                <div class="tab-content">
    {{--------------------------Account Section Start=====---------------}}
                    <div class="tab-pane fade show active" id="account" role="tabpanel">
                        <div class="alert alert-success alert-dismissible" id="alert_success" role="alert" style="display: none">
                            <div class="alert-icon">
                                <i class="far fa-fw fa-bell"></i>
                            </div>
                            <div class="alert-message">
                                <strong>successfully Saved</strong>
                            </div>
                            <button type="button" class="btn-close btn-close-white" data-bs-dismiss="alert"
                                aria-label="Close"></button>
                        </div>

                            <div class="alert alert-warning alert-dismissible" id="alert_warning" role="alert" style="display: none">
                                <div class="alert-icon">
                                    <i class="far fa-fw fa-bell"></i>
                                </div>
                                <div class="alert-message">
                                    <strong></strong>
                                </div>
                                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="alert"
                                    aria-label="Close"></button>
                            </div>
                        <div class="card">
                            <div class="card-header">
                                <div class="card-actions float-end" style="display: none">
                                    <a href="#" class="me-1">
                                        <i class="align-middle" data-feather="refresh-cw"></i>
                                    </a>
                                    <div class="d-inline-block dropdown show">
                                        <a href="#" data-bs-toggle="dropdown" data-bs-display="static">
                                            <i class="align-middle" data-feather="more-vertical"></i>
                                        </a>

                                        <div class="dropdown-menu dropdown-menu-end">
                                            <a class="dropdown-item" href="#">Action</a>
                                            <a class="dropdown-item" href="#">Another </a>
                                            <a class="dropdown-item" href="#">Something else here</a>
                                        </div>
                                    </div>
                                </div>
                                <h5 class="card-title mb-0">Public info</h5>
                            </div>

                            <div class="card-body">
                                <form>
                                    <div class="row">
                                        <div class="col-md-8">
                                            <div class="mb-3">
                                                <label for="UsernameEmail">Username/Email</label>
                                                <input type="email" class="form-control" value="{{ $user_info->email }}"
                                                    id="UsernameEmail" placeholder="Username/Email" disabled>
                                            </div>
                                            <div class="mb-3">
                                                <label for="inputUsername">Biography</label>
                                                <textarea rows="2" class="form-control" id="inputBio" placeholder="Tell something about yourself">{{ Auth::user()->biography }}</textarea>
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="text-center">

                                                <img alt="no-image" src="{{$userDocs->profile_image}}" id="profile_image" class="rounded-circle img-responsive mt-2"
                                                width="128" height="128" />
                                            <div class="mt-2">
                                                <input type="file" class="" name="profileImageUpload" id="profileImageUpload" style="display: none;" placeholder="Profile-Picture" onchange="profileChange()" accept="image/*">
                                                <button type="button" class="btn btn-primary "  id="docImageUploadButton" onclick="document.getElementById('profileImageUpload').click();"  ><i class="fas fa-upload"></i> Upload</button>
                                            </div>
                                                {{-- <small>For best results, use an image at least 128px by 128px in .jpg
                                                    format</small> --}}
                                            </div>
                                        </div>
                                    </div>

                                    <button type="button" class="btn btn-primary" onclick="updateAccount({{ Auth::user()->id }})">Save changes</button>
                                </form>

                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <div class="card-actions float-end">
                                    {{-- <button type="button" class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#viewDocumentsModal">View-Documents</button> --}}

                                    {{-- <div class="d-inline-block dropdown show" >
													<a href="#" data-bs-toggle="dropdown" data-bs-display="static">
														<i class="align-middle" data-feather="more-vertical"></i>
													</a>

													<div class="dropdown-menu dropdown-menu-end">
														<a class="dropdown-item" href="#">Action</a>
														<a class="dropdown-item" href="#">Another </a>
														<a class="dropdown-item" href="#">Something else here</a>
													</div>
												</div> --}}
                                </div>
                                <h5 class="card-title mb-0">Private info</h5>
                            </div>
                            <div class="card-body">
                                <form>
                                    <div class="row">
                                        <div class="mb-3 col-md-4">
                                            <label for="inputFirstName">First name</label>
                                            <input type="text" class="form-control" id="inputFirstName"
                                                value="{{ $user_info->fname }}" placeholder="First name" disabled>
                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="inputLastName">Middle name</label>
                                            <input type="text" class="form-control" id="inputMiddleName"
                                                value="{{ $user_info->mname }}" placeholder="Middle name" disabled>
                                        </div>

                                        <div class="mb-3 col-md-4">
                                            <label for="inputLastName">Last name</label>
                                            <input type="text" class="form-control"
                                                id="inputLastName"value="{{ $user_info->lname }}" placeholder="Last name"
                                                disabled>
                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="mb-3 col-md-4">
                                            <label for="dob">Date Of Birth*</label>
                                            <input type="date" class="form-control" value="{{ Auth::user()->dob }}"
                                                id="dob" name="dob" disabled>
                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="gender">Gender*</label>
                                            <div class="form-control">
                                                <label class="form-check form-check-inline">
                                                    @if (Auth::user()->gender == 1)
                                                        <input type="radio" class="form-check-input" name="gender"
                                                            value="1" checked disabled>
                                                    @else
                                                        <input type="radio" class="form-check-input" name="gender"
                                                            value="1" disabled>
                                                    @endif
                                                    <span class="form-check-label">
                                                        Male
                                                    </span>
                                                </label>
                                                <label class="form-check form-check-inline">
                                                    @if (Auth::user()->gender == 2)
                                                        <input type="radio" class="form-check-input" name="gender"
                                                            value="2" checked disabled>
                                                    @else
                                                        <input type="radio" class="form-check-input" name="gender"
                                                            value="2" disabled>
                                                    @endif
                                                    <span class="form-check-label">
                                                        Female
                                                    </span>
                                                </label>
                                                <label class="form-check form-check-inline">
                                                    @if (Auth::user()->gender == 2)
                                                        <input type="radio" class="form-check-input" name="gender"
                                                            value="3" checked disabled>
                                                    @else
                                                        <input type="radio" class="form-check-input" name="gender"
                                                            value="3" disabled>
                                                    @endif
                                                    <span class="form-check-label">
                                                        Other
                                                    </span>
                                                </label>
                                            </div>

                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="contact">Contact</label>
                                            <input type="text" disabled class="form-control"
                                                value="{{ $user_info->mobile }}" id="contact" placeholder="Contact"
                                                disabled>
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="mb-3 col-md-4">
                                            <label for="inputCountry">Country</label>
                                            <select id="inputCountry" class="form-control" disabled>
                                                <option value="" selected>-Select-Country-</option>
                                                @foreach ($countries as $country)
                                                    @if ($country->id == Auth::user()->country_id)
                                                        <option value="{{ $country->id }}" selected>{{ $country->name }}
                                                        </option>
                                                    @else
                                                        <option value="{{ $country->id }}">{{ $country->name }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="inputState">State</label>
                                            <select id="inputState" class="form-control" disabled>
                                                <option value="" selected>-Select-State-</option>
                                                @foreach ($states as $state)
                                                    @if ($state->id == Auth::user()->state_id)
                                                        <option value="{{ $state->id }}" selected>{{ $state->name }}
                                                        </option>
                                                    @else
                                                        <option value="{{ $state->id }}">{{ $state->name }}</option>
                                                    @endif
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="inputState">City</label>
                                            <input type="text" class="form-control" id="inputCity"
                                                value="{{ Auth::user()->city_name }}" disabled>

                                        </div>

                                    </div>

                                    <div class="row">
                                        <div class="mb-3 col-md-4">
                                            <label for="inputZip">Pincode/Zip</label>
                                            <input type="text" class="form-control" id="inputZip"
                                                value="{{ Auth::user()->pincode }}" disabled>
                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="inputState">Document-Type</label>

                                            <div class="input-group mb-3">
                                                <select class="form-select flex-grow-1" id="document_type"
                                                    placeholder="Document-Type" disabled>
                                                    @if ($userDocs->document_type == 1 && $userDocs->aadhar_type == 1)
                                                        <option value="1" selected>Aadhar(Basic)</option>
                                                    @elseif($userDocs->document_type == 1 && $userDocs->aadhar_type == 2)
                                                        <option value="2" selected>Aadhar(Smart-Card)</option>
                                                    @else
                                                        <option value="2" selected>Passport</option>
                                                    @endif
                                                </select>
                                                <button class="btn btn-primary" type="button" data-bs-toggle="modal"
                                                    data-bs-target="#viewDocumentsModal">View</button>
                                            </div>
                                            {{-- <span style="float: right;" class="badge bg-success">Basic</span> --}}
                                        </div>
                                        <div class="mb-3 col-md-4">
                                            <label for="inputUsername">Address</label>
                                            <textarea rows="2" class="form-control" id="inputAddress" placeholder="Address" disabled>{{ Auth::user()->address }}</textarea>
                                        </div>
                                    </div>
                                    <button type="submit" class="btn btn-primary" style="display: none">Save
                                        changes</button>
                                </form>

                            </div>
                        </div>
                    </div>
{{--------------------------Account Section End=====---------------}}

{{--------------------------Change Password Section Start=====---------------}}
                    <div class="tab-pane fade" id="password" role="tabpanel">
                        @if (session('success'))
                        <div class="alert alert-success alert-dismissible" role="alert">
                            <div class="alert-icon">
                                <i class="far fa-fw fa-bell"></i>
                            </div>
                            <div class="alert-message">
                                <strong>{!! session('success') !!}</strong>
                            </div>
                            <button type="button" class="btn-close btn-close-white" data-bs-dismiss="alert"
                                aria-label="Close"></button>
                        </div>
                        @if (session('error'))
                            <div class="alert alert-warning alert-dismissible" role="alert">
                                <div class="alert-icon">
                                    <i class="far fa-fw fa-bell"></i>
                                </div>
                                <div class="alert-message">
                                    <strong>{!! session('error') !!}</strong>
                                </div>
                                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="alert"
                                    aria-label="Close"></button>
                            </div>
                        @endif
                    @endif
                        <div class="card">
                            <div class="card-body">
                                <h5 class="card-title">Password</h5>
                                {{-- <form action="{{Request::route()->getPrefix()}}/change_password" method="POST" > --}}
                                    {{-- <form action="{{ route(trim(Request::route()->getPrefix(),'/').'/change_password') }}" method="post" > --}}

                                <form action="{{ route(trim(Request::route()->getPrefix(),'/').'.change_password') }}" method="POST" >
                                    {{ csrf_field() }}
                                    <div class="mb-3">
                                        <label for="current_password">Current password</label>
                                        <input type="password" class="form-control" id="current_password" name="current_password" {{ $errors->has('current_password') ? 'autofocus' : 'null' }}>
                                        <small><a href="#">Forgot your password?</a></small>
                                        <small class="text-danger">{{$errors->first('current_password')}}</small>

                                    </div>
                                    <div class="mb-3">
                                        <label for="new_password">New password</label>
                                        <input type="password" class="form-control" id="new_password" name="new_password" {{ $errors->has('new_password') ? 'autofocus' : 'null' }}>
                                        <small class="text-danger">{{$errors->first('new_password')}}</small>

                                    </div>
                                    <div class="mb-3">
                                        <label for="confirm_password">Confirm password</label>
                                        <input type="password" class="form-control" id="confirm_password" name="confirm_password" {{ $errors->has('confirm_password') ? 'autofocus' : 'null' }}>
                                        <small class="text-danger">{{$errors->first('confirm_password')}}</small>

                                    </div>
                                    <button type="submit" class="btn btn-primary" >Save changes</button>
                                </form>

                            </div>
                        </div>
                    </div>
{{--------------------------Change Password Section End=====---------------}}

{{--------------------------All Profiles Section Start=====---------------}}
                    <div class="tab-pane fade" id="all_profiles" role="tabpanel">
                        <div class="card" style="height:700px">
                            <div class="card-body">
                                <h5 class="card-title">All Profiles</h5>

                                <div class="col-12 col-lg-12">
                                    <div class=" ">

                                        <ul class="nav nav-pills" role="tablist">
                                         @foreach ($alluserProfiles as $profile)
                                            @if("/".strtolower($profile->profile_name) == Request::route()->getPrefix())
                                            <li class="nav-item"><a class="nav-link active" href="#{{$profile->profile_name}}_"
                                                    data-bs-toggle="tab" role="tab">{{$profile->profile_name}}</a></li>
                                               @else
                                                    <li class="nav-item"><a class="nav-link " href="#{{$profile->profile_name}}_"
                                                        data-bs-toggle="tab" role="tab">{{$profile->profile_name}}</a></li>
                                                        @endif
											@endforeach
                                        </ul>

                                        <div class="tab-content" style="height: 600px; overflow:auto">
                                            @foreach ($alluserProfiles as $profile)

                                               @if("/".strtolower($profile->profile_name) == Request::route()->getPrefix())

                                                    <div class="tab-pane active" id="{{$profile->profile_name}}_" role="tabpanel">
                                                        <div class="col-sm-12 col-lg-12 col-md-12 col-xs-12 text-center" >
                                                            <h5 class="card-title my-2">{{$profile->profile_name}}'s Supporting Document</h5>
                                                                <center>
                                                                         @if($profile->profile_id != 4 )                                                                            
                                                                                <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id=""><br />
                                                                                  <br />
                                                                                    <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                                    style="padding:10px;width:25%" id=""> View</a>                                                                           
                                                                         @else                                                                                                                                                      
                                                                                @if($profile->supporting_doc_path != null)                                                                   
                                                                                <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id=""><br /><br />
                                                                                    <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                                    style="padding:10px;width:25%" id=""> View</a>
                                                                                
                                                                                @else 
                                                                                    <h3>No document(s) required for the Official role you have
                                                                                    selected</h3>
                                                                                @endif
                                                                        @endif
                                                            
                                                                </center>           
                                                     </div>
                                                    </div>

                                                @else
                                                    <div class="tab-pane" id="{{$profile->profile_name}}_" role="tabpanel">
                                                        {{-- <h4 class="tab-title" style="text-align: right; margin-right:20px;">LEVEL:
                                                            @if($profile->level == 1)
                                                            New
                                                            @elseif($profile->level == 2)
                                                            State
                                                            @elseif($profile->level == 3)
                                                            National
                                                            @elseif($profile->level == 4)
                                                            International
                                                            @endif
                                                        </h4> --}}
                                                        <div class="col-sm-12 col-lg-12 col-md-12 col-xs-12 text-center">


                                                                    <!-- display profile other than official and if supporting documents  is available -->
                                                                @if($profile->profile_id != 4 && $profile->supporting_doc_path != null  ) 
                                                                    @if($profile->approved == -1)
                                                                    <script src="/js/profile_setting_rejection.js"></script>
                                                                    <br>
                                                                    <p>{{ __('Your application "'. $profile->application_id.'" has got on-hold due to following reason. We request to do the needful changes and submit once again.') }}
                                                                        </p>
                                                                            <center>
                                                                            <!--  <p>
                                                                                    <i class="fa-solid fa-handshake " style="font-size:30pt;"></i></p>  -->
                                                                                    <h5 class="text-warning">
                                                                                             @if($profile->remark != null || $profile->remark !="")

                                                                                            Reason :  {!! $profile->remark !!}
                                                                                            @else
                                                                                            Reason :  No Reason specified while verifying

                                                                                            @endif
                                                                                     </h5>
                                                                                     
                                                                            </center>   
                                                                     
                                                                        @if($profile->profile_id == 1)
                                                                        @include('user.athlete_setting_profile_rejection');
                                                                                        
                                                                                   <script> 
                                                                                   

                                                                                   var profile = {!! json_encode($profile, JSON_HEX_TAG) !!};
                                                                                   console.log(profile)
                                                                                   document.getElementById('user_docs_id_1').value= profile['id']
                                                                                   document.getElementById('profile_portal_id_1').value= profile['profile_portal_id']
                                                                                   document.getElementById('old_role_1').value= profile['profile_id']

                                                                                   document.getElementById('role_rejection_1').value= profile['profile_id']
                                                                                   document.getElementById(profile['profile_id']).disabled= false;

                                                                                   switch (profile['profile_id']) {
                                                                                       case 1:
                                                                                           document.getElementById("professional_athlete_div_rejection_1").style.display = "block";
                                                                                           document.getElementById('level_athlete_rejection_1').value = profile['level']; 
                                                                                           document.getElementById('level_athlete_rejection_1').classList.add("step_1_rejection_1");
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_athlete_embed_rejection_1.src=src;
                                                                                           certificate_athlete_anchor_rejection_1.href=src;
                                                                                           document.getElementById("certificate_athlete_anchor_rejection_1").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 2:
                                                                                           document.getElementById("professional_coach_div_rejection_1").style.display = "block";
                                                                                           // $('#professional_coach_div').show();
                                                                                           document.getElementById('level_coach_rejection_1').value = profile['level'];
                                                                                           document.getElementById('level_coach_rejection_1').classList.add("step_1_rejection_1");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_coach_embed_rejection_1.src=src;
                                                                                           certificate_coach_anchor_rejection_1.href=src;
                                                                                           document.getElementById("certificate_coach_anchor_rejection_1").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 3:
                                                                                           document.getElementById("professional_judge_div_rejection_1").style.display = "block";
                                                                                           document.getElementById('level_judge_rejection_1').value = profile['level'];
                                                                                           document.getElementById('level_judge_rejection_1').classList.add("step_1_rejection_1");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_judge_embed_rejection_1.src=src;
                                                                                           certificate_judge_anchor_rejection_1.href=src;
                                                                                           document.getElementById("certificate_judge_anchor_rejection_1").style.display = "inherit";
                                                                                           break;
                                                                                       case 4:

                                                                                           document.getElementById("professional_official_div_rejection_1").style.display = "block";
                                                                                           document.getElementById("official_div_rejection_1").style.display = "block";
                                                                                           document.getElementById('role_official_rejection_1').value= profile['sub_id']
                                                                                           document.getElementById('role_official_rejection_1').classList.add("step_1_rejection_1");
                                                                                           document.getElementById('old_sub_id').value= profile['sub_id']


                                                                                                   if(profile['sub_id'] == 3) {


                                                                                                       document.getElementById("official_doctor_div_rejection_1").style.display = "block";

                                                                                                       var src =  profile['supporting_doc_path'];
                                                                                                       certificate_doctor_embed_rejection_1.src=src;
                                                                                                       certificate_doctor_anchor_rejection_1.href=src;
                                                                                                       document.getElementById("certificate_doctor_anchor_rejection_1").style.display = "inherit";
                                                                                                       
                                                                                                   }else{
                                                                                                       document.getElementById("official_NA_div_rejection_1").style.display = "block";

                                                                                                   }
                                                                                           break;
                                                                                       case 5:
                                                                                          document.getElementById("professional_volunteer_div_rejection_1").style.display = "block";
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           cv_volunteer_embed_rejection_1.src=src;
                                                                                           cv_volunteer_anchor_rejection_1.href=src;
                                                                                           document.getElementById("cv_volunteer_anchor_rejection_1").style.display = "inherit";

                                                                                           break;
                                                                                       default:
                                                                                           break;
                                                                                   }
                                                                                    </script>

                                                                            @elseif($profile->profile_id == 2)
                                                                            @include('user.coach_setting_profile_rejection');
                                                                                    <script> 
                                                                                   

                                                                                   var profile = {!! json_encode($profile, JSON_HEX_TAG) !!};
                                                                                   console.log(profile)
                                                                                   document.getElementById('user_docs_id_2').value= profile['id']
                                                                                   document.getElementById('profile_portal_id_2').value= profile['profile_portal_id']
                                                                                   document.getElementById('old_role_2').value= profile['profile_id']

                                                                                   document.getElementById('role_rejection_2').value= profile['profile_id']
                                                                                   document.getElementById('coach_role_'+profile['profile_id']).disabled= false;

                                                                                   switch (profile['profile_id']) {
                                                                                       case 1:
                                                                                           document.getElementById("professional_athlete_div_rejection_2").style.display = "block";
                                                                                           document.getElementById('level_athlete_rejection_2').value = profile['level']; 
                                                                                           document.getElementById('level_athlete_rejection_2').classList.add("step_1_rejection_2");
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_athlete_embed_rejection_2.src=src;
                                                                                           certificate_athlete_anchor_rejection_2.href=src;
                                                                                           document.getElementById("certificate_athlete_anchor_rejection_2").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 2:
                                                                                           document.getElementById("professional_coach_div_rejection_2").style.display = "block";
                                                                                           // $('#professional_coach_div').show();
                                                                                           document.getElementById('level_coach_rejection_2').value = profile['level'];
                                                                                           document.getElementById('level_coach_rejection_2').classList.add("step_1_rejection_2");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_coach_embed_rejection_2.src=src;
                                                                                           certificate_coach_anchor_rejection_2.href=src;
                                                                                           document.getElementById("certificate_coach_anchor_rejection_2").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 3:
                                                                                           document.getElementById("professional_judge_div_rejection_2").style.display = "block";
                                                                                           document.getElementById('level_judge_rejection_2').value = profile['level'];
                                                                                           document.getElementById('level_judge_rejection_2').classList.add("step_1_rejection_2");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_judge_embed_rejection_2.src=src;
                                                                                           certificate_judge_anchor_rejection_2.href=src;
                                                                                           document.getElementById("certificate_judge_anchor_rejection_2").style.display = "inherit";
                                                                                           break;
                                                                                       case 4:

                                                                                           document.getElementById("professional_official_div_rejection_2").style.display = "block";
                                                                                           document.getElementById("official_div_rejection_2").style.display = "block";
                                                                                           document.getElementById('role_official_rejection_2').value= profile['sub_id']
                                                                                           document.getElementById('role_official_rejection_2').classList.add("step_1_rejection_2");
                                                                                           document.getElementById('old_sub_id').value= profile['sub_id']


                                                                                                   if(profile['sub_id'] == 3) {


                                                                                                       document.getElementById("official_doctor_div_rejection_2").style.display = "block";

                                                                                                       var src =  profile['supporting_doc_path'];
                                                                                                       certificate_doctor_embed_rejection_2.src=src;
                                                                                                       certificate_doctor_anchor_rejection_2.href=src;
                                                                                                       document.getElementById("certificate_doctor_anchor_rejection_2").style.display = "inherit";
                                                                                                       
                                                                                                   }else{
                                                                                                       document.getElementById("official_NA_div_rejection_2").style.display = "block";

                                                                                                   }
                                                                                           break;
                                                                                       case 5:
                                                                                          document.getElementById("professional_volunteer_div_rejection_2").style.display = "block";
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           cv_volunteer_embed_rejection_2.src=src;
                                                                                           cv_volunteer_anchor_rejection_2.href=src;
                                                                                           document.getElementById("cv_volunteer_anchor_rejection_2").style.display = "inherit";

                                                                                           break;
                                                                                       default:
                                                                                           break;
                                                                                   }



                                                                               


                                                                                     </script>

                                                                            @elseif($profile->profile_id == 3)
                                                                            @include('user.judge_setting_profile_rejection');

                                                                                        <script> 
                                                                                   

                                                                                   var profile = {!! json_encode($profile, JSON_HEX_TAG) !!};
                                                                                   console.log(profile)
                                                                                   document.getElementById('user_docs_id_3').value= profile['id']
                                                                                   document.getElementById('profile_portal_id_3').value= profile['profile_portal_id']
                                                                                   document.getElementById('old_role_3').value= profile['profile_id']

                                                                                   document.getElementById('role_rejection_3').value= profile['profile_id']
                                                                                   document.getElementById('judge_role_'+profile['profile_id']).disabled= false;

                                                                                   switch (profile['profile_id']) {
                                                                                       case 1:
                                                                                           document.getElementById("professional_athlete_div_rejection_3").style.display = "block";
                                                                                           document.getElementById('level_athlete_rejection_3').value = profile['level']; 
                                                                                           document.getElementById('level_athlete_rejection_3').classList.add("step_1_rejection_3");
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_athlete_embed_rejection_3.src=src;
                                                                                           certificate_athlete_anchor_rejection_3.href=src;
                                                                                           document.getElementById("certificate_athlete_anchor_rejection_3").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 2:
                                                                                           document.getElementById("professional_coach_div_rejection_3").style.display = "block";
                                                                                           // $('#professional_coach_div').show();
                                                                                           document.getElementById('level_coach_rejection_3').value = profile['level'];
                                                                                           document.getElementById('level_coach_rejection_3').classList.add("step_1_rejection_3");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_coach_embed_rejection_3.src=src;
                                                                                           certificate_coach_anchor_rejection_3.href=src;
                                                                                           document.getElementById("certificate_coach_anchor_rejection_3").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 3:
                                                                                           document.getElementById("professional_judge_div_rejection_3").style.display = "block";
                                                                                           document.getElementById('level_judge_rejection_3').value = profile['level'];
                                                                                           document.getElementById('level_judge_rejection_3').classList.add("step_1_rejection_3");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_judge_embed_rejection_3.src=src;
                                                                                           certificate_judge_anchor_rejection_3.href=src;
                                                                                           document.getElementById("certificate_judge_anchor_rejection_3").style.display = "inherit";
                                                                                           break;
                                                                                       case 4:

                                                                                           document.getElementById("professional_official_div_rejection_3").style.display = "block";
                                                                                           document.getElementById("official_div_rejection_3").style.display = "block";
                                                                                           document.getElementById('role_official_rejection_3').value= profile['sub_id']
                                                                                           document.getElementById('role_official_rejection_3').classList.add("step_1_rejection_3");
                                                                                           document.getElementById('old_sub_id').value= profile['sub_id']


                                                                                                   if(profile['sub_id'] == 3) {


                                                                                                       document.getElementById("official_doctor_div_rejection_3").style.display = "block";

                                                                                                       var src =  profile['supporting_doc_path'];
                                                                                                       certificate_doctor_embed_rejection_3.src=src;
                                                                                                       certificate_doctor_anchor_rejection_3.href=src;
                                                                                                       document.getElementById("certificate_doctor_anchor_rejection_3").style.display = "inherit";
                                                                                                       
                                                                                                   }else{
                                                                                                       document.getElementById("official_NA_div_rejection_3").style.display = "block";

                                                                                                   }
                                                                                           break;
                                                                                       case 5:
                                                                                          document.getElementById("professional_volunteer_div_rejection_3").style.display = "block";
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           cv_volunteer_embed_rejection_3.src=src;
                                                                                           cv_volunteer_anchor_rejection_3.href=src;
                                                                                           document.getElementById("cv_volunteer_anchor_rejection_3").style.display = "inherit";

                                                                                           break;
                                                                                       default:
                                                                                           break;
                                                                                   }


                                                                                    </script>

                                                                                @elseif($profile->profile_id == 5)
                                                                                @include('user.volunteer_setting_profile_rejection');

                                                                                        <script> 
                                                                                   

                                                                                   var profile = {!! json_encode($profile, JSON_HEX_TAG) !!};
                                                                                   console.log(profile)
                                                                                   document.getElementById('user_docs_id_5').value= profile['id']
                                                                                   document.getElementById('profile_portal_id_5').value= profile['profile_portal_id']
                                                                                   document.getElementById('old_role_5').value= profile['profile_id']

                                                                                   document.getElementById('role_rejection_5').value= profile['profile_id']
                                                                                   document.getElementById('volunteer_role_'+profile['profile_id']).disabled= false;

                                                                                   switch (profile['profile_id']) {
                                                                                       case 1:
                                                                                           document.getElementById("professional_athlete_div_rejection_5").style.display = "block";
                                                                                           document.getElementById('level_athlete_rejection_5').value = profile['level']; 
                                                                                           document.getElementById('level_athlete_rejection_5').classList.add("step_1_rejection_5");
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_athlete_embed_rejection_5.src=src;
                                                                                           certificate_athlete_anchor_rejection_5.href=src;
                                                                                           document.getElementById("certificate_athlete_anchor_rejection_5").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 2:
                                                                                           document.getElementById("professional_coach_div_rejection_5").style.display = "block";
                                                                                           // $('#professional_coach_div').show();
                                                                                           document.getElementById('level_coach_rejection_5').value = profile['level'];
                                                                                           document.getElementById('level_coach_rejection_5').classList.add("step_1_rejection_5");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_coach_embed_rejection_5.src=src;
                                                                                           certificate_coach_anchor_rejection_5.href=src;
                                                                                           document.getElementById("certificate_coach_anchor_rejection_5").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 3:
                                                                                           document.getElementById("professional_judge_div_rejection_5").style.display = "block";
                                                                                           document.getElementById('level_judge_rejection_5').value = profile['level'];
                                                                                           document.getElementById('level_judge_rejection_5').classList.add("step_1_rejection_5");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_judge_embed_rejection_5.src=src;
                                                                                           certificate_judge_anchor_rejection_5.href=src;
                                                                                           document.getElementById("certificate_judge_anchor_rejection_5").style.display = "inherit";
                                                                                           break;
                                                                                       case 4:

                                                                                           document.getElementById("professional_official_div_rejection_5").style.display = "block";
                                                                                           document.getElementById("official_div_rejection_5").style.display = "block";
                                                                                           document.getElementById('role_official_rejection_5').value= profile['sub_id']
                                                                                           document.getElementById('role_official_rejection_5').classList.add("step_1_rejection_5");
                                                                                           document.getElementById('old_sub_id').value= profile['sub_id']


                                                                                                   if(profile['sub_id'] == 3) {


                                                                                                       document.getElementById("official_doctor_div_rejection_5").style.display = "block";

                                                                                                       var src =  profile['supporting_doc_path'];
                                                                                                       certificate_doctor_embed_rejection_5.src=src;
                                                                                                       certificate_doctor_anchor_rejection_5.href=src;
                                                                                                       document.getElementById("certificate_doctor_anchor_rejection_5").style.display = "inherit";
                                                                                                       
                                                                                                   }else{
                                                                                                       document.getElementById("official_NA_div_rejection_5").style.display = "block";

                                                                                                   }
                                                                                           break;
                                                                                       case 5:
                                                                                          document.getElementById("professional_volunteer_div_rejection_5").style.display = "block";
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           cv_volunteer_embed_rejection_5.src=src;
                                                                                           cv_volunteer_anchor_rejection_5.href=src;
                                                                                           document.getElementById("cv_volunteer_anchor_rejection_5").style.display = "inherit";

                                                                                           break;
                                                                                       default:
                                                                                           break;
                                                                                   }



                                                                               


                                                                           </script>
                                                                                    

                                                                                    @endif                             
                                                                           
                                                                    @elseif($profile->approved == -2)
                                                                        <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id="" class="opacity-50" ><br />
                                                                            <br />
                                                                        <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                        style="padding:10px;width:25%;pointer-events: none" > View</a>
                                                                        <div class="pending text-danger" style="position: absolute;
                                                                        top: 50%;
                                                                        left: 50%;
                                                                        transform: translate(-50%, -50%);
                                                                        font-size:30px;">
                                                                            <i class="align-middle me-2 fas fa-fw fa-ban"></i><br>
                                                                        Rejected</div>
                                                                    @elseif($profile->approved == 0)

                                                                    <h5 class="card-title my-2" style="position: relative;">{{$profile->profile_name}}'s Supporting Document</h5>


                                                                        <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id="" class="opacity-50"><br />
                                                                            <br />
                                                                        <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                        style="padding:10px;width:25%;pointer-events: none"  id=""> View</a>
                                                                        <div class="pending text-warning" style="position: absolute;
                                                                        top: 50%;
                                                                        left: 50%;
                                                                        transform: translate(-50%, -50%);
                                                                        font-size:30px;">
                                                                            <i class="align-middle me-2 fas fa-fw fa-clock"></i><br>
                                                                            Approval Pending...</div>
                                                                    @else
                                                                    
                                                                     <h5 class="card-title my-2" style="position: relative;">{{$profile->profile_name}}'s Supporting Document</h5>

                                                                        <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id=""><br />
                                                                        <br />
                                                                            <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                            style="padding:10px;width:25%" id=""> View</a>
                                                                            
                                                                    @endif
                                                                                
                                                                     <!-- display profile other than official and if supporting documents  isn't available -->
                                                                @elseif($profile->profile_id != 4 && $profile->supporting_doc_path == null)
                                                                        <h3>No document(s) required for role you have selected</h3>
                                                                    <!-- display profile that is official and if supporting documents  is available -->
                                                                @elseif($profile->profile_id == 4 && $profile->supporting_doc_path != null)
                                                                    <center>
                                                                        @if($profile->approved == -1)
                                                                       
                                                                            <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id="" class="opacity-50"><br />
                                                                                <br />
                                                                            <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                            style="padding:10px;width:25%;pointer-events: none" id=""> View</a>
                                                                            <div class="pending text-warning" style="position: absolute;
                                                                            top: 50%;
                                                                            left: 50%;
                                                                            transform: translate(-50%, -50%);
                                                                            font-size:30px;">
                                                                                <i class="align-middle me-2 fas fa-fw fa-clock"></i><br>
                                                                                On-Hold</div>
                                                                        
                                                                        @elseif($profile->approved == -2)
                                                                            <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id="" class="opacity-50" ><br />
                                                                                <br />
                                                                            <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                            style="padding:10px;width:25%;pointer-events: none"> View</a>
                                                                            <div class="pending text-danger;" style="position: absolute;
                                                                            top: 50%;
                                                                            left: 50%;
                                                                            transform: translate(-50%, -50%);
                                                                            font-size:30px;">
                                                                                <i class="align-middle me-2 fas fa-fw fa-ban"></i><br>
                                                                            Rejected</div>
                                                                        @elseif($profile->approved == 0)
                                                                            <h5 class="card-title my-2" style="position: relative;">{{$profile->profile_name}}'s Supporting Document</h5>

                                                                            <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id="" class="opacity-50"><br />
                                                                                <br />
                                                                            <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                            style="padding:10px;width:25%;pointer-events: none" id=""> View</a>
                                                                            <div class="pending text-warning" style="position: absolute;
                                                                            top: 50%;
                                                                            left: 50%;
                                                                            transform: translate(-50%, -50%);
                                                                            font-size:30px;">
                                                                                <i class="align-middle me-2 fas fa-fw fa-clock"></i><br>
                                                                                Approval Pending...</div>
                                                                        @else
                                                                            <h5 class="card-title my-2" style="position: relative;">{{$profile->profile_name}}'s Supporting Document</h5>

                                                                            <embed src="{{ $profile->supporting_doc_path }}" style="height:300px" frameborder="0" id=""><br />
                                                                            <br />
                                                                                <a href="{{ $profile->supporting_doc_path }}" class="btn  btn-success" target="_blank"
                                                                                style="padding:10px;width:25%" id=""> View111</a>
                                                                        @endif
                                                                    </center>
                                                                <!-- display profile that is official and if supporting documents  isn't available -->
                                                                @elseif($profile->profile_id == 4 && $profile->supporting_doc_path == null)

                                                                   
                                                                    @if($profile->approved == -1)
                                                                    <script src="/js/profile_setting_rejection.js"></script>

                                                                    <p>{{ __('Your application "'. $profile->application_id.'" has got on-hold due to following reason. We request to do the needful changes and submit once again.') }}
                                                                        </p>
                                                                            <center>
                                                                            <!--  <p>
                                                                                    <i class="fa-solid fa-handshake " style="font-size:30pt;"></i></p>  -->
                                                                                <h5 class="text-warning">
                                                                                    Reason :  {!! $profile->remark !!}
                                                                                </h5>
                                                                            </center>
                                                                        @if($profile->profile_id == 4)
                                                                            @include('user.official_setting_profile_rejection');
                                                                            <script> 
                                                                                   
                                                                                   var profile = {!! json_encode($profile, JSON_HEX_TAG) !!};
                                                                                   console.log(profile)
                                                                                   document.getElementById('user_docs_id_4').value= profile['id']
                                                                                   document.getElementById('profile_portal_id_4').value= profile['profile_portal_id']
                                                                                   document.getElementById('old_role_4').value= profile['profile_id']

                                                                                   document.getElementById('role_rejection_4').value= profile['profile_id']
                                                                                   document.getElementById('official_role_'+profile['profile_id']).disabled= false;
                                                                                //    alert(profile['profile_id'])

                                                                                   switch (profile['profile_id']) {
                                                                                       case 1:
                                                                                           document.getElementById("professional_athlete_div_rejection_4").style.display = "block";
                                                                                           document.getElementById('level_athlete_rejection_4').value = profile['level']; 
                                                                                           document.getElementById('level_athlete_rejection_4').classList.add("step_1_rejection_4");
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_athlete_embed_rejection_4.src=src;
                                                                                           certificate_athlete_anchor_rejection_4.href=src;
                                                                                           document.getElementById("certificate_athlete_anchor_rejection_4").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 2:
                                                                                           document.getElementById("professional_coach_div_rejection_4").style.display = "block";
                                                                                           // $('#professional_coach_div').show();
                                                                                           document.getElementById('level_coach_rejection_4').value = profile['level'];
                                                                                           document.getElementById('level_coach_rejection_4').classList.add("step_1_rejection_4");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_coach_embed_rejection_4.src=src;
                                                                                           certificate_coach_anchor_rejection_4.href=src;
                                                                                           document.getElementById("certificate_coach_anchor_rejection_4").style.display = "inherit";
                                                                                           
                                                                                           break;
                                                                                       case 3:
                                                                                           document.getElementById("professional_judge_div_rejection_4").style.display = "block";
                                                                                           document.getElementById('level_judge_rejection_4').value = profile['level'];
                                                                                           document.getElementById('level_judge_rejection_4').classList.add("step_1_rejection_4");

                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           certificate_judge_embed_rejection_4.src=src;
                                                                                           certificate_judge_anchor_rejection_4.href=src;
                                                                                           document.getElementById("certificate_judge_anchor_rejection_4").style.display = "inherit";
                                                                                           break;
                                                                                       case 4:

                                                                                           document.getElementById("professional_official_div_rejection_4").style.display = "block";
                                                                                           document.getElementById("official_div_rejection_4").style.display = "block";
                                                                                           document.getElementById('role_official_rejection_4').value= profile['sub_id']
                                                                                           document.getElementById('role_official_rejection_4').classList.add("step_1_rejection_4");
                                                                                           document.getElementById('old_sub_id').value= profile['sub_id']


                                                                                                   if(profile['sub_id'] == 3) {


                                                                                                       document.getElementById("official_doctor_div_rejection_4").style.display = "block";

                                                                                                       var src =  profile['supporting_doc_path'];
                                                                                                       certificate_doctor_embed_rejection_4.src=src;
                                                                                                       certificate_doctor_anchor_rejection_4.href=src;
                                                                                                       document.getElementById("certificate_doctor_anchor_rejection_4").style.display = "inherit";
                                                                                                       
                                                                                                   }else{
                                                                                                       document.getElementById("official_NA_div_rejection_4").style.display = "block";

                                                                                                   }
                                                                                           break;
                                                                                       case 5:
                                                                                          document.getElementById("professional_volunteer_div_rejection_4").style.display = "block";
                                                                                           var src =  profile['supporting_doc_path'];
                                                                                           cv_volunteer_embed_rejection_4.src=src;
                                                                                           cv_volunteer_anchor_rejection_4.href=src;
                                                                                           document.getElementById("cv_volunteer_anchor_rejection_4").style.display = "inherit";

                                                                                           break;
                                                                                       default:
                                                                                           break;
                                                                                   }



                                                                               


                                                                                </script>
                                                                             @endif
                                                                        @elseif($profile->approved == 1)
                                                                            <center>
                                                                            <h3 style="margin-top:25px">No document(s) required for the Official role you have selected</h3>
                                                                            </center><br><br>
                                                                            <i class="align-middle fas fa-check-circle fa-fw fa-xl align-self-center text-success" ></i>
                                                                                
                                                                            Approved   
                                                                        @elseif($profile->approved == -2)
                                                                            <center>
                                                                            <h3 style="margin-top:25px">No document(s) required for the Official role you have selected</h3>
                                                                            </center>
                                                                            <div class="pending text-danger;" style="position: absolute;
                                                                            top: 50%;
                                                                            left: 50%;
                                                                            transform: translate(-50%, -50%);
                                                                            font-size:30px;">
                                                                                <i class="align-middle me-2 fas fa-fw fa-ban"></i><br>
                                                                            Rejected</div>
                                                                        @elseif($profile->approved == 0)
                                                                            <center>
                                                                            <h3 style="margin-top:25px">No document(s) required for the Official role you have selected</h3>
                                                                            </center>
                                                                            <div class="pending text-warning" style="position: absolute;
                                                                            top: 50%;
                                                                            left: 50%;
                                                                            transform: translate(-50%, -50%);
                                                                            font-size:30px;">
                                                                                <i class="align-middle me-2 fas fa-fw fa-clock"></i><br>
                                                                                Approval Pending...</div>
                                                                        @else
                                                                            <center>
                                                                                <h3 style="margin-top:25px">No document(s) required for the Official role you have selected</h3>
                                                                            </center>
                                                                        @endif
                                                                @endif
                                                                        
                                                            </div>
                                                        </div>
                                                    @endif
                                            @endforeach
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
{{--------------------------All Profiles Section End=====---------------}}

{{--------------------------Apply For New Profile Section Start=====---------------}}
                    <div class="tab-pane fade" id="apply_new" role="tabpanel">
                        <div class="card">
                            <div class="card-body">
                                <h5 class="card-title">Apply New Profile</h5>
                                <div class="col-12" style=" height:500px;display: @if(count($getExistingProfileName) >= sizeOf($userProfilesGet)) block @else none @endif ">
                                <br><br><br><br>    
                                <center><h2>You have already registered/applied for all available profiles.</h2></center>
                                </div>
                                <div class="col-12" style="display: @if(count($getExistingProfileName) < sizeOf($userProfilesGet)) block @else none @endif ">                                    <div id="smartwizard-arrows-primary" class="wizard wizard-primary mb-4">
                                        <ul class="nav">
                                            <li class="nav-item"><a class="nav-link" href="#arrows-primary-step-1">Step Title<br /><small>Step description</small></a>
                                            </li>
                                            <li class="nav-item"><a class="nav-link" href="#arrows-primary-step-2">Step Title<br /><small>Step description</small></a>
                                            </li>
                                        </ul>

                                        <div class="tab-content">
                                            <div id="arrows-primary-step-1" class="tab-pane" role="tabpanel" style="height: 500px">
                                                <input type="hidden" name="_token" id="_token" value="{{csrf_token()}}">

                                                <div class="row">
                                                    <div class="col-md-12">
                                                        <div class="card">
                                                            <div class="card-header">
                                                                <!-- <h5 class="card-title">Form row</h5> -->
                                                                <!-- <h6 class="card-subtitle text-muted">Bootstrap column layout.</h6> -->
                                                            </div>
                                                            <div class="card-body" style=" height:500px; overflow: auto;">

                                                                <div class="row">
                                                                    <div class="mb-3 col-md-6">
                                                                        <label for="inputCity">Profile <span class="text-danger " style="font-size:16pt;display: inline;">*</span></label>
                                                                        <select class="form-control step_3 " data-bs-toggle="" id="role"
                                                                            onchange="checkOfficial(this)" placeholder="Role">
                                                                            <option value="" selected>-Select-Profile-</option>
                                                                            @foreach ($userProfilesGet as $profile)
                                                                                   
                                                                                    @if(in_array($profile->name, $getExistingProfileName))
                                                                                        <option value="{{$profile->id}}" id="{{$profile->id}}" disabled>{{$profile->name}} (already added)</option>
                                                                                    @else
                                                                                        <option value="{{$profile->id}}" id="{{$profile->id}}">{{$profile->name}}</option>

                                                                                    @endif
                                                                                  
                                                                            @endforeach
                                                                        </select>
                                                                        <span id="error_role" ></span>

                                                                    </div>
                                                                    <div class="mb-3 col-md-6" id="official_div" style="display:none">
                                                                        <label for="inputCity">Official <span class="text-danger " style="font-size:16pt;display: inline;">*</span></label>
                                                                        <select class="form-control  remove_danger_class" data-bs-toggle="" id="role_official"
                                                                            onchange="hideWhenProfessionalOfficialUploadDoc(this)" placeholder="Official">
                                                                            <option value="" selected>-Select-Official-</option>
                                                                            <option value="1">Natioanl-EC-Member</option>
                                                                            <option value="2">State-EC-Member</option>
                                                                            <option value="3">Physio/Doctor</option>
                                                                            <option value="4">Management Staff</option>
                                                                            <!-- <option value="5" selected>Volunteer</option>                                                                      -->
                                                                        </select>
                                                                        <span id="error_role_official" class="error_span"></span>

                                                                    </div>

                                                                </div>



                                                                <div class="row" id="professional_athlete_div" style="display:none">
                                                                    <div class="mb-3 col-md-6" style="margin-top:25px">
                                                                        <label class="form-label">Athlete-Level <span class="text-danger " style="font-size:16pt;display: inline;">*</span></label>

                                                                        <select class="form-control addRemoveCertClass remove_danger_class"  id="level_athlete"
                                                                            onchange="hideWhenAthleteCertificate(this)"  placeholder="Level">
                                                                            <option value="" selected>-Select-Level-</option>
                                                                            <option value="0">New</option>
                                                                            <option value="1">District</option>
                                                                            <option value="2">State</option>
                                                                            <option value="3">National</option>
                                                                            <option value="4">International</option>
                                                                        </select>
                                                                        <span id="error_level_athlete" class="error_span"></span>

                                                                    </div>
                                                                    <div class="mb-3 col-md-6" id="certificate_athlete_div" style="margin-top:25px">
                                                                         <center>
                                                                            <div class="mb-3 " >
                                                                                <label class="form-label">Athlete-Upload Support doc ( .pdf format )</label><br>
                                                                                <input type="file" class="btn btn-primary custom-file-input emptyPdfInput remove_danger_class addRemoveCertClass"
                                                                                id="certificate_athlete" name="pdf" accept="application/pdf"
                                                                                style="cursor:pointer" onchange="onChangePDf('certificate_athlete')" placeholder="Athlete-Certificate" >
                                                                                <span id="error_certificate_athlete" class="error_span"></span>

                                                                            </div>
                                                                            <div class="mb-3 " id="refreshAthleteCertDiv">
                                                                           
                                                                                <label class="form-label"></label><br>
                                                                                <embed
                                                                                src=""
                                                                                class="emptyEmbedSrc"
                                                                                style="height:250px"
                                                                                frameborder="0"
                                                                                id="certificate_athlete_embed">
                                                                               
                                                                            <a href="" class="btn btn-sm btn-success form-control emptyAnchorhref" target="_blank"
                                                                                style="display:none;margin:10px;padding:10px;width:50%" id="certificate_athlete_anchor"> View</a>
                                                                                
                                                                            </div>
                                                                         </center>
                                                                    </div>
                                                                </div>

                                                                <div class="row" id="professional_coach_div" style="display:none">
                                                                    <div class="mb-3 col-md-6" style="margin-top:25px">
                                                                        <label class="form-label">Coach-Level <span class="text-danger " style="font-size:16pt;display: inline;">*</span></label>

                                                                        <select class="form-control addRemoveCertClass remove_danger_class"  id="level_coach"
                                                                            onchange="" placeholder="Level">
                                                                            <option value="" selected>-Select-Level-</option>
                                                                            <!-- <option value="0" >New</option>
                                                                                                <option value="1" >State</option>                                                                      -->
                                                                            <option value="3">National</option>
                                                                            <option value="4">International</option>
                                                                        </select>
                                                                        <span id="error_level_coach" class="error_span"></span>

                                                                    </div>
                                                                    <div class="mb-3 col-md-6" id="certificate_coach_div" style="margin-top:25px">
                                                                        <center>
                                                                            <div class="mb-3 " >
                                                                                <label class="form-label">Coach-Upload Support doc ( .pdf format )</label><br>
                                                                                <input type="file" class="btn btn-primary custom-file-input addRemoveCertClass remove_danger_class emptyPdfInput" id="certificate_coach" name="certificate_coach"
                                                                                    accept="application/pdf" style="cursor:pointer" onchange="onChangePDf('certificate_coach')"   placeholder="Coach-Certificate">
                                                                                <span id="error_certificate_coach" class="error_span"></span>
                                                                            </div>
                                                                            <div class="mb-3 " id="refreshCoachCertDiv">
                                                                                <label class="form-label"></label><br>
                                                                                <embed
                                                                                src=""
                                                                                class="emptyEmbedSrc"
                                                                                style="height:250px"
                                                                                frameborder="0"
                                                                                id="certificate_coach_embed">
                                                                            <a href="" class="btn btn-sm btn-success form-control emptyAnchorhref" target="_blank"
                                                                            style="display:none;margin:10px;padding:10px;width:50%" id="certificate_coach_anchor"> View</a>
                                                                            </div>
                                                                        </center>
                                                                    </div>
                                                                </div>

                                                                <div class="row" id="professional_judge_div" style="display:none">
                                                                    <div class="mb-3 col-md-6" style="margin-top:25px">
                                                                        <label class="form-label">Judge-Level <span class="text-danger " style="font-size:16pt;display: inline;">*</span></label>

                                                                        <select class="form-control addRemoveCertClass remove_danger_class" id="level_judge"
                                                                            onchange="" placeholder="Level">
                                                                            <option value="" selected>-Select-Level-</option>
                                                                            <!-- <option value="0" >New</option>
                                                                                                <option value="1" >State</option> -->
                                                                            <option value="3">National</option>
                                                                            <option value="4">International</option>
                                                                        </select>

                                                                        <span id="error_level_judge" class="error_span"></span>

                                                                    </div>
                                                                    <div class="mb-3 col-md-6" id="certificate_judge_div" style="margin-top:25px">
                                                                    
                                                                        <center>
                                                                            <div class="mb-3 " >
                                                                                <label class="form-label">Judge-Upload Support doc ( .pdf format )</label><br>
                                                                                <input type="file" class="btn btn-primary custom-file-input emptyPdfInput addRemoveCertClass remove_danger_class" id="certificate_judge" name="certificate_judge" 
                                                                                    accept="application/pdf" style="cursor:pointer" onchange="onChangePDf('certificate_judge')"  placeholder="Judge-Certificate">
                                                                                <span id="error_certificate_judge" class="error_span"></span>
                                                                            </div>
                                                                            <div class="mb-3 " id="refreshJudgeCertDiv">
                                                                                <label class="form-label"></label><br>
                                                                                <embed
                                                                                src=""
                                                                                class="emptyEmbedSrc"
                                                                                style="height:250px"
                                                                                frameborder="0"
                                                                                id="certificate_judge_embed">
                                                                            <a href="" class="btn btn-sm btn-success form-control emptyAnchorhref" target="_blank"
                                                                                style="display:none;margin:10px;padding:10px;width:50%" id="certificate_judge_anchor"> View</a>
                                                                               

                                                                            </div>


                                                                        </center>

                                                                    </div>
                                                                </div>

                                                                <!-- Physio/Doctor supporting doc -->
                                                                <div class="row" id="professional_official_div" style="display:none">

                                                                    <div class="row" id="official_NA_div" style="display:none">
                                                                        <div class="mb-3 col-md-12" style="margin-top:25px;text-align: center;">
                                                                            <h3>No document(s) required to upload for the Official role you have
                                                                                selected</h3>
                                                                        </div>
                                                                    </div>
                                                                    <div class="row" id="official_doctor_div" style="display:none">
                                                                        <div class="mb-3 col-md-6" style="margin-top:25px">
                                                                         <center>
                                                                            <div class="mb-3 " >
                                                                                <label class="form-label">Doctor-Upload Support doc ( .pdf format )</label><br>
                                                                                <input type="file" class="btn btn-primary custom-file-input emptyPdfInput addRemoveCertClass remove_danger_class" id="certificate_doctor" name="certificate_doctor" 
                                                                                    accept="application/pdf" style="cursor:pointer" onchange="onChangePDf('certificate_doctor')" placeholder="Doctor-Certificate" >
                                                                                <span id="error_certificate_doctor" class="error_span"></span>
                                                                            </div>
                                                                            <div class="mb-3 " id="refreshDoctorCertDiv">
                                                                                <label class="form-label"></label><br>
                                                                                <embed
                                                                                src=""
                                                                                class="emptyEmbedSrc"
                                                                                style="height:250px"
                                                                                frameborder="0"
                                                                                id="certificate_doctor_embed">
                                                                                
                                                                            <a href="" class="btn btn-sm btn-success form-control emptyAnchorhref" target="_blank"
                                                                                style="display:none;margin:10px;padding:10px;width:50%" id="certificate_doctor_anchor"> View</a>
                                                                                
                                                                            </div>
                                                                         </center>
                                                                        </div>
                                                                    

                                                                    </div>
                                                                </div>


                                                                <!-- Vounteer CV upload -->

                                                                <div class="row" id="professional_volunteer_div" style="display:none">
                                                                    <div class="mb-3 col-md-4" id="certificate_volunteer_div">
                                                                         <center>
                                                                            <div class="mb-3 ">
                                                                                <label class="form-label">Volunteer-Upload your CV ( .pdf format ) <span class="text-danger " style="font-size:16pt;display: inline;">*</span></label><br>

                                                                                <input type="file" class="btn btn-primary custom-file-input emptyPdfInput addRemoveCertClass remove_danger_class"
                                                                                    id="cv_volunteer" name="pdf" accept="application/pdf"
                                                                                    style="cursor:pointer" onchange="onChangePDf('cv_volunteer')"  placeholder="Upload your CV" >
                                                                                <span id="error_cv_volunteer" class="error_span"></span>

                                                                                <!-- <label class="custom-file-label" for="customFile" style="cursor:pointer"> <span class="text-danger "  style="font-size:16pt;display: inline;">*</span></label> -->
                                                                            </div>
                                                                            <div class="mb-3" id="refreshVolunteerDiv">
                                                                                <label class="form-label"></label><br>

                                                                                <embed src="" class="emptyEmbedSrc" style="height:250px" frameborder="0" id="cv_volunteer_embed">
                                                                                    
                                                                                <a href="" class="btn btn-sm btn-success form-control emptyAnchorhref" target="_blank"
                                                                                    style="display:none;margin:10px;padding:10px;width:50%" id="cv_volunteer_anchor"> View</a>
                                                                                    
                                                                            </div>
                                                                         </center>
                                                                    </div>
                                                                </div>

                                                            </div>

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



                                            </div>
                                            <div id="arrows-primary-step-2" class="tab-pane" role="tabpanel">
                                                <div class="row" style=" height:500px; ">
                                                    <div class="mb-3 col" style="margin-top:25px">
                                                        <div class="card">


                                                            <div class="card-body" style=" height:500px; overflow: auto;">
                                                                <label class="form-check">
                                                                    <input class="form-check-input step_4" id="agree_terms_policy" type="checkbox" value="">
                                                                    <span class="form-check-label">
                                                                    Yes, I understand and agree <a href="/1633014589.pdf" class="" target="_blank"
                                                                        id="anchorPDFViewer1"> Terms and Conditions Agreements and Privacy Policy.</a>
                                                                    </span>
                                                                </label>

                                                                <span id="error_agree_terms_policy"></span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                             </div>

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

                            </div>
                        </div>
                    </div>
{{--------------------------Apply For New Profile Section End=====---------------}}

{{--------------------------Download Identity Card Section Start=====---------------}}
                    <div class="tab-pane fade" id="id_card" role="tabpanel">
                        <div class="card">
                            <div class="card-body">
                                <h5 class="card-title">Download Identity Card</h5>


                                         <img class="mb-4" src="/img/id-temp.png" alt="">

                            </div>
                        </div>
                    </div>
{{--------------------------Download Identity Card Section End=====---------------}}

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

    </div>

    <div class="modal fade" id="viewDocumentsModal" tabindex="-1" role="dialog" aria-hidden="true"
        data-backdrop="static" data-keyboard="false">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    @if ($userDocs->document_type == 1)
                        <center>
                            <h5 class="modal-title">Document Type Aadhar</h5>
                        </center>
                    @else
                        <center>
                            <h5 class="modal-title">Document Type Passport</h5>
                        </center>
                    @endif
                </div>
                <div class="modal-body m-3" style="height: 500px; overflow:auto;">
                    <div class="row">
                        <div class="col-sm-12 col-lg-12 col-md-12 col-xs-12 text-center">
                            @if ($userDocs->document_type == 2)
                                <h5 class="card-title my-2">Passport-page 1</h5>
                                <img class="mb-4" src="{{ $userDocs->passport_page_1 }}" alt="Passport-page 1"
                                    width="80%" height="80%">
                            @else
                                @if ($userDocs->aadhar_type == 1)
                                    <img class="mb-4" src="{{ $userDocs->aadhar_front }}"
                                        alt="Aadhar Front" width="80%" height="80%">
                                @else
                                    <h5 class="card-title my-2">Aadhar Front</h5>
                                    <img class="mb-4" src="{{ $userDocs->aadhar_front }}"
                                        alt="Aadhar Front" width="80%" height="80%">
                                @endif
                            @endif

                        </div>
                        {{-- @if ($application_details->doc_back) --}}
                        <div class="col-sm-12 col-lg-12 col-md-12 col-xs-12 text-center">
                            @if ($userDocs->document_type == 2)
                                <h5 class="card-title my-2">Passport-page 2</h5>
                                <img class="mb-2" src="{{ $userDocs->passport_page_2 }}" alt="Passport-page 1"
                                    width="80%" height="80%">
                            @else
                                @if ($userDocs->aadhar_type == 2)
                                    <h5 class="card-title my-2">Aadhar Back</h5>
                                    <img class="mb-2" src="{{ $userDocs->aadhar_back }}" alt="Aadhar Back"
                                        width="80%" height="80%">
                                @endif
                            @endif

                        </div>
                        {{-- @endif --}}
                    </div>
                    {{-- <div class="row">
                        <div class="col-12" style="margin-top:25px">
                            <button type="button" class="btn btn-success btn-lg" style="width:100%"
                                onclick="checkForAadharSelection()">Done</button>
                        </div>
                    </div> --}}
                </div>
                <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    </div>
            </div>
        </div>
    </div>


    <script src="/js/file-upload-with-preview.min.js"></script>
    <script src="/js/profile_setup.js"></script>
    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
    <script src="/js/profile_setting.js"></script>
    <script>
        var ImagepreviewAth = new FileUploadWithPreview('ImagepreviewAth')

        var ImagepreviewCoach = new FileUploadWithPreview('ImagepreviewCoach')

        var ImagepreviewJudge = new FileUploadWithPreview('ImagepreviewJudge')

        var ImagepreviewDoc = new FileUploadWithPreview('ImagepreviewDoc')
            </script>
    @if(session("click"))
     <script>
         document.addEventListener('DOMContentLoaded',function() {
            document.getElementById('password_tab').click();

        });
    </script>
    @endif
    
   
        
          
   

@endsection