v4: Miscellaneous color changes (#21199)

* Darken dismiss icon opacity
* Darken text on active list group items
* Darken light gray for accessibility/contrast, then update gray and dark gray to match

scss/_close.scss

@@ -5,13 +5,13 @@
   line-height: 1;
   color: $close-color;
   text-shadow: $close-text-shadow;
-  opacity: .2;
+  opacity: .5;
 
   @include hover-focus {
     color: $close-color;
     text-decoration: none;
     cursor: pointer;
-    opacity: .5;
+    opacity: .75;
   }
 }
 

scss/_variables.scss

@@ -92,9 +92,9 @@
 //
 // Grayscale and brand colors for use across Bootstrap.
 
-$gray-dark:                 #373a3c !default;
-$gray:                      #55595c !default;
-$gray-light:                #818a91 !default;
+$gray-dark:                 #292b2c !default;
+$gray:                      #464a4c !default;
+$gray-light:                #636c72 !default;
 $gray-lighter:              #eceeef !default;
 $gray-lightest:             #f7f7f9 !default;
 
@@ -829,7 +829,7 @@ $list-group-hover-bg:           #f5f5f5 !default;
 $list-group-active-color:       $component-active-color !default;
 $list-group-active-bg:          $component-active-bg !default;
 $list-group-active-border:      $list-group-active-bg !default;
-$list-group-active-text-color:  lighten($list-group-active-bg, 40%) !default;
+$list-group-active-text-color:  lighten($list-group-active-bg, 50%) !default;
 
 $list-group-disabled-color:      $gray-light !default;
 $list-group-disabled-bg:         $gray-lighter !default;