@extends('layouts.app')
@section('title', 'Fee Management')
@section('page-title', 'Fee Management')
@section('content')
<div class="space-y-6">
    <div class="bg-white rounded-xl shadow-sm p-6 border border-gray-100" x-data="{ open: false }">
        <button @click="open = !open" class="flex items-center text-blue-600 hover:text-blue-700 font-medium">
            <i class="fas fa-plus mr-2"></i>Create Fee Structure
        </button>
        <form method="POST" action="{{ route('fees.structure.store') }}" x-show="open" x-transition class="mt-4 space-y-4">
            @csrf
            <div class="grid grid-cols-2 gap-4">
                <div><label class="block text-sm font-medium text-gray-700 mb-1">Name</label><input type="text" name="name" required placeholder="e.g. Tuition Fee" class="w-full border border-gray-300 rounded-lg px-4 py-2"></div>
                <div><label class="block text-sm font-medium text-gray-700 mb-1">Amount</label><input type="number" name="amount" required step="0.01" class="w-full border border-gray-300 rounded-lg px-4 py-2"></div>
            </div>
            <div class="grid grid-cols-2 gap-4">
                <div><label class="block text-sm font-medium text-gray-700 mb-1">Frequency</label>
                    <select name="frequency" class="w-full border border-gray-300 rounded-lg px-3 py-2"><option value="monthly">Monthly</option><option value="quarterly">Quarterly</option><option value="annually">Annually</option><option value="one-time">One Time</option></select></div>
                <div><label class="block text-sm font-medium text-gray-700 mb-1">Due Date</label><input type="date" name="due_date" required class="w-full border border-gray-300 rounded-lg px-4 py-2"></div>
            </div>
            <button type="submit" class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700">Create</button>
        </form>
    </div>
    <div class="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
        <div class="px-6 py-4 border-b border-gray-100"><h3 class="font-semibold text-gray-800">Fee Structures</h3></div>
        <table class="w-full">
            <thead class="bg-gray-50"><tr>
                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Name</th>
                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Amount</th>
                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Frequency</th>
                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Actions</th>
            </tr></thead>
            <tbody class="divide-y divide-gray-100">
                @forelse($structures ?? [] as $s)
                <tr>
                    <td class="px-6 py-4 text-sm font-medium">{{ $s->name }}</td>
                    <td class="px-6 py-4 text-sm">₹{{ number_format($s->amount, 2) }}</td>
                    <td class="px-6 py-4 text-sm capitalize">{{ $s->frequency }}</td>
                    <td class="px-6 py-4">
                        <form method="POST" action="{{ route('fees.invoices.generate') }}" class="inline">@csrf
                            <input type="hidden" name="fee_structure_id" value="{{ $s->id }}">
                            <button class="text-blue-600 hover:underline text-sm">Generate Invoices</button>
                        </form>
                    </td>
                </tr>
                @empty
                <tr><td colspan="4" class="px-6 py-8 text-center text-gray-500">No fee structures yet.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if(isset($pendingSummary) && $pendingSummary->count() > 0)
    <div class="bg-yellow-50 rounded-xl p-4 border border-yellow-200">
        <p class="text-yellow-800 font-medium">Total pending fees: ₹{{ number_format(is_numeric($pendingSummary) ? $pendingSummary : $pendingSummary->where('status', 'pending')->first()?->total_amount ?? 0, 2) }}</p>
    </div>
    @endif
</div>
@endsection