/**
 * Dateiverwaltung Frontend
 * Zwei getrennte Bereiche: Mail-Abruf und Datei-Sortierung
 */

// ============ API ============

async function api(endpoint, options = {}) {
    const response = await fetch(`/api${endpoint}`, {
        headers: { 'Content-Type': 'application/json', ...options.headers },
        ...options
    });
    if (!response.ok) {
        const error = await response.json().catch(() => ({}));
        throw new Error(error.detail || 'API Fehler');
    }
    return response.json();
}

// ============ Loading Overlay ============

function zeigeLoading(text = 'Wird geladen...') {
    document.getElementById('loading-text').textContent = text;
    document.getElementById('loading-overlay').classList.remove('hidden');
}

function versteckeLoading() {
    document.getElementById('loading-overlay').classList.add('hidden');
}

// ============ File Browser ============

let browserTargetInput = null;
let browserCurrentPath = '/mnt';

function oeffneBrowser(inputId) {
    browserTargetInput = inputId;
    const currentValue = document.getElementById(inputId).value;
    browserCurrentPath = currentValue || '/mnt';
    ladeBrowserInhalt(browserCurrentPath);
    document.getElementById('browser-modal').classList.remove('hidden');
}

async function ladeBrowserInhalt(path) {
    try {
        const data = await api(`/browse?path=${encodeURIComponent(path)}`);

        if (data.error) {
            document.getElementById('browser-list').innerHTML =
                `<li class="file-browser-item" style="color: var(--danger);">${data.error}</li>`;
            return;
        }

        browserCurrentPath = data.current;

        // Berechtigungen des aktuellen Ordners anzeigen
        const permStr = getPermissionString(data.readable, data.writable);
        document.getElementById('browser-current-path').innerHTML = `${escapeHtml(data.current)} <span class="perm-badge">${permStr}</span>`;

        let html = '';

        // Parent directory
        if (data.parent) {
            html += `<li class="file-browser-item" onclick="ladeBrowserInhalt('${data.parent}')">
                <span class="file-icon">📁</span> ..
            </li>`;
        }

        // Directories mit Berechtigungsanzeige
        for (const entry of data.entries) {
            const entryPermStr = getPermissionString(entry.readable, entry.writable);
            const permClass = !entry.readable ? 'perm-no-read' : (!entry.writable ? 'perm-no-write' : 'perm-ok');
            html += `<li class="file-browser-item ${permClass}" ondblclick="ladeBrowserInhalt('${entry.path}')" onclick="browserSelect(this, '${entry.path}')">
                <span class="file-icon">📁</span> ${escapeHtml(entry.name)} <span class="perm-badge-small">${entryPermStr}</span>
            </li>`;
        }

        if (data.entries.length === 0 && !data.parent) {
            html = '<li class="file-browser-item">Keine Unterordner</li>';
        }

        document.getElementById('browser-list').innerHTML = html;
    } catch (error) {
        document.getElementById('browser-list').innerHTML =
            `<li class="file-browser-item" style="color: var(--danger);">Fehler: ${error.message}</li>`;
    }
}

function getPermissionString(readable, writable) {
    if (readable && writable) return '✓ RW';
    if (readable && !writable) return '⚠ R';
    if (!readable) return '✗ ---';
    return '?';
}

function browserSelect(element, path) {
    document.querySelectorAll('.file-browser-item.selected').forEach(el => el.classList.remove('selected'));
    element.classList.add('selected');
    browserCurrentPath = path;
}

function browserAuswahl() {
    if (browserTargetInput && browserCurrentPath) {
        document.getElementById(browserTargetInput).value = browserCurrentPath + '/';
    }
    schliesseModal('browser-modal');
}

// ============ Checkbox Helpers ============

function getCheckedTypes(groupId) {
    const checkboxes = document.querySelectorAll(`#${groupId} input[type="checkbox"]:checked`);
    return Array.from(checkboxes).map(cb => cb.value);
}

function setCheckedTypes(groupId, types) {
    const checkboxes = document.querySelectorAll(`#${groupId} input[type="checkbox"]`);
    checkboxes.forEach(cb => {
        cb.checked = types.includes(cb.value);
    });
}

// ============ Init ============

document.addEventListener('DOMContentLoaded', () => {
    ladeTheme();  // Theme zuerst laden
    ladePostfaecher();
    ladeOrdner();
    ladeRegeln();
    ladeTypRegeln();  // Typ-Regeln für Schnell-Regeln Dropdown laden
    ladeOcrBackupEinstellungen();  // OCR-Backup Einstellungen laden
});

// ============ Theme Management ============

function ladeTheme() {
    const gespeichertesTheme = localStorage.getItem('theme') || 'auto';
    const select = document.getElementById('theme-select');
    if (select) {
        select.value = gespeichertesTheme;
    }
    wendeThemeAn(gespeichertesTheme);
}

function wechsleTheme(theme) {
    localStorage.setItem('theme', theme);
    wendeThemeAn(theme);
}

function wendeThemeAn(theme) {
    const html = document.documentElement;

    if (theme === 'auto') {
        // System-Präferenz nutzen
        html.removeAttribute('data-theme');
    } else if (theme === 'dark') {
        // Original Dark Theme (kein data-theme = default CSS)
        html.removeAttribute('data-theme');
        // Aber System-Präferenz überschreiben durch explizites Setzen
        html.setAttribute('data-theme', 'dark');
    } else {
        // Breeze Themes
        html.setAttribute('data-theme', theme);
    }
}

// Original Dark Theme explizit definieren
// (wird verwendet wenn "dark" gewählt ist, auch bei Light System-Präferenz)

// ============ BEREICH 1: Mail-Abruf ============

async function ladePostfaecher() {
    try {
        const postfaecher = await api('/postfaecher');
        renderPostfaecher(postfaecher);
    } catch (error) {
        console.error('Fehler:', error);
    }
}

let bearbeitetesPostfachId = null;

// Aktive Abrufe tracken
let aktiveAbrufe = {};

function renderPostfaecher(postfaecher) {
    const container = document.getElementById('postfaecher-liste');

    if (!postfaecher || postfaecher.length === 0) {
        container.innerHTML = '<p class="empty-state">Keine Postfächer konfiguriert</p>';
        return;
    }

    container.innerHTML = postfaecher.map(p => {
        const istAktiv = aktiveAbrufe[p.id];
        return `
        <div class="config-item" id="postfach-${p.id}">
            <div class="config-item-info">
                <h4>${escapeHtml(p.name)} ${istAktiv ? '<span class="badge badge-warning">Läuft...</span>' : ''}</h4>
                <small>${escapeHtml(p.email)} → ${escapeHtml(p.ziel_ordner)}</small>
            </div>
            <div class="config-item-actions">
                ${istAktiv
                    ? `<button class="btn btn-sm btn-danger" onclick="postfachAbrufStoppen(${p.id})">Stoppen</button>`
                    : `<button class="btn btn-sm" onclick="postfachAbrufen(${p.id})">Abrufen</button>`
                }
                <button class="btn btn-sm" onclick="postfachBearbeiten(${p.id})">Bearbeiten</button>
                <button class="btn btn-sm" onclick="postfachTesten(${p.id})">Testen</button>
                <button class="btn btn-sm btn-danger" onclick="postfachLoeschen(${p.id})">×</button>
            </div>
        </div>
    `}).join('');
}

