From e209ddf5d9ddc890f7ef578ce7818f46a0d9e515 Mon Sep 17 00:00:00 2001
From: Isabelle <isabelle@dewebsmid.nl>
Date: Tue, 10 Mar 2026 16:49:01 +0100
Subject: [PATCH] feat(extra-features): improve outline button text color on
 hover

---
 .../css/theme/custom/components/_buttons.scss | 22 +++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/falcon/_dev/css/theme/custom/components/_buttons.scss b/falcon/_dev/css/theme/custom/components/_buttons.scss
index 1e9bf6b..78c8aaa 100644
--- a/falcon/_dev/css/theme/custom/components/_buttons.scss
+++ b/falcon/_dev/css/theme/custom/components/_buttons.scss
@@ -15,6 +15,28 @@ $btn-color: (
     }
 }
 
+// Configure btn-outline text color on hover per button. (Same thing as above but for btn-outline and only on hover)
+$btn-outline-hover: (
+    "primary": $white,
+    "secondary": $white,
+);
+
+@each $name, $bg in $btn-outline-hover {
+    $text-color: if(
+        map-has-key($btn-color, $name),
+        map-get($btn-color, $name),
+        $white
+    );
+
+    .btn-outline-#{$name}:hover,
+    .btn-outline-#{$name}:focus,
+    .btn-outline-#{$name}:active,
+    .btn-outline-#{$name}.active,
+    .show > .btn-outline-#{$name}.dropdown-toggle {
+        color: $text-color !important;
+    }
+}
+
 // Bootstrap touchspin
 .bootstrap-touchspin {
     flex-wrap: nowrap;