@extends('layouts.admin')

@section('title','Members Management')

@section('content')
<div class="dashboard-header" style="margin-bottom: 24px; display: flex; justify-content: space-between; align-items: center;">
    <div>
        <h1 style="font-family:'Oswald',sans-serif; font-size:2rem; color:var(--primary); margin:0;">Members Management</h1>
    </div>
    <a href="{{ route('admin.members.create') }}" class="btn btn-primary">
        <i class="fas fa-plus"></i> Create Member
    </a>
</div>

<div class="admin-card">
    <div class="admin-card-body" style="padding:0;">
        @if($members->count())
        <div class="table-responsive">
            <table class="admin-table">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Name</th>
                        <th>Email</th>
                        <th>Status</th>
                        <th style="text-align:right;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($members as $member)
                    <tr>
                        <td>{{ $member->id }}</td>
                        <td>{{ $member->first_name }} {{ $member->last_name }}</td>
                        <td>{{ $member->email }}</td>
                        <td>
                            @if($member->status === 'approved')
                                <span class="badge badge-success">Approved</span>
                            @elseif($member->status === 'pending')
                                <span class="badge badge-warning">Pending</span>
                            @else
                                <span class="badge badge-info">{{ ucfirst($member->status) }}</span>
                            @endif
                        </td>
                        <td style="text-align:right;">
                            <a href="{{ route('admin.members.show', $member->id) }}" class="btn btn-outline btn-sm">
                                <i class="fas fa-eye"></i>
                            </a>
                            <a href="{{ route('admin.members.edit', $member->id) }}" class="btn btn-primary btn-sm">
                                <i class="fas fa-edit"></i>
                            </a>
                        </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        <div style="padding: 20px;">
            {{ $members->links() }}
        </div>
        @else
        <div style="padding: 40px; text-align: center; color: var(--text-muted);">
            <i class="fas fa-users" style="font-size: 3rem; opacity: 0.5; margin-bottom: 16px;"></i>
            <p>No members found.</p>
        </div>
        @endif
    </div>
</div>
@endsection
