Expand the tooltip for population cap

It was removed in dee2b73c7d since it wasn't noticed that it referred to
the number in the top panel. Adding the number should make this more
clear. The color is only applied to the number instead of the whole line
so that it's harder to mistake it with just some fancy formatting.

Fixes: #7851

binaries/data/mods/public/gui/session/top_panel/CounterPopulation.js

@@ -25,13 +25,17 @@ class CounterPopulation
 		for (const resCode of g_ResourceData.GetCodes())
 			total += playerState.resourceGatherers[resCode];
 
-		this.stats.caption = coloredText(total, total ? this.DefaultTotalGatherersColor : this.DefaultTotalGatherersColorZero);
+		const colorizedTotal = coloredText(total,
+			total ? this.DefaultTotalGatherersColor : this.DefaultTotalGatherersColorZero);
+		this.stats.caption = colorizedTotal;
 
 		this.isTrainingBlocked = playerState.trainingBlocked;
 
 		this.panel.tooltip =
-			setStringTags(translate(this.PopulationTooltip), CounterManager.ResourceTitleTags) +
-			getAllyStatTooltip(this.getTooltipData.bind(this));
+			setStringTags(translate(this.PopulationTooltipTitle), CounterManager.ResourceTitleTags) +
+			"\n" + sprintf(this.PopulationTooltip, state) +
+			getAllyStatTooltip(this.getTooltipData.bind(this)) + "\n" +
+			sprintf(this.CurrentGatherersTooltip, { "currentGatherers": colorizedTotal });
 	}
 
 	getTooltipData(playerState, playername)
@@ -62,10 +66,20 @@ class CounterPopulation
 // Translation: Do not insert spaces around the slash symbol for this exact string. Keep only one space between popLimit and popMax.
 CounterPopulation.prototype.CounterCaption = markForTranslation("%(popCount)s/%(popLimit)s (%(popMax)s)");
 
-CounterPopulation.prototype.PopulationTooltip = markForTranslation("Population: current/limit (max)");
+CounterPopulation.prototype.PopulationTooltipTitle = markForTranslation("Population");
+CounterPopulation.prototype.PopulationTooltip =
+	translate("Current population: %(popCount)s\nPopulation limit: %(popLimit)s\nMaximum population: %(popMax)s");
 
 CounterPopulation.prototype.AllyPopulationTooltip = markForTranslation("%(popCount)s/%(popLimit)s (%(popMax)s)");
 
+/**
+ * Storing the translated and formatted gatherer string in the prototype.
+ * Including the number might seem redundant but is required since the collor
+ * isn't enough to associate it with the number in the top panel.
+ */
+CounterPopulation.prototype.CurrentGatherersTooltip =
+	setStringTags(translate("Current gatherers: %(currentGatherers)s"), { "font": "sans-14" });
+
 /**
  * Color to highlight the total number of gatherers at zero.
  */

binaries/data/mods/public/gui/session/top_panel/CounterResource.js

@@ -17,7 +17,9 @@ class CounterResource
 		this.count.caption = abbreviateLargeNumbers(Math.floor(playerState.resourceCounts[this.resCode]));
 
 		const gatherers = playerState.resourceGatherers[this.resCode];
-		this.stats.caption = coloredText(gatherers, gatherers ? this.DefaultResourceGatherersColor : this.DefaultResourceGatherersColorZero);
+		const colorizedGatherers = coloredText(gatherers,
+			gatherers ? this.DefaultResourceGatherersColor : this.DefaultResourceGatherersColorZero);
+		this.stats.caption = colorizedGatherers;
 
 
 		// TODO: Set the tooltip only if hovered?
@@ -28,7 +30,9 @@ class CounterResource
 		this.panel.tooltip =
 			setStringTags(resourceNameFirstWord(this.resCode), CounterManager.ResourceTitleTags) +
 			description +
-			getAllyStatTooltip(this.getTooltipData.bind(this));
+			getAllyStatTooltip(this.getTooltipData.bind(this)) + "\n" +
+			sprintf(CounterPopulation.prototype.CurrentGatherersTooltip,
+				{ "currentGatherers": colorizedGatherers });
 	}
 
 	getTooltipData(playerState, playername)