@extends('admin.layout.tamplate')
@section('content')
<div class="p-6 md:p-10 space-y-8">
    @include('admin.layout.breadcumb')
    @include('admin.layout.alert')
    <div class="max-w-3xl mx-auto">
        <form action="{{ route('dashboard.profile.update') }}" method="POST" enctype="multipart/form-data" class="bg-white p-8 md:p-10 rounded-[2.5rem] shadow-sm border border-sky-50 space-y-6">
            @csrf @method('PUT')
            <h3 class="text-xl font-bold text-sky-950">Identitas Website</h3>
            
            <div class="space-y-4 text-center pb-4">
                <div class="mx-auto w-32 h-32 rounded-3xl bg-sky-50 border-2 border-dashed border-sky-200 flex items-center justify-center overflow-hidden">
                    <img id="preview-logo" src="{{ $setting->logo ? asset('uploads/profile/'.$setting->logo) : '' }}" class="{{ $setting->logo ? '' : 'hidden' }} w-full h-full object-contain p-2">
                    <i id="icon-logo" class="fas fa-image text-3xl text-sky-200 {{ $setting->logo ? 'hidden' : '' }}"></i>
                </div>
                <input type="file" name="logo" id="logo-input" class="hidden" accept="image/*">
                <label for="logo-input" class="inline-block px-6 py-2 bg-sky-50 text-sky-600 rounded-xl text-xs font-bold cursor-pointer hover:bg-sky-600 hover:text-white transition">Ganti Logo</label>
            </div>

            <div class="space-y-2">
                <label class="text-[10px] font-bold text-sky-900/40 uppercase tracking-widest ml-1">Nama Website / Yayasan</label>
                <input type="text" name="website_name" value="{{ $setting->website_name }}" class="w-full px-6 py-4 rounded-2xl bg-sky-50/50 border border-sky-100 outline-none focus:border-sky-500 transition text-sm font-medium">
            </div>

            <div class="space-y-2">
                <label class="text-[10px] font-bold text-sky-900/40 uppercase tracking-widest ml-1">Deskripsi Singkat SEO</label>
                <textarea name="description" rows="3" class="w-full px-6 py-4 rounded-2xl bg-sky-50/50 border border-sky-100 outline-none focus:border-sky-500 transition text-sm font-medium">{{ $setting->description }}</textarea>
            </div>

            <button type="submit" class="w-full py-4 bg-sky-600 text-white rounded-2xl font-bold shadow-lg shadow-sky-100 hover:bg-sky-700 transition">Simpan Identitas</button>
        </form>
    </div>
</div>
<script>
    document.getElementById('logo-input').onchange = function() {
        let reader = new FileReader();
        reader.onload = (e) => { 
            document.getElementById('preview-logo').src = e.target.result;
            document.getElementById('preview-logo').classList.remove('hidden');
            document.getElementById('icon-logo').classList.add('hidden');
        };
        reader.readAsDataURL(this.files[0]);
    };
</script>
@endsection