{% 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, Einkauf und Erinnerungen</h1>
        <p class="lead">Hier lässt sich festlegen, wann Einkäufe vorbereitet werden, welche Hinweise hilfreich sind und ob Nouri sich wie eine App auf dem Home-Bildschirm 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>
            <button type="submit">Speichern</button>
        </form>
    </article>

    <article class="panel">
        <div class="panel-head">
            <h2>Home-Bildschirm & Push</h2>
        </div>
        <div class="stack-sections">
            <div class="pwa-card">
                <strong>Als Web-App nutzen</strong>
                <p class="muted">Auf dem iPhone kannst du Nouri über Teilen → Zum Home-Bildschirm hinzufügen. Danach wirkt die App deutlich app-näher.</p>
            </div>
            <div class="pwa-card">
                <strong>Push-Mitteilungen</strong>
                {% if push_ready %}
                    <p class="muted">Push ist vorbereitet. Du kannst es auf diesem Gerät freigeben und später testweise 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 die App gesetzt sind.</p>
                {% 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>
{% endblock %}