@extends('web.themes.shella.layouts.app')

@section('content')
<main id="MainContent">
    <div class="breadcrumbs mt-15">
        <div class="container">
            <ul class="list-unstyled d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
                <li style="font-size: 1.6em;"><a href="/">{{ __('Home') }}</a></li>
                <li style="font-size: 1.6em;"><span class="text-capitizalize">{{ __('Account') }}</span></li>
            </ul>
        </div>
    </div>

    <div class="account mb-40">
        <div class="container">
            <div class="wishlist__head d-flex justify-content-lg-center align-items-center position-relative mb-15 mb-lg-30">
                <h1 class="h3 mt-20 mb-0 text-center text-capitizalize" data-js-store-lists-has-items-wishlist>{{ __('Account') }}</h1>
            </div>

            <form action="{{ route('web.profile.update') }}" method="POST">
                @csrf

                @if(count($errors) > 0)
                    <ul>
                        @foreach($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                @endif
                
                <div class="row">
                    <div class="col-md-6">
                        <label for="first_name" class="label-required">{{ __('First Name') }}</label>
                        <input type="text" name="first_name" id="first_name" placeholder="{{ __('First Name') }}" value="{{ auth()->user()->first_name }}" required="required">
                    </div>

                    <div class="col-md-6">
                        <label for="last_name" class="label-required">{{ __('Last Name') }}</label>
                        <input type="text" name="last_name" id="last_name" placeholder="{{ __('Last name') }}" value="{{ auth()->user()->last_name }}" required="required">
                    </div>

                    <div class="col-md-6">
                        <label for="email" class="label-required">{{ __('Email') }}</label>
                        <input type="email" name="email" id="email" placeholder="{{ __('Email') }}" value="{{ auth()->user()->email }}" spellcheck="false" autocomplete="off" autocapitalize="off" required="required">
                    </div>

                    <div class="col-md-6">
                        <label for="phone_number" class="label-required">{{ __('Phone number') }}</label>
                        <input type="tel" class="form-control" name="phone_number" id="phone_number" placeholder="{{ __('Your phone number') }}" value="{{ auth()->user()->phone_number }}" required="required">
                    </div>

                    <div class="col-12">
                        <label for="password" class="label-required">{{ __('Password') }}</label>
                        <input type="password" class="form-control" name="password" id="password" placeholder="{{ __('Leave empty to ignore') }}">
                    </div>
                </div>
                
                <div class="pt-10">
                    <button type="submit" class="btn btn--secondary">
                        {{ __('Change') }}
                    </button>
                </div>
            </form>

            <hr>

            <a href="/logout" class="btn btn--secondary">
                <i class="mr-5">
                    <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-020" viewBox="0 0 24 24">
                        <path d="M7.874 7.755a.652.652 0 0 1-.176.449l-3.32 3.301h11.621a.6.6 0 0 1 .439.186.601.601 0 0 1 .186.439.598.598 0 0 1-.186.439.601.601 0 0 1-.439.186H4.378l3.32 3.301c.117.13.176.28.176.449a.652.652 0 0 1-.176.449.877.877 0 0 1-.215.127.596.596 0 0 1-.468 0 .896.896 0 0 1-.215-.127l-4.375-4.375a2.48 2.48 0 0 1-.068-.107c-.02-.032-.042-.068-.068-.107a.736.736 0 0 1 0-.468 2.48 2.48 0 0 0 .068-.107c.02-.032.042-.068.068-.107L6.8 7.305c.13-.117.28-.175.449-.175s.319.059.449.176c.118.13.176.28.176.449zm12.94-5.44a.601.601 0 0 1 .186.439v18.75a.6.6 0 0 1-.186.439.601.601 0 0 1-.439.186H11a.6.6 0 0 1-.439-.186.601.601 0 0 1-.186-.439c0-.169.062-.316.186-.439a.601.601 0 0 1 .439-.186h8.75V3.38H11a.6.6 0 0 1-.439-.186.6.6 0 0 1-.186-.439.6.6 0 0 1 .186-.439A.601.601 0 0 1 11 2.13h9.375c.168 0 .315.062.439.185z"></path>
                    </svg>
                </i>
                {{ __('Log out') }}
            </a>
        </div>
    </div>

</main>
@stop