@extends('web.layouts.layout')
@section('content')


    <main>
        <!-- Start section -->
        <section class="pg_header header section">
            <div class="container">
                @include('web.pages.components.header')
            </div>
            <img src="{{url('')}}/assets/web/images/cat_footer.svg" class="cat" alt="">
            <img src="{{url('')}}/assets/web/images/header_bg.png" class="bg" alt="" />
        </section>

        <!-- Start section -->
        <section class="auth_pg section">
            <div class="container">
                <form method="post" action="{{ $action }}" onsubmit="formAction(this)">
                    @CSRF
                    <div class="row justify-content-between align-items-center">
                        <div class="col-lg-5">
                            <div class="form_box wow slide_rtl">
                                <div class="section-title mb-5">
                                    <h6 class="sub-title color-primary fw-bold"> {{ __('web.regist') }} </h6>
                                    <h2 class="fs-1 mt-4 fw-bold ">  {{ __('web.perfect_cat_waiting') }}  </h2>
                                </div>
                                <div class="cont col-lg-11">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <input type="text" name="name" class="form-control" placeholder=" {{ __('web.first_name') }}  " />
                                                <span class="icon"><i class="fal fa-user"></i></span>
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <input type="text" name="last_name" class="form-control" placeholder=" {{ __('web.last_name') }}  " />
                                                <span class="icon"><i class="fal fa-user"></i></span>
                                            </div>
                                        </div>
                                        <div class="col-lg-12">
                                            <div class="form-group">
                                                <input type="email" name="email" class="form-control" placeholder=" {{ __('web.email') }}  " />
                                                <span class="icon"><i class="fal fa-envelope"></i></span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-check pt-2">
                                        <input class="form-check-input" type="checkbox" name="accept_on" required id="flexCheckDefault">
                                        <label class="form-check-label small" for="flexCheckDefault">
                                            الموافقة علي
                                            <a href="{{ route('web.privacy') }}" target="_blank" class="text-decoration-underline"> {{ __('web.privacy') }} </a> و
                                            <a href="{{ route('web.conditions') }}" target="_blank" class="text-decoration-underline">  {{ __('web.conditions') }} </a>
                                        </label>
                                    </div>

                                    <button type="submit" class="submit_butn butn primary_butn w-100 fs-5 fw-bold  mt-5">
                                        <span>  {{ __('web.regist') }} </span>
                                    </button>


                                </div>

                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="img_box">
                                <dotlottie-player
                                    src="https://lottie.host/0e4ca19f-4b34-4905-ada0-2642d3da5410/vlhAftCMpT.lottie"
                                    background="transparent"  speed="1" style="width: 100%; height: 100%" loop autoplay>
                                </dotlottie-player>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </section>



    </main>

@endsection

@section('inject_js')
    <script>
        $("#mfoter_input_box").hide();

        $('input[type="radio"]').click(function() {
            if ($(this).attr("value") == "0") {
                $("#mfoter_input_box").show();
            }  else{
                $("#mfoter_input_box").hide();
            }
        });
    </script>
@endsection