@extends('layouts.app')
@section('title', 'Subscriber analytics')

@section('content')
    <div class="page-head">
        <div><h1>Subscriber analytics</h1><p>{{ $from->format('d M Y') }} – {{ $to->format('d M Y') }}</p></div>
        <div class="page-actions">
            <a href="{{ route('reports.export', ['report' => 'churn', 'from' => $from->toDateString(), 'to' => $to->toDateString()]) }}" class="btn secondary">Export churn CSV</a>
        </div>
    </div>

    <div class="grid grid-6 mb-2">
        @include('components.kpi', ['label' => 'Active subscribers', 'value' => number_format($summary['active']), 'variant' => 'good', 'href' => '#'])
        @include('components.kpi', ['label' => 'New this period', 'value' => number_format($summary['new']), 'variant' => 'info', 'href' => '#'])
        @include('components.kpi', ['label' => 'Churned', 'value' => number_format($summary['churned']), 'variant' => 'bad', 'href' => '#'])
        @include('components.kpi', ['label' => 'Churn rate', 'value' => percent($summary['churn_rate']),
            'variant' => $summary['churn_rate'] < 3 ? 'good' : 'warn', 'href' => '#'])
        @include('components.kpi', ['label' => 'Net growth', 'value' => number_format($summary['net_growth']),
            'variant' => $summary['net_growth'] >= 0 ? 'good' : 'bad', 'href' => '#'])
        @include('components.kpi', ['label' => 'Suspended', 'value' => number_format($summary['suspended']), 'variant' => 'warn', 'href' => '#'])
    </div>

    <div class="grid grid-2">
        <div class="card">
            <div class="card-head"><h3>Subscriber growth</h3></div>
            <div class="card-body">
                @include('components.chart', [
                    'series' => collect($growth)->map(fn ($g) => [
                        'label' => \Carbon\Carbon::parse($g['month'])->format('M y'),
                        'value' => $g['active'],
                    ])->all(),
                    'type' => 'line', 'format' => 'number', 'height' => 210,
                ])
            </div>
        </div>

        <div class="card">
            <div class="card-head"><h3>New vs churned</h3></div>
            <div class="card-body">
                @include('components.chart', [
                    'series' => collect($growth)->map(fn ($g) => [
                        'label' => \Carbon\Carbon::parse($g['month'])->format('M y'),
                        'value' => $g['new'],
                    ])->all(),
                    'type' => 'bar', 'format' => 'number', 'height' => 210,
                ])
            </div>
        </div>
    </div>

    <div class="grid grid-2">
        <div class="card">
            <div class="card-head"><h3>Plan mix</h3></div>
            <div class="card-body">
                @php $maxSubs = collect($planMix)->max('subscribers') ?: 1; @endphp
                @forelse ($planMix as $plan)
                    <div class="bar-row">
                        <span class="bar-label">{{ $plan['plan'] }}</span>
                        <span class="bar-track">
                            <span class="bar-fill" style="width: {{ ($plan['subscribers'] / $maxSubs) * 100 }}%"></span>
                        </span>
                        <span class="bar-value">{{ $plan['subscribers'] }}</span>
                    </div>
                @empty
                    <p class="small muted">No active subscriptions.</p>
                @endforelse
            </div>
        </div>

        <div class="card">
            <div class="card-head"><h3>Churn reasons</h3></div>
            <div class="card-body">
                @php $maxChurn = collect($churnReasons)->max('total') ?: 1; @endphp
                @forelse ($churnReasons as $reason)
                    <div class="bar-row">
                        <span class="bar-label">{{ $reason['reason'] }}</span>
                        <span class="bar-track">
                            <span class="bar-fill danger" style="width: {{ ($reason['total'] / $maxChurn) * 100 }}%"></span>
                        </span>
                        <span class="bar-value">{{ $reason['total'] }}</span>
                    </div>
                @empty
                    <p class="small muted">No churn recorded in this period.</p>
                @endforelse
            </div>
        </div>
    </div>

    <div class="card">
        <div class="card-head"><h3>Segment performance</h3></div>
        <div class="card-body tight">
            <div class="table-wrap">
                <table class="data">
                    <thead><tr><th>Segment</th><th class="num">Subscribers</th><th class="num">MRR</th><th class="num">ARPU</th><th class="num">Churn</th></tr></thead>
                    <tbody>
                    @forelse ($segments as $segment)
                        <tr>
                            <td class="strong">{{ title_case_words($segment['segment']) }}</td>
                            <td class="num">{{ number_format($segment['subscribers']) }}</td>
                            <td class="num">{{ money($segment['mrr']) }}</td>
                            <td class="num">{{ money($segment['arpu']) }}</td>
                            <td class="num">{{ percent($segment['churn_rate']) }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="5">@include('components.empty-state', ['icon' => '&#128101;', 'title' => 'No segment data'])</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection