@props([
    'title' => null,
    'description' => null,
])

@php
    $setting = function (string $key, string $default): string {
        try {
            if (\Illuminate\Support\Facades\Schema::hasTable('site_settings')) {
                return \App\Models\SiteSetting::getValue($key, $default) ?: $default;
            }
        } catch (\Throwable $exception) {
            return $default;
        }

        return $default;
    };

    $title = $title ?: $setting('main_cta_title', 'هل أنت جاهز لتنطلق مع ZLHOST؟');
    $description = $description ?: $setting('main_cta_description', 'فريقنا في خدمتك على مدار الساعة. اختر الخدمة المناسبة، أو اطلب عرض سعر مخصصاً لمشروعك.');
    $user = auth()->user();
    $isStaff = $user && method_exists($user, 'isStaff') && $user->isStaff();
    $startHref = ! $user ? route('register') : ($isStaff ? url('/admin') : route('customer.orders.create'));
    $startLabel = ! $user ? 'إنشاء حساب والبدء' : ($isStaff ? 'لوحة التحكم' : 'طلب خدمة جديد');
@endphp

<section class="zl-pixel-shell my-12">
    <div class="zl-pixel-cta min-h-[180px]">
        <div class="absolute inset-0 bg-gradient-to-l from-navy-950/95 via-brand-950/82 to-brand-800/70"></div>
        <div class="absolute -start-24 top-1/2 h-64 w-64 -translate-y-1/2 rounded-full bg-brand-500/20 blur-3xl"></div>
        <div class="absolute -end-20 -top-20 h-56 w-56 rounded-full bg-gold-400/15 blur-3xl"></div>

        <div class="relative z-10 p-7 text-center md:p-10">
            <h2 class="text-2xl md:text-4xl font-black text-white text-balance">{{ $title }}</h2>
            <p class="mt-4 text-navy-100 max-w-2xl mx-auto">{{ $description }}</p>

            <div class="mt-7 flex flex-wrap items-center justify-center gap-3">
                <a href="{{ $startHref }}" class="btn btn-primary btn-lg">{{ $startLabel }}</a>
                <a href="{{ route('quote.show') }}" class="btn btn-gold btn-lg">عرض سعر مخصص</a>
                <a href="{{ route('contact') }}" class="btn btn-secondary bg-white text-navy-900 hover:bg-navy-50">تواصل مباشر</a>
            </div>
        </div>
    </div>
</section>