@extends('frontend::layouts.master')

@section('content')
    <x-frontend::page-hero title="{{ $data['service']['category']['list'][0]['name'] ?? 'Production' }}" showButton="true" buttonLabel="Request A Quote" buttonUrl="{{ $data['page_init']['contact']['url'] ?? '#' }}" :image="$data['service']['category']['list'][0]['image'] ?? ''">
        {{ $data['service']['category']['list'][0]['desc'] ?? '' }}
    </x-frontend::page-hero>

    <section class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 lg:py-12 relative">

        @php
            $heroSlides = [];
            foreach ($data['banners'] ?? [] as $banner) {
                $type = $banner['type'] ?? 'image';
                if ($type === 'youtube') {
                    $ytId = $banner['src'] ?? '';
                    if ($ytId === '') {
                        continue;
                    }
                    $heroSlides[] = [
                        'type' => 'youtube',
                        'src' => 'https://www.youtube-nocookie.com/embed/' . $ytId . '?rel=0&modestbranding=1',
                        'title' => $banner['name'] ?? 'YouTube video',
                    ];
                } elseif ($type === 'video') {
                    $cover = $banner['cover'] ?? '';
                    if ($cover !== '') {
                        $heroSlides[] = [
                            'type' => 'image',
                            'src' => check_file($cover),
                            'alt' => $banner['name'] ?? '',
                        ];
                    }
                } else {
                    $src = $banner['src'] ?? '';
                    if ($src === '') {
                        continue;
                    }
                    $heroSlides[] = [
                        'type' => 'image',
                        'src' => check_file($src),
                        'alt' => $banner['name'] ?? '',
                    ];
                }
            }
        @endphp

        @if (!empty($heroSlides))
            <x-frontend::production-hero-slider :title="$title ?? 'Production'" :slides="$heroSlides" />
        @endif

        @include('frontend::pages.our-services.partials.follow-us')

        {{-- Description sections --}}
        <div class="mb-12 lg:mb-16 max-w-5xl mx-auto">
            @if (!empty($data['social']['page']['detail']))
                {!! $data['social']['page']['detail'] !!}
            @endif
            @if (!empty($data['social']['page']['link']))
                <div class="mt-8 flex justify-center">
                    <a class="inline-flex items-center justify-center px-10 py-2.5 rounded-full bg-le-primary text-xs sm:text-sm font-medium hover:bg-le-primary/80 transition-colors" href="{{ $data['social']['page']['link'] }}">
                        Package - Studio Beyond
                        <i class="ph ph-caret-right"></i>
                    </a>
                </div>
            @endif
        </div>
    </section>

    <!-- Our Work carousel (Swiper) -->
    @include('frontend::components.ourwork-carousel', [
        'title' => $data['ourwork']['page']['name'] ?? 'Our Work',
        'relatedWorks' => $data['ourwork'] ?? null,
        'viewAllUrl' => $data['ourwork']['page']['url'] ?? '#',
        'viewAllText' => __('field.view_all'),
    ])

    <!-- Logos Slide -->
    @include('frontend::components.logos-slide')
@endsection