Make history point popups readable on MapLibre

MapLibre's stylesheet is linked into the map's shadow root and wins over
the component styles on equal specificity, property by property: its
white popup background applied while our white text color did too,
leaving the timestamp invisible. The popup rules now carry !important,
as the Leaflet tooltip rules already do for the same reason.

src/components/map/ha-map.ts

@@ -1035,21 +1035,22 @@ export class HaMap extends ReactiveElement {
     .dark .maplibregl-ctrl button .maplibregl-ctrl-icon {
       filter: invert(1);
     }
+    /* MapLibre's stylesheet, linked into this root, wins on equal specificity */
     .maplibregl-popup-content {
-      padding: 8px;
+      padding: 8px !important;
       font-size: var(--ha-font-size-s);
       font-family: var(--ha-font-family-body);
-      background: rgba(80, 80, 80, 0.9);
-      color: white;
-      border-radius: var(--ha-border-radius-sm);
-      box-shadow: none;
+      background: rgba(80, 80, 80, 0.9) !important;
+      color: white !important;
+      border-radius: var(--ha-border-radius-sm) !important;
+      box-shadow: none !important;
       text-align: center;
     }
     .maplibregl-popup-anchor-bottom .maplibregl-popup-tip {
-      border-top-color: rgba(80, 80, 80, 0.9);
+      border-top-color: rgba(80, 80, 80, 0.9) !important;
     }
     .maplibregl-popup-anchor-top .maplibregl-popup-tip {
-      border-bottom-color: rgba(80, 80, 80, 0.9);
+      border-bottom-color: rgba(80, 80, 80, 0.9) !important;
     }
     .dark .leaflet-bar a {
       background-color: #1c1c1c;