@extends('layouts.internal')

@section('content')
<div class="max-w-4xl mx-auto">
    @if(session('success'))
        <div class="bg-green-500 text-white p-4 rounded-xl mb-6 shadow-lg">
            {{ session('success') }}
        </div>
    @endif

    <div class="bg-[#001040] border border-white/20 rounded-2xl p-8 shadow-2xl text-white">
        <div class="flex items-center gap-3 mb-8 border-b border-white/10 pb-4">
            <div class="w-2 h-8 bg-orange-500 rounded-full"></div>
            <h2 class="text-2xl font-black uppercase tracking-tight">Manajemen <span class="text-orange-500">Infografis</span></h2>
        </div>

        <form action="{{ route('admin.infografis.update') }}" method="POST">
            @csrf
            <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
                {{-- Kolom Kiri --}}
                <div class="space-y-6">
                    <div class="space-y-2">
                        <label class="text-xs font-bold uppercase text-white/50 tracking-widest">Total Provinsi</label>
                        <input type="number" name="total_provinsi" value="{{ old('total_provinsi', $infografis->total_provinsi) }}" required class="w-full bg-white/10 border border-white/20 p-3 rounded-lg outline-none focus:ring-2 focus:ring-orange-500 transition-all text-white">
                    </div>
                    
                    <div class="space-y-2">
                        <label class="text-xs font-bold uppercase text-white/50 tracking-widest">Total Proyek Selesai</label>
                        <input type="number" name="total_proyek_selesai" value="{{ old('total_proyek_selesai', $infografis->total_proyek_selesai) }}" required class="w-full bg-white/10 border border-white/20 p-3 rounded-lg outline-none focus:ring-2 focus:ring-orange-500 transition-all text-white">
                    </div>
                </div>

                {{-- Kolom Kanan --}}
                <div class="space-y-6">
                    <div class="space-y-2">
                        <label class="text-xs font-bold uppercase text-white/50 tracking-widest">Total Mitra Aktif</label>
                        <input type="number" name="total_mitra_aktif" value="{{ old('total_mitra_aktif', $infografis->total_mitra_aktif) }}" required class="w-full bg-white/10 border border-white/20 p-3 rounded-lg outline-none focus:ring-2 focus:ring-orange-500 transition-all text-white">
                    </div>

                    <div class="space-y-2">
                        <label class="text-xs font-bold uppercase text-white/50 tracking-widest">Tahun Berdiri</label>
                        <input type="number" name="tahun_berdiri" value="{{ old('tahun_berdiri', $infografis->tahun_berdiri) }}" required class="w-full bg-white/10 border border-white/20 p-3 rounded-lg outline-none focus:ring-2 focus:ring-orange-500 transition-all text-white">
                    </div>
                </div>

                {{-- Full Width --}}
                <div class="md:col-span-2 space-y-2">
                    <label class="text-xs font-bold uppercase text-white/50 tracking-widest">Daftar Jangkauan Proyek (Pisahkan dengan koma)</label>
                    <textarea name="daftar_jangkauan_proyek" rows="4" required class="w-full bg-white/10 border border-white/20 p-3 rounded-lg outline-none focus:ring-2 focus:ring-orange-500 transition-all text-white" placeholder="Contoh: Jawa Tengah, Jawa Barat, DKI Jakarta, Lampung...">{{ old('daftar_jangkauan_proyek', $infografis->daftar_jangkauan_proyek) }}</textarea>
                </div>
            </div>

            <div class="mt-10 flex justify-end">
                <button type="submit" class="bg-orange-600 hover:bg-orange-500 text-white px-12 py-3 rounded-xl font-black uppercase tracking-widest shadow-lg transition-all active:scale-95">
                    Perbarui Data Statistik
                </button>
            </div>
        </form>
    </div>
</div>
@endsection