@transferwise/components 0.0.0-experimental-c1f5b0b → 0.0.0-experimental-fe160ab

package/build/styles/css/panels.css

@@ -1,9 +1,9 @@
 .panel {
-  margin-block-end: 16px;
+  margin-bottom: 16px;
   background-color: transparent;
   border: 0;
-  margin-inline-start: -16px;
-  margin-inline-end: -16px;
+  margin-left: -16px;
+  margin-right: -16px;
 }
 .panel-body {
   padding: 16px;
@@ -11,15 +11,14 @@
   background-color: var(--color-background-screen);
 }
 .panel-heading {
-  padding-block: 16px 8px;
-  padding-inline: 16px 16px;
+  padding: 16px 16px 8px 16px;
 }
 .panel-heading > .dropdown .dropdown-toggle {
   color: inherit;
 }
 .panel-title {
-  margin-block-start: 0;
-  margin-block-end: 0;
+  margin-top: 0;
+  margin-bottom: 0;
   line-height: calc(1.2 + 8px);
   line-height: calc(var(--line-height-title) + 8px);
 }
@@ -32,13 +31,12 @@
 }
 @media (min-width: 600px) {
   .panel {
-    margin-block-end: 24px;
-    margin-inline-start: -24px;
-    margin-inline-end: -24px;
+    margin-bottom: 24px;
+    margin-left: -24px;
+    margin-right: -24px;
   }
   .panel-heading {
-    padding-block: 16px 8px;
-    padding-inline: 24px 24px;
+    padding: 16px 24px 8px 24px;
   }
   .panel-body {
     padding: 24px;
@@ -49,17 +47,16 @@
 }
 @media (min-width: 840px) {
   .panel {
-    margin-inline-start: 0;
-    margin-inline-end: 0;
+    margin-left: 0;
+    margin-right: 0;
   }
   .panel-heading {
-    padding-block: 16px 8px;
-    padding-inline: 0 0;
+    padding: 16px 0 8px 0;
   }
 }
 @media (min-width: 1160px) {
   .panel {
-    margin-block-end: 32px;
+    margin-bottom: 32px;
     border-radius: 3px;
   }
   .panel-body {
@@ -75,147 +72,215 @@
     line-height: calc(var(--line-height-title) * 2);
   }
   .panel-heading > .btn-sm {
-    margin-block-start: 8px;
+    margin-top: 8px;
   }
 }
 .panel > .list-group,
 .panel > .panel-collapse > .list-group {
-  margin-block-end: 0;
-  border-inline-start: 0;
-  border-inline-end: 0;
+  margin-bottom: 0;
+  border-left: 0;
+  border-right: 0;
 }
 .panel > .list-group .list-group-item,
 .panel > .panel-collapse > .list-group .list-group-item {
   border-radius: 0;
 }
 .panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
-  border-start-end-radius: 0;
-  border-start-start-radius: 0;
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
 }
 .panel-list-group {
-  margin-block-end: 0;
-  border-inline-start: 0;
-  border-inline-end: 0;
+  margin-bottom: 0;
+  border-left: 0;
+  border-right: 0;
 }
 .list-group + .panel-footer {
-  border-block-start-width: 0;
+  border-top-width: 0;
 }
 .panel > .table,
 .panel > .table-responsive > .table,
 .panel > .panel-collapse > .table {
-  margin-block-end: 0;
+  margin-bottom: 0;
 }
 .panel > .table caption,
 .panel > .table-responsive > .table caption,
 .panel > .panel-collapse > .table caption {
-  padding-inline-start: 32px;
-  padding-inline-end: 32px;
+  padding-left: 32px;
+  padding-right: 32px;
 }
 .panel > .table:first-child,
 .panel > .table-responsive:first-child > .table:first-child {
-  border-start-end-radius: 2px;
-  border-start-start-radius: 2px;
+  border-top-right-radius: 2px;
+  border-top-left-radius: 2px;
 }
 .panel > .table:first-child > thead:first-child > tr:first-child,
 .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
 .panel > .table:first-child > tbody:first-child > tr:first-child,
 .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
