@extends('layouts.site')

@section('meta_title')
    {{ locale_category_name($category) }} — {{ brand_name() }}
@endsection

@section('title', locale_category_name($category))

@push('meta')
    @if (filled($description))
        <meta name="description" content="{{ $description }}">
    @endif
@endpush

@section('content')
    <div class="site-industry" data-reveal="page">
        <section
            class="site-industry-hero"
            @if (filled($heroImage))
                style="--industry-hero-image: url('{{ $heroImage }}')"
            @endif
        >
            <div class="site-industry-hero__veil" aria-hidden="true"></div>
            <div class="site-container site-industry-hero__inner">
                <nav class="site-industry-hero__breadcrumb eca-breadcrumb" aria-label="Breadcrumb">
                    <a href="{{ route('site.home', ['locale' => $locale]) }}">{{ __('site.nav_home') }}</a>
                    <span class="eca-breadcrumb__sep">›</span>
                    <a href="{{ route('site.industries.index', ['locale' => $locale]) }}">{{ __('site.industries_title') }}</a>
                    @if ($root->id !== $category->id)
                        <span class="eca-breadcrumb__sep">›</span>
                        <a href="{{ site_industry_url($root, $locale) }}">{{ locale_category_name($root) }}</a>
                    @endif
                    <span class="eca-breadcrumb__sep">›</span>
                    <span aria-current="page">{{ locale_category_name($category) }}</span>
                </nav>

                <h1 class="site-industry-hero__title">{{ locale_category_name($category) }}</h1>
                @if (filled($description))
                    <p class="site-industry-hero__subtitle">{{ $description }}</p>
                @endif

                <div class="site-industry-hero__actions">
                    <button
                        type="button"
                        class="site-btn-primary"
                        data-assistant-open
                        data-source-type="category"
                        data-source-id="{{ $category->id }}"
                    >
                        {{ __('site.industry_request_cta') }}
                    </button>
                    @feature('repair_services')
                        @if ($services->isNotEmpty())
                            <a href="#industry-services" class="site-btn-outline">{{ __('site.industry_view_services') }}</a>
                        @endif
                    @endfeature
                </div>
            </div>
        </section>

        <div class="site-container site-industry__body space-y-10 pb-12 pt-8">
            @if ($activities->isNotEmpty())
                <section class="site-industry-section" data-reveal="soft">
                    <div class="eca-section-heading">
                        <h2>{{ __('site.industry_activities') }}</h2>
                    </div>
                    <ul class="site-industry-activities">
                        @foreach ($activities as $activity)
                            <li>
                                <a href="{{ site_industry_url($activity, $locale) }}" class="site-industry-activities__card">
                                    @if ($activity->image)
                                        <img
                                            src="{{ site_media_url($activity->image) }}"
                                            alt=""
                                            class="site-industry-activities__image"
                                            loading="lazy"
                                            decoding="async"
                                        />
                                    @endif
                                    <div class="site-industry-activities__content">
                                        <h3>{{ locale_category_name($activity) }}</h3>
                                        @php($activityDesc = locale_field($activity, 'description'))
                                        @if ($activityDesc)
                                            <p>{{ \Illuminate\Support\Str::limit($activityDesc, 120) }}</p>
                                        @endif
                                    </div>
                                </a>
                            </li>
                        @endforeach
                    </ul>
                </section>
            @endif

            @if ($orders->isNotEmpty())
                <section class="site-industry-section" data-reveal="soft">
                    <div class="eca-section-heading">
                        <h2>{{ __('site.industry_completed_repairs') }}</h2>
                        <a href="{{ route('site.repairs.index', ['locale' => $locale, 'category_id' => $category->id]) }}">{{ __('site.view_all') }}</a>
                    </div>
                    <ul class="site-industry-repairs">
                        @foreach ($orders as $order)
                            <li class="site-industry-repairs__item">
                                <p class="site-industry-repairs__code">{{ $order->tracking_code }}</p>
                                <p class="site-industry-repairs__device">{{ $order->device_name }}</p>
                                @if ($order->category)
                                    <p class="site-industry-repairs__meta">{{ locale_category_name($order->category) }}</p>
                                @endif
                            </li>
                        @endforeach
                    </ul>
                </section>
            @endif

            @feature('repair_services')
                @if ($services->isNotEmpty())
                    <section id="industry-services" class="site-industry-section" data-reveal="soft">
                        <div class="eca-section-heading">
                            <h2>{{ __('site.industry_sample_services') }}</h2>
                            <a href="{{ route('site.services.index', ['locale' => $locale, 'category_id' => $category->id]) }}">{{ __('site.hero_cta_services') }}</a>
                        </div>
                        <ul class="eca-card-grid eca-card-grid--services eca-card-grid--home">
                            @foreach ($services as $service)
                                <x-site.cards.service :service="$service" />
                            @endforeach
                        </ul>
                    </section>
                @endif
            @endfeature
        </div>
    </div>
@endsection