<x-app-layout>
    <div class="mx-auto max-w-4xl px-4 py-8 sm:px-6 lg:px-8">
        <h1 class="text-3xl font-black text-slate-950 dark:text-white">Community Settings</h1>
        <form method="POST" action="{{ route('admin.community.settings.update') }}" class="mt-6 space-y-5 rounded-lg border border-blue-100 bg-white p-6 dark:border-blue-900/50 dark:bg-slate-900">
            @csrf @method('PATCH')
            @foreach ([
                'community_enabled' => 'Enable community',
                'allow_public_viewing' => 'Allow visitors to view community',
                'chat_enabled' => 'Enable community chat',
                'post_approval_enabled' => 'Require admin approval for new posts',
                'top_traders_enabled' => 'Show best traders on homepage',
            ] as $field => $label)
                <label class="flex items-center gap-3 text-sm font-bold text-slate-700 dark:text-slate-200">
                    <input type="checkbox" name="{{ $field }}" value="1" @checked($settings->$field) class="rounded border-blue-300 text-blue-600">
                    {{ $label }}
                </label>
            @endforeach
            <div>
                <label class="text-sm font-bold text-slate-700 dark:text-slate-200">Top traders count</label>
                <select name="top_traders_count" class="mt-1 w-full rounded-lg border-blue-100 bg-white dark:border-blue-900 dark:bg-slate-950 dark:text-white">
                    <option value="3" @selected($settings->top_traders_count === 3)>Top 3</option>
                    <option value="5" @selected($settings->top_traders_count === 5)>Top 5</option>
                </select>
            </div>
            <button class="rounded-lg bg-blue-600 px-5 py-3 text-sm font-black text-white">Save Settings</button>
        </form>
    </div>
</x-app-layout>