-  border-start-start-radius: 2px;
-  border-start-end-radius: 2px;
-}
-.panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
-.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
-.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
-.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
-.panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
-.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
-.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
-.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
-  border-start-start-radius: 2px;
-}
-.panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
-.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
-.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
-.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
-.panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
-.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
-.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
-.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
-  border-start-end-radius: 2px;
+  border-top-left-radius: 2px;
+  border-top-right-radius: 2px;
+}
+[dir="rtl"] .panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
+[dir="rtl"] .panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
+[dir="rtl"] .panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
+[dir="rtl"] .panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
+  border-top-right-radius: 2px;
+}
+html:not([dir="rtl"]) .panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
+html:not([dir="rtl"]) .panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
+html:not([dir="rtl"]) .panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
+html:not([dir="rtl"]) .panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
+  border-top-left-radius: 2px;
+}
+[dir="rtl"] .panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
+[dir="rtl"] .panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
+[dir="rtl"] .panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
+[dir="rtl"] .panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
+[dir="rtl"] .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
+  border-top-left-radius: 2px;
+}
+html:not([dir="rtl"]) .panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
+html:not([dir="rtl"]) .panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
+html:not([dir="rtl"]) .panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
+html:not([dir="rtl"]) .panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
+  border-top-right-radius: 2px;
 }
 .panel > .table:last-child,
 .panel > .table-responsive:last-child > .table:last-child {
-  border-end-end-radius: 2px;
-  border-end-start-radius: 2px;
+  border-bottom-right-radius: 2px;
+  border-bottom-left-radius: 2px;
 }
 .panel > .table:last-child > tbody:last-child > tr:last-child,
 .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
 .panel > .table:last-child > tfoot:last-child > tr:last-child,
 .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
-  border-end-start-radius: 2px;
-  border-end-end-radius: 2px;
-}
-.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
-.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
-.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
-.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
-.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
-.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
-.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
-.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
-  border-end-start-radius: 2px;
-}
-.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
-.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
-.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
-.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
-.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
-.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
-.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
-.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
-  border-end-end-radius: 2px;
+  border-bottom-left-radius: 2px;
+  border-bottom-right-radius: 2px;
+}
+[dir="rtl"] .panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
+[dir="rtl"] .panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
+[dir="rtl"] .panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
+[dir="rtl"] .panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
+  border-bottom-right-radius: 2px;
+}
+html:not([dir="rtl"]) .panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
+html:not([dir="rtl"]) .panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
+html:not([dir="rtl"]) .panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
+html:not([dir="rtl"]) .panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
+  border-bottom-left-radius: 2px;
+}
+[dir="rtl"] .panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
+[dir="rtl"] .panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
+[dir="rtl"] .panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
+[dir="rtl"] .panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
+[dir="rtl"] .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
+  border-bottom-left-radius: 2px;
+}
+html:not([dir="rtl"]) .panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
+html:not([dir="rtl"]) .panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
+html:not([dir="rtl"]) .panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
+html:not([dir="rtl"]) .panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
+  border-bottom-right-radius: 2px;
 }
 .panel > .panel-body + .table,
 .panel > .panel-body + .table-responsive,
 .panel > .table + .panel-body,
 .panel > .table-responsive + .panel-body {
-  border-block-start: 1px solid #f2f5f7;
+  border-top: 1px solid #f2f5f7;
 }
 .panel > .table > tbody:first-child > tr:first-child th,
 .panel > .table > tbody:first-child > tr:first-child td {
-  border-block-start: 0;
+  border-top: 0;
 }
 .panel > .table-bordered,
 .panel > .table-responsive > .table-bordered {
   border: 0;
 }
-.panel > .table-bordered > thead > tr > th:first-child,
-.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
-.panel > .table-bordered > tbody > tr > th:first-child,
-.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
-.panel > .table-bordered > tfoot > tr > th:first-child,
-.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
-.panel > .table-bordered > thead > tr > td:first-child,
-.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
-.panel > .table-bordered > tbody > tr > td:first-child,
-.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
-.panel > .table-bordered > tfoot > tr > td:first-child,
-.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
-  border-inline-start: 0  ;
-}
-.panel > .table-bordered > thead > tr > th:last-child,
-.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
-.panel > .table-bordered > tbody > tr > th:last-child,
-.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
-.panel > .table-bordered > tfoot > tr > th:last-child,
-.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
-.panel > .table-bordered > thead > tr > td:last-child,
-.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
-.panel > .table-bordered > tbody > tr > td:last-child,
-.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
-.panel > .table-bordered > tfoot > tr > td:last-child,
-.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
-  border-inline-end: 0  ;
+[dir="rtl"] .panel > .table-bordered > thead > tr > th:first-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
+[dir="rtl"] .panel > .table-bordered > tbody > tr > th:first-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
+[dir="rtl"] .panel > .table-bordered > tfoot > tr > th:first-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+[dir="rtl"] .panel > .table-bordered > thead > tr > td:first-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
+[dir="rtl"] .panel > .table-bordered > tbody > tr > td:first-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
+[dir="rtl"] .panel > .table-bordered > tfoot > tr > td:first-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+  border-right: 0  ;
+}
+html:not([dir="rtl"]) .panel > .table-bordered > thead > tr > th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tbody > tr > th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tfoot > tr > th:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
+html:not([dir="rtl"]) .panel > .table-bordered > thead > tr > td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tbody > tr > td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tfoot > tr > td:first-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
+  border-left: 0  ;
+}
+[dir="rtl"] .panel > .table-bordered > thead > tr > th:last-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
+[dir="rtl"] .panel > .table-bordered > tbody > tr > th:last-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
+[dir="rtl"] .panel > .table-bordered > tfoot > tr > th:last-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+[dir="rtl"] .panel > .table-bordered > thead > tr > td:last-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
+[dir="rtl"] .panel > .table-bordered > tbody > tr > td:last-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
+[dir="rtl"] .panel > .table-bordered > tfoot > tr > td:last-child,
+[dir="rtl"] .panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+  border-left: 0  ;
+}
+html:not([dir="rtl"]) .panel > .table-bordered > thead > tr > th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tbody > tr > th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tfoot > tr > th:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
+html:not([dir="rtl"]) .panel > .table-bordered > thead > tr > td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tbody > tr > td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
+html:not([dir="rtl"]) .panel > .table-bordered > tfoot > tr > td:last-child,
+html:not([dir="rtl"]) .panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
+  border-right: 0  ;
 }
 .panel > .table-bordered > thead > tr:first-child > td,
 .panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
