stepper(guide): Make example accessible in dark mode.

Removed hard-coded colors and replaced with inherit colors.
Used font-weight to show active step.

Fixes angular#17152

Author: walvekarnikhil

src/components-examples/cdk/stepper/cdk-custom-stepper-without-form/example-custom-stepper.css

@@ -1,7 +1,8 @@
 .example-container {
-  border: 1px solid black;
+  border: 1px solid;
   padding: 10px;
   margin: 10px;
+  color: inherit;
 }
 
 .example-step-navigation-bar {
@@ -10,24 +11,22 @@
   margin-top: 10px;
 }
 
-.example-active {
-  color: blue;
-}
-
 .example-step {
   background: transparent;
   border: 0;
   margin: 0 10px;
   padding: 10px;
-  color: black;
+  color: inherit;
 }
 
 .example-step.example-active {
-  color: blue;
-  border-bottom: 1px solid blue;
+  color: inherit;
+  border-bottom: 1px solid;
+  font-weight: 600;
 }
 
 .example-nav-button {
   background: transparent;
   border: 0;
+  color: inherit;
 }

src/components-examples/cdk/stepper/cdk-linear-stepper-with-form/example-custom-linear-stepper.css

@@ -1,7 +1,8 @@
 .example-container {
-  border: 1px solid black;
+  border: 1px solid;
   padding: 10px;
   margin: 10px;
+  color: inherit;
 }
 
 .example-step-navigation-bar {
@@ -15,15 +16,17 @@
   border: 0;
   margin: 0 10px;
   padding: 10px;
-  color: black;
+  color: inherit;
 }
 
 .example-step.example-active {
-  border-bottom: 1px solid blue;
-  color: blue;
+  color: inherit;
+  border-bottom: 1px solid;
+  font-weight: 600;
 }
 
 .example-nav-button {
   background: transparent;
   border: 0;
+  color: inherit;
 }