@extends('layouts.front.app')

@section('title', __('pages/subscription.checkout_pages.cancel.title'))

@section('content')
<section class="container py-14 sm:py-18">
    <div class="mx-auto max-w-2xl rounded-2xl border border-border bg-card p-8 shadow-card">
        <h1 class="text-2xl font-bold tracking-tight text-foreground">{{ __('pages/subscription.checkout_pages.cancel.title') }}</h1>
        <p class="mt-2 text-sm text-muted-foreground">
            {{ __('pages/subscription.checkout_pages.cancel.description') }}
        </p>

        <div class="mt-8 flex flex-col gap-3 sm:flex-row">
            <a href="{{ route('plans.index') }}" class="inline-flex items-center justify-center rounded-xl bg-brand px-5 py-2.5 text-sm font-semibold text-brand-foreground">
                {{ __('pages/subscription.checkout_pages.cancel.back_to_plans') }}
            </a>
        </div>
    </div>
</section>
@endsection