@extends('admin.layouts.app')

@push('styles')
    {{-- Se ainda não tiveres colocado o CSS noutro lado, deixa este bloco aqui --}}
@endpush

@section('content')
    <div class="azp-page">

        <div class="azp-page-header">
            <div class="azp-page-title-wrap">
                <div class="azp-page-title">Clubes</div>
                <div class="azp-page-subtitle">
                    Gestão dos clubes, para reserva de campos e stock da loja.
                </div>
            </div>

            <div style="display:flex;align-items:center;gap:10px;">
                <span class="azp-badge-pill">
                    <span style="width:6px;height:6px;border-radius:50%;background:#999;"></span>
                    {{ $clubs->total() }} clubes
                </span>
                <a href="{{ route('admin.clubs.create') }}" class="btn primary">Novo clube</a>
            </div>
        </div>

        @if(session('success'))
            <div class="flash success">
                {{ session('success') }}
            </div>
        @endif

        <div class="azp-card">
            <div class="azp-table-wrap">
                <table class="azp-table">
                    <thead>
                    <tr>
                        <th>Clube</th>
                        <th>Cidade</th>
                        <th>Email</th>
                        <th>Telefone</th>
                        <th>Estado</th>
                        <th style="width: 150px;">Ações</th>
                    </tr>
                    </thead>
                    <tbody>
                    @forelse($clubs as $club)
                        <tr>
                            <td class="azp-table-primary" data-label="Clube">
                                <a href="{{ route('admin.clubs.show', $club) }}" style="color:inherit;text-decoration:none;">
                                    {{ $club->name }}
                                </a>
                            </td>
                            <td data-label="Cidade">{{ $club->city ?: '—' }}</td>
                            <td data-label="Email">{{ $club->email ?: '—' }}</td>
                            <td data-label="Telefone">{{ $club->phone ?: '—' }}</td>
                            <td data-label="Estado">
            <span class="azp-tag">
                <span class="azp-dot {{ $club->is_active ? 'active' : 'inactive' }}"></span>
                {{ $club->is_active ? 'Ativo' : 'Inativo' }}
            </span>
                            </td>
                            <td data-label="Ações">
                                <div class="azp-actions">
                                    <a href="{{ route('admin.clubs.edit', $club) }}" class="btn xs outline">
                                        Editar
                                    </a>
                                    <a href="{{ route('admin.clubs.show', $club) }}" class="btn xs outline">
                                        Ver
                                    </a>

                                    <form action="{{ route('admin.clubs.destroy', $club) }}"
                                          method="POST"
                                          onsubmit="return confirm('Tens a certeza que queres apagar este clube?');">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="btn xs danger">
                                            Apagar
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6">Ainda não existem clubes criados.</td>
                        </tr>
                    @endforelse
                    </tbody>

                </table>
            </div>

            @if($clubs->hasPages())
                <div style="margin-top: 10px;">
                    {{ $clubs->links() }}
                </div>
            @endif
        </div>
    </div>
@endsection