@extends('layouts.app')

@section('title', 'لوحة التحكم')

@section('content')
    <div class="flex-1 overflow-y-auto p-4 md:p-8 md:px-12 scroll-smooth">

        @include('pages.dashboard.sections.header')

        @include('pages.dashboard.sections.alerts')

        <div class="grid grid-cols-1 xl:grid-cols-3 gap-8 my-5">

            {{-- Left --}}
            <div class="xl:col-span-2 flex flex-col gap-8">
                @include('pages.dashboard.sections.kpis')
                @include('pages.dashboard.sections.bookings')
                @include('pages.dashboard.sections.chart')
            </div>

            {{-- Right --}}
            <div class="flex flex-col gap-6">
                @include('pages.dashboard.sections.quick-actions')
                @include('pages.dashboard.sections.staff')
                @include('pages.dashboard.sections.circle-report')
            </div>



        </div>
    </div>
@endsection