{{--<!-- ======= Hero Section ======= -->--}}
<section id="hero" class="hero d-flex align-items-center" style="background: url({{ theme_asset('images/hero-bg.png') }}) top center no-repeat;">

    <div class="container">
        <div class="row">
            <div class="col-lg-6 d-flex flex-column justify-content-center">
                <h1 data-aos="fade-up">@lang('label.welcome_to_website')</h1>
                {{--<h2 data-aos="fade-up" data-aos-delay="400">We are team of talented designers making websites with Bootstrap</h2>--}}
                <div data-aos="fade-up" data-aos-delay="600">
                    <div class="text-center text-lg-start">
                        <a href="#register" class="btn-get-started scrollto d-inline-flex align-items-center justify-content-center align-self-center">
                            <span>@lang('label.register')</span>
                            <i class="bi bi-arrow-right"></i>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-lg-6 hero-img" data-aos="zoom-out" data-aos-delay="200">
                <img src="{{ theme_asset('images/hero-img.png') }}" class="img-fluid" alt="">
            </div>
        </div>
    </div>

</section>

<main id="main">

    {{--<!-- ======= Team Section ======= -->--}}
    <section id="jobs" class="team">

        <div class="container" data-aos="fade-up">

            <header class="section-header">
                <h2>@lang('label.jobs')</h2>
                <p>@lang('label.jobs_category')</p>
            </header>

            <div class="row gy-4 justify-content-center">
                @php $jobs = \Plugins\JobApp\Models\CategoryJobModel::where('status', 'open')->orderBy('created_at', 'DESC')->cursor(); @endphp
                @foreach($jobs as $job)
                    <div class="col-lg-3 col-md-6 d-flex align-items-stretch" data-aos="fade-up" data-aos-delay="100">
                        <div class="member">
                            <div class="member-img">
                                <img src="{{ theme_asset('images/thumb.jpg') }}" class="img-fluid" alt="">
                                {{--<div class="social">
                                    <a href=""><i class="bi bi-twitter"></i></a>
                                    <a href=""><i class="bi bi-facebook"></i></a>
                                    <a href=""><i class="bi bi-instagram"></i></a>
                                    <a href=""><i class="bi bi-linkedin"></i></a>
                                </div>--}}
                            </div>
                            <div class="member-info">
                                <h4 title="{{ $job->name }}">{{ \Str::limit($job->name, 70) }}</h4>
                                <span><i class="far fa-clock"></i> {{ carbonParseTransFormat($job->start_date, 'd F') }} - {{ carbonParseTransFormat($job->end_date, 'd F Y H:i') }}</span>
                                <hr/>
                                <div class="row">
                                    <div class="col-6">
                                        <button type="button" class="btn btn-sm btn-info btn-block show_modal_lg" data-action="{{ route("simple_cms.plugins.jobapp.category_job.detail", encrypt_decrypt($job->id)) }}" data-method="GET" data-title="{{ $job->name }}"><i class="fas fa-info-circle"></i> @lang('label.detail')</button>
                                    </div>
                                    <div class="col-6">
                                        @if($job->status == 'open')
                                            <button class="btn btn-success btn-sm btn-block" onclick="window.location.href='{{ $job->urlApply() }}'" title="{{ trans('label.apply') }}: {{ $job->name }} ">{{ trans('label.apply') }} <i class="fas fa-arrow-circle-right"></i></button>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach

            </div>

        </div>

    </section>

    <section id="register" class="features">

        <div class="container" data-aos="fade-up">

            <header class="section-header">
                <h2>@lang('label.register')</h2>
                <p>@lang('core::label.title_register_form')</p>
            </header>

            <div class="row">

                <div class="col-lg-6">
                    <img src="{{ theme_asset('images/features-2.png') }}" class="img-fluid" alt="">
                </div>

                <div class="col-lg-6 mt-5 mt-lg-0 d-flex contact">
                    <form id="registrationForm" data-action="{{ route('simple_cms.acl.auth.registerPost') }}" data-method="POST" class="php-email-form">
                        <div class="row align-self-center gy-4">
                                <div class="col-md-12">
                                    <input type="text" name="name" class="form-control" placeholder="@lang('label.full_name')" required>
                                </div>
                                <div class="col-md-12">
                                    <input type="email" name="email" class="form-control" placeholder="@lang('label.email')" required>
                                </div>
                                <div class="col-md-12">
                                    <input type="password" name="password" class="form-control" placeholder="@lang('label.password')" required>
                                </div>
                                <div class="col-md-12">
                                    <input type="password" name="password_confirmation" class="form-control" placeholder="@lang('label.password_confirmation')" required>
                                </div>

                                <div class="col-md-12">
                                    {!! simple_cms_acl_form_register_hook_action() !!}
                                </div>

                                <div class="col-md-12">
                                    <label for="agreeTerms">
                                        <input type="checkbox" id="agreeTerms" name="terms" value="agree" required> @lang('label.i_agree_to_the_terms')
                                    </label>
                                </div>
                                <div class="col-md-12 text-right">
                                    <button type="submit" class="btn btn-primary btn-block"> {{ trans('core::label.register') }}</button>
                                </div>

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

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


    {{--<!-- ======= Contact Section ======= -->--}}
    <section id="contact" class="contact">

        <div class="container" data-aos="fade-up">

            <header class="section-header">
                <h2>@lang('label.contact')</h2>
                <p>@lang('label.contact_us')</p>
            </header>

            <div class="row gy-4">
                {!! shortcodes('[contact_form]') !!}
            </div>

        </div>

    </section>

</main>
@php
    \Theme::asset()->usePath()->add('register-js', 'js/register.js');
@endphp