✨ feat: enhance chatgpt assistant styling and functionality improvements

static/css/assistant.css

@@ -1,6 +1,7 @@
 /* ChatGPT Assistent Styles - Verbesserte Version */
 #chatgpt-assistant {
     font-family: 'Inter', sans-serif;
+    bottom: 4.5rem;
 }
 
 #assistant-chat {
@@ -10,6 +11,7 @@
     border-radius: 0.75rem;
     overflow: hidden;
     max-width: calc(100vw - 2rem);
+    max-height: 80vh !important;
 }
 
 #assistant-toggle {
@@ -142,14 +144,21 @@
 .typing-indicator span {
     height: 8px;
     width: 8px;
-    background-color: #888;
     border-radius: 50%;
     display: inline-block;
     margin: 0 2px;
-    opacity: 0.4;
+    opacity: 0.6;
     animation: bounce 1.4s infinite ease-in-out;
 }
 
+body.dark .typing-indicator span {
+    background-color: rgba(255, 255, 255, 0.7);
+}
+
+body:not(.dark) .typing-indicator span {
+    background-color: rgba(107, 114, 128, 0.8);
+}
+
 .typing-indicator span:nth-child(1) { animation-delay: 0s; }
 .typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
 .typing-indicator span:nth-child(3) { animation-delay: 0.4s; }
@@ -173,11 +182,12 @@
 @media (max-width: 640px) {
     #assistant-chat {
         width: calc(100vw - 2rem) !important;
+        max-height: 70vh !important;
     }
     
     #chatgpt-assistant {
         right: 1rem;
-        bottom: 1rem;
+        bottom: 5rem;
     }
 }
 
@@ -200,4 +210,27 @@ main {
 
 footer {
     flex-shrink: 0;
+}
+
+/* Verbesserte Farbkontraste für Nachrichtenblasen */
+.user-message {
+    background-color: rgba(124, 58, 237, 0.1) !important;
+    color: #4B5563 !important;
+}
+
+body.dark .user-message {
+    background-color: rgba(124, 58, 237, 0.2) !important;
+    color: #F9FAFB !important;
+}
+
+.assistant-message {
+    background-color: #F3F4F6 !important;
+    color: #1F2937 !important;
+    border-left: 3px solid #8B5CF6;
+}
+
+body.dark .assistant-message {
+    background-color: rgba(31, 41, 55, 0.5) !important;
+    color: #F9FAFB !important;
+    border-left: 3px solid #8B5CF6;
 }