diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_button.scss b/projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_button.scss
index 18b034e2000..cbd7dfc2362 100644
--- a/projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_button.scss
+++ b/projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_button.scss
@@ -11,7 +11,6 @@
 /// @type {Map}
 /// @prop {Color} shadow-color [transparent] - The shadow color of the button.
 /// @prop {Color} border-color [transparent] - The outline color of the button.
-/// @prop {Color} focus-border-color [transparent] - The focused border color of the button.
 /// @prop {Color} disabled-border-color [transparent] - The disabled border color of the button.
 /// @prop {Color} disabled-background [igx-color: ('grays', 300)] - The disabled background color of the button.
 /// @prop {Color} disabled-foreground [igx-color: ('grays', 500)] - The disabled foreground color of the button.
@@ -22,8 +21,6 @@ $material-base-button: (
 
     border-color: transparent,
 
-    focus-border-color: transparent,
-
     disabled-border-color: transparent,
 
     disabled-background: (
@@ -80,7 +77,6 @@ $material-flat-button: extend(
 
 /// @type {Map}
 /// @prop {Map} border-color [igx-color: ('secondary', 500)] - The outline color of the button.
-/// @prop {Map} focus-border-color [igx-color: ('grays', 300)] - The focused border color of the button.
 /// @prop {Map} disabled-border-color [igx-color: ('grays', 300)] - The disabled focused border color of the button.
 /// @requires {function} extend
 /// @requires {Map} $material-flat-button
@@ -90,11 +86,7 @@ $material-outlined-button: extend(
         selector: '[igxButton="outlined"], .igx-button--outlined',
 
         border-color: (
-            igx-color: ('secondary', 300)
-        ),
-
-        focus-border-color: (
-            igx-color: ('grays', 300)
+            igx-color: ('secondary', 500)
         ),
 
         disabled-border-color: (