@extends('backend.layouts.customer-horizontal')
@section('title','Add Address')
@section('content')
    <div class="container-fluid">
        <div class="row mt-3 ">
            <div class="col-lg-12 ">
                <div class="card">
                    <h5 class="card-header bg-transparent border-bottom">Add New Address</h5>
                    <div class="card-body">
                        <form action="{{ route('customers.addresses.store') }}" method="post">
                            @csrf
                            <div class="row mb-3">
                                <div class="col-md-3">

                                    <label for="phone" class="form-label">Mobile Number</label>
                                    <input type="text" class="form-control" id="phone" name="phone"
                                           placeholder="Enter phone number" maxlength="10" minlength="10" value="{{old('phone')}}">
                                    @error('phone')
                                    <small class="form-text text-danger">{{ $message }}</small>
                                    @enderror
                                </div>
                                <div class="col-md-3">

                                    <label for="postal_code" class="form-label">Postal Code</label>
                                    <input type="text" class="form-control" id="postal_code" name="postal_code"
                                           placeholder="Enter postal code" maxlength="6" minlength="6"  value="{{old('postal_code')}}" >
                                    @error('postal_code')
                                    <small class="form-text text-danger">{{ $message }}</small>
                                    @enderror
                                </div>
                                <div class="col-md-3">

                                    <label for="city" class="form-label">City</label>
                                    <input type="text" class="form-control" id="city" name="city"
                                           placeholder="Enter City"  value="{{old('phone')}}" >
                                    @error('city')
                                    <small class="form-text text-danger">{{ $message }}</small>
                                    @enderror
                                </div>
                                <div class="col-md-3">
                                    <label for="state" class="form-label">State</label>
                                    <select name="state" id="state" class="form-select">
                                        <option value="" style="display: none;">Please select state</option>
                                        @foreach(\App\State::oldest('name')->pluck('name') as $stateName)
                                            <option value="{{ $stateName }}">{{ $stateName }}</option>
                                        @endforeach
                                    </select>
                                    @error('state')
                                    <small class="form-text text-danger">{{ $message }}</small>
                                    @enderror
                                </div>


                            </div>
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="mb-3">
                                        <label for="address" class="form-label">Address</label>
                                        <textarea name="address" id="address" rows="3" class="form-control"
                                                  placeholder="Add Address">{{ old('address') }}</textarea>
                                        @error('address')
                                        <small class="form-text text-danger">{{ $message }}</small>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="mb-3">
                                        <div class="form-check">
                                            <input class="form-check-input" type="checkbox" id="default" name="default"   @if (old('default') == 'on') checked @endif>
                                            <label class="form-check-label" for="default">Make this address
                                                default </label>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div>
                                <button type="submit" class="btn btn-primary w-md">Add Address</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>

    </div>
@endsection