@clayui/css 3.91.0 → 3.93.0

package/lib/css/base.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 /**
- * Clay 3.91.0
+ * Clay 3.93.0
  *
  * SPDX-FileCopyrightText: © 2020 Liferay, Inc. <https://liferay.com>
  * SPDX-FileCopyrightText: © 2020 Contributors to the project Clay <https://github.com/liferay/clay/graphs/contributors>
@@ -648,6 +648,9 @@ pre code {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .carousel-item {
+  transition: none;
+}
 
 .carousel-item.active,
 .carousel-item-next,
@@ -688,6 +691,10 @@ pre code {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .carousel-fade .active.carousel-item-left,
+.c-prefers-reduced-motion .carousel-fade .active.carousel-item-right {
+  transition: none;
+}
 
 .carousel-control-prev,
 .carousel-control-next {
@@ -710,6 +717,11 @@ pre code {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .carousel-control-prev,
+.c-prefers-reduced-motion .carousel-control-next {
+  transition: none;
+}
+
 .carousel-control-prev:hover, .carousel-control-prev:focus,
 .carousel-control-next:hover,
 .carousel-control-next:focus {
@@ -777,6 +789,10 @@ pre code {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .carousel-indicators li {
+  transition: none;
+}
+
 .carousel-indicators .active {
   opacity: 1;
 }
@@ -827,6 +843,14 @@ pre code {
   vertical-align: text-bottom;
   width: 2rem;
 }
+@media (prefers-reduced-motion: reduce) {
+  .spinner-border {
+    animation: none;
+  }
+}
+.c-prefers-reduced-motion .spinner-border {
+  animation: none;
+}
 
 .spinner-border-sm {
   border-width: 0.2em;
@@ -852,6 +876,14 @@ pre code {
   vertical-align: text-bottom;
   width: 2rem;
 }
+@media (prefers-reduced-motion: reduce) {
+  .spinner-grow {
+    animation: none;
+  }
+}
+.c-prefers-reduced-motion .spinner-grow {
+  animation: none;
+}
 
 .spinner-grow-sm {
   height: 1rem;
@@ -1155,6 +1187,10 @@ button.collapse-icon .c-inner {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .btn {
+  transition: none;
+}
+
 .btn:hover {
   color: #212529;
   text-decoration: none;
@@ -1221,7 +1257,7 @@ fieldset:disabled a.btn:active {
 }
 .btn-xs .inline-item {
   font-size: inherit;
-  margin-top: -3px;
+  margin-top: -0.16em;
 }
 .btn-xs .inline-item-before {
   margin-right: 0.25rem;
@@ -1691,6 +1727,19 @@ input[type=button].btn-block {
   color: #6c757d;
   text-decoration: none;
 }
+.btn-beta {
+  background-color: white;
+  color: #138496;
+  text-transform: uppercase;
+}
+.btn-beta:hover {
+  background-color: #f8f9fa;
+  color: #138496;
+}
+.btn-beta:focus, .focus.btn-beta {
+  background-color: #f8f9fa;
+  color: #138496;
+}
 .btn-outline-primary {
   border-color: #007bff;
   color: #007bff;
@@ -2004,10 +2053,10 @@ input[type=button].btn-block {
   z-index: 10;
 }
 .c-horizontal-resizer:hover {
-  background-color: #75b8ff;
+  background-color: #47a0ff;
 }
 .c-horizontal-resizer:focus {
-  background-color: #75b8ff;
+  background-color: #47a0ff;
 }
 
 .fade {
@@ -2018,6 +2067,10 @@ input[type=button].btn-block {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .fade {
+  transition: none;
+}
+
 .fade:not(.show) {
   opacity: 0;
 }
@@ -2037,6 +2090,9 @@ input[type=button].btn-block {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .collapsing {
+  transition: none;
+}
 
 .container {
   margin-left: auto;
@@ -3901,6 +3957,10 @@ input[type=button].btn-block {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .badge {
+  transition: none;
+}
+
 .badge:empty {
   display: none;
 }
@@ -4129,6 +4189,11 @@ input[type=button].btn-block {
   color: #fff;
   box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
 }
+.badge-beta {
+  background-color: white;
+  color: #138496;
+  text-transform: uppercase;
+}
 .breadcrumb {
   background-color: #e9ecef;
   border-radius: 0.25rem;
@@ -5974,6 +6039,10 @@ input[type=button].btn-block {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .card-interactive {
+  transition: none;
+}
+
 .card-interactive:hover, .card-interactive.hover {
   background-color: #f8f9fa;
   text-decoration: none;
@@ -6000,6 +6069,10 @@ input[type=button].btn-block {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .card-interactive::after {
+  transition: none;
+}
+
 .card-interactive:hover::after, .card-interactive.hover::after {
   height: 4px;
 }
@@ -6917,6 +6990,9 @@ input[type=button].btn-block {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .drilldown-inner {
+  transition: none;
+}
 
 .drilldown-item {
   display: none;
@@ -6933,6 +7009,14 @@ input[type=button].btn-block {
 .drilldown-transition {
   transition: all 0.25s ease;
 }
+@media (prefers-reduced-motion: reduce) {
+  .drilldown-transition {
+    transition: none;
+  }
+}
+.c-prefers-reduced-motion .drilldown-transition {
+  transition: none;
+}
 
 .drilldown-item.transitioning {
   display: block;
@@ -7161,6 +7245,10 @@ fieldset[disabled] label .form-control {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .form-control {
+  transition: none;
+}
+
 .form-control::placeholder {
   color: #6c757d;
   opacity: 1;
@@ -7446,6 +7534,14 @@ textarea.form-control-plaintext,
   border-radius: 100px;
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }
+@media (prefers-reduced-motion: reduce) {
+  .form-control[type=range]::-webkit-slider-thumb {
+    transition: none;
+  }
+}
+.c-prefers-reduced-motion .form-control[type=range]::-webkit-slider-thumb {
+  transition: none;
+}
 
 .form-control-range {
   display: block;
@@ -7519,6 +7615,10 @@ textarea.form-control-plaintext,
     transition: none;
   }
 }
+.c-prefers-reduced-motion .form-control-plaintext[readonly] {
+  transition: none;
+}
+
 .form-control-plaintext[readonly]:focus, .form-control-plaintext[readonly].focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
 }
@@ -7787,6 +7887,10 @@ textarea.form-control-lg,
     transition: none;
   }
 }
+.c-prefers-reduced-motion .c-link {
+  transition: none;
+}
+
 .c-link:hover, .c-link.hover {
   text-decoration: none;
 }
@@ -7861,6 +7965,10 @@ button.link-outline {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .link-outline {
+  transition: none;
+}
+
 .link-outline:hover, .link-outline.hover {
   text-decoration: none;
 }
@@ -8014,6 +8122,10 @@ button.link-outline {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .component-action {
+  transition: none;
+}
+
 .component-action:hover, .component-action.hover {
   background-color: #6c757d;
   color: #fff;
@@ -8116,6 +8228,10 @@ button.link-outline {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .clay-range-input .tooltip {
+  transition: none;
+}
+
 .clay-range-input .tooltip-inner {
   padding: 0.25rem 0.5rem;
 }
@@ -8466,6 +8582,10 @@ button.link-outline {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .clay-color-pointer {
+  transition: none;
+}
+
 .clay-color-pointer:focus, .clay-color-pointer.focus {
   box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
   outline: 0;
@@ -8662,6 +8782,10 @@ button.link-outline {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-control-label::before {
+  transition: none;
+}
+
 .custom-control-label::after {
   background: no-repeat 50%/50% 50%;
   content: "";
@@ -8704,6 +8828,9 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-control-label::before {
+  transition: none;
+}
 
 .custom-control-label::after {
   background: no-repeat 50%/50% 50%;
@@ -8844,6 +8971,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-switch .custom-control-label::after {
+  transition: none;
+}
+
 .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
   background-color: #fff;
   transform: translateX(0.75rem);
@@ -9010,6 +9141,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-range::-webkit-slider-thumb {
+  transition: none;
+}
+
 .custom-range::-webkit-slider-thumb:active {
   background-color: #b3d7ff;
 }
@@ -9037,6 +9172,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-range::-moz-range-thumb {
+  transition: none;
+}
+
 .custom-range::-moz-range-thumb:active {
   background-color: #b3d7ff;
 }
@@ -9066,6 +9205,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-range::-ms-thumb {
+  transition: none;
+}
+
 .custom-range::-ms-thumb:active {
   background-color: #b3d7ff;
 }
@@ -9113,6 +9256,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .custom-file-label,
+.c-prefers-reduced-motion .custom-select {
+  transition: none;
+}
 
 .clay-time .btn {
   align-items: center;
@@ -9253,6 +9400,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .date-picker-nav .nav-btn {
+  transition: none;
+}
+
 .date-picker-nav .nav-btn:hover {
   background-color: #e9ecef;
 }
@@ -9346,6 +9497,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .date-picker-calendar-item {
+  transition: none;
+}
+
 .date-picker-calendar-item:disabled, .date-picker-calendar-item.disabled {
   cursor: not-allowed;
 }
@@ -10290,6 +10445,15 @@ label.custom-control-label {
   padding-right: 5px;
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }
+@media (prefers-reduced-motion: reduce) {
+  .input-group .input-group-inset-item {
+    transition: none;
+  }
+}
+.c-prefers-reduced-motion .input-group .input-group-inset-item {
+  transition: none;
+}
+
 .input-group .input-group-inset-item .btn {
   align-items: center;
   display: flex;
@@ -11029,6 +11193,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .modal.fade .modal-dialog {
+  transition: none;
+}
+
 .modal.show .modal-dialog {
   transform: none;
 }
@@ -11515,6 +11683,18 @@ label.custom-control-label {
 .multi-step-item.complete .multi-step-divider {
   background-color: #6c757d;
 }
+.multi-step-item.error .multi-step-icon {
+  background-color: #dc3545;
+  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'%3E%3Cpath%20class='lexicon-icon-outline'%20d='M300.4%20256%20467%2089.4c29.6-29.6-14.8-74.1-44.4-44.4L256%20211.6%2089.4%2045C59.8%2015.3%2015.3%2059.8%2045%2089.4L211.6%20256%2045%20422.6c-29.7%2029.7%2014.7%2074.1%2044.4%2044.4L256%20300.4%20422.6%20467c29.7%2029.7%2074.1-14.7%2044.4-44.4L300.4%20256z'%20fill='%23fff'/%3E%3C/svg%3E");
+  color: #fff;
+  text-indent: -100px;
+}
+.multi-step-item.error .multi-step-icon[data-multi-step-icon]::before {
+  content: none;
+}
+.multi-step-item.error .multi-step-icon .lexicon-icon {
+  display: none;
+}
 .multi-step-item.disabled .multi-step-title {
   color: #ced4da;
 }
@@ -11584,6 +11764,9 @@ label.custom-control-label {
 .multi-step-icon {
   align-items: center;
   background-color: #e9ecef;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: 1rem;
   border-radius: 0.25rem;
   border-width: 0px;
   color: rgba(0, 0, 0, 0.5);
@@ -11599,6 +11782,15 @@ label.custom-control-label {
   transition: box-shadow 0.15s ease-in-out;
   width: 2rem;
 }
+@media (prefers-reduced-motion: reduce) {
+  .multi-step-icon {
+    transition: none;
+  }
+}
+.c-prefers-reduced-motion .multi-step-icon {
+  transition: none;
+}
+
 .multi-step-icon:hover {
   background-color: #e9ecef;
   color: rgba(0, 0, 0, 0.7);
@@ -11882,7 +12074,6 @@ label.custom-control-label {
   padding-right: 0.5rem;
   padding-top: 0.5rem;
 }
-
 .nav-unstyled {
   flex-wrap: nowrap;
 }
@@ -12093,6 +12284,14 @@ label.custom-control-label {
   color: #fff;
 }
 
+.nav-tabs-light {
+  background-color: #f8f9fa;
+}
+.nav-tabs-light + .tab-content .tab-pane {
+  background-color: transparent;
+  border-radius: 0;
+}
+
 .menubar {
   position: relative;
 }
@@ -16510,6 +16709,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .panel-header-link {
+  transition: none;
+}
+
 .panel-header-link:hover, .panel-header-link.hover {
   color: inherit;
 }
@@ -16525,6 +16728,10 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .panel-header-link.panel-header.collapsed {
+  transition: none;
+}
+
 .panel-header-link .collapse-icon {
   padding-right: 2.28125rem;
 }
@@ -17120,6 +17327,9 @@ label.custom-control-label {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .progress-bar {
+  transition: none;
+}
 
 .progress-bar-striped {
   background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
@@ -17142,6 +17352,9 @@ label.custom-control-label {
     animation: none;
   }
 }
+.c-prefers-reduced-motion .progress-bar-animated {
+  animation: none;
+}
 
 .progress-lg,
 .progress-lg > .progress {
@@ -17277,6 +17490,10 @@ label.custom-control-label {
   margin-bottom: 3rem;
 }
 
+.sheet-row {
+  margin-left: -1.5rem;
+  margin-right: -1.5rem;
+}
 .sheet-header {
   margin-bottom: 3rem;
 }
@@ -17526,10 +17743,30 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
 .sidenav-transition .sidenav-menu-slider {
   transition: all 0.5s ease;
 }
+@media (prefers-reduced-motion: reduce) {
+  .sidenav-transition .sidenav-content,
+.sidenav-transition .sidenav-menu,
+.sidenav-transition .sidenav-menu-slider {
+    transition: none;
+  }
+}
+.c-prefers-reduced-motion .sidenav-transition .sidenav-content,
+.c-prefers-reduced-motion .sidenav-transition .sidenav-menu,
+.c-prefers-reduced-motion .sidenav-transition .sidenav-menu-slider {
+  transition: none;
+}
 
 .sidenav-transition {
   transition: all 0.5s ease;
 }
+@media (prefers-reduced-motion: reduce) {
+  .sidenav-transition {
+    transition: none;
+  }
+}
+.c-prefers-reduced-motion .sidenav-transition {
+  transition: none;
+}
 
 .sidenav-fixed.sidenav-menu-slider {
   bottom: 0;
@@ -17774,6 +18011,10 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .sidebar-dark .nav-nested .nav-link {
+  transition: none;
+}
+
 .sidebar-dark .nav-nested .nav-link:hover, .sidebar-dark .nav-nested .nav-link.hover {
   color: #fff;
 }
@@ -17832,6 +18073,10 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .sidebar-dark-l2 .nav-nested .nav-link {
+  transition: none;
+}
+
 .sidebar-dark-l2 .nav-nested .nav-link:hover, .sidebar-dark-l2 .nav-nested .nav-link.hover {
   color: #fff;
 }
@@ -17864,6 +18109,9 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .c-slideout-transition-in {
+  transition: none;
+}
 
 .c-slideout-transition-out {
   transition: all 0.2s ease-in;
@@ -17873,6 +18121,9 @@ a.sheet-subtitle:hover, a.sheet-subtitle.hover {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .c-slideout-transition-out {
+  transition: none;
+}
 
 .c-slideout-fixed {
   position: fixed;
@@ -19362,10 +19613,10 @@ caption {
   width: 2.5rem;
 }
 .tbar-stacked .tbar-btn-monospaced:focus, .tbar-stacked .tbar-btn-monospaced.focus {
-  box-shadow: inset 0 0 0 0.125rem #75b8ff, inset 0 0 0 0.25rem #fff;
+  box-shadow: inset 0 0 0 0.125rem #47a0ff, inset 0 0 0 0.25rem #fff;
 }
 .tbar-stacked .tbar-btn-monospaced:active:focus {
-  box-shadow: inset 0 0 0 0.125rem #75b8ff, inset 0 0 0 0.25rem #fff;
+  box-shadow: inset 0 0 0 0.125rem #47a0ff, inset 0 0 0 0.25rem #fff;
 }
 .tbar-stacked .tbar-btn-monospaced .c-inner {
   margin-bottom: 0;
@@ -19820,6 +20071,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .toggle-switch-check ~ .toggle-switch-bar::before {
+  transition: none;
+}
+
 .toggle-switch-check ~ .toggle-switch-bar::after {
   background-color: #fff;
   border-color: #ced4da;
@@ -19841,6 +20096,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .toggle-switch-check ~ .toggle-switch-bar::after {
+  transition: none;
+}
+
 .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-handle::before {
   transition: background-color 100ms ease-in, border-color 100ms ease-in, box-shadow 150ms ease-in-out, color 100ms ease-in, left 100ms ease-in, right 100ms ease-in;
 }
@@ -19849,6 +20108,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-handle::before {
+  transition: none;
+}
+
 .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-handle::after {
   content: '\FEFF' attr(data-label-off);
   margin-left: 58px;
@@ -19860,6 +20123,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-handle::after {
+  transition: none;
+}
+
 .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-icon {
   color: #495057;
   left: 0;
@@ -19877,6 +20144,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-icon {
+  transition: none;
+}
+
 .toggle-switch-check ~ .toggle-switch-bar .toggle-switch-icon-on {
   left: 0;
   opacity: 0;
@@ -20403,6 +20674,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .treeview.show-component-expander-on-hover:hover .component-expander, .c-prefers-reduced-motion .treeview.show-component-expander-on-hover.hover .component-expander {
+  transition: none;
+}
+
 .treeview.show-component-expander-on-hover .treeview-link:focus .component-expander, .treeview.show-component-expander-on-hover .treeview-link.focus .component-expander {
   opacity: 1;
   transition: none;
@@ -20416,6 +20691,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .treeview.show-component-expander-on-hover .component-expander {
+  transition: none;
+}
+
 .treeview .quick-action-item {
   margin: 0 2px;
   min-height: 0;
@@ -20446,6 +20725,25 @@ caption {
   overflow-wrap: break-word;
   word-wrap: break-word;
 }
+.treeview-dropping-indicator-top {
+  background-color: transparent;
+  display: block;
+  height: 2px;
+  margin-top: -2px;
+  outline: none;
+  width: 100%;
+}
+.treeview-dropping-indicator-bottom {
+  background-color: transparent;
+  display: block;
+  height: 2px;
+  margin-bottom: -2px;
+  outline: none;
+  width: 100%;
+}
+.treeview-dropping-indicator-over {
+  background-color: #47a0ff;
+}
 .treeview-link {
   background-color: transparent;
   cursor: pointer;
@@ -20474,15 +20772,9 @@ caption {
 .treeview-link:disabled, .treeview-link.disabled {
   cursor: not-allowed;
 }
-.treeview-link.treeview-dropping-bottom {
-  box-shadow: 0 2px 0 0 #75b8ff;
-}
 .treeview-link.treeview-dropping-middle {
   background-color: #e5f2ff;
-  border-color: #75b8ff;
-}
-.treeview-link.treeview-dropping-top {
-  box-shadow: 0 -2px 0 0 #75b8ff;
+  border-color: #47a0ff;
 }
 .treeview-link.show .component-expander .component-expanded-d-none, .treeview-link[aria-expanded=true] .component-expander .component-expanded-d-none {
   display: none;
@@ -20505,7 +20797,7 @@ caption {
 }
 .treeview-dragging {
   background-color: #fff;
-  border-color: #75b8ff;
+  border-color: #47a0ff;
   border-radius: 0.2rem;
   border-style: solid;
   border-width: 1px;
@@ -20623,6 +20915,10 @@ caption {
     transition: none;
   }
 }
+.c-prefers-reduced-motion .close {
+  transition: none;
+}
+
 .close:hover {
   color: #000;
   opacity: 0.75;
@@ -29542,6 +29838,11 @@ a.text-dark:hover, a.text-dark:focus {
   visibility: hidden !important;
 }
 
+.c-prefers-reduced-motion {
+  scroll-behavior: auto;
+  transition: none;
+}
+
 @keyframes loading-animation-circle {
   100% {
     transform: rotate(360deg);
@@ -29571,6 +29872,10 @@ a.text-dark:hover, a.text-dark:focus {
   top: 50%;
   width: 0.25em;
 }
+.c-prefers-reduced-motion .loading-animation::before {
+  animation: none;
+}
+
 .loading-animation::after {
   animation: loading-animation-circle 1s linear infinite;
   background-color: currentColor;
@@ -29584,6 +29889,9 @@ a.text-dark:hover, a.text-dark:focus {
   padding: 0.25em;
   width: 1em;
 }
+.c-prefers-reduced-motion .loading-animation::after {
+  animation: none;
+}
 
 @keyframes loading-animation-squares-box-1 {
   0% {
@@ -29662,6 +29970,10 @@ a.text-dark:hover, a.text-dark:focus {
   transform: scale(1);
   width: 1em;
 }
+.c-prefers-reduced-motion .loading-animation-squares::before {
+  animation: none;
+}
+
 .loading-animation-squares::after {
   animation: loading-animation-squares-box-2 2.4s ease-in-out infinite;
   background-color: currentColor;
@@ -29677,6 +29989,9 @@ a.text-dark:hover, a.text-dark:focus {
   transform: scale(2);
   width: 1em;
 }
+.c-prefers-reduced-motion .loading-animation-squares::after {
+  animation: none;
+}
 
 .loading-animation-xs {
   font-size: 0.625rem;