@extends('layouts.admin')

@section('title', 'Add Beneficiary')

@section('content')
<div class="page-header">
    <div class="page-header-left">
        <a href="{{ route('admin.beneficiaries') }}" class="btn-back">
            <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M10 12L6 8l4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>
            Back
        </a>
        <h1 class="page-title">Add Beneficiary</h1>
    </div>
</div>

<div class="card">
    <div class="card-body">
        <form method="POST" action="{{ route('admin.beneficiaries.store') }}">
            @csrf

            <div class="form-section">
                <h3 class="form-section-title">Beneficiary Details</h3>
                <div class="form-grid form-grid-2">
                    <div class="form-group">
                        <label for="user_id" class="form-label">Customer <span class="required">*</span></label>
                        <select id="user_id" name="user_id" class="form-input @error('user_id') is-invalid @enderror" required>
                            <option value="">Select a customer...</option>
                            @foreach($customers as $customer)
                            <option value="{{ $customer->id }}" {{ old('user_id') == $customer->id ? 'selected' : '' }}>
                                {{ $customer->name }} ({{ $customer->email }})
                            </option>
                            @endforeach
                        </select>
                        @error('user_id')
                        <span class="form-error">{{ $message }}</span>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="name" class="form-label">Beneficiary Name <span class="required">*</span></label>
                        <input type="text" id="name" name="name" class="form-input @error('name') is-invalid @enderror" value="{{ old('name') }}" required>
                        @error('name')
                        <span class="form-error">{{ $message }}</span>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="bank" class="form-label">Bank <span class="required">*</span></label>
                        <input type="text" id="bank" name="bank" class="form-input @error('bank') is-invalid @enderror" value="{{ old('bank') }}" required>
                        @error('bank')
                        <span class="form-error">{{ $message }}</span>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="account_number" class="form-label">Account Number <span class="required">*</span></label>
                        <input type="text" id="account_number" name="account_number" class="form-input @error('account_number') is-invalid @enderror" value="{{ old('account_number') }}" required>
                        @error('account_number')
                        <span class="form-error">{{ $message }}</span>
                        @enderror
                    </div>
                    <div class="form-group">
                        <label for="nickname" class="form-label">Nickname</label>
                        <input type="text" id="nickname" name="nickname" class="form-input @error('nickname') is-invalid @enderror" value="{{ old('nickname') }}">
                        @error('nickname')
                        <span class="form-error">{{ $message }}</span>
                        @enderror
                    </div>
                </div>
            </div>

            <div class="form-actions">
                <button type="submit" class="btn btn-primary">Add Beneficiary</button>
                <a href="{{ route('admin.beneficiaries') }}" class="btn btn-outline">Cancel</a>
            </div>
        </form>
    </div>
</div>
@endsection