Refactor invite tab layout and enhance user suggestions dropdown functionality

b0esche_cloud/lib/widgets/organization_settings_dialog.dart

@@ -37,6 +37,7 @@ class _OrganizationSettingsDialogState
   String? _error;
   List<User> _userSuggestions = [];
   late final TextEditingController usernameController;
+  final LayerLink _layerLink = LayerLink();
 
   @override
   void initState() {
@@ -417,7 +418,9 @@ class _OrganizationSettingsDialogState
   Widget _buildInviteTab() {
     String selectedRole = 'member';
 
-    return Column(
+    return Stack(
+      children: [
+        Column(
           children: [
             // Pending invitations
             if (_invitations.isNotEmpty) ...[
@@ -506,7 +509,9 @@ class _OrganizationSettingsDialogState
               ),
             ),
             const SizedBox(height: 16),
-        TextField(
+            CompositedTransformTarget(
+              link: _layerLink,
+              child: TextField(
                 controller: usernameController,
                 cursorColor: AppTheme.accentColor,
                 decoration: InputDecoration(
@@ -545,28 +550,7 @@ class _OrganizationSettingsDialogState
                   }
                 },
               ),
-        const SizedBox(height: 8),
-        if (_userSuggestions.isNotEmpty) ...[
-          SizedBox(
-            height: 100,
-            child: ListView.builder(
-              itemCount: _userSuggestions.length,
-              itemBuilder: (context, index) {
-                final user = _userSuggestions[index];
-                return ListTile(
-                  title: Text(
-                    user.displayName ?? user.username,
-                    style: TextStyle(color: AppTheme.primaryText),
             ),
-                  onTap: () {
-                    usernameController.text = user.username;
-                    setState(() => _userSuggestions = []);
-                  },
-                );
-              },
-            ),
-          ),
-        ],
             DropdownButtonFormField<String>(
               initialValue: selectedRole,
               items: ['admin', 'member'].map((role) {
@@ -616,6 +600,47 @@ class _OrganizationSettingsDialogState
               ),
             ),
           ],
+        ),
+        if (_userSuggestions.isNotEmpty)
+          CompositedTransformFollower(
+            link: _layerLink,
+            offset: const Offset(0, 48),
+            child: Container(
+              width: 300,
+              height: 100,
+              decoration: BoxDecoration(
+                color: AppTheme.primaryBackground,
+                borderRadius: BorderRadius.circular(8),
+                border: Border.all(
+                  color: AppTheme.accentColor.withValues(alpha: 0.3),
+                ),
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withValues(alpha: 0.2),
+                    blurRadius: 8,
+                    offset: const Offset(0, 4),
+                  ),
+                ],
+              ),
+              child: ListView.builder(
+                itemCount: _userSuggestions.length,
+                itemBuilder: (context, index) {
+                  final user = _userSuggestions[index];
+                  return ListTile(
+                    title: Text(
+                      user.displayName ?? user.username,
+                      style: TextStyle(color: AppTheme.primaryText),
+                    ),
+                    onTap: () {
+                      usernameController.text = user.username;
+                      setState(() => _userSuggestions = []);
+                    },
+                  );
+                },
+              ),
+            ),
+          ),
+      ],
     );
   }