@extends('student-panel.layouts.app')

@php
    @$profile_complete = @$user->candidate->profile_complete;
@endphp

@section('main')
<div class="container-fluid common-space">
    <div class="document-content">

        <p class="page-head">Documents</p>
        <p class="head-desc">Add, Track and Manage All Your University Applications Right Here!</p>

        <div class="row">
            <ul class="tab-list">
                <li class="searchDocuments tabs active" data-key="1">All Documents</li>
                <li class="tabs" data-key="2">Application</li>
                <li class="tabs" data-key="3">Visa</li>
                <li class="tabs" data-key="4">Financial</li>
                <li class="tabs" data-key="5">Additional Documents</li>
            </ul>

            <form action="{{route('dashboard.document')}}" class="search-section" onsubmit="return false">
                <input type="text" class="input-field" placeholder="Search Document by Name or Type"
                    name="search" id="searchDocuments" aria-label="Search">
                <button type="submit" onclick="SearchDocuments(event)" class="search-btn" aria-label="search">
                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M9.58366 17.5001C13.9559 17.5001 17.5003 13.9557 17.5003 9.58342C17.5003 5.21116 13.9559 1.66675 9.58366 1.66675C5.2114 1.66675 1.66699 5.21116 1.66699 9.58342C1.66699 13.9557 5.2114 17.5001 9.58366 17.5001Z" stroke="#ABAFB1" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                        <path d="M18.3337 18.3334L16.667 16.6667" stroke="#ABAFB1" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                    </svg>                        
                </button>
            </form>
        </div>

        <div class="panels">
            <!--All Documents-->
            <div class="documents tab-panel 1">
                <p class="showMessage" style="display: none;">No Document Found!</p>
                <div class="dropdown-list searchHead">
                    <p class="drp-head">Getting to know you
                        <span class="drp-head-desc">You’ve to share your personal details for record purpose to help suggest you right universities.<span class="link-popup transcript">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox gettingToKnowYou" >
                        <div id="noappend">

                        </div>
                        <div class="drp-item">Resume<a href="javascript:;" class="up-link" aria-label="upload"><img
                                    src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                            <span class="f-name">
                                LOR
                            </span>
                            <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                            <p class="dots-box">
                                <a href="javascript:;" class="view-detail" aria-label="view detail"><img
                                        src="{{asset('student-panel')}}/images/detail-icon.svg" alt="icon"><span>View Details</span></a>
                                <a href="javascript:;" class="delete" aria-label="delete"><img
                                        src="{{asset('student-panel')}}/images/delete.svg" alt="icon"><span>Delete</span></a>
                            </p>
                        </div>
                        <div class="drp-item">LOR1<a href="javascript:;" class="lor-link" aria-label="upload"><img
                                    src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">SOP<a href="javascript:;" class="up-link" aria-label="upload"><img
                                    src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">Degrees & Transcripts
                        <span class="drp-head-desc">Your degrees and transcripts are taken into record to analyze and figure out the apt pick for you.<span class="link-popup transcript">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox degreesTranscripts">
                        <div class="drp-item">Bachelor’s Degree Transcripts<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">Master’s Degree Transcripts<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">Bachelor’s Degree<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                        <div class="drp-item">Master’s Degree<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head">High School Marksheets
                        <span class="drp-head-desc">The high school marksheets are a must to get into any educational sector in local or foreign country.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox schoolDropdown">
                        <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                            <span class="f-name">
                                Class 10 Marksheet
                            </span>
                            <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                            <p class="dots-box">
                                <a href="javascript:;" class="download" aria-label="download"><img
                                        src="{{asset('student-panel')}}/images/download.svg" alt="icon"><span>Download</span></a>
                                <a href="javascript:;" class="delete" aria-label="delete"><img
                                        src="{{asset('student-panel')}}/images/delete.svg" alt="icon"><span>Delete</span></a>
                            </p>
                        </div>
                        <div class="drp-item">Class 12 Marksheet<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head">Aptitude Test Marksheets
                        <span class="drp-head-desc">A documented proof of the scores you have achieved in the aptitude test is also a compulsion.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox aptitude_test_tarksheets">
                        <div class="drp-item">GRE Scores<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">GMAT Scores<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>

                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">English Proficiency Test Scores
                        <span class="drp-head-desc">Almost all countries make it mandatory for students to clear Language tests before academic intakes.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox english_proficiency_test_scores">
                        <div class="drp-item">IELTS Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">TOEFL Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>

                        <div class="drp-item">Duolingo Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">PTE Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>

                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">Professional Experience
                        <span class="drp-head-desc">If you have work experience, then it’s mandatory to provide a professional experience certificate<span class="link-popup">Click Here</span></span>

                    </p>
                    <div class="sub-dropbox professional_experience">
                        <div class="drp-item">Work Experience Letters
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Internship Letters
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">Personal Information
                        <span class="drp-head-desc">Some of your personal details are collected to ensure you get personalized results in a secure process.<span class="link-popup">Click Here</span></span>

                    </p>
                    <div class="sub-dropbox personal_information">
                        <div class="drp-item">Passport
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Aadhar Card
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">Other
                        <span class="drp-head-desc">Any extra information or details that can impact your university selection should be mentioned prior.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox other">
                        <div class="drp-item">No Backlogs Certificate
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">Visa
                        <span class="drp-head-desc">A copy of the visa papers helps understand your purpose and duration of stay in a country for study.<span class="link-popup">Click Here</span></span>

                    </p>
                    <div class="sub-dropbox visa">
                        <div class="drp-item">VISA SOP/Cover Letter
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">I-20 Letter
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Letter of Acceptance
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Admission/Offer Letters
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">VISA Form
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">DS-160 Confirmation
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list searchHead">
                    <p class="drp-head ">Financial
                        <span class="drp-head-desc">All financial documents should be provided with transparency to avoid any trouble later.<span class="link-popup">Click Here</span></span>

                    </p>
                    <div class="sub-dropbox financial">
                        <div class="drp-item">Pan Card
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Affidavit of Support
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Bank Statement
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Loan Sanction Letter
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Asset Declaration
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Income Tax Returns
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>
            </div>

            <!--Application-->
            <div class="documents tab-panel 2">
                <div class="dropdown-list">
                    <p class="drp-head">Getting to know you
                        <span class="drp-head-desc">You’ve to share your personal details for record purpose to help suggest you right universities.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox gettingToKnowYou">
                        <div class="drp-item">Resume<a href="javascript:;" class="up-link" aria-label="upload"><img
                                    src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                            <span class="f-name">
                                LOR
                            </span>
                            <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                            <p class="dots-box">
                                <a href="javascript:;" class="view-detail" aria-label="view detail"><img
                                        src="{{asset('student-panel')}}/images/detail-icon.svg" alt="icon"><span>View Details</span></a>
                                <a href="javascript:;" class="delete" aria-label="delete"><img
                                        src="{{asset('student-panel')}}/images/delete.svg" alt="icon"><span>Delete</span></a>
                            </p>
                        </div>
                        <div class="drp-item">LOR1<a href="javascript:;" class="lor-link" aria-label="upload"><img
                                    src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">SOP<a href="javascript:;" class="up-link" aria-label="upload"><img
                                    src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>
                </div>

                <div class="dropdown-list">
                    <p class="drp-head">Degrees & Transcripts
                        <span class="drp-head-desc">Your degrees and transcripts are taken into record to analyze and figure out the apt pick for you.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox degreesTranscripts">
                        <div class="drp-item">Bachelor’s Degree Transcripts<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">Master’s Degree Transcripts<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">Bachelor’s Degree<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                        <div class="drp-item">Master’s Degree<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>
                </div>

                <div class="dropdown-list">
                    <p class="drp-head">High School Marksheets
                        <span class="drp-head-desc">The high school marksheets are a must to get into any educational sector in local or foreign country.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox schoolDropdown">
                        <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                            <span class="f-name">
                                Class 10 Marksheet
                            </span>
                            <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                            <p class="dots-box">
                                <a href="javascript:;" class="download" aria-label="download"><img
                                        src="{{asset('student-panel')}}/images/download.svg" alt="icon"><span>Download</span></a>
                                <a href="javascript:;" class="delete" aria-label="delete"><img
                                        src="{{asset('student-panel')}}/images/delete.svg" alt="icon"><span>Delete</span></a>
                            </p>
                        </div>
                        <div class="drp-item">Class 12 Marksheet<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list">
                    <p class="drp-head">Aptitude Test Marksheets
                        <span class="drp-head-desc">A documented proof of the scores you have achieved in the aptitude test is also a compulsion.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox aptitude_test_tarksheets">
                        <div class="drp-item">GRE Scores<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">GMAT Scores<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>

                </div>

                <div class="dropdown-list">
                    <p class="drp-head">English Proficiency Test Scores
                        <span class="drp-head-desc">Almost all countries make it mandatory for students to clear Language tests before academic intakes.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox english_proficiency_test_scores">
                        <div class="drp-item">IELTS Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">TOEFL Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>

                        <div class="drp-item">Duolingo Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                        <div class="drp-item">PTE Scorecard<a href="javascript:;" class="up-link"
                                aria-label="upload"><img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a></div>
                    </div>

                </div>

                <div class="dropdown-list">
                    <p class="drp-head">Professional Experience
                        <span class="drp-head-desc">If you have work experience, then it’s mandatory to provide a professional experience certificate.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox professional_experience">
                        <div class="drp-item">Work Experience Letters
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Internship Letters
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list">
                    <p class="drp-head">Personal Information
                        <span class="drp-head-desc">Some of your personal details are collected to ensure you get personalized results in a secure process.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox personal_information">
                        <div class="drp-item">Passport
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>

                        <div class="drp-item">Aadhar Card
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>

                <div class="dropdown-list">
                    <p class="drp-head">Other
                        <span class="drp-head-desc">Any extra information or details that can impact your university selection should be mentioned prior.<span class="link-popup">Click Here</span></span>
                    </p>
                    <div class="sub-dropbox other">
                        <div class="drp-item">No Backlogs Certificate
                            <a href="javascript:;" class="up-link" aria-label="upload">
                                <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                        </div>
                    </div>
                </div>
            </div>

            <!--Visa-->
            <div class="appendVisa doc-wrpr tab-panel  3">
                <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                    <span class="f-name">VISA SOP/Cover Letter </span>
                    <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                    <p class="dots-box">
                        <a href="javascript:;" class="download" aria-label="download"><img src="{{asset('student-panel')}}/images/download.svg"
                                alt="icon"><span>Download</span></a>
                        <a href="javascript:;" class="delete" aria-label="delete"><img src="{{asset('student-panel')}}/images/delete.svg"
                                alt="icon"><span>Delete</span></a>
                    </p>
                </div>

                <div class="drp-item">I-20 Letter
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">Letter of Acceptance
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">Admission/Offer Letters
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">VISA Form
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">DS-160 Confirmation
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>
            </div>

            <!--Financial-->
            <div class="financialAppend doc-wrpr tab-panel 4">
                <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                    <span class="f-name">Pan Card </span>
                    <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                    <p class="dots-box">
                        <a href="javascript:;" class="download" aria-label="download"><img src="{{asset('student-panel')}}/images/download.svg"
                                alt="icon"><span>Download</span></a>
                        <a href="javascript:;" class="delete" aria-label="delete"><img src="{{asset('student-panel')}}/images/delete.svg"
                                alt="icon"><span>Delete</span></a>
                    </p>
                </div>

                <div class="drp-item">Affidavit of Support
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">Bank Statement
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">Loan Sanction Letter
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">Asset Declaration
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>

                <div class="drp-item">Income Tax Returns
                    <a href="javascript:;" class="up-link" aria-label="upload">
                        <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon"></a>
                </div>
            </div>

            <!--Additional Documents-->
            <div class="documents tab-panel 5">
                <div class="other-doc">
                    <img src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon">
                    <p class="ad-head">Upload Additional Documents</p>
                    <p class="ad-subhead">Documents which don’t come under Application, Visa & Financial Type</p>

                    <a href="javascript:;" class="btn upload-btn up-link otherDocumentUpload">Upload</a>
                </div>

                <div class="additionalDocument doc-wrpr doc-list">
                    <div class="drp-item after-select"><img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                        <span class="f-name">
                            Other Document
                        </span>
                        <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">

                        <p class="dots-box">
                            <a href="javascript:;" class="download" aria-label="download"><img
                                    src="{{asset('student-panel')}}/images/download.svg" alt="icon"><span>Download</span></a>
                            <a href="javascript:;" class="delete" aria-label="delete"><img src="{{asset('student-panel')}}/images/delete.svg"
                                    alt="icon"><span>Delete</span></a>
                        </p>
                    </div>
                </div>
            </div>
        </div>


        <!--Start (Don't use this popup , use which was used in Onboarding(onboarding.blade.php)) -->

        <!--Upload Popup--> <!--Document Name for Additional Document-->
        <div class="upload-popup">
            <div class="top">
                <a href="javascript:;" aria-label="close" class="close uploadClose">
                    <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path
                            d="M8.23286 6.99925L13.7414 1.4989C13.906 1.33424 13.9985 1.11091 13.9985 0.878038C13.9985 0.645168 13.906 0.421835 13.7414 0.257171C13.5767 0.0925073 13.3534 0 13.1206 0C12.8877 0 12.6644 0.0925073 12.4998 0.257171L7 5.76627L1.50024 0.257171C1.33559 0.0925073 1.11228 2.06752e-07 0.879436 2.08487e-07C0.646591 2.10222e-07 0.423282 0.0925073 0.258636 0.257171C0.0939896 0.421835 0.0014924 0.645168 0.0014924 0.878038C0.0014924 1.11091 0.0939896 1.33424 0.258636 1.4989L5.76714 6.99925L0.258636 12.4996C0.176683 12.5809 0.111635 12.6776 0.067245 12.7842C0.0228546 12.8907 0 13.005 0 13.1205C0 13.2359 0.0228546 13.3502 0.067245 13.4568C0.111635 13.5633 0.176683 13.66 0.258636 13.7413C0.33992 13.8233 0.436626 13.8884 0.543175 13.9327C0.649725 13.9771 0.764009 14 0.879436 14C0.994863 14 1.10915 13.9771 1.2157 13.9327C1.32225 13.8884 1.41895 13.8233 1.50024 13.7413L7 8.23224L12.4998 13.7413C12.581 13.8233 12.6778 13.8884 12.7843 13.9327C12.8909 13.9771 13.0051 14 13.1206 14C13.236 14 13.3503 13.9771 13.4568 13.9327C13.5634 13.8884 13.6601 13.8233 13.7414 13.7413C13.8233 13.66 13.8884 13.5633 13.9328 13.4568C13.9771 13.3502 14 13.2359 14 13.1205C14 13.005 13.9771 12.8907 13.9328 12.7842C13.8884 12.6776 13.8233 12.5809 13.7414 12.4996L8.23286 6.99925Z"
                            fill="#066AC9" />
                    </svg>
                </a>
                <p class="head">Upload Document</p>
            </div>

            <div class="popup-body">

                <form id="file_upload_form" class="file_upload_form" enctype="multipart/form-data">
                    <!-- <div class="single-input">
                        <label for="Document Name" class="label">Document Name</label>
                        <input type="text" class="input-field" name="name" placeholder="Document Name" value=""
                            required>
                    </div> -->

                    <div id="upload_head">
                        <svg id="upload_icon" class="up-icon" width="36" height="28" viewBox="0 0 36 28" fill="none"
                            xmlns="http://www.w3.org/2000/svg">
                            <!--after select file add class fill-->
                            <path
                                d="M29.5992 7.36786C28.4984 4.90883 26.5985 2.86851 24.1906 1.55956C21.7828 0.250613 18.9999 -0.25476 16.2683 0.120887C13.5368 0.496533 11.0073 1.73248 9.06743 3.63932C7.12759 5.54617 5.88442 8.01873 5.52842 10.6781C3.81065 11.078 2.30376 12.0772 1.29394 13.486C0.284109 14.8948 -0.158335 16.6151 0.0506259 18.3201C0.259587 20.0251 1.1054 21.5962 2.42744 22.7349C3.74949 23.8736 5.45569 24.5007 7.22203 24.4971C7.69987 24.4971 8.15814 24.3126 8.49603 23.9841C8.83391 23.6556 9.02373 23.2101 9.02373 22.7456C9.02373 22.2811 8.83391 21.8356 8.49603 21.5072C8.15814 21.1787 7.69987 20.9942 7.22203 20.9942C6.26634 20.9942 5.3498 20.6251 4.67403 19.9682C3.99826 19.3113 3.61861 18.4203 3.61861 17.4913C3.61861 16.5622 3.99826 15.6713 4.67403 15.0143C5.3498 14.3574 6.26634 13.9884 7.22203 13.9884C7.69987 13.9884 8.15814 13.8038 8.49603 13.4754C8.83391 13.1469 9.02373 12.7014 9.02373 12.2369C9.02834 10.1654 9.78817 8.16259 11.1683 6.58423C12.5483 5.00588 14.4593 3.95419 16.5616 3.61603C18.664 3.27786 20.8215 3.67511 22.6511 4.73719C24.4806 5.79928 25.8636 7.45743 26.5543 9.41707C26.6573 9.71804 26.8425 9.98617 27.09 10.1928C27.3375 10.3995 27.6381 10.537 27.9597 10.5905C29.1597 10.811 30.2476 11.42 31.046 12.3184C31.8445 13.2168 32.3064 14.3515 32.3566 15.5378C32.4067 16.724 32.0421 17.8918 31.3222 18.8508C30.6023 19.8098 29.5695 20.5036 28.3921 20.819C27.9286 20.9352 27.5315 21.2255 27.2882 21.6263C27.045 22.027 26.9754 22.5052 27.0949 22.9558C27.2143 23.4064 27.513 23.7924 27.9252 24.0289C28.3375 24.2654 28.8294 24.333 29.2929 24.2169C31.189 23.7298 32.8698 22.6545 34.0801 21.1544C35.2903 19.6542 35.9639 17.8111 35.9986 15.9049C36.0332 13.9987 35.4271 12.1336 34.2721 10.5929C33.1171 9.05206 31.4764 7.91975 29.5992 7.36786ZM19.3115 10.9934C19.1401 10.8339 18.9381 10.7089 18.7169 10.6256C18.2783 10.4504 17.7863 10.4504 17.3476 10.6256C17.1265 10.7089 16.9244 10.8339 16.7531 10.9934L11.3479 16.2477C11.0087 16.5775 10.8181 17.0249 10.8181 17.4913C10.8181 17.9577 11.0087 18.405 11.3479 18.7348C11.6872 19.0646 12.1473 19.2499 12.6271 19.2499C13.1069 19.2499 13.5671 19.0646 13.9064 18.7348L16.2306 16.4579V26.2485C16.2306 26.7131 16.4204 27.1586 16.7583 27.487C17.0962 27.8155 17.5544 28 18.0323 28C18.5101 28 18.9684 27.8155 19.3063 27.487C19.6442 27.1586 19.834 26.7131 19.834 26.2485V16.4579L22.1582 18.7348C22.3257 18.899 22.5249 19.0293 22.7445 19.1182C22.964 19.2071 23.1995 19.2529 23.4374 19.2529C23.6752 19.2529 23.9107 19.2071 24.1303 19.1182C24.3498 19.0293 24.5491 18.899 24.7166 18.7348C24.8855 18.572 25.0195 18.3783 25.111 18.1648C25.2024 17.9514 25.2495 17.7225 25.2495 17.4913C25.2495 17.2601 25.2024 17.0311 25.111 16.8177C25.0195 16.6043 24.8855 16.4106 24.7166 16.2477L19.3115 10.9934Z"
                                fill="#747579" />
                        </svg>
                        <p class="p-head">Upload file from device</p>
                        <span class="subhead">Supported formats: docx, dox, xlsx, pdf, jpeg, jpg, png, txt</span>
                        <span class="subhead">Size Limit: 10MB</span>
                    </div>
                    
                    <input type="hidden" name="updateDocument" class="updateDocument" value="0" />
                    <input type="hidden" name="subcategory_name" class="subcategory_name" value="" />
                    <div id="adding_section">
                        <div class="file-list">
                            <div id="file_detail" class="files" style="display: none">
                                <img src="{{asset('student-panel')}}/images/document.svg" alt="document-icon">
                                <p class="f-name"><span id="file_title" class="">Class10Marksheet.png</span>
                                    <span id="file_size" class="f-size">File size: 3.7MB</span>
                                </p>
                                <div class="f-actions">
                                    <a id="replace_file" style="display: none"><img src="{{asset('student-panel')}}/images/replace.svg"
                                            class="replace" alt="icon"></a>
                                    <a id="remove_file"><img src="{{asset('student-panel')}}/images/cross.svg" class="remove" alt="cross"></a>
                                </div>
                            </div>
                        </div>

                        <a href="javascript:;" class="select-file">
                            <input type="file" class="file uploadFile" name="file" id="file" aria-label="file">
                            <svg width="18" height="20" viewBox="0 0 18 20" fill="none"
                                xmlns="http://www.w3.org/2000/svg">
                                <path
                                    d="M17 16H16V15C16 14.7348 15.8946 14.4804 15.7071 14.2929C15.5196 14.1054 15.2652 14 15 14C14.7348 14 14.4804 14.1054 14.2929 14.2929C14.1054 14.4804 14 14.7348 14 15V16H13C12.7348 16 12.4804 16.1054 12.2929 16.2929C12.1054 16.4804 12 16.7348 12 17C12 17.2652 12.1054 17.5196 12.2929 17.7071C12.4804 17.8946 12.7348 18 13 18H14V19C14 19.2652 14.1054 19.5196 14.2929 19.7071C14.4804 19.8946 14.7348 20 15 20C15.2652 20 15.5196 19.8946 15.7071 19.7071C15.8946 19.5196 16 19.2652 16 19V18H17C17.2652 18 17.5196 17.8946 17.7071 17.7071C17.8946 17.5196 18 17.2652 18 17C18 16.7348 17.8946 16.4804 17.7071 16.2929C17.5196 16.1054 17.2652 16 17 16ZM10 18H3C2.73478 18 2.48043 17.8946 2.29289 17.7071C2.10536 17.5196 2 17.2652 2 17V3C2 2.73478 2.10536 2.48043 2.29289 2.29289C2.48043 2.10536 2.73478 2 3 2H8V5C8 5.79565 8.31607 6.55871 8.87868 7.12132C9.44129 7.68393 10.2044 8 11 8H14V11C14 11.2652 14.1054 11.5196 14.2929 11.7071C14.4804 11.8946 14.7348 12 15 12C15.2652 12 15.5196 11.8946 15.7071 11.7071C15.8946 11.5196 16 11.2652 16 11V7C16 7 16 7 16 6.94C15.9896 6.84813 15.9695 6.75763 15.94 6.67V6.58C15.8919 6.47718 15.8278 6.38267 15.75 6.3L9.75 0.3C9.66734 0.222216 9.57282 0.158081 9.47 0.11C9.43692 0.104209 9.40308 0.104209 9.37 0.11C9.27276 0.058003 9.16826 0.020922 9.06 0H3C2.20435 0 1.44129 0.316071 0.87868 0.87868C0.316071 1.44129 0 2.20435 0 3V17C0 17.7956 0.316071 18.5587 0.87868 19.1213C1.44129 19.6839 2.20435 20 3 20H10C10.2652 20 10.5196 19.8946 10.7071 19.7071C10.8946 19.5196 11 19.2652 11 19C11 18.7348 10.8946 18.4804 10.7071 18.2929C10.5196 18.1054 10.2652 18 10 18ZM10 3.41L12.59 6H11C10.7348 6 10.4804 5.89464 10.2929 5.70711C10.1054 5.51957 10 5.26522 10 5V3.41ZM5 6C4.73478 6 4.48043 6.10536 4.29289 6.29289C4.10536 6.48043 4 6.73478 4 7C4 7.26522 4.10536 7.51957 4.29289 7.70711C4.48043 7.89464 4.73478 8 5 8H6C6.26522 8 6.51957 7.89464 6.70711 7.70711C6.89464 7.51957 7 7.26522 7 7C7 6.73478 6.89464 6.48043 6.70711 6.29289C6.51957 6.10536 6.26522 6 6 6H5ZM10 14H5C4.73478 14 4.48043 14.1054 4.29289 14.2929C4.10536 14.4804 4 14.7348 4 15C4 15.2652 4.10536 15.5196 4.29289 15.7071C4.48043 15.8946 4.73478 16 5 16H10C10.2652 16 10.5196 15.8946 10.7071 15.7071C10.8946 15.5196 11 15.2652 11 15C11 14.7348 10.8946 14.4804 10.7071 14.2929C10.5196 14.1054 10.2652 14 10 14ZM11 10H5C4.73478 10 4.48043 10.1054 4.29289 10.2929C4.10536 10.4804 4 10.7348 4 11C4 11.2652 4.10536 11.5196 4.29289 11.7071C4.48043 11.8946 4.73478 12 5 12H11C11.2652 12 11.5196 11.8946 11.7071 11.7071C11.8946 11.5196 12 11.2652 12 11C12 10.7348 11.8946 10.4804 11.7071 10.2929C11.5196 10.1054 11.2652 10 11 10Z"
                                    fill="#24292D" />
                            </svg>

                            Select File</a>
                            <span id="modal_warning" style="color:red">Please Upload a Valid Document</span>
                    </div>

                    <div id="added_section" style="display: none;">
                        <p class="p-head">Are you sure you want to upload and send this document for review?</p>
                        <p class="ad-file">
                            <span id="file_subcategory" class="">Class 10 Marksheet</span>
                            <span class="subhead">1 file added</span>
                        </p>
                    </div>
                    <button type="submit" class="upload-btn uploadDocument" style="display:none">Upload <i class="loader"></i></button>
                </form>
                    <button type="button" class="upload-btn demo-button">Upload <i class="loader"></i></button>
            </div>

            <div class="popup-body" style="display: none;">
                <p class="p-head">Are you sure you want to upload and send this document for review?</p>
                <p class="ad-file">
                    Class 10 Marksheet
                    <span class="subhead">1 file added</span>
                </p>

                <!--View LOR Details to show-->
                <div class="view-lor">
                    <p class="p-head">LOR Details</p>
                    <form class="lor-form">
                        <div class="single-input field-not-empty">
                            <label for="Name" class="field-label">Recommender's Name</label>
                            <input type="text" class="input-field" name="name" placeholder="Recommender's Name"
                                value="xyz" required>
                        </div>

                        <div class="single-input field-not-empty">
                            <label for="Designation" class="field-label">Recommender's Designation</label>
                            <input type="text" class="input-field" name="designation"
                                placeholder="Recommender's Designation" value="pqrs" required>
                        </div>

                        <div class="single-input field-not-empty">
                            <label for="email" class="field-label">Official Email Id</label>
                            <input type="email" class="input-field" name="ofemail" placeholder="Official Email Id"
                                value="xyz@gmail.com" required>
                        </div>

                        <div class="single-input field-not-empty">
                            <label for="Relation" class="field-label">Relation with the Student</label>
                            <input type="text" class="input-field" name="relation"
                                placeholder="Relation with the Student" value="father" required>
                        </div>
                        <button type="submit" class="upload-btn uploadDocument">Upload <i class="loader"></i></button>
                    </form>
                </div>
            </div>
        </div>

        <!--LOR Popup fillable-->
        <div class="lor-popup">
            <div class="top">
                <a href="javascript:;" aria-label="close" class="close lor-reset">
                    <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path
                            d="M8.23286 6.99925L13.7414 1.4989C13.906 1.33424 13.9985 1.11091 13.9985 0.878038C13.9985 0.645168 13.906 0.421835 13.7414 0.257171C13.5767 0.0925073 13.3534 0 13.1206 0C12.8877 0 12.6644 0.0925073 12.4998 0.257171L7 5.76627L1.50024 0.257171C1.33559 0.0925073 1.11228 2.06752e-07 0.879436 2.08487e-07C0.646591 2.10222e-07 0.423282 0.0925073 0.258636 0.257171C0.0939896 0.421835 0.0014924 0.645168 0.0014924 0.878038C0.0014924 1.11091 0.0939896 1.33424 0.258636 1.4989L5.76714 6.99925L0.258636 12.4996C0.176683 12.5809 0.111635 12.6776 0.067245 12.7842C0.0228546 12.8907 0 13.005 0 13.1205C0 13.2359 0.0228546 13.3502 0.067245 13.4568C0.111635 13.5633 0.176683 13.66 0.258636 13.7413C0.33992 13.8233 0.436626 13.8884 0.543175 13.9327C0.649725 13.9771 0.764009 14 0.879436 14C0.994863 14 1.10915 13.9771 1.2157 13.9327C1.32225 13.8884 1.41895 13.8233 1.50024 13.7413L7 8.23224L12.4998 13.7413C12.581 13.8233 12.6778 13.8884 12.7843 13.9327C12.8909 13.9771 13.0051 14 13.1206 14C13.236 14 13.3503 13.9771 13.4568 13.9327C13.5634 13.8884 13.6601 13.8233 13.7414 13.7413C13.8233 13.66 13.8884 13.5633 13.9328 13.4568C13.9771 13.3502 14 13.2359 14 13.1205C14 13.005 13.9771 12.8907 13.9328 12.7842C13.8884 12.6776 13.8233 12.5809 13.7414 12.4996L8.23286 6.99925Z"
                            fill="#066AC9" />
                    </svg>
                </a>
                <p class="head">LOR Details</p>
            </div>
            <div class="popup-body">
                <form class="lor-form">
                    <div class="single-input">
                        <label for="Name" class="field-label">Recommender's Name</label>
                        <input type="text" class="input-field appendName" name="name" placeholder="Recommender's Name" value="" required>
                        <span id="name_warning" style="color:red ; display:none;">Please Enter Name</span>
                    </div>

                    <div class="single-input">
                        <label for="Designation" class="field-label">Recommender's Designation</label>
                        <input type="text" class="input-field appendDesignation" name="designation"
                            placeholder="Recommender's Designation" value="" required>
                        <span id="designation_warning" style="color:red ; display:none;">Please Enter Designation</span>
                    </div>

                    <div class="single-input">
                        <label for="email" class="field-label">Official Email Id</label>
                        <input type="email" class="input-field appendEmail" name="ofemail" placeholder="Official Email Id"
                            value="" required>
                        <span id="email_warning" style="color:red ; display:none;">Please Enter a Valid Email</span>
                    </div>

                    <div class="single-input">
                        <label for="Relation" class="field-label">Relation with the Student</label>
                        <input type="text" class="input-field appendStudent" name="relation"
                            placeholder="Relation with the Student" value="" required>
                        <span id="relation_warning" style="color:red ; display:none;">Please Enter Relation</span>
                    </div>
                    <input type="hidden" name="form_name" value="lor_form">
                    <input type="hidden" class="update" name="update" value="0">
                    <input type="hidden" class="id" name="secondaryId">
                    <input type="hidden" name="subcategory_name" class="subcategory_name" value="" />
                    <button type="submit" class="upload-btn">Next <i class="loader"></i></button>
                </form>
            </div>

        </div>
        {{-- document screen popup --}}
        <div class="doc-screen-popup">
            <div class="top">
                <a href="javascript:;" aria-label="close" class="close">
                    <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path
                            d="M8.23286 6.99925L13.7414 1.4989C13.906 1.33424 13.9985 1.11091 13.9985 0.878038C13.9985 0.645168 13.906 0.421835 13.7414 0.257171C13.5767 0.0925073 13.3534 0 13.1206 0C12.8877 0 12.6644 0.0925073 12.4998 0.257171L7 5.76627L1.50024 0.257171C1.33559 0.0925073 1.11228 2.06752e-07 0.879436 2.08487e-07C0.646591 2.10222e-07 0.423282 0.0925073 0.258636 0.257171C0.0939896 0.421835 0.0014924 0.645168 0.0014924 0.878038C0.0014924 1.11091 0.0939896 1.33424 0.258636 1.4989L5.76714 6.99925L0.258636 12.4996C0.176683 12.5809 0.111635 12.6776 0.067245 12.7842C0.0228546 12.8907 0 13.005 0 13.1205C0 13.2359 0.0228546 13.3502 0.067245 13.4568C0.111635 13.5633 0.176683 13.66 0.258636 13.7413C0.33992 13.8233 0.436626 13.8884 0.543175 13.9327C0.649725 13.9771 0.764009 14 0.879436 14C0.994863 14 1.10915 13.9771 1.2157 13.9327C1.32225 13.8884 1.41895 13.8233 1.50024 13.7413L7 8.23224L12.4998 13.7413C12.581 13.8233 12.6778 13.8884 12.7843 13.9327C12.8909 13.9771 13.0051 14 13.1206 14C13.236 14 13.3503 13.9771 13.4568 13.9327C13.5634 13.8884 13.6601 13.8233 13.7414 13.7413C13.8233 13.66 13.8884 13.5633 13.9328 13.4568C13.9771 13.3502 14 13.2359 14 13.1205C14 13.005 13.9771 12.8907 13.9328 12.7842C13.8884 12.6776 13.8233 12.5809 13.7414 12.4996L8.23286 6.99925Z"
                            fill="#24292d" />
                    </svg>
                </a>
                <p class="head-title">Transcripts</p>
            </div>
            <div class="popup-body">
               <p class="popup-title">What is Transcript?</p>
               <p class="popup-desc">
                A transcript is a document that serves as a comprehensive record of a student's academic performance throughout their educational journey. Typically issued by educational institutions, transcripts contain detailed information about the courses a student has taken, the grades obtained, and any degrees or certificates earned. These documents play a crucial role in various educational and professional contexts, such as college admissions, job applications, and visa processes. Transcripts provide a snapshot of an individual's academic achievements, showcasing their strengths and areas of expertise. They are often requested by universities, employers, or immigration authorities to assess an individual's qualifications and suitability for a particular academic program, job, or immigration status. The accuracy and authenticity of transcripts are essential, making them a key component in educational and professional assessments.
               </p>
            </div>

        </div>

        <!--Delete Popup-->
        <div class="delete-popup">
            <div class="top">
                <a href="javascript:;" aria-label="close" class="close-del">
                    <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path
                            d="M8.23286 6.99925L13.7414 1.4989C13.906 1.33424 13.9985 1.11091 13.9985 0.878038C13.9985 0.645168 13.906 0.421835 13.7414 0.257171C13.5767 0.0925073 13.3534 0 13.1206 0C12.8877 0 12.6644 0.0925073 12.4998 0.257171L7 5.76627L1.50024 0.257171C1.33559 0.0925073 1.11228 2.06752e-07 0.879436 2.08487e-07C0.646591 2.10222e-07 0.423282 0.0925073 0.258636 0.257171C0.0939896 0.421835 0.0014924 0.645168 0.0014924 0.878038C0.0014924 1.11091 0.0939896 1.33424 0.258636 1.4989L5.76714 6.99925L0.258636 12.4996C0.176683 12.5809 0.111635 12.6776 0.067245 12.7842C0.0228546 12.8907 0 13.005 0 13.1205C0 13.2359 0.0228546 13.3502 0.067245 13.4568C0.111635 13.5633 0.176683 13.66 0.258636 13.7413C0.33992 13.8233 0.436626 13.8884 0.543175 13.9327C0.649725 13.9771 0.764009 14 0.879436 14C0.994863 14 1.10915 13.9771 1.2157 13.9327C1.32225 13.8884 1.41895 13.8233 1.50024 13.7413L7 8.23224L12.4998 13.7413C12.581 13.8233 12.6778 13.8884 12.7843 13.9327C12.8909 13.9771 13.0051 14 13.1206 14C13.236 14 13.3503 13.9771 13.4568 13.9327C13.5634 13.8884 13.6601 13.8233 13.7414 13.7413C13.8233 13.66 13.8884 13.5633 13.9328 13.4568C13.9771 13.3502 14 13.2359 14 13.1205C14 13.005 13.9771 12.8907 13.9328 12.7842C13.8884 12.6776 13.8233 12.5809 13.7414 12.4996L8.23286 6.99925Z"
                            fill="#066AC9" />
                    </svg></a>
                <p class="head">Delete Document</p>
            </div>

            <div class="popup-body">
                <img src="{{asset('student-panel')}}/images/delete.svg" alt="icon">
                <p class="p-head">Are you sure you want to delete “<span class="deleteAppend">Class 10 Marksheet</span>”</p>
                <span class="subhead">All of your data will be permanently removed.This action can not be
                    undone.</span>
            </div>

            <button type="submit" class="btn delete-btn">Delete</button>
        </div>
        <!--Success Message-->
        <p class="success-msg successMessage" style="display: none;">
            <img src="{{asset('student-panel')}}/images/green-tick.svg" alt="green-tick">
            Perfect! Your Class 10 Marksheet is Uploaded
        </p>

         <!--Success Message-->
         <p class="success-msg delete-msg deleteMessage" style="display: none;">
            Your Class 10 Marksheet is Deleted
        </p>

        <!--End-->

    </div>
</div>

<div class="sidebar-overlay"></div>
<div class="overlay"></div>
@endsection

@section('css')
    <link rel="stylesheet" href="{{asset('student-panel')}}/css/documents.css?v={{env('ASSETS_VERSION')}}">
@endsection

@section('script')
<script src="{{asset('student-panel')}}/js/input-field.js?v={{env('ASSETS_VERSION')}}"></script>
    <script src="{{asset('student-panel')}}/js/common.js?v={{env('ASSETS_VERSION')}}"></script>
    <script src="{{asset('frontend')}}/assets-desktop/js/validation.js?v={{env('ASSETS_VERSION')}}"></script>
    <script>
        if (window.innerWidth < 768) {
            $(document).on('click',".up-link",function () {
                $(".upload-popup").animate({ left: "0" });
            })

            $(document).on('click',".lor-link,.view-detail",function () {
                $(".lor-popup").show();
                $(".lor-popup").animate({ left: "0" });
            })
            $(document).on('click',".close",function () {
                $(".upload-popup,.lor-popup").animate({ left: "-110%" });
            })

            $(document).on('click',".delete",function () {
                $(".overlay").show();
                $(".delete-popup").animate({ bottom: "0" }).show();
            })
            $(document).on('click',".close-del",function () {
                $('.delete-btn').prop('disabled', false);
                $(".delete-popup").animate({ bottom: "-110%" }).hide();
            })
            // transacript poupup
            $(document).on('click',".link-popup",function () {
                $(".doc-screen-popup").animate({ top: "0" });
            })
            $(document).on('click',".close",function () {
                $(".doc-screen-popup").animate({ top: "110%" });
            })
        }
        else {
            $(document).on('click', ".up-link,.lor-link,.delete,.view-detail,.link-popup" ,function () {
                $(".overlay").show();
            })

            $(document).on('click', '.up-link',function () {
                $(".upload-popup").show();
            })


            $(document).on('click',".lor-link,.view-detail", function () {
                $(".lor-popup").show();
            })

            $(document).on('click', '.delete' , function () {
                $('.delete-btn').prop('disabled', false);
                $(".delete-popup").show();
            });

            $(document).on('click',".close,.close-del",function () {
                $(".upload-popup,.lor-popup,.delete-popup,.doc-screen-popup").hide();
            })
            // transcript popup
            $(document).on('click',".link-popup", function () {
                $(".doc-screen-popup").show();
            })
        }

        $(document).on('click', '.tabs', function(){
            refreshDocuments();
        });

        $(document).on('change', '#file', function () {
            $('.demo-button').hide();
            $('#adding_section').hide();
            $('#added_section').show();
            $('.uploadDocument').show();
        });

        // $('.demo-button').on('click', function () {
            
        // });

        $(document).on('click', '.lor-link', function(){
            $('.appendName').val('');
            $('.appendDesignation').val('');
            $('.appendEmail').val('');
            $('.appendStudent').val('');
        });



        $(document).on('click', '.drp-item', function () {
            var category = $(this).find('.findCatgeory').data('value');
            console.log('category: '+ category);
            $('.subcategory_name').val(category);
            $('.successMessage').empty().append(`<img src="{{asset('student-panel')}}/images/green-tick.svg" alt="green-tick">
            Perfect! Your `+ category +` is Uploaded`);
            $('.deleteMessage').empty().append(`Your `+ category +` Document is Deleted`);
            $('.head').text(category);
            $('#file_subcategory').text(category);
            $('.deleteAppend').text(category);
        });

        $('#modal_warning').hide();
        refreshDocuments();

        $('#file_upload_form').on('submit', function(e) {
            $('.uploadDocument').prop('disabled', true);
            e.preventDefault();
            $('.loader').show();
            formData = new FormData($(this)[0]);
            var updateDoc = $('.updateDocument').val();
            if(updateDoc == '0'){
                if (validate_file(formData)) {
                $.ajax({
                    type: 'POST',
                    url: '/dashboard/documents_upload',
                    data: formData,
                    cache: false,
                    processData: false,
                    contentType: false,
                    success: (res) => {
                            if(res.status==1){
                                refreshDocuments();
                                $('.loader').hide();
                                $('#modal_warning').hide();
                                $('.successMessage').show();
                                setTimeout(() => {
                                    $('.successMessage').hide();
                                }, 3000);
                                $('.uploadDocument').prop('disabled', false);
                            }
                    }
                });
                }else{
                    $('.loader').hide();
                    $('.demo-button').show();
                    $('#adding_section').show();
                    $('#added_section').hide();
                    $('.uploadDocument').hide();
                    $('#modal_warning').show();
                    $('.uploadDocument').prop('disabled', false);
                }
            }else if(updateDoc == '1'){
                if (validate_file(formData)) {
                $('.successMessage').hide();
                $.ajax({
                    type: 'POST',
                    url: '/dashboard/documents_upload_lor',
                    data: formData,
                    cache: false,
                    processData: false,
                    contentType: false,
                    success: (res) => {
                            if(res.status==1){
                                refreshDocuments();
                                $('.loader').hide();
                                $('.updateDocument').val('0');
                                $('#modal_warning').hide();
                                $('.successMessage').show();
                                setTimeout(() => {
                                    $('.successMessage').hide();
                                }, 3000);
                                $('.uploadDocument').prop('disabled', false);
                            }
                    }
                });
                }else{
                    $('.loader').hide();
                    $('.demo-button').show();
                    $('#adding_section').show();
                    $('#added_section').hide();
                    $('.uploadDocument').hide();
                    $('#modal_warning').show();
                    $('.uploadDocument').prop('disabled', false);
                }
            }
        });

        function validate_file(formData) {
            var file = formData.get("file")['name'];
            if (file == "" || file == null) {
                return false
            }
            var extension = file.substr(file.lastIndexOf("."));
            var allowedExtensionsRegx = /(\.pdf|\.jpeg|\.jpg|\.png|\.txt|\.docx|\.dox|\.xlsx)$/i;
            var isAllowed = allowedExtensionsRegx.test(extension);
            if (!isAllowed) {
                return false;
            }
            return true;
        }

        function validate_lor(formData) {
            var Name = formData.get("name");
            var Designation = formData.get("designation");
            var Email = formData.get("ofemail");
            var Relation = formData.get("relation");
            if ((Name != "" || Name != null) && (Designation != "" || Designation != null) && (Email != "" || Email != null) && (Relation != "" || Relation != null)) {
                return true;
            }else{
                if(Name == "" || Name == null){
                    $('#name_warning').show();
                    return false
                }if(Designation == "" || Designation == null){
                    $('#designation_warning').show();
                    return false
                }if(Email == "" || Email == null){
                    $('#email_warning').show();
                    return false
                }if(Relation == "" || Relation == null){
                    $('#relation_warning').show();
                    return false
                }
            }
        }

        $(document).on('click', '.view-detail', function () {
            $('.update').val('1');
            var id = $(this).data('id');
            $('.id').val(id);
        });

        $(document).on('click', '.lor-reset', function () {
            $('.update').val('0');
            $('.id').val('');
        });

        $('.lor-form').on('submit', function(e) {
        e.preventDefault();
        $('.uploadDocument').prop('disabled', true);
        var update = $('.update').val();
        formData = new FormData($(this)[0]);
            if(update == '0'){
                if(validate_lor(formData)){
                    $.ajax({
                        type: 'POST',
                        url: '/dashboard/documents_upload',
                        data: formData,
                        cache: false,
                        processData: false,
                        contentType: false,
                        success: (res) => {
                                if(res.status==1){
                                    $(".lor-popup").hide();
                                    if (window.innerWidth < 768) {
                                        $(".upload-popup").animate({ left: "0" });
                                    }else{
                                        $(".upload-popup").show();
                                    }
                                    $('.updateDocument').val('1')
                                    $('.uploadDocument').prop('disabled', false);
                                }
                        }
                    });
                }
            }else if(update == '1'){
                id = $('.id').val();
                if(validate_lor(formData)){
                    $.ajax({
                        type: 'POST',
                        url: '/dashboard/documents_lor_update',
                        data: formData,
                        cache: false,
                        processData: false,
                        contentType: false,
                        success: (res) => {
                                if(res.status==1){
                                    $(".lor-popup").hide();
                                    $('.update').val('0');
                                    if (window.innerWidth < 768) {
                                        $(".upload-popup").animate({ left: "0" });
                                    }else{
                                        $(".upload-popup").show();
                                    }
                                    $('.id').val('');
                                    $('.updateDocument').val('1')
                                    $('.uploadDocument').prop('disabled', false);
                                }
                        }
                    });
                }
            }
        });

        $(document).on('click', '.up-link', function(){
            $('.updateDocument').val('0')
        });

        function refreshDocuments() {
            $.ajax({
                type: "GET",
                url: '/dashboard/get_documents',
                success: function(res) {
                    $('.close').trigger('click');
                    $(' #adding_section').show();
                    $('#added_section').hide();
                    if(res.status == 1){
                        var uploaded_subcategory_ids = [],document_ids=[],uploaded_updated_at = [],document_locations = [];
                        var document_link=res.document_link;
                        res.uploaded_documents.map(function(document) {
                            document_ids.push(document["id"]);
                            uploaded_subcategory_ids.push(document["document_subcategory_id"]);
                            uploaded_updated_at.push(document["updated_at"]);
                            document_locations.push(document["document_location"]);
                        });
                        function appendDocument(subcategory, id, container, classData) {
                            var classKey = "";
                            var downloadKey =""
                            var getData = ""
                            var downloadText = '';
                            if (subcategory == "LOR 1" || subcategory == "LOR 2") {
                                spanText = classData['viewText'];
                                classKey = classData['lor'];
                                downloadKey = classData['view-detail'];
                                getData = classData['lor-data']
                                image = classData['viewImage']
                            } else{
                                spanText = classData['downloadText'];
                                classKey = classData['upload'];
                                downloadKey = classData['download'];
                                getData = "";
                                image = classData['downloadImage']
                            }

                            var classAttribute = classKey;
                            var isUploaded = uploaded_subcategory_ids.includes(id);

                            var template = isUploaded ?

                                `
                                <div class="drp-item after-select">
                                    <img src="{{asset('student-panel')}}/images/green-tick.svg" alt="icon">
                                    <span class="f-name searchChild">${subcategory}</span>
                                    <img src="{{asset('student-panel')}}/images/dots.svg" class="dots" alt="dots">
                                    <p class="dots-box">
                                        <a data-id="${document_ids[uploaded_subcategory_ids.indexOf(id)]}" onclick='downloadFile("${document_link}${document_locations[uploaded_subcategory_ids.indexOf(id)]}")' href="javascript:;" class="${downloadKey} ${getData}" aria-label="${downloadKey}">
                                            <img data-value="${subcategory}" class="findCatgeory" src="{{asset('student-panel')}}/images/${image}" alt="icon">
                                            <span>${spanText}</span>
                                        </a>
                                        <a href="javascript:;" data-value="${document_ids[uploaded_subcategory_ids.indexOf(id)]}" id="delete" class="delete appendDeleteSpan" aria-label="delete">
                                            <img class="findCatgeory" data-value="${subcategory}" src="{{asset('student-panel')}}/images/delete.svg" alt="icon">
                                            <span>Delete</span>
                                        </a>
                                    </p>
                                </div>` :
                                `<div class="drp-item searchChild">${subcategory}
                                    <a href="javascript:;" data-value="${id}_${subcategory}" class="${classAttribute}" aria-label="upload">
                                        <img class="findCatgeory" data-value="${subcategory}" src="{{asset('student-panel')}}/images/up-icon.svg" alt="icon">
                                    </a>
                                </div>`;

                            container.append(template);
                        }

                        $('.gettingToKnowYou,.degreesTranscripts,.schoolDropdown,.aptitude_test_tarksheets,.english_proficiency_test_scores,.professional_experience,.personal_information,.other,.visa,.financial,.appendVisa,.financialAppend,.additionalDocument').empty();
                        
                        $.each(res.subcategories['additional'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.gettingToKnowYou'), { 'upload': 'up-link', 'lor': 'lor-link', 'download' : 'download' , 'view-detail' : 'view-detail', 'lor-data' : 'getData', 'downloadText' : 'Download', 'viewText' : 'View Detail', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg'  });
                        });

                        $.each(res.subcategories['degree'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.degreesTranscripts'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download'});
                        });

                        $.each(res.subcategories['school'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.schoolDropdown'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });
                        
                        $.each(res.subcategories['Aptitude_Test_Marksheets'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.aptitude_test_tarksheets'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });

                        $.each(res.subcategories['English Proficiency Test Scores'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.english_proficiency_test_scores'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });

                        $.each(res.subcategories['Professional Experience'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.professional_experience'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });
                        
                        $.each(res.subcategories['Personal Information'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.personal_information'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });

                        $.each(res.subcategories['Other'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.other'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });

                        $.each(res.subcategories['Visa'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.visa'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                            appendDocument(subcategory, id, $('.appendVisa'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });

                        $.each(res.subcategories['Financial'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.financial'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                            appendDocument(subcategory, id, $('.financialAppend'), { 'upload': 'up-link', 'downloadImage' : 'view-eye.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });
                        $.each(res.subcategories['Additional Documents'], function (subcategory, id) {
                            appendDocument(subcategory, id, $('.additionalDocument'), { 'upload': 'up-link', 'downloadImage' : 'download.svg', 'viewImage' : 'detail-icon.svg', 'downloadText' : 'Download' });
                        });
                    }
                    
                },
            });
        }


    function SearchDocuments() {
        $('.searchDocuments').trigger('click');
        $('.searchDocuments').addClass('active');
        var searchTerm = $("#searchDocuments").val().toLowerCase();
        resultFound = false;
        $('.searchHead').each(function() {
            if(searchTerm == ''){
                $(this).show();
                resultFound = true;
                var activeMember = $(this).find('.drp-head');
                if (activeMember.hasClass('active')) {
                    activeMember.trigger('click').removeClass('active');
                }
            }else{
                var drpHead = $(this).find('.drp-head');
                var drpHeadText = $(this).find('.drp-head').text().toLowerCase();
                if (drpHeadText.indexOf(searchTerm) !== -1) {
                    if (!drpHead.hasClass('active')) {
                        drpHead.trigger('click').addClass('active');
                    }
                    $(this).show();
                    resultFound = true;
                } else {
                    var selectChild = $(this).find('.searchChild');
                    var selectChildText = $(this).find('.searchChild').text().toLowerCase();
                    if (selectChildText.indexOf(searchTerm) !== -1) {
                        if (!drpHead.hasClass('active')) {
                            drpHead.trigger('click').addClass('active');
                        }
                        $(this).show(); 
                        resultFound = true;
                    }else{
                        $(this).hide();
                    }
                }
            }
        });

        if(!resultFound){
            $('.showMessage').show();
        }else{
            $('.showMessage').hide();
        }

    } 
    $(document).on('click',  '#delete', function (event) {
        event.preventDefault();
        var documentId = $(this).data('value');
        $(document).on('click', '.delete-popup .delete-btn', function (event) {
                $('.delete-btn').prop('disabled', true);
                event.preventDefault();
                $.ajax({
                    url: '/dashboard/delete_documents/' + documentId,
                    method: 'get',
                    success: function (res) {
                        if (res.status == 1) {
                            refreshDocuments();
                            $('.close-del').trigger('click');
                            $('.deleteMessage').show();
                            setTimeout(() => {
                                $('.deleteMessage').hide();
                            }, 3000);
                        }
                    },
                    error: function (error) {
                        console.error('Delete request failed:', error);
                    }
                });
            });
    });
    
    function downloadFile(downloadUrl) {
            downloadUrl = downloadUrl.replace(/\/+/g, '/');
            downloadUrl = downloadUrl.replace(/:\/+/g, '://');
            var link = document.createElement('a');
            link.href = downloadUrl;
            link.target = '_blank';
            var mainDomainIndex = link.hostname.indexOf('gradding.s3.ap-south-1.amazonaws.com');
            if (mainDomainIndex !== -1) {
                link.hostname = link.hostname.substring(mainDomainIndex);
            }
            document.body.appendChild(link);
            link.click();
            link.remove();
    }


    $(document).on('click', '.ad-file', function(){
        $('.uploadFile').trigger('click');
    });

    $(document).on('click', '.getData',function(){
        id = $(this).data('id');
        $.ajax({
            url: '/dashboard/get_lor/' + id,
            method: 'get',
            success: function (res) {
                if(res.document_data != null || res.document_data != undefined){
                    data = res.document_data;
                    var jsonData = $.parseJSON(data);
                    $('.appendName').val(jsonData.name);
                    $('.appendDesignation').val(jsonData.designation);
                    $('.appendEmail').val(jsonData.ofemail);
                    $('.appendStudent').val(jsonData.relation);
                }
            },
        });
    });

    $(document).on('click', '.uploadClose' , function () {
        $('.demo-button').show();
        $('#adding_section').show();
        $('#added_section').hide();
        $('.uploadDocument').hide();
        $()
    });

    $(document).on('click', '.otherDocumentUpload' , function () {
        var category = 'Other Document'
            $('.subcategory_name').val(category);
            $('.head').text(category);
            $('#file_subcategory').text(category);
            $('.deleteAppend').text(category);
    });
    </script>
@endsection