@@ -225,7 +290,7 @@
 .panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
 .panel > .table-bordered > tbody > tr:first-child > th,
 .panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
-  border-block-end: 0;
+  border-bottom: 0;
 }
 .panel > .table-bordered > tbody > tr:last-child > td,
 .panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
@@ -235,63 +300,99 @@
 .panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
 .panel > .table-bordered > tfoot > tr:last-child > th,
 .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
-  border-block-end: 0;
+  border-bottom: 0;
 }
 .panel > .table-responsive {
   border: 0;
-  margin-block-end: 0;
+  margin-bottom: 0;
 }
 .panel > .table tr > :first-child,
 .panel > .table-responsive tr > :first-child {
-  padding-inline-start: 16px;
+  padding-left: 16px;
+}
+[dir="rtl"] .panel > .table tr > :first-child,
+[dir="rtl"] .panel > .table-responsive tr > :first-child {
+  padding-right: 16px;
+  padding-left: 0;
+  padding-left: initial;
 }
 .panel > .table tr > :last-child,
 .panel > .table-responsive tr > :last-child {
-  padding-inline-end: 16px;
+  padding-right: 16px;
+}
+[dir="rtl"] .panel > .table tr > :last-child,
+[dir="rtl"] .panel > .table-responsive tr > :last-child {
+  padding-left: 16px;
+  padding-right: 0;
+  padding-right: initial;
 }
 @media (min-width: 840px) {
   .panel > .table tr > :first-child,
   .panel > .table-responsive tr > :first-child {
-    padding-inline-start: 24px;
+    padding-left: 24px;
+  }
+  [dir="rtl"] .panel > .table tr > :first-child,
+  [dir="rtl"] .panel > .table-responsive tr > :first-child {
+    padding-right: 24px;
+    padding-left: 0;
+    padding-left: initial;
   }
   .panel > .table tr > :last-child,
   .panel > .table-responsive tr > :last-child {
-    padding-inline-end: 24px;
+    padding-right: 24px;
+  }
+  [dir="rtl"] .panel > .table tr > :last-child,
+  [dir="rtl"] .panel > .table-responsive tr > :last-child {
+    padding-left: 24px;
+    padding-right: 0;
+    padding-right: initial;
   }
 }
 @media (min-width: 1160px) {
   .panel > .table tr > :first-child,
   .panel > .table-responsive tr > :first-child {
-    padding-inline-start: 32px;
+    padding-left: 32px;
+  }
+  [dir="rtl"] .panel > .table tr > :first-child,
+  [dir="rtl"] .panel > .table-responsive tr > :first-child {
+    padding-right: 32px;
+    padding-left: 0;
+    padding-left: initial;
   }
   .panel > .table tr > :last-child,
   .panel > .table-responsive tr > :last-child {
-    padding-inline-end: 32px;
+    padding-right: 32px;
+  }
+  [dir="rtl"] .panel > .table tr > :last-child,
+  [dir="rtl"] .panel > .table-responsive tr > :last-child {
+    padding-left: 32px;
+    padding-right: 0;
+    padding-right: initial;
   }
 }
 .panel-group {
-  margin-block-end: 24px;
-  margin-block-end: var(--size-24);
+  margin-bottom: 24px;
+  margin-bottom: var(--size-24);
 }
 .panel-group .panel {
-  margin-block-end: 0;
+  margin-bottom: 0;
   border-radius: 3px;
 }
 .panel-group .panel + .panel {
-  margin-block-start: 8px;
+  margin-top: 8px;
 }
 .panel-group .panel-heading {
-  border-block-end: 0;
+  border-bottom: 0;
 }
 .panel-group .panel-heading + .panel-collapse > .panel-body,
 .panel-group .panel-heading + .panel-collapse > .list-group {
-  border-block-start: 1px solid #FFF;
+  border-top: 1px solid #FFF;
 }
 .panel-group .panel-footer {
-  border-block-start: 0;
+  border-top: 0;
 }
 .panel-group .panel-footer + .panel-collapse .panel-body {
-  border-block-end: 1px solid #FFF;
+  border-bottom: 1px solid #FFF;
 }
 .panel-default {
   border-color: #e2e6e8 !important;
@@ -301,14 +402,14 @@
   border-color: #e2e6e8;
 }
 .panel-default > .panel-heading + .panel-collapse > .panel-body {
-  border-block-start-color: #e2e6e8;
+  border-top-color: #e2e6e8;
 }
 .panel-default > .panel-heading .badge {
   color: #fff;
   background-color: #4a5860;
 }
 .panel-default > .panel-footer + .panel-collapse > .panel-body {
-  border-block-end-color: #e2e6e8;
+  border-bottom-color: #e2e6e8;
 }
 .panel-primary {
   border-color: #37517e !important;
@@ -318,14 +419,14 @@
   border-color: #37517e;
 }
 .panel-primary > .panel-heading + .panel-collapse > .panel-body {
-  border-block-start-color: #37517e;
+  border-top-color: #37517e;
 }
 .panel-primary > .panel-heading .badge {
   color: #fff;
   background-color: #fff;
 }
 .panel-primary > .panel-footer + .panel-collapse > .panel-body {
-  border-block-end-color: #37517e;
+  border-bottom-color: #37517e;
 }
 .panel-success {
   border-color: #2ED06E !important;
@@ -335,14 +436,14 @@
   border-color: #2ED06E;
 }
 .panel-success > .panel-heading + .panel-collapse > .panel-body {
-  border-block-start-color: #2ED06E;
+  border-top-color: #2ED06E;
 }
 .panel-success > .panel-heading .badge {
   color: #FFF;
   background-color: #1B7940;
 }
 .panel-success > .panel-footer + .panel-collapse > .panel-body {
-  border-block-end-color: #2ED06E;
+  border-bottom-color: #2ED06E;
 }
 .panel-info {
   border-color: #00b9ff !important;
@@ -352,14 +453,14 @@
   border-color: #00b9ff;
 }
 .panel-info > .panel-heading + .panel-collapse > .panel-body {
-  border-block-start-color: #00b9ff;
+  border-top-color: #00b9ff;
 }
 .panel-info > .panel-heading .badge {
   color: #FFF;
   background-color: #00a4df;
 }
 .panel-info > .panel-footer + .panel-collapse > .panel-body {
-  border-block-end-color: #00b9ff;
+  border-bottom-color: #00b9ff;
 }
 .panel-warning {
   border-color: #FFA600 !important;
@@ -369,14 +470,14 @@
   border-color: #FFA600;
 }
 .panel-warning > .panel-heading + .panel-collapse > .panel-body {
-  border-block-start-color: #FFA600;
+  border-top-color: #FFA600;
 }
 .panel-warning > .panel-heading .badge {
   color: #FFF;
   background-color: #9E5F00;
 }
 .panel-warning > .panel-footer + .panel-collapse > .panel-body {
-  border-block-end-color: #FFA600;
+  border-bottom-color: #FFA600;
 }
 .panel-danger {
   border-color: #F53636 !important;
@@ -386,21 +487,21 @@
   border-color: #F53636;
 }
 .panel-danger > .panel-heading + .panel-collapse > .panel-body {
-  border-block-start-color: #F53636;
+  border-top-color: #F53636;
 }
 .panel-danger > .panel-heading .badge {
   color: #FFF;
   background-color: #C22E2E;
 }
 .panel-danger > .panel-footer + .panel-collapse > .panel-body {
-  border-block-end-color: #F53636;
+  border-bottom-color: #F53636;
 }
 .panel ul:last-child {
-  margin-block-end: 0;
+  margin-bottom: 0;
 }
 .panel-group .panel {
-  margin-inline-start: 0;
-  margin-inline-end: 0;
+  margin-left: 0;
+  margin-right: 0;
   border: 1px solid #e2e6e8;
 }
 .panel-group .panel-heading,
@@ -416,13 +517,12 @@
 @media (min-width: 1160px) {
   .panel-group .panel .panel-heading,
   .panel-group .panel .panel-footer {
-    padding-block: 24px;
-    padding-inline: 32px;
+    padding: 24px 32px;
   }
 }
 @media (min-width: 840px) {
   .panel {
-    margin-inline-start: 0;
-    margin-inline-end: 0;
+    margin-left: 0;
+    margin-right: 0;
   }
 }