diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue
index 1750e75c..9949c4e1 100644
--- a/src/digital-components/modal/modal.vue
+++ b/src/digital-components/modal/modal.vue
@@ -287,7 +287,7 @@ export default {
                 }
                 &:active,
                 &:focus {
-                    box-shadow: 0 0 0 3px #ffffff, 0 0 0 5.5px $heritage-blue-secondary; 
+                    box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $heritage-blue-secondary; 
                 }
             }
         }
diff --git a/src/iss-components/recal-modal/recal-modal.vue b/src/iss-components/recal-modal/recal-modal.vue
index 852befa2..2564c9cf 100644
--- a/src/iss-components/recal-modal/recal-modal.vue
+++ b/src/iss-components/recal-modal/recal-modal.vue
@@ -77,7 +77,7 @@ export default {
                     color: $heritage-blue-secondary;
                 }
                 &:focus, &:active {
-                    box-shadow: 0 0 0 3px #ffffff, 0 0 0 5.5px $heritage-blue-secondary; 
+                    box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $heritage-blue-secondary; 
                 }
                 font-weight: 600;
                 color: $heritage-blue-secondary;