Protokoll #12402

{
    "event": "PreToolUse",
    "tool_name": "Edit",
    "tool_input": {
        "file_path": "\/var\/www\/dev.campus.systemische-tools.de\/src\/View\/content\/show.php",
        "old_string": "\/* Generate Button Animation *\/\n.generate-btn .btn-text { display: inline; }\n.generate-btn .btn-loading { display: none; gap: 3px; justify-content: center; align-items: center; }\n.generate-btn.is-loading .btn-text { display: none; }\n.generate-btn.is-loading .btn-loading { display: inline-flex; }\n.generate-btn .btn-loading span {\n    width: 6px; height: 6px;\n    background: currentColor;\n    border-radius: 50%;\n    animation: btn-bounce 1.4s infinite ease-in-out both;\n}\n.generate-btn .btn-loading span:nth-child(1) { animation-delay: -0.32s; }\n.generate-btn .btn-loading span:nth-child(2) { animation-delay: -0.16s; }\n.generate-btn .btn-loading span:nth-child(3) { animation-delay: 0s; }\n@keyframes btn-bounce {\n    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }\n    40% { transform: scale(1); opacity: 1; }\n}\n<\/style>\n\n<script>\ndocument.body.addEventListener('htmx:beforeRequest', function(evt) {\n    if (evt.detail.elt.classList.contains('generate-form')) {\n        const btn = evt.detail.elt.querySelector('.generate-btn');\n        if (btn) {\n            btn.disabled = true;\n            btn.classList.add('is-loading');\n        }\n    }\n});\n<\/script>",
        "new_string": "\/* Button Loading Animation *\/\n.generate-btn .btn-text,\n.critique-btn .btn-text,\n.revise-btn .btn-text { display: inline; }\n.generate-btn .btn-loading,\n.critique-btn .btn-loading,\n.revise-btn .btn-loading { display: none; gap: 3px; justify-content: center; align-items: center; }\n.generate-btn.is-loading .btn-text,\n.critique-btn.is-loading .btn-text,\n.revise-btn.is-loading .btn-text { display: none; }\n.generate-btn.is-loading .btn-loading,\n.critique-btn.is-loading .btn-loading,\n.revise-btn.is-loading .btn-loading { display: inline-flex; }\n.generate-btn .btn-loading span,\n.critique-btn .btn-loading span,\n.revise-btn .btn-loading span {\n    width: 6px; height: 6px;\n    background: currentColor;\n    border-radius: 50%;\n    animation: btn-bounce 1.4s infinite ease-in-out both;\n}\n.generate-btn .btn-loading span:nth-child(1),\n.critique-btn .btn-loading span:nth-child(1),\n.revise-btn .btn-loading span:nth-child(1) { animation-delay: -0.32s; }\n.generate-btn .btn-loading span:nth-child(2),\n.critique-btn .btn-loading span:nth-child(2),\n.revise-btn .btn-loading span:nth-child(2) { animation-delay: -0.16s; }\n.generate-btn .btn-loading span:nth-child(3),\n.critique-btn .btn-loading span:nth-child(3),\n.revise-btn .btn-loading span:nth-child(3) { animation-delay: 0s; }\n@keyframes btn-bounce {\n    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }\n    40% { transform: scale(1); opacity: 1; }\n}\n<\/style>\n\n<script>\ndocument.body.addEventListener('htmx:beforeRequest', function(evt) {\n    var form = evt.detail.elt;\n    var btnClass = null;\n    if (form.classList.contains('generate-form')) btnClass = '.generate-btn';\n    if (form.classList.contains('critique-form')) btnClass = '.critique-btn';\n    if (form.classList.contains('revise-form')) btnClass = '.revise-btn';\n\n    if (btnClass) {\n        var btn = form.querySelector(btnClass);\n        if (btn) {\n            btn.disabled = true;\n            btn.classList.add('is-loading');\n        }\n        \/\/ Show loading info in target\n        var targetId = form.getAttribute('hx-target');\n        if (targetId === '#critique-result') {\n            document.getElementById('critique-result').innerHTML =\n                '<div class=\"loading-box\">' +\n                '<div class=\"loading-spinner\"><span><\/span><span><\/span><span><\/span><\/div>' +\n                '<p><strong>Kritiker analysieren Content...<\/strong><\/p>' +\n                '<p class=\"loading-info\">Faktenpruefer, Stilist und Strukturanalyst pruefen den Text. Dies dauert 30-120 Sekunden.<\/p>' +\n                '<\/div>';\n        }\n    }\n});\n<\/script>\n\n<style>\n.loading-box {\n    background: var(--color-bg-muted);\n    border: 1px solid var(--color-border);\n    border-radius: 8px;\n    padding: var(--space-lg);\n    text-align: center;\n    margin: var(--space-md) 0;\n}\n.loading-spinner {\n    display: inline-flex;\n    gap: 4px;\n    margin-bottom: var(--space-sm);\n}\n.loading-spinner span {\n    width: 10px; height: 10px;\n    background: var(--color-primary);\n    border-radius: 50%;\n    animation: btn-bounce 1.4s infinite ease-in-out both;\n}\n.loading-spinner span:nth-child(1) { animation-delay: -0.32s; }\n.loading-spinner span:nth-child(2) { animation-delay: -0.16s; }\n.loading-spinner span:nth-child(3) { animation-delay: 0s; }\n.loading-info {\n    font-size: 0.85rem;\n    color: var(--color-text-muted);\n    margin-top: var(--space-xs);\n}\n<\/style>"
    }
}

