From 814e8290a2ee5424039100a5be5914bfe2c644c5 Mon Sep 17 00:00:00 2001
From: Deeman <hendriknote@gmail.com>
Date: Sun, 8 Mar 2026 20:24:21 +0100
Subject: [PATCH] fix(markets): add map legend + unify bubble color scales

- Add legend below map: bubble size = venue count, color = Market Score
- Unify opportunity score color to use same green/orange/red scale
  (was using blue for low scores, inconsistent with market score)
- Add mkt_legend_size / mkt_legend_color i18n keys (EN + DE)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../content/templates/markets.html            | 19 +++++++++++++++++--
 web/src/padelnomics/locales/de.json           |  2 ++
 web/src/padelnomics/locales/en.json           |  2 ++
 3 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/web/src/padelnomics/content/templates/markets.html b/web/src/padelnomics/content/templates/markets.html
index b273741..7e0d883 100644
--- a/web/src/padelnomics/content/templates/markets.html
+++ b/web/src/padelnomics/content/templates/markets.html
@@ -16,7 +16,22 @@
     <p class="text-slate">{{ t.mkt_subheading }}</p>
   </header>
 
-  <div id="markets-map" style="height:420px; border-radius:12px;" class="mb-6"></div>
+  <div id="markets-map" style="height:420px; border-radius:12px;" class="mb-4"></div>
+
+  <!-- Map legend -->
+  <div class="mb-6" style="display:flex; gap:1.5rem; align-items:center; font-size:0.82rem; color:#64748B;">
+    <span style="display:flex; align-items:center; gap:0.35rem;">
+      <span style="display:inline-block; width:12px; height:12px; border-radius:50%; background:#16A34A; border:2px solid white; box-shadow:0 1px 3px rgba(0,0,0,0.2);"></span>
+      <span style="display:inline-block; width:18px; height:18px; border-radius:50%; background:#16A34A; border:2px solid white; box-shadow:0 1px 3px rgba(0,0,0,0.2);"></span>
+      {{ t.mkt_legend_size }}
+    </span>
+    <span style="display:flex; align-items:center; gap:0.35rem;">
+      <span style="display:inline-block; width:14px; height:14px; border-radius:50%; background:#16A34A; border:2px solid white; box-shadow:0 1px 3px rgba(0,0,0,0.2);"></span>
+      <span style="display:inline-block; width:14px; height:14px; border-radius:50%; background:#D97706; border:2px solid white; box-shadow:0 1px 3px rgba(0,0,0,0.2);"></span>
+      <span style="display:inline-block; width:14px; height:14px; border-radius:50%; background:#DC2626; border:2px solid white; box-shadow:0 1px 3px rgba(0,0,0,0.2);"></span>
+      {{ t.mkt_legend_color }}
+    </span>
+  </div>
 
   <!-- Filters -->
   <div class="card mb-8">
@@ -100,7 +115,7 @@
       if (!c.lat || !c.lon) return;
       var size = 12 + 44 * Math.sqrt(c.total_venues / maxV);
       var color = scoreColor(c.avg_market_score);
-      var oppColor = c.avg_opportunity_score >= 60 ? '#16A34A' : (c.avg_opportunity_score >= 30 ? '#D97706' : '#3B82F6');
+      var oppColor = scoreColor(c.avg_opportunity_score || 0);
       var tip = '<strong>' + c.country_name_en + '</strong><br>'
         + c.total_venues + ' venues · ' + c.city_count + ' cities<br>'
         + '<span style="color:' + color + ';font-weight:600;">Padelnomics Market Score: ' + c.avg_market_score + '/100</span><br>'
diff --git a/web/src/padelnomics/locales/de.json b/web/src/padelnomics/locales/de.json
index be8981b..daaf050 100644
--- a/web/src/padelnomics/locales/de.json
+++ b/web/src/padelnomics/locales/de.json
@@ -606,6 +606,8 @@
   "mkt_all_countries": "Alle Länder",
   "mkt_all_regions": "Alle Regionen",
   "mkt_no_results": "Keine Märkte gefunden. Passe Deine Filter an.",
+  "mkt_legend_size": "Kreisgröße = Anzahl Anlagen",
+  "mkt_legend_color": "Farbe = Market Score",
   "waitlist_markets_title": "Marktdaten — Demnächst verfügbar",
   "waitlist_markets_sub": "Detaillierte Marktberichte für Padel-Investoren: Baukosten, Umsatz-Benchmarks, Auslastungsdaten und ROI-Analysen nach Stadt und Region.",
   "waitlist_markets_feature1": "Echte Kostendaten aus laufenden Anlagen in über 30 Ländern",
diff --git a/web/src/padelnomics/locales/en.json b/web/src/padelnomics/locales/en.json
index b878eb0..758d7ea 100644
--- a/web/src/padelnomics/locales/en.json
+++ b/web/src/padelnomics/locales/en.json
@@ -606,6 +606,8 @@
   "mkt_all_countries": "All Countries",
   "mkt_all_regions": "All Regions",
   "mkt_no_results": "No markets found. Try adjusting your filters.",
+  "mkt_legend_size": "Bubble size = venue count",
+  "mkt_legend_color": "Color = Market Score",
   "waitlist_markets_title": "Markets Intelligence — Coming Soon",
   "waitlist_markets_sub": "Deep-dive market reports for padel investors: construction costs, revenue benchmarks, occupancy data, and ROI analysis by city and region.",
   "waitlist_markets_feature1": "Real cost data from operating venues across 30+ countries",