@extends('layout.app')
@section('content')

    <div class="gs-dashboard-user-content-wrapper gs-dashboard-outlet">
        <div class="gs-edit-profile-section">
            <h3>Edit Profile</h3>
            <form action="{{route('user.profile.update.form')}}" method="POST"
                  enctype="multipart/form-data">
                @csrf

                <div class="edit-profile-area">
                    <div class="row">
                        <div class="col-lg-8 col-12 order-2 order-lg-1">
                            <div class="multi-form-wrapper d-flex gap-4 flex-column flex-sm-row">
                                <div class="single-form-wrapper flex-grow-1">
                                    <div class="form-group">
                                        <label for="name">User Name</label>
                                        <input type="text" id="name" name="name" class="form-control"
                                               placeholder="User Name"
                                               value="{{\Illuminate\Support\Facades\Auth::user()->name ?? ''}}">
                                        @error('name')
                                        <label class="text-danger">{{$message}}</label>
                                        @enderror
                                    </div>
                                </div>
                                <div class="single-form-wrapper flex-grow-1">
                                    <div class="form-group">
                                        <label for="Email">Email</label>
                                        <input type="text" id="Email" class="form-control"
                                               placeholder="Email"
                                               value="{{\Illuminate\Support\Facades\Auth::user()->email ?? ''}}"
                                               name="email">
                                        @error('email')
                                        <label class="text-danger">{{$message}}</label>
                                        @enderror
                                    </div>
                                </div>
                            </div>
                            <div class="multi-form-wrapper d-flex gap-4 flex-column flex-sm-row">
                                <div class="single-form-wrapper flex-grow-1">
                                    <div class="form-group">
                                        <label for="Phone-Number">Phone Number</label>
                                        <input type="text" id="Phone-Number" class="form-control"
                                               placeholder="Phone Number"
                                               value="{{\Illuminate\Support\Facades\Auth::user()->phone ?? ''}}"
                                               name="phone">
                                        @error('phone')
                                        <label class="text-danger">{{$message}}</label>
                                        @enderror
                                    </div>
                                </div>

                            </div>

                            <div class="form-group">
                                <label for="address">Address</label>
                                <textarea id="address" class="form-control" name="address" placeholder="Address"
                                          style="height: 122px">{{\Illuminate\Support\Facades\Auth::user()->address ?? ''}}</textarea>
                                @error('address')
                                <label class="text-danger">{{$message}}</label>
                                @enderror
                            </div>

                            <button class="template-btn btn-forms" type="submit">
                                Update Profile Information
                            </button>
                        </div>

                    </div>
                </div>

            </form>
        </div>
    </div>


@endsection