@extends('frontend.layout_2')
@section('title', 'Transactions')

@push('styles')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"/>
<style>
@media (prefers-reduced-motion:no-preference){
    .press:active{transform:translateY(1px);}
}

.badge{
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    border-radius:999px;
    padding:.2rem .6rem;
    font-weight:700;
    font-size:11px;
    line-height:1;
    border:1px solid transparent;
}

.badge-pending{background:#fffbeb;color:#92400e;border-color:#fde68a;}
.badge-approved{background:#ecfdf5;color:#065f46;border-color:#a7f3d0;}
.badge-rejected{background:#fef2f2;color:#991b1b;border-color:#fecaca;}
.badge-info{background:#eef2ff;color:#3730a3;border-color:#c7d2fe;}

.section-title{
    margin-top:.75rem;
    margin-bottom:.25rem;
    font-size:.875rem;
    font-weight:800;
    color:#1f2937;
}

.item{
    display:flex;
    align-items:flex-start;
    gap:.75rem;
    padding:.75rem 0;
    border-bottom:1px solid #f1f5f9;
}

.item:last-child{border-bottom:0;}

.icon-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    color:#fff;
    width:34px;
    height:34px;
    flex:0 0 auto;
}

.card-scroll{
    max-height:70vh;
    overflow:auto;
    padding-right:.25rem;
}

.amount-green{color:#047857;}
.amount-red{color:#e11d48;}
.text-dim{color:#64748b;}

.admin-message{
    margin-top:8px;
    border-radius:12px;
    border:1px solid #fed7aa;
    background:#fff7ed;
    color:#9a3412;
    padding:8px 10px;
    font-size:12px;
    line-height:1.55;
}

.admin-fee{
    margin-top:6px;
    border-radius:12px;
    border:1px solid #fecaca;
    background:#fef2f2;
    color:#991b1b;
    padding:7px 10px;
    font-size:12px;
    line-height:1.55;
}

.meta-line{
    margin-top:2px;
    font-size:12px;
    color:#64748b;
}
</style>
@endpush

@section('sub_layout')
<div class="mx-auto max-w-6xl px-4 py-6">

    @if(session('success'))
        <div class="mb-4 rounded-xl border border-emerald-200 bg-emerald-50 px-3 py-3 text-sm text-emerald-800">
            <i class="fa-solid fa-circle-check"></i>
            {{ session('success') }}
        </div>
    @endif

    @if(session('error'))
        <div class="mb-4 rounded-xl border border-red-200 bg-red-50 px-3 py-3 text-sm text-red-800">
            <i class="fa-solid fa-circle-xmark"></i>
            {{ session('error') }}
        </div>
    @endif

    <div class="grid grid-cols-1 gap-5 md:grid-cols-2">

        {{-- Pending --}}
        <div class="rounded-2xl border border-slate-100 bg-white shadow-sm">
            <div class="flex items-center justify-between rounded-t-2xl border-b border-slate-100 px-4 py-3">
                <div class="flex items-center gap-2">
                    <span class="badge badge-pending">
                        <i class="fa-solid fa-hourglass-half"></i>
                        Pending
                    </span>
                    <span class="text-xs text-dim">জামানত, উইথড্র, লোন</span>
                </div>
            </div>

            <div class="card-scroll px-4 pb-3">

                {{-- Deposits Pending --}}
                <div class="section-title">জামানত</div>

                @forelse($pendingDeposits as $dep)
                    <div class="item">
                        <span class="icon-pill" style="background:#ef4444">
                            <i class="fa-solid fa-piggy-bank"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold">জামানত ({{ strtoupper($dep->method) }})</div>
                            <div class="text-xs text-dim">trx: {{ $dep->transaction_id ?? '-' }}</div>

                            <span class="badge badge-pending mt-1">
                                <i class="fa-regular fa-clock"></i>
                                Pending
                            </span>
                        </div>

                        <div class="text-right text-sm font-extrabold amount-green">
                            ৳ {{ number_format((float) $dep->amount) }}
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো pending জামানত নেই</div>
                @endforelse

                {{-- Withdraw Pending --}}
                <div class="section-title">উইথড্র</div>

                @forelse($pendingWithdraws as $w)
                    <div class="item">
                        <span class="icon-pill" style="background:#7e57c2">
                            <i class="fa-solid fa-right-left"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold">উইথড্র ({{ strtoupper($w->method) }})</div>
                            <div class="text-xs text-dim">trx: -</div>

                            <span class="badge badge-pending mt-1">
                                <i class="fa-regular fa-clock"></i>
                                Pending
                            </span>
                        </div>

                        <div class="text-right text-sm font-extrabold amount-red">
                            ৳ {{ number_format((float) $w->amount) }}
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো pending উইথড্র নেই</div>
                @endforelse

                {{-- Old Loans Pending --}}
                <!--<div class="section-title d-none">পুরনো লোন</div>-->

                <!--@forelse($pendingLoans as $loan)-->
                <!--    <div class="item d-none">-->
                <!--        <span class="icon-pill" style="background:#ef4444">-->
                <!--            <i class="fa-solid fa-hand-holding-dollar"></i>-->
                <!--        </span>-->

                <!--        <div class="min-w-0 flex-1">-->
                <!--            <div class="text-sm font-semibold">Loan #{{ $loan->id }}</div>-->
                <!--            <div class="text-xs text-dim">-->
                <!--                Status: {{ strtoupper(str_replace('_',' ', $loan->status)) }}-->
                <!--            </div>-->
                <!--        </div>-->

                <!--        <div class="text-right text-sm font-extrabold amount-green">-->
                <!--            ৳ {{ number_format((float) $loan->amount) }}-->
                <!--        </div>-->
                <!--    </div>-->
                <!--@empty-->
                <!--    <div class="py-2 text-xs text-dim">কোনো pending পুরনো লোন নেই</div>-->
                <!--@endforelse-->

                {{-- Erin Loans Pending --}}
                <div class="section-title">Loan Applications</div>

                @forelse(($pendingErinLoans ?? collect()) as $loan)
                    @php
                        $plan = $loan->loanPlan;
                        $totalPayable = $loan->total_payable ?? ((int) $loan->monthly_installment * (int) $loan->term_months);
                    @endphp

                    <div class="item">
                        <span class="icon-pill" style="background:#f97316">
                            <i class="fa-solid fa-file-invoice-dollar"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold">
                                 Loan #{{ $loan->id }}
                            </div>

                            <div class="meta-line">
                                Status:
                                {{ strtoupper(str_replace('_',' ', $loan->status)) }}
                            </div>

                            <div class="meta-line">
                                Plan:
                                @if($plan)
                                    {{ $plan->term_months }} মাস / ৳ {{ number_format((float) $plan->amount) }}
                                @else
                                    -
                                @endif
                            </div>

                            <div class="meta-line">
                                Installment:
                                ৳ {{ number_format((float) $loan->monthly_installment) }}
                                ×
                                {{ $loan->term_months }} মাস
                            </div>

                            @if((float) $loan->fee_custom > 0)
                                <div class="admin-fee">
                                    <strong>Admin Fee:</strong>
                                    ৳ {{ number_format((float) $loan->fee_custom, 2) }}
                                </div>
                            @endif

                            @if(!empty($loan->message_custom))
                                <div class="admin-message">
                                    <strong>Admin Message:</strong>
                                    {{ $loan->message_custom }}
                                </div>
                            @endif

                            <span class="badge badge-pending mt-2">
                                <i class="fa-regular fa-clock"></i>
                                Pending
                            </span>
                        </div>

                        <div class="text-right text-sm font-extrabold amount-green">
                            ৳ {{ number_format((float) $loan->requested_amount) }}
                            <div class="text-[11px] text-dim font-normal">
                                Total: ৳ {{ number_format((float) $totalPayable) }}
                            </div>
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো pending loan নেই</div>
                @endforelse

                {{-- Rejected Erin Loans --}}
                <div class="section-title">Rejected  Loans</div>

                @forelse(($rejectedErinLoans ?? collect()) as $loan)
                    <div class="item">
                        <span class="icon-pill" style="background:#dc2626">
                            <i class="fa-solid fa-circle-xmark"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold"> Loan #{{ $loan->id }}</div>
                            <div class="text-xs text-dim">
                                Rejected Amount:
                                ৳ {{ number_format((float) $loan->requested_amount) }}
                            </div>

                            @if($loan->notes)
                                <div class="admin-message">
                                    <strong>Reason:</strong>
                                    {{ $loan->notes }}
                                </div>
                            @endif

                            @if(!empty($loan->message_custom))
                                <div class="admin-message">
                                    <strong>Admin Message:</strong>
                                    {{ $loan->message_custom }}
                                </div>
                            @endif

                            <span class="badge badge-rejected mt-2">
                                Rejected
                            </span>
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো rejected  loan নেই</div>
                @endforelse
            </div>
        </div>

        {{-- Approved --}}
        <div class="rounded-2xl border border-slate-100 bg-white shadow-sm">
            <div class="flex items-center justify-between rounded-t-2xl border-b border-slate-100 px-4 py-3">
                <div class="flex items-center gap-2">
                    <span class="badge badge-approved">
                        <i class="fa-solid fa-circle-check"></i>
                        Approved
                    </span>
                    <span class="text-xs text-dim">জামানত, উইথড্র, লোন</span>
                </div>
            </div>

            <div class="card-scroll px-4 pb-3">

                {{-- Deposits Approved --}}
                <div class="section-title">জামানত</div>

                @forelse($approvedDeposits as $dep)
                    <div class="item">
                        <span class="icon-pill" style="background:#10b981">
                            <i class="fa-solid fa-piggy-bank"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold">জামানত ({{ strtoupper($dep->method) }})</div>
                            <div class="text-xs text-dim">trx: {{ $dep->transaction_id ?? '-' }}</div>

                            <span class="badge badge-approved mt-1">
                                Approved
                            </span>
                        </div>

                        <div class="text-right text-sm font-extrabold amount-green">
                            ৳ {{ number_format((float) $dep->amount) }}
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো approved ডিপোজিট নেই</div>
                @endforelse

                {{-- Withdraw Approved --}}
                <div class="section-title">উইথড্র</div>

                @forelse($approvedWithdraws as $w)
                    <div class="item">
                        <span class="icon-pill" style="background:#10b981">
                            <i class="fa-solid fa-right-left"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold">Withdraw ({{ strtoupper($w->method) }})</div>
                            <div class="text-xs text-dim">trx: {{ $w->trx_id ?? '-' }}</div>

                            <span class="badge badge-approved mt-1">
                                Approved
                            </span>
                        </div>

                        <div class="text-right text-sm font-extrabold amount-red">
                            ৳ {{ number_format((float) $w->amount) }}
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো approved উইথড্র নেই</div>
                @endforelse

                {{-- Old Running Loans --}}
                <!--<div class="section-title">পুরনো Approved / Running Loans</div>-->

                <!--@forelse($runningLoans as $loan)-->
                <!--    <div class="item">-->
                <!--        <span class="icon-pill" style="background:#10b981">-->
                <!--            <i class="fa-solid fa-hand-holding-dollar"></i>-->
                <!--        </span>-->

                <!--        <div class="min-w-0 flex-1">-->
                <!--            <div class="text-sm font-semibold">Loan #{{ $loan->id }}</div>-->
                <!--            <div class="text-xs text-dim">-->
                <!--                Status:-->
                <!--                {{ strtoupper(str_replace('_',' ', $loan->status)) }},-->
                <!--                Amount:-->
                <!--                ৳ {{ number_format((float) $loan->amount) }}-->
                <!--            </div>-->
                <!--        </div>-->
                <!--    </div>-->
                <!--@empty-->
                <!--    <div class="py-2 text-xs text-dim">কোনো approved পুরনো লোন নেই</div>-->
                <!--@endforelse-->

                {{-- Erin Approved Loans --}}
                <div class="section-title">Approved Loans</div>

                @forelse(($approvedErinLoans ?? collect()) as $loan)
                    @php
                        $plan = $loan->loanPlan;
                        $totalPayable = $loan->total_payable ?? ((int) $loan->monthly_installment * (int) $loan->term_months);
                    @endphp

                    <div class="item">
                        <span class="icon-pill" style="background:#10b981">
                            <i class="fa-solid fa-hand-holding-dollar"></i>
                        </span>

                        <div class="min-w-0 flex-1">
                            <div class="text-sm font-semibold">
                                 Loan #{{ $loan->id }}
                            </div>

                            <div class="meta-line">
                                Approved Amount:
                                ৳ {{ number_format((float) $loan->requested_amount) }}
                            </div>

                            <div class="meta-line">
                                Plan:
                                @if($plan)
                                    {{ $plan->term_months }} মাস / ৳ {{ number_format((float) $plan->amount) }}
                                @else
                                    -
                                @endif
                            </div>

                            <div class="meta-line">
                                Monthly Installment:
                                ৳ {{ number_format((float) $loan->monthly_installment) }}
                            </div>

                            <div class="meta-line">
                                Total Payable:
                                ৳ {{ number_format((float) $totalPayable) }}
                            </div>

                            @if($loan->approved_at)
                                <div class="meta-line">
                                    Approved:
                                    {{ $loan->approved_at->format('d M Y, h:i A') }}
                                </div>
                            @endif

                            @if($loan->disbursed_at)
                                <div class="meta-line">
                                    Balance Added:
                                    {{ $loan->disbursed_at->format('d M Y, h:i A') }}
                                </div>
                            @endif

                            @if((float) $loan->fee_custom > 0)
                                <div class="admin-fee">
                                    <strong>Admin Fee:</strong>
                                    ৳ {{ number_format((float) $loan->fee_custom, 2) }}
                                </div>
                            @endif

                            @if(!empty($loan->message_custom))
                                <div class="admin-message">
                                    <strong>Admin Message:</strong>
                                    {{ $loan->message_custom }}
                                </div>
                            @endif

                            <span class="badge badge-approved mt-2">
                                Approved
                            </span>
                        </div>

                        <div class="text-right text-sm font-extrabold amount-green">
                            ৳ {{ number_format((float) $loan->requested_amount) }}
                        </div>
                    </div>
                @empty
                    <div class="py-2 text-xs text-dim">কোনো approved  loan নেই</div>
                @endforelse

                {{-- Bonuses --}}
                <div class="section-title">Bonuses</div>
                <div class="py-2 text-xs text-dim">কোনো bonus data নেই</div>
            </div>
        </div>
    </div>

    <div class="mt-4 rounded-2xl border border-rose-200 bg-rose-50 px-3 py-3 text-sm text-rose-800">
        <i class="fa-regular fa-bell"></i>
        নোটঃ Admin custom message থাকলে সংশ্লিষ Loan-এর নিচে দেখাবে।
    </div>
</div>
@endsection