From 984502c85466bb177cf705d59c7f7a503542b5f6 Mon Sep 17 00:00:00 2001
From: fraxle <fraxle@yahoo.co.uk>
Date: Mon, 25 May 2026 07:08:03 +0100
Subject: [PATCH] 1.8.5

Data centre aligned
Toggle buttons brighter
---
 assets/css/table.css |  2 +-
 assets/css/ui.css    | 52 ++++++++++++++++++++++++++++++--------------
 2 files changed, 37 insertions(+), 17 deletions(-)

diff --git a/assets/css/table.css b/assets/css/table.css
index 4430955..4b1378c 100644
--- a/assets/css/table.css
+++ b/assets/css/table.css
@@ -487,7 +487,7 @@
 
 .utci-table td {
   padding: 10px 12px;
-  text-align: right;
+  text-align: center;
   font-family: JetBrains Mono, monospace;
   font-variant-numeric: tabular-nums;   /* stops digits jiggling between rows */
   white-space: nowrap;
diff --git a/assets/css/ui.css b/assets/css/ui.css
index 2802432..2bb1d97 100644
--- a/assets/css/ui.css
+++ b/assets/css/ui.css
@@ -386,23 +386,43 @@
 .cs-btn.grp-airqual:hover { background: rgba(219,230,206,0.80); color: #244408; border-color: rgba(36,68,8,0.50); }
 .cs-btn.grp-solar:hover   { background: rgba(240,224,194,0.80); color: #5a3004; border-color: rgba(90,48,4,0.50); }
 
-.cs-btn.grp-felt.on    { background: #0f9e63; border-color: #0f9e63; color: #fff; }
-.cs-btn.grp-surface.on { background: #2672c8; border-color: #2672c8; color: #fff; }
-.cs-btn.grp-ambient.on { background: #7a7870; border-color: #7a7870; color: #fff; }
-.cs-btn.grp-precip.on  { background: #b03060; border-color: #b03060; color: #fff; }
-.cs-btn.grp-sky.on     { background: #6058c8; border-color: #6058c8; color: #fff; }
-.cs-btn.grp-wind.on    { background: #b04030; border-color: #b04030; color: #fff; }
-.cs-btn.grp-airqual.on { background: #4a8018; border-color: #4a8018; color: #fff; }
-.cs-btn.grp-solar.on   { background: #b07820; border-color: #b07820; color: #fff; }
+/* Dropdown buttons - lighter palette to match toggle pills */
+.cs-btn.grp-felt.on    { background: #2ab578; border-color: #2ab578; color: #fff; }
+.cs-btn.grp-surface.on { background: #4088d4; border-color: #4088d4; color: #fff; }
+.cs-btn.grp-ambient.on { background: #929088; border-color: #929088; color: #fff; }
+.cs-btn.grp-precip.on  { background: #c24e6c; border-color: #c24e6c; color: #fff; }
+.cs-btn.grp-sky.on     { background: #786ec8; border-color: #786ec8; color: #fff; }
+.cs-btn.grp-wind.on    { background: #c25646; border-color: #c25646; color: #fff; }
+.cs-btn.grp-airqual.on { background: #5e9828; border-color: #5e9828; color: #fff; }
+.cs-btn.grp-solar.on   { background: #c08c34; border-color: #c08c34; color: #fff; }
 
-.cs-btn.grp-felt.on:hover    { background: #0c7d4e; border-color: #0c7d4e; color: #fff; }
-.cs-btn.grp-surface.on:hover { background: #1e5aa0; border-color: #1e5aa0; color: #fff; }
-.cs-btn.grp-ambient.on:hover { background: #5e5c56; border-color: #5e5c56; color: #fff; }
-.cs-btn.grp-precip.on:hover  { background: #8c264c; border-color: #8c264c; color: #fff; }
-.cs-btn.grp-sky.on:hover     { background: #4c48a8; border-color: #4c48a8; color: #fff; }
-.cs-btn.grp-wind.on:hover    { background: #8c3226; border-color: #8c3226; color: #fff; }
-.cs-btn.grp-airqual.on:hover { background: #3a6412; border-color: #3a6412; color: #fff; }
-.cs-btn.grp-solar.on:hover   { background: #8c5e18; border-color: #8c5e18; color: #fff; }
+.cs-btn.grp-felt.on:hover    { background: #1e9e64; border-color: #1e9e64; color: #fff; }
+.cs-btn.grp-surface.on:hover { background: #2e72bc; border-color: #2e72bc; color: #fff; }
+.cs-btn.grp-ambient.on:hover { background: #7a7870; border-color: #7a7870; color: #fff; }
+.cs-btn.grp-precip.on:hover  { background: #a83c5a; border-color: #a83c5a; color: #fff; }
+.cs-btn.grp-sky.on:hover     { background: #6258b0; border-color: #6258b0; color: #fff; }
+.cs-btn.grp-wind.on:hover    { background: #a84436; border-color: #a84436; color: #fff; }
+.cs-btn.grp-airqual.on:hover { background: #4c7e1a; border-color: #4c7e1a; color: #fff; }
+.cs-btn.grp-solar.on:hover   { background: #a87824; border-color: #a87824; color: #fff; }
+
+/* Toggle pills - lighter palette */
+.col-toggle.grp-felt.on    { background: #2ab578; border-color: #2ab578; color: #fff; }
+.col-toggle.grp-surface.on { background: #4088d4; border-color: #4088d4; color: #fff; }
+.col-toggle.grp-ambient.on { background: #929088; border-color: #929088; color: #fff; }
+.col-toggle.grp-precip.on  { background: #c24e6c; border-color: #c24e6c; color: #fff; }
+.col-toggle.grp-sky.on     { background: #786ec8; border-color: #786ec8; color: #fff; }
+.col-toggle.grp-wind.on    { background: #c25646; border-color: #c25646; color: #fff; }
+.col-toggle.grp-airqual.on { background: #5e9828; border-color: #5e9828; color: #fff; }
+.col-toggle.grp-solar.on   { background: #c08c34; border-color: #c08c34; color: #fff; }
+
+.col-toggle.grp-felt.on:hover    { background: #1e9e64; border-color: #1e9e64; color: #fff; }
+.col-toggle.grp-surface.on:hover { background: #2e72bc; border-color: #2e72bc; color: #fff; }
+.col-toggle.grp-ambient.on:hover { background: #7a7870; border-color: #7a7870; color: #fff; }
+.col-toggle.grp-precip.on:hover  { background: #a83c5a; border-color: #a83c5a; color: #fff; }
+.col-toggle.grp-sky.on:hover     { background: #6258b0; border-color: #6258b0; color: #fff; }
+.col-toggle.grp-wind.on:hover    { background: #a84436; border-color: #a84436; color: #fff; }
+.col-toggle.grp-airqual.on:hover { background: #4c7e1a; border-color: #4c7e1a; color: #fff; }
+.col-toggle.grp-solar.on:hover   { background: #a87824; border-color: #a87824; color: #fff; }
 
 /* ── VENT PILL - group colour tints ─────────────────────────────────────
    VentPill fuses with its sibling cs-btn so needs matching group tints.