@extends('layouts.front_master')

@section('content')

@php
    $courseList=get_category_wise_course();
    $relatedCourseList=get_related_course($detail->category_id,$detail->id);
@endphp



<!-- banner area start -->

<div class="banner-sec">

    <div class="container">

        <div class="page-banner inner-page-banner">

            <div class="row align-items-center">

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

                    <div class="banner-txt">

                        <h1> {{$detail->name}}</h1>

                        <p>{{$detail->credit_title}}</p>

                        <p>{{$detail->sub_title}}</p>

                        @php
                        $packageDetail=get_course_package($detail->id,true);
                        @endphp
                        <a href="{{url('enrol-course/'.$detail->url.'/'.$packageDetail->id)}}?type=1" class="theme-yellow-btn margin-right-10">Enrol Now</a>

                        <a href="{{url('try-for-test')}}" class="theme-blue-btn">Try For Free</a>

                    </div>

                </div>

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

                    <div class="banner-right-img">

                        <img src="{{asset('courses/'.$detail->image)}}">

                    </div>

                </div>

            </div>



        </div>

    </div>

</div>

<!-- banner area end -->



<!-- about-botton start -->

<div class="cta-section course-page-about-course">

    <div class="container">

        <div class="row align-items-center">

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

                <div class="cta-section-txt">

                    <h3>About This Course</h3>

                    @php

                    echo $detail->description;

                    @endphp



                </div>

            </div>

        </div>

    </div>

</div>

<!-- about-botton end -->





<!-- faq section start -->

<div class="faq-section section-padding-80">

    <div class="container">

        <div class="row">

            <div class="section-heading">

                <h2>Course Details</h2>

            </div>

            <div class="accordion faq-box mt-50" id="accordionExample">

                @foreach ($faq as $key=> $faq_data)



                <div class="accordion-item">

                    <h2 class="accordion-header" id="headingOne{{$faq_data->id}}">

                        <button class="accordion-button  @if($key!=0) collapsed @endif" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne{{$faq_data->id}}" aria-expanded="true" aria-controls="collapseOne{{$faq_data->id}}">

                            {{$faq_data->name}}

                        </button>

                    </h2>

                    <div id="collapseOne{{$faq_data->id}}" class="accordion-collapse collapse @if ($key==0)

                    show

                    @endif" aria-labelledby="headingOne{{$faq_data->id}}" data-bs-parent="#accordionExample">

                        <div class="accordion-body">

                            @php

                            echo $faq_data->short_description;

                            @endphp

                        </div>

                    </div>

                </div>

                @endforeach



            </div>

        </div>

    </div>

</div>

<!-- faq section end -->



<!-- Choose your course option start -->

<div class="choose-your-course-sec">

    <div class="container">

        <div class="section-heading mb-30">

            <h2>Choose your course option</h2>

        </div>

        <div class="row">

            @foreach ($packages as $key=> $packages_data)

            <div class="col-lg-4 col-md-6">

                <div class="course-price-box">

                    <div class="course-price-box-heading">

                        <h4>{{$packages_data->title}}</h4>

                    </div>

                    <div class="course-price-box-content">

                        <h3>{{$packages_data->subtitle}}</h3>

                        <p class="course-price-txt">£{{$packages_data->price}}</p>

                        <div class="mb-30">

                            @php

                            echo $packages_data->detail;

                            @endphp

                        </div>



                        <a href="{{url('enrol-course/'.$detail->url.'/'.$packages_data->id)}}?type=1" class="theme-blue-btn pricing-btn" tabindex="0">Enrol Now</a>

                    </div>

                </div>

            </div>

            @endforeach

        </div>

    </div>

</div>

<!-- Choose your course option end -->





<!-- measage now start-->

