From 44a791855e508cdd455031462125d1ae1abfec97 Mon Sep 17 00:00:00 2001
From: Frank Elsinga <frank@elsinga.de>
Date: Wed, 28 Jan 2026 15:13:13 +0100
Subject: [PATCH] Use specificity instead of !important

---
 app/assets/stylesheets/maplibre-gl-all.scss | 84 +++++++++++----------
 1 file changed, 46 insertions(+), 38 deletions(-)

diff --git a/app/assets/stylesheets/maplibre-gl-all.scss b/app/assets/stylesheets/maplibre-gl-all.scss
index 1d7b8159f..d2008e0fe 100644
--- a/app/assets/stylesheets/maplibre-gl-all.scss
+++ b/app/assets/stylesheets/maplibre-gl-all.scss
@@ -4,54 +4,62 @@
 
 @import "parameters";
 
-.maplibregl-ctrl {
-  margin-right: 0 !important;
-}
+.maplibregl-map .maplibregl-control-container {
+  .maplibregl-ctrl {
+    margin-right: 0;
 
-.maplibregl-control-container .maplibregl-ctrl button {
-  display: grid;
-  height: 40px;
-  width: 40px;
-  color: white;
-  place-content: center;
-  background-color: rgba(0, 0, 0, 0.6);
+    button {
+      display: grid;
+      height: 40px;
+      width: 40px;
+      color: white;
+      place-content: center;
+      background-color: rgba(0, 0, 0, 0.6);
 
-  &:hover, &:focus {
-    background-color: black !important;
-  }
+      &:hover,
+      &:focus {
+        background-color: black;
+      }
 
-  &:first-child,
-  &:first-child:focus {
-    border-radius: 4px 0 0 0;
-  }
+      &:first-child,
+      &:first-child:focus {
+        border-radius: 4px 0 0 0;
+      }
 
-  &:last-child,
-  &:last-child:focus {
-    border-radius: 0 0 0 4px;
+      &:last-child,
+      &:last-child:focus {
+        border-radius: 0 0 0 4px;
+      }
+    }
   }
-}
 
-.maplibregl-ctrl-group {
-  background-color: transparent !important;
-}
+  .maplibregl-ctrl-group {
+    background-color: transparent;
 
-.maplibregl-ctrl-group button+button {
-  border-top: 0;
+    button + button {
+      border-top: 0;
+    }
+  }
 }
 
-.maplibregl-user-location-accuracy-circle {
-  background-color: $green !important;
-  opacity: 0.2 !important;
-}
+.maplibregl-map .maplibregl-canvas-container {
+  .maplibregl-user-location-accuracy-circle {
+    background-color: $green;
+    opacity: 0.2 !important;
+  }
 
-.maplibregl-user-location-dot, .maplibregl-user-location-dot:before {
-  background-color: $vibrant-green !important;
-}
+  .maplibregl-user-location-dot,
+  .maplibregl-user-location-dot:before {
+    background-color: $vibrant-green;
+  }
 
-.maplibregl-ctrl button .maplibregl-ctrl-icon {
-  background-image: none !important;
-}
+  .maplibregl-ctrl button {
+    .maplibregl-ctrl-icon {
+      background-image: none;
+    }
 
-.maplibregl-ctrl button.maplibregl-ctrl-geolocate.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon {
-  background-color: $vibrant-green;
+    &.maplibregl-ctrl-geolocate-active .maplibregl-ctrl-icon {
+      color: $vibrant-green;
+    }
+  }
 }
-- 
2.39.5