From 2693175acaaa88f76213c0886f83f0671d2254d0 Mon Sep 17 00:00:00 2001
From: Sophie Schneider <sophie.schneider@shopify.com>
Date: Fri, 12 Nov 2021 17:55:14 -0500
Subject: [PATCH] modernized visually hidden styles

---
 src/styles/shared/_accessibility.scss | 21 +++++++++------------
 1 file changed, 9 insertions(+), 12 deletions(-)

diff --git a/src/styles/shared/_accessibility.scss b/src/styles/shared/_accessibility.scss
index 50cdc796979..3ca95d40f73 100644
--- a/src/styles/shared/_accessibility.scss
+++ b/src/styles/shared/_accessibility.scss
@@ -2,16 +2,13 @@
 /// accessibility tools.
 
 @mixin visually-hidden {
-  // Need to make sure we override any existing styles.
-  // stylelint-disable declaration-no-important
-  position: absolute !important;
-  top: 0;
-  left: 0;
-  clip: rect(1px, 1px, 1px, 1px) !important;
-  overflow: hidden !important;
-  height: 1px !important;
-  width: 1px !important;
-  padding: 0 !important;
-  border: 0 !important;
-  // stylelint-enable declaration-no-important
+  clip-path: inset(50%);
+  height: 1px;
+  width: 1px;
+  overflow: hidden;
+  position: absolute;
+  white-space: nowrap;
+  margin: 0;
+  padding: 0;
+  border: 0;
 }