@extends('dashboard.index')
@section('title', 'Dashboard')
@section('content')
    <!-- Dashboard Tab -->
    <div class="container">
        <h2 class="mb-4">Bonjour, {{ $user->name }} !</h2> 
        <p class="text-muted">Voici un aperçu rapide de votre compte et de vos activités.</p>

        <div class="row g-4 mb-5">
            <div class="col-md-3">
                <div class="card text-center border-primary">
                    <div class="card-body">
                        <i class="bi bi-bag text-primary display-6 mb-2"></i>
                        <h5 class="card-title">0</h5>
                        <p class="card-text text-muted">Commandes totales</p>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card text-center border-success">
                    <div class="card-body">
                        <i class="bi bi-check-circle text-success display-6 mb-2"></i>
                        <h5 class="card-title">0</h5>
                        <p class="card-text text-muted">Commandes livrées</p>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card text-center border-warning">
                    <div class="card-body">
                        <i class="bi bi-clock text-warning display-6 mb-2"></i>
                        <h5 class="card-title">0</h5>
                        <p class="card-text text-muted">En cours</p>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card text-center border-info">
                    <div class="card-body">
                        <i class="bi bi-heart text-info display-6 mb-2"></i>
                        <h5 class="card-title">0</h5>
                        <p class="card-text text-muted">Favoris</p>
                    </div>
                </div>
            </div>
        </div>

        <!-- Recent Orders -->
        <div class="card shadow-sm">
            <div class="card-header">
                <h5 class="mb-0">Commandes récentes</h5>
            </div>
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>Commande</th>
                                <th>Date</th>
                                <th>Statut</th>
                                <th>Total</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody> 
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection