@extends('layouts.app')

@section('title', 'Categories')

@section('content')
<div class="container">
    <div class="page-heading">
        <div>
            <div class="eyebrow">Menu Organization</div>
            <h1>Categories</h1>
            <p>Organize food, drinks, desserts and other restaurant menu sections.</p>
        </div>

        <a class="btn btn-primary" href="{{ route('dashboard.categories.create') }}">
            + Add Category
        </a>
    </div>

    <div class="card table-card">
        <div class="table-wrapper">
            <table>
                <thead>
                    <tr>
                        <th>Category</th>
                        <th>Order</th>
                        <th>Status</th>
                        <th>Actions</th>
                    </tr>
                </thead>

                <tbody>
                    @forelse($categories as $category)
                        <tr>
                            <td>
                                <strong>{{ $category->name }}</strong>
                            </td>

                            <td>{{ $category->sort_order }}</td>

                            <td>
                                @if($category->is_active)
                                    <span class="badge">Active</span>
                                @else
                                    <span class="badge badge-warning">Hidden</span>
                                @endif
                            </td>

                            <td>
                                <div class="table-actions">
                                    <a
                                        class="btn btn-light btn-sm"
                                        href="{{ route('dashboard.categories.edit', $category) }}"
                                    >
                                        Edit
                                    </a>

                                    <form
                                        method="POST"
                                        action="{{ route('dashboard.categories.destroy', $category) }}"
                                        onsubmit="return confirm('Delete this category?')"
                                    >
                                        @csrf
                                        @method('DELETE')

                                        <button class="btn btn-danger btn-sm">
                                            Delete
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="4">
                                No categories yet.
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection