Fix sidebar collapse/expand UX

JS was toggling .collapsed on the wrong element (dashboardSidebar div
instead of lt-sidebar aside), and the expand button was permanently
display:none. When collapsed, users had no way to re-expand.

- toggleSidebar now targets lt-sidebar (the aside)
- Toggle button flips ◀ ↔ ▶ to indicate state and serve as the expand button
- Collapsed CSS hides the body and label, centers the ▶ button in the strip
- Remove the dead sidebarExpandBtn element from HTML
- Persist and restore state correctly on page load

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

assets/css/base.css

@@ -1450,6 +1450,10 @@ select option:checked {
   transition: var(--transition-default);
 }
 .lt-sidebar.collapsed { width: 32px; overflow: hidden; }
+.lt-sidebar.collapsed .lt-sidebar-body { display: none; }
+.lt-sidebar.collapsed .lt-sidebar-header { justify-content: center; padding: 0.5rem 0; border-bottom: none; }
+.lt-sidebar.collapsed .lt-sidebar-header > span:first-child { display: none; }
+.lt-sidebar.collapsed .lt-sidebar-toggle { font-size: 0.8rem; padding: 0.4rem; color: var(--accent-cyan); }
 
 .lt-sidebar-header {
   display: flex;

assets/js/dashboard.js

@@ -2,14 +2,16 @@
  * Toggle sidebar visibility on desktop
  */
 function toggleSidebar() {
-    const sidebar = document.getElementById('dashboardSidebar');
+    const sidebar = document.getElementById('lt-sidebar');
-    const layout = document.getElementById('dashboardLayout');
+    if (!sidebar) return;
-    if (sidebar && layout) {
     const isCollapsed = sidebar.classList.toggle('collapsed');
-        layout.classList.toggle('sidebar-collapsed', isCollapsed);
+    const btn = sidebar.querySelector('.lt-sidebar-toggle');
-        // Store state in localStorage
+    if (btn) {
-        localStorage.setItem('sidebarCollapsed', isCollapsed ? 'true' : 'false');
+        btn.textContent = isCollapsed ? '\u25B6' : '\u25C0';
+        btn.setAttribute('aria-label', isCollapsed ? 'Expand filter sidebar' : 'Collapse filter sidebar');
+        btn.setAttribute('aria-expanded', isCollapsed ? 'false' : 'true');
     }
+    localStorage.setItem('sidebarCollapsed', isCollapsed ? 'true' : 'false');
 }
 
 /**
@@ -77,11 +79,15 @@ function initMobileSidebar() {
 // Restore sidebar state on page load
 document.addEventListener('DOMContentLoaded', function() {
     const savedState = localStorage.getItem('sidebarCollapsed');
-    const sidebar = document.getElementById('dashboardSidebar');
+    const sidebar = document.getElementById('lt-sidebar');
-    const layout = document.getElementById('dashboardLayout');
+    if (savedState === 'true' && sidebar) {
-    if (savedState === 'true' && sidebar && layout) {
         sidebar.classList.add('collapsed');
-        layout.classList.add('sidebar-collapsed');
+        const btn = sidebar.querySelector('.lt-sidebar-toggle');
+        if (btn) {
+            btn.textContent = '\u25B6';
+            btn.setAttribute('aria-label', 'Expand filter sidebar');
+            btn.setAttribute('aria-expanded', 'false');
+        }
     }
 });
 

views/DashboardView.php

@@ -500,12 +500,6 @@ include __DIR__ . '/layout_header.php';
     </div><!-- /.lt-sidebar-body -->
   </aside>
 
-  <!-- Collapsed expand button -->
-  <button type="button" class="lt-sidebar-expand-btn" id="sidebarExpandBtn"
-          data-action="toggle-sidebar"
-          aria-label="Show filters" aria-expanded="false" aria-controls="lt-sidebar"
-          style="display:none">&#x25B6; Filters</button>
-
   <!-- ─── MAIN CONTENT ─────────────────────────────────────── -->
   <div class="lt-content">