@extends('LandingPage.Layouts.master')



@section('content')

<div class="breadcrumb-block style-shared">
    <div class="breadcrumb-main bg-linear overflow-hidden">
        <div class="container lg:pt-[134px] pt-24 pb-10 relative">
            <div class="main-content w-full h-full flex flex-col items-center justify-center relative z-[1]">
                <div class="text-content">
                    <div class="heading2 text-center">{{translate('Register')}}</div>
                    <div class="link flex items-center justify-center gap-1 caption1 mt-3">
                        <a href='{{route('Landing.index')}}'>{{translate('Homepage')}}</a>
                        <i class="ph ph-caret-right text-sm text-secondary2"></i>
                        <div class='text-secondary2 capitalize'>{{translate('Register')}}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<div class="register-block md:py-20 py-10">
    <div class="container">
        <div class="content-main flex gap-y-8 max-md:flex-col">


            <div class="left md:w-1/2 w-full lg:pr-[60px] md:pr-[40px] md:border-r border-line">
                <div class="heading4">{{translate('Register')}}</div>


                <form class="md:mt-7 mt-4" action="{{ route('landing.PostRegister') }}" method="POST">
                    @csrf
                    <div class="pass mt-5">
                        <div class="name">
                            <input class="border-line px-4 pt-3 pb-3 w-full rounded-lg" name="name" type="text" placeholder="Full Name *" required value="{{ old('name') }}" />
                            @error('name')
                            <div class="text-red-500 mt-2 text-sm">{{ $message }}</div>
                            @enderror

                        </div>
                    </div>

                    <div class="pass mt-5">

                        <div class="email">
                            <input class="border-line px-4 pt-3 pb-3 w-full rounded-lg  @error('email') is-invalid @enderror" name="email" type="email" placeholder="Username or email address *" required value="{{ old('email') }}" />
                            @error('email')
                            <div class="text-red-500 mt-2 text-sm">{{ $message }}</div>
                            @enderror

                        </div>
                    </div>

                    <div class="pass mt-5">
                        <input class="border-line px-4 pt-3 pb-3 w-full rounded-lg" name="password" type="password" placeholder="Password *" required />
                        @error('password')
                        <div class="text-red-500 mt-2 text-sm">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class="confirm-pass mt-5">
                        <input class="border-line px-4 pt-3 pb-3 w-full rounded-lg" name="password_confirmation" type="password" placeholder="Confirm Password *" required />
                        @error('password_confirmation')
                        <div class="text-red-500 mt-2 text-sm">{{ $message }}</div>
                        @enderror
                    </div>
                    <div class='flex items-center mt-5'>
                        {{-- <div class="block-input">
                            <input type="checkbox" name='terms' id='terms' required />
                            <i class='ph-fill ph-check-square icon-checkbox text-xl'></i>
                        </div> --}}

                        <label for='terms' class="pl-2 cursor-pointer text-secondary2">{{translate('Already have an account?')}}
                            <a href='{{route('landing.showloginform')}}' class='text-black hover:underline pl-1'>{{translate('LogIn')}}</a>
                        </label>
                    </div>
                    <div class="block-button md:mt-7 mt-4">
                        <button class="button-main">{{translate('Register')}}</button>
                    </div>
                </form>



            </div>



            <div class="right md:w-1/2 w-full lg:pl-[60px] md:pl-[40px] flex items-center">
                <div class="text-content">
                    <div class="heading4">{{translate('Become a Marketer')}}</div>
                    <div class="mt-2 text-secondary">{{translate('Welcome back. Sign in to access your personalized experience')}},
                        {{translate(' saved preferences, and more. We{String.raw} thrilled to have you with us again!')}}</div>
                    <div class="block-button md:mt-7 mt-4">
                        <a href='#' class="button-main" style="background-color: #d9f2a1;color:black">{{translate('Become a Marketer')}}</a>

                        {{-- <a href='{{route(name: 'landing.showloginform')}}' class="button-main">{{translate('Login')}}</a> --}}
                    </div>

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

@endsection