@extends('admin.layout')

@section('title', 'Settings')

@section('content')
<div class="mb-6">
    <h1 class="text-2xl font-bold text-gray-900">Settings</h1>
    <p class="text-gray-500 text-sm mt-1">Configure IBAN, admin credentials, and notification email</p>
</div>

<div class="space-y-6 max-w-lg">

    {{-- General --}}
    <div class="bg-white rounded-xl border border-gray-200 p-6">
        <h2 class="font-semibold text-gray-900 mb-4">Transfer IBAN</h2>
        <form action="{{ route('admin.settings.save') }}" method="POST" class="space-y-4">
            @csrf
            @if($errors->any())
                <div class="p-3 bg-red-50 border border-red-200 text-red-700 rounded-lg text-sm">
                    {{ $errors->first() }}
                </div>
            @endif

            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">IBAN Number</label>
                <input type="text" name="iban" value="{{ old('iban', $iban) }}" required
                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm font-mono focus:outline-none focus:ring-2 focus:ring-gray-900"
                    placeholder="e.g. SA4420000001234567891234">
                <p class="text-xs text-gray-400 mt-1">Users transfer $1 to this IBAN before submitting.</p>
            </div>

            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">IBAN Bank Name</label>
                <input type="text" name="iban_bank_name" value="{{ old('iban_bank_name', $ibanBankName) }}" required
                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900"
                    placeholder="e.g. Al Rajhi Bank">
            </div>

            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Admin Notification Email</label>
                <input type="email" name="admin_email" value="{{ old('admin_email', $adminEmail) }}" required
                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900"
                    placeholder="admin@yourcompany.com">
                <p class="text-xs text-gray-400 mt-1">Receives alerts for every new verification request.</p>
            </div>

            <hr class="border-gray-100">

            <h2 class="font-semibold text-gray-900">Admin Credentials</h2>

            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Username</label>
                <input type="text" name="admin_username" value="{{ old('admin_username', $adminUsername) }}" required minlength="3"
                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900">
            </div>

            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">
                    New Password <span class="text-gray-400 font-normal">(leave blank to keep current)</span>
                </label>
                <input type="password" name="new_password" minlength="6"
                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900"
                    placeholder="Min. 6 characters">
            </div>

            <div>
                <label class="block text-sm font-medium text-gray-700 mb-1">Confirm New Password</label>
                <input type="password" name="new_password_confirmation"
                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-900"
                    placeholder="Repeat new password">
            </div>

            <button type="submit"
                class="bg-gray-900 text-white px-6 py-2 rounded-lg text-sm font-medium hover:bg-gray-700 transition">
                Save All Settings
            </button>
        </form>
    </div>

</div>
@endsection