@extends('frontend_landing_page.master')

@section('content')

<style>
    .display{
        display: none;
    }
</style>

<div class="container-xxl position-relative p-0">
           

            <div class="container-xxl py-5 bg-primary hero-header">
                <div class="container my-5 py-5 px-lg-5">
                    <div class="row g-5 py-5">
                        <div class="col-12 text-center">
                            <h1 class="text-white animated slideInDown">Register</h1>
                            <hr class="bg-white mx-auto mt-0" style="width: 90px;">
                            <nav aria-label="breadcrumb">
                                <ol class="breadcrumb justify-content-center">
                                    <li class="breadcrumb-item"><a class="text-white" href="{{ URL('/')}}">Home</a></li>
                                   
                                    <li class="breadcrumb-item text-white active" aria-current="page">Register</li>
                                </ol>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        

        <!-- Contact Start -->
        <div class="container-xxl py-5">
            <div class="container py-5 px-lg-5">

            


                <div class="wow fadeInUp" data-wow-delay="0.1s">
                 
                    <h1 class="text-center mb-5">Register</h1>
                </div>
                <div class="row justify-content-center">
                    <div class="col-lg-7">
                        <div class="wow fadeInUp" data-wow-delay="0.3s">
                          
                            <form action="{{ route('register') }}" method="POST">
                                @csrf
                                <div class="row g-3">
                                    <div class="col-md-12">
                                    <label for="">Name <code>*</code></label>
                                        <div class="form-floating">
                                            
                                            <input type="text" name="name" class="form-control"  placeholder="Your Name">
                                            <label for="name">Name</label>
                                        </div>

                                        @error('name')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror

                                    </div>

                                    <div class="col-md-12">
                                    <label for="">Phone <code>*</code></label>
                                        <div class="form-floating">
                                            
                                            <input type="text" name="phone" class="form-control"  placeholder="Your Name">
                                            <label for="name">Phone </label>
                                        </div>

                                        @error('phone')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror

                                    </div>

                                    <div class="col-md-12">
                                    <label for="">Email <code>*</code></label>
                                        <div class="form-floating">
                                            
                                            <input type="email" name="email" class="form-control"  placeholder="Your Name">
                                            <label for="name">Email </label>
                                        </div>

                                        @error('email')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror

                                    </div>

                                    <div class="col-md-12">
                                    <label for="">Password <code>*</code></label>
                                        <div class="form-floating">
                                            <input type="password" name="password" class="form-control" id="email" placeholder="Your Email">
                                            <label for="email">Password</label>
                                        </div>

                                @error('password')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                                    </div>

                                    <div class="col-md-12">
                                    <label for="">Confirm Password <code>*</code></label>
                                        <div class="form-floating">
                                            <input type="password" name="password_confirmation" class="form-control" id="email" placeholder="Your Email">
                                            <label for="email">Password</label>
                                        </div>

                                @error('password_confirmation')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                                    </div>
                                   
                            
                                    
                                    <div class="col-6">
                                        <button class="btn btn-primary w-100 py-3" type="submit">REGISTER</button>
                                    </div>
                                </div>
                            </form>

                            
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Contact End -->

        <script>
$('input[name="phone"]').keypress(
    function(event) {
        if (event.keyCode == 46 || event.keyCode == 8) {
            //do nothing
        } else {
            if (event.keyCode < 48 || event.keyCode > 57) {
                event.preventDefault();
            }
        }
    }
);
</script>


@endsection