@extends('layout.app')
@section('title')
    <title>ET Recruitment</title>
    <meta name="description" content="APLUS AGENCY is a team of registered migration agents with over 60 years of collective experience managing migration applications for both employers and individuals."/>
    <meta name="og:title" content="Aplus Agency"/>
    <meta name="og:image" content="{{url('frontend/images/recruitment.png')}}"/>
@endsection
@section('content')
@php  
          $msg = Session::get('msg') ?? null; 
        @endphp
    <!-- Start Home -->
    <section class="bg-home" style="background: url('images/recruitment-banner.png') ;">
        <div class="bg-overlay"></div>
        <div class="home-center">
            <div class="home-desc-center">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-lg-12">
                            <div class="title-heading text-center text-white">
                                <h4 class="small-title text-uppercase text-light mb-4">Dream Jobs. Top Talent. All in One Place.</h4>
                                <h2 class="heading font-weight-bold mb-4">We’ve built our reputation on finding that perfect match between candidate and employer.</h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end home -->
    <!-- start about -->
    <section class="section" id="about-section">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="about-img">
                        <img src="{{url('images/about-image.png')}}" class="img-fluid" alt="">
                    </div>
                    <div class="about-us-desc">
                        <h5>Who Are We </h5>
                        <h1>Borders shouldn’t be barriers, and we know more talent is out there. Your journey to find them starts with ET Recruitment.</h1>
                        <p>As the world reimagines how people work and conduct business in an evolving environment, we remain steadfast in our commitment to recruiting the best talent for organisations in Australia and helping jobseekers thrive in their next career opportunity.</p>
                        <a href="">Discover our story</a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end about -->

    <!-- How it Work start -->
    <section class="section" id="services">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12">
                    <div class="section-title text-center mb-4 pb-2">
                        <h4 class="title title-line pb-5">What We Do</h4>
                        <p class="text-muted para-desc mx-auto mb-1">Bringing Job Seekers and Employers Together</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-3 mt-4 pt-2">
                    <div class="how-it-work-box bg-light p-3 text-center rounded shadow">
                        <div class="how-it-work-img position-relative rounded-pill mb-3">
                            <img src="{{url('images/how-it-work/img-1.png')}}" alt="" class="mx-auto d-block" height="50">
                        </div>
                        <div>
                            <h5>Skill Assessment</h5>
                            <p class="text-muted">Having your skills assessed by the relevant authority is a requirement to be eligible to apply for skilled migration visas in Australia.</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 mt-4 pt-2">
                    <div class="how-it-work-box bg-light p-3 text-center rounded shadow ">
                        <div class="how-it-work-img position-relative rounded-pill mb-3">
                            <img src="{{url('images/how-it-work/img-2.png')}}" alt="" class="mx-auto d-block" height="50">
                        </div>
                        <div>
                            <h5>RPL (Recognition of Prior Learning)</h5>
                            <p class="text-muted"> Through RPL, we acknowledge students' skills acquired through experiential learning, boosting their self-esteem as a result</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 mt-4 pt-2">
                    <div class="how-it-work-box bg-light p-3 text-center rounded shadow">
                        <div class="how-it-work-img position-relative rounded-pill mb-3">
                            <img src="{{url('images/how-it-work/img-3.png')}}" alt="" class="mx-auto d-block" height="50">
                        </div>
                        <div>
                            <h5>Career Counselling</h5>
                            <p class="text-muted">Our career consultations promote self-awareness. We listen. We don’t follow a set formula or presume to know what success means to you.</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 mt-4 pt-2">
                    <div class="how-it-work-box bg-light p-3 text-center rounded shadow">
                        <div class="how-it-work-img position-relative rounded-pill mb-3">
                            <img src="{{url('images/how-it-work/img-1.png')}}" alt="" class="mx-auto d-block" height="50">
                        </div>
                        <div>
                            <h5> Recruitment</h5>
                            <p class="text-muted">Whether you need to find top talent or your next great job opportunity, our recruitment experts in Australia can help.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- How it Work end -->

    <!-- all jobs start -->
    <section class="section bg-light" id="jobs">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12">
                    <div class="section-title text-center mb-4 pb-2">
                        <h4 class="title title-line pb-5">Find Your Jobs</h4>
                        <p class="text-muted para-desc mx-auto mb-1">Post a job to tell us about your project. We'll quickly match you with the right freelancers.</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-12">
                    <div class="tab-content mt-2" id="pills-tabContent">
                        <div class="tab-pane fade show active" id="recent-job" role="tabpanel" aria-labelledby="recent-job-tab">
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="job-box bg-white overflow-hidden border rounded mt-4 position-relative overflow-hidden">
                                        <div class="lable text-center pt-2 pb-2">
                                            <ul class="list-unstyled best text-white mb-0 text-uppercase">
                                                <li class="list-inline-item"><i class="mdi mdi-star"></i></li>
                                            </ul>
                                        </div>
                                        <div class="p-4">
                                            <div class="row align-items-center">
                                                <div class="col-md-2">
                                                    <div class="mo-mb-2">
                                                        <img src="{{url('images/featured-job/img-1.png')}}" alt="" class="img-fluid mx-auto d-block">
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <h5 class="f-18"><a href="#" class="text-dark">Web Developer</a></h5>
                                                        <p class="text-muted mb-0">Web Technology pvt.Ltd</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <p class="text-muted mb-0"><i class="mdi mdi-map-marker text-primary mr-2"></i>Oakridge Lane Richardson</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-primary">$</span>1000-1200/m</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0">Full Time</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="p-3 bg-light">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-dark">Experience :</span> 1 - 2 years</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-dark">Notes :</span> languages only differ in their grammar. </p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <a href="#" class="text-primary">Apply Now <i class="mdi mdi-chevron-double-right"></i></a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="job-box bg-white overflow-hidden border rounded mt-4 position-relative overflow-hidden">
                                        <div class="lable text-center pt-2 pb-2">
                                            <ul class="list-unstyled best text-white mb-0 text-uppercase">
                                                <li class="list-inline-item"><i class="mdi mdi-star"></i></li>
                                            </ul>
                                        </div>
                                        <div class="p-4">
                                            <div class="row align-items-center">
                                                <div class="col-md-2">
                                                    <div class="mo-mb-2">
                                                        <img src="{{url('images/featured-job/img-2.png')}}" alt="" class="img-fluid mx-auto d-block">
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <h5 class="f-18"><a href="#" class="text-dark">Php Developer</a></h5>
                                                        <p class="text-muted mb-0">Web Themes pvt.Ltd</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <p class="text-muted mb-0"><i class="mdi mdi-map-marker text-primary mr-2"></i>Berkshire Circle Knoxville</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-primary">$</span>900-1100/m</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0">Full Time</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="p-3 bg-light">
                                            <div class="row">
                                                <div class="col-md-10">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-dark">Experience :</span> 2 - 3 years</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <a href="#" class="text-primary">Apply Now <i class="mdi mdi-chevron-double-right"></i></a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="job-box bg-white overflow-hidden border rounded mt-4 position-relative overflow-hidden">
                                        <div class="lable text-center pt-2 pb-2">
                                            <ul class="list-unstyled best text-white mb-0 text-uppercase">
                                                <li class="list-inline-item"><i class="mdi mdi-star"></i></li>
                                            </ul>
                                        </div>
                                        <div class="p-4">
                                            <div class="row align-items-center">
                                                <div class="col-md-2">
                                                    <div class="mo-mb-2">
                                                        <img src="{{url('images/featured-job/img-3.png')}}" alt="" class="img-fluid mx-auto d-block">
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <h5 class="f-18"><a href="#" class="text-dark">Graphic Designer</a></h5>
                                                        <p class="text-muted mb-0">Web Technology pvt.Ltd</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <p class="text-muted mb-0"><i class="mdi mdi-map-marker text-primary mr-2"></i>Sumner Street Anaheim</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-primary">$</span>800-1000/m</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0">Part Time</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="p-3 bg-light">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-dark">Experience :</span> 0 - 1 years</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-dark">Notes :</span> languages only differ in their grammar. </p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <a href="#" class="text-primary">Apply Now <i class="mdi mdi-chevron-double-right"></i></a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="job-box bg-white overflow-hidden border rounded mt-4 position-relative overflow-hidden">
                                        <div class="lable text-center pt-2 pb-2">
                                            <ul class="list-unstyled best text-white mb-0 text-uppercase">
                                                <li class="list-inline-item"><i class="mdi mdi-star"></i></li>
                                            </ul>
                                        </div>
                                        <div class="p-4">
                                            <div class="row align-items-center">
                                                <div class="col-md-2">
                                                    <div class="mo-mb-2">
                                                        <img src="{{url('images/featured-job/img-4.png')}}" alt="" class="img-fluid mx-auto d-block">
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <h5 class="f-18"><a href="#" class="text-dark">UI/UX Designer</a></h5>
                                                        <p class="text-muted mb-0">Web Themes pvt.Ltd</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-3">
                                                    <div>
                                                        <p class="text-muted mb-0"><i class="mdi mdi-map-marker text-primary mr-2"></i>Pinewood Drive Chicago</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-primary">$</span>1000-1200/m</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <p class="text-muted mb-0">Freelancer</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="p-3 bg-light">
                                            <div class="row">
                                                <div class="col-md-10">
                                                    <div>
                                                        <p class="text-muted mb-0 mo-mb-2"><span class="text-dark">Experience :</span> 1 - 2 years</p>
                                                    </div>
                                                </div>
                                                <div class="col-md-2">
                                                    <div>
                                                        <a href="#" class="text-primary">Apply Now <i class="mdi mdi-chevron-double-right"></i></a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end row -->
        </div>
        <!-- end containar -->
    </section>
    <!-- all jobs end -->

    <!-- testimonial start -->
    <section class="section">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-12">
                    <div class="section-title text-center mb-4 pb-2">
                        <h4 class="title title-line pb-5">Our Success Stories</h4>
                        <p class="text-muted para-desc mx-auto mb-1">Post a job to tell us about your project. We'll quickly match you with the right freelancers.</p>
                    </div>
                </div>
            </div>
            <div class="row pt-4">
                <div class="col-lg-12">
                    <div id="owl-testi" class="owl-carousel owl-theme">
                        <div class="item testi-box rounded p-4 mr-3 ml-2 mb-4 bg-light position-relative">
                            <p class="text-muted mb-5">Thanks to Extratech Family for this amazing platform to help international students. Special thanks to Sudi, Saurabh and Gaurav for their support and guidance throughout the journey. 
                                Never lose hope guys, consistent hard work will definitely pay off one day. Keep working hard! Please reach out to the best people who are always ready to help you anytime. Best wishes to you all.</p>
                            <div class="clearfix">
                                <div class="testi-img float-left mr-3">
                                    <img src="https://via.placeholder.com/400X400//88929f/5a6270C/O https://placeholder.com/" height="64" alt="" class="rounded-circle shadow">
                                </div>
                                <h5 class="f-18 pt-1">Prativa Shah</h5>
                                <p class="text-muted mb-0">Data Analyst in Priceline Pty Ltd.</p>
                            </div>
                        </div>

                        <div class="item testi-box rounded p-4 mr-3 ml-2 bg-light position-relative">
                            <p class="text-muted mb-5">Thank you so much, everyone, and the entire Extratech team, for always supporting me throughout this journey. I appreciate your help, especially Binod and Sandeep dai, for your encouragement and belief in me.</p>
                            <div class="clearfix">
                                <div class="testi-img float-left mr-3">
                                    <img src="https://via.placeholder.com/400X400//88929f/5a6270C/O https://placeholder.com/" height="64" alt="" class="rounded-circle shadow">
                                </div>
                                <h5 class="f-18 pt-1"> Pratibha Rai</h5>
                                <p class="text-muted mb-0">Level 1 IT Officer, Royal Australasian College of Surgeons (RACS).</p>
                            </div>
                        </div>

                        <div class="item testi-box rounded p-4 mr-3 ml-2 bg-light position-relative">
                            <p class="text-muted mb-5">Thanks to the entire Extratech team for creating this opportunity and for continuous support, guidance, and encouragement during the job-seeking period. It would not be possible without your help. I will always be grateful to you all.</p>
                            <div class="clearfix">
                                <div class="testi-img float-left mr-3">
                                    <img src="https://via.placeholder.com/400X400//88929f/5a6270C/O https://placeholder.com/" height="64" alt="" class="rounded-circle shadow">
                                </div>
                                <h5 class="f-18 pt-1">Manju Pant</h5>
                                <p class="text-muted mb-0">Junior Accountant, Bilateral Solutions Pty Ltd.</p>
                            </div>
                        </div>

                        <div class="item testi-box rounded p-4 mr-3 ml-2 bg-light position-relative">
                            <p class="text-muted mb-5">Thank you, entire Extratech Team, for everything. Special thanks to Binod sir and Sandeep dai for your guidance, and also thanks to all team. And thank you all for your warm wishes.</p>
                            <div class="clearfix">
                                <div class="testi-img float-left mr-3">
                                    <img src="https://via.placeholder.com/400X400//88929f/5a6270C/O https://placeholder.com/" height="64" alt="" class="rounded-circle shadow">
                                </div>
                                <h5 class="f-18 pt-1">Tshering Wangchuk</h5>
                                <p class="text-muted mb-0">ICT Support Officer, ACT Government</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- testimonial end -->

    <!-- subscribe start -->
    <section class="contact-section" id="contact">
        <div class="container-fluid px-1 py-5 mx-auto">
            <div class="row justify-content-center">
                <div class="col-12">
                    <div class="section-title text-center mb-4 pb-2">
                        <h4 class="title title-line pb-5">We make hiring easy. It's that simple.</h4>
                        <p class="text-muted para-desc mx-auto mb-4">
                            Please fill out the form below to get in touch with our team, <br> ask any questions, or tell us about your individual recruitment needs.</p>
                    </div>
                </div>
            </div>
            <div class="row d-flex justify-content-center">
                <div class="col-xl-7 col-lg-8 col-md-9 col-11 text-center">
                    <div class="card">
                        <h5 class="text-center mb-4">We do recruitment that makes everyone happy.</h5>
                        <form class="form-card" method = "post" action = "{{url('/contact')}}">
                        @csrf
                            <div class="row justify-content-between text-left">
                                <div class="form-group col-sm-6 flex-column d-flex"> <label class="form-control-label">Full name<span class="text-danger"> *</span></label> 
                                    <input type="text" id="fname" name="fname" placeholder="Enter your full name" onblur="validate(1)"> 
                                </div>
                                <div class="form-group col-sm-6 flex-column d-flex"> 
                                    <label class="form-control-label">Email<span class="text-danger"> *</span></label> 
                                    <input type="text" id="email" name="email" placeholder="Enter your email address" onblur="validate(2)"> 
                                </div>
                            </div>
                            <div class="row justify-content-between text-left">
                                <div class="form-group col-sm-6 flex-column d-flex"> <label class="form-control-label">Phone number<span class="text-danger"> *</span></label> 
                                    <input type="text" id="mob" name="mobile" placeholder="Enter your phone number" onblur="validate(3)"> 
                                </div>
                                <div class="form-group col-sm-6 flex-column d-flex"> <label class="form-control-label">Job title<span class="text-danger"> *</span></label> 
                                    <input type="text" id="job" name="job_title" placeholder="Enter your job title" onblur="validate(4)"> 
                                </div>
                            </div>
                            <div class="row justify-content-between text-left">
                                <div class="form-group col-12 flex-column d-flex"> <label class="form-control-label">Have any queries?<span class="text-danger"> *</span></label> 
                                    <textarea rows="2" placeholder="Write your message here" id="message" name="message"onblur="validate(5)"></textarea>
                                </div>
                            </div>
                            <div class="row justify-content-end">
                                <div class="form-group col-sm-6"> 
                                    <button type="submit" class="btn-block btn-primary">Submit</button> 
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- subscribe end -->

