table: Add border color relative to theme for accessibility (#25755)

scss/_tables.scss

@@ -100,7 +100,7 @@
 // inheritance to nested tables.
 
 @each $color, $value in $theme-colors {
-  @include table-row-variant($color, theme-color-level($color, -9));
+  @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
 }
 
 @include table-row-variant(active, $table-active-bg);

scss/_variables.scss

@@ -349,6 +349,9 @@ $table-striped-order:         odd !default;
 
 $table-caption-color:         $text-muted !default;
 
+$table-bg-level:              -9 !default;
+$table-border-level:          -6 !default;
+
 
 // Buttons + Forms
 //

scss/mixins/_table-row.scss

@@ -1,6 +1,6 @@
 // Tables
 
-@mixin table-row-variant($state, $background) {
+@mixin table-row-variant($state, $background, $border: null) {
   // Exact selectors below required to override `.table-striped` and prevent
   // inheritance to nested tables.
   .table-#{$state} {
@@ -9,6 +9,15 @@
     > td {
       background-color: $background;
     }
+
+    @if $border != null {
+      th,
+      td,
+      thead th,
+      tbody + tbody {
+        border-color: $border;
+      }
+    }
   }
 
   // Hover states for `.table-hover`