- Aanpassing layout van de chat-input. Character counter is ook weg op desktop. Scrollbar enkel zichtbaar indien nodig. Meer beschikbare ruimte in mobiele client. kleinere radius in de hoeken.

- Gewijzigde logica voor hoogtebepaling chat-input en message history, zodat ook de mobiele client correct functioneert.

nginx/frontend_src/js/chat-client.js

@@ -160,20 +160,38 @@ function initializeMobileHeader() {
     };
 
     const mountedApp = app.mount(container);
-    
+
+    // Dynamisch de headerhoogte doorgeven aan CSS
+    const updateHeaderHeightVar = () => {
+      const isMobile = window.matchMedia('(max-width: 768px)').matches;
+      if (!isMobile) {
+        document.documentElement.style.removeProperty('--mobile-header-height');
+        return;
+      }
+      const h = container.offsetHeight || 60; // fallback
+      document.documentElement.style.setProperty('--mobile-header-height', `${h}px`);
+    };
+
+    // Initieel instellen en bij gebeurtenissen herberekenen
+    requestAnimationFrame(updateHeaderHeightVar);
+    window.addEventListener('resize', updateHeaderHeightVar);
+
     // Listen to language change events and update the mobile header's language provider
     const languageChangeHandler = (event) => {
       if (event.detail && event.detail.language) {
         console.log('MobileHeader: Received language change event:', event.detail.language);
         languageProvider.setLanguage(event.detail.language);
+        // taalwissel kan headerhoogte veranderen
+        requestAnimationFrame(updateHeaderHeightVar);
       }
     };
     document.addEventListener('language-changed', languageChangeHandler);
     
     // Store the handler for cleanup if needed
     mountedApp._languageChangeHandler = languageChangeHandler;
+    mountedApp._updateHeaderHeightVar = updateHeaderHeightVar;
     
-    console.log('✅ MobileHeader component successfully mounted with LanguageProvider');
+    console.log('✅ MobileHeader component successfully mounted with LanguageProvider en dynamische headerhoogte');
     return mountedApp;
   } catch (error) {
     console.error('🚨 [CRITICAL ERROR] Bij initialiseren mobile header:', error);