Fix CSS layout for mapping app

- Add box-sizing: border-box for consistent layout calculations
- Fix html/body to prevent unwanted scrollbars (overflow: hidden)
- Convert .container-map to absolute positioning for proper viewport filling
- Standardize navbar padding to 54px across mobile and desktop (was inconsistent 50px/54px)
- Add proper absolute positioning for geocoder search form overlay
- Implement responsive geocoder positioning (centered on mobile, left-aligned on tablet+)
- Adjust desktop layout to properly account for 250px sidebar
- Increase ui-autocomplete z-index to ensure dropdown appears above search form

Author: claude

css/catchment.css

@@ -1,12 +1,32 @@
 /* This is used to specify the map area. */
-html, body, .row, .container, .container-map, #map {
+* {
+    box-sizing: border-box;
+}
+
+html, body {
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+}
+
+.container-map {
+    position: absolute;
+    top: 54px;
+    bottom: 54px;
+    left: 0;
+    right: 0;
+}
+
+#map {
     height: 100%;
-    padding-bottom: 16px;
+    width: 100%;
 }
 
 /* Add padding on the top and bottom so the top and bottom of map align with nav bars */
 body {
-    padding: 54px 0;
+    padding-top: 54px;
+    padding-bottom: 54px;
 }       
 
 /* To remove border and shading in footer */
@@ -44,11 +64,17 @@ body {
 /* This is for the "normal" size off canvas menu */
 @media (min-width: 992px) {
     body {
-        padding: 50px 250px 50px 0;
+        padding-top: 54px;
+        padding-bottom: 54px;
+        padding-right: 250px;
+    }
+
+    .container-map {
+        right: 250px;
     }
 
     .navmenu {
-        padding: 50px 10px;
+        padding: 54px 10px;
     }
 
     .navmenu-toggle {
@@ -57,6 +83,25 @@ body {
 }
 
 /* Geocoder */
-.ui-autocomplete {
+.container-map form {
+    position: absolute;
+    top: 10px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 90%;
+    max-width: 400px;
     z-index: 1000;
+}
+
+@media (min-width: 768px) {
+    .container-map form {
+        left: 10px;
+        transform: none;
+        width: auto;
+        max-width: 350px;
+    }
+}
+
+.ui-autocomplete {
+    z-index: 1001;
 }