feat: Add OpenStreetMap display

src/pages/ParkDetail.tsx

@@ -10,6 +10,7 @@ import { MapPin, Star, Clock, Phone, Globe, Calendar, ArrowLeft, Users, Zap, Cam
 import { ReviewsSection } from '@/components/reviews/ReviewsSection';
 import { RideCard } from '@/components/rides/RideCard';
 import { Park, Ride } from '@/types/database';
+import { ParkLocationMap } from '@/components/maps/ParkLocationMap';
 import { supabase } from '@/integrations/supabase/client';
 export default function ParkDetail() {
   const {
@@ -334,13 +335,23 @@ export default function ParkDetail() {
 
                     <Separator />
 
-                    <div className="space-y-2">
+                    <div className="space-y-4">
                       <div className="font-medium">Location</div>
                       {park.location && <div className="text-sm text-muted-foreground space-y-1">
                           {park.location.city && <div>{park.location.city}</div>}
                           {park.location.state_province && <div>{park.location.state_province}</div>}
                           <div>{park.location.country}</div>
                         </div>}
+                      
+                      {park.location?.latitude && park.location?.longitude && (
+                        <div className="mt-4">
+                          <ParkLocationMap
+                            latitude={Number(park.location.latitude)}
+                            longitude={Number(park.location.longitude)}
+                            parkName={park.name}
+                          />
+                        </div>
+                      )}
                     </div>
                   </CardContent>
                 </Card>