From 68dc345ecb4f762476a70c56c1494aaf60c5385c Mon Sep 17 00:00:00 2001
From: CezarSTF <cezars@ensemble.com>
Date: Tue, 13 May 2025 11:42:06 +0300
Subject: [PATCH] FORMS-18761: Active user interface component lacks 3 to 1
 contrast ratio @sunnym @vavarshn

---
 src/site/_mixins.scss    | 4 ++--
 src/site/_variables.scss | 2 ++
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/site/_mixins.scss b/src/site/_mixins.scss
index 3c8fc84..dd0086c 100644
--- a/src/site/_mixins.scss
+++ b/src/site/_mixins.scss
@@ -78,7 +78,7 @@
   font-size: $font-m;
   height: $field-height;
   background-color: transparent;
-  border: $border-light;
+  border: $border-contrast;
   border-radius: $field-radius;
   padding: 0 $space-s;
   margin: $space-xs 0;
@@ -87,7 +87,7 @@
   box-sizing: border-box;
 
   &:hover:not([disabled]) {
-    border: $border-dark;
+    border: $border-darker;
     transition: border 0.3s ease-out;
   }
 
diff --git a/src/site/_variables.scss b/src/site/_variables.scss
index 3aabf6c..8461b79 100644
--- a/src/site/_variables.scss
+++ b/src/site/_variables.scss
@@ -26,8 +26,10 @@ $disabled-color: $background-color;
 $focus-outline: 2px $primary solid;
 $error-outline: 2px $error solid;
 $border-light: 2px $background-color solid;
+$border-contrast: 2px $light-gray solid;
 $border-error: 2px $error solid;
 $border-dark: 2px $light-gray solid;
+$border-darker: 2px $gray solid;