diff --git a/src/app/shared/components/button/button.component.scss b/src/app/shared/components/button/button.component.scss
index a6b042dc2981832e0fd90574478dc4a8e135cc60..ce30e9e2374f7514843ea3ed34ae303a4c1c65e4 100644
--- a/src/app/shared/components/button/button.component.scss
+++ b/src/app/shared/components/button/button.component.scss
@@ -16,7 +16,6 @@ button {
 
   &:focus-visible {
     outline-offset: 2px;
-    outline: 2px solid $blue-focus;
   }
 
   // WIDTH
diff --git a/src/app/shared/components/checkbox-filter/checkbox-filter.component.scss b/src/app/shared/components/checkbox-filter/checkbox-filter.component.scss
index 1e4560d900559f5d224e393081402ade3dcc138b..ca82d2ab945ca4edd96331adfa7456c40da13a2d 100644
--- a/src/app/shared/components/checkbox-filter/checkbox-filter.component.scss
+++ b/src/app/shared/components/checkbox-filter/checkbox-filter.component.scss
@@ -22,7 +22,6 @@ button {
   }
   &:focus-visible {
     outline-offset: 2px;
-    outline: 2px solid $blue-focus;
   }
   &.checked {
     border-color: $red;
diff --git a/src/app/shared/components/checkbox/checkbox.component.scss b/src/app/shared/components/checkbox/checkbox.component.scss
index a2cc287097538d55c7a5375fabd39771d2084bad..2439bf4820ebf6a2056077475df4098ade982843 100644
--- a/src/app/shared/components/checkbox/checkbox.component.scss
+++ b/src/app/shared/components/checkbox/checkbox.component.scss
@@ -48,7 +48,6 @@ input {
 
   &:focus-visible {
     outline-offset: 2px;
-    outline: 2px solid $blue-focus;
   }
 
   &:not(.checked) {
diff --git a/src/app/shared/components/collapsable-filter/collapsable-filter.component.scss b/src/app/shared/components/collapsable-filter/collapsable-filter.component.scss
index 06e681397dd53b5fe83f5b8d200cd425bcb73c1d..608493f33e70cc84241c0e2aba67e1f7bf120670 100644
--- a/src/app/shared/components/collapsable-filter/collapsable-filter.component.scss
+++ b/src/app/shared/components/collapsable-filter/collapsable-filter.component.scss
@@ -29,7 +29,6 @@ button {
   }
   &:focus-visible {
     outline-offset: 2px;
-    outline: 2px solid $blue-focus;
   }
   &.expanded {
     background-color: $red;
diff --git a/src/app/shared/components/collapse/collapse-header/collapse-header.component.scss b/src/app/shared/components/collapse/collapse-header/collapse-header.component.scss
index db098d19a9e208a266741171085dbbe001bbc114..924096a9849a08b3d6f666c0dfc0a779c838244b 100644
--- a/src/app/shared/components/collapse/collapse-header/collapse-header.component.scss
+++ b/src/app/shared/components/collapse/collapse-header/collapse-header.component.scss
@@ -28,9 +28,4 @@
       transform: rotate(180deg);
     }
   }
-
-  &:focus-visible {
-    outline-offset: 0;
-    outline: 2px solid $blue-focus;
-  }
 }
diff --git a/src/app/shared/components/input/input.component.scss b/src/app/shared/components/input/input.component.scss
index b8d4c166b86de44156e206a2e07228e394504e5d..5593ae056ab61c261dd87bd27bc93af47a96f84f 100644
--- a/src/app/shared/components/input/input.component.scss
+++ b/src/app/shared/components/input/input.component.scss
@@ -72,8 +72,8 @@
         height: 40px;
       }
 
-      &:focus {
-        border-color: $grey-1;
+      &:focus-visible {
+        outline-offset: 2px;
       }
       &.success {
         border-color: $info-success;
diff --git a/src/app/shared/components/nav-bar/nav-bar.component.scss b/src/app/shared/components/nav-bar/nav-bar.component.scss
index 1893a0b09b6732cf53d3cefd324279ed6177f2ac..b5798773ce1f2eec02d302566fc27e7434eb98f8 100644
--- a/src/app/shared/components/nav-bar/nav-bar.component.scss
+++ b/src/app/shared/components/nav-bar/nav-bar.component.scss
@@ -25,7 +25,6 @@ nav {
       justify-content: center;
       flex: 1;
       border-bottom: 3px solid transparent;
-      transition: all 0.3s ease-in-out;
       outline-offset: -2px; // Fixes the focus display issue in Firefox where it was not visible due to "overflow-x" on .navigation
       &.active {
         @include font-bold-16;
@@ -34,9 +33,6 @@ nav {
       &:hover {
         border-color: $grey-4;
       }
-      &:focus {
-        outline-color: $red;
-      }
     }
   }
 }
diff --git a/src/app/shared/components/search-bar/search-bar.component.scss b/src/app/shared/components/search-bar/search-bar.component.scss
index 18bc89006f93b99a3ab4bca01c946361224bd201..9cda69ceba731b70e7dd0356ee9b158ed7677d1c 100644
--- a/src/app/shared/components/search-bar/search-bar.component.scss
+++ b/src/app/shared/components/search-bar/search-bar.component.scss
@@ -19,7 +19,6 @@
 
     &:focus-visible {
       outline-offset: 2px;
-      outline: 2px solid $blue-focus;
     }
 
     &::placeholder {
diff --git a/src/app/shared/components/tag-item/tag-item.component.scss b/src/app/shared/components/tag-item/tag-item.component.scss
index ade1b9a877970bdd2032b6365e4f180c8a44f25b..f09eb8a10888ccd1481d4f543cbc3f1bd8e942a1 100644
--- a/src/app/shared/components/tag-item/tag-item.component.scss
+++ b/src/app/shared/components/tag-item/tag-item.component.scss
@@ -97,7 +97,6 @@ button {
 
   &:focus-visible {
     outline-offset: 2px;
-    outline: 2px solid $blue-focus;
   }
 
   &.unclickable {
diff --git a/src/app/shared/components/textarea/textarea.component.scss b/src/app/shared/components/textarea/textarea.component.scss
index 9e7268b2f785bfee075032ea30fc8da6e0064d50..72754051cdb58b48620ef0833d184267d9f74097 100644
--- a/src/app/shared/components/textarea/textarea.component.scss
+++ b/src/app/shared/components/textarea/textarea.component.scss
@@ -43,9 +43,8 @@
     transition: all 0.3s ease-in-out;
     background: $grey-10;
 
-    &:focus {
-      outline: none;
-      border-color: $grey-1;
+    &:focus-visible {
+      outline-offset: 2px;
     }
 
     &:disabled {
diff --git a/src/styles.scss b/src/styles.scss
index 2bdda62dce7d9d27bbfec15ca52e1e58182a75a2..a8322ad8d7fcf67f6ae1e0dc33b59920619d4182 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -183,13 +183,6 @@ form p.notRequired {
   }
 }
 
-button {
-  &:focus,
-  &:focus-within {
-    outline-color: $red;
-  }
-}
-
 // Layout
 .w-100 {
   width: 100%;
@@ -291,7 +284,7 @@ button {
 }
 
 :focus-visible {
-  outline-color: $red;
+  outline: 2px solid $blue-focus;
 }
 
 .visually-hidden {