<?= $this->extend('layouts/main') ?>
<?= $this->section('content') ?>

<h1 class="h3 mb-3">Dining Areas</h1>

<div class="row">
    <div class="col-md-7 mb-3">
        <div class="card shadow-sm">
            <div class="table-scroll">
                <table class="table table-hover mb-0 align-middle">
                    <thead class="table-light"><tr><th>Name</th><th>Description</th><th class="text-end">Actions</th></tr></thead>
                    <tbody>
                        <?php if (empty($areas)): ?>
                            <tr><td colspan="3" class="text-center text-muted py-4">No dining areas yet.</td></tr>
                        <?php endif; ?>
                        <?php foreach ($areas as $area): ?>
                            <tr>
                                <td class="fw-semibold"><?= esc($area->name) ?></td>
                                <td class="small text-muted"><?= esc($area->description) ?></td>
                                <td class="text-end">
                                    <form action="<?= site_url('dining/areas/' . $area->id . '/delete') ?>" method="post" class="d-inline" onsubmit="return confirm('Delete this area?');">
                                        <?= csrf_field() ?>
                                        <button type="submit" class="btn btn-sm btn-outline-danger">Delete</button>
                                    </form>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="col-md-5 mb-3">
        <div class="card shadow-sm">
            <div class="card-body">
                <h2 class="h6">New Dining Area</h2>
                <form action="<?= site_url('dining/areas') ?>" method="post">
                    <?= csrf_field() ?>
                    <div class="mb-3">
                        <label class="form-label">Name</label>
                        <input type="text" class="form-control" name="name" required placeholder="e.g. Main Terrace">
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Description</label>
                        <textarea class="form-control" name="description" rows="2"></textarea>
                    </div>
                    <button type="submit" class="btn btn-primary">Add Area</button>
                </form>
            </div>
        </div>
    </div>
</div>

<?= $this->endSection() ?>