function zeigePostfachModal(postfach = null) {
    bearbeitetesPostfachId = postfach?.id || null;

    document.getElementById('pf-name').value = postfach?.name || '';
    document.getElementById('pf-server').value = postfach?.imap_server || '';
    document.getElementById('pf-port').value = postfach?.imap_port || '993';
    document.getElementById('pf-email').value = postfach?.email || '';
    document.getElementById('pf-passwort').value = '';  // Passwort nicht vorausfüllen
    document.getElementById('pf-ordner').value = postfach?.ordner || 'INBOX';
    document.getElementById('pf-alle-ordner').value = postfach?.alle_ordner ? 'true' : 'false';
    // Datum formatieren für date input (YYYY-MM-DD)
    if (postfach?.ab_datum) {
        const d = new Date(postfach.ab_datum);
        document.getElementById('pf-ab-datum').value = d.toISOString().split('T')[0];
    } else {
        document.getElementById('pf-ab-datum').value = '';
    }
    document.getElementById('pf-ziel').value = postfach?.ziel_ordner || '/srv/http/dateiverwaltung/data/inbox/';
    setCheckedTypes('pf-typen-gruppe', postfach?.erlaubte_typen || ['.pdf']);
    document.getElementById('pf-max-groesse').value = postfach?.max_groesse_mb || '25';

    document.getElementById('postfach-modal').classList.remove('hidden');
}

