{{-- resources/views/livewire/system/settings/general-form.blade.php --}}
<div class="space-y-5">
    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
        <div>
            <label class="block text-white/60 text-sm mb-2">Instanzname</label>
            <div class="w-full rounded-xl border border-white/10 bg-white/[0.04] px-4 py-3 text-white/80">
                {{ $instance_name }}
            </div>
            <p class="mt-1 text-xs text-white/40">Wird bei der Installation festgelegt (read-only).</p>
        </div>

        <div>
            <label class="block text-white/60 text-sm mb-2">Sprache</label>
            <select wire:model.live="locale"
                    class="w-full rounded-xl border border-white/10 bg-white/[0.04] px-4 py-3 text-white/90 focus:outline-none focus:border-white/20">
                @foreach($locales as $opt)
                    <option class="bg-slate-900" value="{{ $opt['value'] }}">{{ $opt['label'] }}</option>
                @endforeach
            </select>
            @error('locale') <p class="mt-1 text-xs text-rose-400">{{ $message }}</p> @enderror
        </div>

        <div>
            <label class="block text-white/60 text-sm mb-2">Zeitzone</label>
            <select wire:model.live="timezone"
                    class="w-full rounded-xl border border-white/10 bg-white/[0.04] px-4 py-3 text-white/90 focus:outline-none focus:border-white/20">
                @foreach($timezones as $tz)
                    <option class="bg-slate-900" value="{{ $tz }}">{{ $tz }}</option>
                @endforeach
            </select>
            @error('timezone') <p class="mt-1 text-xs text-rose-400">{{ $message }}</p> @enderror
        </div>

        <div>
            <label class="block text-white/60 text-sm mb-2">Session-Timeout (Minuten)</label>
            <input type="number" min="5" max="1440" step="5" wire:model.live="session_timeout"
                   class="w-full rounded-xl border border-white/10 bg-white/[0.04] px-4 py-3 text-white/90 focus:outline-none focus:border-white/20">
            @error('session_timeout') <p class="mt-1 text-xs text-rose-400">{{ $message }}</p> @enderror
        </div>
    </div>

    <div class="flex items-center justify-end">
        <button wire:click="save" wire:loading.attr="disabled"
                class="inline-flex items-center gap-2 rounded-xl border border-white/10 bg-white/5 px-3 py-1.5 text-sm text-white/80 hover:text-white hover:border-white/20 transition">
            <i class="ph ph-floppy-disk"></i> Speichern
        </button>
    </div>
</div>