@extends('admin.layout')

@section('title', 'Pengaturan')

@section('content')
    <div class="toolbar">
        <div>
            <h1 style="margin:0 0 .35rem">Pengaturan</h1>
            <p class="muted" style="margin:0">Ubah teks portal, WhatsApp, dan konten halaman publik tanpa mengubah kode.</p>
        </div>
    </div>

    <form class="form" method="POST" action="{{ route('admin.settings.update') }}" enctype="multipart/form-data" style="max-width:760px">
        @csrf
        @method('PUT')

        <div style="margin-bottom:1.5rem;padding:1.1rem;border:1px solid var(--line);background:#fff;border-radius:.9rem">
            <h2 style="margin:0 0 .75rem;font-size:1.05rem">Logo Browser (Favicon)</h2>
            <p class="muted" style="margin:0 0 1rem">Ikon kecil di tab browser. Disarankan PNG/ICO kotak, minimal 32×32 atau 64×64 px.</p>
            <label>
                Upload Favicon
                <input type="file" name="favicon" accept=".png,.jpg,.jpeg,.ico,.webp,.svg,image/*">
            </label>
            @if ($faviconUrl)
                <div class="muted" style="margin-top:.85rem">
                    <img src="{{ $faviconUrl }}" alt="Favicon" style="width:48px;height:48px;object-fit:contain;display:block;margin-bottom:.5rem;border:1px solid var(--line);background:#fff;padding:.35rem">
                    <label style="display:flex;align-items:center;gap:.4rem">
                        <input type="checkbox" name="remove_favicon" value="1"> Hapus favicon saat ini
                    </label>
                </div>
            @endif
        </div>

        <div style="margin-bottom:1.5rem;padding:1.1rem;border:1px solid var(--line);background:#fff;border-radius:.9rem">
            <h2 style="margin:0 0 .75rem;font-size:1.05rem">Kontak WhatsApp</h2>
            <label>
                Nomor WhatsApp Admin
                <input
                    type="text"
                    name="whatsapp_number"
                    value="{{ old('whatsapp_number', $whatsappNumber) }}"
                    placeholder="081234567890"
                    inputmode="tel"
                >
            </label>
            <label style="margin-top:.85rem">
                Pesan default WhatsApp
                <input type="text" name="whatsapp_greeting" value="{{ old('whatsapp_greeting', $portal['whatsapp_greeting']) }}">
            </label>
            <label style="margin-top:.85rem">
                Label tombol WhatsApp
                <input type="text" name="whatsapp_button_label" value="{{ old('whatsapp_button_label', $portal['whatsapp_button_label']) }}">
            </label>
        </div>

        <div style="margin-bottom:1.5rem;padding:1.1rem;border:1px solid var(--line);background:#fff;border-radius:.9rem">
            <h2 style="margin:0 0 .35rem;font-size:1.05rem">Akun Sosial Media</h2>
            <p class="muted" style="margin:0 0 1rem">Tampil di beranda (bawah teks “Mulai dari…”) dan footer. Isi username atau URL lengkap.</p>

            <label style="display:flex;align-items:center;gap:.55rem;margin-bottom:1rem;padding:.85rem 1rem;border:1px solid var(--line);border-radius:.8rem;background:var(--panel,#f8faf9)">
                <input type="checkbox" name="social_enabled" value="1" @checked(old('social_enabled', $portal['social_enabled'] ?? '1') === '1')>
                <span>
                    <strong style="display:block">Tampilkan sosial media di portal</strong>
                    <span class="muted" style="font-size:.9rem">Nonaktifkan untuk menyembunyikan semua ikon sosial media.</span>
                </span>
            </label>

            <label>
                Instagram
                <input type="text" name="social_instagram" value="{{ old('social_instagram', $portal['social_instagram']) }}" placeholder="@namabrand atau https://instagram.com/namabrand">
            </label>
            <label style="margin-top:.85rem">
                TikTok
                <input type="text" name="social_tiktok" value="{{ old('social_tiktok', $portal['social_tiktok']) }}" placeholder="@namabrand atau https://www.tiktok.com/@namabrand">
            </label>
            <label style="margin-top:.85rem">
                Facebook
                <input type="text" name="social_facebook" value="{{ old('social_facebook', $portal['social_facebook']) }}" placeholder="namabrand atau https://facebook.com/namabrand">
            </label>
        </div>

        <div style="margin-bottom:1.5rem;padding:1.1rem;border:1px solid var(--line);background:#fff;border-radius:.9rem">
            <h2 style="margin:0 0 .75rem;font-size:1.05rem">Identitas & Beranda</h2>
            <label>
                Nama brand (navbar / footer)
                <input type="text" name="site_brand" value="{{ old('site_brand', $portal['site_brand']) }}">
            </label>
            <label style="margin-top:.85rem">
                Judul hero beranda
                <input type="text" name="hero_title" value="{{ old('hero_title', $portal['hero_title']) }}">
            </label>
            <label style="margin-top:.85rem">
                Subjudul hero
                <textarea name="hero_subtitle" rows="3">{{ old('hero_subtitle', $portal['hero_subtitle']) }}</textarea>
            </label>
            <label style="margin-top:.85rem">
                Hint di bawah tombol
                <input type="text" name="hero_hint" value="{{ old('hero_hint', $portal['hero_hint']) }}">
            </label>
            <div class="grid-2" style="margin-top:.85rem">
                <label>
                    Teks tombol utama
                    <input type="text" name="hero_cta_primary" value="{{ old('hero_cta_primary', $portal['hero_cta_primary']) }}">
                </label>
                <label>
                    Teks tombol kedua
                    <input type="text" name="hero_cta_secondary" value="{{ old('hero_cta_secondary', $portal['hero_cta_secondary']) }}">
                </label>
            </div>
            <label style="margin-top:.85rem">
                Teks footer
                <input type="text" name="footer_text" value="{{ old('footer_text', $portal['footer_text']) }}">
            </label>
        </div>

        <div style="margin-bottom:1.5rem;padding:1.1rem;border:1px solid var(--line);background:#fff;border-radius:.9rem">
            <h2 style="margin:0 0 .75rem;font-size:1.05rem">Halaman Paket</h2>
            <label>
                Eyebrow
                <input type="text" name="packages_eyebrow" value="{{ old('packages_eyebrow', $portal['packages_eyebrow']) }}">
            </label>
            <label style="margin-top:.85rem">
                Judul
                <input type="text" name="packages_title" value="{{ old('packages_title', $portal['packages_title']) }}">
            </label>
            <label style="margin-top:.85rem">
                Subjudul
                <textarea name="packages_subtitle" rows="2">{{ old('packages_subtitle', $portal['packages_subtitle']) }}</textarea>
            </label>
        </div>

        <div style="margin-bottom:1.5rem;padding:1.1rem;border:1px solid var(--line);background:#fff;border-radius:.9rem">
            <h2 style="margin:0 0 .75rem;font-size:1.05rem">Halaman Template</h2>
            <label>
                Eyebrow
                <input type="text" name="templates_eyebrow" value="{{ old('templates_eyebrow', $portal['templates_eyebrow']) }}">
            </label>
            <label style="margin-top:.85rem">
                Judul
                <input type="text" name="templates_title" value="{{ old('templates_title', $portal['templates_title']) }}">
            </label>
            <label style="margin-top:.85rem">
                Subjudul
                <textarea name="templates_subtitle" rows="2">{{ old('templates_subtitle', $portal['templates_subtitle']) }}</textarea>
            </label>
        </div>

        @if ($errors->any())
            <div class="flash" style="background:#fdecea;border-color:#f5c2c0;color:#8a1f17">
                <ul style="margin:0;padding-left:1.1rem">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <div class="actions">
            <button class="btn" type="submit">Simpan Pengaturan</button>
            @if ($whatsappNumber && ($wa = \App\Models\Setting::whatsappUrl()))
                <a class="btn btn-light" href="{{ $wa }}" target="_blank" rel="noopener">Tes WhatsApp</a>
            @endif
            <a class="btn btn-light" href="/" target="_blank">Lihat Portal</a>
        </div>
    </form>
@endsection