@extends('layouts.app')

@section('content')
    <x-common.page-breadcrumb :pageTitle="$title ?? 'Neraca'" />

    @php
        $formatRupiah = fn ($value) => 'Rp ' . number_format((float) $value, 0, ',', '.');

        $kasKecil = (float) ($summary['kas_kecil'] ?? 0);
        $kasTunai = (float) ($summary['kas_tunai'] ?? 0);
        $kasBank = (float) ($summary['kas_bank'] ?? 0);
        $piutangUsaha = (float) ($summary['piutang_usaha'] ?? 0);
        $persediaan = (float) ($summary['persediaan'] ?? 0);
        $asetLancarLainnya = (float) ($summary['aset_lancar_lainnya'] ?? 0);
        $totalAsetLancar = (float) ($summary['total_aset_lancar'] ?? 0);

        $asetTetapBruto = (float) ($summary['aset_tetap_bruto'] ?? 0);
        $akumulasiPenyusutan = (float) ($summary['akumulasi_penyusutan'] ?? 0);
        $asetTetapBersih = (float) ($summary['aset_tetap_bersih'] ?? 0);

        $totalAset = (float) ($summary['total_aset'] ?? 0);

        $hutangUsaha = (float) ($summary['hutang_usaha'] ?? 0);
        $utangGaji = (float) ($summary['utang_gaji'] ?? 0);
        $utangLainLain = (float) ($summary['utang_lain_lain'] ?? 0);
        $totalKewajiban = (float) ($summary['total_kewajiban'] ?? 0);

        $modalPemilik = (float) ($summary['modal_pemilik'] ?? 0);
        $prive = (float) ($summary['prive'] ?? 0);
        $labaDitahan = (float) ($summary['laba_ditahan'] ?? 0);
        $totalEkuitas = (float) ($summary['total_ekuitas'] ?? 0);

        $totalPasiva = (float) ($summary['total_pasiva'] ?? 0);
        $selisih = (float) ($summary['selisih'] ?? 0);
        $isBalanced = (bool) ($summary['is_balanced'] ?? false);
    @endphp

    <div class="mb-6 flex flex-wrap items-center justify-between gap-3">
        <form method="GET" class="flex flex-wrap items-end gap-3">
            <x-form.date-picker
                name="as_of_date"
                label="Posisi Tanggal"
                placeholder="Pilih tanggal"
                :defaultDate="$asOfDate"
            />

            <button type="submit" class="h-11 rounded-lg bg-brand-500 px-4 text-sm font-medium text-white shadow-theme-xs hover:bg-brand-600 transition-colors">
                Filter
            </button>

            <a href="{{ route('reports.balance-sheet') }}"
               class="h-11 flex items-center rounded-lg border border-gray-300 bg-white px-4 text-sm font-medium text-gray-700 shadow-theme-xs hover:bg-gray-50 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-300 dark:hover:bg-gray-700 transition-colors">
                Reset
            </a>
        </form>

        <div class="flex flex-wrap gap-2">
            <form method="GET" action="{{ route('reports.balance-sheet.export') }}">
                <input type="hidden" name="as_of_date" value="{{ $asOfDate }}">
                <button type="submit"
                    class="inline-flex items-center gap-2 rounded-lg border border-gray-300 px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 dark:border-gray-700 dark:text-gray-300">
                    Export Excel
                </button>
            </form>

            <form method="GET" action="{{ route('reports.balance-sheet.print') }}" target="_blank">
                <input type="hidden" name="as_of_date" value="{{ $asOfDate }}">
                <button type="submit"
                    class="inline-flex items-center gap-2 rounded-lg bg-brand-500 px-4 py-2 text-sm font-medium text-white hover:bg-brand-600">
                    Cetak
                </button>
            </form>
        </div>
    </div>

    <div class="mb-6 rounded-2xl border border-brand-200 bg-brand-50 p-5 dark:border-brand-900/40 dark:bg-brand-900/10">
        <div class="flex items-start gap-4">
            <div class="flex h-10 w-10 items-center justify-center rounded-xl bg-brand-500 text-white">
                <svg class="size-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6M7 4h10a2 2 0 012 2v12a2 2 0 01-2 2H7a2 2 0 01-2-2V6a2 2 0 012-2z"/>
                </svg>
            </div>

            <div class="flex-1">
                <div class="flex flex-wrap items-center gap-2">
                    <h4 class="text-sm font-semibold text-gray-900 dark:text-white/90">Neraca</h4>
                    <span class="rounded-full bg-white/80 px-2 py-0.5 text-xs font-medium text-gray-700 dark:bg-white/10 dark:text-white/70">
                        Posisi per {{ \Carbon\Carbon::parse($asOfDate)->format('d M Y') }}
                    </span>
                    <span class="rounded-full px-2 py-0.5 text-xs font-medium {{ $isBalanced ? 'bg-success-50 text-success-700 dark:bg-success-500/10 dark:text-success-300' : 'bg-error-50 text-error-700 dark:bg-error-500/10 dark:text-error-300' }}">
                        {{ $isBalanced ? 'BALANCE' : 'BELUM BALANCE' }}
                    </span>
                </div>

                <p class="mt-2 text-sm text-gray-700 dark:text-white/70">
                    Neraca menampilkan posisi aset, kewajiban, dan ekuitas pada satu tanggal tertentu.
                </p>
            </div>
        </div>
    </div>

    <div class="mb-6 grid grid-cols-1 gap-4 sm:grid-cols-3">
        <div class="rounded-2xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-white/[0.03]">
            <div class="text-sm font-medium text-gray-500 dark:text-gray-400">Total Aset</div>
            <div class="mt-2 text-2xl font-bold text-gray-800 dark:text-white/90">{{ $formatRupiah($totalAset) }}</div>
        </div>

        <div class="rounded-2xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-white/[0.03]">
            <div class="text-sm font-medium text-gray-500 dark:text-gray-400">Total Kewajiban</div>
            <div class="mt-2 text-2xl font-bold text-error-600 dark:text-error-400">{{ $formatRupiah($totalKewajiban) }}</div>
        </div>

        <div class="rounded-2xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-white/[0.03]">
            <div class="text-sm font-medium text-gray-500 dark:text-gray-400">Total Ekuitas</div>
            <div class="mt-2 text-2xl font-bold text-success-600 dark:text-success-400">{{ $formatRupiah($totalEkuitas) }}</div>
        </div>
    </div>

    <div class="grid grid-cols-1 gap-6 xl:grid-cols-2">
        <div class="space-y-6">
            <div class="overflow-hidden rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]">
                <div class="border-b border-gray-200 px-5 py-4 dark:border-gray-800">
                    <h3 class="text-base font-semibold text-gray-800 dark:text-white/90">Aset Lancar</h3>
                </div>
                <table class="w-full">
                    <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Kas Kecil</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($kasKecil) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Kas Tunai</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($kasTunai) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Kas Bank</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($kasBank) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Piutang Usaha</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($piutangUsaha) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Persediaan</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($persediaan) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Aset Lancar Lainnya</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($asetLancarLainnya) }}</td>
                        </tr>
                        <tr class="bg-gray-100 dark:bg-gray-800/50">
                            <td class="px-5 py-4 text-base font-bold text-gray-900 dark:text-white">Total Aset Lancar</td>
                            <td class="px-5 py-4 text-right text-base font-bold text-brand-600 dark:text-brand-400">{{ $formatRupiah($totalAsetLancar) }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <div class="overflow-hidden rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]">
                <div class="border-b border-gray-200 px-5 py-4 dark:border-gray-800">
                    <h3 class="text-base font-semibold text-gray-800 dark:text-white/90">Aset Tetap</h3>
                </div>
                <table class="w-full">
                    <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Aset Tetap Bruto</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($asetTetapBruto) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Akumulasi Penyusutan</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-error-600 dark:text-error-400">({{ $formatRupiah($akumulasiPenyusutan) }})</td>
                        </tr>
                        <tr class="bg-gray-100 dark:bg-gray-800/50">
                            <td class="px-5 py-4 text-base font-bold text-gray-900 dark:text-white">Aset Tetap Bersih</td>
                            <td class="px-5 py-4 text-right text-base font-bold text-brand-600 dark:text-brand-400">{{ $formatRupiah($asetTetapBersih) }}</td>
                        </tr>
                        <tr class="bg-brand-50 dark:bg-brand-500/10">
                            <td class="px-5 py-4 text-base font-bold text-gray-900 dark:text-white">Total Aset</td>
                            <td class="px-5 py-4 text-right text-base font-bold text-brand-600 dark:text-brand-400">{{ $formatRupiah($totalAset) }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <div class="space-y-6">
            <div class="overflow-hidden rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]">
                <div class="border-b border-gray-200 px-5 py-4 dark:border-gray-800">
                    <h3 class="text-base font-semibold text-gray-800 dark:text-white/90">Kewajiban</h3>
                </div>
                <table class="w-full">
                    <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Hutang Usaha</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($hutangUsaha) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Utang Gaji</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($utangGaji) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Utang Lain-lain</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($utangLainLain) }}</td>
                        </tr>
                        <tr class="bg-gray-100 dark:bg-gray-800/50">
                            <td class="px-5 py-4 text-base font-bold text-gray-900 dark:text-white">Total Kewajiban</td>
                            <td class="px-5 py-4 text-right text-base font-bold text-error-600 dark:text-error-400">{{ $formatRupiah($totalKewajiban) }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <div class="overflow-hidden rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03]">
                <div class="border-b border-gray-200 px-5 py-4 dark:border-gray-800">
                    <h3 class="text-base font-semibold text-gray-800 dark:text-white/90">Ekuitas</h3>
                </div>
                <table class="w-full">
                    <tbody class="divide-y divide-gray-200 dark:divide-gray-800">
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Modal Pemilik</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-gray-800 dark:text-white/90">{{ $formatRupiah($modalPemilik) }}</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Prive</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold text-error-600 dark:text-error-400">({{ $formatRupiah($prive) }})</td>
                        </tr>
                        <tr>
                            <td class="px-5 py-4 text-sm text-gray-700 dark:text-gray-300">Laba Ditahan</td>
                            <td class="px-5 py-4 text-right text-sm font-semibold {{ $labaDitahan < 0 ? 'text-error-600 dark:text-error-400' : 'text-gray-800 dark:text-white/90' }}">
                                {{ $formatRupiah($labaDitahan) }}
                            </td>
                        </tr>
                        <tr class="bg-gray-100 dark:bg-gray-800/50">
                            <td class="px-5 py-4 text-base font-bold text-gray-900 dark:text-white">Total Ekuitas</td>
                            <td class="px-5 py-4 text-right text-base font-bold text-success-600 dark:text-success-400">{{ $formatRupiah($totalEkuitas) }}</td>
                        </tr>
                        <tr class="bg-brand-50 dark:bg-brand-500/10">
                            <td class="px-5 py-4 text-base font-bold text-gray-900 dark:text-white">Total Kewajiban + Ekuitas</td>
                            <td class="px-5 py-4 text-right text-base font-bold text-brand-600 dark:text-brand-400">{{ $formatRupiah($totalPasiva) }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>

            <div class="rounded-2xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-white/[0.03]">
                <div class="flex items-center justify-between gap-3">
                    <div>
                        <div class="text-sm font-semibold text-gray-800 dark:text-white/90">Status Neraca</div>
                        <div class="mt-1 text-xs text-gray-500 dark:text-gray-400">
                            Total Aset harus sama dengan Total Kewajiban + Ekuitas.
                        </div>
                    </div>
                    <div class="text-right">
                        <div class="text-xs text-gray-500 dark:text-gray-400">Selisih</div>
                        <div class="text-lg font-bold {{ $isBalanced ? 'text-success-600 dark:text-success-400' : 'text-error-600 dark:text-error-400' }}">
                            {{ $formatRupiah($selisih) }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="mt-12 border-t border-gray-200 pt-6 text-center text-xs text-gray-500 dark:border-gray-800 dark:text-gray-400">
        <p>© {{ date('Y') }} <span class="font-semibold text-gray-700 dark:text-gray-300">aplikasipercetakan.com</span>. All rights reserved.</p>
    </div>
@endsection