@extends('layouts.app')
@section('content')
<section class="hero-gradient text-white"><div class="mx-auto max-w-7xl px-5 py-16"><a class="text-sm font-bold text-emerald-200" href="{{ route('services.index') }}">← Kembali ke katalog</a><h1 class="mt-5 max-w-3xl text-4xl font-black sm:text-5xl">{{ $service->name }}</h1><p class="mt-4 max-w-2xl text-lg leading-8 text-blue-50">{{ $service->description }}</p></div></section>
<section class="pattern"><div class="mx-auto grid max-w-7xl gap-8 px-5 py-14 lg:grid-cols-[1.3fr_.7fr]"><div class="rounded-3xl bg-white p-8 shadow-sm"><h2 class="text-2xl font-black text-solo-blue">Persyaratan pengajuan</h2><p class="mt-2 text-slate-500">Siapkan dokumen berikut dalam format PDF, JPG, atau PNG dengan ukuran maksimal 5 MB per file.</p><ul class="mt-7 grid gap-4">@foreach($service->requirements ?? [] as $i => $requirement)<li class="flex items-center gap-4 rounded-2xl bg-slate-50 p-4"><span class="flex h-9 w-9 items-center justify-center rounded-full bg-emerald-100 font-black text-emerald-700">{{ $i + 1 }}</span><span class="font-bold text-slate-700">{{ $requirement }}</span></li>@endforeach</ul></div><aside class="h-fit rounded-3xl bg-solo-blue p-8 text-white"><h2 class="text-2xl font-black">Siap mengajukan?</h2><p class="mt-3 leading-7 text-blue-100">Masuk atau daftar akun untuk mengunggah berkas dan memantau proses permohonan.</p><a class="mt-7 block rounded-full bg-white px-5 py-3 text-center font-extrabold text-solo-blue" href="{{ auth()->check() ? route('citizen.applications.create', $service) : url('/masuk') }}">Mulai pengajuan</a><div class="mt-8 border-t border-white/20 pt-5"><div class="text-xs uppercase tracking-widest text-blue-200">Estimasi proses</div><div class="mt-1 text-xl font-black">{{ $service->processing_time }}</div></div></aside></div></section>
@endsection