@extends('layouts.app')

@section('title', 'Taxi confirmed | ArrivalFlow')
@section('meta_description', 'Ride confirmed. Surface the best contextual offers while the guest waits or arrives.')

@section('content')
<section class="split">
    <article class="card success">
        <span class="eyebrow">2 · Taxi confirmed</span>
        <h1 style="font-size:clamp(2.1rem,4vw,3.5rem);">Your taxi is on the way.</h1>
        <p>Pickup: <strong>{{ $ride->pickup_label }}</strong><br>Destination: <strong>{{ $ride->destination_label }}</strong><br>ETA: <strong>{{ $ride->eta_minutes }} min</strong></p>
        <div class="list" style="margin-top:18px;">
            <div class="list-item">Ride UUID: {{ $ride->uuid }}</div>
            <div class="list-item">Source channel: {{ ucfirst($ride->source_channel) }}</div>
            <div class="list-item">Context zone: {{ $ride->context_zone ?: 'General' }}</div>
        </div>
    </article>
    <aside class="card">
        <span class="eyebrow">3 · While you wait</span>
        <h2>Best next offers</h2>
        <p>These recommendations were stored against this ride and logged as viewed for demo attribution.</p>
    </aside>
</section>

<section class="section">
    <div class="cards">
        @foreach ($recommendations as $recommendation)
            <article class="card offer-card">
                <div class="offer-visual" aria-hidden="true"></div>
                <div>
                    <div class="offer-meta">
                        <span class="pill">#{{ $recommendation->position }}</span>
                        <span class="pill">Score {{ number_format((float) $recommendation->score, 0) }}</span>
                        <span class="pill">{{ ucfirst($recommendation->offer->category) }}</span>
                    </div>
                    <h3 style="margin-top:14px;">{{ $recommendation->offer->title }}</h3>
                    <p>{{ $recommendation->offer->excerpt }}</p>
                    <p style="margin-top:12px;"><strong>Why it fits:</strong> {{ $recommendation->reason }}</p>
                </div>
                <a class="btn" href="{{ route('offers.show', $recommendation->offer->slug) }}?ride={{ $ride->id }}&recommendation={{ $recommendation->id }}">View offer</a>
            </article>
        @endforeach
    </div>
</section>
@endsection