@extends('Layouts.app')

@section('content')
<div class="max-w-md mx-auto bg-white p-6 rounded shadow mt-20 mb-96">

        {{-- Alert Sukses --}}
    @if(session('success'))
        <div class="mb-4 p-3 rounded bg-green-100 text-green-800">
            {{ session('success') }}
        </div>
    @endif

    {{-- Alert Error --}}
    @if(session('error'))
        <div class="mb-4 p-3 rounded bg-red-100 text-red-800">
            {{ session('error') }}
        </div>
    @endif
    
    <h2 class="text-xl font-semibold mb-4">Ubah Password: {{ $user->username }}</h2>

    <form action="{{ route('users.updatePassword', $user->id_user) }}" method="POST"  onsubmit="return confirm('Apakah Anda yakin ingin merubah password?');">
        @csrf
        @method('PUT')

        <div class="mb-4">
            <label for="password" class="block text-sm font-medium text-gray-700">Password Baru</label>
            <input type="password" name="password" id="password" required
                   class="mt-1 block w-full border border-gray-300 rounded px-3 py-2">
            @error('password')
                <p class="text-red-600 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>

        <div class="mb-4">
            <label for="password_confirmation" class="block text-sm font-medium text-gray-700">Konfirmasi Password</label>
            <input type="password" name="password_confirmation" id="password_confirmation" required
                   class="mt-1 block w-full border border-gray-300 rounded px-3 py-2">
        </div>

        <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700">
            Simpan
        </button>
    </form>
</div>
@endsection