Add address autocomplete

<!-- Add Google Maps Platform script -->
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places&callback=initAutocomplete" async defer></script>

<script>
function initAutocomplete() {
  // Get the input element
  const input = document.getElementById('address-input');
  
  // Create the autocomplete widget
  const autocomplete = new google.maps.places.Autocomplete(input, {
    types: ['address'],
    componentRestrictions: { country: 'us' }
  });
  
  // Handle place selection
  autocomplete.addListener('place_changed', function() {
    const place = autocomplete.getPlace();
    
    // Extract address components
    const streetNumber = getComponent(place, 'street_number');
    const route = getComponent(place, 'route');
    const city = getComponent(place, 'locality');
    const state = getComponent(place, 'administrative_area_level_1');
    const zip = getComponent(place, 'postal_code');
    
    // Populate form fields
    document.getElementById('street').value = streetNumber + ' ' + route;
    document.getElementById('city').value = city;
    document.getElementById('state').value = state;
    document.getElementById('zip').value = zip;
  });
}

function getComponent(place, type) {
  const component = place.address_components?.find(c => c.types.includes(type));
  return component?.short_name || '';
}
</script>

<!-- Your address input field -->
<input type="text" id="address-input" placeholder="Enter address...">