@clayui/css 3.99.0 → 3.101.0

package/lib/css/base.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /**
- * Clay 3.99.0
+ * Clay 3.101.0
  *
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -1178,18 +1178,18 @@ button.collapse-icon .c-inner {
   color: #212529;
   text-decoration: none;
 }
-.btn:focus, .btn.focus {
+.btn.focus, .btn:focus-visible, .c-prefers-focus .btn:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
-.btn:active:focus {
+.btn:active:focus-visible, .c-prefers-focus .btn:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .btn:disabled, .btn.disabled {
   cursor: not-allowed;
   opacity: 0.65;
 }
-.btn:disabled:focus, .btn.disabled:focus {
+.btn:disabled:focus-visible, .c-prefers-focus .btn:disabled:focus, .btn.disabled:focus-visible, .c-prefers-focus .btn.disabled:focus {
   box-shadow: none;
 }
 .btn:disabled:active, .btn.disabled:active {
@@ -1384,7 +1384,7 @@ input[type=button].btn-block {
   border-color: #0062cc;
   color: #fff;
 }
-.btn-primary:focus, .btn-primary.focus {
+.btn-primary.focus, .btn-primary:focus-visible, .c-prefers-focus .btn-primary:focus {
   background-color: #0069d9;
   border-color: #0062cc;
   color: #fff;
@@ -1419,7 +1419,7 @@ input[type=button].btn-block {
   border-color: #545b62;
   color: #fff;
 }
-.btn-secondary:focus, .btn-secondary.focus {
+.btn-secondary.focus, .btn-secondary:focus-visible, .c-prefers-focus .btn-secondary:focus {
   background-color: #5a6268;
   border-color: #545b62;
   color: #fff;
@@ -1454,7 +1454,7 @@ input[type=button].btn-block {
   border-color: #1e7e34;
   color: #fff;
 }
-.btn-success:focus, .btn-success.focus {
+.btn-success.focus, .btn-success:focus-visible, .c-prefers-focus .btn-success:focus {
   background-color: #218838;
   border-color: #1e7e34;
   color: #fff;
@@ -1489,7 +1489,7 @@ input[type=button].btn-block {
   border-color: #117a8b;
   color: #fff;
 }
-.btn-info:focus, .btn-info.focus {
+.btn-info.focus, .btn-info:focus-visible, .c-prefers-focus .btn-info:focus {
   background-color: #138496;
   border-color: #117a8b;
   color: #fff;
@@ -1524,7 +1524,7 @@ input[type=button].btn-block {
   border-color: #d39e00;
   color: #212529;
 }
-.btn-warning:focus, .btn-warning.focus {
+.btn-warning.focus, .btn-warning:focus-visible, .c-prefers-focus .btn-warning:focus {
   background-color: #e0a800;
   border-color: #d39e00;
   color: #212529;
@@ -1559,7 +1559,7 @@ input[type=button].btn-block {
   border-color: #bd2130;
   color: #fff;
 }
-.btn-danger:focus, .btn-danger.focus {
+.btn-danger.focus, .btn-danger:focus-visible, .c-prefers-focus .btn-danger:focus {
   background-color: #c82333;
   border-color: #bd2130;
   color: #fff;
@@ -1594,7 +1594,7 @@ input[type=button].btn-block {
   border-color: #dae0e5;
   color: #212529;
 }
-.btn-light:focus, .btn-light.focus {
+.btn-light.focus, .btn-light:focus-visible, .c-prefers-focus .btn-light:focus {
   background-color: #e2e6ea;
   border-color: #dae0e5;
   color: #212529;
@@ -1629,7 +1629,7 @@ input[type=button].btn-block {
   border-color: #1d2124;
   color: #fff;
 }
-.btn-dark:focus, .btn-dark.focus {
+.btn-dark.focus, .btn-dark:focus-visible, .c-prefers-focus .btn-dark:focus {
   background-color: #23272b;
   border-color: #1d2124;
   color: #fff;
@@ -1664,11 +1664,11 @@ input[type=button].btn-block {
   color: #0056b3;
   text-decoration: underline;
 }
-.btn-link:focus, .btn-link.focus {
+.btn-link.focus, .btn-link:focus-visible, .c-prefers-focus .btn-link:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   text-decoration: none;
 }
-.btn-link:active:focus {
+.btn-link:active:focus-visible, .c-prefers-focus .btn-link:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .btn-link:disabled, .btn-link.disabled {
@@ -1677,18 +1677,32 @@ input[type=button].btn-block {
   text-decoration: none;
 }
 .btn-beta {
-  background-color: white;
+  background-color: rgba(19, 132, 150, 0.04);
   color: #138496;
   text-transform: uppercase;
 }
 .btn-beta:hover {
-  background-color: #f8f9fa;
+  background-color: rgba(19, 132, 150, 0.06);
   color: #138496;
 }
-.btn-beta:focus, .focus.btn-beta {
-  background-color: #f8f9fa;
+.focus.btn-beta, .btn-beta:focus-visible, .c-prefers-focus .btn-beta:focus {
+  background-color: rgba(19, 132, 150, 0.06);
   color: #138496;
 }
+.btn-beta-dark {
+  background-color: rgba(135, 226, 240, 0.04);
+  border-color: transparent;
+  color: #5ad7ea;
+  text-transform: uppercase;
+}
+.btn-beta-dark:hover {
+  background-color: rgba(135, 226, 240, 0.06);
+  color: #5ad7ea;
+}
+.focus.btn-beta-dark, .btn-beta-dark:focus-visible, .c-prefers-focus .btn-beta-dark:focus {
+  background-color: rgba(135, 226, 240, 0.06);
+  color: #5ad7ea;
+}
 .btn-outline-primary {
   border-color: #007bff;
   color: #007bff;
@@ -1698,7 +1712,7 @@ input[type=button].btn-block {
   border-color: #007bff;
   color: #fff;
 }
-.btn-outline-primary:focus, .btn-outline-primary.focus {
+.btn-outline-primary.focus, .btn-outline-primary:focus-visible, .c-prefers-focus .btn-outline-primary:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
 }
 .btn-outline-primary:active {
@@ -1706,7 +1720,7 @@ input[type=button].btn-block {
   border-color: #007bff;
   color: #fff;
 }
-.btn-outline-primary:active:focus {
+.btn-outline-primary:active:focus-visible, .c-prefers-focus .btn-outline-primary:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
 }
 .btn-outline-primary.active {
@@ -1732,7 +1746,7 @@ input[type=button].btn-block {
   border-color: #6c757d;
   color: #fff;
 }
-.btn-outline-secondary:focus, .btn-outline-secondary.focus {
+.btn-outline-secondary.focus, .btn-outline-secondary:focus-visible, .c-prefers-focus .btn-outline-secondary:focus {
   box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
 }
 .btn-outline-secondary:active {
@@ -1740,7 +1754,7 @@ input[type=button].btn-block {
   border-color: #6c757d;
   color: #fff;
 }
-.btn-outline-secondary:active:focus {
+.btn-outline-secondary:active:focus-visible, .c-prefers-focus .btn-outline-secondary:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
 }
 .btn-outline-secondary.active {
@@ -1766,7 +1780,7 @@ input[type=button].btn-block {
   border-color: #28a745;
   color: #fff;
 }
-.btn-outline-success:focus, .btn-outline-success.focus {
+.btn-outline-success.focus, .btn-outline-success:focus-visible, .c-prefers-focus .btn-outline-success:focus {
   box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
 }
 .btn-outline-success:active {
@@ -1774,7 +1788,7 @@ input[type=button].btn-block {
   border-color: #28a745;
   color: #fff;
 }
-.btn-outline-success:active:focus {
+.btn-outline-success:active:focus-visible, .c-prefers-focus .btn-outline-success:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
 }
 .btn-outline-success.active {
@@ -1800,7 +1814,7 @@ input[type=button].btn-block {
   border-color: #17a2b8;
   color: #fff;
 }
-.btn-outline-info:focus, .btn-outline-info.focus {
+.btn-outline-info.focus, .btn-outline-info:focus-visible, .c-prefers-focus .btn-outline-info:focus {
   box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
 }
 .btn-outline-info:active {
@@ -1808,7 +1822,7 @@ input[type=button].btn-block {
   border-color: #17a2b8;
   color: #fff;
 }
-.btn-outline-info:active:focus {
+.btn-outline-info:active:focus-visible, .c-prefers-focus .btn-outline-info:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
 }
 .btn-outline-info.active {
@@ -1834,7 +1848,7 @@ input[type=button].btn-block {
   border-color: #ffc107;
   color: #212529;
 }
-.btn-outline-warning:focus, .btn-outline-warning.focus {
+.btn-outline-warning.focus, .btn-outline-warning:focus-visible, .c-prefers-focus .btn-outline-warning:focus {
   box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
 }
 .btn-outline-warning:active {
@@ -1842,7 +1856,7 @@ input[type=button].btn-block {
   border-color: #ffc107;
   color: #212529;
 }
-.btn-outline-warning:active:focus {
+.btn-outline-warning:active:focus-visible, .c-prefers-focus .btn-outline-warning:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
 }
 .btn-outline-warning.active {
@@ -1868,7 +1882,7 @@ input[type=button].btn-block {
   border-color: #dc3545;
   color: #fff;
 }
-.btn-outline-danger:focus, .btn-outline-danger.focus {
+.btn-outline-danger.focus, .btn-outline-danger:focus-visible, .c-prefers-focus .btn-outline-danger:focus {
   box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
 }
 .btn-outline-danger:active {
@@ -1876,7 +1890,7 @@ input[type=button].btn-block {
   border-color: #dc3545;
   color: #fff;
 }
-.btn-outline-danger:active:focus {
+.btn-outline-danger:active:focus-visible, .c-prefers-focus .btn-outline-danger:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
 }
 .btn-outline-danger.active {
@@ -1902,7 +1916,7 @@ input[type=button].btn-block {
   border-color: #f8f9fa;
   color: #212529;
 }
-.btn-outline-light:focus, .btn-outline-light.focus {
+.btn-outline-light.focus, .btn-outline-light:focus-visible, .c-prefers-focus .btn-outline-light:focus {
   box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
 }
 .btn-outline-light:active {
@@ -1910,7 +1924,7 @@ input[type=button].btn-block {
   border-color: #f8f9fa;
   color: #212529;
 }
-.btn-outline-light:active:focus {
+.btn-outline-light:active:focus-visible, .c-prefers-focus .btn-outline-light:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
 }
 .btn-outline-light.active {
@@ -1936,7 +1950,7 @@ input[type=button].btn-block {
   border-color: #343a40;
   color: #fff;
 }
-.btn-outline-dark:focus, .btn-outline-dark.focus {
+.btn-outline-dark.focus, .btn-outline-dark:focus-visible, .c-prefers-focus .btn-outline-dark:focus {
   box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
 }
 .btn-outline-dark:active {
@@ -1944,7 +1958,7 @@ input[type=button].btn-block {
   border-color: #343a40;
   color: #fff;
 }
-.btn-outline-dark:active:focus {
+.btn-outline-dark:active:focus-visible, .c-prefers-focus .btn-outline-dark:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
 }
 .btn-outline-dark.active {
@@ -1967,7 +1981,7 @@ input[type=button].btn-block {
 .btn-outline-borderless:hover {
   border-color: transparent;
 }
-.btn-outline-borderless:focus, .btn-outline-borderless.focus {
+.btn-outline-borderless.focus, .btn-outline-borderless:focus-visible, .c-prefers-focus .btn-outline-borderless:focus {
   border-color: transparent;
 }
 .btn-outline-borderless:disabled, .btn-outline-borderless.disabled {
@@ -3371,9 +3385,10 @@ input[type=button].btn-block {
 .alert-link.btn-unstyled.hover {
   text-decoration: underline;
 }
-.alert-link.focus, .alert-link:focus,
+.alert-link.focus, .alert-link:focus-visible, .c-prefers-focus .alert-link:focus,
 .alert-link.btn-unstyled.focus,
-.alert-link.btn-unstyled:focus {
+.alert-link.btn-unstyled:focus-visible,
+.c-prefers-focus .alert-link.btn-unstyled:focus {
   text-decoration: underline;
 }
 .alert-indicator {
@@ -3911,7 +3926,7 @@ input[type=button].btn-block {
 .badge[href]:hover, .badge[href].hover, .badge[type]:hover, .badge[type].hover {
   text-decoration: none;
 }
-.badge[href].focus, .badge[href]:focus, .badge[type].focus, .badge[type]:focus {
+.badge[href].focus, .badge[href]:focus-visible, .c-prefers-focus .badge[href]:focus, .badge[type].focus, .badge[type]:focus-visible, .c-prefers-focus .badge[type]:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -3922,7 +3937,7 @@ input[type=button].btn-block {
 .badge a:hover, .badge a.hover {
   text-decoration: none;
 }
-.badge a.focus, .badge a:focus {
+.badge a.focus, .badge a:focus-visible, .c-prefers-focus .badge a:focus {
   text-decoration: none;
 }
 .badge > .c-inner {
@@ -3991,9 +4006,10 @@ input[type=button].btn-block {
   color: inherit;
   opacity: 1;
 }
-.badge-item .close:focus {
+.badge-item .close.focus, .badge-item .close:focus-visible, .c-prefers-focus .badge-item .close:focus {
   opacity: 1;
 }
+
 .badge-item .lexicon-icon {
   height: 0.875em;
   margin-top: 0;
@@ -4037,7 +4053,7 @@ input[type=button].btn-block {
   background-color: #0062cc;
   color: #fff;
 }
-[href].focus.badge-primary, [href].badge-primary:focus, [type].focus.badge-primary, [type].badge-primary:focus {
+[href].focus.badge-primary, [href].badge-primary:focus-visible, .c-prefers-focus [href].badge-primary:focus, [type].focus.badge-primary, [type].badge-primary:focus-visible, .c-prefers-focus [type].badge-primary:focus {
   background-color: #0062cc;
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
   color: #fff;
@@ -4050,7 +4066,7 @@ input[type=button].btn-block {
   background-color: #545b62;
   color: #fff;
 }
-[href].focus.badge-secondary, [href].badge-secondary:focus, [type].focus.badge-secondary, [type].badge-secondary:focus {
+[href].focus.badge-secondary, [href].badge-secondary:focus-visible, .c-prefers-focus [href].badge-secondary:focus, [type].focus.badge-secondary, [type].badge-secondary:focus-visible, .c-prefers-focus [type].badge-secondary:focus {
   background-color: #545b62;
   color: #fff;
   box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
@@ -4063,7 +4079,7 @@ input[type=button].btn-block {
   background-color: #1e7e34;
   color: #fff;
 }
-[href].focus.badge-success, [href].badge-success:focus, [type].focus.badge-success, [type].badge-success:focus {
+[href].focus.badge-success, [href].badge-success:focus-visible, .c-prefers-focus [href].badge-success:focus, [type].focus.badge-success, [type].badge-success:focus-visible, .c-prefers-focus [type].badge-success:focus {
   background-color: #1e7e34;
   color: #fff;
   box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
@@ -4076,7 +4092,7 @@ input[type=button].btn-block {
   background-color: #117a8b;
   color: #fff;
 }
-[href].focus.badge-info, [href].badge-info:focus, [type].focus.badge-info, [type].badge-info:focus {
+[href].focus.badge-info, [href].badge-info:focus-visible, .c-prefers-focus [href].badge-info:focus, [type].focus.badge-info, [type].badge-info:focus-visible, .c-prefers-focus [type].badge-info:focus {
   background-color: #117a8b;
   color: #fff;
   box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
@@ -4089,7 +4105,7 @@ input[type=button].btn-block {
   background-color: #d39e00;
   color: #212529;
 }
-[href].focus.badge-warning, [href].badge-warning:focus, [type].focus.badge-warning, [type].badge-warning:focus {
+[href].focus.badge-warning, [href].badge-warning:focus-visible, .c-prefers-focus [href].badge-warning:focus, [type].focus.badge-warning, [type].badge-warning:focus-visible, .c-prefers-focus [type].badge-warning:focus {
   background-color: #d39e00;
   color: #212529;
   box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5);
@@ -4102,7 +4118,7 @@ input[type=button].btn-block {
   background-color: #bd2130;
   color: #fff;
 }
-[href].focus.badge-danger, [href].badge-danger:focus, [type].focus.badge-danger, [type].badge-danger:focus {
+[href].focus.badge-danger, [href].badge-danger:focus-visible, .c-prefers-focus [href].badge-danger:focus, [type].focus.badge-danger, [type].badge-danger:focus-visible, .c-prefers-focus [type].badge-danger:focus {
   background-color: #bd2130;
   color: #fff;
   box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
@@ -4115,7 +4131,7 @@ input[type=button].btn-block {
   background-color: #dae0e5;
   color: #212529;
 }
-[href].focus.badge-light, [href].badge-light:focus, [type].focus.badge-light, [type].badge-light:focus {
+[href].focus.badge-light, [href].badge-light:focus-visible, .c-prefers-focus [href].badge-light:focus, [type].focus.badge-light, [type].badge-light:focus-visible, .c-prefers-focus [type].badge-light:focus {
   background-color: #dae0e5;
   color: #212529;
   box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
@@ -4128,16 +4144,21 @@ input[type=button].btn-block {
   background-color: #1d2124;
   color: #fff;
 }
-[href].focus.badge-dark, [href].badge-dark:focus, [type].focus.badge-dark, [type].badge-dark:focus {
+[href].focus.badge-dark, [href].badge-dark:focus-visible, .c-prefers-focus [href].badge-dark:focus, [type].focus.badge-dark, [type].badge-dark:focus-visible, .c-prefers-focus [type].badge-dark:focus {
   background-color: #1d2124;
   color: #fff;
   box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
 }
 .badge-beta {
-  background-color: white;
+  background-color: rgba(19, 132, 150, 0.04);
   color: #138496;
   text-transform: uppercase;
 }
+.badge-beta-dark {
+  background-color: rgba(135, 226, 240, 0.04);
+  color: #5ad7ea;
+  text-transform: uppercase;
+}
 .breadcrumb {
   background-color: #e9ecef;
   border-radius: 0.25rem;
@@ -4157,7 +4178,7 @@ input[type=button].btn-block {
   color: #0056b3;
   text-decoration: underline;
 }
-.breadcrumb-link.focus, .breadcrumb-link:focus {
+.breadcrumb-link.focus, .breadcrumb-link:focus-visible, .c-prefers-focus .breadcrumb-link:focus {
   color: #0056b3;
   text-decoration: underline;
 }
@@ -4203,7 +4224,7 @@ input[type=button].btn-block {
 .breadcrumb-item .dropdown-toggle:hover {
   text-decoration: none;
 }
-.breadcrumb-item .dropdown-toggle:focus, .breadcrumb-item .dropdown-toggle.focus {
+.breadcrumb-item .dropdown-toggle.focus, .breadcrumb-item .dropdown-toggle:focus-visible, .c-prefers-focus .breadcrumb-item .dropdown-toggle:focus {
   text-decoration: none;
 }
 .breadcrumb-text-truncate {
@@ -4448,9 +4469,10 @@ input[type=button].btn-block {
   color: inherit;
   text-decoration: none;
 }
-.label a.focus, .label a:focus,
+.label a.focus, .label a:focus-visible, .c-prefers-focus .label a:focus,
 .label .btn-unstyled.focus,
-.label .btn-unstyled:focus {
+.label .btn-unstyled:focus-visible,
+.c-prefers-focus .label .btn-unstyled:focus {
   color: inherit;
   text-decoration: none;
 }
@@ -4528,9 +4550,10 @@ input[type=button].btn-block {
   color: inherit;
   opacity: 1;
 }
-.label-item .close:focus {
+.label-item .close.focus, .label-item .close:focus-visible, .c-prefers-focus .label-item .close:focus {
   opacity: 1;
 }
+
 .label-item .close:disabled, .label-item .close.disabled {
   opacity: 0.65;
 }
@@ -4584,7 +4607,7 @@ input[type=button].btn-block {
   border-color: #0062cc;
   color: #0062cc;
 }
-[href].focus.label-primary, [href].label-primary:focus, [type].focus.label-primary, [type].label-primary:focus, [tabindex].focus.label-primary, [tabindex].label-primary:focus {
+[href].focus.label-primary, [href].label-primary:focus-visible, .c-prefers-focus [href].label-primary:focus, [type].focus.label-primary, [type].label-primary:focus-visible, .c-prefers-focus [type].label-primary:focus, [tabindex].focus.label-primary, [tabindex].label-primary:focus-visible, .c-prefers-focus [tabindex].label-primary:focus {
   color: #0062cc;
 }
 .label-primary a:hover, .label-primary a.hover,
@@ -4595,9 +4618,10 @@ input[type=button].btn-block {
 .label-primary .close:hover {
   color: #0062cc;
 }
-.label-primary .close:focus {
+.label-primary .close.focus, .label-primary .close:focus-visible, .c-prefers-focus .label-primary .close:focus {
   color: #0062cc;
 }
+
 .label-secondary {
   background-color: #fff;
   border-color: #6c757d;
@@ -4607,7 +4631,7 @@ input[type=button].btn-block {
   border-color: #545b62;
   color: #545b62;
 }
-[href].focus.label-secondary, [href].label-secondary:focus, [type].focus.label-secondary, [type].label-secondary:focus, [tabindex].focus.label-secondary, [tabindex].label-secondary:focus {
+[href].focus.label-secondary, [href].label-secondary:focus-visible, .c-prefers-focus [href].label-secondary:focus, [type].focus.label-secondary, [type].label-secondary:focus-visible, .c-prefers-focus [type].label-secondary:focus, [tabindex].focus.label-secondary, [tabindex].label-secondary:focus-visible, .c-prefers-focus [tabindex].label-secondary:focus {
   color: #545b62;
 }
 .label-secondary a:hover, .label-secondary a.hover,
@@ -4618,9 +4642,10 @@ input[type=button].btn-block {
 .label-secondary .close:hover {
   color: #545b62;
 }
-.label-secondary .close:focus {
+.label-secondary .close.focus, .label-secondary .close:focus-visible, .c-prefers-focus .label-secondary .close:focus {
   color: #545b62;
 }
+
 .label-success {
   background-color: #fff;
   border-color: #28a745;
@@ -4630,7 +4655,7 @@ input[type=button].btn-block {
   border-color: #1e7e34;
   color: #1e7e34;
 }
-[href].focus.label-success, [href].label-success:focus, [type].focus.label-success, [type].label-success:focus, [tabindex].focus.label-success, [tabindex].label-success:focus {
+[href].focus.label-success, [href].label-success:focus-visible, .c-prefers-focus [href].label-success:focus, [type].focus.label-success, [type].label-success:focus-visible, .c-prefers-focus [type].label-success:focus, [tabindex].focus.label-success, [tabindex].label-success:focus-visible, .c-prefers-focus [tabindex].label-success:focus {
   color: #1e7e34;
 }
 .label-success a:hover, .label-success a.hover,
@@ -4641,9 +4666,10 @@ input[type=button].btn-block {
 .label-success .close:hover {
   color: #1e7e34;
 }
-.label-success .close:focus {
+.label-success .close.focus, .label-success .close:focus-visible, .c-prefers-focus .label-success .close:focus {
   color: #1e7e34;
 }
+
 .label-info {
   background-color: #fff;
   border-color: #17a2b8;
@@ -4653,7 +4679,7 @@ input[type=button].btn-block {
   border-color: #117a8b;
   color: #117a8b;
 }
-[href].focus.label-info, [href].label-info:focus, [type].focus.label-info, [type].label-info:focus, [tabindex].focus.label-info, [tabindex].label-info:focus {
+[href].focus.label-info, [href].label-info:focus-visible, .c-prefers-focus [href].label-info:focus, [type].focus.label-info, [type].label-info:focus-visible, .c-prefers-focus [type].label-info:focus, [tabindex].focus.label-info, [tabindex].label-info:focus-visible, .c-prefers-focus [tabindex].label-info:focus {
   color: #117a8b;
 }
 .label-info a:hover, .label-info a.hover,
@@ -4664,9 +4690,10 @@ input[type=button].btn-block {
 .label-info .close:hover {
   color: #117a8b;
 }
-.label-info .close:focus {
+.label-info .close.focus, .label-info .close:focus-visible, .c-prefers-focus .label-info .close:focus {
   color: #117a8b;
 }
+
 .label-warning {
   background-color: #fff;
   border-color: #ffc107;
@@ -4676,7 +4703,7 @@ input[type=button].btn-block {
   border-color: #d39e00;
   color: #d39e00;
 }
-[href].focus.label-warning, [href].label-warning:focus, [type].focus.label-warning, [type].label-warning:focus, [tabindex].focus.label-warning, [tabindex].label-warning:focus {
+[href].focus.label-warning, [href].label-warning:focus-visible, .c-prefers-focus [href].label-warning:focus, [type].focus.label-warning, [type].label-warning:focus-visible, .c-prefers-focus [type].label-warning:focus, [tabindex].focus.label-warning, [tabindex].label-warning:focus-visible, .c-prefers-focus [tabindex].label-warning:focus {
   color: #d39e00;
 }
 .label-warning a:hover, .label-warning a.hover,
@@ -4687,9 +4714,10 @@ input[type=button].btn-block {
 .label-warning .close:hover {
   color: #d39e00;
 }
-.label-warning .close:focus {
+.label-warning .close.focus, .label-warning .close:focus-visible, .c-prefers-focus .label-warning .close:focus {
   color: #d39e00;
 }
+
 .label-danger {
   background-color: #fff;
   border-color: #dc3545;
@@ -4699,7 +4727,7 @@ input[type=button].btn-block {
   border-color: #bd2130;
   color: #bd2130;
 }
-[href].focus.label-danger, [href].label-danger:focus, [type].focus.label-danger, [type].label-danger:focus, [tabindex].focus.label-danger, [tabindex].label-danger:focus {
+[href].focus.label-danger, [href].label-danger:focus-visible, .c-prefers-focus [href].label-danger:focus, [type].focus.label-danger, [type].label-danger:focus-visible, .c-prefers-focus [type].label-danger:focus, [tabindex].focus.label-danger, [tabindex].label-danger:focus-visible, .c-prefers-focus [tabindex].label-danger:focus {
   color: #bd2130;
 }
 .label-danger a:hover, .label-danger a.hover,
@@ -4710,9 +4738,10 @@ input[type=button].btn-block {
 .label-danger .close:hover {
   color: #bd2130;
 }
-.label-danger .close:focus {
+.label-danger .close.focus, .label-danger .close:focus-visible, .c-prefers-focus .label-danger .close:focus {
   color: #bd2130;
 }
+
 .label-dark {
   background-color: #fff;
   border-color: #343a40;
@@ -4722,7 +4751,7 @@ input[type=button].btn-block {
   border-color: #1d2124;
   color: #1d2124;
 }
-[href].focus.label-dark, [href].label-dark:focus, [type].focus.label-dark, [type].label-dark:focus, [tabindex].focus.label-dark, [tabindex].label-dark:focus {
+[href].focus.label-dark, [href].label-dark:focus-visible, .c-prefers-focus [href].label-dark:focus, [type].focus.label-dark, [type].label-dark:focus-visible, .c-prefers-focus [type].label-dark:focus, [tabindex].focus.label-dark, [tabindex].label-dark:focus-visible, .c-prefers-focus [tabindex].label-dark:focus {
   color: #1d2124;
 }
 .label-dark a:hover, .label-dark a.hover,
@@ -4733,9 +4762,10 @@ input[type=button].btn-block {
 .label-dark .close:hover {
   color: #1d2124;
 }
-.label-dark .close:focus {
+.label-dark .close.focus, .label-dark .close:focus-visible, .c-prefers-focus .label-dark .close:focus {
   color: #1d2124;
 }
+
 .label-light {
   background-color: #343a40;
   border-color: #f8f9fa;
@@ -4745,7 +4775,7 @@ input[type=button].btn-block {
   border-color: #dae0e5;
   color: #dae0e5;
 }
-[href].focus.label-light, [href].label-light:focus, [type].focus.label-light, [type].label-light:focus, [tabindex].focus.label-light, [tabindex].label-light:focus {
+[href].focus.label-light, [href].label-light:focus-visible, .c-prefers-focus [href].label-light:focus, [type].focus.label-light, [type].label-light:focus-visible, .c-prefers-focus [type].label-light:focus, [tabindex].focus.label-light, [tabindex].label-light:focus-visible, .c-prefers-focus [tabindex].label-light:focus {
   color: #dae0e5;
 }
 .label-light a:hover, .label-light a.hover,
@@ -4756,9 +4786,10 @@ input[type=button].btn-block {
 .label-light .close:hover {
   color: #dae0e5;
 }
-.label-light .close:focus {
+.label-light .close.focus, .label-light .close:focus-visible, .c-prefers-focus .label-light .close:focus {
   color: #dae0e5;
 }
+
 .label-inverse-primary {
   background-color: #007bff;
   border-color: #007bff;
@@ -5990,7 +6021,7 @@ input[type=button].btn-block {
   background-color: #f8f9fa;
   text-decoration: none;
 }
-.card-interactive:focus, .card-interactive.focus {
+.card-interactive.focus, .card-interactive:focus-visible, .c-prefers-focus .card-interactive:focus {
   border-color: #80bdff;
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
@@ -6032,7 +6063,7 @@ input[type=button].btn-block {
   cursor: pointer;
 }
 
-.card-interactive-primary:focus, .card-interactive-primary.focus {
+.card-interactive-primary.focus, .card-interactive-primary:focus-visible, .c-prefers-focus .card-interactive-primary:focus {
   background-color: #f8f9fa;
 }
 .card-interactive-primary:active, .card-interactive-primary.active {
@@ -6263,7 +6294,7 @@ input[type=button].btn-block {
   color: #16181b;
   text-decoration: none;
 }
-.dropdown-item:focus, .dropdown-item.focus {
+.dropdown-item.focus, .dropdown-item:focus-visible, .c-prefers-focus .dropdown-item:focus {
   background-color: #f8f9fa;
   color: #16181b;
   text-decoration: none;
@@ -6492,7 +6523,7 @@ input[type=button].btn-block {
   background-image: none;
   color: #16181b;
 }
-.dropdown-menu-select.dropdown-menu .dropdown-item-scroll:focus, .dropdown-menu-select.dropdown-menu .dropdown-item-scroll.focus {
+.dropdown-menu-select.dropdown-menu .dropdown-item-scroll.focus, .dropdown-menu-select.dropdown-menu .dropdown-item-scroll:focus-visible, .c-prefers-focus .dropdown-menu-select.dropdown-menu .dropdown-item-scroll:focus {
   background-color: #f8f9fa;
   background-image: none;
   color: #16181b;
@@ -6741,7 +6772,7 @@ input[type=button].btn-block {
   color: inherit;
   text-decoration: inherit;
 }
-.dropdown-item-indicator-text-start.focus, .dropdown-item-indicator-text-start:focus {
+.dropdown-item-indicator-text-start.focus, .dropdown-item-indicator-text-start:focus-visible, .c-prefers-focus .dropdown-item-indicator-text-start:focus {
   color: inherit;
   text-decoration: inherit;
 }
@@ -6796,7 +6827,7 @@ input[type=button].btn-block {
   color: inherit;
   text-decoration: inherit;
 }
-.dropdown-item-indicator-text-end.focus, .dropdown-item-indicator-text-end:focus {
+.dropdown-item-indicator-text-end.focus, .dropdown-item-indicator-text-end:focus-visible, .c-prefers-focus .dropdown-item-indicator-text-end:focus {
   color: inherit;
   text-decoration: inherit;
 }
@@ -7272,7 +7303,7 @@ fieldset[disabled] label .form-control {
   color: #6c757d;
   opacity: 1;
 }
-.form-control:focus, .form-control.focus {
+.form-control.focus, .form-control:focus-visible, .c-prefers-focus .form-control:focus {
   background-color: #fff;
   border-color: #80bdff;
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
@@ -7438,7 +7469,7 @@ div.form-control-sm {
   padding: 0;
   width: 50px;
 }
-.form-control-inset:focus, .form-control-inset.focus {
+.form-control-inset.focus, .form-control-inset:focus-visible, .c-prefers-focus .form-control-inset:focus {
   outline: 0;
 }
 .form-control-inset:disabled, .form-control-inset.disabled {
@@ -7503,7 +7534,7 @@ select.form-control[size] {
   scrollbar-width: thin;
   color: #495057;
 }
-select.form-control[size]:focus, select.form-control[size].focus {
+select.form-control[size].focus, select.form-control[size]:focus-visible, .c-prefers-focus select.form-control[size]:focus {
   background-image: none;
 }
 select.form-control[size] option {
@@ -7518,7 +7549,7 @@ select.form-control[multiple] {
   scrollbar-width: thin;
   color: #495057;
 }
-select.form-control[multiple]:focus, select.form-control[multiple].focus {
+select.form-control[multiple].focus, select.form-control[multiple]:focus-visible, .c-prefers-focus select.form-control[multiple]:focus {
   background-image: none;
 }
 select.form-control[multiple] option {
@@ -7639,7 +7670,7 @@ textarea.form-control-plaintext,
   transition: none;
 }
 
-.form-control-plaintext[readonly]:focus, .form-control-plaintext[readonly].focus {
+.form-control-plaintext[readonly].focus, .form-control-plaintext[readonly]:focus-visible, .c-prefers-focus .form-control-plaintext[readonly]:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .form-control-lg {
@@ -7914,7 +7945,7 @@ textarea.form-control-lg,
 .c-link:hover, .c-link.hover {
   text-decoration: none;
 }
-.c-link.focus, .c-link:focus {
+.c-link.focus, .c-link:focus-visible, .c-prefers-focus .c-link:focus {
   border-radius: 1px;
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
@@ -7925,7 +7956,7 @@ textarea.form-control-lg,
 .c-link.text-secondary:hover, .c-link.text-secondary.hover {
   color: #000 !important;
 }
-.c-link.text-secondary.focus, .c-link.text-secondary:focus {
+.c-link.text-secondary.focus, .c-link.text-secondary:focus-visible, .c-prefers-focus .c-link.text-secondary:focus {
   color: #000 !important;
 }
 .c-link.text-tertiary {
@@ -7992,7 +8023,7 @@ button.link-outline {
 .link-outline:hover, .link-outline.hover {
   text-decoration: none;
 }
-.link-outline.focus, .link-outline:focus {
+.link-outline.focus, .link-outline:focus-visible, .c-prefers-focus .link-outline:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -8150,7 +8181,7 @@ button.link-outline {
   background-color: #6c757d;
   color: #fff;
 }
-.component-action.focus, .component-action:focus {
+.component-action.focus, .component-action:focus-visible, .c-prefers-focus .component-action:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -8408,10 +8439,10 @@ button.link-outline {
   visibility: visible;
   opacity: 1;
 }
-.clay-range-input .form-control-range:focus, .clay-range-input .form-control-range.focus {
+.clay-range-input .form-control-range.focus, .clay-range-input .form-control-range:focus-visible, .c-prefers-focus .clay-range-input .form-control-range:focus {
   outline: 0;
 }
-.clay-range-input .form-control-range:focus ~ .clay-range-progress .tooltip, .clay-range-input .form-control-range.focus ~ .clay-range-progress .tooltip {
+.clay-range-input .form-control-range.focus ~ .clay-range-progress .tooltip, .clay-range-input .form-control-range:focus-visible ~ .clay-range-progress .tooltip, .c-prefers-focus .clay-range-input .form-control-range:focus ~ .clay-range-progress .tooltip {
   visibility: visible;
   opacity: 1;
 }
@@ -8467,7 +8498,7 @@ button.link-outline {
   padding-top: 0.375rem;
   width: 100%;
 }
-.clay-reorder .form-control-inset:focus, .clay-reorder .form-control-inset.focus {
+.clay-reorder .form-control-inset.focus, .clay-reorder .form-control-inset:focus-visible, .c-prefers-focus .clay-reorder .form-control-inset:focus {
   background-color: transparent;
   box-shadow: none;
 }
@@ -8530,11 +8561,11 @@ button.link-outline {
   background-color: transparent;
   color: #000;
 }
-.clay-color-dropdown-menu .component-action:focus, .clay-color-dropdown-menu .component-action.focus {
+.clay-color-dropdown-menu .component-action.focus, .clay-color-dropdown-menu .component-action:focus-visible, .c-prefers-focus .clay-color-dropdown-menu .component-action:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   color: #000;
 }
-.clay-color-dropdown-menu .component-action:active:focus {
+.clay-color-dropdown-menu .component-action:active:focus-visible, .c-prefers-focus .clay-color-dropdown-menu .component-action:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .clay-color-dropdown-menu .form-control {
@@ -8606,11 +8637,11 @@ button.link-outline {
   transition: none;
 }
 
-.clay-color-pointer:focus, .clay-color-pointer.focus {
+.clay-color-pointer.focus, .clay-color-pointer:focus-visible, .c-prefers-focus .clay-color-pointer:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
-.clay-color-pointer:active:focus {
+.clay-color-pointer:active:focus-visible, .c-prefers-focus .clay-color-pointer:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .clay-color-pointer .c-inner {
@@ -8873,7 +8904,7 @@ label.custom-control-label {
   width: 1rem;
   z-index: 1;
 }
-.custom-control-input:focus ~ .custom-control-label::before {
+.custom-control-input:focus-visible ~ .custom-control-label::before, .c-prefers-focus .custom-control-input:focus ~ .custom-control-label::before {
   border-color: #80bdff;
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
@@ -9318,7 +9349,7 @@ label.custom-control-label {
 .clay-time .form-control-inset::-moz-selection, .clay-time .form-control-inset::selection {
   background-color: transparent;
 }
-.clay-time .form-control-inset:focus, .clay-time .form-control-inset.focus {
+.clay-time .form-control-inset.focus, .clay-time .form-control-inset:focus-visible, .c-prefers-focus .clay-time .form-control-inset:focus {
   background-color: #b3d8fd;
 }
 .clay-time .input-group-text {
@@ -9427,10 +9458,10 @@ label.custom-control-label {
 .date-picker-nav .nav-btn:hover {
   background-color: #e9ecef;
 }
-.date-picker-nav .nav-btn:focus, .date-picker-nav .nav-btn.focus {
+.date-picker-nav .nav-btn.focus, .date-picker-nav .nav-btn:focus-visible, .c-prefers-focus .date-picker-nav .nav-btn:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-.date-picker-nav .nav-btn:active:focus {
+.date-picker-nav .nav-btn:active:focus-visible, .c-prefers-focus .date-picker-nav .nav-btn:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .date-picker-nav .nav-btn:disabled, .date-picker-nav .nav-btn.disabled {
@@ -9581,7 +9612,7 @@ label.custom-control-label {
 .date-picker-date:hover {
   background-color: #e9ecef;
 }
-.date-picker-date:focus, .date-picker-date.focus {
+.date-picker-date.focus, .date-picker-date:focus-visible, .c-prefers-focus .date-picker-date:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -9589,7 +9620,7 @@ label.custom-control-label {
   background-color: #007bff;
   color: #fff;
 }
-.date-picker-date:active:focus {
+.date-picker-date:active:focus-visible, .c-prefers-focus .date-picker-date:active:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .date-picker-date.active {
@@ -9608,7 +9639,7 @@ label.custom-control-label {
 .previous-month-date {
   opacity: 0.65;
 }
-.previous-month-date:focus, .previous-month-date.focus {
+.previous-month-date.focus, .previous-month-date:focus-visible, .c-prefers-focus .previous-month-date:focus {
   opacity: 1;
 }
 .previous-month-date:active {
@@ -9626,7 +9657,7 @@ label.custom-control-label {
 .next-month-date {
   opacity: 0.65;
 }
-.next-month-date:focus, .next-month-date.focus {
+.next-month-date.focus, .next-month-date:focus-visible, .c-prefers-focus .next-month-date:focus {
   opacity: 1;
 }
 .next-month-date:active {
@@ -9895,7 +9926,7 @@ label.custom-control-label {
 .has-error .form-control {
   border-color: #dc3545;
 }
-.has-error .form-control:focus, .has-error .form-control.focus {
+.has-error .form-control.focus, .has-error .form-control:focus-visible, .c-prefers-focus .has-error .form-control:focus {
   box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
 }
 .has-error .form-feedback-item {
@@ -9939,7 +9970,7 @@ label.custom-control-label {
 .has-warning .form-control {
   border-color: #ffc107;
 }
-.has-warning .form-control:focus, .has-warning .form-control.focus {
+.has-warning .form-control.focus, .has-warning .form-control:focus-visible, .c-prefers-focus .has-warning .form-control:focus {
   box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
 }
 .has-warning .form-feedback-item {
@@ -9983,7 +10014,7 @@ label.custom-control-label {
 .has-success .form-control {
   border-color: #28a745;
 }
-.has-success .form-control:focus, .has-success .form-control.focus {
+.has-success .form-control.focus, .has-success .form-control:focus-visible, .c-prefers-focus .has-success .form-control:focus {
   box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
 }
 .has-success .form-feedback-item {
@@ -10456,13 +10487,14 @@ label.custom-control-label {
   order: 5;
   width: 1%;
 }
-.input-group-inset:focus, .input-group-inset.focus {
+.input-group-inset.focus, .input-group-inset:focus-visible, .c-prefers-focus .input-group-inset:focus {
   box-shadow: none;
 }
-.input-group-inset:focus ~ .input-group-inset-item, .input-group-inset.focus ~ .input-group-inset-item {
+.input-group-inset.focus ~ .input-group-inset-item, .input-group-inset:focus-visible ~ .input-group-inset-item, .c-prefers-focus .input-group-inset:focus ~ .input-group-inset-item {
   background-color: #fff;
   border-color: #80bdff;
 }
+
 .input-group-inset:disabled ~ .input-group-inset-item, .input-group-inset.disabled ~ .input-group-inset-item {
   background-color: #e9ecef;
 }
@@ -11592,6 +11624,9 @@ label.custom-control-label {
     margin-left: calc(-1140px / 2);
   }
 }
+.modal-height-full .modal-body {
+  overflow: auto;
+}
 .modal-height-full .modal-content {
   position: absolute;
   bottom: 0.5rem;
@@ -11984,7 +12019,7 @@ label.custom-control-label {
 .nav-link:hover, .nav-link.hover {
   text-decoration: none;
 }
-.nav-link.focus, .nav-link:focus {
+.nav-link.focus, .nav-link:focus-visible, .c-prefers-focus .nav-link:focus {
   text-decoration: none;
   z-index: 1;
 }
@@ -12023,7 +12058,7 @@ label.custom-control-label {
   text-align: center;
   width: auto;
 }
-.nav-btn:focus, .nav-btn.focus {
+.nav-btn.focus, .nav-btn:focus-visible, .c-prefers-focus .nav-btn:focus {
   z-index: 1;
 }
 .nav-btn:disabled, .nav-btn.disabled {
@@ -12284,7 +12319,7 @@ label.custom-control-label {
 .nav-tabs .nav-link:hover, .nav-tabs .nav-link.hover {
   border-color: #e9ecef #e9ecef #dee2e6;
 }
-.nav-tabs .nav-link.focus, .nav-tabs .nav-link:focus {
+.nav-tabs .nav-link.focus, .nav-tabs .nav-link:focus-visible, .c-prefers-focus .nav-tabs .nav-link:focus {
   border-color: #e9ecef #e9ecef #dee2e6;
 }
 .nav-tabs .nav-link:active {
@@ -16448,7 +16483,7 @@ label.custom-control-label {
   text-decoration: none;
   z-index: 2;
 }
-.page-link.focus, .page-link:focus {
+.page-link.focus, .page-link:focus-visible, .c-prefers-focus .page-link:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
   z-index: 4;
@@ -16555,9 +16590,10 @@ label.custom-control-label {
   border-color: #dee2e6;
   color: #0056b3;
 }
-.pagination-items-per-page > a.focus, .pagination-items-per-page > a:focus,
+.pagination-items-per-page > a.focus, .pagination-items-per-page > a:focus-visible, .c-prefers-focus .pagination-items-per-page > a:focus,
 .pagination-items-per-page > button.focus,
-.pagination-items-per-page > button:focus {
+.pagination-items-per-page > button:focus-visible,
+.c-prefers-focus .pagination-items-per-page > button:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -16784,7 +16820,7 @@ label.custom-control-label {
 .panel-header-link:hover, .panel-header-link.hover {
   color: inherit;
 }
-.panel-header-link.focus, .panel-header-link:focus {
+.panel-header-link.focus, .panel-header-link:focus-visible, .c-prefers-focus .panel-header-link:focus {
   z-index: 1;
 }
 .panel-header-link.panel-header.collapsed {
@@ -18086,7 +18122,7 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
 .sidebar-dark .nav-nested .nav-link:hover, .sidebar-dark .nav-nested .nav-link.hover {
   color: #fff;
 }
-.sidebar-dark .nav-nested .nav-link.focus, .sidebar-dark .nav-nested .nav-link:focus {
+.sidebar-dark .nav-nested .nav-link.focus, .sidebar-dark .nav-nested .nav-link:focus-visible, .c-prefers-focus .sidebar-dark .nav-nested .nav-link:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -18148,7 +18184,7 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
 .sidebar-dark-l2 .nav-nested .nav-link:hover, .sidebar-dark-l2 .nav-nested .nav-link.hover {
   color: #fff;
 }
-.sidebar-dark-l2 .nav-nested .nav-link.focus, .sidebar-dark-l2 .nav-nested .nav-link:focus {
+.sidebar-dark-l2 .nav-nested .nav-link.focus, .sidebar-dark-l2 .nav-nested .nav-link:focus-visible, .c-prefers-focus .sidebar-dark-l2 .nav-nested .nav-link:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -19584,9 +19620,10 @@ caption {
   margin-top: -0.625rem;
   width: 3rem;
 }
-.subnav-tbar-primary .component-label .close:focus {
+.subnav-tbar-primary .component-label .close.focus, .subnav-tbar-primary .component-label .close:focus-visible, .c-prefers-focus .subnav-tbar-primary .component-label .close:focus {
   color: inherit;
 }
+
 .subnav-tbar-primary .component-label .close:disabled, .subnav-tbar-primary .component-label .close.disabled {
   color: #6c757d;
   opacity: 0.65;
@@ -19680,10 +19717,10 @@ caption {
   position: relative;
   width: 2.5rem;
 }
-.tbar-stacked .tbar-btn-monospaced:focus, .tbar-stacked .tbar-btn-monospaced.focus {
+.tbar-stacked .tbar-btn-monospaced.focus, .tbar-stacked .tbar-btn-monospaced:focus-visible, .c-prefers-focus .tbar-stacked .tbar-btn-monospaced:focus {
   box-shadow: inset 0 0 0 0.125rem #47a0ff, inset 0 0 0 0.25rem #fff;
 }
-.tbar-stacked .tbar-btn-monospaced:active:focus {
+.tbar-stacked .tbar-btn-monospaced:active:focus-visible, .c-prefers-focus .tbar-stacked .tbar-btn-monospaced:active:focus {
   box-shadow: inset 0 0 0 0.125rem #47a0ff, inset 0 0 0 0.25rem #fff;
 }
 .tbar-stacked .tbar-btn-monospaced .c-inner {
@@ -19709,7 +19746,7 @@ caption {
 .tbar-light .tbar-btn-monospaced:hover {
   color: #343a40;
 }
-.tbar-light .tbar-btn-monospaced:focus, .tbar-light .tbar-btn-monospaced.focus {
+.tbar-light .tbar-btn-monospaced.focus, .tbar-light .tbar-btn-monospaced:focus-visible, .c-prefers-focus .tbar-light .tbar-btn-monospaced:focus {
   color: #343a40;
 }
 .tbar-light .tbar-btn-monospaced:active {
@@ -19745,7 +19782,7 @@ caption {
 .tbar-dark-l2 .tbar-btn-monospaced:hover {
   color: #fff;
 }
-.tbar-dark-l2 .tbar-btn-monospaced:focus, .tbar-dark-l2 .tbar-btn-monospaced.focus {
+.tbar-dark-l2 .tbar-btn-monospaced.focus, .tbar-dark-l2 .tbar-btn-monospaced:focus-visible, .c-prefers-focus .tbar-dark-l2 .tbar-btn-monospaced:focus {
   color: #fff;
 }
 .tbar-dark-l2 .tbar-btn-monospaced:active {
@@ -19780,7 +19817,7 @@ caption {
 .tbar-dark-d1 .tbar-btn-monospaced:hover {
   color: #fff;
 }
-.tbar-dark-d1 .tbar-btn-monospaced:focus, .tbar-dark-d1 .tbar-btn-monospaced.focus {
+.tbar-dark-d1 .tbar-btn-monospaced.focus, .tbar-dark-d1 .tbar-btn-monospaced:focus-visible, .c-prefers-focus .tbar-dark-d1 .tbar-btn-monospaced:focus {
   color: #fff;
 }
 .tbar-dark-d1 .tbar-btn-monospaced:active {
@@ -20229,7 +20266,7 @@ caption {
 .toggle-switch-check ~ .toggle-switch-bar .button-icon-on {
   opacity: 0;
 }
-.toggle-switch-check:focus ~ .toggle-switch-bar::before {
+.toggle-switch-check:focus-visible ~ .toggle-switch-bar::before, .c-prefers-focus .toggle-switch-check:focus ~ .toggle-switch-bar::before {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .toggle-switch-check[disabled] ~ .toggle-switch-bar, .toggle-switch-check:disabled ~ .toggle-switch-bar {
@@ -20676,10 +20713,10 @@ caption {
   padding: 0;
   width: 24px;
 }
-.treeview .btn-monospaced:focus, .treeview .btn-monospaced.focus {
+.treeview .btn-monospaced.focus, .treeview .btn-monospaced:focus-visible, .c-prefers-focus .treeview .btn-monospaced:focus {
   box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
-.treeview .btn-monospaced:active:focus {
+.treeview .btn-monospaced:active:focus-visible, .c-prefers-focus .treeview .btn-monospaced:active:focus {
   box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
 .treeview .custom-control {
@@ -20702,7 +20739,7 @@ caption {
   background-color: transparent;
   color: #6c757d;
 }
-.treeview .component-action:focus, .treeview .component-action.focus {
+.treeview .component-action.focus, .treeview .component-action:focus-visible, .c-prefers-focus .treeview .component-action:focus {
   color: #6c757d;
 }
 .treeview .component-action:active {
@@ -20833,7 +20870,7 @@ caption {
 .treeview-link:hover, .treeview-link.hover {
   text-decoration: none;
 }
-.treeview-link.focus, .treeview-link:focus {
+.treeview-link.focus, .treeview-link:focus-visible, .c-prefers-focus .treeview-link:focus {
   box-shadow: inset 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
 }
@@ -20992,11 +21029,12 @@ caption {
   opacity: 0.75;
   text-decoration: none;
 }
-.close:focus {
+.close.focus, .close:focus-visible, .c-prefers-focus .close:focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
   opacity: 0.75;
 }
+
 .close:disabled, .close.disabled {
   box-shadow: none;
   cursor: not-allowed;