@extends('admin.layout')
@section('title', 'App Settings')
@section('subtitle', 'Changes take effect immediately for all users')

@section('content')
<form method="POST" action="{{ route('admin.settings.update') }}" class="space-y-6 max-w-4xl">
    @csrf @method('PUT')

    @foreach ($settings as $group => $groupSettings)
        <div class="bg-white rounded-lg shadow-sm border border-slate-200">
            <div class="px-5 py-3 border-b bg-slate-50">
                <h3 class="font-semibold capitalize">{{ str_replace('_', ' ', $group) }}</h3>
            </div>
            <div class="p-5 space-y-4">
                @foreach ($groupSettings as $s)
                    <div class="grid md:grid-cols-3 gap-4 items-start">
                        <div class="md:col-span-1">
                            <label class="block text-sm font-medium">{{ $s->label }}</label>
                            @if ($s->description)
                                <p class="text-xs text-slate-500 mt-0.5">{{ $s->description }}</p>
                            @endif
                            <code class="text-xs text-slate-400">{{ $s->key }}</code>
                        </div>
                        <div class="md:col-span-2">
                            @if ($s->type === 'boolean')
                                <label class="inline-flex items-center gap-2">
                                    <input type="checkbox" name="settings[{{ $s->key }}]" value="1" @checked($s->typed_value)>
                                    <span class="text-sm">{{ $s->typed_value ? 'Enabled' : 'Disabled' }}</span>
                                </label>
                            @elseif ($s->type === 'integer' || $s->type === 'float')
                                <input type="number" @if ($s->type === 'float') step="0.01" @endif
                                       name="settings[{{ $s->key }}]" value="{{ $s->value }}"
                                       class="w-40 rounded-md border border-slate-300 px-3 py-2 text-sm">
                            @else
                                <input type="text" name="settings[{{ $s->key }}]" value="{{ $s->value }}"
                                       class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
                            @endif
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    @endforeach

    <div class="flex justify-end">
        <button class="bg-slate-900 text-white px-6 py-2.5 rounded-md">Save All Settings</button>
    </div>
</form>
@endsection