@extends('admin.layouts.dashboard')

@section('title', 'Members')

@section('content')
    @php
        $members = [
            ['id' => 'MEM-001', 'name' => 'Kasun Perera', 'email' => 'kasun@example.com', 'plan' => 'Annual', 'joined' => 'Feb 20, 2026', 'status' => 'Active'],
            ['id' => 'MEM-002', 'name' => 'Amara Silva', 'email' => 'amara@example.com', 'plan' => '6 Month', 'joined' => 'Feb 19, 2026', 'status' => 'Active'],
            ['id' => 'MEM-003', 'name' => 'Nimali Fernando', 'email' => 'nimali@example.com', 'plan' => '1 Month', 'joined' => 'Feb 19, 2026', 'status' => 'Inactive'],
            ['id' => 'MEM-004', 'name' => 'Dinesh Kumar', 'email' => 'dinesh@example.com', 'plan' => 'Annual', 'joined' => 'Feb 18, 2026', 'status' => 'Active'],
        ];
    @endphp

    <div class="space-y-6">
        <div class="flex justify-between items-center"><div><h1 class="text-2xl font-bold text-white">Members</h1><p class="text-gray-400 text-sm mt-1">Manage all registered members.</p></div><button class="flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg text-sm font-medium"><i data-lucide="download" class="w-4 h-4"></i>Export CSV</button></div>
        <div class="bg-[#1e293b] rounded-xl border border-gray-800 overflow-hidden"><div class="overflow-x-auto"><table class="w-full text-sm text-left"><thead class="text-xs text-gray-500 uppercase bg-[#0f172a]"><tr><th class="px-5 py-3">Member ID</th><th class="px-5 py-3">Name</th><th class="px-5 py-3">Plan</th><th class="px-5 py-3">Joined Date</th><th class="px-5 py-3">Status</th><th class="px-5 py-3 text-right">Actions</th></tr></thead><tbody class="divide-y divide-gray-800">@foreach($members as $member)<tr class="hover:bg-gray-800/50"><td class="px-5 py-4 text-gray-400 font-mono text-xs">{{ $member['id'] }}</td><td class="px-5 py-4"><div class="font-medium text-white">{{ $member['name'] }}</div><div class="text-xs text-gray-500">{{ $member['email'] }}</div></td><td class="px-5 py-4"><span class="px-2 py-1 rounded text-xs font-medium {{ $member['plan'] === 'Annual' ? 'bg-purple-500/10 text-purple-400' : ($member['plan'] === '6 Month' ? 'bg-blue-500/10 text-blue-400' : 'bg-gray-500/10 text-gray-400') }}">{{ $member['plan'] }}</span></td><td class="px-5 py-4 text-gray-400">{{ $member['joined'] }}</td><td class="px-5 py-4"><span class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium {{ $member['status'] === 'Active' ? 'bg-green-500/10 text-green-400' : 'bg-gray-500/10 text-gray-400' }}">{{ $member['status'] }}</span></td><td class="px-5 py-4 text-right"><div class="flex justify-end gap-2"><button class="p-1 text-gray-400 hover:text-white"><i data-lucide="eye" class="w-4 h-4"></i></button><button class="p-1 text-gray-400 hover:text-blue-400"><i data-lucide="edit" class="w-4 h-4"></i></button><button class="p-1 text-gray-400 hover:text-red-400"><i data-lucide="trash-2" class="w-4 h-4"></i></button></div></td></tr>@endforeach</tbody></table></div></div>
    </div>
@endsection