@extends('auth.layout.app')
@section('title', 'Register')
@section('content')
    <div class="p-5 container-fluid">
        <div class="row">
            <div class="col-3"></div>
            <div class="col-6">
                <div class="p-5 shadow-sm card">
                    <h1>Sign Up</h1>
                    <p class="account-subtitle">Enter details to create your account.</p>
                    @if ($errors->any())
                        <div class="alert alert-danger">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                    <form action="{{ route('register') }}" method="POST">
                        @csrf
                        <div class="form-group">
                            <label>Name <span class="login-danger">*</span></label>
                            <input name="name" class="form-control" type="text">
                            <span class="profile-views"></span>
                        </div>
                        <div class="form-group">
                            <label>Email <span class="login-danger">*</span></label>
                            <input name="email" class="form-control" type="text">
                            <span class="profile-views"></span>
                        </div>
                        <div class="form-group">
                            <label>Phone Number <span class="login-danger">*</span></label>
                            <input name="phone" class="form-control" type="text">
                            <span class="profile-views"></span>
                        </div>
                        <div class="form-group ">
                            <label>Date Of Birth <span class="login-danger">*</span></label>
                            <input name="date_of_birth" class="form-control datetimepicker" type="text"
                                placeholder="DD-MM-YYYY">
                            <span class="profile-views"></span>

                        </div>

                        <div class="form-group">
                            <label>Region <span class="login-danger">*</span></label>
                            <select name="region" class="form-control select">
                                <option>Please Select Region </option>
                                <option>Hindu</option>
                                <option>Christian</option>
                                <option>Others</option>
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Gender <span class="login-danger">*</span></label>
                            <select class="form-control select">
                                <option>Select Gender</option>
                                <option>Female</option>
                                <option>Male</option>
                                <option>Others</option>
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Township <span class="login-danger">*</span></label>
                            <select name="township" class="form-control select">
                                <option>Please Select Section </option>
                                <option>B</option>
                                <option>A</option>
                                <option>C</option>
                            </select>
                        </div>

                        <div class="form-group">
                            <label>Password <span class="login-danger">*</span></label>
                            <input name="password" class="form-control pass-input" type="password">
                        </div>
                        <div class="form-group">
                            <label>Confirm password <span class="login-danger">*</span></label>
                            <input class="form-control pass-confirm" type="text">
                        </div>
                        <div class=" dont-have">Already Registered? <a href="{{ route('login') }}">Login</a></div>
                        <div class="mb-0 form-group">
                            <button class="btn btn-primary btn-block" type="submit">Register</button>
                        </div>
                    </form>
                </div>
                <div class="col-3"></div>
            </div>
        </div>
    </div>

@endsection