From f7e1d4894d3288fb9771caa35513087a1f453d3d Mon Sep 17 00:00:00 2001
From: zrowdotnet <github@zrow.net>
Date: Sat, 16 Nov 2024 09:14:13 -0500
Subject: [PATCH] update built in module function calls & imports

---
 assets/chat/css/chat/_autocomplete.scss       | 3 ++-
 assets/chat/css/components/_form-control.scss | 5 +++--
 assets/chat/css/style.scss                    | 4 +++-
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/assets/chat/css/chat/_autocomplete.scss b/assets/chat/css/chat/_autocomplete.scss
index 922b02e0..bdc48e2b 100644
--- a/assets/chat/css/chat/_autocomplete.scss
+++ b/assets/chat/css/chat/_autocomplete.scss
@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use '../abstracts/' as a;
 
 #chat-auto-complete {
@@ -47,7 +48,7 @@
     }
 
     &:hover {
-      color: lighten(a.$color-chat-text3, 20);
+      color: color.adjust(a.$color-chat-text3, $lightness: 20%);
     }
 
     &.active {
diff --git a/assets/chat/css/components/_form-control.scss b/assets/chat/css/components/_form-control.scss
index 29c1282e..65075bba 100644
--- a/assets/chat/css/components/_form-control.scss
+++ b/assets/chat/css/components/_form-control.scss
@@ -1,14 +1,15 @@
+@use 'sass:color';
 @use '../abstracts/' as a;
 
 .form-control {
   color: a.$color-chat-text2;
   background: a.$color-surface-dark1;
-  border: 1px solid lighten(a.$color-surface-dark1, 9);
+  border: 1px solid color.adjust(a.$color-surface-dark1, $lightness: 9%);
 
   &:focus {
     color: a.$color-chat-text1;
     background: a.$color-surface-dark1;
-    border: 1px solid lighten(a.$color-surface-dark1, 15);
+    border: 1px solid color.adjust(a.$color-surface-dark1, $lightness: 15%);
     box-shadow: none;
     outline: none;
   }
diff --git a/assets/chat/css/style.scss b/assets/chat/css/style.scss
index b9e5912a..cae4cfee 100644
--- a/assets/chat/css/style.scss
+++ b/assets/chat/css/style.scss
@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 @use '~normalize.css/normalize';
 @use '~tippy.js/dist/tippy';
 @use '~tippy.js/dist/svg-arrow';
@@ -97,7 +99,7 @@ a {
 hr {
   border: 0;
   margin: 1em 0;
-  border-top: 1px solid darken(a.$color-surface-dark1, 50%);
+  border-top: 1px solid color.adjust(a.$color-surface-dark1, $lightness: -50%);
   border-bottom: 1px solid a.$color-surface-dark3;
 }