@extends('layouts.public')

@section('title', __('booking.payment_pending_title') . ' — ' . config('app.name'))

@section('content')
<div class="container mx-auto max-w-2xl px-4 py-10 md:py-16">
    <div class="card-sc">
        <h1 class="text-2xl font-extrabold text-ink-900">{{ __('booking.payment_pending_title') }}</h1>
        <p class="mt-2 text-ink-500">
            {{ __('booking.pay_now', ['amount' => number_format((float) $appointment->fee_amount, 2), 'currency' => $appointment->fee_currency]) }}
        </p>

        <x-hyperpay-widget :brand="$brand" :widget-url="$widgetUrl" :shopper-result-url="$shopperResultUrl" :widget-brand-label="$widgetBrandLabel"/>
    </div>
</div>
@endsection