From ff8c7a676c345fd362adb7ed0bf9b6d62b3e11cd Mon Sep 17 00:00:00 2001
From: Sandra Bullock <Sandra@Bullock>
Date: Mon, 15 Jan 2024 17:05:38 +0200
Subject: [PATCH] fix: use of --sdt-bg-selected css variable

---
 src/lib/components/Calendar.svelte | 4 ++--
 src/lib/components/Time.svelte     | 9 +++++----
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/Calendar.svelte b/src/lib/components/Calendar.svelte
index 70c6f84..209e664 100644
--- a/src/lib/components/Calendar.svelte
+++ b/src/lib/components/Calendar.svelte
@@ -525,12 +525,12 @@
   border-bottom-left-radius: 0;
 }
 .is-selected + .is-selected .std-btn {
-  border-left: 1px solid color-mix(in srgb, white 75%, var(--sdt-table-selected-bg, #286090));
+  border-left: 1px solid color-mix(in srgb, white 75%, var(--sdt-table-selected-bg, var(--sdt-bg-selected, #286090)));
   margin-left: -1px;
 }
 .is-selected .std-btn,
 .is-selected.in-range .std-btn {
-  background-color: var(--sdt-table-selected-bg, #286090);
+  background-color: var(--sdt-table-selected-bg, var(--sdt-bg-selected, #286090));
   color: var(--sdt-color-selected, var(--sdt-bg-main, #fff));
   opacity: 0.9;
 }
diff --git a/src/lib/components/Time.svelte b/src/lib/components/Time.svelte
index 64de239..7f33bb6 100644
--- a/src/lib/components/Time.svelte
+++ b/src/lib/components/Time.svelte
@@ -465,7 +465,7 @@
   height: 6px;
   position: absolute;
   transform: translate(-50%, -50%);
-  background-color: var(--sdt-clock-selected-bg, #286090);
+  background-color: var(--sdt-clock-selected-bg, var(--sdt-bg-selected, #286090));
   border-radius: 50%;
 }
 .sdt-hand-pointer {
@@ -474,7 +474,7 @@
   bottom: 50%;
   left: calc(50% - 1px);
   position: absolute;
-  background-color: var(--sdt-clock-selected-bg, #286090);
+  background-color: var(--sdt-clock-selected-bg, var(--sdt-bg-selected, #286090));
   transform-origin: center bottom 0;
   transition: transform 0.3s ease, height 0.15s ease;
 }
@@ -485,10 +485,11 @@
   width: 4px;
   height: 4px;
   background-color: transparent;
-  border: 14px solid var(--sdt-clock-selected-bg, #286090);
+  border: 14px solid var(--sdt-clock-selected-bg, var(--sdt-bg-selected, #286090));
   border-radius: 50%;
   box-sizing: content-box;
 }
+
 .sdt-tick {
   position: absolute;
   width: 30px;
@@ -524,7 +525,7 @@
     background-color: transparent;
   }
   100% {
-    background-color: var(--sdt-clock-selected-bg, #286090);
+    background-color: var(--sdt-clock-selected-bg, var(--sdt-bg-selected, #286090));
     color: var(--sdt-color-selected, var(--sdt-bg-main, #fff));
   }
 }