@extends('layouts.public')

@section('title', __('Marketplace'))
@section('meta_description', __('Property, vehicles, equipment and services across Nepal.'))

@section('content')
    <div class="border-b border-border bg-surface">
        <div class="container-page py-10 sm:py-14">
            <h1 class="font-display text-display font-bold text-text">{{ __('Marketplace') }}</h1>

            <p class="mt-3 max-w-2xl text-text-secondary">
                {{ __('Property leads, but the same listings, enquiries and viewings work across every category we run.') }}
            </p>
        </div>
    </div>

    <div class="container-page py-10 sm:py-14">
        <div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3 3xl:grid-cols-4" data-reveal-group>
            @foreach ($sectors as $sector)
                @php
                    // Real estate has its own pages; everything else browses here.
                    $url = $sector->is_primary
                        ? route('properties.index')
                        : route('marketplace.sector', $sector->slug);
                @endphp

                <a href="{{ $url }}"
                   class="group flex flex-col rounded-2xl border border-border bg-surface p-6 transition hover:border-primary hover:shadow-card"
                   data-reveal-child>
                    <span class="flex size-11 items-center justify-center rounded-xl bg-surface-muted text-text-secondary transition group-hover:bg-primary group-hover:text-text">
                        <x-icon :name="$sector->icon ?: 'grid'" class="size-5" />
                    </span>

                    <h2 class="mt-4 font-display text-title font-bold text-text">{{ $sector->name }}</h2>

                    @if ($sector->tagline)
                        <p class="mt-1.5 text-sm text-text-secondary">{{ $sector->tagline }}</p>
                    @endif

                    <p class="mt-auto pt-5 text-sm text-text-muted">
                        {{ trans_choice('One listing|:count listings', $sector->listings_count, ['count' => number_format($sector->listings_count)]) }}
                    </p>
                </a>
            @endforeach
        </div>
    </div>
@endsection