@extends('user.layouts.app')
@section('title','Change Password')
@section('page-title','Change Password')
@section('page-subtitle','Update your password if you suspect your account may be compromised')
@section('content')

@if(session('success'))<div class="alert alert-success">{{ session('success') }}</div>@endif
@if($errors->any())<div class="alert alert-danger"><ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul></div>@endif

<div class="row g-4">
    <div class="col-lg-7">
        <div class="content-card p-4">
            <div class="alert alert-warning py-2 mb-4">
                <i class="fas fa-shield-halved me-1"></i>
                If you think your password was exposed, change it here immediately. You will stay logged in on this device after updating.
            </div>

            <form method="POST" action="{{ route('user.change-password.update') }}">
                @csrf
                @method('PUT')

                <div class="mb-3">
                    <label class="form-label">Current Password *</label>
                    <input type="password" name="current_password" class="form-control" required autocomplete="current-password">
                </div>
                <div class="mb-3">
                    <label class="form-label">New Password *</label>
                    <input type="password" name="password" class="form-control" required autocomplete="new-password">
                </div>
                <div class="mb-3">
                    <label class="form-label">Confirm New Password *</label>
                    <input type="password" name="password_confirmation" class="form-control" required autocomplete="new-password">
                </div>

                <button type="submit" class="btn btn-success">Update Password</button>
                <a href="{{ route('user.profile') }}" class="btn btn-outline-secondary ms-2">Back to Profile</a>
            </form>
        </div>
    </div>

    <div class="col-lg-5">
        <div class="content-card p-4">
            <h6 class="mb-3"><i class="fas fa-lock me-1"></i> Secure password guide</h6>
            @include('partials.password-requirements')
            <hr>
            <hr>
            <p class="small text-muted mb-2">
                Avoid reusing passwords from other sites. Consider a passphrase you can remember, such as
                <em>Green@Conference2026!</em> — long, unique, and hard to guess.
            </p>
            <p class="small text-muted mb-0">
                For recovery without your current password, use
                <a href="{{ route('password.request') }}">Forgot password</a> (email link) or contact support.
                Phone/WhatsApp on your profile are for election OTP only, not password reset.
            </p>
        </div>
    </div>
</div>

@endsection