<div class="request-course  section-margin-80 section-padding-80" style="background-color: #ededed">

    <div class="container">

        <div class="row">

            <div class="section-heading">

                <h2>Request a Course Prospectus</h2>

            </div>

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

                <div class="message-now-form request-course-form">

                    <form id="message-form" data-parsley-validate action="{{ url('save-course-prospectus-detail') }}" method="POST" class="message-form">
                        @csrf
                        <div class="row">

                            <div class="col-lg-6 mb-3">

                                <label for="firstname" class="form-label">First Name</label>

                                <input type="text" name="firstname" class="form-control" required>

                            </div>

                            <div class="col-lg-6 mb-3">

                                <label for="lastname" class="form-label">Last Name</label>

                                <input type="text" name="lastname" class="form-control" required>

                            </div>

                            <div class="col-lg-6 mb-3">

                                <label for="email" class="form-label">Email Address</label>

                                <input type="text" name="email" class="form-control" required>

                            </div>

                            <div class="col-lg-6 mb-3">

                                <label for="phoneno" class="form-label">Phone Number</label>

                                <input type="text" name="phoneno" class="form-control" required>

                            </div>

                            <div class="col-lg-6 mb-3">

                                <label for="Country" class="form-label">Country</label>

                                <div class="contact__input">

                                    <select class="js-example-basic-single" name="country" required>

                                        <option value="">Select Country</option>

                                        <option value="Afghanistan">Afghanistan</option>

                                        <option value="Albania">Albania</option>

                                        <option value="Algeria">Algeria</option>

                                        <option value="Andorra">Andorra</option>

                                        <option value="Angola">Angola</option>

                                        <option value="Antigua and Barbuda">Antigua and Barbuda</option>

                                        <option value="Argentina">Argentina</option>

                                        <option value="Armenia">Armenia</option>

                                        <option value="Australia">Australia</option>

                                        <option value="Austria">Austria</option>

                                        <option value="Azerbaijan">Azerbaijan</option>

                                        <option value="Bahamas">Bahamas</option>

                                        <option value="Bahrain">Bahrain</option>

                                        <option value="Bangladesh">Bangladesh</option>

                                        <option value="Barbados">Barbados</option>

                                        <option value="Belarus">Belarus</option>

                                        <option value="Belgium">Belgium</option>

                                        <option value="Belize">Belize</option>

                                        <option value="Benin">Benin</option>

                                        <option value="Bhutan">Bhutan</option>

                                        <option value="Bolivia">Bolivia</option>

                                        <option value="Bosnia and Herzegovina">Bosnia and Herzegovina

                                        </option>

                                        <option value="Botswana">Botswana</option>

                                        <option value="Brazil">Brazil</option>

                                        <option value="Brunei">Brunei</option>

                                        <option value="Bulgaria">Bulgaria</option>

                                        <option value="Burkina Faso">Burkina Faso</option>

                                        <option value="Burundi">Burundi</option>

                                        <option value="Cabo Verde">Cabo Verde</option>

                                        <option value="Cambodia">Cambodia</option>

                                        <option value="Cameroon">Cameroon</option>

                                        <option value="Canada">Canada</option>

                                        <option value="Central African Republic">Central African Republic

                                        </option>

                                        <option value="Chad">Chad</option>

                                        <option value="Chile">Chile</option>

                                        <option value="China">China</option>

                                        <option value="Colombia">Colombia</option>

                                        <option value="Comoros">Comoros</option>

                                        <option value="Congo, Democratic Republic of the">Congo, Democratic

                                            Republic of the</option>

                                        <option value="Congo, Republic of the">Congo, Republic of the

                                        </option>

                                        <option value="Costa Rica">Costa Rica</option>

                                        <option value="Croatia">Croatia</option>

                                        <option value="Cuba">Cuba</option>

                                        <option value="Cyprus">Cyprus</option>

                                        <option value="Czech Republic">Czech Republic</option>

                                        <option value="Denmark">Denmark</option>

                                        <option value="Djibouti">Djibouti</option>

                                        <option value="Dominica">Dominica</option>

                                        <option value="Dominican Republic">Dominican Republic</option>

                                        <option value="Ecuador">Ecuador</option>

                                        <option value="Egypt">Egypt</option>

                                        <option value="El Salvador">El Salvador</option>

                                        <option value="Equatorial Guinea">Equatorial Guinea</option>

                                        <option value="Eritrea">Eritrea</option>

                                        <option value="Estonia">Estonia</option>

                                        <option value="Eswatini">Eswatini</option>

                                        <option value="Ethiopia">Ethiopia</option>

                                        <option value="Fiji">Fiji</option>

                                        <option value="Finland">Finland</option>

                                        <option value="France">France</option>

                                        <option value="Gabon">Gabon</option>

                                        <option value="Gambia">Gambia</option>

                                        <option value="Georgia">Georgia</option>

                                        <option value="Germany">Germany</option>

                                        <option value="Ghana">Ghana</option>

                                        <option value="Greece">Greece</option>

                                        <option value="Grenada">Grenada</option>

                                        <option value="Guatemala">Guatemala</option>

                                        <option value="Guinea">Guinea</option>

                                        <option value="Guinea-Bissau">Guinea-Bissau</option>

                                        <option value="Guyana">Guyana</option>

                                        <option value="Haiti">Haiti</option>

                                        <option value="Honduras">Honduras</option>

                                        <option value="Hungary">Hungary</option>

                                        <option value="Iceland">Iceland</option>

                                        <option value="India">India</option>

                                        <option value="Indonesia">Indonesia</option>

                                        <option value="Iran">Iran</option>

                                        <option value="Iraq">Iraq</option>

                                        <option value="Ireland">Ireland</option>

                                        <option value="Israel">Israel</option>

                                        <option value="Italy">Italy</option>

                                        <option value="Jamaica">Jamaica</option>

                                        <option value="Japan">Japan</option>

                                        <option value="Jordan">Jordan</option>

                                        <option value="Kazakhstan">Kazakhstan</option>

                                        <option value="Kenya">Kenya</option>

                                        <option value="Kiribati">Kiribati</option>

                                        <option value="Korea, North">Korea, North</option>

                                        <option value="Korea, South">Korea, South</option>

                                        <option value="Kosovo">Kosovo</option>

                                        <option value="Kuwait">Kuwait</option>

                                        <option value="Kyrgyzstan">Kyrgyzstan</option>

                                        <option value="Laos">Laos</option>

                                        <option value="Latvia">Latvia</option>

                                        <option value="Lebanon">Lebanon</option>

                                        <option value="Lesotho">Lesotho</option>

                                        <option value="Liberia">Liberia</option>

                                        <option value="Libya">Libya</option>

                                        <option value="Liechtenstein">Liechtenstein</option>

                                        <option value="Lithuania">Lithuania</option>

                                        <option value="Luxembourg">Luxembourg</option>

                                        <option value="Madagascar">Madagascar</option>

                                        <option value="Malawi">Malawi</option>

                                        <option value="Malaysia">Malaysia</option>

                                        <option value="Maldives">Maldives</option>

                                        <option value="Mali">Mali</option>

                                        <option value="Malta">Malta</option>

                                        <option value="Marshall Islands">Marshall Islands</option>

                                        <option value="Mauritania">Mauritania</option>

                                        <option value="Mauritius">Mauritius</option>

                                        <option value="Mexico">Mexico</option>

                                        <option value="Micronesia">Micronesia</option>

                                        <option value="Moldova">Moldova</option>

                                        <option value="Monaco">Monaco</option>

                                        <option value="Mongolia">Mongolia</option>

                                        <option value="Montenegro">Montenegro</option>

                                        <option value="Morocco">Morocco</option>

                                        <option value="Mozambique">Mozambique</option>

                                        <option value="Myanmar">Myanmar</option>

                                        <option value="Namibia">Namibia</option>

                                        <option value="Nauru">Nauru</option>

                                        <option value="Nepal">Nepal</option>

                                        <option value="Netherlands">Netherlands</option>

                                        <option value="New Zealand">New Zealand</option>

                                        <option value="Nicaragua">Nicaragua</option>

                                        <option value="Niger">Niger</option>

                                        <option value="Nigeria">Nigeria</option>

                                        <option value="North Macedonia">North Macedonia</option>

                                        <option value="Norway">Norway</option>

                                        <option value="Oman">Oman</option>

                                        <option value="Pakistan">Pakistan</option>

                                        <option value="Palau">Palau</option>

                                        <option value="Palestine">Palestine</option>

                                        <option value="Panama">Panama</option>

                                        <option value="Papua New Guinea">Papua New Guinea</option>

                                        <option value="Paraguay">Paraguay</option>

                                        <option value="Peru">Peru</option>

                                        <option value="Philippines">Philippines</option>

                                        <option value="Poland">Poland</option>

                                        <option value="Portugal">Portugal</option>

                                        <option value="Qatar">Qatar</option>

                                        <option value="Romania">Romania</option>

                                        <option value="Russia">Russia</option>

                                        <option value="Rwanda">Rwanda</option>

                                        <option value="Saint Kitts and Nevis">Saint Kitts and Nevis</option>

                                        <option value="Saint Lucia">Saint Lucia</option>

                                        <option value="Saint Vincent and the Grenadines">Saint Vincent and

                                            the Grenadines</option>

                                        <option value="Samoa">Samoa</option>

                                        <option value="San Marino">San Marino</option>

                                        <option value="Sao Tome and Principe">Sao Tome and Principe</option>

                                        <option value="Saudi Arabia">Saudi Arabia</option>

                                        <option value="Senegal">Senegal</option>

                                        <option value="Serbia">Serbia</option>

                                        <option value="Seychelles">Seychelles</option>

                                        <option value="Sierra Leone">Sierra Leone</option>

                                        <option value="Singapore">Singapore</option>

                                        <option value="Slovakia">Slovakia</option>

                                        <option value="Slovenia">Slovenia</option>

                                        <option value="Solomon Islands">Solomon Islands</option>

                                        <option value="Somalia">Somalia</option>

                                        <option value="South Africa">South Africa</option>

                                        <option value="Spain">Spain</option>

                                        <option value="Sri Lanka">Sri Lanka</option>

                                        <option value="Sudan">Sudan</option>

                                        <option value="Suriname">Suriname</option>

                                        <option value="Sweden">Sweden</option>

                                        <option value="Switzerland">Switzerland</option>

                                        <option value="Syria">Syria</option>

                                        <option value="Taiwan">Taiwan</option>

                                        <option value="Tajikistan">Tajikistan</option>

                                        <option value="Tanzania">Tanzania</option>

                                        <option value="Thailand">Thailand</option>

                                        <option value="Timor-Leste">Timor-Leste</option>

                                        <option value="Togo">Togo</option>

                                        <option value="Tonga">Tonga</option>

                                        <option value="Trinidad and Tobago">Trinidad and Tobago</option>

                                        <option value="Tunisia">Tunisia</option>

                                        <option value="Turkey">Turkey</option>

                                        <option value="Turkmenistan">Turkmenistan</option>

                                        <option value="Tuvalu">Tuvalu</option>

                                        <option value="Uganda">Uganda</option>

                                        <option value="Ukraine">Ukraine</option>

                                        <option value="United Arab Emirates">United Arab Emirates</option>

                                        <option value="United Kingdom">United Kingdom</option>

                                        <option value="United States">United States</option>

                                        <option value="Uruguay">Uruguay</option>

                                        <option value="Uzbekistan">Uzbekistan</option>

                                        <option value="Vanuatu">Vanuatu</option>

                                        <option value="Vatican City">Vatican City</option>

                                        <option value="Venezuela">Venezuela</option>

                                        <option value="Vietnam">Vietnam</option>

                                        <option value="Yemen">Yemen</option>

                                        <option value="Zambia">Zambia</option>

                                        <option value="Zimbabwe">Zimbabwe</option>

                                    </select>



                                </div>

                            </div>

                            <div class="col-lg-6 mb-3">

                                <label for="course" class="form-label">Do you have any specific questions about

                                    this course?</label>

                                <select class="js-example-basic-single" name="course" required>
                                <option value="">Select Course</option>
                                @foreach ($courseList as $coursesList_data)
                                    <option value="{{$coursesList_data->name}}">{{$coursesList_data->name}}</option>
                                @endforeach


                                </select>

                                </select>

                            </div>

                        </div>

                        <button class="theme-yellow-btn">Send Message</button>

                    </form>

                </div>

            </div>

        </div>

    </div>