@endsection
@section('script')
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

    
    <script>
        var php_var = "<?php echo $msg; ?>";
        
        if(php_var.length !== 0){
              Swal.fire({
                  title: 'Submitted!!',
                  text: php_var,
                  icon: 'success'
              })
        }
        function validate(val) {
        v1 = document.getElementById("fname");
        v2 = document.getElementById("email");
        v3 = document.getElementById("mob");
        v4 = document.getElementById("job");
        v5 = document.getElementById("ans");

        flag1 = true;
        flag2 = true;
        flag3 = true;
        flag4 = true;
        flag5 = true;

        if(val>=1 || val==0) {
            if(v1.value == "") {
                v1.style.borderColor = "red";
                flag1 = false;
            }
            else {
                v1.style.borderColor = "green";
                flag1 = true;
            }
        }

        if(val>=2 || val==0) {
            if(v2.value == "") {
                v2.style.borderColor = "red";
                flag2 = false;
            }
            else {
                v2.style.borderColor = "green";
                flag2 = true;
            }
        }
        if(val>=3 || val==0) {
            if(v3.value == "") {
                v3.style.borderColor = "red";
                flag3 = false;
            }
            else {
                v3.style.borderColor = "green";
                flag3 = true;
            }
        }
        if(val>=4 || val==0) {
            if(v4.value == "") {
                v4.style.borderColor = "red";
                flag4 = false;
            }
            else {
                v4.style.borderColor = "green";
                flag4 = true;
            }
        }
        if(val>=5 || val==0) {
            if(v5.value == "") {
                v5.style.borderColor = "red";
                flag5 = false;
            }
            else {
                v5.style.borderColor = "green";
                flag5 = true;
            }
        }

        flag = flag1 && flag2 && flag3 && flag4 && flag5;

        return flag;
    }
    </script>
@endsection