@extends('layouts.app')
@php($seoable = $event) @php($seoRoute = 'events.show') @php($seoRouteParameters = ['locale' => $locale, 'slug' => $translation->slug]) @php($seoAlternateUrls = $localizedSlugs->mapWithKeys(fn ($slug, $alternateLocale) => [$alternateLocale => route('events.show', ['locale' => $alternateLocale, 'slug' => $slug])])->all()) @php($localeSwitchUrls = $seoAlternateUrls) @php($primaryMedia = $event->primaryMedia) @php($status = $event->temporalStatus())
@section('content')
<main><article>
<header class="article-header relative overflow-hidden bg-olive pb-12 pt-28 text-cream md:pb-16 md:pt-32"><div class="bg-leaf pointer-events-none absolute inset-0 opacity-[.045]"></div>@can('update', $event)<livewire:event-inline-editor :event="$event" :locale="$locale" scope="detail-header" :key="'event-detail-header-'.$event->id" />@endcan<div class="article-shell article-header-shell relative"><nav class="article-breadcrumb" aria-label="Breadcrumb"><a href="{{ route('home', ['locale' => $locale]) }}">{{ __('events_detail.home') }}</a><span>/</span><a href="{{ route('events', ['locale' => $locale]) }}">{{ __('events_detail.events') }}</a><span>/</span><span aria-current="page">{{ $translation->title }}</span></nav><div class="article-header-content"><div class="article-meta article-event-meta"><span class="event-status" data-status="{{ $status }}">{{ __('events_detail.'.$status) }}</span><span>{{ $event->eventType->translation($locale)?->name }}</span><time datetime="{{ $event->starts_at->toDateString() }}">{{ $event->starts_at->translatedFormat('d F Y') }}@if($event->ends_at) — {{ $event->ends_at->translatedFormat('d F Y') }}@endif</time></div><h1>{{ $translation->title }}</h1>@if(filled($translation->summary))<p class="article-lead">{{ $translation->summary }}</p>@endif</div></div></header>
@if($event->primaryMedia || auth()->user()?->can('update', $event))<figure class="article-hero-image">@if($event->primaryMedia)<img src="{{ $event->primaryMedia->url() }}" alt="{{ $event->primaryMedia->translation($locale)?->alt_text ?? $translation->title }}">@endif @can('update', $event)<livewire:event-inline-editor :event="$event" :locale="$locale" scope="detail-hero" :key="'event-detail-hero-'.$event->id" />@endcan</figure>@endif
<aside class="article-shell event-information" aria-labelledby="event-information-heading">@can('update', $event)<livewire:event-inline-editor :event="$event" :locale="$locale" scope="detail-information" :key="'event-detail-information-'.$event->id" />@endcan<div><p class="eyebrow">{{ __('events_detail.information') }}</p><h2 id="event-information-heading">{{ __('events_detail.details') }}</h2></div><dl class="event-information-grid"><div><dt>{{ __('events_detail.date') }}</dt><dd><time datetime="{{ $event->starts_at->toDateString() }}">{{ $event->starts_at->translatedFormat('d F Y, H:i') }}@if($event->ends_at) — {{ $event->ends_at->translatedFormat('d F Y, H:i') }}@endif</time></dd></div>@if($event->ends_at)<div><dt>{{ __('events_detail.end_date') }}</dt><dd>{{ $event->ends_at->translatedFormat('d F Y, H:i') }}</dd></div>@endif @if(filled($translation->venue))<div><dt>{{ __('events_detail.location') }}</dt><dd>{{ $translation->venue }}</dd></div>@endif <div><dt>{{ __('events_detail.type') }}</dt><dd>{{ $event->eventType->translation($locale)?->name }}</dd></div><div><dt>{{ __('events_detail.status') }}</dt><dd><span class="event-status" data-status="{{ $status }}">{{ __('events_detail.'.$status) }}</span></dd></div></dl></aside>
@if(filled($translation->body) || auth()->user()?->can('update', $event))<div class="article-rich-content">@can('update', $event)<livewire:event-inline-editor :event="$event" :locale="$locale" scope="detail-body" :key="'event-detail-body-'.$event->id" />@endcan {!! $richBody !!}</div>@endif
<div class="article-shell article-back-wrap"><a class="article-back" href="{{ route('events', ['locale' => $locale]) }}#events-listing"><svg class="rtl-flip" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.65"><path d="m14 6-6 6 6 6"/></svg>{{ __('events_detail.back') }}</a></div>
</article>
<section class="event-detail-pathways relative overflow-hidden bg-olive py-16 text-cream md:py-20" aria-labelledby="event-next-steps-heading"><div class="bg-leaf pointer-events-none absolute inset-0 opacity-[.045]"></div><div class="article-shell relative">@can('update', $page)<livewire:events-page-inline-editor :page="$page" :locale="$locale" section-key="events.detail-pathways" />@endcan<p class="eyebrow text-cream/62">{{ $pathways['eyebrow'] ?? '' }}</p><div class="mt-4 grid gap-8 lg:grid-cols-[minmax(0,1fr)_auto] lg:items-end"><div><h2 id="event-next-steps-heading" class="display-xl max-w-2xl">{{ $pathways['title'] ?? '' }}</h2><p class="mt-5 max-w-xl leading-relaxed text-cream/72">{{ $pathways['summary'] ?? '' }}</p></div><div class="flex flex-col gap-3 sm:flex-row sm:flex-wrap"><a class="article-cta article-cta--light" href="{{ route('contact', ['locale' => $locale]) }}">{{ $pathways['contact_label'] ?? '' }}</a><a class="article-cta article-cta--outline" href="{{ route('products', ['locale' => $locale]) }}">{{ $pathways['products_label'] ?? '' }}</a><a class="article-cta article-cta--outline" href="{{ route('events', ['locale' => $locale]) }}#events-listing">{{ $pathways['all_events_label'] ?? '' }}</a></div></div></div></section>
@if($event->relatedEvents->isNotEmpty())<section class="bg-cream py-20 md:py-28" aria-labelledby="related-events-heading"><div class="container-page"><div class="flex flex-col justify-between gap-6 sm:flex-row sm:items-end"><div><p class="eyebrow">{{ __('events_detail.related') }}</p><h2 id="related-events-heading" class="display-xl mt-4">{{ __('events_detail.continue') }}</h2></div><a class="article-back" href="{{ route('events', ['locale' => $locale]) }}#events-listing">{{ __('events_detail.all_events') }}</a></div><div class="events-grid event-related-grid mt-12">@foreach($event->relatedEvents as $related) @php($item = $related->translation($locale)) @php($relatedStatus = $related->temporalStatus())<article class="event-card group"><figure class="event-card-image">@if($related->primaryMedia)<img src="{{ $related->primaryMedia->url() }}" alt="{{ $related->primaryMedia->translation($locale)?->alt_text ?? $item->title }}" loading="lazy">@endif <span class="event-status" data-status="{{ $relatedStatus }}">{{ __('events_detail.'.$relatedStatus) }}</span></figure><div class="event-card-content"><time class="event-date" datetime="{{ $related->starts_at->toDateString() }}"><strong>{{ $related->starts_at->format('d') }}</strong><span>{{ $related->starts_at->translatedFormat('M') }}</span><small>{{ $related->starts_at->format('Y') }}</small></time><div class="event-card-copy"><p class="event-type">{{ $related->eventType->translation($locale)?->name }}</p><h3>{{ $item->title }}</h3>@if(filled($item->venue))<p class="event-location">{{ $item->venue }}</p>@endif <p class="event-card-excerpt">{{ $item->summary }}</p><a class="events-read-more" href="{{ route('events.show', ['locale' => $locale, 'slug' => $item->slug]) }}">{{ __('events_detail.read_more') }}</a></div></div></article>@endforeach</div></div></section>@endif
</main>
@endsection