Fix search bar position — measure actual header height with JS instead of hardcoding

Author: penumbraforge

src/css/style.css

@@ -5529,7 +5529,7 @@ body:has(.tools-hub-page) {
   .tools-mobile-search {
     display: block;
     position: fixed;
-    top: 61px;
+    top: 0;
     left: 0;
     right: 0;
     z-index: 30;

src/tools/index.njk

@@ -107,7 +107,15 @@ permalink: /tools/
 
 <script>
 (function() {
-  var isMobile = window.innerWidth <= 768;
+  var isMobile = window.innerWidth <= 900;
+
+  // Position search bar below the actual header
+  var searchBar = document.getElementById('tools-mobile-search');
+  var siteHeader = document.getElementById('site-header');
+  if (searchBar && siteHeader && isMobile) {
+    var headerH = siteHeader.offsetHeight;
+    searchBar.style.top = headerH + 'px';
+  }
 
   // Collapsible categories on mobile
   document.querySelectorAll('.category-header').forEach(function(header) {