@extends('layouts.app')

@section('title', 'Finance & Accounting')

@section('content')
<div class="space-y-6">
    <div class="flex flex-col md:flex-row md:items-center justify-between gap-4"><div><p class="text-xs font-bold uppercase tracking-[0.18em] text-violet-600">Double-entry ledger</p><h1 class="text-2xl font-extrabold text-slate-950 dark:text-white">Finance & accounting</h1><p class="text-sm text-slate-500">Live operational postings with government clearing and VAT liabilities kept out of revenue.</p></div><div class="flex gap-2"><a href="{{ route('app.billing.invoices.index') }}" class="rounded-xl bg-white border border-slate-200 px-4 py-2 text-xs font-bold">Invoices</a><a href="{{ route('app.billing.refunds.index') }}" class="rounded-xl bg-slate-900 px-4 py-2 text-xs font-bold text-white">Refund control</a></div></div>
    <div class="grid grid-cols-2 lg:grid-cols-4 gap-4">@foreach([['Monthly service revenue',$serviceRevenue,'text-emerald-600'],['Government fees handled',$governmentFees,'text-amber-600'],['VAT output payable',$vatPayable,'text-violet-600'],['Outstanding receivables',$receivables,'text-rose-600']] as [$label,$amount,$color])<div class="rounded-2xl bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 p-4"><p class="text-[10px] font-bold uppercase tracking-wider text-slate-400">{{ $label }}</p><p class="mt-1 text-xl font-extrabold {{ $color }}">AED {{ number_format((float)$amount,2) }}</p></div>@endforeach</div>
    <div class="grid grid-cols-1 xl:grid-cols-2 gap-6">
        <div class="bg-white dark:bg-slate-800 rounded-3xl border border-slate-200 dark:border-slate-700 overflow-hidden shadow-sm"><div class="p-5 border-b border-slate-200 dark:border-slate-700"><h2 class="font-bold">Chart of accounts & balances</h2><p class="text-xs text-slate-500">System accounts are created only when a real transaction posts.</p></div><div class="overflow-x-auto"><table class="w-full text-sm"><thead class="bg-slate-50 dark:bg-slate-900/50 text-[11px] uppercase text-slate-500"><tr><th class="p-4 text-left">Account</th><th class="p-4 text-left">Type</th><th class="p-4 text-right">Debit</th><th class="p-4 text-right">Credit</th></tr></thead><tbody class="divide-y divide-slate-100 dark:divide-slate-700">@forelse($accounts as $account)<tr><td class="p-4"><span class="font-mono text-xs text-sky-700">{{ $account->account_code }}</span><p class="font-bold">{{ $account->account_name }}</p></td><td class="p-4 text-slate-500">{{ ucfirst($account->account_type) }} @if($account->is_clearing)<span class="text-[10px] font-bold text-amber-600">CLEARING</span>@endif</td><td class="p-4 text-right">AED {{ number_format((float)($account->debit_total ?? 0),2) }}</td><td class="p-4 text-right">AED {{ number_format((float)($account->credit_total ?? 0),2) }}</td></tr>@empty<tr><td colspan="4" class="p-12 text-center text-slate-400">No journal activity yet.</td></tr>@endforelse</tbody></table></div></div>
        <div class="bg-white dark:bg-slate-800 rounded-3xl border border-slate-200 dark:border-slate-700 p-5 shadow-sm"><h2 class="font-bold">Recent journals</h2><div class="mt-4 space-y-3">@forelse($journals as $journal)<div class="rounded-2xl border border-slate-200 dark:border-slate-700 p-4"><div class="flex justify-between gap-3"><div><p class="font-bold text-sm">{{ $journal->entry_number }}</p><p class="text-xs text-slate-400">{{ $journal->narration }}</p></div><div class="text-right"><p class="font-extrabold">AED {{ number_format((float)$journal->total_debit,2) }}</p><p class="text-[10px] uppercase text-emerald-600 font-bold">Balanced</p></div></div><div class="mt-3 grid grid-cols-2 gap-2 text-[11px]">@foreach($journal->items as $item)<div class="rounded-lg bg-slate-50 px-2 py-1 flex justify-between"><span>{{ $item->account?->account_name }}</span><span class="font-bold">{{ (float)$item->debit > 0 ? 'Dr '.number_format((float)$item->debit,2) : 'Cr '.number_format((float)$item->credit,2) }}</span></div>@endforeach</div></div>@empty<div class="rounded-2xl border border-dashed border-slate-200 p-10 text-center text-xs text-slate-400">No journals posted yet.</div>@endforelse</div></div>
    </div>
</div>
@endsection