From 58e3d965a0c46dee889bef0af6539dd07b9837dc Mon Sep 17 00:00:00 2001
From: M_Viper <admin@m-viper.de>
Date: Tue, 6 Jan 2026 17:58:30 +0000
Subject: [PATCH] style.css aktualisiert

---
 style.css | 395 +++++++++++++++++++++++++++---------------------------
 1 file changed, 198 insertions(+), 197 deletions(-)

diff --git a/style.css b/style.css
index e31ab85..e770746 100644
--- a/style.css
+++ b/style.css
@@ -1,198 +1,199 @@
-/* CSS Variablen für ein modernes, konsistentes Design */
-:root {
-    --primary-color: #0073aa;
-    --primary-hover: #005a87;
-    --background-light: #f8f9fa;
-    --background-lighter: #ffffff;
-    --text-color: #2c3e50;
-    --text-muted: #6c757d;
-    --border-color: #dee2e6;
-    --border-radius: 8px;
-    --transition-speed: 0.25s;
-    --shadow-sm: 0 2px 4px rgba(0,0,0,0.06);
-    --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
-    --shadow-lg: 0 8px 25px rgba(0,0,0,0.12);
-}
-
-/* Haupt-Container */
-.regel-plugin-container {
-    max-width: 900px;
-    margin: 40px auto;
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-    background: var(--background-lighter);
-    border-radius: var(--border-radius);
-    box-shadow: var(--shadow-lg);
-    overflow: hidden;
-    border: 1px solid var(--border-color);
-}
-
-/* Tab-Navigation */
-.regel-tabs-nav {
-    display: flex;
-    background: var(--background-light);
-    border-bottom: 1px solid var(--border-color);
-    padding: 8px;
-}
-
-.regel-tab-button {
-    background: transparent;
-    border: none;
-    padding: 14px 24px;
-    margin: 0 4px;
-    cursor: pointer;
-    font-weight: 600;
-    transition: all var(--transition-speed) ease;
-    border-radius: 6px;
-    flex-grow: 1;
-    text-align: center;
-}
-
-.regel-tab-button:hover {
-    background: rgba(0, 115, 170, 0.05);
-}
-
-.regel-tab-button.active {
-    background: var(--background-lighter);
-    box-shadow: var(--shadow-sm);
-    border-bottom: 3px solid var(--primary-color);
-}
-
-/* Tab-Panels (Inhalte) */
-.regel-tabs-content .regel-tab-panel {
-    display: none;
-    padding: 25px;
-    animation: fadeInUp 0.5s ease-out;
-}
-
-.regel-tabs-content .regel-tab-panel.active {
-    display: block;
-}
-
-@keyframes fadeInUp {
-    from { opacity: 0; transform: translateY(15px); }
-    to { opacity: 1; transform: translateY(0); }
-}
-
-/* Akkordeon-Items (Regeln) */
-.regel-item {
-    margin-bottom: 16px;
-    border: 1px solid var(--border-color);
-    border-radius: var(--border-radius);
-    overflow: hidden;
-    transition: all var(--transition-speed) ease;
-    border-left: 4px solid var(--primary-color);
-}
-
-.regel-item:hover {
-    transform: translateY(-2px);
-    box-shadow: var(--shadow-md);
-}
-
-.regel-item:last-child {
-    margin-bottom: 0;
-}
-
-/* KORREKTUR: Icon-Positionierung */
-.regel-toggle {
-    width: 100%;
-    background: var(--background-lighter);
-    border: none;
-    padding: 18px 22px 18px 50px; /* Links mehr Padding für den Icon-Platz */
-    text-align: left;
-    font-weight: 600;
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    transition: background var(--transition-speed) ease;
-    position: relative; /* Wichtig für die Positionierung des Icons */
-}
-
-.regel-toggle:hover {
-    background: var(--background-light);
-}
-
-/* Das Plus/Minus Icon (Sehr spezifische Version) */
-.regel-plugin-container .regel-icon {
-    display: inline-block;
-    width: 24px;
-    height: 24px;
-    line-height: 22px;
-    text-align: center;
-    font-size: 20px;
-    font-weight: bold;
-    border-radius: 50%;
-    color: #000000 !important;
-    flex-shrink: 0;
-    transition: transform var(--transition-speed) ease, opacity var(--transition-speed) ease;
-    position: absolute;
-    left: 22px;
-    top: 50%;
-    transform: translateY(-50%);
-}
-
-.regel-item .icon-minus {
-    opacity: 0;
-    transform: translateY(-50%) scale(0.8);
-}
-
-.regel-item.open .icon-plus {
-    opacity: 0;
-    transform: translateY(-50%) scale(0.8);
-}
-
-.regel-item.open .icon-minus {
-    opacity: 1;
-    transform: translateY(-50%) scale(1);
-}
-
-/* Aufklappbarer Inhalt */
-.regel-content {
-    max-height: 0;
-    overflow: hidden;
-    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
-    background: var(--background-lighter);
-}
-
-.regel-item.open .regel-content {
-    max-height: 1000px;
-    padding: 0 22px 20px 50px; /* Linker Abstand anpassen */
-}
-
-.regel-content-inner {
-    padding-top: 5px;
-    line-height: 1.7;
-}
-
-/* NEU & WICHTIG: Entfernt Listenpunkte (Punkte, Zahlen) zuverlässig */
-/* Diese Regel ist spezifischer und überschreibt Theme-Styles */
-.regel-plugin-container .regel-content-inner ul,
-.regel-plugin-container .regel-content-inner ol {
-    list-style: none;
-    padding-left: 0;
-    margin-left: 0;
-}
-.regel-plugin-container .regel-content-inner li {
-    list-style: none;
-}
-
-
-/* Responsive Design */
-@media (max-width: 768px) {
-    .regel-plugin-container {
-        margin: 20px;
-        border-radius: 0;
-    }
-    .regel-tabs-nav {
-        flex-wrap: wrap;
-        padding: 5px;
-    }
-    .regel-tab-button {
-        flex-basis: 50%;
-        margin: 2px;
-        font-size: 14px;
-        padding: 12px 8px;
-    }
-    .regel-tabs-content .regel-tab-panel {
-        padding: 15px;
-    }
+/* Haupt-Container */
+.regel-plugin-container {
+    /* 
+     * CSS Variablen für ein modernes, konsistentes Design 
+     * WICHTIG: Diese Variablen sind jetzt hier definiert, NICHT in :root,
+     * damit sie nur dieses Plugin beeinflussen und nicht das globale Theme.
+     */
+    --primary-color: #0073aa;
+    --primary-hover: #005a87;
+    --background-light: #f8f9fa;
+    --background-lighter: #ffffff;
+    --text-color: #2c3e50;
+    --text-muted: #6c757d;
+    --border-color: #dee2e6;
+    --border-radius: 8px;
+    --transition-speed: 0.25s;
+    --shadow-sm: 0 2px 4px rgba(0,0,0,0.06);
+    --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
+    --shadow-lg: 0 8px 25px rgba(0,0,0,0.12);
+
+    max-width: 900px;
+    margin: 40px auto;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+    background: var(--background-lighter);
+    border-radius: var(--border-radius);
+    box-shadow: var(--shadow-lg);
+    overflow: hidden;
+    border: 1px solid var(--border-color);
+}
+
+/* Tab-Navigation */
+.regel-plugin-container .regel-tabs-nav {
+    display: flex;
+    background: var(--background-light);
+    border-bottom: 1px solid var(--border-color);
+    padding: 8px;
+}
+
+.regel-plugin-container .regel-tab-button {
+    background: transparent;
+    border: none;
+    padding: 14px 24px;
+    margin: 0 4px;
+    cursor: pointer;
+    font-weight: 600;
+    transition: all var(--transition-speed) ease;
+    border-radius: 6px;
+    flex-grow: 1;
+    text-align: center;
+}
+
+.regel-plugin-container .regel-tab-button:hover {
+    background: rgba(0, 115, 170, 0.05);
+}
+
+.regel-plugin-container .regel-tab-button.active {
+    background: var(--background-lighter);
+    box-shadow: var(--shadow-sm);
+    border-bottom: 3px solid var(--primary-color);
+}
+
+/* Tab-Panels (Inhalte) */
+.regel-plugin-container .regel-tabs-content .regel-tab-panel {
+    display: none;
+    padding: 25px;
+    animation: fadeInUp 0.5s ease-out;
+}
+
+.regel-plugin-container .regel-tabs-content .regel-tab-panel.active {
+    display: block;
+}
+
+@keyframes fadeInUp {
+    from { opacity: 0; transform: translateY(15px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+/* Akkordeon-Items (Regeln) */
+.regel-plugin-container .regel-item {
+    margin-bottom: 16px;
+    border: 1px solid var(--border-color);
+    border-radius: var(--border-radius);
+    overflow: hidden;
+    transition: all var(--transition-speed) ease;
+    border-left: 4px solid var(--primary-color);
+}
+
+.regel-plugin-container .regel-item:hover {
+    transform: translateY(-2px);
+    box-shadow: var(--shadow-md);
+}
+
+.regel-plugin-container .regel-item:last-child {
+    margin-bottom: 0;
+}
+
+/* KORREKTUR: Icon-Positionierung */
+.regel-plugin-container .regel-toggle {
+    width: 100%;
+    background: var(--background-lighter);
+    border: none;
+    padding: 18px 22px 18px 50px; /* Links mehr Padding für den Icon-Platz */
+    text-align: left;
+    font-weight: 600;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    transition: background var(--transition-speed) ease;
+    position: relative; /* Wichtig für die Positionierung des Icons */
+}
+
+.regel-plugin-container .regel-toggle:hover {
+    background: var(--background-light);
+}
+
+/* Das Plus/Minus Icon (Sehr spezifische Version) */
+.regel-plugin-container .regel-icon {
+    display: inline-block;
+    width: 24px;
+    height: 24px;
+    line-height: 22px;
+    text-align: center;
+    font-size: 20px;
+    font-weight: bold;
+    border-radius: 50%;
+    color: #000000 !important;
+    flex-shrink: 0;
+    transition: transform var(--transition-speed) ease, opacity var(--transition-speed) ease;
+    position: absolute;
+    left: 22px;
+    top: 50%;
+    transform: translateY(-50%);
+}
+
+.regel-plugin-container .regel-item .icon-minus {
+    opacity: 0;
+    transform: translateY(-50%) scale(0.8);
+}
+
+.regel-plugin-container .regel-item.open .icon-plus {
+    opacity: 0;
+    transform: translateY(-50%) scale(0.8);
+}
+
+.regel-plugin-container .regel-item.open .icon-minus {
+    opacity: 1;
+    transform: translateY(-50%) scale(1);
+}
+
+/* Aufklappbarer Inhalt */
+.regel-plugin-container .regel-content {
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
+    background: var(--background-lighter);
+}
+
+.regel-plugin-container .regel-item.open .regel-content {
+    max-height: 1000px;
+    padding: 0 22px 20px 50px; /* Linker Abstand anpassen */
+}
+
+.regel-plugin-container .regel-content-inner {
+    padding-top: 5px;
+    line-height: 1.7;
+}
+
+/* NEU & WICHTIG: Entfernt Listenpunkte (Punkte, Zahlen) zuverlässig */
+/* Diese Regel ist spezifischer und überschreibt Theme-Styles */
+.regel-plugin-container .regel-content-inner ul,
+.regel-plugin-container .regel-content-inner ol {
+    list-style: none;
+    padding-left: 0;
+    margin-left: 0;
+}
+.regel-plugin-container .regel-content-inner li {
+    list-style: none;
+}
+
+/* Responsive Design */
+@media (max-width: 768px) {
+    .regel-plugin-container {
+        margin: 20px;
+        border-radius: 0;
+    }
+    .regel-plugin-container .regel-tabs-nav {
+        flex-wrap: wrap;
+        padding: 5px;
+    }
+    .regel-plugin-container .regel-tab-button {
+        flex-basis: 50%;
+        margin: 2px;
+        font-size: 14px;
+        padding: 12px 8px;
+    }
+    .regel-plugin-container .regel-tabs-content .regel-tab-panel {
+        padding: 15px;
+    }
 }
\ No newline at end of file