@extends('layouts.app')

@section('content')
<div class="max-w-6xl px-4 pb-60">
    <div class="grid items-start max-w-2xl grid-cols-1 grid-rows-1 gap-4 mx-auto lg:mx-0 lg:max-w-none lg:grid-cols-5">
        <div class="grid gap-4 lg:col-span-5">

            <!-- Header -->
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                <div class="sm:flex sm:items-center sm:justify-between">
                    <div class="sm:flex-auto">
                        <h1 class="text-base font-semibold text-stone-900">Servis Saatleri - {{ $restaurant->name }}
                        </h1>
                        <p class="mt-2 text-xs text-stone-700">Her gün için birden fazla servis saati ekleyebilirsiniz
                            (örn: Kahvaltı ve Akşam Servisi).</p>
                    </div>
                    <div class="mt-4 sm:ml-16 sm:mt-0 sm:flex-none flex gap-2">
                        <a href="{{ route('admin.restaurants.settings.edit', $restaurant) }}"
                            class="inline-flex items-center px-3 py-2 text-sm font-semibold text-center text-stone-700 rounded-md shadow-sm ring-1 ring-inset ring-stone-300 hover:bg-stone-50">
                            <span class="material-symbols-rounded text-sm mr-1">settings</span>
                            AYARLAR
                        </a>
                        <a href="{{ route('admin.dashboard', ['restaurant_id' => $restaurant->id]) }}"
                            class="inline-flex items-center px-3 py-2 text-sm font-semibold text-center text-white rounded-md shadow-sm bg-stone-600 hover:bg-stone-500">
                            <span class="material-symbols-rounded text-sm mr-1">home</span>
                            DASHBOARD
                        </a>
                    </div>
                </div>
            </div>

            <!-- Success Message -->
            @if(session('success'))
            <div class="bg-green-50 border border-green-200 rounded-lg p-4">
                <div class="flex items-center">
                    <span class="material-symbols-rounded text-green-600 mr-2">check_circle</span>
                    <span class="text-green-800 text-sm">{{ session('success') }}</span>
                </div>
            </div>
            @endif

            <!-- Livewire Working Hours Component -->
            @livewire('working-hours', ['restaurant' => $restaurant])

        </div>
    </div>
</div>
@endsection