@extends('auth.layout.app')
@section('content')
    <div class="container-scroller">
        <div class="container-fluid page-body-wrapper full-page-wrapper">
            <div class="row w-100">
                <div class="content-wrapper full-page-wrapper d-flex align-items-center auth login-bg">
                    <div class="card col-lg-4 mx-auto">
                        <div class="card-body px-5 py-5">
                            <h3 class="card-title text-start mb-3">Register</h3>
                            <form action="{{route('registration.form')}}" method="post">
                                @csrf
                                <div class="form-group">
                                    <label>Full Name</label>
                                    <input type="text" class="form-control p_input" name="name">
                                    @error('name')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Email</label>
                                    <input type="email" class="form-control p_input" name="email">
                                    @error('email')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Phone Number</label>
                                    <input type="number" class="form-control p_input" name="phone">
                                    @error('phone')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Date Of Birth</label>
                                    <input type="date" class="form-control p_input" name="dob">
                                    @error('dob')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Address</label>
                                    <input type="text" class="form-control p_input" name="address">
                                    @error('address')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Country</label>
                                    <input type="text" class="form-control p_input" name="country">
                                    @error('country')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>City</label>
                                    <input type="text" class="form-control p_input" name="city">
                                    @error('city')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Zip Code</label>
                                    <input type="number" class="form-control p_input" name="zip_code">
                                    @error('zip_code')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Password</label>
                                    <input type="password" class="form-control p_input" name="password">
                                    @error('password')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group">
                                    <label>Confirm Password</label>
                                    <input type="password" class="form-control p_input" name="password_confirmation">
                                    @error('password_confirmation')
                                    <label class="btn-danger">{{$message}}</label>
                                    @enderror
                                </div>
                                <div class="form-group d-flex align-items-center justify-content-between">
                                    <div class="form-check">
                                        <label class="form-check-label">
                                            <input type="checkbox" class="form-check-input"> Remember me </label>
                                    </div>
                                    <a href="#" class="forgot-pass">Forgot password</a>
                                </div>
                                <div class="text-center d-grid gap-2">
                                    <button type="submit" class="btn btn-primary btn-block enter-btn">Register</button>
                                    <br>
                                </div>

                                <p class="sign-up text-center">Already have an Account?<a href="{{route('login')}}">
                                        Sign In</a></p>
                                <p class="terms">By creating an account you are accepting our<a href="#"> Terms &
                                        Conditions</a></p>
                            </form>
                        </div>
                    </div>
                </div>
                <!-- content-wrapper ends -->
            </div>
            <!-- row ends -->
        </div>
        <!-- page-body-wrapper ends -->
    </div>
@endsection