{% extends "base.html" %}
{% block title %}Einstellungen{{ " - " + app_name() }}{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Einstellungen</h1>
</div>

<div class="card" style="margin-bottom: 1rem;">
    <div class="card-header"><h3>App-Name</h3></div>
    <form method="post" action="/einstellungen/app-name" style="display: flex; gap: 0.75rem; align-items: end;">
        <div style="flex: 1;">
            <label for="app_name" style="font-size: 0.85rem;">Name (wird in Sidebar und Titel angezeigt)</label>
            <input type="text" id="app_name" name="app_name" value="{{ app_name() }}" required style="margin: 0;">
        </div>
        <button type="submit" class="btn-sm" style="margin: 0; height: 2.4rem;">Speichern</button>
    </form>
</div>

<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem;">
    <a href="/einstellungen/import" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>📥 Daten-Import</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Kontakte aus Excel-Datei importieren</p>
    </a>
    <a href="/einstellungen/benutzer" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>👥 Benutzer</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Benutzerkonten verwalten</p>
    </a>
    <a href="/kontakte/export?format=excel" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>📤 Export</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Kontakte als Excel/CSV exportieren</p>
    </a>
    <a href="/einstellungen/branchen" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>&#x1F3ED; Branchen</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Branchen anlegen, umbenennen und sortieren</p>
    </a>
    <a href="/einstellungen/gruppen" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>&#x1F465; Gruppen</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Organisationsgruppen anlegen, bearbeiten und löschen</p>
    </a>
    <a href="/einstellungen/kategorien" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>&#x2699;&#xfe0f; Kategorien & Status</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Aktivitätsarten, Status-Werte, Typen verwalten</p>
    </a>
    <a href="/einstellungen/blacklist" class="card" style="text-decoration: none; color: var(--kw-text);">
        <h3>&#x1F6AB; Blacklist</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Gesperrte Kontakte (DSGVO) verwalten</p>
    </a>
    <div class="card">
        <h3>💾 Backup erstellen</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Datenbank, Uploads und Einstellungen als ZIP herunterladen</p>
        <a href="/einstellungen/backup" class="btn-sm" style="display: inline-block; margin-top: 0.5rem;">Backup herunterladen</a>
    </div>
    <div class="card">
        <h3>📂 Backup wiederherstellen</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Backup-ZIP hochladen und Daten wiederherstellen</p>
        <form method="post" action="/einstellungen/backup/wiederherstellen" enctype="multipart/form-data"
              onsubmit="return confirm('Achtung: Alle aktuellen Daten werden überschrieben! Fortfahren?');"
              style="display: flex; gap: 0.5rem; align-items: center; margin-top: 0.5rem;">
            <label class="file-upload-btn" style="font-size: 0.85rem;">
                ZIP wählen
                <input type="file" name="datei" accept=".zip" required style="display: none;"
                       onchange="this.parentElement.nextElementSibling.textContent = this.files[0]?.name || 'Keine Datei'">
            </label>
            <span style="font-size: 0.8rem; color: var(--kw-text-muted);">Keine Datei</span>
            <button type="submit" class="btn-sm">Wiederherstellen</button>
        </form>
    </div>
    <div class="card">
        <h3>🔄 Suchindex</h3>
        <p style="font-size: 0.85rem; color: var(--kw-text-muted);">Volltextindex neu aufbauen</p>
        <form method="post" action="/einstellungen/reindex">
            <button type="submit" class="btn-sm">Index neu aufbauen</button>
        </form>
    </div>
</div>
{% endblock %}
