1 files changed, 49 insertions, 12 deletions

diff --git a/src/assets/styles/bmc/custom/_buttons.scss b/src/assets/styles/bmc/custom/_buttons.scss
index 3f111302..e927d244 100644
--- a/src/assets/styles/bmc/custom/_buttons.scss
+++ b/src/assets/styles/bmc/custom/_buttons.scss
@@ -1,5 +1,4 @@
 .btn {
-  font-weight: $headings-font-weight;
   padding-top: $spacer / 2;
   padding-right: $spacer;
   padding-bottom: $spacer / 2;
@@ -10,34 +9,72 @@
   svg + span {
     margin-left: $spacer / 4;
   }
+  &:disabled {
+    color: gray("600");
+    fill: currentColor;
+    box-shadow: none !important;
+    &:not(.btn-link) {
+      border-color: gray("400");
+      background-color: gray("400");
+    }
+  }
 }
 
 .btn-primary {
   fill: currentColor;
+  &:focus,
+  &:not(:disabled):not(.disabled):active:focus {
+    border-color: $white;
+    box-shadow: inset 0 0 0 3px theme-color('primary'), inset 0 0 0 5px $white;
+  }
 }
 
 .btn-secondary {
   fill: currentColor;
+  &:focus,
+  &:not(:disabled):not(.disabled):active:focus {
+    border-color: $white;
+    box-shadow: inset 0 0 0 3px theme-color('secondary'), inset 0 0 0 5px $white;
+  }
 }
 
+// Global style for all button link
 .btn-link {
+  font-weight: $headings-font-weight;
   fill: theme-color("primary");
   text-decoration: none !important;
-
+  &:hover {
+    background-color: gray("200");
+    color: theme-color("primary");
+  }
+  &:active {
+    background-color: gray("300");
+  }
   &:focus {
-    box-shadow: $btn-focus-box-shadow;
+    box-shadow: inset 0 0 0 2px theme-color("primary");
+    color: theme-color("primary");
+    outline: none;
   }
-  &:hover {
-    fill: darken(theme-color("primary"), 15%);
+  &:disabled {
+    box-shadow: $btn-focus-box-shadow;
   }
 }
 
-.btn:disabled {
-  color: gray("600");
-  fill: currentColor;
-
-  &:not(.btn-link) {
-    border-color: gray("400");
-    background-color: gray("400");
+// Datepicker and Password toggle buttons
+.input-action {
+  position: absolute;
+  right: 0;
+}
+.input-action .btn-link,
+.input-action-btn {
+  position: absolute;
+  right: 1px;
+  top: 1px;
+  z-index: $zindex-dropdown + 1;
+  padding: 0;
+  width: 36px;
+  height: 35.8px;
+  svg {
+    vertical-align: sub;
   }
 }
\ No newline at end of file