From a08484f4506bfd7acb5cefad09cc87af40f5a2ed Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Thu, 28 Mar 2024 13:30:53 +0100
Subject: [PATCH] Fix default label color (#20232)

---
 src/components/data-table/ha-data-table-labels.ts | 3 ++-
 src/components/ha-filter-labels.ts                | 2 +-
 src/components/ha-labels-picker.ts                | 2 +-
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/data-table/ha-data-table-labels.ts b/src/components/data-table/ha-data-table-labels.ts
index 7156d6d4ca..1c47f0bf64 100644
--- a/src/components/data-table/ha-data-table-labels.ts
+++ b/src/components/data-table/ha-data-table-labels.ts
@@ -104,13 +104,14 @@ class HaDataTableLabels extends LitElement {
         flex-wrap: nowrap;
       }
       ha-label {
-        --ha-label-background-color: var(--color);
+        --ha-label-background-color: var(--color, var(--grey-color));
         --ha-label-background-opacity: 0.5;
       }
       ha-button-menu {
         border-radius: 10px;
       }
       .plus {
+        --ha-label-background-color: transparent;
         border: 1px solid var(--divider-color);
       }
     `;
diff --git a/src/components/ha-filter-labels.ts b/src/components/ha-filter-labels.ts
index 5b816272cd..317ed7f57f 100644
--- a/src/components/ha-filter-labels.ts
+++ b/src/components/ha-filter-labels.ts
@@ -168,7 +168,7 @@ export class HaFilterLabels extends SubscribeMixin(LitElement) {
           color: var(--error-color);
         }
         ha-label {
-          --ha-label-background-color: var(--color);
+          --ha-label-background-color: var(--color, var(--grey-color));
           --ha-label-background-opacity: 0.5;
         }
       `,
diff --git a/src/components/ha-labels-picker.ts b/src/components/ha-labels-picker.ts
index a011499120..ccf4511a61 100644
--- a/src/components/ha-labels-picker.ts
+++ b/src/components/ha-labels-picker.ts
@@ -199,7 +199,7 @@ export class HaLabelsPicker extends SubscribeMixin(LitElement) {
       margin-bottom: 8px;
     }
     ha-input-chip {
-      --md-input-chip-selected-container-color: var(--color);
+      --md-input-chip-selected-container-color: var(--color, var(--grey-color));
       --ha-input-chip-selected-container-opacity: 0.5;
     }
   `;