@extends('layouts.tropa', ['title' => 'Tropa do FiniN | Admin', 'page' => 'admin'])

@section('content')
    <main class="screen screen-admin">
        <section class="home-hero admin-hero">
            <div class="home-brand admin-brand">
                <img src="{{ asset('images/tropa-do-finin-logo.png') }}" alt="Logo Tropa do FiniN">
                <div>
                    <span class="eyebrow">Area do admin</span>
                    <h1>Painel da pelada</h1>
                    <p id="admin-subtitle">
                        Acompanhe os peladeiros cadastrados e organize os grupos da tropa.
                    </p>
                </div>
            </div>

            <div class="hero-actions">
                <a href="{{ route('admin.grupos') }}" class="primary-button">Gerenciar grupos</a>
                <a href="{{ route('landing') }}" class="secondary-button">Entrada</a>
                <a href="{{ route('home') }}" class="ghost-link">Area dos peladeiros</a>
                <form method="POST" action="{{ route('logout') }}" class="logout-form">
                    @csrf
                    <button type="submit" class="ghost-button">Sair</button>
                </form>
            </div>
        </section>

        <section class="admin-overview">
            <article class="dashboard-card stat-card">
                <span class="card-label">Peladeiros</span>
                <strong>{{ $totalPeladeiros }}</strong>
                <p>Total de jogadores cadastrados no banco.</p>
            </article>

            <article class="dashboard-card stat-card">
                <span class="card-label">Autoavaliacao</span>
                <strong>{{ $mediaGeralAutoavaliacao === null ? 'Sem nota' : number_format($mediaGeralAutoavaliacao, 1, ',', '.') }}</strong>
                <p>Media geral das notas que a tropa se deu.</p>
            </article>
        </section>

        <section class="dashboard-card admin-panel admin-panel-wide">
            <div class="card-heading">
                <div>
                    <span class="card-label">Peladeiros</span>
                    <h2>Notas medias em estrelas</h2>
                </div>
            </div>

            @if ($peladeiros->isEmpty())
                <div class="admin-empty">Nenhum peladeiro cadastrado ainda.</div>
            @else
                <div class="peladeiro-card-grid">
                    @foreach ($peladeiros as $peladeiro)
                        @php
                            $media = $peladeiro->mediaAutoavaliacao();
                            $estrelasCheias = $media === null ? 0 : (int) round($media);
                            $posicaoPrincipal = $peladeiro->posicoes_preferidas[0] ?? 'Sem posicao definida';
                        @endphp

                        <article class="peladeiro-card">
                            <div class="admin-player-cell">
                                <span
                                    class="avatar-preview admin-avatar"
                                    @if ($peladeiro->foto) style="background-image: url('{{ $peladeiro->foto }}')" @endif
                                >
                                    @unless ($peladeiro->foto)
                                        {{ collect(explode(' ', trim($peladeiro->nome)))->filter()->take(2)->map(function ($parte) { return strtoupper(substr($parte, 0, 1)); })->implode('') ?: 'TF' }}
                                    @endunless
                                </span>

                                <div>
                                    <strong>{{ $peladeiro->nome }}</strong>
                                    <span>{{ $posicaoPrincipal }}</span>
                                </div>
                            </div>

                            <div class="star-rating" aria-label="{{ $media === null ? 'Sem nota' : 'Media '.$media.' de 5' }}">
                                @for ($estrela = 1; $estrela <= 5; $estrela++)
                                    <span class="{{ $estrela <= $estrelasCheias ? 'is-filled' : '' }}">&#9733;</span>
                                @endfor
                            </div>

                            <span class="score-note">
                                {{ $media === null ? 'Sem nota' : number_format($media, 1, ',', '.').'/5' }}
                            </span>
                        </article>
                    @endforeach
                </div>
            @endif
        </section>
    </main>
@endsection