@extends('admin.layout')

@section('title', 'Tableau de bord')

@section('content')
<h1>Tableau de bord</h1>
<p class="muted">Vue d'ensemble du contenu et des demandes de contact.</p>

<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:28px;">
    <div class="card">
        <div style="font-size:13px;color:#5f6b76;margin-bottom:4px;">Articles blog</div>
        <div style="font-family:Syne,sans-serif;font-size:28px;font-weight:700;">{{ $blogCount }}</div>
    </div>
    <div class="card">
        <div style="font-size:13px;color:#5f6b76;margin-bottom:4px;">Guides</div>
        <div style="font-family:Syne,sans-serif;font-size:28px;font-weight:700;">{{ $guideCount }}</div>
    </div>
    <div class="card">
        <div style="font-size:13px;color:#5f6b76;margin-bottom:4px;">Actualites</div>
        <div style="font-family:Syne,sans-serif;font-size:28px;font-weight:700;">{{ $newsCount }}</div>
    </div>
    <div class="card">
        <div style="font-size:13px;color:#5f6b76;margin-bottom:4px;">Secteurs</div>
        <div style="font-family:Syne,sans-serif;font-size:28px;font-weight:700;">{{ $sectorCount }}</div>
        <a href="{{ route('admin.secteurs.index') }}" style="font-size:13px;margin-top:8px;display:inline-block;">Gerer →</a>
    </div>
    <div class="card">
        <div style="font-size:13px;color:#5f6b76;margin-bottom:4px;">Messages non lus</div>
        <div style="font-family:Syne,sans-serif;font-size:28px;font-weight:700;">{{ $messagesUnread }}</div>
    </div>
    <div class="card">
        <div style="font-size:13px;color:#5f6b76;margin-bottom:4px;">Temoignages</div>
        <div style="font-family:Syne,sans-serif;font-size:28px;font-weight:700;">{{ $testimonialCount }}</div>
        <a href="{{ route('admin.testimonials.index') }}" style="font-size:13px;margin-top:8px;display:inline-block;">Gerer →</a>
    </div>
</div>

<div class="card">
    <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:10px;">
        <h2 style="font-family:Syne,sans-serif;font-size:20px;">Derniers messages</h2>
        <a href="{{ route('admin.contact-messages.index') }}">Tout voir →</a>
    </div>
    @if($latestMessages->isEmpty())
    <p class="muted" style="margin:0;">Aucun message pour le moment.</p>
    @else
    <table>
        <thead>
            <tr>
                <th>Date</th>
                <th>Nom</th>
                <th>Besoin</th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            @foreach($latestMessages as $msg)
            <tr>
                <td>{{ $msg->created_at->format('d/m/Y H:i') }}</td>
                <td>{{ $msg->name }}</td>
                <td><span class="pill">{{ $msg->besoin }}</span></td>
                <td><a href="{{ route('admin.contact-messages.show', $msg) }}">Ouvrir</a></td>
            </tr>
            @endforeach
        </tbody>
    </table>
    @endif
</div>
@endsection