async function postfachBearbeiten(id) {
    try {
        const postfaecher = await api('/postfaecher');
        const postfach = postfaecher.find(p => p.id === id);
        if (postfach) {
            zeigePostfachModal(postfach);
        }
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function speicherePostfach() {
    const erlaubteTypen = getCheckedTypes('pf-typen-gruppe');
    if (erlaubteTypen.length === 0) {
        alert('Bitte mindestens einen Dateityp auswählen');
        return;
    }

    // Datum konvertieren
    const abDatumValue = document.getElementById('pf-ab-datum').value;
    let abDatum = null;
    if (abDatumValue) {
        abDatum = new Date(abDatumValue).toISOString();
    }

    const data = {
        name: document.getElementById('pf-name').value.trim(),
        imap_server: document.getElementById('pf-server').value.trim(),
        imap_port: parseInt(document.getElementById('pf-port').value),
        email: document.getElementById('pf-email').value.trim(),
        passwort: document.getElementById('pf-passwort').value,
        ordner: document.getElementById('pf-ordner').value.trim(),
        alle_ordner: document.getElementById('pf-alle-ordner').value === 'true',
        ab_datum: abDatum,
        ziel_ordner: document.getElementById('pf-ziel').value.trim(),
        erlaubte_typen: erlaubteTypen,
        max_groesse_mb: parseInt(document.getElementById('pf-max-groesse').value)
    };

    if (!data.name || !data.imap_server || !data.email || !data.ziel_ordner) {
        alert('Bitte alle Pflichtfelder ausfüllen');
        return;
    }

    // Bei Bearbeitung: Passwort nur senden wenn eingegeben
    if (bearbeitetesPostfachId && !data.passwort) {
        delete data.passwort;
    } else if (!data.passwort) {
        alert('Passwort ist erforderlich');
        return;
    }

    try {
        if (bearbeitetesPostfachId) {
            await api(`/postfaecher/${bearbeitetesPostfachId}`, { method: 'PUT', body: JSON.stringify(data) });
        } else {
            await api('/postfaecher', { method: 'POST', body: JSON.stringify(data) });
        }
        schliesseModal('postfach-modal');
        ladePostfaecher();
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function postfachTesten(id) {
    try {
        const result = await api(`/postfaecher/${id}/test`, { method: 'POST' });
        alert(result.erfolg ? 'Verbindung erfolgreich!' : 'Fehler: ' + result.nachricht);
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function postfachAbrufen(id) {
    const logContainer = document.getElementById('abruf-log');
    logContainer.innerHTML = '<div class="log-entry info"><span>Verbinde...</span></div>';

    // Als aktiv markieren
    aktiveAbrufe[id] = true;
    ladePostfaecher();

    // EventSource für Server-Sent Events
    const eventSource = new EventSource(`/api/postfaecher/${id}/abrufen/stream`);
    aktiveAbrufe[id] = eventSource;  // EventSource speichern für Stopp
    let dateiCount = 0;
    let currentOrdner = '';

    eventSource.onmessage = (event) => {
        const data = JSON.parse(event.data);

        switch (data.type) {
            case 'start':
                logContainer.innerHTML = `<div class="log-entry info">
                    <span>Starte Abruf: ${escapeHtml(data.postfach)}</span>
                    <small>${data.bereits_verarbeitet} bereits verarbeitet</small>
                </div>`;
                break;

            case 'info':
                logContainer.innerHTML += `<div class="log-entry info">
                    <span>${escapeHtml(data.nachricht)}</span>
                </div>`;
                break;

            case 'ordner':
                currentOrdner = data.name;
                logContainer.innerHTML += `<div class="log-entry info" id="ordner-status">
                    <span>📁 ${escapeHtml(data.name)}</span>
                </div>`;
                break;

            case 'mails':
                const ordnerStatus = document.getElementById('ordner-status');
                if (ordnerStatus) {
                    ordnerStatus.innerHTML = `<span>📁 ${escapeHtml(data.ordner)}: ${data.anzahl} Mails</span>`;
                    ordnerStatus.id = '';  // ID entfernen für nächsten Ordner
                }
                break;

            case 'datei':
                dateiCount++;
                logContainer.innerHTML += `<div class="log-entry success">
                    <span>✓ ${escapeHtml(data.original_name)}</span>
                    <small>${formatBytes(data.groesse)}</small>
                </div>`;
                // Scroll nach unten
                logContainer.scrollTop = logContainer.scrollHeight;
                break;

            case 'skip':
                logContainer.innerHTML += `<div class="log-entry" style="opacity:0.6;">
                    <span>⊘ ${escapeHtml(data.datei)}: ${data.grund}</span>
                </div>`;
                break;

            case 'fehler':
                logContainer.innerHTML += `<div class="log-entry error">
                    <span>✗ ${escapeHtml(data.nachricht)}</span>
                </div>`;
                break;

            case 'abgebrochen':
                logContainer.innerHTML += `<div class="log-entry" style="color: var(--warning);">
                    <span>⚠ ${escapeHtml(data.nachricht)}</span>
                </div>`;
                break;

            case 'fertig':
                const msg = data.abgebrochen
                    ? `⚠ Abgebrochen: ${data.anzahl} Dateien gespeichert`
                    : `✓ Fertig: ${data.anzahl} Dateien gespeichert`;
                logContainer.innerHTML += `<div class="log-entry ${data.abgebrochen ? '' : 'success'}" style="font-weight:bold;">
                    <span>${msg}</span>
                </div>`;
                eventSource.close();
                delete aktiveAbrufe[id];
                ladePostfaecher();
                break;
        }
    };

    eventSource.onerror = (error) => {
        logContainer.innerHTML += `<div class="log-entry error">
            <span>✗ Verbindung unterbrochen</span>
        </div>`;
        eventSource.close();
        delete aktiveAbrufe[id];
        ladePostfaecher();
    };
}

async function postfachAbrufStoppen(id) {
    try {
        const result = await api(`/postfaecher/${id}/abrufen/stoppen`, { method: 'POST' });
        if (result.erfolg) {
            const logContainer = document.getElementById('abruf-log');
            logContainer.innerHTML += `<div class="log-entry" style="color: var(--warning);">
                <span>⚠ Stopp angefordert...</span>
            </div>`;
        }
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

function formatBytes(bytes) {
    if (bytes < 1024) return bytes + ' B';
    if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
    return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
}

async function allePostfaecherAbrufen() {
    try {
        zeigeLoading('Rufe alle Postfächer ab...');
        const result = await api('/postfaecher/abrufen-alle', { method: 'POST' });
        zeigeAbrufLog(result);
        ladePostfaecher();
    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}

async function postfachLoeschen(id) {
    if (!confirm('Postfach wirklich löschen?')) return;
    try {
        await api(`/postfaecher/${id}`, { method: 'DELETE' });
        ladePostfaecher();
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

function zeigeAbrufLog(result) {
    const container = document.getElementById('abruf-log');

    if (!result.ergebnisse || result.ergebnisse.length === 0) {
        container.innerHTML = '<p class="empty-state">Keine neuen Attachments gefunden</p>';
        return;
    }

    let html = '';
    for (const r of result.ergebnisse) {
        const status = r.fehler ? 'error' : 'success';
        const icon = r.fehler ? '✗' : '✓';
        html += `<div class="log-entry ${status}">
            <span>${icon} ${escapeHtml(r.postfach)}: ${r.anzahl || 0} Dateien</span>
            ${r.fehler ? `<small>${escapeHtml(r.fehler)}</small>` : ''}
        </div>`;

        if (r.dateien) {
            for (const d of r.dateien) {
                html += `<div class="log-entry info">
                    <span style="padding-left: 1rem;">→ ${escapeHtml(d)}</span>
                </div>`;
            }
        }
    }

    container.innerHTML = html;
}

// ============ BEREICH 2: Datei-Sortierung ============

async function ladeOrdner() {
    try {
        const ordner = await api('/ordner');
        renderOrdner(ordner);
    } catch (error) {
        console.error('Fehler:', error);
    }
}

function renderOrdner(ordner) {
    const container = document.getElementById('ordner-liste');

    if (!ordner || ordner.length === 0) {
        container.innerHTML = '<p class="empty-state">Keine Ordner konfiguriert</p>';
        return;
    }

    container.innerHTML = ordner.map(o => `
        <div class="config-item">
            <div class="config-item-info">
                <h4>${escapeHtml(o.name)} ${o.rekursiv ? '<span class="badge badge-info">rekursiv</span>' : ''}</h4>
                <small>${escapeHtml(o.pfad)} → ${escapeHtml(o.ziel_ordner)}</small>
                <small style="display:block;">${(o.dateitypen || []).join(', ')}</small>
            </div>
            <div class="config-item-actions">
                <button class="btn btn-sm" onclick="ordnerScannen(${o.id})">Scannen</button>
                <button class="btn btn-sm btn-danger" onclick="ordnerLoeschen(${o.id})">×</button>
            </div>
        </div>
    `).join('');
}

function zeigeOrdnerModal() {
    document.getElementById('ord-name').value = '';
    document.getElementById('ord-pfad').value = '/srv/http/dateiverwaltung/data/inbox/';
    document.getElementById('ord-ziel').value = '/srv/http/dateiverwaltung/data/archiv/';
    setCheckedTypes('ord-typen-gruppe', ['.pdf', '.jpg', '.jpeg', '.png', '.tiff']);
    document.getElementById('ord-rekursiv').value = 'true';
    document.getElementById('ordner-modal').classList.remove('hidden');
}

async function speichereOrdner() {
    const dateitypen = getCheckedTypes('ord-typen-gruppe');
    if (dateitypen.length === 0) {
        alert('Bitte mindestens einen Dateityp auswählen');
        return;
    }

    const data = {
        name: document.getElementById('ord-name').value.trim(),
        pfad: document.getElementById('ord-pfad').value.trim(),
        ziel_ordner: document.getElementById('ord-ziel').value.trim(),
        rekursiv: document.getElementById('ord-rekursiv').value === 'true',
        dateitypen: dateitypen
    };

    if (!data.name || !data.pfad || !data.ziel_ordner) {
        alert('Bitte alle Felder ausfüllen');
        return;
    }

    try {
        zeigeLoading('Speichere Ordner...');
        await api('/ordner', { method: 'POST', body: JSON.stringify(data) });
        schliesseModal('ordner-modal');
        ladeOrdner();
    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}

async function ordnerLoeschen(id) {
    if (!confirm('Ordner wirklich löschen?')) return;
    try {
        await api(`/ordner/${id}`, { method: 'DELETE' });
        ladeOrdner();
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function ordnerScannen(id) {
    try {
        const result = await api(`/ordner/${id}/scannen`);
        alert(`${result.anzahl} Dateien im Ordner gefunden`);
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

// ============ Regeln ============

let editierteRegelId = null;

// Verfügbare Typ-Regeln (vom Server geladen)
let verfuegbareTypRegeln = [];

async function ladeTypRegeln() {
    try {
        verfuegbareTypRegeln = await api('/typ-regeln');
    } catch (error) {
        console.error('Fehler beim Laden der Typ-Regeln:', error);
    }
}

async function ladeRegeln() {
    try {
        const regeln = await api('/regeln');
        renderRegeln(regeln);
    } catch (error) {
        console.error('Fehler:', error);
    }
}

function renderRegeln(regeln) {
    const schnellContainer = document.getElementById('schnell-regeln-liste');
    const feinContainer = document.getElementById('regeln-liste');

    // Regeln aufteilen: Typ-basierte (Schnell) vs. Inhalt-basierte (Fein)
    const schnellRegeln = [];
    const feinRegeln = [];

    for (const r of (regeln || [])) {
        const muster = r.muster || {};
        // Schnell-Regel wenn sie Typ-basierte Muster hat (ohne Keywords/Text-Match)
        const istTypRegel = (
            ('ist_zugferd' in muster || 'ist_signiert' in muster ||
             'ist_bild' in muster || 'ist_pdf' in muster ||
             'hat_text' in muster || 'dateityp_ist' in muster) &&
            !muster.keywords && !muster.text_match && !muster.text_match_any && !muster.text_regex
        );

        if (istTypRegel) {
            schnellRegeln.push(r);
        } else {
            feinRegeln.push(r);
        }
    }

    // Schnell-Regeln rendern (sortiert nach Priorität)
    schnellRegeln.sort((a, b) => a.prioritaet - b.prioritaet);

    if (schnellRegeln.length === 0) {
        schnellContainer.innerHTML = '<p class="empty-state">Keine Schnell-Regeln definiert</p>';
    } else {
        schnellContainer.innerHTML = schnellRegeln.map((r, index) => {
            const typBadge = getTypRegelBadge(r.muster);
            const istFallback = r.prioritaet >= 900;
            const fallbackClass = istFallback ? 'fallback-regel' : '';
            return `
            <div class="config-item typ-regel ${fallbackClass}" data-regel-id="${r.id}">
                <div class="config-item-info">
                    <h4>${escapeHtml(r.name)} <span class="badge badge-typ">Prio ${r.prioritaet}</span> ${typBadge}</h4>
                    <small>→ ${escapeHtml(r.unterordner || 'Zielordner')}</small>
                </div>
                <div class="config-item-actions">
                    <button class="btn btn-sm" onclick="regelPrioritaetAendern(${r.id}, -10)" title="Höhere Priorität">▲</button>
                    <button class="btn btn-sm" onclick="regelPrioritaetAendern(${r.id}, 10)" title="Niedrigere Priorität">▼</button>
                    <button class="btn btn-sm btn-danger" onclick="regelLoeschen(${r.id})">×</button>
                </div>
            </div>
        `}).join('');
    }

    // Fein-Regeln rendern (sortiert nach Priorität)
    feinRegeln.sort((a, b) => a.prioritaet - b.prioritaet);

    if (feinRegeln.length === 0) {
        feinContainer.innerHTML = '<p class="empty-state">Keine Fein-Regeln definiert</p>';
    } else {
        feinContainer.innerHTML = feinRegeln.map((r, index) => `
            <div class="config-item" data-regel-id="${r.id}">
                <div class="config-item-info">
                    <h4>${escapeHtml(r.name)} <span class="badge badge-info">Prio ${r.prioritaet}</span></h4>
                    <small>${escapeHtml(r.schema)}</small>
                </div>
                <div class="config-item-actions">
                    <button class="btn btn-sm" onclick="regelPrioritaetAendern(${r.id}, -10)" title="Höhere Priorität">▲</button>
                    <button class="btn btn-sm" onclick="regelPrioritaetAendern(${r.id}, 10)" title="Niedrigere Priorität">▼</button>
                    <button class="btn btn-sm" onclick="bearbeiteRegel(${r.id})">Bearbeiten</button>
                    <button class="btn btn-sm btn-danger" onclick="regelLoeschen(${r.id})">×</button>
                </div>
            </div>
        `).join('');
    }
}

function getTypRegelBadge(muster) {
    const badges = [];
    if (muster.ist_zugferd) badges.push('<span class="badge badge-success">ZUGFeRD</span>');
    if (muster.ist_signiert) badges.push('<span class="badge badge-warning">Signiert</span>');
    if (muster.ist_bild) badges.push('<span class="badge badge-info">Bild</span>');
    if (muster.ist_pdf) badges.push('<span class="badge badge-info">PDF</span>');
    if (muster.hat_text === false) badges.push('<span class="badge badge-secondary">Ohne Text</span>');
    return badges.join(' ');
}

// ============ Schnell-Regeln UI ============

function zeigeSchnellRegelModal() {
    // Dropdown befüllen
    const select = document.getElementById('schnell-regel-typ');
    select.innerHTML = '<option value="">-- Bitte wählen --</option>';

    for (const typ of verfuegbareTypRegeln) {
        select.innerHTML += `<option value="${typ.id}">${escapeHtml(typ.name)}</option>`;
    }

    // Details verstecken
    document.getElementById('schnell-regel-details').classList.add('hidden');
    document.getElementById('schnell-regel-speichern-btn').disabled = true;

    document.getElementById('schnell-regel-modal').classList.remove('hidden');
}

function schnellRegelTypGeaendert() {
    const typId = document.getElementById('schnell-regel-typ').value;
    const detailsDiv = document.getElementById('schnell-regel-details');
    const speichernBtn = document.getElementById('schnell-regel-speichern-btn');

    if (!typId) {
        detailsDiv.classList.add('hidden');
        speichernBtn.disabled = true;
        return;
    }

    const typ = verfuegbareTypRegeln.find(t => t.id === typId);
    if (!typ) return;

    // Details anzeigen
    document.getElementById('schnell-regel-name').textContent = typ.name;
    document.getElementById('schnell-regel-beschreibung').textContent = typ.beschreibung;
    document.getElementById('schnell-regel-muster').textContent = JSON.stringify(typ.muster);
    document.getElementById('schnell-regel-unterordner').value = typ.unterordner || '';
    document.getElementById('schnell-regel-prioritaet').value = typ.prioritaet || 10;

    detailsDiv.classList.remove('hidden');
    speichernBtn.disabled = false;
}

async function speichereSchnellRegel() {
    const typId = document.getElementById('schnell-regel-typ').value;
    const unterordner = document.getElementById('schnell-regel-unterordner').value.trim();
    const prioritaet = parseInt(document.getElementById('schnell-regel-prioritaet').value) || 10;

    if (!typId) {
        alert('Bitte Regel-Typ auswählen');
        return;
    }

    try {
        zeigeLoading('Erstelle Schnell-Regel...');
        await api('/regeln/typ', {
            method: 'POST',
            body: JSON.stringify({
                typ_id: typId,
                unterordner: unterordner || null,
                prioritaet: prioritaet
            })
        });
        schliesseModal('schnell-regel-modal');
        ladeRegeln();
    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}

// ============ Prioritäts-Verwaltung ============

async function regelPrioritaetAendern(regelId, delta) {
    try {
        // Aktuelle Regeln holen um Priorität zu finden
        const regeln = await api('/regeln');
        const regel = regeln.find(r => r.id === regelId);
        if (!regel) return;

        const neuePrio = Math.max(1, regel.prioritaet + delta);

        await api(`/regeln/${regelId}/prioritaet`, {
            method: 'PUT',
            body: JSON.stringify({ prioritaet: neuePrio })
        });

        ladeRegeln();
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

// ============ Datei-Browser für Regel-Unterordner ============

let regelBrowserQuellOrdner = null;

async function oeffneBrowserFuerRegel() {
    // Wenn Quell-Ordner konfiguriert sind, deren Ziel-Ordner als Basis nehmen
    try {
        const ordner = await api('/ordner');
        if (ordner.length > 0) {
            // Ersten konfigurierten Ziel-Ordner als Startpunkt
            browserCurrentPath = ordner[0].ziel_ordner || '/mnt';
            regelBrowserQuellOrdner = ordner[0];
        } else {
            browserCurrentPath = '/mnt';
        }

        browserTargetInput = 'regel-unterordner';
        ladeBrowserInhalt(browserCurrentPath);
        document.getElementById('browser-modal').classList.remove('hidden');
    } catch (error) {
        browserCurrentPath = '/mnt';
        browserTargetInput = 'regel-unterordner';
        ladeBrowserInhalt(browserCurrentPath);
        document.getElementById('browser-modal').classList.remove('hidden');
    }
}

function zeigeRegelModal(regel = null) {
    editierteRegelId = regel?.id || null;
    document.getElementById('regel-modal-title').textContent = regel ? 'Regel bearbeiten' : 'Regel hinzufügen';

    document.getElementById('regel-name').value = regel?.name || '';
    document.getElementById('regel-prioritaet').value = regel?.prioritaet || 100;
    document.getElementById('regel-muster').value = JSON.stringify(regel?.muster || {"text_match_any": [], "text_match": []}, null, 2);
    document.getElementById('regel-extraktion').value = JSON.stringify(regel?.extraktion || {}, null, 2);
    document.getElementById('regel-schema').value = regel?.schema || '{datum} - Dokument.pdf';
    document.getElementById('regel-unterordner').value = regel?.unterordner || '';
    document.getElementById('regel-test-text').value = '';
    document.getElementById('regel-test-ergebnis').classList.add('hidden');

    document.getElementById('regel-modal').classList.remove('hidden');
}

async function bearbeiteRegel(id) {
    try {
        const regeln = await api('/regeln');
        const regel = regeln.find(r => r.id === id);
        if (regel) zeigeRegelModal(regel);
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function speichereRegel() {
    let muster, extraktion;

    try {
        muster = JSON.parse(document.getElementById('regel-muster').value);
    } catch (e) {
        alert('Ungültiges JSON im Muster-Feld');
        return;
    }

    try {
        extraktion = JSON.parse(document.getElementById('regel-extraktion').value);
    } catch (e) {
        alert('Ungültiges JSON im Extraktion-Feld');
        return;
    }

    const data = {
        name: document.getElementById('regel-name').value.trim(),
        prioritaet: parseInt(document.getElementById('regel-prioritaet').value),
        muster,
        extraktion,
        schema: document.getElementById('regel-schema').value.trim(),
        unterordner: document.getElementById('regel-unterordner').value.trim() || null
    };

    if (!data.name) {
        alert('Bitte einen Namen eingeben');
        return;
    }

    try {
        if (editierteRegelId) {
            await api(`/regeln/${editierteRegelId}`, { method: 'PUT', body: JSON.stringify(data) });
        } else {
            await api('/regeln', { method: 'POST', body: JSON.stringify(data) });
        }
        schliesseModal('regel-modal');
        ladeRegeln();
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function regelLoeschen(id) {
    if (!confirm('Regel wirklich löschen?')) return;
    try {
        await api(`/regeln/${id}`, { method: 'DELETE' });
        ladeRegeln();
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

async function testeRegel() {
    const text = document.getElementById('regel-test-text').value;
    if (!text) {
        alert('Bitte Testtext eingeben');
        return;
    }

    let muster, extraktion;
    try {
        muster = JSON.parse(document.getElementById('regel-muster').value);
        extraktion = JSON.parse(document.getElementById('regel-extraktion').value);
    } catch (e) {
        alert('Ungültiges JSON');
        return;
    }

    const regel = {
        name: 'Test',
        muster,
        extraktion,
        schema: document.getElementById('regel-schema').value.trim()
    };

    try {
        const result = await api('/regeln/test', {
            method: 'POST',
            body: JSON.stringify({ regel, text })
        });

        const container = document.getElementById('regel-test-ergebnis');
        container.classList.remove('hidden', 'success', 'error');

        if (result.passt) {
            container.classList.add('success');
            container.textContent = `✓ Regel passt!\n\nExtrahiert:\n${JSON.stringify(result.extrahiert, null, 2)}\n\nDateiname:\n${result.dateiname}`;
        } else {
            container.classList.add('error');
            container.textContent = '✗ Regel passt nicht';
        }
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

// ============ Sortierung starten ============

let sortierungAktiv = false;
let sortierungEventSource = null;

// ============ OCR-Backup Einstellungen ============

function toggleOcrBackup() {
    const checkbox = document.getElementById('ocr-backup-aktiv');
    const ordnerGruppe = document.getElementById('ocr-backup-ordner-gruppe');

    if (checkbox.checked) {
        ordnerGruppe.classList.remove('hidden');
    } else {
        ordnerGruppe.classList.add('hidden');
    }

    // Einstellung im localStorage speichern
    localStorage.setItem('ocr-backup-aktiv', checkbox.checked);
    localStorage.setItem('ocr-backup-ordner', document.getElementById('ocr-backup-ordner').value);
}

function ladeOcrBackupEinstellungen() {
    const aktiv = localStorage.getItem('ocr-backup-aktiv') === 'true';
    const ordner = localStorage.getItem('ocr-backup-ordner') || '';

    const checkbox = document.getElementById('ocr-backup-aktiv');
    const input = document.getElementById('ocr-backup-ordner');
    const gruppe = document.getElementById('ocr-backup-ordner-gruppe');

    if (checkbox) {
        checkbox.checked = aktiv;
        if (aktiv) {
            gruppe.classList.remove('hidden');
        }
    }
    if (input) {
        input.value = ordner;
        // Event-Listener für Änderungen
        input.addEventListener('change', () => {
            localStorage.setItem('ocr-backup-ordner', input.value);
        });
    }
}

function oeffneBrowserFuerOcrBackup() {
    browserCurrentPath = '/mnt';
    browserTargetInput = 'ocr-backup-ordner';
    ladeBrowserInhalt(browserCurrentPath);
    document.getElementById('browser-modal').classList.remove('hidden');
}

async function sortierungStarten(testmodus = false) {
    const logContainer = document.getElementById('sortierung-log');
    const modeText = testmodus ? 'Starte Testlauf (keine Änderungen)...' : 'Starte Sortierung...';
    logContainer.innerHTML = `<div class="log-entry info"><span>${modeText}</span></div>`;

    // Button aktualisieren
    sortierungAktiv = true;
    aktualisiereSortierungsButtons();

    // URL mit optionalem Testmodus und Backup-Ordner bauen
    let url = '/api/sortierung/stream?';
    const params = [];
    if (testmodus) params.push('testmodus=true');

    // OCR-Backup-Ordner hinzufügen wenn aktiviert
    const backupAktiv = document.getElementById('ocr-backup-aktiv')?.checked;
    const backupOrdner = document.getElementById('ocr-backup-ordner')?.value?.trim();
    if (backupAktiv && backupOrdner) {
        params.push(`ocr_backup_ordner=${encodeURIComponent(backupOrdner)}`);
    }

    url += params.join('&');
    sortierungEventSource = new EventSource(url);

    let stats = { gesamt: 0, sortiert: 0, zugferd: 0, fehler: 0 };

    sortierungEventSource.onmessage = (event) => {
        const data = JSON.parse(event.data);
        const testBadge = data.testmodus ? '<span class="badge badge-warning">TEST</span> ' : '';

        switch (data.type) {
            case 'start':
                const modeInfo = data.testmodus
                    ? '🔍 TESTMODUS - Dateien werden nur analysiert, nicht verschoben!'
                    : 'Sortierung gestartet';
                logContainer.innerHTML = `<div class="log-entry info">
                    <span>${modeInfo}: ${data.ordner} Ordner, ${data.regeln} Regeln</span>
                </div>`;
                break;

            case 'ordner':
                logContainer.innerHTML += `<div class="log-entry info">
                    <span>📁 ${escapeHtml(data.name)}</span>
                    <small>${escapeHtml(data.pfad)}</small>
                </div>`;
                break;

            case 'dateien_gefunden':
                logContainer.innerHTML += `<div class="log-entry info">
                    <span>${data.anzahl} Dateien gefunden</span>
                </div>`;
                break;

            case 'datei':
                stats.gesamt++;
                let icon, statusClass, statusText;
                if (data.status === 'sortiert') {
                    stats.sortiert++;
                    icon = data.testmodus ? '→' : '✓';
                    statusClass = data.testmodus ? 'info' : 'success';
                    statusText = data.testmodus ? 'würde sortiert' : 'sortiert';
                } else if (data.status === 'zugferd') {
                    stats.zugferd++;
                    icon = '🧾';
                    statusClass = 'info';
                    statusText = data.testmodus ? 'ZUGFeRD erkannt' : 'ZUGFeRD';
                } else if (data.status === 'keine_regel') {
                    stats.fehler++;
                    icon = '?';
                    statusClass = '';
                    statusText = 'keine Regel';
                } else {
                    stats.fehler++;
                    icon = '✗';
                    statusClass = 'error';
                    statusText = 'Fehler';
                }

                // Zielordner im Testmodus anzeigen
                const zielInfo = data.testmodus && data.ziel_ordner
                    ? `<small style="display:block;opacity:0.7;">→ ${escapeHtml(data.ziel_ordner)}</small>`
                    : '';

                logContainer.innerHTML += `<div class="log-entry ${statusClass}">
                    <span>${testBadge}${icon} ${escapeHtml(data.neuer_name || data.original)}</span>
                    ${data.regel ? `<small>Regel: ${escapeHtml(data.regel)}</small>` : ''}
                    ${data.fehler ? `<small>${escapeHtml(data.fehler)}</small>` : ''}
                    ${zielInfo}
                </div>`;
                logContainer.scrollTop = logContainer.scrollHeight;
                break;

            case 'warnung':
                logContainer.innerHTML += `<div class="log-entry" style="color: var(--warning);">
                    <span>⚠ ${escapeHtml(data.nachricht)}</span>
                </div>`;
                break;

            case 'abgebrochen':
                logContainer.innerHTML += `<div class="log-entry" style="color: var(--warning); font-weight: bold;">
                    <span>⚠ Sortierung abgebrochen</span>
                </div>`;
                break;

            case 'fertig':
                const fertigText = data.testmodus
                    ? `🔍 Testlauf fertig: ${data.sortiert} würden sortiert, ${data.zugferd} ZUGFeRD, ${data.fehler} ohne Regel`
                    : `✓ Fertig: ${data.sortiert} sortiert, ${data.zugferd} ZUGFeRD, ${data.fehler} ohne Regel`;
                const fertigHint = data.testmodus
                    ? '<div class="log-entry" style="opacity:0.7;"><span>Keine Dateien wurden verschoben. Starte echte Sortierung wenn zufrieden.</span></div>'
                    : '';
                logContainer.innerHTML += `<div class="log-entry ${data.testmodus ? 'info' : 'success'}" style="font-weight:bold;">
                    <span>${fertigText}</span>
                </div>${fertigHint}`;
                sortierungEventSource.close();
                sortierungAktiv = false;
                sortierungEventSource = null;
                aktualisiereSortierungsButtons();
                break;
        }
    };

    sortierungEventSource.onerror = (error) => {
        logContainer.innerHTML += `<div class="log-entry error">
            <span>✗ Verbindung unterbrochen</span>
        </div>`;
        sortierungEventSource.close();
        sortierungAktiv = false;
        sortierungEventSource = null;
        aktualisiereSortierungsButtons();
    };
}

async function sortierungStoppen() {
    try {
        const result = await api('/sortierung/stoppen', { method: 'POST' });
        if (result.erfolg) {
            const logContainer = document.getElementById('sortierung-log');
            logContainer.innerHTML += `<div class="log-entry" style="color: var(--warning);">
                <span>⚠ Stopp angefordert...</span>
            </div>`;
        }
    } catch (error) {
        alert('Fehler: ' + error.message);
    }
}

function aktualisiereSortierungsButtons() {
    const startBtn = document.getElementById('sortierung-start-btn');
    const testBtn = document.getElementById('sortierung-test-btn');
    const stoppBtn = document.getElementById('sortierung-stopp-btn');

    if (startBtn && stoppBtn) {
        if (sortierungAktiv) {
            startBtn.classList.add('hidden');
            if (testBtn) testBtn.classList.add('hidden');
            stoppBtn.classList.remove('hidden');
        } else {
            startBtn.classList.remove('hidden');
            if (testBtn) testBtn.classList.remove('hidden');
            stoppBtn.classList.add('hidden');
        }
    }
}

function zeigeSortierungLog(result) {
    const container = document.getElementById('sortierung-log');

    if (!result.verarbeitet || result.verarbeitet.length === 0) {
        container.innerHTML = '<p class="empty-state">Keine Dateien verarbeitet</p>';
        return;
    }

    let html = `<div class="log-entry info">
        <span>Gesamt: ${result.gesamt} | Sortiert: ${result.sortiert} | ZUGFeRD: ${result.zugferd} | Fehler: ${result.fehler}</span>
    </div>`;

    for (const d of result.verarbeitet) {
        const status = d.fehler ? 'error' : (d.zugferd ? 'info' : 'success');
        const icon = d.fehler ? '✗' : (d.zugferd ? '🧾' : '✓');
        html += `<div class="log-entry ${status}">
            <span>${icon} ${escapeHtml(d.neuer_name || d.original)}</span>
            ${d.fehler ? `<small>${escapeHtml(d.fehler)}</small>` : ''}
        </div>`;
    }

    container.innerHTML = html;
}

// ============ Utilities ============

function schliesseModal(id) {
    document.getElementById(id).classList.add('hidden');
}

function escapeHtml(text) {
    if (!text) return '';
    const div = document.createElement('div');
    div.textContent = text;
    return div.innerHTML;
}

document.addEventListener('click', (e) => {
    if (e.target.classList.contains('modal')) {
        e.target.classList.add('hidden');
    }
});

document.addEventListener('keydown', (e) => {
    if (e.key === 'Escape') {
        document.querySelectorAll('.modal:not(.hidden)').forEach(m => m.classList.add('hidden'));
    }
});


// ============ Datenbank-Management ============

async function dbZuruecksetzen() {
    if (!confirm('Datenbank wirklich zurücksetzen?\n\nDies löscht alle Einträge über verarbeitete Mails und Dateien.\nPostfächer, Ordner und Regeln bleiben erhalten.\n\nBeim nächsten Abruf werden alle Mails erneut verarbeitet!')) {
        return;
    }

    try {
        zeigeLoading('Setze Datenbank zurück...');
        const result = await api('/db/reset', { method: 'POST' });

        if (result.erfolg) {
            alert(`Datenbank zurückgesetzt!\n\nGelöscht:\n- ${result.geloescht.mails} verarbeitete Mails\n- ${result.geloescht.dateien} verarbeitete Dateien`);
        } else {
            alert('Fehler: ' + result.nachricht);
        }
    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}

async function zeigeStatistik() {
    document.getElementById('statistik-modal').classList.remove('hidden');
    document.getElementById('statistik-inhalt').innerHTML = 'Wird geladen...';

    try {
        const stats = await api('/db/statistik');
        document.getElementById('statistik-inhalt').innerHTML = `
            <div class="statistik-grid">
                <div class="stat-item">
                    <span class="stat-label">Postfächer</span>
                    <span class="stat-value">${stats.postfaecher}</span>
                </div>
                <div class="stat-item">
                    <span class="stat-label">Quell-Ordner</span>
                    <span class="stat-value">${stats.quell_ordner}</span>
                </div>
                <div class="stat-item">
                    <span class="stat-label">Sortier-Regeln</span>
                    <span class="stat-value">${stats.regeln}</span>
                </div>
                <div class="stat-item">
                    <span class="stat-label">Verarbeitete Mails</span>
                    <span class="stat-value">${stats.verarbeitete_mails}</span>
                </div>
                <div class="stat-item">
                    <span class="stat-label">Verarbeitete Dateien</span>
                    <span class="stat-value">${stats.verarbeitete_dateien}</span>
                </div>
            </div>
        `;
    } catch (error) {
        document.getElementById('statistik-inhalt').innerHTML = `<p class="error">Fehler: ${error.message}</p>`;
    }
}


// ============ Regel-Hilfe ============

function zeigeRegelHilfe() {
    document.getElementById('hilfe-modal').classList.remove('hidden');
    document.getElementById('hilfe-text').value = '';
    document.getElementById('hilfe-ergebnis').classList.add('hidden');
}

// Speichert das letzte Analyse-Ergebnis
let letzteAnalyse = null;

// Standard-Regex-Muster für häufige Felder
const STANDARD_REGEX = {
    datum: [
        { label: 'DD.MM.YYYY', regex: '(\\d{2}\\.\\d{2}\\.\\d{4})' },
        { label: 'Rechnungsdatum: DD.MM.YYYY', regex: 'Rechnungsdatum[:\\s]*(\\d{2}\\.\\d{2}\\.\\d{4})' },
        { label: 'Datum: DD.MM.YYYY', regex: 'Datum[:\\s]*(\\d{2}\\.\\d{2}\\.\\d{4})' },
        { label: 'YYYY-MM-DD', regex: '(\\d{4}-\\d{2}-\\d{2})' }
    ],
    betrag: [
        { label: 'Gesamtbetrag: X,XX', regex: 'Gesamtbetrag[:\\s]*([\\d.,]+)' },
        { label: 'Summe: X,XX', regex: 'Summe[:\\s]*([\\d.,]+)' },
        { label: 'Rechnungsbetrag: X,XX', regex: 'Rechnungsbetrag[:\\s]*([\\d.,]+)' },
        { label: 'Total: X,XX', regex: 'Total[:\\s]*([\\d.,]+)' },
        { label: 'Brutto: X,XX', regex: 'Brutto[:\\s]*([\\d.,]+)' },
        { label: 'Netto: X,XX', regex: 'Netto[:\\s]*([\\d.,]+)' },
        { label: 'EUR X,XX (letzter)', regex: 'EUR\\s*([\\d.,]+)(?!.*EUR\\s*[\\d.,]+)' }
    ],
    nummer: [
        { label: 'Rechnungsnummer: XXX', regex: 'Rechnungsnummer[:\\s]*(\\S+)' },
        { label: 'Rechnung Nr. XXX', regex: 'Rechnung\\s*(?:Nr\\.?|Nummer)?[:\\s]*(\\S+)' },
        { label: 'Belegnummer: XXX', regex: 'Belegnummer[:\\s]*(\\S+)' },
        { label: 'Bestellnummer: XXX', regex: 'Bestellnummer[:\\s]*(\\S+)' },
        { label: 'Dokumentnummer: XXX', regex: 'Dokumentnummer[:\\s]*(\\S+)' }
    ]
};

async function analysiereText() {
    const text = document.getElementById('hilfe-text').value.trim();
    if (!text) {
        alert('Bitte Text eingeben oder Datei hochladen');
        return;
    }

    try {
        zeigeLoading('Analysiere Text...');
        const result = await api('/extraktion/test', {
            method: 'POST',
            body: JSON.stringify({ text: text })
        });

        letzteAnalyse = result;

        const container = document.getElementById('hilfe-analyse');
        container.innerHTML = `
            <h5>Automatisch extrahierte Felder:</h5>
            <pre>${JSON.stringify(result.extrahiert, null, 2)}</pre>
            <p style="color: var(--warning); font-size: 0.8rem; margin-top: 0.5rem;">
                Falls Werte falsch sind, passe unten die Regex-Muster an!
            </p>
        `;

        // Felder vorausfüllen wenn gefunden
        document.getElementById('hilfe-firma').value = result.extrahiert.firma || '';

        // Standard-Regex vorausfüllen basierend auf erkannten Werten
        if (result.extrahiert.datum) {
            // Prüfen welches Muster gepasst haben könnte
            document.getElementById('hilfe-datum-regex').value = STANDARD_REGEX.datum[0].regex;
        } else {
            document.getElementById('hilfe-datum-regex').value = STANDARD_REGEX.datum[0].regex;
        }

        if (result.extrahiert.betrag) {
            document.getElementById('hilfe-betrag-regex').value = STANDARD_REGEX.betrag[0].regex;
        } else {
            document.getElementById('hilfe-betrag-regex').value = STANDARD_REGEX.betrag[0].regex;
        }

        if (result.extrahiert.nummer) {
            document.getElementById('hilfe-nummer-regex').value = STANDARD_REGEX.nummer[0].regex;
        } else {
            document.getElementById('hilfe-nummer-regex').value = STANDARD_REGEX.nummer[0].regex;
        }

        // Keywords aus ersten erkennbaren Wörtern
        const words = text.split(/\s+/).filter(w => w.length > 4 && /^[a-zA-ZäöüÄÖÜß]+$/.test(w));
        document.getElementById('hilfe-keywords').value = words.slice(0, 3).join(', ').toLowerCase();

        document.getElementById('hilfe-ergebnis').classList.remove('hidden');
        document.getElementById('hilfe-regel-vorschau').classList.add('hidden');
    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}

async function testeMitRegex() {
    const text = document.getElementById('hilfe-text').value.trim();
    if (!text) {
        alert('Bitte erst Text eingeben');
        return;
    }

    const firma = document.getElementById('hilfe-firma').value.trim();
    const datumRegex = document.getElementById('hilfe-datum-regex').value.trim();
    const betragRegex = document.getElementById('hilfe-betrag-regex').value.trim();
    const nummerRegex = document.getElementById('hilfe-nummer-regex').value.trim();

    try {
        zeigeLoading('Teste Regex...');

        // Custom Regex an Backend senden
        const result = await api('/extraktion/test-custom', {
            method: 'POST',
            body: JSON.stringify({
                text: text,
                firma: firma,
                datum_regex: datumRegex,
                betrag_regex: betragRegex,
                nummer_regex: nummerRegex
            })
        });

        letzteAnalyse = result;

        const container = document.getElementById('hilfe-analyse');
        container.innerHTML = `
            <h5>Extrahierte Felder (mit deinen Regex):</h5>
            <pre>${JSON.stringify(result.extrahiert, null, 2)}</pre>
            ${result.fehler ? `<p style="color: var(--danger);">Fehler: ${escapeHtml(result.fehler)}</p>` : ''}
        `;

    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}

function erstelleRegelAusHilfe() {
    const firma = document.getElementById('hilfe-firma').value.trim();
    const datumRegex = document.getElementById('hilfe-datum-regex').value.trim();
    const betragRegex = document.getElementById('hilfe-betrag-regex').value.trim();
    const nummerRegex = document.getElementById('hilfe-nummer-regex').value.trim();
    const keywords = document.getElementById('hilfe-keywords').value.trim();

    if (!keywords) {
        alert('Bitte mindestens Keywords für die Erkennung eingeben');
        return;
    }

    // Regel-Objekt bauen
    const regel = {
        name: firma ? `${firma} Rechnung` : 'Neue Regel',
        prioritaet: 50,
        muster: {
            text_match: keywords.split(',').map(k => k.trim().toLowerCase()).filter(k => k)
        },
        extraktion: {},
        schema: '{datum} - Rechnung - {firma} - {nummer} - {betrag} EUR.pdf',
        unterordner: firma ? firma.toLowerCase().replace(/[^a-z0-9]/g, '_') : null
    };

    // Extraktion hinzufügen
    if (firma) {
        regel.extraktion.firma = { wert: firma };
    }
    if (datumRegex) {
        regel.extraktion.datum = { regex: datumRegex };
    }
    if (betragRegex) {
        regel.extraktion.betrag = { regex: betragRegex, typ: 'betrag' };
    }
    if (nummerRegex) {
        regel.extraktion.nummer = { regex: nummerRegex };
    }

    // Vorschau anzeigen
    const jsonStr = JSON.stringify(regel, null, 2);
    document.getElementById('hilfe-regel-json').textContent = jsonStr;
    document.getElementById('hilfe-regel-vorschau').classList.remove('hidden');

    // In Regel-Modal übernehmen Button
    if (confirm('Regel übernehmen und im Editor öffnen?')) {
        // Modal schließen
        schliesseModal('hilfe-modal');

        // Regel-Modal öffnen und befüllen
        editierteRegelId = null;
        document.getElementById('regel-modal-title').textContent = 'Regel hinzufügen';
        document.getElementById('regel-name').value = regel.name;
        document.getElementById('regel-prioritaet').value = regel.prioritaet;
        document.getElementById('regel-muster').value = JSON.stringify(regel.muster, null, 2);
        document.getElementById('regel-extraktion').value = JSON.stringify(regel.extraktion, null, 2);
        document.getElementById('regel-schema').value = regel.schema;
        document.getElementById('regel-unterordner').value = regel.unterordner || '';
        document.getElementById('regel-test-text').value = document.getElementById('hilfe-text').value;
        document.getElementById('regel-test-ergebnis').classList.add('hidden');

        document.getElementById('regel-modal').classList.remove('hidden');
    }
}

async function ladeHilfeDatei(input) {
    const file = input.files[0];
    if (!file) return;

    if (file.type === 'text/plain') {
        // TXT Datei direkt lesen
        const reader = new FileReader();
        reader.onload = (e) => {
            document.getElementById('hilfe-text').value = e.target.result;
        };
        reader.readAsText(file);
    } else if (file.type === 'application/pdf') {
        // PDF serverseitig verarbeiten
        try {
            zeigeLoading('Extrahiere Text aus PDF...');
            const formData = new FormData();
            formData.append('file', file);

            const response = await fetch('/api/extraktion/upload-pdf', {
                method: 'POST',
                body: formData
            });

            if (!response.ok) {
                const error = await response.json().catch(() => ({}));
                throw new Error(error.detail || 'PDF-Verarbeitung fehlgeschlagen');
            }

            const result = await response.json();
            document.getElementById('hilfe-text').value = result.text || '';

            if (result.ocr_durchgefuehrt) {
                alert('Text wurde per OCR extrahiert (Bild-PDF erkannt)');
            }

            // Automatisch analysieren nach Upload
            versteckeLoading();
            await analysiereText();
            return; // Loading wird in analysiereText() gehandelt
        } catch (error) {
            alert('Fehler beim PDF-Upload: ' + error.message);
        } finally {
            versteckeLoading();
        }
    }

    // Input zurücksetzen für erneuten Upload
    input.value = '';
}

// Regex-Preset aus Dropdown übernehmen
function setzeRegexPreset(typ) {
    const select = document.getElementById(`hilfe-${typ}-preset`);
    const input = document.getElementById(`hilfe-${typ}-regex`);
    if (select.value) {
        input.value = select.value;
    }
    select.value = ''; // Reset dropdown
}

// ============ Datei-Browser für PDFs aus Quell-Ordnern ============

let pdfBrowserOrdner = [];

async function zeigePdfBrowser() {
    document.getElementById('pdf-browser-modal').classList.remove('hidden');
    document.getElementById('pdf-browser-liste').innerHTML = 'Lade Ordner...';

    try {
        // Quell-Ordner laden
        const ordner = await api('/ordner');
        pdfBrowserOrdner = ordner;

        if (ordner.length === 0) {
            document.getElementById('pdf-browser-liste').innerHTML =
                '<p class="empty-state">Keine Quell-Ordner konfiguriert</p>';
            return;
        }

        // Ordner-Auswahl anzeigen
        let html = '<div class="pdf-ordner-auswahl">';
        html += '<label>Ordner auswählen:</label>';
        html += '<select id="pdf-browser-ordner" onchange="ladePdfDateien()">';
        html += '<option value="">-- Ordner wählen --</option>';
        for (const o of ordner) {
            html += `<option value="${o.id}">${escapeHtml(o.name)} (${escapeHtml(o.pfad)})</option>`;
        }
        html += '</select></div>';
        html += '<div id="pdf-dateien-liste" class="pdf-dateien-liste"></div>';

        document.getElementById('pdf-browser-liste').innerHTML = html;
    } catch (error) {
        document.getElementById('pdf-browser-liste').innerHTML =
            `<p class="error">Fehler: ${escapeHtml(error.message)}</p>`;
    }
}

async function ladePdfDateien() {
    const ordnerId = document.getElementById('pdf-browser-ordner').value;
    const container = document.getElementById('pdf-dateien-liste');

    if (!ordnerId) {
        container.innerHTML = '';
        return;
    }

    container.innerHTML = 'Scanne Ordner...';

    try {
        const result = await api(`/ordner/${ordnerId}/scannen`);

        if (!result.dateien || result.dateien.length === 0) {
            container.innerHTML = '<p class="empty-state">Keine Dateien im Ordner</p>';
            return;
        }

        // Ordner-Daten für Pfad-Konstruktion
        const ordner = pdfBrowserOrdner.find(o => o.id == ordnerId);
        const basePfad = ordner?.pfad || '';

        let html = `<p>${result.anzahl} Dateien gefunden:</p><ul class="pdf-file-list">`;
        for (const datei of result.dateien) {
            const fullPath = basePfad + (basePfad.endsWith('/') ? '' : '/') + datei;
            html += `<li class="pdf-file-item" onclick="waehleServerPdf('${escapeHtml(fullPath)}')" title="${escapeHtml(fullPath)}">
                <span class="file-icon">📄</span> ${escapeHtml(datei)}
            </li>`;
        }
        html += '</ul>';

        container.innerHTML = html;
    } catch (error) {
        container.innerHTML = `<p class="error">Fehler: ${escapeHtml(error.message)}</p>`;
    }
}

async function waehleServerPdf(pfad) {
    try {
        zeigeLoading('Extrahiere Text aus PDF...');

        const response = await api('/extraktion/from-file', {
            method: 'POST',
            body: JSON.stringify({ pfad: pfad })
        });

        document.getElementById('hilfe-text').value = response.text || '';
        schliesseModal('pdf-browser-modal');

        if (response.ocr_durchgefuehrt) {
            alert('Text wurde per OCR extrahiert (Bild-PDF erkannt)');
        }

        // Automatisch analysieren nach Auswahl
        versteckeLoading();
        await analysiereText();
        return;
    } catch (error) {
        alert('Fehler: ' + error.message);
    } finally {
        versteckeLoading();
    }
}