@extends('layouts.admin')
@section('title', 'Catégories')
@section('page_title', 'Gestion des catégories')

@section('content')
<div class="page-header">
    <h1><i class="fas fa-tags"></i> Catégories</h1>
</div>

<div class="card" style="max-width:700px">
    <div class="card-title"><i class="fas fa-info-circle"></i> Catégories existantes</div>

    @if($categories->count())
    <div class="table-wrap">
        <table class="admin-table">
            <thead>
                <tr><th>Catégorie</th><th>Produits</th><th>Renommer</th><th>Action</th></tr>
            </thead>
            <tbody>
            @foreach($categories as $cat)
            <tr>
                <td>
                    <span class="badge badge-new" style="text-transform:uppercase;font-size:11px">
                        {{ $cat->category }}
                    </span>
                </td>
                <td>
                    <a href="{{ route('admin.produits.index') }}" style="color:var(--green);font-weight:600">
                        {{ $cat->total }} produit(s)
                    </a>
                </td>
                <td>
                    <form method="POST" action="{{ route('admin.categories.rename', $cat->category) }}" style="display:flex;gap:8px;align-items:center">
                        @csrf @method('PUT')
                        <input type="text" name="new_name" value="{{ $cat->category }}"
                               class="form-control" style="width:140px;padding:6px 10px;font-size:12px"
                               required>
                        <button type="submit" class="btn btn-primary" style="padding:6px 12px;font-size:11px">
                            <i class="fas fa-save"></i>
                        </button>
                    </form>
                </td>
                <td>
                    @if($cat->total == 0)
                    <form method="POST" action="{{ route('admin.categories.destroy', $cat->category) }}"
                          onsubmit="return confirm('Supprimer cette catégorie ?')">
                        @csrf @method('DELETE')
                        <button type="submit" class="btn btn-danger" style="padding:6px 10px;font-size:11px">
                            <i class="fas fa-trash"></i>
                        </button>
                    </form>
                    @else
                    <span style="font-size:11px;color:var(--gray-400)">Non vide</span>
                    @endif
                </td>
            </tr>
            @endforeach
            </tbody>
        </table>
    </div>
    @else
    <div class="empty-state"><i class="fas fa-tags"></i><p>Aucune catégorie</p></div>
    @endif
</div>

<div class="card" style="max-width:700px;margin-top:20px">
    <div class="card-title"><i class="fas fa-lightbulb"></i> Comment ajouter une catégorie ?</div>
    <p style="font-size:13px;color:var(--gray-600);line-height:1.7">
        Les catégories sont créées automatiquement lors de l'ajout d'un produit.
        Pour ajouter une nouvelle catégorie, allez dans
        <a href="{{ route('admin.produits.create') }}" style="color:var(--green);font-weight:600">
            Produits → Ajouter
        </a>
        et saisissez le nom de la nouvelle catégorie dans le champ correspondant.
    </p>
</div>
@endsection