@extends('layouts.app')
@section('title', 'Menu Groups')
@section('content')
<div class="d-flex justify-content-between mb-3">
    <h4>Menu Groups (Sub-Menus)</h4>
    <div>
        <a href="{{ route('admin.categories.index') }}" class="btn btn-outline-dark btn-sm">Categories</a>
        <button class="btn btn-dark btn-sm" data-bs-toggle="modal" data-bs-target="#addGroup">+ Add Menu Group</button>
    </div>
</div>

<table class="table bg-white">
    <thead><tr><th>Name</th><th>Categories</th><th>Customer QR Ordering</th><th></th></tr></thead>
    <tbody>
    @foreach ($menuGroups as $g)
    <tr>
        <td>{{ $g->name }}</td>
        <td>{{ $g->categories_count }}</td>
        <td>
            <form method="POST" action="{{ route('admin.menu-groups.update', $g) }}">
                @csrf @method('PUT')
                <input type="hidden" name="is_public_orderable" value="{{ $g->is_public_orderable ? 0 : 1 }}">
                <button class="btn btn-sm {{ $g->is_public_orderable ? 'btn-outline-success' : 'btn-outline-danger' }}">
                    {{ $g->is_public_orderable ? 'Allowed' : 'Blocked (age-restricted)' }}
                </button>
            </form>
        </td>
        <td>
            <form method="POST" action="{{ route('admin.menu-groups.destroy', $g) }}" onsubmit="return confirm('Delete this menu group?')">
                @csrf @method('DELETE')
                <button class="btn btn-sm btn-outline-danger">Delete</button>
            </form>
        </td>
    </tr>
    @endforeach
    </tbody>
</table>

<div class="alert alert-warning small">
    <strong>Customer QR Ordering</strong> controls whether items under this group can be self-ordered by
    customers scanning a table QR code. Keep alcohol, hookah, or anything age-restricted set to
    <strong>Blocked</strong> — staff can still add these items normally through the regular POS screen.
</div>

<div class="modal fade" id="addGroup" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <form method="POST" action="{{ route('admin.menu-groups.store') }}">
                @csrf
                <div class="modal-header"><h5>Add Menu Group</h5></div>
                <div class="modal-body">
                    <div class="mb-2"><label class="form-label">Name</label><input name="name" class="form-control" placeholder="e.g. Cafe Menu, Bar Menu" required></div>
                    <div class="mb-2"><label class="form-label">Sort Order</label><input type="number" name="sort_order" class="form-control" value="0"></div>
                </div>
                <div class="modal-footer"><button class="btn btn-dark">Save</button></div>
            </form>
        </div>
    </div>
</div>
@endsection