Fix sidebar auto-scroll to correctly target scrollable container

- Use closest() to find the actual scrollable UL container
- Calculate position relative to the scrollable container, not the sidebar
- Use getBoundingClientRect() for accurate positioning
- Position active link near the top with 20px padding for visibility
- Fixes issue where scroll didn't work correctly for Develop/Operate/Integrate
- Fixes Commands section scrolling too far

This improves the previous implementation by targeting the correct
overflow-y-auto UL element that actually scrolls, rather than trying
to scroll the sidebar nav element itself.

Author: mich-elle-luna

layouts/partials/docs-nav.html

@@ -204,6 +204,27 @@
     const sidebar = document.getElementById('sidebar');
     const footer = document.querySelector('footer');
 
+    // Scroll sidebar to show active page on load
+    const activeLink = sidebar.querySelector('a.active');
+    if (activeLink) {
+      // Find the scrollable UL container that contains the active link
+      const scrollContainer = activeLink.closest('ul.overflow-y-auto');
+
+      if (scrollContainer) {
+        // Get the position of the active link relative to its scrollable container
+        const linkRect = activeLink.getBoundingClientRect();
+        const containerRect = scrollContainer.getBoundingClientRect();
+
+        // Calculate how far the link is from the top of the container
+        const relativeTop = linkRect.top - containerRect.top + scrollContainer.scrollTop;
+
+        // Scroll so the active link appears near the top (with some padding)
+        const scrollPosition = relativeTop - 20; // 20px padding from top
+
+        scrollContainer.scrollTop = Math.max(0, scrollPosition);
+      }
+    }
+
     window.addEventListener('scroll', function() {
       const scrolledHeight = window.scrollY + window.innerHeight;
       if (scrolledHeight >= footer.offsetTop) {