@extends('layouts.app')
@section('title', 'Superadmin Dashboard')

@section('content')
<div class="p-6 lg:p-8 max-w-6xl mx-auto">

    <div class="mb-8">
        <h1 class="text-2xl font-bold text-slate-900">Platform Overview</h1>
        <p class="text-slate-500 text-sm mt-1">Ringkasan semua tenant dan penggunaan ResiCam / All tenants and platform usage</p>
    </div>

    {{-- Stat cards --}}
    <div class="grid grid-cols-2 lg:grid-cols-4 gap-4 mb-8">
        @php
        $cards = [
            ['label'=>'Total Tenant','label_en'=>'Total Tenants','value'=>$stats['total_tenants'],'ic_path'=>'M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4','color'=>'blue'],
            ['label'=>'Tenant Aktif','label_en'=>'Active Tenants','value'=>$stats['active_tenants'],'ic_path'=>'M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z','color'=>'green'],
            ['label'=>'Total Video','label_en'=>'Total Videos','value'=>number_format($stats['total_videos']),'ic_path'=>'M15 10l4.553-2.069A1 1 0 0121 8.882v6.236a1 1 0 01-1.447.894L15 14M4 8h11v8H4a2 2 0 01-2-2v-4a2 2 0 012-2z','color'=>'violet'],
            ['label'=>'Total Pengguna','label_en'=>'Total Users','value'=>$stats['total_users'],'ic_path'=>'M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z','color'=>'orange'],
        ];
        $cls = [
            'blue'   => ['bg-blue-50','bg-blue-100 text-blue-600','text-blue-700'],
            'green'  => ['bg-green-50','bg-green-100 text-green-600','text-green-700'],
            'violet' => ['bg-violet-50','bg-violet-100 text-violet-600','text-violet-700'],
            'orange' => ['bg-orange-50','bg-orange-100 text-orange-600','text-orange-700'],
        ];
        @endphp
        @foreach($cards as $c)
        @php [$bg,$ic,$val] = $cls[$c['color']]; @endphp
        <div class="bg-white border border-slate-100 rounded-2xl p-5 shadow-sm hover:shadow-md transition">
            <div class="w-10 h-10 {{ $ic }} rounded-xl flex items-center justify-center mb-4">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="{{ $c['ic_path'] }}"/></svg>
            </div>
            <div class="text-2xl font-bold {{ $val }} mb-1">{{ $c['value'] }}</div>
            <div class="text-sm font-medium text-slate-700">{{ $c['label'] }}</div>
            <div class="text-xs text-slate-400">{{ $c['label_en'] }}</div>
        </div>
        @endforeach
    </div>

    {{-- Plan distribution --}}
    <div class="bg-white border border-slate-100 rounded-2xl shadow-sm p-6 mb-6">
        <h2 class="text-base font-semibold text-slate-900 mb-5">Distribusi Paket / Plan Distribution</h2>
        <div class="grid grid-cols-2 lg:grid-cols-4 gap-4">
            @foreach(config('plans') as $key => $plan)
            @php $count = $stats['tenants_by_plan'][$key] ?? 0; @endphp
            <div class="bg-slate-50 border border-slate-100 rounded-xl p-4">
                <div class="text-3xl font-bold text-blue-600 mb-1">{{ $count }}</div>
                <div class="text-sm font-semibold text-slate-700">{{ explode(' ', $plan['label'])[0] }}</div>
                <div class="text-xs text-slate-400 mt-0.5">{{ strtoupper($key) }}</div>
            </div>
            @endforeach
        </div>
    </div>

    {{-- Actions --}}
    <div class="flex flex-wrap gap-3">
        <a href="{{ route('superadmin.tenants.index') }}"
           class="inline-flex items-center gap-2 bg-blue-600 hover:bg-blue-700 text-white font-semibold px-5 py-2.5 rounded-xl transition text-sm shadow-sm shadow-blue-200">
            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5"/></svg>
            Kelola Semua Tenant
        </a>
        <a href="{{ route('superadmin.tenants.create') }}"
           class="inline-flex items-center gap-2 bg-white border border-slate-200 hover:border-blue-300 text-slate-700 font-semibold px-5 py-2.5 rounded-xl transition text-sm hover:bg-blue-50">
            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
            Buat Tenant Baru
        </a>
    </div>
</div>
@endsection