Add sidebar group navigation and fix PUT icon

- Click sidebar group heading to expand and navigate to first item
- Hold shift/ctrl/cmd to toggle without navigating
- Change PUT icon to match POST (arrow up-right) but orange

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

Co-Authored-By: Claude Opus 4.5 <[email protected]>

Author: Kyle McLaren

src/components/Head.astro

@@ -184,3 +184,51 @@ const breadcrumbSchema = {
     resizeTimer = setTimeout(initCodeBlocks, 100);
   });
 </script>
+
+<!-- Sidebar group navigation: click heading to expand and navigate to first item -->
+<script>
+  function initSidebarNavigation() {
+    // Find all nested sidebar groups within API Reference
+    const sidebarGroups = document.querySelectorAll('nav[aria-label="Main"] details details');
+
+    sidebarGroups.forEach((details) => {
+      const summary = details.querySelector(':scope > summary');
+      if (!summary) return;
+
+      // Skip if already initialized
+      if (summary.dataset.navInit) return;
+      summary.dataset.navInit = 'true';
+
+      // Find the first link within this group
+      const firstLink = details.querySelector(':scope > ul a[href]');
+      if (!firstLink) return;
+
+      // Add click handler to summary
+      summary.addEventListener('click', (e) => {
+        // Only navigate if the group is currently collapsed (will be opened)
+        // or if shift/ctrl/cmd is held (allow normal toggle behavior)
+        if (e.shiftKey || e.ctrlKey || e.metaKey) return;
+
+        // If currently closed, navigate to first item
+        if (!details.open) {
+          e.preventDefault();
+          details.open = true;
+          // Navigate to the first item's URL
+          window.location.href = firstLink.getAttribute('href');
+        }
+        // If already open, just toggle closed (default behavior)
+      });
+
+      // Make summary look clickable
+      summary.style.cursor = 'pointer';
+    });
+  }
+
+  // Run on initial load and page transitions
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initSidebarNavigation);
+  } else {
+    initSidebarNavigation();
+  }
+  document.addEventListener('astro:page-load', initSidebarNavigation);
+</script>

src/styles/custom.css

@@ -1215,13 +1215,13 @@ nav[aria-label="Main"] a[data-method="post"][aria-current="page"]::after {
   background-color: white;
 }
 
-/* PUT - Orange arrows up/down */
+/* PUT - Orange arrow up-right (same as POST) */
 nav[aria-label="Main"] a[data-method="put"]::before {
   background-color: var(--http-put-faint);
 }
 nav[aria-label="Main"] a[data-method="put"]::after {
   background-color: var(--http-put);
-  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3v18"/><path d="m8 8 4-4 4 4"/><path d="m8 16 4 4 4-4"/></svg>');
+  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M7 7h10v10"/><path d="M7 17 17 7"/></svg>');
 }
 nav[aria-label="Main"] a[data-method="put"]:hover::before,
 nav[aria-label="Main"] a[data-method="put"][aria-current="page"]::before {