@extends('layouts.website')

@section('content')
<main>
    <section class="bs-banner typ-certification">
        <div class="main">
            <div class="swiper-wrapper">
                <div class="swiper-slide">
                    <div class="background-wrapper">
                        <div class="container-fluid pt-5">
                            <div class="row">
                                <div class="col-lg-12 col-12 mt-lg-0 ">

                                </div>

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

    <section class="bs-events typ-certification-verification">
        <div class="container py-4">
            <div class="content ps-lg-5 p-0 text-center" data-aos="fade" data-aos-delay="400">
                <div class="common-heading d-flex justify-content-center pt-3" data-aos="fade" data-aos-delay="300">
                    <div class="bs-sub-heading  text-uppercase">Verification <span class="ms-1">Services</span>
                    </div>
                </div>
                <h2 class="bs-heading mb-3" data-aos="fade" data-aos-delay="400">
                    Verify IRQS Certifications
                </h2>
            </div>
            <div class="tab-wrap">
                <ul class="nav nav-pills" id="pills-tab" role="tablist">
                    <li class="nav-item" role="presentation">
                        <button class="nav-link active" id="student-tab" data-bs-toggle="pill"
                            data-bs-target="#studentTab" type="button" role="tab">
                            Student Certificate
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="org-tab" data-bs-toggle="pill" data-bs-target="#orgTab"
                            type="button" role="tab">
                            Organization Certificate
                        </button>
                    </li>
                </ul>
            </div>
            <div class="tab-content" id="pills-tabContent">
                <div class="tab-pane fade show active" id="studentTab" role="tabpanel">
                    <div class="panel">
                        <h4>Fill the Form</h4>
                        <form id="form-org">
                            <div class="mb-3">
                                <label class="form-label">Enter Unique Learner Number :</label>
                                <input type="text" class="form-control" required>
                            </div>
                            <div class="form-check my-5">
                                <label class="form-check-label" for="mk2">
                                    © Copyright 2019 IRQS
                                </label>
                            </div>
                            <div class=" d-flex justify-content-between align-items-center flex-wrap">
                                <div class="mb-3 g-recaptcha" data-sitekey="YOUR_RECAPTCHA_SITE_KEY"></div>
                                <div class="btn-certification"> <button class="btn btn-submit" type="submit">●
                                        Submit</button></div>
                            </div>

                        </form>
                    </div>
                </div>
                <div class="tab-pane fade" id="orgTab" role="tabpanel">

                    <div class="panel">
                        <h4>Fill the Form</h4>
                        <form id="form-org">
                            <div class="mb-3">
                                <label class="form-label">Certification No*</label>
                                <input type="text" class="form-control" required>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Company Name*</label>
                                <input type="text" class="form-control" required>
                            </div>
                            <div class="form-check my-5">
                                <input class="form-check-input" type="checkbox" id="mk2">
                                <label class="form-check-label" for="mk2">
                                    I agree to receive marketing information via email from IRCLASS and its
                                    affiliates relating to their products and services. I may withdraw my consent at
                                    any time with future effect. For further details, refer to the Privacy Notice.
                                </label>
                            </div>
                            <div class=" d-flex justify-content-between align-items-center flex-wrap">
                                <div class="mb-3 g-recaptcha" data-sitekey="YOUR_RECAPTCHA_SITE_KEY"></div>
                                <div class="btn-certification"> <button class="btn btn-submit" type="submit">●
                                        Submit</button></div>
                            </div>

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

            </div>
        </div>


    </section>

    <!-- back to top  -->
    <a href="#" class="back-to-top">
        <span class="icon icon-drop-icon"></span>
        <!-- <p class="back-text">Back to Top</p> -->
    </a>
    <div class="sticky-btn">
        <a href="">
            <img src="{{ asset('assets/images/btn.svg') }}" class="img-fluid" alt="button">
        </a>
    </div>
</main>

@include('website.partials.include_js')
@endsection

@section('scripts')
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
@endsection