@extends('layouts.admin')
@section('title', 'New Loan Application')
@section('page-title', 'New Loan Application')
@section('page-subtitle', 'Submit a loan application for a member')
@section('content')
<div class="max-w-4xl">
    <div class="card p-6">
        <form action="{{ route('admin.loans.store') }}" method="POST">
            @csrf
            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Member <span class="text-red-500">*</span></label>
                    <select name="member_id" required class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                        <option value="">-- Select Member --</option>
                        @foreach($members as $m)
                        <option value="{{ $m->id }}" {{ old('member_id') == $m->id ? 'selected' : '' }}>{{ $m->member_id }} - {{ $m->full_name }}</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Loan Amount (₦) <span class="text-red-500">*</span></label>
                    <input type="number" name="amount" value="{{ old('amount') }}" required min="1000" placeholder="e.g. 100000" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Interest Rate (%) <span class="text-red-500">*</span></label>
                    <input type="number" name="interest_rate" value="{{ old('interest_rate', 5) }}" required min="0" max="100" step="0.1" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Duration (Months) <span class="text-red-500">*</span></label>
                    <input type="number" name="duration_months" value="{{ old('duration_months', 6) }}" required min="1" max="60" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Loan Type <span class="text-red-500">*</span></label>
                    <select name="loan_type" required class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                        <option value="">Select Type</option>
                        <option value="personal" {{ old('loan_type') === 'personal' ? 'selected' : '' }}>Personal</option>
                        <option value="business" {{ old('loan_type') === 'business' ? 'selected' : '' }}>Business</option>
                        <option value="emergency" {{ old('loan_type') === 'emergency' ? 'selected' : '' }}>Emergency</option>
                        <option value="group" {{ old('loan_type') === 'group' ? 'selected' : '' }}>Group</option>
                    </select>
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Repayment Schedule <span class="text-red-500">*</span></label>
                    <select name="repayment_schedule" required class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                        <option value="monthly" {{ old('repayment_schedule') === 'monthly' ? 'selected' : '' }}>Monthly</option>
                        <option value="weekly" {{ old('repayment_schedule') === 'weekly' ? 'selected' : '' }}>Weekly</option>
                        <option value="daily" {{ old('repayment_schedule') === 'daily' ? 'selected' : '' }}>Daily</option>
                    </select>
                </div>
                <div class="md:col-span-2">
                    <label class="block text-sm font-medium text-gray-700 mb-1">Loan Purpose <span class="text-red-500">*</span></label>
                    <textarea name="purpose" required rows="2" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none" placeholder="Describe the purpose of this loan...">{{ old('purpose') }}</textarea>
                </div>
                <div class="md:col-span-2 border-t pt-4">
                    <h3 class="font-semibold text-gray-700 mb-3"><i class="fas fa-user-shield mr-2 text-blue-600"></i>Guarantor Information</h3>
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Primary Guarantor Name <span class="text-red-500">*</span></label>
                    <input type="text" name="guarantor1_name" value="{{ old('guarantor1_name') }}" required class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Primary Guarantor Phone <span class="text-red-500">*</span></label>
                    <input type="text" name="guarantor1_phone" value="{{ old('guarantor1_phone') }}" required class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Secondary Guarantor Name</label>
                    <input type="text" name="guarantor2_name" value="{{ old('guarantor2_name') }}" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">Secondary Guarantor Phone</label>
                    <input type="text" name="guarantor2_phone" value="{{ old('guarantor2_phone') }}" class="w-full border border-gray-300 rounded-lg px-3 py-2 focus:ring-2 focus:ring-blue-500 focus:outline-none">
                </div>
            </div>
            <div class="bg-blue-50 border border-blue-200 rounded-lg p-4 mt-4 text-sm text-blue-800">
                <i class="fas fa-calculator mr-2"></i>Interest and repayment amounts will be calculated automatically on submission.
            </div>
            <div class="flex justify-end space-x-3 mt-6 pt-4 border-t">
                <a href="{{ route('admin.loans.index') }}" class="px-4 py-2 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50">Cancel</a>
                <button type="submit" class="px-6 py-2 bg-blue-700 text-white rounded-lg hover:bg-blue-800 font-medium">
                    <i class="fas fa-paper-plane mr-2"></i>Submit Application
                </button>
            </div>
        </form>
    </div>
</div>
@endsection