@extends('frontend.layouts.app')

@section('content')
    <style type="text/css">
        .page-header {
            position: relative;
            display: flex;
            align-items: center;
            background-color: wheat;
            background-position: 0 0;
            background-size: 100%;
            min-height: 80px;
            padding: 0
        }

        .head-text {
            margin: 0;
            font-size: 20px
        }

        .head-text {
        }

        .card {
            box-shadow: 0px 1px 5px 1px rgb(0 0 0 / 10%);
            border-radius: 5px;
            margin: 20px 0 10px;
            padding: 25px;
            background: #fff;
        }

        .page-title {
            font-size: 20px
        }

        .form-control {
            border-color: #ccc
        }

        .enq_form .form-group label {
            font-weight: 600
        }
    </style>
    <div class="page-header">
        <div class="container pl-2 pl-md-5 text-center">
            <h1 class="head-text">Account Deletion Request Form</h1>
        </div>
    </div>
    <div class="section-block pt-4 bg-light">
        <div class="container">
            <div class="row">
                @if(session()->has('success'))
                    <div class="col-md-12 mx-auto">
                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                            <strong>Thank You ! </strong> {{ session('success') }}
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                    </div>
                @endif
            </div>
            <div class="row">
                <div class="col-md-12 mx-auto">
                    <h4 class="page-title">Customer Information</h4>
                    <p class="page-title text-danger">Note : Account once deleted, all information will be lost and can
                        not be retrieved again.</p>
                    <form action="{{ route('account.delete.destroy') }}" method="post">
                        @csrf
                        <div class="card">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="email">Email Address<span>*</span></label>
                                        <input type="email" placeholder="Your email address"
                                               class="form-control" name="email" id="email"
                                               value="{{ old('email') }}" />
                                        @error('email')
                                        <small class="form-text text-danger">{{ $message }}</small>
                                        @enderror
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="mobile">Mobile Number. <span>*</span></label>
                                        <input type="text" placeholder="Your mobile number?"
                                               class="form-control"
                                               name="mobile" maxlength="10" minlength="10" id="mobile"
                                               value="{{ old('mobile') }}" />
                                        @error('mobile')
                                        <small class="form-text text-danger">{{ $message }}</small>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-12 text-right mt-2 pr-0">
                            <div class="form-group mb-5">
                                <input type="submit" class="btn btn-dark btn-lg" value="Submit Query" />
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
@endsection