@extends('layouts.app')

@section('title', 'Package Required')

@push('styles')
<style>
    .required-page{min-height:calc(100vh - 70px);display:grid;place-items:center;margin-top:-38px;padding:80px 15px;background:radial-gradient(circle at 10% 10%,rgba(111,143,95,.2),transparent 30%),#f4f2eb}.required-card{width:min(690px,100%);padding:45px;border:1px solid rgba(17,23,17,.1);border-radius:34px;background:#fff;box-shadow:0 35px 90px rgba(17,23,17,.16);text-align:center}.required-icon{width:76px;height:76px;display:grid;place-items:center;margin:auto;border-radius:24px;color:#fff;background:linear-gradient(145deg,#779768,#40563a);font-size:27px}.required-card h1{margin:25px 0 12px;font-size:clamp(38px,7vw,60px);line-height:.96;letter-spacing:-.06em}.required-card p{max-width:520px;margin:0 auto 26px;color:#727d70;line-height:1.7}.required-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.required-actions a{min-height:51px;display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:15px;font-size:12px;font-weight:950}.required-primary{color:#fff;background:#111711}.required-secondary{border:1px solid rgba(17,23,17,.1);background:#f6f6f1}@media(max-width:600px){.required-card{padding:34px 21px}.required-actions a{width:100%}}
</style>
@endpush

@section('content')
@php($fr = app()->getLocale() === 'fr')
<main class="required-page"><section class="required-card">
    <div class="required-icon">✦</div>
    <h1>{{ $fr ? 'Votre essai est terminé.' : 'Your free trial has ended.' }}</h1>
    <p>{{ $fr ? 'Choisissez un forfait mensuel ou annuel pour réactiver immédiatement votre restaurant, votre menu QR et toutes les fonctionnalités intelligentes.' : 'Choose a monthly or yearly package to reactivate your restaurant, QR menu and every smart feature immediately.' }}</p>
    <div class="required-actions"><a class="required-primary" href="{{ route('packages.index') }}">{{ $fr ? 'Choisir un forfait' : 'Choose a Package' }}</a><a class="required-secondary" href="mailto:info@smartdevelop.online">{{ $fr ? 'Contacter le soutien' : 'Contact Support' }}</a></div>
</section></main>
@endsection