.location-map-controls { background: #fff; padding: 10px; margin-top: 10px; border-radius: 5px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); max-width: 600px; margin-left: auto; margin-right: auto; } .location-map-controls h4 { margin: 0 0 10px 0; } .location-map-controls label { display: inline-block; margin: 5px 10px 5px 0; } /* Point click popup (Leaflet's own .leaflet-popup-content). Two earlier passes (26px, then 36px) both got silently overridden by leaflet.css's own rule at equal specificity — leaflet.css was printing *after* this stylesheet in (location_map_enqueue_assets() now fixes that by making this stylesheet explicitly depend on the 'leaflet' handle), so its rule won the cascade regardless of what value was set here. !important is a deliberate belt-and-suspenders on top of that fix, not a substitute for it — a theme or another plugin could just as easily print its own generic-paragraph rule after this one too. Once the cascade fix actually took effect, 42px read as too large; 20px was still a bit much — settled on 16px. See assets/js/frontend.js for the matching Google Maps InfoWindow sizing, set inline since Google's info window content isn't reliably targetable by an external stylesheet class the way Leaflet's is. */ .leaflet-popup-content { font-size: 16px !important; line-height: 1.3 !important; }