{
    "tool_response": {
        "filePath": "\/var\/www\/dev.campus.systemische-tools.de\/src\/View\/content\/show.php",
        "oldString": "\/* Generate Button Animation *\/\n.generate-btn .btn-text { display: inline; }\n.generate-btn .btn-loading { display: none; gap: 3px; justify-content: center; align-items: center; }\n.generate-btn.is-loading .btn-text { display: none; }\n.generate-btn.is-loading .btn-loading { display: inline-flex; }\n.generate-btn .btn-loading span {\n    width: 6px; height: 6px;\n    background: currentColor;\n    border-radius: 50%;\n    animation: btn-bounce 1.4s infinite ease-in-out both;\n}\n.generate-btn .btn-loading span:nth-child(1) { animation-delay: -0.32s; }\n.generate-btn .btn-loading span:nth-child(2) { animation-delay: -0.16s; }\n.generate-btn .btn-loading span:nth-child(3) { animation-delay: 0s; }\n@keyframes btn-bounce {\n    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }\n    40% { transform: scale(1); opacity: 1; }\n}\n<\/style>\n\n<script>\ndocument.body.addEventListener('htmx:beforeRequest', function(evt) {\n    if (evt.detail.elt.classList.contains('generate-form')) {\n        const btn = evt.detail.elt.querySelector('.generate-btn');\n        if (btn) {\n            btn.disabled = true;\n            btn.classList.add('is-loading');\n        }\n    }\n});\n<\/script>",
        "newString": "\/* Button Loading Animation *\/\n.generate-btn .btn-text,\n.critique-btn .btn-text,\n.revise-btn .btn-text { display: inline; }\n.generate-btn .btn-loading,\n.critique-btn .btn-loading,\n.revise-btn .btn-loading { display: none; gap: 3px; justify-content: center; align-items: center; }\n.generate-btn.is-loading .btn-text,\n.critique-btn.is-loading .btn-text,\n.revise-btn.is-loading .btn-text { display: none; }\n.generate-btn.is-loading .btn-loading,\n.critique-btn.is-loading .btn-loading,\n.revise-btn.is-loading .btn-loading { display: inline-flex; }\n.generate-btn .btn-loading span,\n.critique-btn .btn-loading span,\n.revise-btn .btn-loading span {\n    width: 6px; height: 6px;\n    background: currentColor;\n    border-radius: 50%;\n    animation: btn-bounce 1.4s infinite ease-in-out both;\n}\n.generate-btn .btn-loading span:nth-child(1),\n.critique-btn .btn-loading span:nth-child(1),\n.revise-btn .btn-loading span:nth-child(1) { animation-delay: -0.32s; }\n.generate-btn .btn-loading span:nth-child(2),\n.critique-btn .btn-loading span:nth-child(2),\n.revise-btn .btn-loading span:nth-child(2) { animation-delay: -0.16s; }\n.generate-btn .btn-loading span:nth-child(3),\n.critique-btn .btn-loading span:nth-child(3),\n.revise-btn .btn-loading span:nth-child(3) { animation-delay: 0s; }\n@keyframes btn-bounce {\n    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }\n    40% { transform: scale(1); opacity: 1; }\n}\n<\/style>\n\n<script>\ndocument.body.addEventListener('htmx:beforeRequest', function(evt) {\n    var form = evt.detail.elt;\n    var btnClass = null;\n    if (form.classList.contains('generate-form')) btnClass = '.generate-btn';\n    if (form.classList.contains('critique-form')) btnClass = '.critique-btn';\n    if (form.classList.contains('revise-form')) btnClass = '.revise-btn';\n\n    if (btnClass) {\n        var btn = form.querySelector(btnClass);\n        if (btn) {\n            btn.disabled = true;\n            btn.classList.add('is-loading');\n        }\n        \/\/ Show loading info in target\n        var targetId = form.getAttribute('hx-target');\n        if (targetId === '#critique-result') {\n            document.getElementById('critique-result').innerHTML =\n                '<div class=\"loading-box\">' +\n                '<div class=\"loading-spinner\"><span><\/span><span><\/span><span><\/span><\/div>' +\n                '<p><strong>Kritiker analysieren Content...<\/strong><\/p>' +\n                '<p class=\"loading-info\">Faktenpruefer, Stilist und Strukturanalyst pruefen den Text. Dies dauert 30-120 Sekunden.<\/p>' +\n                '<\/div>';\n        }\n    }\n});\n<\/script>\n\n<style>\n.loading-box {\n    background: var(--color-bg-muted);\n    border: 1px solid var(--color-border);\n    border-radius: 8px;\n    padding: var(--space-lg);\n    text-align: center;\n    margin: var(--space-md) 0;\n}\n.loading-spinner {\n    display: inline-flex;\n    gap: 4px;\n    margin-bottom: var(--space-sm);\n}\n.loading-spinner span {\n    width: 10px; height: 10px;\n    background: var(--color-primary);\n    border-radius: 50%;\n    animation: btn-bounce 1.4s infinite ease-in-out both;\n}\n.loading-spinner span:nth-child(1) { animation-delay: -0.32s; }\n.loading-spinner span:nth-child(2) { animation-delay: -0.16s; }\n.loading-spinner span:nth-child(3) { animation-delay: 0s; }\n.loading-info {\n    font-size: 0.85rem;\n    color: var(--color-text-muted);\n    margin-top: var(--space-xs);\n}\n<\/style>",
        "originalFile": "<?php\nob_start();\n$orderModel = $order['model'] ?? 'claude-sonnet-4-20250514';\n$orderCollections = json_decode($order['collections'] ?? '[\"documents\"]', true) ?: ['documents'];\n$orderContextLimit = (int) ($order['context_limit'] ?? 5);\n$isGenerating = ($order['generation_status'] ?? 'idle') === 'generating';\n$orderId = $order['id'];\n?>\n\n<nav class=\"breadcrumb\">\n    <a href=\"\/content\">Content Studio<\/a> &raquo; Auftrag #<?= $order['id'] ?>\n<\/nav>\n\n<h1><?= htmlspecialchars($order['title']) ?><\/h1>\n\n<div class=\"info-grid\">\n    <div class=\"info-card\">\n        <h3>Auftrag<\/h3>\n        <dl class=\"info-list\">\n            <dt>ID<\/dt><dd><?= $order['id'] ?><\/dd>\n            <dt>Status<\/dt><dd><span class=\"badge badge--<?= $order['status'] ?>\"><?= $order['status'] ?><\/span><\/dd>\n            <dt>Erstellt<\/dt><dd><?= $order['created_at'] ?><\/dd>\n        <\/dl>\n    <\/div>\n    <div class=\"info-card\">\n        <h3>KI-Einstellungen<\/h3>\n        <dl class=\"info-list\">\n            <dt>Modell<\/dt><dd><?= htmlspecialchars($models[$orderModel] ?? $orderModel) ?><\/dd>\n            <dt>Collections<\/dt><dd><?= htmlspecialchars(implode(', ', $orderCollections)) ?><\/dd>\n            <dt>Quellen<\/dt><dd><?= $orderContextLimit ?><\/dd>\n        <\/dl>\n    <\/div>\n    <div class=\"info-card\">\n        <h3>Content-Config<\/h3>\n        <dl class=\"info-list\">\n            <dt>Profil<\/dt><dd><?= htmlspecialchars($order['profile_name'] ?? '-') ?><\/dd>\n            <dt>Contract<\/dt><dd><?= htmlspecialchars($order['contract_name'] ?? '-') ?><\/dd>\n            <dt>Struktur<\/dt><dd><?= htmlspecialchars($order['structure_name'] ?? '-') ?><\/dd>\n        <\/dl>\n    <\/div>\n<\/div>\n\n<h2>Briefing<\/h2>\n<div class=\"briefing-box\"><?= nl2br(htmlspecialchars($order['briefing'])) ?><\/div>\n\n<h2>Aktionen<\/h2>\n<div class=\"action-cards\">\n    <!-- Basis-Aktionen -->\n    <div class=\"action-card\">\n        <div class=\"action-card__header\">Auftrag<\/div>\n        <div class=\"action-card__body\">\n            <a href=\"\/content\/<?= $order['id'] ?>\/edit\" class=\"btn btn--full\">Bearbeiten<\/a>\n        <\/div>\n    <\/div>\n\n    <?php if (!$latestVersion): ?>\n    <!-- Content Generieren -->\n    <div class=\"action-card action-card--primary\">\n        <div class=\"action-card__header\">Content generieren<\/div>\n        <div class=\"action-card__desc\">Erstellt Content basierend auf Briefing und RAG-Quellen<\/div>\n        <form method=\"POST\" action=\"\/content\/<?= $order['id'] ?>\/generate\" class=\"action-card__body generate-form\" id=\"generate-form\"\n              hx-post=\"\/content\/<?= $order['id'] ?>\/generate\"\n              hx-target=\"#content-result\"\n              hx-swap=\"innerHTML\"\n              hx-disabled-elt=\"find button\">\n            <?= $csrfField ?>\n            <div class=\"form-row\">\n                <label class=\"form-label\">KI-Modell<\/label>\n                <select name=\"model\" class=\"form-select\" <?= $isGenerating ? 'disabled' : '' ?>>\n                    <?php foreach ($models ?? [] as $modelId => $modelName): ?>\n                    <option value=\"<?= $modelId ?>\" <?= $modelId === $orderModel ? 'selected' : '' ?>><?= htmlspecialchars($modelName) ?><\/option>\n                    <?php endforeach; ?>\n                <\/select>\n            <\/div>\n            <div class=\"form-row\">\n                <label class=\"form-label\">Wissens-Quelle<\/label>\n                <?php\n                $collections = $availableCollections ?? [];\n                $selected = $orderCollections;\n                $name = 'collection';\n                $variant = 'block';\n                $multiple = false;\n                include __DIR__ . '\/..\/partials\/form\/collections-select.php';\n                ?>\n            <\/div>\n            <div class=\"form-row\">\n                <label class=\"form-label\">Kontext-Limit<\/label>\n                <select name=\"context_limit\" class=\"form-select\" <?= $isGenerating ? 'disabled' : '' ?>>\n                    <option value=\"3\" <?= $orderContextLimit === 3 ? 'selected' : '' ?>>3 Quellen<\/option>\n                    <option value=\"5\" <?= $orderContextLimit === 5 ? 'selected' : '' ?>>5 Quellen<\/option>\n                    <option value=\"10\" <?= $orderContextLimit === 10 ? 'selected' : '' ?>>10 Quellen<\/option>\n                    <option value=\"15\" <?= $orderContextLimit === 15 ? 'selected' : '' ?>>15 Quellen<\/option>\n                <\/select>\n            <\/div>\n            <button type=\"submit\" class=\"btn btn--primary btn--full generate-btn <?= $isGenerating ? 'is-loading' : '' ?>\" <?= $isGenerating ? 'disabled' : '' ?>>\n                <span class=\"btn-text\">Generieren<\/span>\n                <span class=\"btn-loading\"><span><\/span><span><\/span><span><\/span><\/span>\n            <\/button>\n        <\/form>\n    <\/div>\n    <?php endif; ?>\n\n    <?php if ($latestVersion): ?>\n    <!-- Kritik-Runde -->\n    <div class=\"action-card\">\n        <div class=\"action-card__header\">Kritik-Runde<\/div>\n        <div class=\"action-card__desc\">\n            Alle aktiven Kritiker pruefen den Content:\n            <a href=\"\/critics\" class=\"action-link\">Faktenpruefer, Stilist, Strukturanalyst<\/a>\n        <\/div>\n        <form method=\"POST\" action=\"\/content\/<?= $order['id'] ?>\/critique\" class=\"action-card__body critique-form\"\n              hx-post=\"\/content\/<?= $order['id'] ?>\/critique\"\n              hx-target=\"#critique-result\"\n              hx-swap=\"innerHTML\"\n              hx-disabled-elt=\"find button\">\n            <?= $csrfField ?>\n            <div class=\"form-row\">\n                <label class=\"form-label\">KI-Modell fuer Kritik<\/label>\n                <select name=\"model\" class=\"form-select\">\n                    <?php foreach ($models ?? [] as $modelId => $modelName): ?>\n                    <option value=\"<?= $modelId ?>\" <?= $modelId === $orderModel ? 'selected' : '' ?>><?= htmlspecialchars($modelName) ?><\/option>\n                    <?php endforeach; ?>\n                <\/select>\n            <\/div>\n            <button type=\"submit\" class=\"btn btn--light btn--full critique-btn\">\n                <span class=\"btn-text\">Kritik starten<\/span>\n                <span class=\"btn-loading\"><span><\/span><span><\/span><span><\/span><\/span>\n            <\/button>\n        <\/form>\n    <\/div>\n\n    <!-- Revision -->\n    <div class=\"action-card\">\n        <div class=\"action-card__header\">Revision erstellen<\/div>\n        <div class=\"action-card__desc\">Ueberarbeitet Content basierend auf dem Kritik-Feedback<\/div>\n        <form method=\"POST\" action=\"\/content\/<?= $order['id'] ?>\/revise\" class=\"action-card__body\"\n              hx-post=\"\/content\/<?= $order['id'] ?>\/revise\"\n              hx-target=\"#content-result\"\n              hx-swap=\"innerHTML\">\n            <?= $csrfField ?>\n            <div class=\"form-row\">\n                <label class=\"form-label\">KI-Modell fuer Revision<\/label>\n                <select name=\"model\" class=\"form-select\">\n                    <?php foreach ($models ?? [] as $modelId => $modelName): ?>\n                    <option value=\"<?= $modelId ?>\" <?= $modelId === $orderModel ? 'selected' : '' ?>><?= htmlspecialchars($modelName) ?><\/option>\n                    <?php endforeach; ?>\n                <\/select>\n            <\/div>\n            <button type=\"submit\" class=\"btn btn--light btn--full\">Revision erstellen<\/button>\n        <\/form>\n    <\/div>\n\n    <!-- Freigabe -->\n    <?php if (in_array($order['status'], ['validate', 'critique', 'revision'])): ?>\n    <div class=\"action-card\">\n        <div class=\"action-card__header\">Freigabe<\/div>\n        <div class=\"action-card__desc\">Content genehmigen oder zurueck zu Entwurf<\/div>\n        <div class=\"action-card__body action-card__buttons\">\n            <button class=\"btn btn--success btn--full\" hx-post=\"\/content\/<?= $order['id'] ?>\/approve\" hx-swap=\"none\" hx-on::after-request=\"location.reload()\" hx-headers='{\"X-CSRF-TOKEN\": \"<?= $csrfToken ?>\"}'>Genehmigen<\/button>\n            <button class=\"btn btn--danger btn--full\" hx-post=\"\/content\/<?= $order['id'] ?>\/decline\" hx-swap=\"none\" hx-on::after-request=\"location.reload()\" hx-headers='{\"X-CSRF-TOKEN\": \"<?= $csrfToken ?>\"}'>Ablehnen<\/button>\n        <\/div>\n    <\/div>\n    <?php endif; ?>\n    <?php endif; ?>\n<\/div>\n\n<div id=\"content-result\">\n<?php if ($isGenerating): ?>\n    <?php include __DIR__ . '\/partials\/generating.php'; ?>\n<?php endif; ?>\n<\/div>\n<div id=\"critique-result\"><\/div>\n\n<?php if ($latestVersion):\n    $contentData = json_decode($latestVersion['content'], true);\n    $contentText = is_array($contentData) ? ($contentData['text'] ?? '') : $latestVersion['content'];\n    ?>\n<h2>Content (Version <?= $latestVersion['version_number'] ?>)<\/h2>\n<div class=\"result-box\">\n    <div class=\"result-box__header\">\n        <strong>Version <?= $latestVersion['version_number'] ?><\/strong>\n        <span><?= date('d.m.Y H:i', strtotime($latestVersion['created_at'])) ?><\/span>\n    <\/div>\n    <div class=\"result-box__content\">\n        <pre><?= htmlspecialchars($contentText) ?><\/pre>\n    <\/div>\n<\/div>\n<?php endif; ?>\n\n<?php if (!empty($critiques)): ?>\n<h2>Kritiken<\/h2>\n<table data-sortable>\n    <thead>\n        <tr>\n            <th data-sort=\"round\">Runde<\/th>\n            <th data-sort=\"critic\">Kritiker<\/th>\n            <th data-sort=\"rating\">Bewertung<\/th>\n            <th data-sort=\"status\">Status<\/th>\n            <th data-sort=\"summary\">Zusammenfassung<\/th>\n        <\/tr>\n    <\/thead>\n    <tbody>\n        <?php foreach ($critiques as $c): ?>\n        <tr>\n            <td><?= $c['round'] ?? '-' ?><\/td>\n            <td><?= htmlspecialchars($c['critic_name'] ?? '-') ?><\/td>\n            <td><?= $c['rating'] ?? '-' ?>\/10<\/td>\n            <td><span class=\"badge badge--<?= ($c['passed'] ?? false) ? 'completed' : 'failed' ?>\"><?= ($c['passed'] ?? false) ? 'Bestanden' : 'Offen' ?><\/span><\/td>\n            <td><?= htmlspecialchars($c['summary'] ?? '-') ?><\/td>\n        <\/tr>\n        <?php endforeach; ?>\n    <\/tbody>\n<\/table>\n<?php endif; ?>\n\n<?php if (!empty($sources)): ?>\n<h2>Quellen (RAG)<\/h2>\n<table data-sortable>\n    <thead>\n        <tr>\n            <th data-sort=\"document\">Dokum... [TRUNCATED-44d6d2abb73053d1]",
        "structuredPatch": [
            {
                "oldStart": 344,
                "oldLines": 20,
                "newStart": 344,
                "newLines": 36,
                "lines": [
                    "     justify-content: center;",
                    " }",
                    " ",
                    "-\/* Generate Button Animation *\/",
                    "-.generate-btn .btn-text { display: inline; }",
                    "-.generate-btn .btn-loading { display: none; gap: 3px; justify-content: center; align-items: center; }",
                    "-.generate-btn.is-loading .btn-text { display: none; }",
                    "-.generate-btn.is-loading .btn-loading { display: inline-flex; }",
                    "-.generate-btn .btn-loading span {",
                    "+\/* Button Loading Animation *\/",
                    "+.generate-btn .btn-text,",
                    "+.critique-btn .btn-text,",
                    "+.revise-btn .btn-text { display: inline; }",
                    "+.generate-btn .btn-loading,",
                    "+.critique-btn .btn-loading,",
                    "+.revise-btn .btn-loading { display: none; gap: 3px; justify-content: center; align-items: center; }",
                    "+.generate-btn.is-loading .btn-text,",
                    "+.critique-btn.is-loading .btn-text,",
                    "+.revise-btn.is-loading .btn-text { display: none; }",
                    "+.generate-btn.is-loading .btn-loading,",
                    "+.critique-btn.is-loading .btn-loading,",
                    "+.revise-btn.is-loading .btn-loading { display: inline-flex; }",
                    "+.generate-btn .btn-loading span,",
                    "+.critique-btn .btn-loading span,",
                    "+.revise-btn .btn-loading span {",
                    "     width: 6px; height: 6px;",
                    "     background: currentColor;",
                    "     border-radius: 50%;",
                    "     animation: btn-bounce 1.4s infinite ease-in-out both;",
                    " }",
                    "-.generate-btn .btn-loading span:nth-child(1) { animation-delay: -0.32s; }",
                    "-.generate-btn .btn-loading span:nth-child(2) { animation-delay: -0.16s; }",
                    "-.generate-btn .btn-loading span:nth-child(3) { animation-delay: 0s; }",
                    "+.generate-btn .btn-loading span:nth-child(1),",
                    "+.critique-btn .btn-loading span:nth-child(1),",
                    "+.revise-btn .btn-loading span:nth-child(1) { animation-delay: -0.32s; }",
                    "+.generate-btn .btn-loading span:nth-child(2),",
                    "+.critique-btn .btn-loading span:nth-child(2),",
                    "+.revise-btn .btn-loading span:nth-child(2) { animation-delay: -0.16s; }",
                    "+.generate-btn .btn-loading span:nth-child(3),",
                    "+.critique-btn .btn-loading span:nth-child(3),",
                    "+.revise-btn .btn-loading span:nth-child(3) { animation-delay: 0s; }",
                    " @keyframes btn-bounce {",
                    "     0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }",
                    "     40% { transform: scale(1); opacity: 1; }"
                ]
            },
            {
                "oldStart": 366,
                "oldLines": 15,
                "newStart": 382,
                "newLines": 61,
                "lines": [
                    " ",
                    " <script>",
                    " document.body.addEventListener('htmx:beforeRequest', function(evt) {",
                    "-    if (evt.detail.elt.classList.contains('generate-form')) {",
                    "-        const btn = evt.detail.elt.querySelector('.generate-btn');",
                    "+    var form = evt.detail.elt;",
                    "+    var btnClass = null;",
                    "+    if (form.classList.contains('generate-form')) btnClass = '.generate-btn';",
                    "+    if (form.classList.contains('critique-form')) btnClass = '.critique-btn';",
                    "+    if (form.classList.contains('revise-form')) btnClass = '.revise-btn';",
                    "+",
                    "+    if (btnClass) {",
                    "+        var btn = form.querySelector(btnClass);",
                    "         if (btn) {",
                    "             btn.disabled = true;",
                    "             btn.classList.add('is-loading');",
                    "         }",
                    "+        \/\/ Show loading info in target",
                    "+        var targetId = form.getAttribute('hx-target');",
                    "+        if (targetId === '#critique-result') {",
                    "+            document.getElementById('critique-result').innerHTML =",
                    "+                '<div class=\"loading-box\">' +",
                    "+                '<div class=\"loading-spinner\"><span><\/span><span><\/span><span><\/span><\/div>' +",
                    "+                '<p><strong>Kritiker analysieren Content...<\/strong><\/p>' +",
                    "+                '<p class=\"loading-info\">Faktenpruefer, Stilist und Strukturanalyst pruefen den Text. Dies dauert 30-120 Sekunden.<\/p>' +",
                    "+                '<\/div>';",
                    "+        }",
                    "     }",
                    " });",
                    " <\/script>",
                    " ",
                    "+<style>",
                    "+.loading-box {",
                    "+    background: var(--color-bg-muted);",
                    "+    border: 1px solid var(--color-border);",
                    "+    border-radius: 8px;",
                    "+    padding: var(--space-lg);",
                    "+    text-align: center;",
                    "+    margin: var(--space-md) 0;",
                    "+}",
                    "+.loading-spinner {",
                    "+    display: inline-flex;",
                    "+    gap: 4px;",
                    "+    margin-bottom: var(--space-sm);",
                    "+}",
                    "+.loading-spinner span {",
                    "+    width: 10px; height: 10px;",
                    "+    background: var(--color-primary);",
                    "+    border-radius: 50%;",
                    "+    animation: btn-bounce 1.4s infinite ease-in-out both;",
                    "+}",
                    "+.loading-spinner span:nth-child(1) { animation-delay: -0.32s; }",
                    "+.loading-spinner span:nth-child(2) { animation-delay: -0.16s; }",
                    "+.loading-spinner span:nth-child(3) { animation-delay: 0s; }",
                    "+.loading-info {",
                    "+    font-size: 0.85rem;",
                    "+    color: var(--color-text-muted);",
                    "+    margin-top: var(--space-xs);",
                    "+}",
                    "+<\/style>",
                    "+",
                    " <?php $content = ob_get_clean(); ?>",
                    " <?php require VIEW_PATH . '\/layout.php'; ?>"
                ]
            }
        ],
        "userModified": false,
        "replaceAll": false
    }
}