{{define "settings"}}
{{template "layout_start" .}}

<div class="page-header">
    <h2>Beállítások</h2>
</div>

<!-- Section A: System Configuration (read-only) -->
<div class="settings-card">
    <h3>Rendszer konfiguráció</h3>
    <p class="settings-card-desc">Az üzemeltető által beállított értékek. Módosításhoz kérd az üzemeltetőt.</p>
    <div class="settings-grid">
        <div class="settings-row">
            <span class="settings-label">Ügyfél azonosító</span>
            <span class="settings-value mono">{{.CustomerID}}</span>
        </div>
        <div class="settings-row">
            <span class="settings-label">Ügyfél neve</span>
            <span class="settings-value">{{.CustomerName}}</span>
        </div>
        <div class="settings-row">
            <span class="settings-label">Domain</span>
            <span class="settings-value mono">{{.CustomerDomain}}</span>
        </div>
        {{if .GitRepoURL}}
        <div class="settings-row">
            <span class="settings-label">Alkalmazás sablon forrás</span>
            <span class="settings-value mono settings-value-truncate">{{.GitRepoURL}}</span>
        </div>
        {{end}}
        <div class="settings-row">
            <span class="settings-label">Sablon szinkronizálás</span>
            <span class="settings-value mono">{{.GitSyncInterval}}</span>
        </div>
        <div class="settings-row">
            <span class="settings-label">Biztonsági mentés</span>
            <span class="settings-value">{{if .BackupEnabled}}<span class="state-text-green">✅ Aktív</span>{{else}}<span class="state-text-red">❌ Inaktív</span>{{end}}</span>
        </div>
        {{if .BackupEnabled}}
        <div class="settings-row">
            <span class="settings-label">Mentés ütemezés</span>
            <span class="settings-value mono">{{.DBDumpSchedule}} / {{.ResticSchedule}}</span>
        </div>
        {{end}}
        <div class="settings-row">
            <span class="settings-label">Monitoring</span>
            <span class="settings-value">{{if .MonitoringEnabled}}<span class="state-text-green">✅ Aktív</span>{{else}}<span class="state-text-red">❌ Inaktív</span>{{end}}</span>
        </div>
        {{if .MonitoringEnabled}}
        <div class="settings-row">
            <span class="settings-label">Healthchecks URL</span>
            <span class="settings-value mono settings-value-truncate">{{if .HealthchecksBase}}{{.HealthchecksBase}}{{else}}–{{end}}</span>
        </div>
        {{end}}
        <div class="settings-row">
            <span class="settings-label">Hub jelentés</span>
            <span class="settings-value">{{if .HubEnabled}}<span class="state-text-green">✅ Aktív</span>{{else}}–{{end}}</span>
        </div>
        <div class="settings-row">
            <span class="settings-label">Controller verzió</span>
            <span class="settings-value mono">v{{.Version}}</span>
        </div>
    </div>
</div>

<!-- Section B: Password Change -->
<div class="settings-card">
    <h3>Jelszó módosítás</h3>
    {{if .AuthEnabled}}
        {{if .PasswordError}}<div class="alert alert-error">{{.PasswordError}}</div>{{end}}
        <form method="POST" action="/settings/password">
            <div class="form-group">
                <label for="current_password">Jelenlegi jelszó</label>
                <input type="password" id="current_password" name="current_password" required
                       placeholder="Adja meg a jelenlegi jelszavát" class="form-control">
            </div>
            <div class="form-group">
                <label for="new_password">Új jelszó</label>
                <input type="password" id="new_password" name="new_password" required minlength="8"
                       placeholder="Legalább 8 karakter" class="form-control">
            </div>
            <div class="form-group">
                <label for="confirm_password">Új jelszó megerősítése</label>
                <input type="password" id="confirm_password" name="confirm_password" required minlength="8"
                       placeholder="Jelszó mégegyszer" class="form-control">
            </div>
            <button type="submit" class="btn btn-primary">Jelszó módosítása</button>
        </form>
    {{else}}
        <div class="alert alert-info">
            A jelszavas védelem nincs beállítva. Kérd az üzemeltetőt a beállításhoz.
        </div>
    {{end}}
</div>

<!-- Section C: Notification Preferences -->
<div class="settings-card">
    <h3>Értesítések</h3>
    {{if .HubEnabled}}
        {{if .NotificationSuccess}}<div class="alert alert-info">{{.NotificationSuccess}}</div>{{end}}
        {{if .NotificationError}}<div class="alert alert-error">{{.NotificationError}}</div>{{end}}
        <form method="POST" action="/settings/notifications">
            <div class="form-group">
                <label for="notification_email">E-mail cím</label>
                <input type="email" id="notification_email" name="notification_email"
                       value="{{with .NotificationPrefs}}{{.Email}}{{end}}"
                       placeholder="pelda@email.hu" class="form-control">
            </div>
            <div class="form-group">
                <label>Az alábbi eseményekről kapjon értesítést:</label>
                <div class="checkbox-group">
                    <label class="toggle">
                        <input type="checkbox" name="event_disk_warning" {{with .NotificationPrefs}}{{range .EnabledEvents}}{{if eq . "disk_warning"}}checked{{end}}{{end}}{{end}}>
                        <span class="toggle-label">Lemez figyelmeztetés (80%+)</span>
                    </label>
                    <label class="toggle">
                        <input type="checkbox" name="event_backup_failed" {{with .NotificationPrefs}}{{range .EnabledEvents}}{{if eq . "backup_failed"}}checked{{end}}{{end}}{{end}}>
                        <span class="toggle-label">Biztonsági mentés sikertelen</span>
                    </label>
                    <label class="toggle">
                        <input type="checkbox" name="event_update_available" {{with .NotificationPrefs}}{{range .EnabledEvents}}{{if eq . "update_available"}}checked{{end}}{{end}}{{end}}>
                        <span class="toggle-label">Frissítés elérhető</span>
                    </label>
                    <label class="toggle">
                        <input type="checkbox" name="event_security_update" {{with .NotificationPrefs}}{{range .EnabledEvents}}{{if eq . "security_update"}}checked{{end}}{{end}}{{end}}>
                        <span class="toggle-label">Biztonsági frissítés</span>
                    </label>
                </div>
            </div>
            <div class="form-group">
                <label for="cooldown_hours">Értesítési szünet</label>
                <div class="form-inline">
                    <input type="number" id="cooldown_hours" name="cooldown_hours" min="1" max="168"
                           value="{{with .NotificationPrefs}}{{.CooldownHours}}{{end}}"
                           class="form-control form-control-narrow">
                    <span class="form-hint">óra (azonos probléma esetén ennyi ideig nem küld újat)</span>
                </div>
            </div>
            <div class="form-actions">
                <button type="submit" class="btn btn-primary">Mentés</button>
                <button type="submit" formaction="/settings/notifications/test" class="btn btn-outline">Teszt email küldése</button>
            </div>
        </form>
    {{else}}
        <div class="alert alert-info">
            Az értesítések a központi rendszeren keresztül működnek, ami jelenleg nincs bekapcsolva.
        </div>
    {{end}}
</div>

{{template "layout_end" .}}
{{end}}