@extends('layouts.app')

@section('title', 'Table Layout Setup - Tiqkets')

@section('page-title', 'Table Layout Setup')

@section('content')
    <div class="container-fluid">
        <!-- Simple Mode Status Banner -->
        <div class="alert alert-warning d-flex align-items-center mb-4">
            <i class="fas fa-info-circle fa-lg me-3"></i>
            <div>
                <h6 class="mb-1"><strong>Simple Mode Active</strong></h6>
                <p class="mb-0">Your branch is currently operating in <strong>Simple Mode</strong>. Table layout management
                    is not available in this mode.</p>
            </div>
        </div>

        <div class="row justify-content-center">
            <div class="col-lg-8">
                <div class="card">
                    <div class="card-header text-center">
                        <h5 class="mb-0">
                            <i class="fas fa-table me-2"></i>Simple Mode Information
                            <span class="badge bg-warning ms-2">Simple Mode</span>
                        </h5>
                    </div>
                    <div class="card-body text-center py-5">
                        <div class="simple-mode-icon mb-4">
                            <i class="fas fa-chair fa-4x text-muted"></i>
                        </div>

                        <h4 class="text-muted mb-3">Table Layout Management Not Available</h4>

                        <p class="text-muted mb-4">
                            In Simple Mode, your restaurant operates with automatic table assignment and basic seating
                            management.
                            Advanced table configuration, capacity settings, and layout management are disabled.
                        </p>

                        <div class="row text-start mb-4">
                            <div class="col-md-6">
                                <h6 class="mb-3"><i class="fas fa-check text-success me-2"></i>What's Available in Simple
                                    Mode:</h6>
                                <ul class="list-unstyled">
                                    <li class="mb-2"><i class="fas fa-circle text-success me-2 small"></i>Automatic table
                                        assignment</li>
                                    <li class="mb-2"><i class="fas fa-circle text-success me-2 small"></i>Basic guest
                                        management</li>
                                    <li class="mb-2"><i class="fas fa-circle text-success me-2 small"></i>Queue management
                                    </li>
                                    <li class="mb-2"><i class="fas fa-circle text-success me-2 small"></i>Reservation
                                        handling</li>
                                </ul>
                            </div>
                            <div class="col-md-6">
                                <h6 class="mb-3"><i class="fas fa-times text-muted me-2"></i>Not Available in Simple Mode:
                                </h6>
                                <ul class="list-unstyled">
                                    <li class="mb-2"><i class="fas fa-circle text-muted me-2 small"></i>Custom table
                                        layouts</li>
                                    <li class="mb-2"><i class="fas fa-circle text-muted me-2 small"></i>Capacity
                                        management</li>
                                    <li class="mb-2"><i class="fas fa-circle text-muted me-2 small"></i>Table
                                        merging/splitting</li>
                                    <li class="mb-2"><i class="fas fa-circle text-muted me-2 small"></i>Advanced seating
                                        rules</li>
                                </ul>
                            </div>
                        </div>

                        <div class="alert alert-info">
                            <div class="d-flex align-items-center">
                                <i class="fas fa-cog fa-lg me-3"></i>
                                <div class="text-start">
                                    <h6 class="mb-1">Need Advanced Features?</h6>
                                    <p class="mb-0">
                                        To enable table layout management, please contact your Restaurant Administrator
                                        to switch to <strong>Advanced Seating Mode</strong> for this branch.
                                    </p>
                                </div>
                            </div>
                        </div>

                        <div class="mt-4">
                            <a href="{{ route('location-manager.dashboard') }}" class="btn btn-primary me-3">
                                <i class="fas fa-tachometer-alt me-1"></i> Go to Dashboard
                            </a>
                            <a href="{{ route('location-manager.users.index') }}" class="btn btn-outline-primary">
                                <i class="fas fa-users me-1"></i> Manage Users
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('styles')
    <style>
        .simple-mode-icon {
            opacity: 0.7;
        }

        .list-unstyled li {
            padding-left: 0;
        }
    </style>
@endpush