@keenmate/pure-admin-core 1.3.0 → 1.4.1

package/dist/css/main.css

@@ -2615,7 +2615,8 @@ p {
 
 ul, ol {
   margin: 0 0 1.6rem 0;
-  padding: 0 0 0 3.2rem;
+  padding: 0;
+  padding-inline-start: 3.2rem;
 }
 ul li, ol li {
   margin-bottom: 0.4rem;
@@ -2623,7 +2624,7 @@ ul li, ol li {
 
 ul.unstyled, ol.unstyled {
   list-style: none;
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 ul.unstyled li, ol.unstyled li {
   margin-bottom: 0;
@@ -2641,7 +2642,7 @@ dd {
 
 blockquote {
   margin: 1.6rem 0 1.6rem 0;
-  padding: 0 0 0 2.4rem;
+  padding-inline-start: 2.4rem;
 }
 
 pre {
@@ -2741,8 +2742,7 @@ label {
 .pa-navbar {
   position: fixed;
   top: 0;
-  left: 0;
-  right: 0;
+  inset-inline: 0;
   height: 4.8rem;
   background-color: var(--pa-header-bg);
   border-bottom: 1px solid var(--pa-header-border-color);
@@ -2754,42 +2754,32 @@ label {
 
 body.pa-container-sm .pa-navbar {
   max-width: 76.8rem;
-  left: 0;
-  right: 0;
-  margin-left: auto;
-  margin-right: auto;
+  inset-inline: 0;
+  margin-inline: auto;
 }
 
 body.pa-container-md .pa-navbar {
   max-width: 102.4rem;
-  left: 0;
-  right: 0;
-  margin-left: auto;
-  margin-right: auto;
+  inset-inline: 0;
+  margin-inline: auto;
 }
 
 body.pa-container-lg .pa-navbar {
   max-width: 128rem;
-  left: 0;
-  right: 0;
-  margin-left: auto;
-  margin-right: auto;
+  inset-inline: 0;
+  margin-inline: auto;
 }
 
 body.pa-container-xl .pa-navbar {
   max-width: 160rem;
-  left: 0;
-  right: 0;
-  margin-left: auto;
-  margin-right: auto;
+  inset-inline: 0;
+  margin-inline: auto;
 }
 
 body.pa-container-2xl .pa-navbar {
   max-width: 192rem;
-  left: 0;
-  right: 0;
-  margin-left: auto;
-  margin-right: auto;
+  inset-inline: 0;
+  margin-inline: auto;
 }
 
 .pa-navbar__inner {
@@ -2985,7 +2975,7 @@ body.pa-layout--sticky .pa-layout__inner {
 
 .pa-layout__sidebar {
   background-color: var(--pa-sidebar-bg);
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
   flex-shrink: 0;
   position: relative;
 }
@@ -2993,7 +2983,7 @@ body.pa-layout--sticky .pa-layout__inner {
 .pa-sidebar-resize {
   position: absolute;
   top: 0;
-  right: 0;
+  inset-inline-end: 0;
   width: 6px;
   height: 100%;
   cursor: ew-resize;
@@ -3003,7 +2993,7 @@ body.pa-layout--sticky .pa-layout__inner {
   content: "";
   position: absolute;
   top: 0;
-  left: 50%;
+  inset-inline-start: 50%;
   transform: translateX(-50%);
   width: 2px;
   height: 100%;
@@ -3044,7 +3034,7 @@ body.pa-layout--sticky .pa-layout__sidebar {
   color: var(--pa-sidebar-text-secondary);
   text-decoration: none;
   font-weight: 500;
-  border-right: 3px solid transparent;
+  border-inline-end: 3px solid transparent;
 }
 body.loaded .pa-sidebar__link {
   transition: all 0.1s ease-out;
@@ -3056,7 +3046,7 @@ body.loaded .pa-sidebar__link {
 .pa-sidebar__link--active {
   color: var(--pa-sidebar-text);
   background-color: var(--pa-accent-hover);
-  border-right-color: var(--pa-accent);
+  border-inline-end-color: var(--pa-accent);
   font-weight: 600;
 }
 .pa-sidebar__toggle {
@@ -3068,7 +3058,7 @@ body.loaded .pa-sidebar__link {
   background: none;
   border: none;
   width: 100%;
-  text-align: left;
+  text-align: start;
   font-weight: 500;
   cursor: pointer;
 }
@@ -3115,31 +3105,31 @@ body.loaded .pa-sidebar__label {
   display: block;
 }
 .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link {
-  padding-left: 4rem;
+  padding-inline-start: 4rem;
   font-size: 1.5rem;
-  border-right: 2px solid transparent;
+  border-inline-end: 2px solid transparent;
 }
 .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link:hover {
   background-color: var(--pa-sidebar-submenu-hover-bg);
 }
 .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link--active {
   background-color: var(--pa-sidebar-submenu-active-bg);
-  border-right-color: var(--pa-accent);
+  border-inline-end-color: var(--pa-accent);
 }
 .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__toggle {
-  padding-left: 4rem;
+  padding-inline-start: 4rem;
   font-size: 1.5rem;
 }
 .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link {
-  padding-left: 5.2rem;
+  padding-inline-start: 5.2rem;
   font-size: 1.4rem;
-  border-right: 1px solid transparent;
+  border-inline-end: 1px solid transparent;
 }
 .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link--active {
-  border-right-color: var(--pa-accent);
+  border-inline-end-color: var(--pa-accent);
 }
 .pa-sidebar__chevron {
-  margin-left: auto;
+  margin-inline-start: auto;
   font-size: 1.2rem;
 }
 body.loaded .pa-sidebar__chevron {
@@ -3148,6 +3138,9 @@ body.loaded .pa-sidebar__chevron {
 .pa-sidebar__item--open .pa-sidebar__chevron {
   transform: rotate(90deg);
 }
+[dir=rtl] .pa-sidebar__item--open .pa-sidebar__chevron {
+  transform: rotate(-90deg);
+}
 
 /* ========================================
    Sidebar States
@@ -3157,14 +3150,14 @@ body.loaded .pa-sidebar__chevron {
   width: 0;
   opacity: 0;
   overflow: hidden;
-  border-right: none;
+  border-inline-end: none;
 }
 .sidebar-hidden .pa-layout__sidebar--icon-collapse {
   width: 6.4rem;
   opacity: 1;
   overflow: visible !important;
   z-index: 1050;
-  border-right: 1px solid #e1e5e9;
+  border-inline-end: 1px solid #e1e5e9;
 }
 .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__item {
   position: relative;
@@ -3196,14 +3189,17 @@ body.loaded .pa-sidebar__chevron {
   width: auto;
   overflow: visible;
   position: absolute;
-  left: 100%;
+  inset-inline-start: 100%;
   top: 0;
   bottom: 0;
   padding: 0.8rem 1.6rem;
   background-color: var(--pa-sidebar-bg);
   border: 1px solid var(--pa-border-color);
-  border-left: none;
-  border-radius: 0 4px 4px 0;
+  border-inline-start: none;
+  border-start-start-radius: 0;
+  border-start-end-radius: 4px;
+  border-end-end-radius: 4px;
+  border-end-start-radius: 0;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   white-space: nowrap;
   z-index: 10;
@@ -3216,7 +3212,7 @@ body.loaded .pa-sidebar__chevron {
   max-height: none !important;
   overflow: visible !important;
   position: absolute;
-  left: 100%;
+  inset-inline-start: 100%;
   top: 0;
   min-width: 12rem;
   margin: 0;
@@ -3224,8 +3220,11 @@ body.loaded .pa-sidebar__chevron {
   list-style: none;
   background-color: var(--pa-sidebar-submenu-bg);
   border: 1px solid var(--pa-border-color);
-  border-left: none;
-  border-radius: 0 4px 4px 0;
+  border-inline-start: none;
+  border-start-start-radius: 0;
+  border-start-end-radius: 4px;
+  border-end-end-radius: 4px;
+  border-end-start-radius: 0;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   z-index: 1001;
 }
@@ -3274,7 +3273,7 @@ body.loaded .pa-sidebar__chevron {
 .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__item:hover > .pa-sidebar__submenu .pa-sidebar__chevron,
 .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu:hover .pa-sidebar__chevron {
   display: inline;
-  margin-left: auto;
+  margin-inline-start: auto;
   transform: none !important;
 }
 .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__item:hover > .pa-sidebar__submenu .pa-sidebar__submenu,
@@ -3289,7 +3288,7 @@ body.loaded .pa-sidebar__chevron {
   max-height: none !important;
   overflow: visible !important;
   position: absolute;
-  left: 100%;
+  inset-inline-start: 100%;
   top: 0;
   min-width: 19.2rem;
   margin: 0;
@@ -3297,8 +3296,11 @@ body.loaded .pa-sidebar__chevron {
   list-style: none;
   background-color: var(--pa-sidebar-submenu-bg);
   border: 1px solid var(--pa-border-color);
-  border-left: none;
-  border-radius: 0 4px 4px 0;
+  border-inline-start: none;
+  border-start-start-radius: 0;
+  border-start-end-radius: 4px;
+  border-end-end-radius: 4px;
+  border-end-start-radius: 0;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   z-index: 1002;
 }
@@ -3337,11 +3339,11 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__toggle
 }
 body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link,
 body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__toggle {
-  padding-left: 4rem;
+  padding-inline-start: 4rem;
 }
 body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link,
 body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__toggle {
-  padding-left: 5.2rem;
+  padding-inline-start: 5.2rem;
 }
 body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   width: 2.4rem;
@@ -3353,11 +3355,11 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
    ======================================== */
 .pa-header__burger {
   flex-shrink: 0;
-  margin-left: 0.3rem;
+  margin-inline-start: 0.3rem;
 }
 .pa-header__brand {
   flex-shrink: 0;
-  padding-left: 2.1rem;
+  padding-inline-start: 2.1rem;
 }
 .pa-header__brand h1 {
   margin: 0;
@@ -3412,7 +3414,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   display: none !important;
   position: absolute;
   top: 100%;
-  left: 0;
+  inset-inline-start: 0;
   min-width: 19.2rem;
   background-color: var(--pa-card-bg);
   border: 1px solid var(--pa-border-color);
@@ -3433,7 +3435,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   content: "";
   position: absolute;
   top: 0;
-  left: 100%;
+  inset-inline-start: 100%;
   width: 6.4px;
   height: 100%;
   z-index: 1099;
@@ -3457,9 +3459,9 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
 }
 .pa-header__dropdown--level2 {
   top: 0;
-  left: 100%;
+  inset-inline-start: 100%;
   margin-top: 0;
-  margin-left: 0;
+  margin-inline-start: 0;
 }
 .pa-header__title {
   flex: 1;
@@ -3507,6 +3509,12 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
 .burger-menu.active span:nth-child(3) {
   transform: rotate(-45deg) translate(3px, -3px);
 }
+[dir=rtl] .burger-menu.active span:nth-child(1) {
+  transform: rotate(45deg) translate(-3px, 3px);
+}
+[dir=rtl] .burger-menu.active span:nth-child(3) {
+  transform: rotate(-45deg) translate(-3px, -3px);
+}
 .burger-menu:hover span {
   background-color: var(--pa-accent);
 }
@@ -3542,7 +3550,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
     width: 0;
     opacity: 0;
     overflow: hidden;
-    border-right: none;
+    border-inline-end: none;
   }
   body:not(.sidebar-visible) .pa-layout__sidebar--icon-collapse {
     width: 0 !important;
@@ -3553,7 +3561,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   .sidebar-visible .pa-layout__sidebar {
     position: fixed;
     top: 4.8rem;
-    left: 0;
+    inset-inline-start: 0;
     bottom: 0;
     width: 90vw;
     z-index: 1050;
@@ -3575,8 +3583,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
     content: "";
     position: fixed;
     top: 4.8rem;
-    left: 0;
-    right: 0;
+    inset-inline: 0;
     bottom: 0;
     background-color: rgba(0, 0, 0, 0.5);
     z-index: 1040;
@@ -3606,21 +3613,17 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
 .pa-row {
   display: flex;
   flex-wrap: wrap;
-  margin-left: -0.8rem;
-  margin-right: -0.8rem;
+  margin-inline: -0.8rem;
 }
 .pa-row .pa-row {
-  margin-left: 0;
-  margin-right: 0;
+  margin-inline: 0;
 }
 
 .pa-row--no-gutter {
-  margin-left: 0;
-  margin-right: 0;
+  margin-inline: 0;
 }
 .pa-row--no-gutter > [class*=pa-col] {
-  padding-left: 0;
-  padding-right: 0;
+  padding-inline: 0;
 }
 
 .pa-row--center {
@@ -3661,676 +3664,604 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
 
 .pa-col {
   flex: 1;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-auto {
   flex: 0 0 auto;
   width: auto;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
 }
 
 .pa-col-5 {
   flex: 0 0 5%;
   max-width: 5%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-10 {
   flex: 0 0 10%;
   max-width: 10%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-15 {
   flex: 0 0 15%;
   max-width: 15%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-20 {
   flex: 0 0 20%;
   max-width: 20%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-25 {
   flex: 0 0 25%;
   max-width: 25%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-30 {
   flex: 0 0 30%;
   max-width: 30%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-35 {
   flex: 0 0 35%;
   max-width: 35%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-40 {
   flex: 0 0 40%;
   max-width: 40%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-45 {
   flex: 0 0 45%;
   max-width: 45%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-50 {
   flex: 0 0 50%;
   max-width: 50%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-55 {
   flex: 0 0 55%;
   max-width: 55%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-60 {
   flex: 0 0 60%;
   max-width: 60%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-65 {
   flex: 0 0 65%;
   max-width: 65%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-70 {
   flex: 0 0 70%;
   max-width: 70%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-75 {
   flex: 0 0 75%;
   max-width: 75%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-80 {
   flex: 0 0 80%;
   max-width: 80%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-85 {
   flex: 0 0 85%;
   max-width: 85%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-90 {
   flex: 0 0 90%;
   max-width: 90%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-95 {
   flex: 0 0 95%;
   max-width: 95%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-100 {
   flex: 0 0 100%;
   max-width: 100%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-1-2 {
   flex: 0 0 50%;
   max-width: 50%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-1-3 {
   flex: 0 0 33.333%;
   max-width: 33.333%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-2-3 {
   flex: 0 0 66.667%;
   max-width: 66.667%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-1-4 {
   flex: 0 0 25%;
   max-width: 25%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-3-4 {
   flex: 0 0 75%;
   max-width: 75%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-1-5 {
   flex: 0 0 20%;
   max-width: 20%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-2-5 {
   flex: 0 0 40%;
   max-width: 40%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-3-5 {
   flex: 0 0 60%;
   max-width: 60%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-4-5 {
   flex: 0 0 80%;
   max-width: 80%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-1-6 {
   flex: 0 0 16.667%;
   max-width: 16.667%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-5-6 {
   flex: 0 0 83.333%;
   max-width: 83.333%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-1-12 {
   flex: 0 0 8.333%;
   max-width: 8.333%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-5-12 {
   flex: 0 0 41.667%;
   max-width: 41.667%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-7-12 {
   flex: 0 0 58.333%;
   max-width: 58.333%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-col-11-12 {
   flex: 0 0 91.667%;
   max-width: 91.667%;
-  padding-left: 0.8rem;
-  padding-right: 0.8rem;
+  padding-inline: 0.8rem;
   min-width: 0;
 }
 
 .pa-offset-5 {
-  margin-left: 5%;
+  margin-inline-start: 5%;
 }
 
 .pa-offset-10 {
-  margin-left: 10%;
+  margin-inline-start: 10%;
 }
 
 .pa-offset-15 {
-  margin-left: 15%;
+  margin-inline-start: 15%;
 }
 
 .pa-offset-20 {
-  margin-left: 20%;
+  margin-inline-start: 20%;
 }
 
 .pa-offset-25 {
-  margin-left: 25%;
+  margin-inline-start: 25%;
 }
 
 .pa-offset-30 {
-  margin-left: 30%;
+  margin-inline-start: 30%;
 }
 
 .pa-offset-35 {
-  margin-left: 35%;
+  margin-inline-start: 35%;
 }
 
 .pa-offset-40 {
-  margin-left: 40%;
+  margin-inline-start: 40%;
 }
 
 .pa-offset-45 {
-  margin-left: 45%;
+  margin-inline-start: 45%;
 }
 
 .pa-offset-50 {
-  margin-left: 50%;
+  margin-inline-start: 50%;
 }
 
 .pa-offset-55 {
-  margin-left: 55%;
+  margin-inline-start: 55%;
 }
 
 .pa-offset-60 {
-  margin-left: 60%;
+  margin-inline-start: 60%;
 }
 
 .pa-offset-65 {
-  margin-left: 65%;
+  margin-inline-start: 65%;
 }
 
 .pa-offset-70 {
-  margin-left: 70%;
+  margin-inline-start: 70%;
 }
 
 .pa-offset-75 {
-  margin-left: 75%;
+  margin-inline-start: 75%;
 }
 
 .pa-offset-80 {
-  margin-left: 80%;
+  margin-inline-start: 80%;
 }
 
 .pa-offset-85 {
-  margin-left: 85%;
+  margin-inline-start: 85%;
 }
 
 .pa-offset-90 {
-  margin-left: 90%;
+  margin-inline-start: 90%;
 }
 
 .pa-offset-95 {
-  margin-left: 95%;
+  margin-inline-start: 95%;
 }
 
 @media (min-width: 576px) {
   .pa-col-sm-5 {
     flex: 0 0 5%;
     max-width: 5%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-10 {
     flex: 0 0 10%;
     max-width: 10%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-15 {
     flex: 0 0 15%;
     max-width: 15%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-20 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-25 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-30 {
     flex: 0 0 30%;
     max-width: 30%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-35 {
     flex: 0 0 35%;
     max-width: 35%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-40 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-45 {
     flex: 0 0 45%;
     max-width: 45%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-50 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-55 {
     flex: 0 0 55%;
     max-width: 55%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-60 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-65 {
     flex: 0 0 65%;
     max-width: 65%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-70 {
     flex: 0 0 70%;
     max-width: 70%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-75 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-80 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-85 {
     flex: 0 0 85%;
     max-width: 85%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-90 {
     flex: 0 0 90%;
     max-width: 90%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-95 {
     flex: 0 0 95%;
     max-width: 95%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-100 {
     flex: 0 0 100%;
     max-width: 100%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-1-2 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-1-3 {
     flex: 0 0 33.333%;
     max-width: 33.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-2-3 {
     flex: 0 0 66.667%;
     max-width: 66.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-1-4 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-3-4 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-1-5 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-2-5 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-3-5 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-4-5 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-1-6 {
     flex: 0 0 16.667%;
     max-width: 16.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-5-6 {
     flex: 0 0 83.333%;
     max-width: 83.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-1-12 {
     flex: 0 0 8.333%;
     max-width: 8.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-5-12 {
     flex: 0 0 41.667%;
     max-width: 41.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-7-12 {
     flex: 0 0 58.333%;
     max-width: 58.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-sm-11-12 {
     flex: 0 0 91.667%;
     max-width: 91.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-offset-sm-5 {
-    margin-left: 5%;
+    margin-inline-start: 5%;
   }
   .pa-offset-sm-10 {
-    margin-left: 10%;
+    margin-inline-start: 10%;
   }
   .pa-offset-sm-15 {
-    margin-left: 15%;
+    margin-inline-start: 15%;
   }
   .pa-offset-sm-20 {
-    margin-left: 20%;
+    margin-inline-start: 20%;
   }
   .pa-offset-sm-25 {
-    margin-left: 25%;
+    margin-inline-start: 25%;
   }
   .pa-offset-sm-30 {
-    margin-left: 30%;
+    margin-inline-start: 30%;
   }
   .pa-offset-sm-35 {
-    margin-left: 35%;
+    margin-inline-start: 35%;
   }
   .pa-offset-sm-40 {
-    margin-left: 40%;
+    margin-inline-start: 40%;
   }
   .pa-offset-sm-45 {
-    margin-left: 45%;
+    margin-inline-start: 45%;
   }
   .pa-offset-sm-50 {
-    margin-left: 50%;
+    margin-inline-start: 50%;
   }
   .pa-offset-sm-55 {
-    margin-left: 55%;
+    margin-inline-start: 55%;
   }
   .pa-offset-sm-60 {
-    margin-left: 60%;
+    margin-inline-start: 60%;
   }
   .pa-offset-sm-65 {
-    margin-left: 65%;
+    margin-inline-start: 65%;
   }
   .pa-offset-sm-70 {
-    margin-left: 70%;
+    margin-inline-start: 70%;
   }
   .pa-offset-sm-75 {
-    margin-left: 75%;
+    margin-inline-start: 75%;
   }
   .pa-offset-sm-80 {
-    margin-left: 80%;
+    margin-inline-start: 80%;
   }
   .pa-offset-sm-85 {
-    margin-left: 85%;
+    margin-inline-start: 85%;
   }
   .pa-offset-sm-90 {
-    margin-left: 90%;
+    margin-inline-start: 90%;
   }
   .pa-offset-sm-95 {
-    margin-left: 95%;
+    margin-inline-start: 95%;
   }
   .pa-col-sm-auto {
     flex: 0 0 auto;
@@ -4341,304 +4272,269 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   .pa-col-md-5 {
     flex: 0 0 5%;
     max-width: 5%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-10 {
     flex: 0 0 10%;
     max-width: 10%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-15 {
     flex: 0 0 15%;
     max-width: 15%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-20 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-25 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-30 {
     flex: 0 0 30%;
     max-width: 30%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-35 {
     flex: 0 0 35%;
     max-width: 35%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-40 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-45 {
     flex: 0 0 45%;
     max-width: 45%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-50 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-55 {
     flex: 0 0 55%;
     max-width: 55%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-60 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-65 {
     flex: 0 0 65%;
     max-width: 65%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-70 {
     flex: 0 0 70%;
     max-width: 70%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-75 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-80 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-85 {
     flex: 0 0 85%;
     max-width: 85%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-90 {
     flex: 0 0 90%;
     max-width: 90%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-95 {
     flex: 0 0 95%;
     max-width: 95%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-100 {
     flex: 0 0 100%;
     max-width: 100%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-1-2 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-1-3 {
     flex: 0 0 33.333%;
     max-width: 33.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-2-3 {
     flex: 0 0 66.667%;
     max-width: 66.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-1-4 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-3-4 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-1-5 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-2-5 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-3-5 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-4-5 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-1-6 {
     flex: 0 0 16.667%;
     max-width: 16.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-5-6 {
     flex: 0 0 83.333%;
     max-width: 83.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-1-12 {
     flex: 0 0 8.333%;
     max-width: 8.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-5-12 {
     flex: 0 0 41.667%;
     max-width: 41.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-7-12 {
     flex: 0 0 58.333%;
     max-width: 58.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-md-11-12 {
     flex: 0 0 91.667%;
     max-width: 91.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-offset-md-5 {
-    margin-left: 5%;
+    margin-inline-start: 5%;
   }
   .pa-offset-md-10 {
-    margin-left: 10%;
+    margin-inline-start: 10%;
   }
   .pa-offset-md-15 {
-    margin-left: 15%;
+    margin-inline-start: 15%;
   }
   .pa-offset-md-20 {
-    margin-left: 20%;
+    margin-inline-start: 20%;
   }
   .pa-offset-md-25 {
-    margin-left: 25%;
+    margin-inline-start: 25%;
   }
   .pa-offset-md-30 {
-    margin-left: 30%;
+    margin-inline-start: 30%;
   }
   .pa-offset-md-35 {
-    margin-left: 35%;
+    margin-inline-start: 35%;
   }
   .pa-offset-md-40 {
-    margin-left: 40%;
+    margin-inline-start: 40%;
   }
   .pa-offset-md-45 {
-    margin-left: 45%;
+    margin-inline-start: 45%;
   }
   .pa-offset-md-50 {
-    margin-left: 50%;
+    margin-inline-start: 50%;
   }
   .pa-offset-md-55 {
-    margin-left: 55%;
+    margin-inline-start: 55%;
   }
   .pa-offset-md-60 {
-    margin-left: 60%;
+    margin-inline-start: 60%;
   }
   .pa-offset-md-65 {
-    margin-left: 65%;
+    margin-inline-start: 65%;
   }
   .pa-offset-md-70 {
-    margin-left: 70%;
+    margin-inline-start: 70%;
   }
   .pa-offset-md-75 {
-    margin-left: 75%;
+    margin-inline-start: 75%;
   }
   .pa-offset-md-80 {
-    margin-left: 80%;
+    margin-inline-start: 80%;
   }
   .pa-offset-md-85 {
-    margin-left: 85%;
+    margin-inline-start: 85%;
   }
   .pa-offset-md-90 {
-    margin-left: 90%;
+    margin-inline-start: 90%;
   }
   .pa-offset-md-95 {
-    margin-left: 95%;
+    margin-inline-start: 95%;
   }
   .pa-col-md-auto {
     flex: 0 0 auto;
@@ -4649,304 +4545,269 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   .pa-col-lg-5 {
     flex: 0 0 5%;
     max-width: 5%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-10 {
     flex: 0 0 10%;
     max-width: 10%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-15 {
     flex: 0 0 15%;
     max-width: 15%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-20 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-25 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-30 {
     flex: 0 0 30%;
     max-width: 30%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-35 {
     flex: 0 0 35%;
     max-width: 35%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-40 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-45 {
     flex: 0 0 45%;
     max-width: 45%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-50 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-55 {
     flex: 0 0 55%;
     max-width: 55%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-60 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-65 {
     flex: 0 0 65%;
     max-width: 65%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-70 {
     flex: 0 0 70%;
     max-width: 70%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-75 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-80 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-85 {
     flex: 0 0 85%;
     max-width: 85%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-90 {
     flex: 0 0 90%;
     max-width: 90%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-95 {
     flex: 0 0 95%;
     max-width: 95%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-100 {
     flex: 0 0 100%;
     max-width: 100%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-1-2 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-1-3 {
     flex: 0 0 33.333%;
     max-width: 33.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-2-3 {
     flex: 0 0 66.667%;
     max-width: 66.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-1-4 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-3-4 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-1-5 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-2-5 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-3-5 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-4-5 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-1-6 {
     flex: 0 0 16.667%;
     max-width: 16.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-5-6 {
     flex: 0 0 83.333%;
     max-width: 83.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-1-12 {
     flex: 0 0 8.333%;
     max-width: 8.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-5-12 {
     flex: 0 0 41.667%;
     max-width: 41.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-7-12 {
     flex: 0 0 58.333%;
     max-width: 58.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-lg-11-12 {
     flex: 0 0 91.667%;
     max-width: 91.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-offset-lg-5 {
-    margin-left: 5%;
+    margin-inline-start: 5%;
   }
   .pa-offset-lg-10 {
-    margin-left: 10%;
+    margin-inline-start: 10%;
   }
   .pa-offset-lg-15 {
-    margin-left: 15%;
+    margin-inline-start: 15%;
   }
   .pa-offset-lg-20 {
-    margin-left: 20%;
+    margin-inline-start: 20%;
   }
   .pa-offset-lg-25 {
-    margin-left: 25%;
+    margin-inline-start: 25%;
   }
   .pa-offset-lg-30 {
-    margin-left: 30%;
+    margin-inline-start: 30%;
   }
   .pa-offset-lg-35 {
-    margin-left: 35%;
+    margin-inline-start: 35%;
   }
   .pa-offset-lg-40 {
-    margin-left: 40%;
+    margin-inline-start: 40%;
   }
   .pa-offset-lg-45 {
-    margin-left: 45%;
+    margin-inline-start: 45%;
   }
   .pa-offset-lg-50 {
-    margin-left: 50%;
+    margin-inline-start: 50%;
   }
   .pa-offset-lg-55 {
-    margin-left: 55%;
+    margin-inline-start: 55%;
   }
   .pa-offset-lg-60 {
-    margin-left: 60%;
+    margin-inline-start: 60%;
   }
   .pa-offset-lg-65 {
-    margin-left: 65%;
+    margin-inline-start: 65%;
   }
   .pa-offset-lg-70 {
-    margin-left: 70%;
+    margin-inline-start: 70%;
   }
   .pa-offset-lg-75 {
-    margin-left: 75%;
+    margin-inline-start: 75%;
   }
   .pa-offset-lg-80 {
-    margin-left: 80%;
+    margin-inline-start: 80%;
   }
   .pa-offset-lg-85 {
-    margin-left: 85%;
+    margin-inline-start: 85%;
   }
   .pa-offset-lg-90 {
-    margin-left: 90%;
+    margin-inline-start: 90%;
   }
   .pa-offset-lg-95 {
-    margin-left: 95%;
+    margin-inline-start: 95%;
   }
   .pa-col-lg-auto {
     flex: 0 0 auto;
@@ -4957,304 +4818,269 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   .pa-col-xl-5 {
     flex: 0 0 5%;
     max-width: 5%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-10 {
     flex: 0 0 10%;
     max-width: 10%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-15 {
     flex: 0 0 15%;
     max-width: 15%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-20 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-25 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-30 {
     flex: 0 0 30%;
     max-width: 30%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-35 {
     flex: 0 0 35%;
     max-width: 35%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-40 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-45 {
     flex: 0 0 45%;
     max-width: 45%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-50 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-55 {
     flex: 0 0 55%;
     max-width: 55%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-60 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-65 {
     flex: 0 0 65%;
     max-width: 65%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-70 {
     flex: 0 0 70%;
     max-width: 70%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-75 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-80 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-85 {
     flex: 0 0 85%;
     max-width: 85%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-90 {
     flex: 0 0 90%;
     max-width: 90%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-95 {
     flex: 0 0 95%;
     max-width: 95%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-100 {
     flex: 0 0 100%;
     max-width: 100%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-1-2 {
     flex: 0 0 50%;
     max-width: 50%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-1-3 {
     flex: 0 0 33.333%;
     max-width: 33.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-2-3 {
     flex: 0 0 66.667%;
     max-width: 66.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-1-4 {
     flex: 0 0 25%;
     max-width: 25%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-3-4 {
     flex: 0 0 75%;
     max-width: 75%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-1-5 {
     flex: 0 0 20%;
     max-width: 20%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-2-5 {
     flex: 0 0 40%;
     max-width: 40%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-3-5 {
     flex: 0 0 60%;
     max-width: 60%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-4-5 {
     flex: 0 0 80%;
     max-width: 80%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-1-6 {
     flex: 0 0 16.667%;
     max-width: 16.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-5-6 {
     flex: 0 0 83.333%;
     max-width: 83.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-1-12 {
     flex: 0 0 8.333%;
     max-width: 8.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-5-12 {
     flex: 0 0 41.667%;
     max-width: 41.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-7-12 {
     flex: 0 0 58.333%;
     max-width: 58.333%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-col-xl-11-12 {
     flex: 0 0 91.667%;
     max-width: 91.667%;
-    padding-left: 0.8rem;
-    padding-right: 0.8rem;
+    padding-inline: 0.8rem;
     min-width: 0;
   }
   .pa-offset-xl-5 {
-    margin-left: 5%;
+    margin-inline-start: 5%;
   }
   .pa-offset-xl-10 {
-    margin-left: 10%;
+    margin-inline-start: 10%;
   }
   .pa-offset-xl-15 {
-    margin-left: 15%;
+    margin-inline-start: 15%;
   }
   .pa-offset-xl-20 {
-    margin-left: 20%;
+    margin-inline-start: 20%;
   }
   .pa-offset-xl-25 {
-    margin-left: 25%;
+    margin-inline-start: 25%;
   }
   .pa-offset-xl-30 {
-    margin-left: 30%;
+    margin-inline-start: 30%;
   }
   .pa-offset-xl-35 {
-    margin-left: 35%;
+    margin-inline-start: 35%;
   }
   .pa-offset-xl-40 {
-    margin-left: 40%;
+    margin-inline-start: 40%;
   }
   .pa-offset-xl-45 {
-    margin-left: 45%;
+    margin-inline-start: 45%;
   }
   .pa-offset-xl-50 {
-    margin-left: 50%;
+    margin-inline-start: 50%;
   }
   .pa-offset-xl-55 {
-    margin-left: 55%;
+    margin-inline-start: 55%;
   }
   .pa-offset-xl-60 {
-    margin-left: 60%;
+    margin-inline-start: 60%;
   }
   .pa-offset-xl-65 {
-    margin-left: 65%;
+    margin-inline-start: 65%;
   }
   .pa-offset-xl-70 {
-    margin-left: 70%;
+    margin-inline-start: 70%;
   }
   .pa-offset-xl-75 {
-    margin-left: 75%;
+    margin-inline-start: 75%;
   }
   .pa-offset-xl-80 {
-    margin-left: 80%;
+    margin-inline-start: 80%;
   }
   .pa-offset-xl-85 {
-    margin-left: 85%;
+    margin-inline-start: 85%;
   }
   .pa-offset-xl-90 {
-    margin-left: 90%;
+    margin-inline-start: 90%;
   }
   .pa-offset-xl-95 {
-    margin-left: 95%;
+    margin-inline-start: 95%;
   }
   .pa-col-xl-auto {
     flex: 0 0 auto;
@@ -5262,8 +5088,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   }
 }
 .pa-col--no-padding {
-  padding-left: 0;
-  padding-right: 0;
+  padding-inline: 0;
 }
 
 .pa-col--grow {
@@ -5515,6 +5340,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   display: flex;
   justify-content: space-between;
   align-items: center;
+  gap: 1.6rem;
   min-width: 0;
 }
 .pa-card__header h1,
@@ -5543,9 +5369,40 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
   color: var(--pa-text-color-1);
   font-size: 1.6rem;
 }
+.pa-card__header > h1,
+.pa-card__header > h2,
+.pa-card__header > h3,
+.pa-card__header > h4,
+.pa-card__header > h5,
+.pa-card__header > h6 {
+  flex-shrink: 0;
+}
+.pa-card__header > p {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  color: var(--pa-text-color-2);
+  font-size: 1.4rem;
+}
+.pa-card__header .pa-card__actions,
+.pa-card__header .pa-btn-group {
+  flex-shrink: 0;
+}
 .pa-card__header .pa-btn {
   margin-top: -0.25rem;
   margin-bottom: -0.25rem;
+  flex-shrink: 0;
+}
+.pa-card__header--wrap {
+  flex-wrap: wrap;
+}
+.pa-card__header--wrap > p {
+  white-space: normal;
+  flex-basis: 100%;
+  order: 1;
+  margin-top: 0.4rem;
 }
 .pa-card__title {
   display: flex;
@@ -5977,19 +5834,22 @@ a.pa-card p {
 .pa-tabs--vertical {
   flex-direction: column;
   border-bottom: none;
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
   gap: 0;
   margin-bottom: 0;
-  padding-right: 0;
+  padding-inline-end: 0;
   width: fit-content;
   min-width: max-content;
 }
 .pa-tabs--vertical .pa-tabs__item {
   justify-content: flex-start;
   border-bottom: none;
-  border-right: 2px solid transparent;
+  border-inline-end: 2px solid transparent;
   padding: 0.8rem;
-  border-radius: 4px 0 0 4px;
+  border-start-start-radius: 4px;
+  border-end-start-radius: 4px;
+  border-start-end-radius: 0;
+  border-end-end-radius: 0;
   gap: 1.2rem;
   white-space: nowrap;
   min-height: 4rem;
@@ -5998,7 +5858,7 @@ a.pa-card p {
   background-color: rgba(0, 123, 255, 0.05);
 }
 .pa-tabs--vertical .pa-tabs__item--active {
-  border-right-color: #007bff;
+  border-inline-end-color: #007bff;
   background-color: rgba(0, 123, 255, 0.1);
 }
 .pa-tabs--vertical .pa-tabs__item i {
@@ -6060,14 +5920,20 @@ a.pa-card p {
 .pa-tabs--scrollable .pa-tabs__scroll-btn:hover {
   background: linear-gradient(to right, var(--pa-main-bg), color-mix(in srgb, var(--pa-main-bg) 80%, transparent));
 }
-.pa-tabs--scrollable .pa-tabs__scroll-btn--left {
-  left: 0;
+.pa-tabs--scrollable .pa-tabs__scroll-btn--left, .pa-tabs--scrollable .pa-tabs__scroll-btn--start {
+  inset-inline-start: 0;
   background: linear-gradient(to right, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
 }
-.pa-tabs--scrollable .pa-tabs__scroll-btn--right {
-  right: 0;
+[dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--left, [dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--start {
+  background: linear-gradient(to left, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
+}
+.pa-tabs--scrollable .pa-tabs__scroll-btn--right, .pa-tabs--scrollable .pa-tabs__scroll-btn--end {
+  inset-inline-end: 0;
   background: linear-gradient(to left, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
 }
+[dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--right, [dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--end {
+  background: linear-gradient(to right, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
+}
 .pa-tabs--scrollable .pa-tabs__scroll-btn--visible {
   opacity: 1;
   pointer-events: auto;
@@ -6163,7 +6029,7 @@ a.pa-card p {
 }
 .pa-tabs__container--card .pa-tabs__overflow {
   position: relative;
-  margin-left: auto;
+  margin-inline-start: auto;
   flex-shrink: 0;
 }
 .pa-tabs__container--card .pa-tabs__overflow-toggle {
@@ -6179,7 +6045,7 @@ a.pa-card p {
   color: var(--pa-text-color-2);
   cursor: pointer;
   transition: all 0.1s ease-out;
-  border-left: 1px solid var(--pa-border-color);
+  border-inline-start: 1px solid var(--pa-border-color);
   margin: -0.5rem -1rem -0.5rem 0;
   box-sizing: content-box;
   height: 4rem;
@@ -6206,7 +6072,7 @@ a.pa-card p {
 .pa-tabs__container--card .pa-tabs__overflow-menu {
   position: absolute;
   top: 4rem;
-  right: 0;
+  inset-inline-end: 0;
   min-width: 15rem;
   background: var(--pa-card-bg);
   border: 1px solid var(--pa-border-color);
@@ -6225,7 +6091,7 @@ a.pa-card p {
   border: none;
   border-bottom: none;
   border-radius: 0;
-  text-align: left;
+  text-align: start;
   white-space: nowrap;
 }
 .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item:hover {
@@ -6251,7 +6117,7 @@ a.pa-card p {
   margin-bottom: 1.6rem;
 }
 .pa-tabs__vertical-layout--bordered .pa-tabs--vertical {
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
 }
 .pa-tabs__vertical-layout--bordered .pa-tabs--vertical .pa-tabs__item {
   width: 100%;
@@ -6430,7 +6296,7 @@ a.pa-card p {
    ======================================== */
 .pa-list-basic {
   margin: 0;
-  padding-left: 2.4rem;
+  padding-inline-start: 2.4rem;
 }
 .pa-list-basic li {
   margin-bottom: 0.8rem;
@@ -6444,18 +6310,18 @@ a.pa-card p {
 }
 .pa-list-basic--unstyled {
   list-style: none;
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 .pa-list-basic--inline {
   list-style: none;
-  padding-left: 0;
+  padding-inline-start: 0;
   display: flex;
   flex-wrap: wrap;
   gap: 1.6rem;
 }
 .pa-list-basic--bordered {
   list-style: none;
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 .pa-list-basic--bordered li {
   padding: 0.8rem 1.6rem;
@@ -6466,7 +6332,7 @@ a.pa-card p {
 }
 .pa-list-basic--striped {
   list-style: none;
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 .pa-list-basic--striped li {
   padding: 0.8rem 1.6rem;
@@ -6476,7 +6342,7 @@ a.pa-card p {
 }
 .pa-list-basic--icon {
   list-style: none;
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 .pa-list-basic--icon li {
   display: flex;
@@ -6504,12 +6370,12 @@ a.pa-card p {
 
 .pa-list-ordered {
   margin: 0;
-  padding-left: 2.4rem;
+  padding-inline-start: 2.4rem;
 }
 .pa-list-ordered li {
   margin-bottom: 0.8rem;
   line-height: 1.6;
-  padding-left: 0.4rem;
+  padding-inline-start: 0.4rem;
 }
 .pa-list-ordered--roman {
   list-style-type: upper-roman;
@@ -6531,22 +6397,22 @@ a.pa-card p {
   margin-top: 0;
 }
 .pa-list-definition dd {
-  margin-left: 2.4rem;
+  margin-inline-start: 2.4rem;
   margin-bottom: 0.8rem;
   color: var(--pa-text-color-2);
   line-height: 1.6;
 }
 .pa-list-definition--inline dt {
   display: inline;
-  margin-right: 0.4rem;
+  margin-inline-end: 0.4rem;
 }
 .pa-list-definition--inline dt::after {
   content: ":";
 }
 .pa-list-definition--inline dd {
   display: inline;
-  margin-left: 0;
-  margin-right: 1.6rem;
+  margin-inline-start: 0;
+  margin-inline-end: 1.6rem;
 }
 .pa-list-definition--inline dd::after {
   content: "";
@@ -7456,14 +7322,14 @@ a.pa-card p {
   height: 4.1rem;
 }
 .pa-btn__icon {
-  margin-right: 0.8rem;
+  margin-inline-end: 0.8rem;
 }
 .pa-btn__icon:last-child {
-  margin-right: 0;
-  margin-left: 0.8rem;
+  margin-inline-end: 0;
+  margin-inline-start: 0.8rem;
 }
 .pa-btn:has(.pa-btn__icon) {
-  text-align: left;
+  text-align: start;
   display: inline-flex;
   align-items: center;
   gap: 0.8rem;
@@ -7484,13 +7350,13 @@ a.pa-card p {
   justify-content: flex-start;
 }
 .pa-btn--align-left .pa-btn__icon {
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 .pa-btn--align-right {
   justify-content: flex-end;
 }
 .pa-btn--align-right .pa-btn__icon {
-  padding-right: 0;
+  padding-inline-end: 0;
 }
 .pa-btn--align-center {
   justify-content: center;
@@ -7499,10 +7365,10 @@ a.pa-card p {
   justify-content: space-between;
 }
 .pa-btn--align-justify .pa-btn__icon:first-child {
-  padding-left: 0;
+  padding-inline-start: 0;
 }
 .pa-btn--align-justify > *:last-child {
-  padding-right: 0;
+  padding-inline-end: 0;
 }
 
 .pa-btn-group {
@@ -7848,7 +7714,7 @@ a.pa-card p {
 }
 .pa-tooltip--multiline::before {
   white-space: normal;
-  text-align: left;
+  text-align: start;
   width: 32rem;
   max-width: 32rem;
   line-height: 1.5;
@@ -8293,7 +8159,7 @@ a.pa-card p {
   font-size: 1.4rem;
   line-height: 1.5;
   color: var(--pa-text-color-1);
-  text-align: left;
+  text-align: start;
 }
 .pa-popover__body p {
   margin: 0 0 0.8rem 0;
@@ -8310,7 +8176,7 @@ a.pa-card p {
 }
 .pa-popover__body ul, .pa-popover__body ol {
   margin: 0.8rem 0;
-  padding-left: 2.4rem;
+  padding-inline-start: 2.4rem;
 }
 .pa-popover__body code {
   padding: 0.2rem 0.4rem;
@@ -8350,8 +8216,12 @@ a.pa-card p {
 .pa-popover--center .pa-popover__body {
   text-align: center;
 }
+.pa-popover--end .pa-popover__body {
+  text-align: end;
+}
+
 .pa-popover--right .pa-popover__body {
-  text-align: right;
+  text-align: end;
 }
 
 .pa-tooltip-floating {
@@ -8369,7 +8239,7 @@ a.pa-card p {
 }
 .pa-tooltip-floating.pa-tooltip--multiline {
   white-space: normal;
-  text-align: left;
+  text-align: start;
   max-width: 32rem;
 }
 .pa-tooltip-floating.pa-tooltip--primary {
@@ -8524,7 +8394,7 @@ a.pa-card p {
   font-size: 1.6rem;
 }
 .pa-alert--dismissible {
-  padding-right: 4.8rem;
+  padding-inline-end: 4.8rem;
 }
 .pa-alert__icon {
   flex-shrink: 0;
@@ -8542,7 +8412,7 @@ a.pa-card p {
 }
 .pa-alert__list {
   margin: 0.8rem 0;
-  padding-left: 2.4rem;
+  padding-inline-start: 2.4rem;
 }
 .pa-alert__actions {
   margin-top: 1.2rem;
@@ -8552,7 +8422,7 @@ a.pa-card p {
 .pa-alert__close {
   position: absolute;
   top: 0;
-  right: 0;
+  inset-inline-end: 0;
   z-index: 2px;
   padding: 1.2rem 1rem;
   background: none;
@@ -8605,7 +8475,7 @@ a.pa-card p {
   position: relative;
   padding: 1.2rem 1rem;
   margin-bottom: 1.6rem;
-  border-left: 0.4rem solid var(--pa-border-color);
+  border-inline-start: 0.4rem solid var(--pa-border-color);
   border-radius: 4px;
   font-size: 1.4rem;
   background-color: var(--pa-card-bg);
@@ -8617,27 +8487,27 @@ a.pa-card p {
   margin-bottom: 0;
 }
 .pa-callout--primary {
-  border-left-color: var(--pa-accent);
+  border-inline-start-color: var(--pa-accent);
   background-color: rgba(0, 123, 255, 0.08);
 }
 .pa-callout--secondary {
-  border-left-color: var(--pa-text-color-2);
+  border-inline-start-color: var(--pa-text-color-2);
   background-color: color-mix(in srgb, var(--pa-text-color-2) 5%, transparent);
 }
 .pa-callout--success {
-  border-left-color: var(--pa-success-bg);
+  border-inline-start-color: var(--pa-success-bg);
   background-color: var(--pa-success-bg-subtle);
 }
 .pa-callout--danger {
-  border-left-color: var(--pa-danger-bg);
+  border-inline-start-color: var(--pa-danger-bg);
   background-color: var(--pa-danger-bg-subtle);
 }
 .pa-callout--warning {
-  border-left-color: var(--pa-warning-bg);
+  border-inline-start-color: var(--pa-warning-bg);
   background-color: var(--pa-warning-bg-subtle);
 }
 .pa-callout--info {
-  border-left-color: var(--pa-info-bg);
+  border-inline-start-color: var(--pa-info-bg);
   background-color: var(--pa-info-bg-subtle);
 }
 .pa-callout--sm {
@@ -8650,7 +8520,12 @@ a.pa-card p {
 }
 .pa-callout__icon {
   float: left;
-  margin-right: 0.8rem;
+  margin-inline-end: 0.8rem;
+}
+[dir=rtl] .pa-callout__icon {
+  float: right;
+}
+.pa-callout__icon {
   font-size: 1.8rem;
   line-height: 1;
 }
@@ -8675,7 +8550,7 @@ a.pa-card p {
 }
 .pa-callout ul, .pa-callout ol {
   margin: 0.8rem 0;
-  padding-left: 2.4rem;
+  padding-inline-start: 2.4rem;
 }
 .pa-callout ul:last-child, .pa-callout ol:last-child {
   margin-bottom: 0;
@@ -9106,6 +8981,7 @@ a.pa-card p {
 /* ========================================
    Input Groups
    Input groups with prepend/append addons and buttons
+   RTL-aware using CSS logical properties
    ======================================== */
 .pa-input-group {
   display: flex;
@@ -9116,18 +8992,18 @@ a.pa-card p {
   flex: 1;
 }
 .pa-input-group .pa-input:first-child {
-  border-top-left-radius: 4px;
-  border-bottom-left-radius: 4px;
+  border-start-start-radius: 4px;
+  border-end-start-radius: 4px;
 }
 .pa-input-group .pa-input:last-child {
-  border-top-right-radius: 4px;
-  border-bottom-right-radius: 4px;
+  border-start-end-radius: 4px;
+  border-end-end-radius: 4px;
 }
 .pa-input-group .pa-input:not(:first-child) {
-  border-left: none;
+  border-inline-start: none;
 }
 .pa-input-group .pa-input:not(:last-child) {
-  border-right: none;
+  border-inline-end: none;
 }
 .pa-input-group__prepend, .pa-input-group__append {
   display: flex;
@@ -9144,50 +9020,50 @@ a.pa-card p {
   background-color: var(--pa-input-group-prepend-bg);
   color: var(--pa-input-group-prepend-text);
   border-color: var(--pa-input-group-prepend-bg);
-  border-right: none;
+  border-inline-end: none;
 }
 .pa-input-group__prepend:first-child {
-  border-top-left-radius: 4px;
-  border-bottom-left-radius: 4px;
+  border-start-start-radius: 4px;
+  border-end-start-radius: 4px;
 }
 .pa-input-group__append {
   background-color: var(--pa-input-group-append-bg);
   color: var(--pa-input-group-append-text);
   border-color: var(--pa-input-group-append-bg);
-  border-left: none;
+  border-inline-start: none;
 }
 .pa-input-group__append:last-child {
-  border-top-right-radius: 4px;
-  border-bottom-right-radius: 4px;
+  border-start-end-radius: 4px;
+  border-end-end-radius: 4px;
 }
 .pa-input-group__prepend + .pa-input-group__prepend {
-  border-left: 1px solid var(--pa-input-group-prepend-bg);
+  border-inline-start: 1px solid var(--pa-input-group-prepend-bg);
 }
 .pa-input-group__append + .pa-input-group__append {
-  border-left: 1px solid var(--pa-input-group-append-bg);
+  border-inline-start: 1px solid var(--pa-input-group-append-bg);
 }
 .pa-input-group:has(.pa-input:focus) .pa-input-group__prepend {
-  border-right: 1px solid var(--pa-input-focus-border-color);
+  border-inline-end: 1px solid var(--pa-input-focus-border-color);
 }
 .pa-input-group:has(.pa-input:focus) .pa-input-group__prepend:has(+ .pa-input-group__prepend) {
-  border-right: none;
+  border-inline-end: none;
 }
 .pa-input-group:has(.pa-input:focus) .pa-input-group__append {
-  border-left: 1px solid var(--pa-input-focus-border-color);
+  border-inline-start: 1px solid var(--pa-input-focus-border-color);
 }
 .pa-input-group:has(.pa-input:focus) .pa-input-group__append + .pa-input-group__append {
-  border-left: 1px solid var(--pa-border-color);
+  border-inline-start: 1px solid var(--pa-border-color);
 }
 .pa-input-group__button {
   border-radius: 0;
 }
 .pa-input-group__button:first-child {
-  border-top-left-radius: 4px;
-  border-bottom-left-radius: 4px;
+  border-start-start-radius: 4px;
+  border-end-start-radius: 4px;
 }
 .pa-input-group__button:last-child {
-  border-top-right-radius: 4px;
-  border-bottom-right-radius: 4px;
+  border-start-end-radius: 4px;
+  border-end-end-radius: 4px;
 }
 .pa-input-group--xs .pa-input-group__prepend,
 .pa-input-group--xs .pa-input-group__append {
@@ -9231,11 +9107,11 @@ a.pa-card p {
 .pa-input-wrapper .pa-virtual-textbox {
   flex: 1;
   min-width: 0;
-  padding-right: 4rem;
+  padding-inline-end: 4rem;
 }
 .pa-input-wrapper__clear {
   position: absolute;
-  right: 0.4rem;
+  inset-inline-end: 0.4rem;
   top: 50%;
   transform: translateY(-50%);
   background: transparent;
@@ -9277,7 +9153,7 @@ a.pa-card p {
 }
 
 .pa-search-token-remove {
-  margin-left: 0.4rem;
+  margin-inline-start: 0.4rem;
   padding: 0 0.4rem;
   border: none;
   background: transparent;
@@ -9368,7 +9244,7 @@ a.pa-card p {
   color: var(--pa-accent);
 }
 .pa-search-autocomplete__item-type {
-  margin-left: auto;
+  margin-inline-start: auto;
   font-size: 1.2rem;
   color: var(--pa-text-color-2);
   opacity: 0.7;
@@ -9833,7 +9709,7 @@ web-multiselect {
 }
 .pa-file-dropzone__drop-prompt-icon {
   display: inline-block;
-  margin-right: 0.4rem;
+  margin-inline-end: 0.4rem;
   font-size: 1.8rem;
 }
 .pa-file-dropzone__files-grid {
@@ -10067,7 +9943,7 @@ web-multiselect {
   z-index: 1;
 }
 .pa-file-popover__table th {
-  text-align: left;
+  text-align: start;
   padding: 0.4rem 0.8rem;
   border-bottom: 1px solid var(--pa-border-color);
   color: var(--pa-text-color-2);
@@ -10421,12 +10297,12 @@ web-multiselect {
   width: 100%;
 }
 .pa-checkbox-list__label .pa-checkbox {
-  margin-right: 1.2rem;
+  margin-inline-end: 1.2rem;
   gap: 0;
 }
 .pa-checkbox-list__checkbox {
   margin: 0;
-  margin-right: 1.2rem;
+  margin-inline-end: 1.2rem;
   width: 1.6rem;
   height: 1.6rem;
   cursor: pointer;
@@ -10443,7 +10319,7 @@ web-multiselect {
 }
 .pa-checkbox-list__actions {
   position: absolute;
-  right: 1.2rem;
+  inset-inline-end: 1.2rem;
   top: 50%;
   transform: translateY(-50%);
   display: flex;
@@ -10455,7 +10331,7 @@ web-multiselect {
   pointer-events: auto;
 }
 .pa-checkbox-list__item:has(.pa-checkbox-list__actions) .pa-checkbox-list__label {
-  padding-right: 6rem;
+  padding-inline-end: 6rem;
 }
 
 .pa-checkbox-list--compact .pa-checkbox-list__label {
@@ -10558,7 +10434,7 @@ web-multiselect {
   gap: 0;
 }
 .pa-checkbox-list--2col .pa-checkbox-list__item:nth-child(odd) {
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
 }
 
 .pa-checkbox-list--3col {
@@ -10567,7 +10443,7 @@ web-multiselect {
   gap: 0;
 }
 .pa-checkbox-list--3col .pa-checkbox-list__item:not(:nth-child(3n)) {
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
 }
 
 .pa-table .pa-table__checkbox-col {
@@ -10657,6 +10533,10 @@ web-multiselect {
 .pa-table-card:hover {
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }
+.pa-table-card:has(.pa-detail-view) .pa-table-card__body {
+  position: relative;
+  overflow: hidden;
+}
 .pa-table-card__header {
   padding: 0.5rem 1rem;
   min-height: 4rem;
@@ -10716,20 +10596,41 @@ web-multiselect {
 }
 .pa-table-card__body .pa-table th:first-child,
 .pa-table-card__body .pa-table td:first-child {
-  padding-left: 1rem;
+  padding-inline-start: 1rem;
 }
 .pa-table-card__body .pa-table th:last-child,
 .pa-table-card__body .pa-table td:last-child {
-  padding-right: 1rem;
+  padding-inline-end: 1rem;
 }
 .pa-table-card__body .pa-table tbody tr:last-child td {
   border-bottom: none;
 }
+.pa-table-card__body .pa-detail-view {
+  height: 100%;
+}
+.pa-table-card__body .pa-detail-view .pa-detail-view__main .pa-table {
+  border-radius: 0;
+}
+.pa-table-card__body .pa-detail-view .pa-detail-view__main .pa-table th:first-child,
+.pa-table-card__body .pa-detail-view .pa-detail-view__main .pa-table td:first-child {
+  padding-inline-start: 1rem;
+}
+.pa-table-card__body .pa-detail-view .pa-detail-view__main .pa-table th:last-child,
+.pa-table-card__body .pa-detail-view .pa-detail-view__main .pa-table td:last-child {
+  padding-inline-end: 1rem;
+}
+.pa-table-card__body .pa-detail-view .pa-detail-view__main .pa-table tbody tr:last-child td {
+  border-bottom: none;
+}
+.pa-table-card__body .pa-detail-view .pa-detail-view__main web-grid {
+  --wg-cell-padding-left: 1rem;
+  --wg-cell-padding-right: 1rem;
+}
 .pa-table-card__footer {
   padding: 1.2rem 1rem;
   border-top: 1px solid var(--pa-border-color);
-  border-bottom-left-radius: 8px;
-  border-bottom-right-radius: 8px;
+  border-end-start-radius: 8px;
+  border-end-end-radius: 8px;
   background: var(--pa-card-footer-bg);
   display: flex;
   justify-content: space-between;
@@ -10878,15 +10779,17 @@ web-multiselect {
   background: transparent;
   border-bottom: none;
   border-radius: 0;
-  padding-left: 0;
-  padding-right: 0;
+  padding-inline: 0;
+}
+.pa-table-card--plain .pa-table-card__body:has(.pa-detail-view--overlay) {
+  position: relative;
+  overflow: hidden;
 }
 .pa-table-card--plain .pa-table-card__footer {
   background: transparent;
   border-top: none;
   border-radius: 0;
-  padding-left: 0;
-  padding-right: 0;
+  padding-inline: 0;
 }
 
 .pa-table {
@@ -10898,7 +10801,7 @@ web-multiselect {
 .pa-table th,
 .pa-table td {
   padding: 0.8rem 0.8rem;
-  text-align: left;
+  text-align: start;
   border-bottom: 1px solid var(--pa-border-color);
   vertical-align: middle;
   line-height: 1.2;
@@ -11079,7 +10982,7 @@ web-multiselect {
 .pa-load-more__count {
   color: var(--pa-text-color-2);
   font-size: 1.2rem;
-  margin-left: 0.4rem;
+  margin-inline-start: 0.4rem;
 }
 
 .pa-virtual-table {
@@ -11105,13 +11008,13 @@ web-multiselect {
 .pa-virtual-table__header-cell {
   padding: 0.5rem 0.8rem;
   font-weight: 600;
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
   background: var(--pa-table-header-bg);
   color: var(--pa-text-color-1);
 }
 
 .pa-virtual-table__header-cell:last-child {
-  border-right: none;
+  border-inline-end: none;
 }
 
 .pa-virtual-table__body {
@@ -11135,7 +11038,7 @@ web-multiselect {
 
 .pa-virtual-table__cell {
   padding: 0.5rem 0.8rem;
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -11144,15 +11047,14 @@ web-multiselect {
 }
 
 .pa-virtual-table__cell:last-child {
-  border-right: none;
+  border-inline-end: none;
 }
 
 @media (max-width: 1024px) and (min-width: 769px) {
   .pa-table--responsive {
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
-    border-left: 1px solid var(--pa-border-color);
-    border-right: 1px solid var(--pa-border-color);
+    border-inline: 1px solid var(--pa-border-color);
   }
 }
 @media (max-width: 768px) {
@@ -11171,7 +11073,7 @@ web-multiselect {
   }
   .pa-table--responsive tbody td {
     display: block;
-    text-align: right;
+    text-align: end;
     padding: 1.2rem;
     position: relative;
     border-bottom: 1px solid var(--pa-border-color);
@@ -11182,14 +11084,14 @@ web-multiselect {
   .pa-table--responsive tbody td::before {
     content: attr(data-label);
     position: absolute;
-    left: 1.2rem;
+    inset-inline-start: 1.2rem;
     top: 1.2rem;
     font-weight: 600;
-    text-align: left;
+    text-align: start;
     width: 40%;
   }
   .pa-table--responsive tbody td {
-    padding-left: calc(40% + 2.4rem);
+    padding-inline-start: calc(40% + 2.4rem);
   }
   .pa-table--responsive .col-auto {
     width: auto;
@@ -11215,8 +11117,7 @@ web-multiselect {
     display: block;
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
-    border-left: 1px solid var(--pa-border-color);
-    border-right: 1px solid var(--pa-border-color);
+    border-inline: 1px solid var(--pa-border-color);
   }
 }
 @media (max-width: 768px) {
@@ -11304,7 +11205,7 @@ web-multiselect {
 .pa-comparison-table thead th {
   background-color: var(--pa-table-header-bg);
   font-weight: 600;
-  text-align: left;
+  text-align: start;
   padding: 0.8rem 1.6rem;
   border-bottom: 2px solid var(--pa-border-color);
 }
@@ -11350,7 +11251,7 @@ tbody tr:hover .pa-comparison-table__copy {
 .pa-comparison-table__changed::before {
   content: "";
   position: absolute;
-  left: 0;
+  inset-inline-start: 0;
   top: 0;
   bottom: 0;
   width: 2px;
@@ -11404,7 +11305,7 @@ tbody tr:hover .pa-comparison-table__copy {
   .pa-comparison-table tbody td::before {
     content: attr(data-label);
     font-weight: 600;
-    margin-right: 0.8rem;
+    margin-inline-end: 0.8rem;
     min-width: 120px;
   }
   .pa-comparison-table__label {
@@ -11448,43 +11349,43 @@ code {
 }
 .pa-code--numbered {
   counter-reset: line;
-  padding-left: 5.6rem;
+  padding-inline-start: 5.6rem;
   position: relative;
 }
 .pa-code--numbered::before {
   content: "";
   position: absolute;
-  left: 0;
+  inset-inline-start: 0;
   top: 0;
   bottom: 0;
   width: 4.4rem;
   background-color: rgba(0, 0, 0, 0.05);
-  border-right: 1px solid var(--pa-border-color);
+  border-inline-end: 1px solid var(--pa-border-color);
 }
 .pa-code--compact {
   padding: 0.8rem;
   font-size: 1.2rem;
 }
 .pa-code--json {
-  border-left: 2px solid #f59e0b;
+  border-inline-start: 2px solid #f59e0b;
 }
 .pa-code--javascript {
-  border-left: 2px solid #f0db4f;
+  border-inline-start: 2px solid #f0db4f;
 }
 .pa-code--html {
-  border-left: 2px solid #e34c26;
+  border-inline-start: 2px solid #e34c26;
 }
 .pa-code--css {
-  border-left: 2px solid #264de4;
+  border-inline-start: 2px solid #264de4;
 }
 .pa-code--bash {
-  border-left: 2px solid #4eaa25;
+  border-inline-start: 2px solid #4eaa25;
 }
 .pa-code--sql {
-  border-left: 2px solid #00758f;
+  border-inline-start: 2px solid #00758f;
 }
 .pa-code--python {
-  border-left: 2px solid #3776ab;
+  border-inline-start: 2px solid #3776ab;
 }
 
 .pa-code-block {
@@ -11651,7 +11552,7 @@ code {
 .pa-load-more__count {
   color: var(--pa-text-color-2);
   font-size: 1.2rem;
-  margin-left: 0.4rem;
+  margin-inline-start: 0.4rem;
 }
 
 /* ========================================
@@ -11697,7 +11598,7 @@ code {
 .pa-profile-panel {
   position: fixed;
   top: 0;
-  right: 0;
+  inset-inline-end: 0;
   height: 100vh;
   z-index: 5000;
   pointer-events: none;
@@ -11716,7 +11617,7 @@ code {
 .pa-profile-panel__overlay {
   position: absolute;
   top: 0;
-  left: 0;
+  inset-inline-start: 0;
   width: 100vw;
   height: 100vh;
   background-color: var(--pa-profile-overlay-bg);
@@ -11725,7 +11626,7 @@ code {
 .pa-profile-panel__content {
   position: absolute;
   top: 0;
-  right: 0;
+  inset-inline-end: 0;
   height: 100vh;
   background-color: var(--pa-card-bg);
   box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
@@ -11735,6 +11636,9 @@ code {
   flex-direction: column;
   overflow: hidden;
 }
+[dir=rtl] .pa-profile-panel__content {
+  transform: translateX(-100%);
+}
 .pa-profile-panel__header {
   padding: 2.4rem;
   background-color: var(--pa-header-bg);
@@ -11764,7 +11668,7 @@ code {
 .pa-profile-panel__info {
   flex: 1;
   min-width: 0;
-  padding-right: 3.2rem;
+  padding-inline-end: 3.2rem;
 }
 .pa-profile-panel__name {
   margin: 0 0 0.4rem 0;
@@ -11797,7 +11701,7 @@ code {
 .pa-profile-panel__close {
   position: absolute;
   top: 1.6rem;
-  right: 1.6rem;
+  inset-inline-end: 1.6rem;
   width: 3.2rem;
   height: 3.2rem;
   background: none;
@@ -11942,7 +11846,7 @@ code {
 }
 .pa-profile-panel__favorite-remove {
   opacity: 0;
-  margin-left: auto;
+  margin-inline-start: auto;
   background: none;
   border: none;
   padding: 0.4rem;
@@ -11980,10 +11884,7 @@ code {
    ======================================== */
 .pa-modal {
   position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
+  inset: 0;
   display: none;
   justify-content: center;
   align-items: center;
@@ -11999,10 +11900,7 @@ code {
 
 .pa-modal__backdrop {
   position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
+  inset: 0;
   background-color: var(--pa-modal-overlay-bg);
   z-index: 6000;
 }
@@ -12150,32 +12048,38 @@ code {
   flex-direction: column;
   gap: 1.2rem;
 }
-.pa-toast-container--top-right {
+.pa-toast-container--top-end {
   top: 2.4rem;
-  right: 2.4rem;
+  inset-inline-end: 2.4rem;
 }
-.pa-toast-container--top-left {
+.pa-toast-container--top-start {
   top: 2.4rem;
-  left: 2.4rem;
+  inset-inline-start: 2.4rem;
 }
-.pa-toast-container--bottom-right {
+.pa-toast-container--bottom-end {
   bottom: 2.4rem;
-  right: 2.4rem;
+  inset-inline-end: 2.4rem;
 }
-.pa-toast-container--bottom-left {
+.pa-toast-container--bottom-start {
   bottom: 2.4rem;
-  left: 2.4rem;
+  inset-inline-start: 2.4rem;
 }
 .pa-toast-container--top-center {
   top: 2.4rem;
-  left: 50%;
+  inset-inline-start: 50%;
   transform: translateX(-50%);
 }
+[dir=rtl] .pa-toast-container--top-center {
+  transform: translateX(50%);
+}
 .pa-toast-container--bottom-center {
   bottom: 2.4rem;
-  left: 50%;
+  inset-inline-start: 50%;
   transform: translateX(-50%);
 }
+[dir=rtl] .pa-toast-container--bottom-center {
+  transform: translateX(50%);
+}
 
 .pa-toast {
   background-color: var(--pa-card-bg);
@@ -12203,13 +12107,31 @@ code {
   opacity: 0;
   transform: translateX(100%);
 }
-.pa-toast-container--top-left .pa-toast, .pa-toast-container--bottom-left .pa-toast {
+.pa-toast-container--top-start .pa-toast, .pa-toast-container--bottom-start .pa-toast {
+  transform: translateX(-100%);
+}
+.pa-toast-container--top-start .pa-toast.pa-toast--show, .pa-toast-container--bottom-start .pa-toast.pa-toast--show {
+  transform: translateX(0);
+}
+.pa-toast-container--top-start .pa-toast.pa-toast--hide, .pa-toast-container--bottom-start .pa-toast.pa-toast--hide {
+  transform: translateX(-100%);
+}
+[dir=rtl] .pa-toast-container--top-start .pa-toast, [dir=rtl] .pa-toast-container--bottom-start .pa-toast {
+  transform: translateX(100%);
+}
+[dir=rtl] .pa-toast-container--top-start .pa-toast.pa-toast--show, [dir=rtl] .pa-toast-container--bottom-start .pa-toast.pa-toast--show {
+  transform: translateX(0);
+}
+[dir=rtl] .pa-toast-container--top-start .pa-toast.pa-toast--hide, [dir=rtl] .pa-toast-container--bottom-start .pa-toast.pa-toast--hide {
+  transform: translateX(100%);
+}
+[dir=rtl] .pa-toast-container--top-end .pa-toast, [dir=rtl] .pa-toast-container--bottom-end .pa-toast {
   transform: translateX(-100%);
 }
-.pa-toast-container--top-left .pa-toast.pa-toast--show, .pa-toast-container--bottom-left .pa-toast.pa-toast--show {
+[dir=rtl] .pa-toast-container--top-end .pa-toast.pa-toast--show, [dir=rtl] .pa-toast-container--bottom-end .pa-toast.pa-toast--show {
   transform: translateX(0);
 }
-.pa-toast-container--top-left .pa-toast.pa-toast--hide, .pa-toast-container--bottom-left .pa-toast.pa-toast--hide {
+[dir=rtl] .pa-toast-container--top-end .pa-toast.pa-toast--hide, [dir=rtl] .pa-toast-container--bottom-end .pa-toast.pa-toast--hide {
   transform: translateX(-100%);
 }
 .pa-toast-container--top-center .pa-toast, .pa-toast-container--bottom-center .pa-toast {
@@ -12281,7 +12203,7 @@ code {
 .pa-toast__progress {
   position: absolute;
   bottom: 0;
-  left: 0;
+  inset-inline-start: 0;
   height: 3px;
   background-color: currentColor;
   opacity: 0.3;
@@ -12345,14 +12267,13 @@ code {
 
 @media (max-width: 768px) {
   .pa-toast-container {
-    left: 1.2rem !important;
-    right: 1.2rem !important;
+    inset-inline: 1.2rem !important;
     transform: none !important;
   }
-  .pa-toast-container--top-right, .pa-toast-container--top-left, .pa-toast-container--top-center {
+  .pa-toast-container--top-end, .pa-toast-container--top-start, .pa-toast-container--top-center {
     top: 1.2rem;
   }
-  .pa-toast-container--bottom-right, .pa-toast-container--bottom-left, .pa-toast-container--bottom-center {
+  .pa-toast-container--bottom-end, .pa-toast-container--bottom-start, .pa-toast-container--bottom-center {
     bottom: 1.2rem;
   }
   .pa-toast {
@@ -12372,9 +12293,9 @@ code {
   position: relative;
 }
 .pa-timeline--simple {
-  border-left: 1px solid var(--pa-border-color);
-  margin-left: 10px;
-  padding-left: 20px;
+  border-inline-start: 1px solid var(--pa-border-color);
+  margin-inline-start: 10px;
+  padding-inline-start: 20px;
 }
 .pa-timeline--simple .pa-timeline__item {
   padding-bottom: 2.4rem;
@@ -12387,7 +12308,7 @@ code {
 .pa-timeline--simple .pa-timeline__item::before {
   content: "";
   position: absolute;
-  left: -30px;
+  inset-inline-start: -30px;
   top: 0;
   width: 15px;
   height: 15px;
@@ -12824,10 +12745,7 @@ code {
    ======================================== */
 .pa-command-palette {
   position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
+  inset: 0;
   z-index: 10500;
   display: none;
   align-items: flex-start;
@@ -12839,10 +12757,7 @@ code {
 }
 .pa-command-palette__backdrop {
   position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
+  inset: 0;
   background-color: var(--pa-command-palette-backdrop-bg);
   backdrop-filter: blur(4px);
   animation: fadeIn 0.15s ease;
@@ -12874,7 +12789,7 @@ code {
   margin: 0;
 }
 .pa-command-palette__tokens .pa-badge__remove {
-  margin-left: 0.4rem;
+  margin-inline-start: 0.4rem;
   padding: 0 0.4rem;
   border: none;
   background: transparent;
@@ -12910,7 +12825,7 @@ code {
 }
 .pa-command-palette__context {
   position: absolute;
-  right: calc(0.8rem + 0.8rem);
+  inset-inline-end: calc(0.8rem + 0.8rem);
   top: 50%;
   transform: translateY(-50%);
   font-size: 1.2rem;
@@ -12934,10 +12849,7 @@ code {
 .pa-command-palette__results--loading::after {
   content: "";
   position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
+  inset: 0;
   background-color: rgba(255, 255, 255, 0.7);
   pointer-events: none;
   z-index: 1;
@@ -13901,13 +13813,13 @@ code {
   min-width: 0;
   overflow: hidden;
   flex-shrink: 0;
-  border-left: 0 solid var(--pa-border-color);
+  border-inline-start: 0 solid var(--pa-border-color);
 }
 .pa-detail-view__panel--open {
   width: var(--pa-local-detail-panel-width);
   min-width: 28rem;
   max-width: var(--pa-local-detail-panel-max-width);
-  border-left-width: 1px;
+  border-inline-start-width: 1px;
   overflow: visible;
 }
 
@@ -13918,19 +13830,19 @@ code {
 .pa-detail-view--overlay .pa-detail-view__panel {
   position: absolute;
   top: 0;
-  right: 0;
+  inset-inline-end: 0;
   height: 100%;
-  z-index: 2;
+  z-index: 3501;
+}
+.pa-detail-view--overlay .pa-detail-view__panel--open {
+  max-width: 100%;
 }
 
 .pa-detail-view__overlay {
   position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
+  inset: 0;
   background-color: var(--pa-detail-panel-overlay-bg);
-  z-index: 1;
+  z-index: 3500;
   opacity: 0;
   visibility: hidden;
   cursor: pointer;
@@ -13942,9 +13854,7 @@ code {
 
 .pa-detail-panel--overlay {
   position: fixed;
-  top: 0;
-  right: 0;
-  height: 100vh;
+  inset: 0;
   z-index: var(--pa-detail-panel-z-index);
   pointer-events: none;
   opacity: 0;
@@ -13970,19 +13880,25 @@ code {
   position: absolute;
   top: 0;
   right: 0;
+  left: auto;
   height: 100vh;
   width: var(--pa-local-detail-panel-width);
   max-width: var(--pa-local-detail-panel-max-width);
   box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
   transform: translateX(100%);
 }
+[dir=rtl] .pa-detail-panel--overlay .pa-detail-panel__content {
+  right: auto;
+  left: 0;
+  transform: translateX(-100%);
+}
+[dir=rtl] .pa-detail-panel--overlay.pa-detail-panel--open .pa-detail-panel__content {
+  transform: translateX(0);
+}
 
 .pa-detail-panel__overlay {
   position: absolute;
-  top: 0;
-  left: 0;
-  width: 100vw;
-  height: 100vh;
+  inset: 0;
   background-color: var(--pa-detail-panel-overlay-bg);
   cursor: pointer;
 }
@@ -14069,7 +13985,7 @@ code {
 .pa-detail-panel-resize {
   position: absolute;
   top: 0;
-  left: 0;
+  inset-inline-start: 0;
   width: 6px;
   height: 100%;
   cursor: col-resize;
@@ -14099,9 +14015,7 @@ code {
   .pa-detail-panel--mobile-overlay {
     display: block;
     position: fixed;
-    top: 0;
-    right: 0;
-    height: 100vh;
+    inset: 0;
     z-index: var(--pa-detail-panel-z-index);
     pointer-events: none;
     opacity: 0;
@@ -14119,18 +14033,24 @@ code {
     position: absolute;
     top: 0;
     right: 0;
+    left: auto;
     height: 100vh;
     width: 90vw;
     max-width: none;
     box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
     transform: translateX(100%);
   }
+  [dir=rtl] .pa-detail-panel--mobile-overlay .pa-detail-panel__content {
+    right: auto;
+    left: 0;
+    transform: translateX(-100%);
+  }
+  [dir=rtl] .pa-detail-panel--mobile-overlay.pa-detail-panel--open .pa-detail-panel__content {
+    transform: translateX(0);
+  }
   .pa-detail-panel--mobile-overlay .pa-detail-panel__overlay {
     position: absolute;
-    top: 0;
-    left: 0;
-    width: 100vw;
-    height: 100vh;
+    inset: 0;
     background-color: var(--pa-detail-panel-overlay-bg);
     cursor: pointer;
   }
@@ -14141,22 +14061,25 @@ code {
    ======================================== */
 .pa-settings-panel {
   position: fixed;
-  right: -320px;
+  inset-inline-end: -320px;
   top: 15vh;
   z-index: 10000;
   width: 320px;
-  transition: right 0.3s ease;
+  transition: inset-inline-end 0.3s ease;
 }
 .pa-settings-panel__toggle {
   position: absolute;
-  right: 320px;
+  inset-inline-end: 320px;
   top: 0;
   width: 40px;
   height: 40px;
   background: #007bff;
   color: white;
   border: none;
-  border-radius: 4px 0 0 4px;
+  border-start-start-radius: 4px;
+  border-end-start-radius: 4px;
+  border-start-end-radius: 0;
+  border-end-end-radius: 0;
   cursor: pointer;
   font-size: 2rem;
   display: flex;
@@ -14168,13 +14091,16 @@ code {
 .pa-settings-panel__toggle:hover {
   background: rgba(0, 123, 255, 0.12);
   width: 45px;
-  right: 325px;
+  inset-inline-end: 325px;
 }
 .pa-settings-panel__content {
   background: var(--pa-subtle-bg);
   border: 1px solid var(--pa-border-color);
-  border-right: none;
-  border-radius: 4px 0 0 4px;
+  border-inline-end: none;
+  border-start-start-radius: 4px;
+  border-end-start-radius: 4px;
+  border-start-end-radius: 0;
+  border-end-end-radius: 0;
   box-shadow: -5px 0 20px rgba(0, 0, 0, 0.1);
   padding: 2.4rem;
   width: 100%;
@@ -14219,6 +14145,12 @@ code {
   border-color: #007bff;
   box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
 }
+.pa-settings-panel__hint {
+  display: block;
+  margin-top: 0.4rem;
+  color: var(--pa-text-color-3);
+  font-size: 1.2rem;
+}
 .pa-settings-panel__checkbox-group {
   display: flex;
   flex-direction: column;
@@ -14232,14 +14164,14 @@ code {
   font-size: 1.4rem;
 }
 .pa-settings-panel__checkbox input[type=checkbox] {
-  margin-right: 0.8rem;
+  margin-inline-end: 0.8rem;
   cursor: pointer;
 }
 .pa-settings-panel__checkbox:hover {
   color: #007bff;
 }
 .pa-settings-panel--open {
-  right: 0;
+  inset-inline-end: 0;
 }
 .pa-settings-panel--open .pa-settings-panel__toggle {
   background: rgba(0, 123, 255, 0.12);
@@ -14303,7 +14235,7 @@ code {
   content: "Click to copy";
   font-size: 1rem;
   opacity: 0;
-  margin-left: 0.8rem;
+  margin-inline-start: 0.8rem;
   transition: opacity 0.15s;
 }
 .pa-field--copy-click .pa-field__value:hover::after {
@@ -14363,8 +14295,8 @@ code {
   display: flex;
   flex-direction: column;
   gap: 1.6rem;
-  border-left: 3px solid #007bff;
-  padding-left: 1.6rem;
+  border-inline-start: 3px solid #007bff;
+  padding-inline-start: 1.6rem;
 }
 .pa-fields--cols-2, .pa-fields--cols-3, .pa-fields--cols-4 {
   display: grid;
@@ -14517,52 +14449,28 @@ code {
   background: color-mix(in srgb, var(--pa-color-9) 10%, transparent);
 }
 .pa-fields--no-border {
-  border-left: none;
-  padding-left: 0;
+  border-inline-start: none;
+  padding-inline-start: 0;
 }
 
 /* ========================================
    Utility Components
    Font utilities, compact mode, component showcase
    ======================================== */
-html.font-size-2xs {
-  font-size: 1rem;
-}
-
-html.font-size-xs {
-  font-size: 1.2rem;
-}
-
 html.font-size-small {
-  font-size: 1.4rem;
-}
-
-html.font-size-medium {
-  font-size: 1.5rem;
+  font-size: 9px;
 }
 
 html.font-size-default {
-  font-size: 1.6rem;
+  font-size: 10px;
 }
 
 html.font-size-large {
-  font-size: 1.8rem;
+  font-size: 11px;
 }
 
 html.font-size-xlarge {
-  font-size: 2rem;
-}
-
-html.font-size-2xl {
-  font-size: 2.4rem;
-}
-
-html.font-size-3xl {
-  font-size: 2.8rem;
-}
-
-html.font-size-4xl {
-  font-size: 3.2rem;
+  font-size: 12px;
 }
 
 .font-family-serif {
@@ -14715,6 +14623,62 @@ html.font-size-4xl {
   max-height: 50rem;
 }
 
+.h-full {
+  height: 100%;
+}
+
+.h-screen {
+  height: 100vh;
+}
+
+.min-h-full {
+  min-height: 100%;
+}
+
+.min-h-screen {
+  min-height: 100vh;
+}
+
+.max-h-full {
+  max-height: 100%;
+}
+
+.max-h-screen {
+  max-height: 100vh;
+}
+
+.flex-1 {
+  flex: 1 1 0%;
+}
+
+.flex-auto {
+  flex: 1 1 auto;
+}
+
+.flex-initial {
+  flex: 0 1 auto;
+}
+
+.flex-none {
+  flex: none;
+}
+
+.flex-grow {
+  flex-grow: 1;
+}
+
+.flex-grow-0 {
+  flex-grow: 0;
+}
+
+.flex-shrink {
+  flex-shrink: 1;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0;
+}
+
 .overflow-auto {
   overflow: auto;
 }
@@ -14750,6 +14714,10 @@ html.font-size-4xl {
   overflow-x: overlay;
 }
 
+.pa-scroll-lock {
+  overflow: hidden !important;
+}
+
 .cursor-pointer {
   cursor: pointer;
 }
@@ -14816,14 +14784,20 @@ html.font-size-4xl {
 .pa-text--secondary {
   color: var(--pa-text-color-2);
 }
-.pa-text--left {
-  text-align: left;
+.pa-text--start {
+  text-align: start;
 }
 .pa-text--center {
   text-align: center;
 }
+.pa-text--end {
+  text-align: end;
+}
+.pa-text--left {
+  text-align: start;
+}
 .pa-text--right {
-  text-align: right;
+  text-align: end;
 }
 .pa-text--caption {
   font-size: 1.2rem;
@@ -15195,3 +15169,159 @@ html.font-size-4xl {
 .pa-border-color-9 {
   border-color: var(--pa-color-9);
 }
+
+.ms-0 {
+  margin-inline-start: 0;
+}
+
+.ms-xs {
+  margin-inline-start: 0.4rem;
+}
+
+.ms-sm {
+  margin-inline-start: 0.8rem;
+}
+
+.ms-md {
+  margin-inline-start: 1.2rem;
+}
+
+.ms-base {
+  margin-inline-start: 1.6rem;
+}
+
+.ms-lg {
+  margin-inline-start: 2.4rem;
+}
+
+.ms-xl {
+  margin-inline-start: 3.2rem;
+}
+
+.ms-2xl {
+  margin-inline-start: 4.8rem;
+}
+
+.ms-auto {
+  margin-inline-start: auto;
+}
+
+.me-0 {
+  margin-inline-end: 0;
+}
+
+.me-xs {
+  margin-inline-end: 0.4rem;
+}
+
+.me-sm {
+  margin-inline-end: 0.8rem;
+}
+
+.me-md {
+  margin-inline-end: 1.2rem;
+}
+
+.me-base {
+  margin-inline-end: 1.6rem;
+}
+
+.me-lg {
+  margin-inline-end: 2.4rem;
+}
+
+.me-xl {
+  margin-inline-end: 3.2rem;
+}
+
+.me-2xl {
+  margin-inline-end: 4.8rem;
+}
+
+.me-auto {
+  margin-inline-end: auto;
+}
+
+.ps-0 {
+  padding-inline-start: 0;
+}
+
+.ps-xs {
+  padding-inline-start: 0.4rem;
+}
+
+.ps-sm {
+  padding-inline-start: 0.8rem;
+}
+
+.ps-md {
+  padding-inline-start: 1.2rem;
+}
+
+.ps-base {
+  padding-inline-start: 1.6rem;
+}
+
+.ps-lg {
+  padding-inline-start: 2.4rem;
+}
+
+.ps-xl {
+  padding-inline-start: 3.2rem;
+}
+
+.ps-2xl {
+  padding-inline-start: 4.8rem;
+}
+
+.pe-0 {
+  padding-inline-end: 0;
+}
+
+.pe-xs {
+  padding-inline-end: 0.4rem;
+}
+
+.pe-sm {
+  padding-inline-end: 0.8rem;
+}
+
+.pe-md {
+  padding-inline-end: 1.2rem;
+}
+
+.pe-base {
+  padding-inline-end: 1.6rem;
+}
+
+.pe-lg {
+  padding-inline-end: 2.4rem;
+}
+
+.pe-xl {
+  padding-inline-end: 3.2rem;
+}
+
+.pe-2xl {
+  padding-inline-end: 4.8rem;
+}
+
+.text-start {
+  text-align: start;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.text-end {
+  text-align: end;
+}
+
+.text-left {
+  text-align: start;
+}
+
+.text-right {
+  text-align: end;
+}