@extends('layouts.app')

@section('title', $space->name)

@section('content')
    <x-breadcrumbs :items="[
        ['label' => 'Dashboard', 'url' => route('dashboard')],
        ['label' => 'Spaces', 'url' => route('spaces.index')],
        ['label' => $space->name],
    ]" />

    <x-page-header :title="$space->name" :subtitle="$space->code">
        @can('update', $space)
            <a href="{{ route('spaces.edit', $space) }}" class="btn btn-outline-primary btn-sm">Edit</a>
        @endcan
    </x-page-header>

    <div class="row g-3">
        <div class="col-lg-8">
            <x-card title="Space Details">
                <dl class="row mb-0">
                    <dt class="col-sm-4 text-muted">Type</dt>
                    <dd class="col-sm-8">{{ $space->spaceType->name ?? '—' }}</dd>
                    <dt class="col-sm-4 text-muted">Location</dt>
                    <dd class="col-sm-8">{{ $space->location ?? '—' }}</dd>
                    <dt class="col-sm-4 text-muted">Capacity</dt>
                    <dd class="col-sm-8">{{ $space->min_capacity ?? '—' }} – {{ $space->max_capacity ?? '—' }}</dd>
                    <dt class="col-sm-4 text-muted">Standard Rate</dt>
                    <dd class="col-sm-8"><x-money :amount="$space->standard_rate" /></dd>
                    <dt class="col-sm-4 text-muted">Hourly / Half / Full Day</dt>
                    <dd class="col-sm-8">
                        <x-money :amount="$space->hourly_rate" /> /
                        <x-money :amount="$space->half_day_rate" /> /
                        <x-money :amount="$space->full_day_rate" />
                    </dd>
                    <dt class="col-sm-4 text-muted">Setup / Breakdown</dt>
                    <dd class="col-sm-8">{{ $space->setup_duration_minutes ?? 0 }} min / {{ $space->breakdown_duration_minutes ?? 0 }} min</dd>
                    <dt class="col-sm-4 text-muted">Hours</dt>
                    <dd class="col-sm-8">{{ $space->opening_time ? substr((string) $space->opening_time, 0, 5) : '—' }} – {{ $space->closing_time ? substr((string) $space->closing_time, 0, 5) : '—' }}</dd>
                    <dt class="col-sm-4 text-muted">Status</dt>
                    <dd class="col-sm-8"><x-badge :status="$space->operational_status->value" :label="$space->operational_status->label()" /></dd>
                    @if ($space->description)
                        <dt class="col-sm-4 text-muted">Description</dt>
                        <dd class="col-sm-8">{{ $space->description }}</dd>
                    @endif
                    @if ($space->amenities)
                        <dt class="col-sm-4 text-muted">Amenities</dt>
                        <dd class="col-sm-8">{!! nl2br(e($space->amenities)) !!}</dd>
                    @endif
                    @if ($space->equipment)
                        <dt class="col-sm-4 text-muted">Equipment</dt>
                        <dd class="col-sm-8">{!! nl2br(e($space->equipment)) !!}</dd>
                    @endif
                </dl>
            </x-card>

            @if ($space->layouts->isNotEmpty())
                <x-card title="Layouts" class="mt-3">
                    <div class="table-responsive">
                        <table class="table table-sm mb-0">
                            <thead>
                                <tr>
                                    <th>Layout</th>
                                    <th>Capacity</th>
                                    <th>Custom</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($space->layouts as $layout)
                                    <tr>
                                        <td>{{ $layout->layout_name }}</td>
                                        <td>{{ $layout->capacity }}</td>
                                        <td>{{ $layout->is_custom ? 'Yes' : 'No' }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </x-card>
            @endif

            <x-card title="Upcoming Reservations" class="mt-3">
                @if ($upcomingReservations->isEmpty())
                    <p class="text-muted mb-0">No upcoming reservations for this space.</p>
                @else
                    <div class="table-responsive">
                        <table class="table table-hover align-middle mb-0">
                            <thead>
                                <tr>
                                    <th>Booking</th>
                                    <th>Customer</th>
                                    <th>Event Start</th>
                                    <th>Event End</th>
                                    <th>Status</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($upcomingReservations as $reservation)
                                    <tr>
                                        <td>
                                            @if ($reservation->booking)
                                                <a href="{{ route('bookings.show', $reservation->booking) }}">{{ $reservation->booking->booking_number }}</a>
                                            @else
                                                —
                                            @endif
                                        </td>
                                        <td>{{ $reservation->booking?->customer?->name ?? '—' }}</td>
                                        <td><x-datetime :value="$reservation->event_start" datetime /></td>
                                        <td><x-datetime :value="$reservation->event_end" datetime /></td>
                                        <td><x-badge :status="$reservation->reservation_status->value" :label="$reservation->reservation_status->label()" /></td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </x-card>
        </div>
    </div>
@endsection
