@extends('layouts.app')

@section('title', 'All Services - Texora')
@section('meta_description', 'Browse Texora services for company registration, NTN, tax filing, trademark protection, USA LLC, UK company setup, and compliance.')

@section('content')
@php
    $totalServices = $categories->sum(fn($category) => $category->activeServices->count());
    $waNum = App\Models\SiteSetting::where('key','whatsapp_number')->value('value') ?? '923001234567';
@endphp

<main class="txp-page" data-txp-page>
    <section class="txp-hero" data-txp-hero>
        <div class="txp-shell txp-hero-grid">
            <div>
                <span class="txp-kicker txp-reveal">Texora services</span>
                <h1 class="txp-title txp-reveal">Everything legal, tax, and compliance<span class="txp-dot">.</span></h1>
            </div>
            <div>
                <p class="txp-lede txp-reveal">Choose from Texora's active services. Every service keeps the same expert-led flow: clear requirements, fast handling, real pricing, and support when you need it.</p>
                <div class="mt-8 flex flex-wrap gap-3 txp-reveal">
                    <a href="{{ route('consultation') }}" class="txp-button">Talk to an Expert</a>
                    <a href="#service-catalog" class="txp-button-dark">View Catalog</a>
                </div>
            </div>
        </div>
    </section>

    <section class="txp-blue-panel txp-section--tight" data-txp-section>
        <div class="txp-shell txp-grid">
            <div class="txp-card">
                <small>01</small>
                <h3>{{ $totalServices }} services</h3>
                <p>Pakistan and international business setup options pulled from your live service catalog.</p>
            </div>
            <div class="txp-card">
                <small>02</small>
                <h3>Dedicated manager</h3>
                <p>One Texora specialist guides requirements, filings, documents, and updates.</p>
            </div>
            <div class="txp-card">
                <small>03</small>
                <h3>Start online</h3>
                <p>Open any service page, select a package, and begin the process through the existing order flow.</p>
            </div>
        </div>
    </section>

    <section class="txp-section" id="service-catalog" data-txp-section>
        <div class="txp-shell">
            <div class="txp-section-head">
                <h2>Services<span class="txp-dot">.</span></h2>
                <p>Organized by your Texora categories, styled like the homepage, and linked directly to the detail pages.</p>
            </div>

            <div class="space-y-20">
                @foreach($categories as $category)
                    <div>
                        <div class="mb-8 flex flex-wrap items-end justify-between gap-4">
                            <div>
                                <span class="txp-kicker">{{ $category->activeServices->count() }} available</span>
                                <h3 class="font-serif text-[clamp(2.8rem,5vw,6rem)] leading-none tracking-[-0.06em]">{{ $category->name }}</h3>
                            </div>
                            <span class="text-4xl">{{ $category->icon }}</span>
                        </div>

                        <div class="txp-grid">
                            @foreach($category->activeServices as $i => $svc)
                                @php
                                    $firstPackage = $svc->packages->sortBy('sort_order')->first();
                                    $minDays = $svc->packages->min('delivery_days');
                                    $maxDays = $svc->packages->max('delivery_days');
                                @endphp
                                <article class="txp-card" role="link" tabindex="0" data-href="{{ route('services.show', $svc->slug) }}">
                                    <small>{{ str_pad($i + 1, 2, '0', STR_PAD_LEFT) }}</small>
                                    <h3>{{ $svc->name }}</h3>
                                    <p>{{ $svc->short_description ?: \Illuminate\Support\Str::limit(strip_tags($svc->description), 130) }}</p>
                                    <div class="txp-card-meta">
                                        <span>{{ $firstPackage ? $firstPackage->currency . ' ' . number_format($firstPackage->price, 0) : 'Custom quote' }}</span>
                                        <span>{{ $minDays && $maxDays ? $minDays . '-' . $maxDays . ' days' : 'Fast handling' }}</span>
                                    </div>
                                    @include('frontend.partials.service-card-actions', [
                                        'serviceName' => $svc->name,
                                        'startUrl' => route('services.show', $svc->slug) . '#packages',
                                        'waNumber' => $waNum,
                                    ])
                                </article>
                            @endforeach
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </section>

    <section class="txp-section txp-dark" data-txp-section>
        <div class="txp-shell txp-hero-grid">
            <div>
                <span class="txp-kicker txp-reveal">Not sure?</span>
                <h2 class="txp-title txp-reveal">We will help you choose the right path<span class="txp-dot">.</span></h2>
            </div>
            <div>
                <p class="txp-lede txp-reveal">Tell us your business stage and we will guide you toward the correct registration, filing, or compliance service.</p>
                <a href="{{ route('consultation') }}" class="txp-button txp-reveal mt-8">Book Free Consultation</a>
            </div>
        </div>
    </section>
</main>
@endsection