{% extends "base.html" %}
{% block title %}Optionen | Nouri{% endblock %}
{% block content %}
<section class="page-intro">
    <div>
        <p class="eyebrow">Optionen</p>
        <h1>Ruhige Einstellungen für Alltag, Sicherung und iPhone-Nutzung</h1>
        <p class="lead">Hier lässt sich festlegen, wann Einkäufe vorbereitet werden, welche Hinweise hilfreich sind und wie Nouri sich auf dem Home-Bildschirm oder beim Backup verhalten soll.</p>
    </div>
</section>

<section class="two-column">
    <article class="panel">
        <div class="panel-head">
            <h2>Einkaufstag</h2>
        </div>
        <form method="post" class="stack-form">
            {{ csrf_input() }}
            <input type="hidden" name="form_name" value="household">
            <label>
                Wochentag für den Großeinkauf
                <select name="shopping_weekday">
                    {% for value, label in weekday_options %}
                        <option value="{{ value }}" {% if household_settings.shopping_weekday == value %}selected{% endif %}>{{ label }}</option>
                    {% endfor %}
                </select>
            </label>
            <label>
                So viele Tage vorher vorbereiten
                <input type="number" min="0" max="7" name="shopping_prep_days" value="{{ household_settings.shopping_prep_days }}">
            </label>
            <label>
                Erinnerung ungefähr um
                <input type="time" name="shopping_reminder_time" value="{{ household_settings.shopping_reminder_time }}">
            </label>
            <div class="form-actions">
                <button type="submit">Speichern</button>
            </div>
        </form>
    </article>

    <article class="panel">
        <div class="panel-head">
            <h2>Für den Homescreen</h2>
        </div>
        <div class="stack-sections">
            <div class="pwa-card">
                <strong>Auf dem iPhone installieren</strong>
                <p class="muted">Öffne Nouri in Safari, tippe auf Teilen und dann auf <em>Zum Home-Bildschirm</em>. Danach startet Nouri deutlich app-näher und ruhiger.</p>
            </div>
            <div class="pwa-card">
                <strong>Offline etwas stabiler</strong>
                <p class="muted">Die wichtigsten Oberflächen und Brand-Dateien bleiben lokal greifbar. Wenn das Netz kurz weg ist, wirkt die App dadurch stabiler und klarer.</p>
            </div>
            <div class="pwa-card">
                <strong>Push-Mitteilungen</strong>
                {% if push_ready %}
                    <p class="muted">Push ist vorbereitet. Wenn du möchtest, kannst du es auf diesem Gerät freigeben und mit einer Test-Mitteilung prüfen.</p>
                    <div class="row-actions">
                        <button class="secondary" type="button" data-push-enable>Push erlauben</button>
                        <button class="ghost-button" type="button" data-push-disable>Push beenden</button>
                    </div>
                    <form method="post">
                        {{ csrf_input() }}
                        <input type="hidden" name="form_name" value="push_test">
                        <button class="ghost-button" type="submit">Test-Mitteilung senden</button>
                    </form>
                    <small class="helper-text">{{ push_subscription_count }} aktives Gerät{% if push_subscription_count != 1 %}e{% endif %}</small>
                {% else %}
                    <p class="muted">Push wird sichtbar, sobald VAPID-Schlüssel für diese App gesetzt sind.</p>
                    {% if push_public_key_value %}
                        <small class="helper-text">Öffentlicher Schlüssel erkannt, privater Schlüssel fehlt noch.</small>
                    {% endif %}
                {% endif %}
            </div>
        </div>
    </article>
</section>

