@extends('admin.layout')
@section('title', 'Register Staff')

@section('content')
<div class="container py-5" style="max-width: 500px;">
    <div class="card p-4">
        <h4 class="fw-bold mb-4">Register New Staff</h4>

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

        <form method="POST" action="{{ route('admin.staff.store') }}" autocomplete="off">
            @csrf

            <div class="mb-3">
                <label class="form-label">DP No (auto-generated)</label>
                <input type="text" class="form-control" value="{{ $dpNo }}" readonly disabled>
            </div>

            <div class="mb-3">
                <label class="form-label">Full Name</label>
                <input type="text" name="name" class="form-control" value="{{ old('name') }}" required>
            </div>

            <div class="mb-3">
                <label class="form-label">Phone</label>
                <input type="text" name="phone" class="form-control" value="{{ old('phone') }}">
            </div>

            <div class="mb-3">
                <label class="form-label">Email</label>
                <input type="email" name="email" class="form-control" value="{{ old('email') }}" autocomplete="off" required>
            </div>

            <div class="mb-4">
                <label class="form-label">Password</label>
                <input type="password" name="password" class="form-control" autocomplete="new-password" required>
            </div>

            <button type="submit" class="btn btn-primary w-100">Register Staff</button>
        </form>

        <a href="{{ route('admin.dashboard') }}" class="d-block text-center mt-3 text-decoration-none">&larr; Back</a>
    </div>
</div>
@endsection