</div>

<!-- message now end -->



<!-- related Courses start-->

<div class="related-coures-sec">

    <div class="container">

        <div class="section-heading">

            <h2>Related courses</h2>

        </div>

        <div class="row">

            <div class="related-corses-slider">
            @foreach ($relatedCourseList as $coursesList_data)
                            @php
                            $packageDetail=get_course_package($coursesList_data->id,true);
                            @endphp
                            <div class="col-lg-4">
                                <div class="popular-courses-box">
                                    <div class="popular-courses-img">
                                        <img src="{{asset('courses/'.$coursesList_data->image)}}">
                                    </div>
                                    <div class="popular-courses-content">
                                        <div class="popular-courses-content-padding">
                                            <p class="popular-courses-name">{{$coursesList_data->name}}</p>
                                            <div class="d-flex align-items-center popular-courses-lesson-rating justify-content-between">
                                                <div class="d-flex align-items-center">
                                                    <p class="course-price">Starting from <span> £{{$packageDetail->price}}</span>
                                                    </p>
                                                </div>
                                                <!--<div class="d-flex align-items-center">-->
                                                <!--    <p class="course-discount">35%<br>off</p>-->
                                                <!--</div>-->
                                            </div>
                                        </div>
                                        <div class="popular-courses-btn">
                                            <a href="course/{{$coursesList_data->url}}" class="theme-blue-btn" tabindex="0">Learn More</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endforeach
            </div>









        </div>

    </div>

</div>



<!-- related Courses end-->



<!-- partners sec start-->

<div class="partner-sec sec section-margin-80">

    <div class="container">

        <h5 class="partner-sec-heading mb-50">Professional body membership included</h5>

        <div class="parners-icon-box-sec">

            <div class="parners-icon-box">

                <img src="{{asset('front_assets/imgs/partnarship/icon-one.png')}}">

            </div>

            <div class="parners-icon-box">

                <img src="{{asset('front_assets/imgs/partnarship/icon-one.png')}}">

            </div>

            <div class="parners-icon-box">

                <img src="{{asset('front_assets/imgs/partnarship/icon-one.png')}}">

            </div>

            <div class="parners-icon-box">

                <img src="{{asset('front_assets/imgs/partnarship/icon-one.png')}}">

            </div>

            <div class="parners-icon-box">

                <img src="{{asset('front_assets/imgs/partnarship/icon-one.png')}}">

            </div>

        </div>

    </div>

</div>

<!-- partners sec end-->



@endsection

@section('scripts') @parent



@endsection

@section('scripts_logic')


<script>
    // In your Javascript (external .js resource or <script> tag)

    $(document).ready(function() {

        $('.js-example-basic-single').select2();

    });
</script>

@endsection