Fix browser phone issues and improve UI organization

- Fix 403 Forbidden error in voicemail AJAX by correcting nonce validation
- Create accordion-style collapsible voicemail section with persistent state
- Restructure queue controls to show alert toggle button consistently
- Add global queue actions always visible when user has assigned queues
- Implement smooth slide animations and localStorage state management
- Update dark mode support for new UI elements and improved accessibility

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

assets/js/browser-phone-frontend.js

@@ -32,7 +32,7 @@
         bindEvents();
         loadPhoneNumbers();
         loadUserQueues();
-        loadUserVoicemails();
+        initVoicemailSection();
     });
     
     /**
@@ -293,6 +293,19 @@
             window.open(twp_frontend_ajax.admin_url + 'admin.php?page=twilio-wp-voicemails', '_blank');
         });
         
+        // Voicemail toggle button
+        $('#twp-voicemail-toggle').on('click', function() {
+            toggleVoicemailSection();
+        });
+        
+        // Voicemail header click (also toggles)
+        $('#twp-voicemail-header').on('click', function(e) {
+            // Don't toggle if clicking the toggle button itself
+            if (!$(e.target).closest('.voicemail-toggle').length) {
+                toggleVoicemailSection();
+            }
+        });
+        
         // Voicemail item click handler
         $(document).on('click', '.voicemail-item', function() {
             const voicemailId = $(this).data('voicemail-id');
@@ -522,10 +535,12 @@
         if (userQueues.length === 0) {
             $queueList.html('<div class="no-queues">No queues assigned to you.</div>');
             $('#twp-queue-section').hide();
+            $('#twp-queue-global-actions').hide();
             return;
         }
         
         $('#twp-queue-section').show();
+        $('#twp-queue-global-actions').show();
         
         let html = '';
         userQueues.forEach(function(queue) {
@@ -965,6 +980,48 @@
         });
     }
     
+    /**
+     * Toggle voicemail section visibility
+     */
+    function toggleVoicemailSection() {
+        const $content = $('#twp-voicemail-content');
+        const $toggle = $('#twp-voicemail-toggle .toggle-icon');
+        const isVisible = $content.is(':visible');
+        
+        if (isVisible) {
+            $content.slideUp(300);
+            $toggle.text('▼');
+            localStorage.setItem('twp_voicemail_collapsed', 'true');
+        } else {
+            $content.slideDown(300);
+            $toggle.text('▲');
+            localStorage.setItem('twp_voicemail_collapsed', 'false');
+            // Load voicemails when expanding if not already loaded
+            if ($('#twp-voicemail-list').children('.voicemail-loading').length > 0) {
+                loadUserVoicemails();
+            }
+        }
+    }
+    
+    /**
+     * Initialize voicemail section state
+     */
+    function initVoicemailSection() {
+        const isCollapsed = localStorage.getItem('twp_voicemail_collapsed') === 'true';
+        const $content = $('#twp-voicemail-content');
+        const $toggle = $('#twp-voicemail-toggle .toggle-icon');
+        
+        if (isCollapsed) {
+            $content.hide();
+            $toggle.text('▼');
+        } else {
+            $content.show();
+            $toggle.text('▲');
+            // Load voicemails immediately if expanded
+            loadUserVoicemails();
+        }
+    }
+    
     /**
      * Display voicemails in the UI
      */