@extends('layouts.admin')
@section('title', 'Produits')
@section('page_title', 'Gestion des produits')

@section('content')
<div class="page-header">
    <h1><i class="fas fa-box"></i> Produits</h1>
    <a href="{{ route('admin.produits.create') }}" class="btn btn-primary">
        <i class="fas fa-plus"></i> Ajouter un produit
    </a>
</div>

@if($produits->count())
<div class="card">
    <div class="table-wrap">
        <table class="admin-table">
            <thead>
                <tr><th>Image</th><th>Nom</th><th>Catégorie</th><th>Prix</th><th>Taille</th><th>Actions</th></tr>
            </thead>
            <tbody>
            @foreach($produits as $p)
            <tr>
                <td>
                    @if($p->image)
                        <img src="{{ asset('storage/'.$p->image) }}" alt="{{ $p->name }}" style="width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--gray-200)">
                    @else
                        <div style="width:56px;height:56px;background:var(--gray-100);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--gray-400);font-size:18px"><i class="fas fa-image"></i></div>
                    @endif
                </td>
                <td><strong style="color:var(--gray-900)">{{ $p->name }}</strong></td>
                <td><span class="badge badge-new" style="text-transform:uppercase">{{ $p->category }}</span></td>
                <td style="font-weight:600;color:var(--green)">{{ $p->price }} TND</td>
                <td style="font-size:12px;color:var(--gray-400)">{{ $p->size ?? '-' }}</td>
                <td>
                    <div style="display:flex;gap:6px;align-items:center">
                        <a href="{{ route('products.show', $p->slug) }}" target="_blank" class="btn btn-outline" style="padding:5px 10px;font-size:11px">
                            <i class="fas fa-eye"></i>
                        </a>
                        <a href="{{ route('admin.produits.edit', $p->id) }}" class="btn btn-gold" style="padding:5px 10px;font-size:11px">
                            <i class="fas fa-edit"></i>
                        </a>
                        <form method="POST" action="{{ route('admin.produits.destroy', $p->id) }}" style="display:inline" onsubmit="return confirm('Supprimer ce produit ?')">
                            @csrf @method('DELETE')
                            <button type="submit" class="btn btn-danger" style="padding:5px 10px;font-size:11px">
                                <i class="fas fa-trash"></i>
                            </button>
                        </form>
                    </div>
                </td>
            </tr>
            @endforeach
            </tbody>
        </table>
    </div>
</div>
@else
<div class="card">
    <div class="empty-state"><i class="fas fa-box-open"></i><p>Aucun produit</p></div>
</div>
@endif
@endsection