Post form: limit photos to 4, add GPS fields with geolocation button

themes/intotheeast/css/style.css

@@ -103,3 +103,10 @@ body {
 
 /* Post form */
 .post-form-wrap h1 { font-size: 1.4rem; margin-bottom: 1.5rem; }
+.post-form-wrap .btn-location {
+    display: block; width: 100%; margin-top: 1rem;
+    padding: 0.85rem 1rem; min-height: 44px;
+    background: #f0f0f0; border: 1px solid #ccc;
+    border-radius: 6px; font-size: 1rem; cursor: pointer;
+}
+.post-form-wrap .location-status { font-size: 0.85rem; color: #666; margin-top: 0.5rem; text-align: center; }

themes/intotheeast/templates/post-form.html.twig

@@ -4,5 +4,29 @@
 <div class="post-form-wrap">
     <h1>{{ page.title }}</h1>
     {% include 'partials/form.html.twig' ignore missing %}
+    <button type="button" id="get-location" class="btn-location">Get Current Location</button>
+    <p id="location-status" class="location-status"></p>
 </div>
+
+<script>
+document.getElementById('get-location').addEventListener('click', function() {
+    var status = document.getElementById('location-status');
+    status.textContent = 'Getting location…';
+    if (!navigator.geolocation) {
+        status.textContent = 'Geolocation not supported by your browser.';
+        return;
+    }
+    navigator.geolocation.getCurrentPosition(function(pos) {
+        var lat = pos.coords.latitude.toFixed(6);
+        var lng = pos.coords.longitude.toFixed(6);
+        var latField = document.querySelector('input[name="data[lat]"]');
+        var lngField = document.querySelector('input[name="data[lng]"]');
+        if (latField) latField.value = lat;
+        if (lngField) lngField.value = lng;
+        status.textContent = 'Location set: ' + lat + ', ' + lng;
+    }, function(err) {
+        status.textContent = 'Could not get location: ' + err.message;
+    });
+});
+</script>
 {% endblock %}