Revert "feat(themes): add theme-aware boundary highlight config"

This reverts commit fef10664c8.

src/components/MapView.jsx

@@ -1247,10 +1247,10 @@ function removeBlmTrails(map) {
 }
 
 
-/** Add boundary polygon layers using theme-aware highlight config */
+/** Add boundary polygon layers with computed accent color (MapLibre rejects CSS vars in paint) */
 const BOUNDARY_FILL_LAYER = 'boundary-fill-layer'
 
-function addBoundaryLayer(map, themeId) {
+function addBoundaryLayer(map) {
   if (!map || map.getLayer(BOUNDARY_LAYER)) return
   if (!map.getSource(BOUNDARY_SOURCE)) {
     map.addSource(BOUNDARY_SOURCE, {
@@ -1258,14 +1258,7 @@ function addBoundaryLayer(map, themeId) {
       data: { type: "FeatureCollection", features: [] },
     })
   }
-  // Get highlight config from theme overlay
-  const highlight = getOverlayConfig(themeId, "highlight") || {}
-  const lineColor = highlight.lineColor || "#7a9a6b"
-  const lineWidth = highlight.lineWidth || 2
-  const lineDash = highlight.lineDash || [4, 4]
-  const lineOpacity = highlight.lineOpacity || 0.8
-  const fillColor = highlight.fillColor || lineColor
-  const fillOpacity = highlight.fillOpacity || 0.08
+  const accentColor = getComputedStyle(document.documentElement).getPropertyValue("--accent").trim() || "#7a9a6b"
 
   // Find first symbol layer to insert boundary layers below labels
   const layers = map.getStyle().layers
@@ -1283,8 +1276,8 @@ function addBoundaryLayer(map, themeId) {
     type: "fill",
     source: BOUNDARY_SOURCE,
     paint: {
-      "fill-color": fillColor,
-      "fill-opacity": fillOpacity,
+      "fill-color": accentColor,
+      "fill-opacity": 0.05,
     },
   }, firstSymbolId)
 
@@ -1294,10 +1287,10 @@ function addBoundaryLayer(map, themeId) {
     type: "line",
     source: BOUNDARY_SOURCE,
     paint: {
-      "line-color": lineColor,
-      "line-width": lineWidth,
-      "line-opacity": lineOpacity,
-      "line-dasharray": lineDash,
+      "line-color": accentColor,
+      "line-width": 2,
+      "line-opacity": 0.7,
+      "line-dasharray": [3, 2],
     },
   }, firstSymbolId)
 }
@@ -1505,14 +1498,7 @@ const MapView = forwardRef(function MapView(_, ref) {
       type: "geojson",
       data: { type: "FeatureCollection", features: [] },
     })
-    // Get highlight config from theme overlay
-  const highlight = getOverlayConfig(themeId, "highlight") || {}
-  const lineColor = highlight.lineColor || "#7a9a6b"
-  const lineWidth = highlight.lineWidth || 2
-  const lineDash = highlight.lineDash || [4, 4]
-  const lineOpacity = highlight.lineOpacity || 0.8
-  const fillColor = highlight.fillColor || lineColor
-  const fillOpacity = highlight.fillOpacity || 0.08
+    const accentColor = getComputedStyle(document.documentElement).getPropertyValue("--accent").trim() || "#7a9a6b"
     map.addLayer({
       id: MEASURE_LINE_LAYER,
       type: "line",
@@ -2138,7 +2124,7 @@ const MapView = forwardRef(function MapView(_, ref) {
 
       // Boundary polygon layer for selected places
       if (!map.getLayer(BOUNDARY_LAYER)) {
-        addBoundaryLayer(map, currentThemeRef.current)
+        addBoundaryLayer(map)
       }
 
       // Apply improved base label styling for readability
@@ -2347,7 +2333,7 @@ const MapView = forwardRef(function MapView(_, ref) {
 
       // Boundary polygon layer
       if (!map.getLayer(BOUNDARY_LAYER)) {
-        addBoundaryLayer(map, currentThemeRef.current)
+        addBoundaryLayer(map)
       }
 
       // Apply improved base label styling for readability

src/themes/clean.js

@@ -351,16 +351,6 @@ const cleanOverlay = {
     labelFont: ['Noto Sans Regular'],
     hitWidth: 14,
   },
-
-  // ── Highlight (boundary/selection) ────────────────────────────────────────
-  highlight: {
-    lineColor: "#1a73e8",  // Google blue for selection
-    lineWidth: 2,
-    lineDash: [4, 4],
-    lineOpacity: 0.7,
-    fillColor: "#1a73e8",
-    fillOpacity: 0.06,
-  },
 }
 
 /**

src/themes/cyberpunk.js

@@ -368,16 +368,6 @@ const cyberpunkOverlay = {
     // Hit layer
     hitWidth: 14,
   },
-
-  // ── Highlight (boundary/selection) ────────────────────────────────────────
-  highlight: {
-    lineColor: "#00f0ff",  // Electric cyan for selection
-    lineWidth: 2,
-    lineDash: [4, 4],
-    lineOpacity: 0.9,
-    fillColor: "#00f0ff",
-    fillOpacity: 0.1,
-  },
 }
 
 /**

src/themes/registry.js

@@ -288,16 +288,6 @@ const darkOverlay = {
     // Hit layer
     hitWidth: 14,
   },
-
-  // ── Highlight (boundary/selection) ────────────────────────────────────────
-  highlight: {
-    lineColor: "#7a9a6b",  // Muted olive-green for dark backgrounds
-    lineWidth: 2,
-    lineDash: [4, 4],
-    lineOpacity: 0.8,
-    fillColor: "#7a9a6b",
-    fillOpacity: 0.08,
-  },
 }
 
 /**
@@ -460,16 +450,6 @@ const lightOverlay = {
     // Hit layer
     hitWidth: 14,
   },
-
-  // ── Highlight (boundary/selection) ────────────────────────────────────────
-  highlight: {
-    lineColor: "#4a7040",  // Forest green for light backgrounds
-    lineWidth: 2,
-    lineDash: [4, 4],
-    lineOpacity: 0.7,
-    fillColor: "#4a7040",
-    fillOpacity: 0.06,
-  },
 }
 
 // ═══════════════════════════════════════════════════════════════════════════