<section class="panel">
    <div class="panel-head">
        <h2>Erinnerungen und Hinweise</h2>
    </div>
    <form method="post" class="stack-form">
        {{ csrf_input() }}
        <input type="hidden" name="form_name" value="reminders">

        <div class="settings-grid">
            <fieldset>
                <legend>Grundsätzlich</legend>
                <label class="inline-check"><input type="checkbox" name="reminders_enabled" value="1" {% if user_settings.reminders_enabled %}checked{% endif %}><span>Erinnerungen insgesamt nutzen</span></label>
                <label class="inline-check"><input type="checkbox" name="push_enabled" value="1" {% if user_settings.push_enabled %}checked{% endif %}><span>Push-Mitteilungen erlauben</span></label>
                <label>
                    Hinweise zeigen als
                    <select name="notification_channel">
                        {% for value, label in notification_channel_options %}
                            <option value="{{ value }}" {% if user_settings.notification_channel == value %}selected{% endif %}>{{ label }}</option>
                        {% endfor %}
                    </select>
                </label>
            </fieldset>

            <fieldset>
                <legend>Einkauf</legend>
                <label class="inline-check"><input type="checkbox" name="remind_before_shopping" value="1" {% if user_settings.remind_before_shopping %}checked{% endif %}><span>Am Tag vor dem Einkauf erinnern</span></label>
                <label class="inline-check"><input type="checkbox" name="remind_on_shopping_day" value="1" {% if user_settings.remind_on_shopping_day %}checked{% endif %}><span>Am Einkaufstag erinnern</span></label>
                <label class="inline-check"><input type="checkbox" name="show_missing_for_upcoming_week" value="1" {% if user_settings.show_missing_for_upcoming_week %}checked{% endif %}><span>Fehlende Dinge für die kommende Woche zeigen</span></label>
                <label class="inline-check"><input type="checkbox" name="show_planned_not_shopped" value="1" {% if user_settings.show_planned_not_shopped %}checked{% endif %}><span>Geplante, aber noch nicht eingekaufte Dinge zeigen</span></label>
            </fieldset>

            <fieldset>
                <legend>Planung</legend>
                <label class="inline-check"><input type="checkbox" name="remind_tomorrow_if_sparse" value="1" {% if user_settings.remind_tomorrow_if_sparse %}checked{% endif %}><span>Für morgen erinnern, wenn noch wenig geplant ist</span></label>
                <label class="inline-check"><input type="checkbox" name="remind_week_if_sparse" value="1" {% if user_settings.remind_week_if_sparse %}checked{% endif %}><span>Für die Woche erinnern, wenn noch wenig eingeplant ist</span></label>
                <label class="inline-check"><input type="checkbox" name="suggest_home_for_today" value="1" {% if user_settings.suggest_home_for_today %}checked{% endif %}><span>Passende Dinge aus Zuhause vorschlagen</span></label>
                <label class="inline-check"><input type="checkbox" name="show_meal_balancing" value="1" {% if user_settings.show_meal_balancing %}checked{% endif %}><span>Zum Abrunden von Mahlzeiten kleine Vorschläge zeigen</span></label>
            </fieldset>

            <fieldset>
                <legend>Alltag</legend>
                <label class="inline-check"><input type="checkbox" name="remind_small_snack" value="1" {% if user_settings.remind_small_snack %}checked{% endif %}><span>An kleine Zwischenmahlzeiten erinnern</span></label>
                <label class="inline-check"><input type="checkbox" name="remind_nuts" value="1" {% if user_settings.remind_nuts %}checked{% endif %}><span>Heute schon an Nüsse gedacht?</span></label>
                <label class="inline-check"><input type="checkbox" name="suggest_templates" value="1" {% if user_settings.suggest_templates %}checked{% endif %}><span>Häufig genutzte Tages- und Wochenvorlagen vorschlagen</span></label>
                <label class="inline-check"><input type="checkbox" name="suggest_patterns" value="1" {% if user_settings.suggest_patterns %}checked{% endif %}><span>Wiederkehrende Muster vorschlagen</span></label>
            </fieldset>
        </div>

        <div class="form-actions">
            <button type="submit">Speichern</button>
            <a class="ghost-button" href="{{ url_for('auth.profile') }}">Zum Profil</a>
        </div>
    </form>
</section>

{% if is_admin() %}
    <section class="two-column">
        <article class="panel">
            <div class="panel-head">
                <h2>Backup exportieren</h2>
            </div>
            <div class="stack-sections">
                <div class="pwa-card">
                    <strong>Komplettes App-Backup</strong>
                    <p class="muted">Das ZIP enthält Nutzer, Einstellungen, Lebensmittel, Mahlzeiten, Vorlagen, Planungen, Einkaufsdaten und hochgeladene Bilder.</p>
                    <a class="button" href="{{ url_for('main.backup_export') }}">Backup herunterladen</a>
                </div>
            </div>
        </article>

        <article class="panel">
            <div class="panel-head">
                <h2>Backup wiederherstellen</h2>
            </div>
            <form method="post" action="{{ url_for('main.backup_restore') }}" class="stack-form" enctype="multipart/form-data">
                {{ csrf_input() }}
                <div class="restore-warning">
                    <strong>Nur bewusst verwenden</strong>
                    <p class="muted">Die Wiederherstellung ersetzt den aktuellen Datenstand dieses Haushalts. Vorher am besten selbst noch ein frisches Backup herunterladen.</p>
                </div>
                <label>
                    Backup-Datei
                    <input type="file" name="backup_file" accept=".zip" required>
                </label>
                <label>
                    Zur Bestätigung bitte {{ restore_confirmation_text }} eintragen
                    <input type="text" name="restore_confirmation" placeholder="{{ restore_confirmation_text }}" required>
                </label>
                <div class="form-actions">
                    <button type="submit">Backup wiederherstellen</button>
                </div>
            </form>
        </article>
    </section>
{% endif %}
{% endblock %}