@extends('super-admin.layout')

@section('title', 'Analytics')

@push('styles')
<style>
    .bar-chart { display: grid; gap: .65rem; margin-top: .75rem; }
    .bar-row { display: grid; grid-template-columns: 100px 1fr 48px; gap: .65rem; align-items: center; font-size: .82rem; }
    .bar-track { background: #F1F5F9; border-radius: 99px; height: 10px; overflow: hidden; }
    .bar-fill { height: 100%; background: var(--primary); border-radius: 99px; }
    .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    @media (max-width: 992px) { .two-col { grid-template-columns: 1fr; } }
</style>
@endpush

@section('content')
<div class="pg-head">
    <div>
        <h1>Platform analytics</h1>
        <p>Cross-event metrics for organisations, usage, revenue, and campus sponsorship.</p>
    </div>
    <a href="{{ route('mexco.super.reports') }}" class="btn-outline">Export reports</a>
</div>

<div class="stat-row">
    <div class="card stat-card"><div class="stat-label">Organisations</div><div class="stat-num">{{ $overview['organisations'] }}</div></div>
    <div class="card stat-card"><div class="stat-label">Events</div><div class="stat-num">{{ $overview['events'] }}</div></div>
    <div class="card stat-card"><div class="stat-label">Participants</div><div class="stat-num">{{ number_format($overview['participants']) }}</div></div>
    <div class="card stat-card"><div class="stat-label">Open support tickets</div><div class="stat-num">{{ $overview['open_tickets'] }}</div></div>
</div>

<div class="two-col">
    <div class="card form-panel">
        <h2>Events by plan</h2>
        @php $maxPlan = max(1, $eventsByPlan->max('total') ?? 1); @endphp
        <div class="bar-chart">
            @forelse($eventsByPlan as $row)
                <div class="bar-row">
                    <span>{{ $row->name }}</span>
                    <div class="bar-track"><div class="bar-fill" style="width:{{ round(($row->total / $maxPlan) * 100) }}%"></div></div>
                    <strong>{{ $row->total }}</strong>
                </div>
            @empty
                <p class="cell-sub">No licensed events yet.</p>
            @endforelse
        </div>
    </div>

    <div class="card form-panel">
        <h2>Revenue (paid invoices)</h2>
        @php $maxRev = max(1, $revenueByMonth->max('total_cents') ?? 1); @endphp
        <div class="bar-chart">
            @forelse($revenueByMonth as $row)
                <div class="bar-row">
                    <span class="mono">{{ $row->month }}</span>
                    <div class="bar-track"><div class="bar-fill" style="width:{{ round(($row->total_cents / $maxRev) * 100) }}%;background:var(--mexco-success)"></div></div>
                    <strong>{{ number_format($row->total_cents / 100, 0) }}</strong>
                </div>
            @empty
                <p class="cell-sub">No paid invoices yet.</p>
            @endforelse
        </div>
    </div>
</div>

<div class="card" style="margin-top:1rem">
    <div class="form-panel" style="padding-bottom:.5rem"><h2 style="margin:0;font-size:1rem">Top events by participants</h2></div>
    <div class="tbl-wrap">
        <table class="data-tbl">
            <thead>
                <tr>
                    <th>Event</th>
                    <th>Organisation</th>
                    <th>Plan</th>
                    <th>Participants</th>
                    <th>Sessions</th>
                    <th>Booths</th>
                </tr>
            </thead>
            <tbody>
                @forelse($topEvents as $usage)
                    <tr>
                        <td>
                            <div class="cell-name">{{ $usage->event?->name ?? $usage->event_id }}</div>
                            <div class="cell-sub mono">{{ $usage->event_id }}</div>
                        </td>
                        <td>{{ $usage->event?->organisation?->name ?? '-' }}</td>
                        <td>{{ $usage->event?->license?->plan?->name ?? '-' }}</td>
                        <td>{{ number_format($usage->participants_count) }}</td>
                        <td>{{ $usage->sessions_count }}</td>
                        <td>{{ $usage->booths_count }}</td>
                    </tr>
                @empty
                    <tr><td colspan="6" class="text-center cell-sub py-4">No usage data yet.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection
