From acf8040238ac4c4b2c015e60e76a13bc50e7c3f6 Mon Sep 17 00:00:00 2001
From: rene <mail@motocamp.de>
Date: Sun, 26 Apr 2026 10:02:10 +0200
Subject: [PATCH] =?UTF-8?q?Knigge:=20card-body=20statt=20inline=20Padding?=
 =?UTF-8?q?=20=E2=80=94=20SW=20by-v420?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/static/js/app.js          |  2 +-
 backend/static/js/pages/knigge.js | 36 ++++++++++++++++++-------------
 backend/static/sw.js              |  2 +-
 3 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/backend/static/js/app.js b/backend/static/js/app.js
index 2137757..3282dad 100644
--- a/backend/static/js/app.js
+++ b/backend/static/js/app.js
@@ -3,7 +3,7 @@
    Router, State-Management, Navigation, Initialisierung.
    ============================================================ */
 
-const APP_VER = '398'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
+const APP_VER = '399'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
 
 const App = (() => {
 
diff --git a/backend/static/js/pages/knigge.js b/backend/static/js/pages/knigge.js
index e36fbac..c635885 100644
--- a/backend/static/js/pages/knigge.js
+++ b/backend/static/js/pages/knigge.js
@@ -173,20 +173,22 @@ window.Page_knigge = (() => {
   // ----------------------------------------------------------
   function _renderVoting() {
     const cards = SZENARIEN.map(s => `
-      <div class="card" style="margin-bottom:var(--space-4);padding:var(--space-4)" id="sz-${s.id}">
-        <p style="font-weight:var(--weight-semibold);margin-bottom:var(--space-3);line-height:1.5">
-          ${_esc(s.frage)}
-        </p>
-        <div class="knigge-vote-options" id="opts-${s.id}">
-          ${s.antworten.map(a => `
-            <button class="knigge-vote-btn btn btn-secondary"
-                    data-sz="${s.id}" data-key="${a.key}"
-                    style="width:100%;margin-bottom:var(--space-2);justify-content:flex-start;text-align:left">
-              ${_esc(a.text)}
-            </button>
-          `).join('')}
+      <div class="card" style="margin-bottom:var(--space-4)" id="sz-${s.id}">
+        <div class="card-body">
+          <p style="font-weight:var(--weight-semibold);margin-bottom:var(--space-3);line-height:1.5">
+            ${_esc(s.frage)}
+          </p>
+          <div class="knigge-vote-options" id="opts-${s.id}">
+            ${s.antworten.map(a => `
+              <button class="knigge-vote-btn btn btn-secondary"
+                      data-sz="${s.id}" data-key="${a.key}"
+                      style="width:100%;margin-bottom:var(--space-2);justify-content:flex-start;text-align:left">
+                ${_esc(a.text)}
+              </button>
+            `).join('')}
+          </div>
+          <div class="knigge-vote-result hidden" id="res-${s.id}"></div>
         </div>
-        <div class="knigge-vote-result hidden" id="res-${s.id}"></div>
       </div>
     `).join('');
 
@@ -295,7 +297,8 @@ window.Page_knigge = (() => {
       <h2 style="font-size:var(--text-lg);font-weight:700;margin:var(--space-6) 0 var(--space-3)">
         ${UI.icon('robot')} KI-Situationsberater
       </h2>
-      <div class="card" style="padding:var(--space-4)">
+      <div class="card">
+        <div class="card-body">
         <textarea id="ki-situation-input" class="form-control"
                   rows="3"
                   placeholder="Beschreibe deine Situation…"
@@ -304,6 +307,7 @@ window.Page_knigge = (() => {
           Rat holen ${UI.icon('robot')}
         </button>
         <div id="ki-rat-result" style="margin-top:var(--space-4);display:none"></div>
+        </div>
       </div>
     `;
   }
@@ -363,7 +367,8 @@ window.Page_knigge = (() => {
       <h2 style="font-size:var(--text-lg);font-weight:700;margin:var(--space-6) 0 var(--space-3)">
         ${UI.icon('shield')} Haftpflicht-Hinweise
       </h2>
-      <div class="card" style="margin-bottom:var(--space-8);padding:var(--space-4)">
+      <div class="card" style="margin-bottom:var(--space-8)">
+        <div class="card-body">
         <ul style="list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--space-3)">
           <li style="display:flex;gap:var(--space-3);align-items:flex-start">
             <span style="font-size:1.2rem;flex-shrink:0">${UI.icon('scales')}</span>
@@ -389,6 +394,7 @@ window.Page_knigge = (() => {
         <p style="margin-top:var(--space-4);font-size:var(--text-xs);color:var(--c-text-muted)">
           Dies ist keine Rechtsberatung.
         </p>
+        </div>
       </div>
     `;
   }
diff --git a/backend/static/sw.js b/backend/static/sw.js
index 88e8016..0a9b895 100644
--- a/backend/static/sw.js
+++ b/backend/static/sw.js
@@ -3,7 +3,7 @@
    Offline-Cache + Push Notifications + Tile-Cache
    ============================================================ */
 
-const CACHE_VERSION = 'by-v419';
+const CACHE_VERSION = 'by-v420';
 const CACHE_STATIC  = `${CACHE_VERSION}-static`;
 const CACHE_TILES   = 'ban-yaro-tiles-v1';  // bleibt über SW-Updates erhalten