@extends('layouts.app')

@section('title', 'Adhérents | EasyMutuelle')
@section('page_title', 'Adhérents')

@section('content')
<div class="card-surface rounded-2xl p-6">
    <div class="mb-6 flex items-center justify-between">
        <div>
            <h2 class="text-2xl font-bold text-slate-900">Adhérents</h2>
            <p class="mt-1 text-sm text-slate-500">Liste des membres enregistrés dans la mutuelle.</p>
        </div>
        @if(auth()->user()->hasRole('secretary'))<a href="{{ route('members.create') }}" class="btn-primary">+ Nouvel adhérent</a>@endif
    </div>

    <div class="overflow-hidden rounded-xl border border-slate-200">
        <table class="min-w-full text-left text-sm">
            <thead class="bg-slate-100 text-slate-600">
                <tr>
                    <th class="px-4 py-3 font-semibold">Code</th>
                    <th class="px-4 py-3 font-semibold">Nom</th>
                    <th class="px-4 py-3 font-semibold">Téléphone</th>
                    <th class="px-4 py-3 font-semibold">Statut</th>
                    <th class="px-4 py-3 font-semibold">Action</th>
                </tr>
            </thead>
            <tbody>
                @forelse($members as $member)
                    <tr class="border-t border-slate-200 bg-white">
                        <td class="px-4 py-3 font-medium text-slate-700">{{ $member->code }}</td>
                        <td class="px-4 py-3 text-slate-800">{{ $member->fullName() }}</td>
                        <td class="px-4 py-3 text-slate-600">{{ $member->phone }}</td>
                        <td class="px-4 py-3"><span class="badge-success">{{ $member->status }}</span></td>
                        <td class="px-4 py-3">
                            <a href="{{ route('members.show', $member) }}" class="text-[#0f4c5c] font-medium hover:underline">Détails</a>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="5" class="px-4 py-6 text-center text-slate-500">Aucun adhérent disponible.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection