@include('partials.staff_navbar')

<div class="container my-5">
    <div class="row mb-4">
        <div class="col-12">
            <span class="text-uppercase text-primary fw-bold font-monospace tracking-wider" style="font-size: 11px;">
                Internal Management Dashboard
            </span>
            <h2 class="fw-bold text-dark mt-1">Welcome back, {{ $staff->accountDetails->fullname ?? $staff->username }}</h2>
            <p class="text-muted mb-0">
                Assigned Unit Classification: <strong class="text-dark">{{ $staff->accountDetails->designation->designations ?? 'Assigned Professional Agent' }}</strong>
            </p>
            <hr class="opacity-25 my-4">
        </div>
    </div>

    <div class="row g-4 mb-5">
        <div class="col-md-4">
            <div class="card border-0 shadow-sm bg-white p-4 rounded-3 border-start border-primary border-4 h-100 position-relative">
                <div class="text-muted small fw-bold text-uppercase font-monospace tracking-wider">Pending Registrations</div>
                <div class="fs-1 fw-bold text-dark my-2 tracking-tight">{{ $pendingRegistrationsCount }}</div>
                <p class="text-muted small mb-3">Applications waiting for profile documentation reviews and operational audit screenings.</p>
                <a href="/staff/registrations" class="small text-decoration-none fw-semibold text-primary stretched-link">
                    Open Review Queue <i class="fa fa-arrow-right ms-1" style="font-size: 11px;"></i>
                </a>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card border-0 shadow-sm bg-white p-4 rounded-3 border-start border-warning border-4 h-100 position-relative">
                <div class="text-muted small fw-bold text-uppercase font-monospace tracking-wider">Open Complaints</div>
                <div class="fs-1 fw-bold text-dark my-2 tracking-tight">{{ $openComplaintsCount }}</div>
                <p class="text-muted small mb-3">Active legal dispute tracking files submitted by data subjects requiring active verification.</p>
                <a href="#" class="small text-decoration-none fw-semibold text-warning stretched-link">
                    Investigate Cases <i class="fa fa-arrow-right ms-1" style="font-size: 11px;"></i>
                </a>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card border-0 shadow-sm bg-white p-4 rounded-3 border-start border-danger border-4 h-100 position-relative">
                <div class="text-muted small fw-bold text-uppercase font-monospace tracking-wider">Active Breaches</div>
                <div class="fs-1 fw-bold text-dark my-2 tracking-tight">{{ $activeBreachesCount }}</div>
                <p class="text-muted small mb-3">System-wide mandatory data spill leaks reported by handlers under corporate compliance laws.</p>
                <a href="#" class="small text-decoration-none fw-semibold text-danger stretched-link">
                    Inspect Breach Logs <i class="fa fa-arrow-right ms-1" style="font-size: 11px;"></i>
                </a>
            </div>
        </div>
    </div>

    <div class="row g-4 mb-5">
        <div class="col-lg-5">
            <div class="card border-0 shadow-sm rounded-3 p-4 bg-white h-100">
                <h5 class="fw-bold text-dark mb-1">Handler Class Distribution</h5>
                <p class="text-muted small mb-4">Total operations active by system assignment legal class boundaries.</p>
                
                <div class="d-flex flex-column gap-3">
                    <div class="p-3 rounded-3 bg-light border border-start border-3 border-dark d-flex justify-content-between align-items-center">
                        <div>
                            <span class="fw-bold text-dark d-block">Public / Statutory</span>
                            <small class="text-muted font-monospace">Government Entities</small>
                        </div>
                        <span class="badge bg-dark rounded-pill fs-6 px-3">{{ $publicStatutoryCount }}</span>
                    </div>

                    <div class="p-3 rounded-3 bg-light border border-start border-3 border-info d-flex justify-content-between align-items-center">
                        <div>
                            <span class="fw-bold text-dark d-block">Private / Commercial</span>
                            <small class="text-muted font-monospace">Institutions & Retail</small>
                        </div>
                        <span class="badge bg-info text-dark rounded-pill fs-6 px-3">{{ $privateCommercialCount }}</span>
                    </div>

                    <div class="p-3 rounded-3 bg-light border border-start border-3 border-secondary d-flex justify-content-between align-items-center">
                        <div>
                            <span class="fw-bold text-dark d-block">NGOs / Non-Profits</span>
                            <small class="text-muted font-monospace">Charities & Civil Units</small>
                        </div>
                        <span class="badge bg-secondary rounded-pill fs-6 px-3">{{ $ngoCount }}</span>
                    </div>
                </div>

                <div class="row g-3 mt-2 pt-2 border-top border-light text-center">
                    <div class="col-4">
                        <small class="text-muted d-block uppercase font-monospace small" style="font-size: 10px;">DATA CONTROLLERS</small>
                        <span class="fs-4 fw-bold text-dark">{{ $dataControllersCount }}</span>
                    </div>
                    <div class="col-4">
                        <small class="text-muted d-block uppercase font-monospace small" style="font-size: 10px;">DATA PROCESSORS</small>
                        <span class="fs-4 fw-bold text-dark">{{ $dataProcessorsCount }}</span>
                    </div>
                    <div class="col-4">
                        <small class="text-muted d-block uppercase font-monospace small" style="font-size: 10px;">BOTH</small>
                        <span class="fs-4 fw-bold text-dark">{{ $dataProcessorandController }}</span>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-7">
            <div class="card border-0 shadow-sm rounded-3 p-4 bg-white h-100">
                <div class="d-flex justify-content-between align-items-center mb-1">
                    <h5 class="fw-bold text-dark mb-0">Weekly Revenue Inflow Ledger</h5>
                    <span class="badge bg-success-subtle text-success border border-success border-opacity-25 px-2 py-1 small rounded-2 font-monospace">
                        Current Week
                    </span>
                </div>
                <p class="text-muted small mb-4">Chronological presentation of auditing filing invoices processed and resolved this week.</p>

                <div class="table-responsive">
                    <table class="table table-hover align-middle mb-0">
                        <thead class="table-light text-uppercase font-monospace small text-muted" style="font-size: 11px;">
                            <tr>
                                <th class="border-0">Organization Name</th>
                                <th class="border-0">Service / Role</th>
                                <th class="border-0">Reference Code</th>
                                <th class="border-0 text-end">Amount Paid</th>
                                <th class="border-0 text-end">Settlement Timeline</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($weeklyPayments as $payment)
                                <tr>
                                    <td class="fw-bold text-dark">
                                        <div>{{ $payment->org_legal_name ?? $payment->rep_institution ?? 'N/A' }}</div>
                                        @if($payment->sector)
                                            <span class="text-muted font-monospace d-block text-capitalize" style="font-size: 11px;">
                                                <i class="fa fa-folder-open me-1 opacity-50"></i>{{ $payment->sector }}
                                            </span>
                                        @endif
                                    </td>

                                    <td>
                                        @if($payment->data_handler_role === 'both')
                                            <span style="color: black; background-color: white;" class="badge bg-purple-subtle text-purple border border-purple border-opacity-25 px-2 py-1 rounded small text-capitalize">
                                                Controller & Processor
                                            </span>
                                        @elseif($payment->data_handler_role === 'controller')
                                            <span class="badge bg-primary-subtle text-primary border border-primary border-opacity-25 px-2 py-1 rounded small text-capitalize">
                                                Data Controller
                                            </span>
                                        @elseif($payment->data_handler_role === 'processor')
                                            <span class="badge bg-info-subtle text-info border border-info border-opacity-25 px-2 py-1 rounded small text-capitalize">
                                                Data Processor
                                            </span>
                                        @else
                                            <span class="badge bg-light text-muted border px-2 py-1 rounded small">
                                                Not Specified
                                            </span>
                                        @endif
                                    </td>

                                    <td>
                                        <span class="font-monospace text-secondary bg-light border px-2 py-1 rounded small">
                                            {{ $payment->resume_code }}
                                        </span>
                                    </td>

                                    <td class="text-end fw-bold text-success font-monospace">
                                        ${{ number_format($payment->invoice_amount, 2) }}
                                    </td>

                                    <td class="text-end text-muted small">
                                        {{ optional($payment->payment_date)->format('M d, Y') ?? $payment->updated_at->format('M d, g:i A') }}
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="5" class="text-center text-muted py-5 my-3">
                                        <div class="p-3">
                                            <i class="fa fa-receipt d-block text-muted opacity-25 mb-2 fs-2"></i>
                                            <span class="small d-block fw-semibold text-secondary">No payments processed during this fiscal workweek period.</span>
                                        </div>
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

@include('partials.footer')