@php($passwordErrors = $errors->updatePassword)

<x-storefront.account-page title="Password Manager">
    {{-- Posts to the existing password route, which also signs out the other devices. --}}
    <form method="POST" action="{{ route('account.security.password') }}" class="row g-3 sm-account-form">
        @csrf
        @method('PUT')

        @foreach ([
            ['current_password', 'Current Password', 'current-password', null],
            ['password', 'New Password', 'new-password', 8],
            ['password_confirmation', 'Confirm New Password', 'new-password', 8],
        ] as [$field, $label, $autocomplete, $minLength])
            <div class="col-12">
                <label class="form-label" for="account-{{ $field }}">{{ $label }} <span aria-hidden="true">*</span></label>
                <input id="account-{{ $field }}" name="{{ $field }}" type="password" autocomplete="{{ $autocomplete }}" maxlength="255" @if ($minLength) minlength="{{ $minLength }}" @endif required @class(['form-control rounded-pill', 'is-invalid' => $passwordErrors->has($field)]) @if ($passwordErrors->has($field)) aria-describedby="account-{{ $field }}-error" @endif>
                @if ($passwordErrors->has($field))
                    <div id="account-{{ $field }}-error" class="invalid-feedback">{{ $passwordErrors->first($field) }}</div>
                @endif
            </div>
        @endforeach

        <div class="col-12">
            <button class="btn sm-btn-primary rounded-pill" type="submit">Change Password</button>
        </div>
    </form>

    <p class="mt-4 mb-0"><a class="sm-text-link" href="{{ route('account.security') }}">Two-factor sign-in and signed-in devices</a></p>
</x-storefront.account-page>