{{-- resources/views/settings/index.blade.php --}}
@php
    /** @var \App\Models\Vehicle $vehicle */
    /** @var \App\Models\VehicleSetting $settings */

    $title = ($vehicle?->call_sign ?? 'RTW') . ' – Einstellungen';
    $pageTitle = 'Einstellungen';
    $pageSubtitle = 'Verhalten und Standardwerte pro Fahrzeug konfigurieren.';
@endphp

<x-ux-layout :title="$title" :pageTitle="$pageTitle" :pageSubtitle="$pageSubtitle">
    <div class="max-w-6xl space-y-6 mx-auto">
        @if (session('status'))
            <div class="rounded-2xl border border-emerald-200 bg-emerald-50 px-5 py-4 text-sm text-emerald-800">
                {{ session('status') }}
            </div>
        @endif

        <div class="overflow-hidden rounded-2xl border border-gray-200 bg-white shadow-sm">
            <div class="h-1 w-full bg-gradient-to-r from-brand via-brand/70 to-brand/30"></div>

            <form method="POST" action="{{ route('settings.update') }}" class="p-6 space-y-8">
                @csrf
                @method('PATCH')

                {{-- Abschnitt: Regeln --}}
                <div>
                    <div class="flex items-start justify-between gap-4">
                        <div>
                            <h2 class="text-base font-semibold text-gray-900">Regeln</h2>
                            <p class="mt-1 text-sm text-gray-600">Automatisches Verhalten basierend auf Schäden und
                                Fristen.</p>
                        </div>
                        <span
                            class="rounded-full bg-gray-50 px-2.5 py-1 text-xs font-semibold text-gray-600 ring-1 ring-gray-200">
                            {{ $vehicle->call_sign ?? 'RTW' }}
                        </span>
                    </div>

                    <div class="mt-4 space-y-3">
                        {{-- Toggle --}}
                        <label
                            class="flex items-start justify-between gap-4 rounded-2xl border border-gray-200 p-4 hover:bg-gray-50">
                            <div>
                                <div class="font-semibold text-gray-900">RTW automatisch „Nicht einsatzbereit“</div>
                                <div class="mt-1 text-sm text-gray-600">
                                    Wenn ein Schaden <span class="font-semibold">Kritisch</span> ist und einsatzrelevant
                                    markiert wird.
                                </div>
                            </div>

                            <input type="hidden" name="auto_set_not_ready_on_critical_damage" value="0">
                            <input type="checkbox" name="auto_set_not_ready_on_critical_damage" value="1"
                                @checked(old('auto_set_not_ready_on_critical_damage', (int) $settings->auto_set_not_ready_on_critical_damage) === 1)
                                class="mt-1 h-5 w-5 rounded border-gray-300 text-brand focus:ring-brand">
                        </label>
                        @error('auto_set_not_ready_on_critical_damage')
                            <div class="text-sm text-red-600">{{ $message }}</div>
                        @enderror

                        <label
                            class="flex items-start justify-between gap-4 rounded-2xl border border-gray-200 p-4 hover:bg-gray-50">
                            <div>
                                <div class="font-semibold text-gray-900">Benachrichtigung bei neuem Schaden</div>
                                <div class="mt-1 text-sm text-gray-600">Aktiviert Benachrichtigungen (später:
                                    Mail/Push).</div>
                            </div>

                            <input type="hidden" name="notify_on_new_damage" value="0">
                            <input type="checkbox" name="notify_on_new_damage" value="1"
                                @checked(old('notify_on_new_damage', (int) $settings->notify_on_new_damage) === 1)
                                class="mt-1 h-5 w-5 rounded border-gray-300 text-brand focus:ring-brand">
                        </label>
                        @error('notify_on_new_damage')
                            <div class="text-sm text-red-600">{{ $message }}</div>
                        @enderror

                        <label
                            class="flex items-start justify-between gap-4 rounded-2xl border border-gray-200 p-4 hover:bg-gray-50">
                            <div>
                                <div class="font-semibold text-gray-900">Benachrichtigung bei überfälligen Erinnerungen
                                </div>
                                <div class="mt-1 text-sm text-gray-600">Hilft Fristen sauber einzuhalten.</div>
                            </div>

                            <input type="hidden" name="notify_on_overdue_reminders" value="0">
                            <input type="checkbox" name="notify_on_overdue_reminders" value="1"
                                @checked(old('notify_on_overdue_reminders', (int) $settings->notify_on_overdue_reminders) === 1)
                                class="mt-1 h-5 w-5 rounded border-gray-300 text-brand focus:ring-brand">
                        </label>
                        @error('notify_on_overdue_reminders')
                            <div class="text-sm text-red-600">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                {{-- Abschnitt: Defaults --}}
                <div>
                    <h2 class="text-base font-semibold text-gray-900">Standardwerte</h2>
                    <p class="mt-1 text-sm text-gray-600">Voreinstellungen für neue Einträge.</p>

                    <div class="mt-4 rounded-2xl border border-gray-200 p-4">
                        <label class="text-sm font-medium text-gray-800">Standard-Priorität für Erinnerungen</label>
                        <select name="default_reminder_priority"
                            class="mt-2 w-full rounded-xl border-gray-200 bg-white py-2.5 text-sm focus:border-brand focus:ring-brand">
                            <option value="low" @selected(old('default_reminder_priority', $settings->default_reminder_priority) === 'low')>Niedrig</option>
                            <option value="normal" @selected(old('default_reminder_priority', $settings->default_reminder_priority) === 'normal')>Normal</option>
                            <option value="high" @selected(old('default_reminder_priority', $settings->default_reminder_priority) === 'high')>Hoch</option>
                        </select>
                        @error('default_reminder_priority')
                            <div class="mt-2 text-sm text-red-600">{{ $message }}</div>
                        @enderror
                    </div>
                </div>

                {{-- Actions --}}
                <div
                    class="flex flex-col-reverse gap-3 border-t border-gray-100 pt-5 sm:flex-row sm:items-center sm:justify-end">
                    <a href="{{ route('dashboard') }}"
                        class="inline-flex justify-center rounded-xl border border-gray-200 bg-white px-4 py-2.5 text-sm font-semibold text-gray-700 shadow-sm hover:bg-gray-50">
                        Abbrechen
                    </a>

                    <button type="submit"
                        class="inline-flex justify-center rounded-xl bg-brand px-4 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-brand-600 focus:outline-none focus:ring-4 focus:ring-brand/25">
                        Speichern
                    </button>
                </div>
            </form>
        </div>
    </div>
</x-ux-layout>