@keenmate/pure-admin-core 1.3.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/README.md +25 -1
  2. package/dist/css/main.css +766 -760
  3. package/package.json +1 -1
  4. package/src/scss/_core.scss +4 -0
  5. package/src/scss/_fonts.scss +1 -17
  6. package/src/scss/_rtl-helpers.scss +161 -0
  7. package/src/scss/core-components/_alerts.scss +3 -3
  8. package/src/scss/core-components/_base.scss +4 -3
  9. package/src/scss/core-components/_buttons.scss +9 -9
  10. package/src/scss/core-components/_callouts.scss +14 -9
  11. package/src/scss/core-components/_checkbox-lists.scss +6 -6
  12. package/src/scss/core-components/_code.scss +10 -10
  13. package/src/scss/core-components/_command-palette.scss +5 -14
  14. package/src/scss/core-components/_comparison.scss +3 -3
  15. package/src/scss/core-components/_data-display.scss +6 -6
  16. package/src/scss/core-components/_detail-panel.scss +36 -24
  17. package/src/scss/core-components/_file-selector.scss +2 -2
  18. package/src/scss/core-components/_grid.scss +13 -24
  19. package/src/scss/core-components/_lists.scss +12 -12
  20. package/src/scss/core-components/_modals.scss +2 -8
  21. package/src/scss/core-components/_pagers.scss +1 -1
  22. package/src/scss/core-components/_profile.scss +11 -6
  23. package/src/scss/core-components/_settings-panel.scss +22 -9
  24. package/src/scss/core-components/_tables.scss +26 -30
  25. package/src/scss/core-components/_tabs.scss +27 -14
  26. package/src/scss/core-components/_timeline.scss +5 -5
  27. package/src/scss/core-components/_toasts.scss +57 -21
  28. package/src/scss/core-components/_tooltips.scss +11 -6
  29. package/src/scss/core-components/_utilities.scss +56 -31
  30. package/src/scss/core-components/forms/_input-groups.scss +23 -22
  31. package/src/scss/core-components/forms/_input-wrapper.scss +3 -3
  32. package/src/scss/core-components/forms/_query-editor.scss +1 -1
  33. package/src/scss/core-components/layout/_layout-responsive.scss +3 -4
  34. package/src/scss/core-components/layout/_navbar-elements.scss +17 -6
  35. package/src/scss/core-components/layout/_navbar.scss +11 -22
  36. package/src/scss/core-components/layout/_sidebar-states.scss +25 -16
  37. package/src/scss/core-components/layout/_sidebar.scss +22 -16
package/dist/css/main.css CHANGED
@@ -2615,7 +2615,8 @@ p {
2615
2615
 
2616
2616
  ul, ol {
2617
2617
  margin: 0 0 1.6rem 0;
2618
- padding: 0 0 0 3.2rem;
2618
+ padding: 0;
2619
+ padding-inline-start: 3.2rem;
2619
2620
  }
2620
2621
  ul li, ol li {
2621
2622
  margin-bottom: 0.4rem;
@@ -2623,7 +2624,7 @@ ul li, ol li {
2623
2624
 
2624
2625
  ul.unstyled, ol.unstyled {
2625
2626
  list-style: none;
2626
- padding-left: 0;
2627
+ padding-inline-start: 0;
2627
2628
  }
2628
2629
  ul.unstyled li, ol.unstyled li {
2629
2630
  margin-bottom: 0;
@@ -2641,7 +2642,7 @@ dd {
2641
2642
 
2642
2643
  blockquote {
2643
2644
  margin: 1.6rem 0 1.6rem 0;
2644
- padding: 0 0 0 2.4rem;
2645
+ padding-inline-start: 2.4rem;
2645
2646
  }
2646
2647
 
2647
2648
  pre {
@@ -2741,8 +2742,7 @@ label {
2741
2742
  .pa-navbar {
2742
2743
  position: fixed;
2743
2744
  top: 0;
2744
- left: 0;
2745
- right: 0;
2745
+ inset-inline: 0;
2746
2746
  height: 4.8rem;
2747
2747
  background-color: var(--pa-header-bg);
2748
2748
  border-bottom: 1px solid var(--pa-header-border-color);
@@ -2754,42 +2754,32 @@ label {
2754
2754
 
2755
2755
  body.pa-container-sm .pa-navbar {
2756
2756
  max-width: 76.8rem;
2757
- left: 0;
2758
- right: 0;
2759
- margin-left: auto;
2760
- margin-right: auto;
2757
+ inset-inline: 0;
2758
+ margin-inline: auto;
2761
2759
  }
2762
2760
 
2763
2761
  body.pa-container-md .pa-navbar {
2764
2762
  max-width: 102.4rem;
2765
- left: 0;
2766
- right: 0;
2767
- margin-left: auto;
2768
- margin-right: auto;
2763
+ inset-inline: 0;
2764
+ margin-inline: auto;
2769
2765
  }
2770
2766
 
2771
2767
  body.pa-container-lg .pa-navbar {
2772
2768
  max-width: 128rem;
2773
- left: 0;
2774
- right: 0;
2775
- margin-left: auto;
2776
- margin-right: auto;
2769
+ inset-inline: 0;
2770
+ margin-inline: auto;
2777
2771
  }
2778
2772
 
2779
2773
  body.pa-container-xl .pa-navbar {
2780
2774
  max-width: 160rem;
2781
- left: 0;
2782
- right: 0;
2783
- margin-left: auto;
2784
- margin-right: auto;
2775
+ inset-inline: 0;
2776
+ margin-inline: auto;
2785
2777
  }
2786
2778
 
2787
2779
  body.pa-container-2xl .pa-navbar {
2788
2780
  max-width: 192rem;
2789
- left: 0;
2790
- right: 0;
2791
- margin-left: auto;
2792
- margin-right: auto;
2781
+ inset-inline: 0;
2782
+ margin-inline: auto;
2793
2783
  }
2794
2784
 
2795
2785
  .pa-navbar__inner {
@@ -2985,7 +2975,7 @@ body.pa-layout--sticky .pa-layout__inner {
2985
2975
 
2986
2976
  .pa-layout__sidebar {
2987
2977
  background-color: var(--pa-sidebar-bg);
2988
- border-right: 1px solid var(--pa-border-color);
2978
+ border-inline-end: 1px solid var(--pa-border-color);
2989
2979
  flex-shrink: 0;
2990
2980
  position: relative;
2991
2981
  }
@@ -2993,7 +2983,7 @@ body.pa-layout--sticky .pa-layout__inner {
2993
2983
  .pa-sidebar-resize {
2994
2984
  position: absolute;
2995
2985
  top: 0;
2996
- right: 0;
2986
+ inset-inline-end: 0;
2997
2987
  width: 6px;
2998
2988
  height: 100%;
2999
2989
  cursor: ew-resize;
@@ -3003,7 +2993,7 @@ body.pa-layout--sticky .pa-layout__inner {
3003
2993
  content: "";
3004
2994
  position: absolute;
3005
2995
  top: 0;
3006
- left: 50%;
2996
+ inset-inline-start: 50%;
3007
2997
  transform: translateX(-50%);
3008
2998
  width: 2px;
3009
2999
  height: 100%;
@@ -3044,7 +3034,7 @@ body.pa-layout--sticky .pa-layout__sidebar {
3044
3034
  color: var(--pa-sidebar-text-secondary);
3045
3035
  text-decoration: none;
3046
3036
  font-weight: 500;
3047
- border-right: 3px solid transparent;
3037
+ border-inline-end: 3px solid transparent;
3048
3038
  }
3049
3039
  body.loaded .pa-sidebar__link {
3050
3040
  transition: all 0.1s ease-out;
@@ -3056,7 +3046,7 @@ body.loaded .pa-sidebar__link {
3056
3046
  .pa-sidebar__link--active {
3057
3047
  color: var(--pa-sidebar-text);
3058
3048
  background-color: var(--pa-accent-hover);
3059
- border-right-color: var(--pa-accent);
3049
+ border-inline-end-color: var(--pa-accent);
3060
3050
  font-weight: 600;
3061
3051
  }
3062
3052
  .pa-sidebar__toggle {
@@ -3068,7 +3058,7 @@ body.loaded .pa-sidebar__link {
3068
3058
  background: none;
3069
3059
  border: none;
3070
3060
  width: 100%;
3071
- text-align: left;
3061
+ text-align: start;
3072
3062
  font-weight: 500;
3073
3063
  cursor: pointer;
3074
3064
  }
@@ -3115,31 +3105,31 @@ body.loaded .pa-sidebar__label {
3115
3105
  display: block;
3116
3106
  }
3117
3107
  .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link {
3118
- padding-left: 4rem;
3108
+ padding-inline-start: 4rem;
3119
3109
  font-size: 1.5rem;
3120
- border-right: 2px solid transparent;
3110
+ border-inline-end: 2px solid transparent;
3121
3111
  }
3122
3112
  .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link:hover {
3123
3113
  background-color: var(--pa-sidebar-submenu-hover-bg);
3124
3114
  }
3125
3115
  .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link--active {
3126
3116
  background-color: var(--pa-sidebar-submenu-active-bg);
3127
- border-right-color: var(--pa-accent);
3117
+ border-inline-end-color: var(--pa-accent);
3128
3118
  }
3129
3119
  .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__toggle {
3130
- padding-left: 4rem;
3120
+ padding-inline-start: 4rem;
3131
3121
  font-size: 1.5rem;
3132
3122
  }
3133
3123
  .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link {
3134
- padding-left: 5.2rem;
3124
+ padding-inline-start: 5.2rem;
3135
3125
  font-size: 1.4rem;
3136
- border-right: 1px solid transparent;
3126
+ border-inline-end: 1px solid transparent;
3137
3127
  }
3138
3128
  .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link--active {
3139
- border-right-color: var(--pa-accent);
3129
+ border-inline-end-color: var(--pa-accent);
3140
3130
  }
3141
3131
  .pa-sidebar__chevron {
3142
- margin-left: auto;
3132
+ margin-inline-start: auto;
3143
3133
  font-size: 1.2rem;
3144
3134
  }
3145
3135
  body.loaded .pa-sidebar__chevron {
@@ -3148,6 +3138,9 @@ body.loaded .pa-sidebar__chevron {
3148
3138
  .pa-sidebar__item--open .pa-sidebar__chevron {
3149
3139
  transform: rotate(90deg);
3150
3140
  }
3141
+ [dir=rtl] .pa-sidebar__item--open .pa-sidebar__chevron {
3142
+ transform: rotate(-90deg);
3143
+ }
3151
3144
 
3152
3145
  /* ========================================
3153
3146
  Sidebar States
@@ -3157,14 +3150,14 @@ body.loaded .pa-sidebar__chevron {
3157
3150
  width: 0;
3158
3151
  opacity: 0;
3159
3152
  overflow: hidden;
3160
- border-right: none;
3153
+ border-inline-end: none;
3161
3154
  }
3162
3155
  .sidebar-hidden .pa-layout__sidebar--icon-collapse {
3163
3156
  width: 6.4rem;
3164
3157
  opacity: 1;
3165
3158
  overflow: visible !important;
3166
3159
  z-index: 1050;
3167
- border-right: 1px solid #e1e5e9;
3160
+ border-inline-end: 1px solid #e1e5e9;
3168
3161
  }
3169
3162
  .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__item {
3170
3163
  position: relative;
@@ -3196,14 +3189,17 @@ body.loaded .pa-sidebar__chevron {
3196
3189
  width: auto;
3197
3190
  overflow: visible;
3198
3191
  position: absolute;
3199
- left: 100%;
3192
+ inset-inline-start: 100%;
3200
3193
  top: 0;
3201
3194
  bottom: 0;
3202
3195
  padding: 0.8rem 1.6rem;
3203
3196
  background-color: var(--pa-sidebar-bg);
3204
3197
  border: 1px solid var(--pa-border-color);
3205
- border-left: none;
3206
- border-radius: 0 4px 4px 0;
3198
+ border-inline-start: none;
3199
+ border-start-start-radius: 0;
3200
+ border-start-end-radius: 4px;
3201
+ border-end-end-radius: 4px;
3202
+ border-end-start-radius: 0;
3207
3203
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
3208
3204
  white-space: nowrap;
3209
3205
  z-index: 10;
@@ -3216,7 +3212,7 @@ body.loaded .pa-sidebar__chevron {
3216
3212
  max-height: none !important;
3217
3213
  overflow: visible !important;
3218
3214
  position: absolute;
3219
- left: 100%;
3215
+ inset-inline-start: 100%;
3220
3216
  top: 0;
3221
3217
  min-width: 12rem;
3222
3218
  margin: 0;
@@ -3224,8 +3220,11 @@ body.loaded .pa-sidebar__chevron {
3224
3220
  list-style: none;
3225
3221
  background-color: var(--pa-sidebar-submenu-bg);
3226
3222
  border: 1px solid var(--pa-border-color);
3227
- border-left: none;
3228
- border-radius: 0 4px 4px 0;
3223
+ border-inline-start: none;
3224
+ border-start-start-radius: 0;
3225
+ border-start-end-radius: 4px;
3226
+ border-end-end-radius: 4px;
3227
+ border-end-start-radius: 0;
3229
3228
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
3230
3229
  z-index: 1001;
3231
3230
  }
@@ -3274,7 +3273,7 @@ body.loaded .pa-sidebar__chevron {
3274
3273
  .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__item:hover > .pa-sidebar__submenu .pa-sidebar__chevron,
3275
3274
  .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu:hover .pa-sidebar__chevron {
3276
3275
  display: inline;
3277
- margin-left: auto;
3276
+ margin-inline-start: auto;
3278
3277
  transform: none !important;
3279
3278
  }
3280
3279
  .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 {
3289
3288
  max-height: none !important;
3290
3289
  overflow: visible !important;
3291
3290
  position: absolute;
3292
- left: 100%;
3291
+ inset-inline-start: 100%;
3293
3292
  top: 0;
3294
3293
  min-width: 19.2rem;
3295
3294
  margin: 0;
@@ -3297,8 +3296,11 @@ body.loaded .pa-sidebar__chevron {
3297
3296
  list-style: none;
3298
3297
  background-color: var(--pa-sidebar-submenu-bg);
3299
3298
  border: 1px solid var(--pa-border-color);
3300
- border-left: none;
3301
- border-radius: 0 4px 4px 0;
3299
+ border-inline-start: none;
3300
+ border-start-start-radius: 0;
3301
+ border-start-end-radius: 4px;
3302
+ border-end-end-radius: 4px;
3303
+ border-end-start-radius: 0;
3302
3304
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
3303
3305
  z-index: 1002;
3304
3306
  }
@@ -3337,11 +3339,11 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__toggle
3337
3339
  }
3338
3340
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link,
3339
3341
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__toggle {
3340
- padding-left: 4rem;
3342
+ padding-inline-start: 4rem;
3341
3343
  }
3342
3344
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__link,
3343
3345
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__submenu .pa-sidebar__submenu > .pa-sidebar__item > .pa-sidebar__toggle {
3344
- padding-left: 5.2rem;
3346
+ padding-inline-start: 5.2rem;
3345
3347
  }
3346
3348
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3347
3349
  width: 2.4rem;
@@ -3353,11 +3355,11 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3353
3355
  ======================================== */
3354
3356
  .pa-header__burger {
3355
3357
  flex-shrink: 0;
3356
- margin-left: 0.3rem;
3358
+ margin-inline-start: 0.3rem;
3357
3359
  }
3358
3360
  .pa-header__brand {
3359
3361
  flex-shrink: 0;
3360
- padding-left: 2.1rem;
3362
+ padding-inline-start: 2.1rem;
3361
3363
  }
3362
3364
  .pa-header__brand h1 {
3363
3365
  margin: 0;
@@ -3412,7 +3414,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3412
3414
  display: none !important;
3413
3415
  position: absolute;
3414
3416
  top: 100%;
3415
- left: 0;
3417
+ inset-inline-start: 0;
3416
3418
  min-width: 19.2rem;
3417
3419
  background-color: var(--pa-card-bg);
3418
3420
  border: 1px solid var(--pa-border-color);
@@ -3433,7 +3435,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3433
3435
  content: "";
3434
3436
  position: absolute;
3435
3437
  top: 0;
3436
- left: 100%;
3438
+ inset-inline-start: 100%;
3437
3439
  width: 6.4px;
3438
3440
  height: 100%;
3439
3441
  z-index: 1099;
@@ -3457,9 +3459,9 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3457
3459
  }
3458
3460
  .pa-header__dropdown--level2 {
3459
3461
  top: 0;
3460
- left: 100%;
3462
+ inset-inline-start: 100%;
3461
3463
  margin-top: 0;
3462
- margin-left: 0;
3464
+ margin-inline-start: 0;
3463
3465
  }
3464
3466
  .pa-header__title {
3465
3467
  flex: 1;
@@ -3507,6 +3509,12 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3507
3509
  .burger-menu.active span:nth-child(3) {
3508
3510
  transform: rotate(-45deg) translate(3px, -3px);
3509
3511
  }
3512
+ [dir=rtl] .burger-menu.active span:nth-child(1) {
3513
+ transform: rotate(45deg) translate(-3px, 3px);
3514
+ }
3515
+ [dir=rtl] .burger-menu.active span:nth-child(3) {
3516
+ transform: rotate(-45deg) translate(-3px, -3px);
3517
+ }
3510
3518
  .burger-menu:hover span {
3511
3519
  background-color: var(--pa-accent);
3512
3520
  }
@@ -3542,7 +3550,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3542
3550
  width: 0;
3543
3551
  opacity: 0;
3544
3552
  overflow: hidden;
3545
- border-right: none;
3553
+ border-inline-end: none;
3546
3554
  }
3547
3555
  body:not(.sidebar-visible) .pa-layout__sidebar--icon-collapse {
3548
3556
  width: 0 !important;
@@ -3553,7 +3561,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3553
3561
  .sidebar-visible .pa-layout__sidebar {
3554
3562
  position: fixed;
3555
3563
  top: 4.8rem;
3556
- left: 0;
3564
+ inset-inline-start: 0;
3557
3565
  bottom: 0;
3558
3566
  width: 90vw;
3559
3567
  z-index: 1050;
@@ -3575,8 +3583,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3575
3583
  content: "";
3576
3584
  position: fixed;
3577
3585
  top: 4.8rem;
3578
- left: 0;
3579
- right: 0;
3586
+ inset-inline: 0;
3580
3587
  bottom: 0;
3581
3588
  background-color: rgba(0, 0, 0, 0.5);
3582
3589
  z-index: 1040;
@@ -3606,21 +3613,17 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3606
3613
  .pa-row {
3607
3614
  display: flex;
3608
3615
  flex-wrap: wrap;
3609
- margin-left: -0.8rem;
3610
- margin-right: -0.8rem;
3616
+ margin-inline: -0.8rem;
3611
3617
  }
3612
3618
  .pa-row .pa-row {
3613
- margin-left: 0;
3614
- margin-right: 0;
3619
+ margin-inline: 0;
3615
3620
  }
3616
3621
 
3617
3622
  .pa-row--no-gutter {
3618
- margin-left: 0;
3619
- margin-right: 0;
3623
+ margin-inline: 0;
3620
3624
  }
3621
3625
  .pa-row--no-gutter > [class*=pa-col] {
3622
- padding-left: 0;
3623
- padding-right: 0;
3626
+ padding-inline: 0;
3624
3627
  }
3625
3628
 
3626
3629
  .pa-row--center {
@@ -3661,676 +3664,604 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
3661
3664
 
3662
3665
  .pa-col {
3663
3666
  flex: 1;
3664
- padding-left: 0.8rem;
3665
- padding-right: 0.8rem;
3667
+ padding-inline: 0.8rem;
3666
3668
  min-width: 0;
3667
3669
  }
3668
3670
 
3669
3671
  .pa-col-auto {
3670
3672
  flex: 0 0 auto;
3671
3673
  width: auto;
3672
- padding-left: 0.8rem;
3673
- padding-right: 0.8rem;
3674
+ padding-inline: 0.8rem;
3674
3675
  }
3675
3676
 
3676
3677
  .pa-col-5 {
3677
3678
  flex: 0 0 5%;
3678
3679
  max-width: 5%;
3679
- padding-left: 0.8rem;
3680
- padding-right: 0.8rem;
3680
+ padding-inline: 0.8rem;
3681
3681
  min-width: 0;
3682
3682
  }
3683
3683
 
3684
3684
  .pa-col-10 {
3685
3685
  flex: 0 0 10%;
3686
3686
  max-width: 10%;
3687
- padding-left: 0.8rem;
3688
- padding-right: 0.8rem;
3687
+ padding-inline: 0.8rem;
3689
3688
  min-width: 0;
3690
3689
  }
3691
3690
 
3692
3691
  .pa-col-15 {
3693
3692
  flex: 0 0 15%;
3694
3693
  max-width: 15%;
3695
- padding-left: 0.8rem;
3696
- padding-right: 0.8rem;
3694
+ padding-inline: 0.8rem;
3697
3695
  min-width: 0;
3698
3696
  }
3699
3697
 
3700
3698
  .pa-col-20 {
3701
3699
  flex: 0 0 20%;
3702
3700
  max-width: 20%;
3703
- padding-left: 0.8rem;
3704
- padding-right: 0.8rem;
3701
+ padding-inline: 0.8rem;
3705
3702
  min-width: 0;
3706
3703
  }
3707
3704
 
3708
3705
  .pa-col-25 {
3709
3706
  flex: 0 0 25%;
3710
3707
  max-width: 25%;
3711
- padding-left: 0.8rem;
3712
- padding-right: 0.8rem;
3708
+ padding-inline: 0.8rem;
3713
3709
  min-width: 0;
3714
3710
  }
3715
3711
 
3716
3712
  .pa-col-30 {
3717
3713
  flex: 0 0 30%;
3718
3714
  max-width: 30%;
3719
- padding-left: 0.8rem;
3720
- padding-right: 0.8rem;
3715
+ padding-inline: 0.8rem;
3721
3716
  min-width: 0;
3722
3717
  }
3723
3718
 
3724
3719
  .pa-col-35 {
3725
3720
  flex: 0 0 35%;
3726
3721
  max-width: 35%;
3727
- padding-left: 0.8rem;
3728
- padding-right: 0.8rem;
3722
+ padding-inline: 0.8rem;
3729
3723
  min-width: 0;
3730
3724
  }
3731
3725
 
3732
3726
  .pa-col-40 {
3733
3727
  flex: 0 0 40%;
3734
3728
  max-width: 40%;
3735
- padding-left: 0.8rem;
3736
- padding-right: 0.8rem;
3729
+ padding-inline: 0.8rem;
3737
3730
  min-width: 0;
3738
3731
  }
3739
3732
 
3740
3733
  .pa-col-45 {
3741
3734
  flex: 0 0 45%;
3742
3735
  max-width: 45%;
3743
- padding-left: 0.8rem;
3744
- padding-right: 0.8rem;
3736
+ padding-inline: 0.8rem;
3745
3737
  min-width: 0;
3746
3738
  }
3747
3739
 
3748
3740
  .pa-col-50 {
3749
3741
  flex: 0 0 50%;
3750
3742
  max-width: 50%;
3751
- padding-left: 0.8rem;
3752
- padding-right: 0.8rem;
3743
+ padding-inline: 0.8rem;
3753
3744
  min-width: 0;
3754
3745
  }
3755
3746
 
3756
3747
  .pa-col-55 {
3757
3748
  flex: 0 0 55%;
3758
3749
  max-width: 55%;
3759
- padding-left: 0.8rem;
3760
- padding-right: 0.8rem;
3750
+ padding-inline: 0.8rem;
3761
3751
  min-width: 0;
3762
3752
  }
3763
3753
 
3764
3754
  .pa-col-60 {
3765
3755
  flex: 0 0 60%;
3766
3756
  max-width: 60%;
3767
- padding-left: 0.8rem;
3768
- padding-right: 0.8rem;
3757
+ padding-inline: 0.8rem;
3769
3758
  min-width: 0;
3770
3759
  }
3771
3760
 
3772
3761
  .pa-col-65 {
3773
3762
  flex: 0 0 65%;
3774
3763
  max-width: 65%;
3775
- padding-left: 0.8rem;
3776
- padding-right: 0.8rem;
3764
+ padding-inline: 0.8rem;
3777
3765
  min-width: 0;
3778
3766
  }
3779
3767
 
3780
3768
  .pa-col-70 {
3781
3769
  flex: 0 0 70%;
3782
3770
  max-width: 70%;
3783
- padding-left: 0.8rem;
3784
- padding-right: 0.8rem;
3771
+ padding-inline: 0.8rem;
3785
3772
  min-width: 0;
3786
3773
  }
3787
3774
 
3788
3775
  .pa-col-75 {
3789
3776
  flex: 0 0 75%;
3790
3777
  max-width: 75%;
3791
- padding-left: 0.8rem;
3792
- padding-right: 0.8rem;
3778
+ padding-inline: 0.8rem;
3793
3779
  min-width: 0;
3794
3780
  }
3795
3781
 
3796
3782
  .pa-col-80 {
3797
3783
  flex: 0 0 80%;
3798
3784
  max-width: 80%;
3799
- padding-left: 0.8rem;
3800
- padding-right: 0.8rem;
3785
+ padding-inline: 0.8rem;
3801
3786
  min-width: 0;
3802
3787
  }
3803
3788
 
3804
3789
  .pa-col-85 {
3805
3790
  flex: 0 0 85%;
3806
3791
  max-width: 85%;
3807
- padding-left: 0.8rem;
3808
- padding-right: 0.8rem;
3792
+ padding-inline: 0.8rem;
3809
3793
  min-width: 0;
3810
3794
  }
3811
3795
 
3812
3796
  .pa-col-90 {
3813
3797
  flex: 0 0 90%;
3814
3798
  max-width: 90%;
3815
- padding-left: 0.8rem;
3816
- padding-right: 0.8rem;
3799
+ padding-inline: 0.8rem;
3817
3800
  min-width: 0;
3818
3801
  }
3819
3802
 
3820
3803
  .pa-col-95 {
3821
3804
  flex: 0 0 95%;
3822
3805
  max-width: 95%;
3823
- padding-left: 0.8rem;
3824
- padding-right: 0.8rem;
3806
+ padding-inline: 0.8rem;
3825
3807
  min-width: 0;
3826
3808
  }
3827
3809
 
3828
3810
  .pa-col-100 {
3829
3811
  flex: 0 0 100%;
3830
3812
  max-width: 100%;
3831
- padding-left: 0.8rem;
3832
- padding-right: 0.8rem;
3813
+ padding-inline: 0.8rem;
3833
3814
  min-width: 0;
3834
3815
  }
3835
3816
 
3836
3817
  .pa-col-1-2 {
3837
3818
  flex: 0 0 50%;
3838
3819
  max-width: 50%;
3839
- padding-left: 0.8rem;
3840
- padding-right: 0.8rem;
3820
+ padding-inline: 0.8rem;
3841
3821
  min-width: 0;
3842
3822
  }
3843
3823
 
3844
3824
  .pa-col-1-3 {
3845
3825
  flex: 0 0 33.333%;
3846
3826
  max-width: 33.333%;
3847
- padding-left: 0.8rem;
3848
- padding-right: 0.8rem;
3827
+ padding-inline: 0.8rem;
3849
3828
  min-width: 0;
3850
3829
  }
3851
3830
 
3852
3831
  .pa-col-2-3 {
3853
3832
  flex: 0 0 66.667%;
3854
3833
  max-width: 66.667%;
3855
- padding-left: 0.8rem;
3856
- padding-right: 0.8rem;
3834
+ padding-inline: 0.8rem;
3857
3835
  min-width: 0;
3858
3836
  }
3859
3837
 
3860
3838
  .pa-col-1-4 {
3861
3839
  flex: 0 0 25%;
3862
3840
  max-width: 25%;
3863
- padding-left: 0.8rem;
3864
- padding-right: 0.8rem;
3841
+ padding-inline: 0.8rem;
3865
3842
  min-width: 0;
3866
3843
  }
3867
3844
 
3868
3845
  .pa-col-3-4 {
3869
3846
  flex: 0 0 75%;
3870
3847
  max-width: 75%;
3871
- padding-left: 0.8rem;
3872
- padding-right: 0.8rem;
3848
+ padding-inline: 0.8rem;
3873
3849
  min-width: 0;
3874
3850
  }
3875
3851
 
3876
3852
  .pa-col-1-5 {
3877
3853
  flex: 0 0 20%;
3878
3854
  max-width: 20%;
3879
- padding-left: 0.8rem;
3880
- padding-right: 0.8rem;
3855
+ padding-inline: 0.8rem;
3881
3856
  min-width: 0;
3882
3857
  }
3883
3858
 
3884
3859
  .pa-col-2-5 {
3885
3860
  flex: 0 0 40%;
3886
3861
  max-width: 40%;
3887
- padding-left: 0.8rem;
3888
- padding-right: 0.8rem;
3862
+ padding-inline: 0.8rem;
3889
3863
  min-width: 0;
3890
3864
  }
3891
3865
 
3892
3866
  .pa-col-3-5 {
3893
3867
  flex: 0 0 60%;
3894
3868
  max-width: 60%;
3895
- padding-left: 0.8rem;
3896
- padding-right: 0.8rem;
3869
+ padding-inline: 0.8rem;
3897
3870
  min-width: 0;
3898
3871
  }
3899
3872
 
3900
3873
  .pa-col-4-5 {
3901
3874
  flex: 0 0 80%;
3902
3875
  max-width: 80%;
3903
- padding-left: 0.8rem;
3904
- padding-right: 0.8rem;
3876
+ padding-inline: 0.8rem;
3905
3877
  min-width: 0;
3906
3878
  }
3907
3879
 
3908
3880
  .pa-col-1-6 {
3909
3881
  flex: 0 0 16.667%;
3910
3882
  max-width: 16.667%;
3911
- padding-left: 0.8rem;
3912
- padding-right: 0.8rem;
3883
+ padding-inline: 0.8rem;
3913
3884
  min-width: 0;
3914
3885
  }
3915
3886
 
3916
3887
  .pa-col-5-6 {
3917
3888
  flex: 0 0 83.333%;
3918
3889
  max-width: 83.333%;
3919
- padding-left: 0.8rem;
3920
- padding-right: 0.8rem;
3890
+ padding-inline: 0.8rem;
3921
3891
  min-width: 0;
3922
3892
  }
3923
3893
 
3924
3894
  .pa-col-1-12 {
3925
3895
  flex: 0 0 8.333%;
3926
3896
  max-width: 8.333%;
3927
- padding-left: 0.8rem;
3928
- padding-right: 0.8rem;
3897
+ padding-inline: 0.8rem;
3929
3898
  min-width: 0;
3930
3899
  }
3931
3900
 
3932
3901
  .pa-col-5-12 {
3933
3902
  flex: 0 0 41.667%;
3934
3903
  max-width: 41.667%;
3935
- padding-left: 0.8rem;
3936
- padding-right: 0.8rem;
3904
+ padding-inline: 0.8rem;
3937
3905
  min-width: 0;
3938
3906
  }
3939
3907
 
3940
3908
  .pa-col-7-12 {
3941
3909
  flex: 0 0 58.333%;
3942
3910
  max-width: 58.333%;
3943
- padding-left: 0.8rem;
3944
- padding-right: 0.8rem;
3911
+ padding-inline: 0.8rem;
3945
3912
  min-width: 0;
3946
3913
  }
3947
3914
 
3948
3915
  .pa-col-11-12 {
3949
3916
  flex: 0 0 91.667%;
3950
3917
  max-width: 91.667%;
3951
- padding-left: 0.8rem;
3952
- padding-right: 0.8rem;
3918
+ padding-inline: 0.8rem;
3953
3919
  min-width: 0;
3954
3920
  }
3955
3921
 
3956
3922
  .pa-offset-5 {
3957
- margin-left: 5%;
3923
+ margin-inline-start: 5%;
3958
3924
  }
3959
3925
 
3960
3926
  .pa-offset-10 {
3961
- margin-left: 10%;
3927
+ margin-inline-start: 10%;
3962
3928
  }
3963
3929
 
3964
3930
  .pa-offset-15 {
3965
- margin-left: 15%;
3931
+ margin-inline-start: 15%;
3966
3932
  }
3967
3933
 
3968
3934
  .pa-offset-20 {
3969
- margin-left: 20%;
3935
+ margin-inline-start: 20%;
3970
3936
  }
3971
3937
 
3972
3938
  .pa-offset-25 {
3973
- margin-left: 25%;
3939
+ margin-inline-start: 25%;
3974
3940
  }
3975
3941
 
3976
3942
  .pa-offset-30 {
3977
- margin-left: 30%;
3943
+ margin-inline-start: 30%;
3978
3944
  }
3979
3945
 
3980
3946
  .pa-offset-35 {
3981
- margin-left: 35%;
3947
+ margin-inline-start: 35%;
3982
3948
  }
3983
3949
 
3984
3950
  .pa-offset-40 {
3985
- margin-left: 40%;
3951
+ margin-inline-start: 40%;
3986
3952
  }
3987
3953
 
3988
3954
  .pa-offset-45 {
3989
- margin-left: 45%;
3955
+ margin-inline-start: 45%;
3990
3956
  }
3991
3957
 
3992
3958
  .pa-offset-50 {
3993
- margin-left: 50%;
3959
+ margin-inline-start: 50%;
3994
3960
  }
3995
3961
 
3996
3962
  .pa-offset-55 {
3997
- margin-left: 55%;
3963
+ margin-inline-start: 55%;
3998
3964
  }
3999
3965
 
4000
3966
  .pa-offset-60 {
4001
- margin-left: 60%;
3967
+ margin-inline-start: 60%;
4002
3968
  }
4003
3969
 
4004
3970
  .pa-offset-65 {
4005
- margin-left: 65%;
3971
+ margin-inline-start: 65%;
4006
3972
  }
4007
3973
 
4008
3974
  .pa-offset-70 {
4009
- margin-left: 70%;
3975
+ margin-inline-start: 70%;
4010
3976
  }
4011
3977
 
4012
3978
  .pa-offset-75 {
4013
- margin-left: 75%;
3979
+ margin-inline-start: 75%;
4014
3980
  }
4015
3981
 
4016
3982
  .pa-offset-80 {
4017
- margin-left: 80%;
3983
+ margin-inline-start: 80%;
4018
3984
  }
4019
3985
 
4020
3986
  .pa-offset-85 {
4021
- margin-left: 85%;
3987
+ margin-inline-start: 85%;
4022
3988
  }
4023
3989
 
4024
3990
  .pa-offset-90 {
4025
- margin-left: 90%;
3991
+ margin-inline-start: 90%;
4026
3992
  }
4027
3993
 
4028
3994
  .pa-offset-95 {
4029
- margin-left: 95%;
3995
+ margin-inline-start: 95%;
4030
3996
  }
4031
3997
 
4032
3998
  @media (min-width: 576px) {
4033
3999
  .pa-col-sm-5 {
4034
4000
  flex: 0 0 5%;
4035
4001
  max-width: 5%;
4036
- padding-left: 0.8rem;
4037
- padding-right: 0.8rem;
4002
+ padding-inline: 0.8rem;
4038
4003
  min-width: 0;
4039
4004
  }
4040
4005
  .pa-col-sm-10 {
4041
4006
  flex: 0 0 10%;
4042
4007
  max-width: 10%;
4043
- padding-left: 0.8rem;
4044
- padding-right: 0.8rem;
4008
+ padding-inline: 0.8rem;
4045
4009
  min-width: 0;
4046
4010
  }
4047
4011
  .pa-col-sm-15 {
4048
4012
  flex: 0 0 15%;
4049
4013
  max-width: 15%;
4050
- padding-left: 0.8rem;
4051
- padding-right: 0.8rem;
4014
+ padding-inline: 0.8rem;
4052
4015
  min-width: 0;
4053
4016
  }
4054
4017
  .pa-col-sm-20 {
4055
4018
  flex: 0 0 20%;
4056
4019
  max-width: 20%;
4057
- padding-left: 0.8rem;
4058
- padding-right: 0.8rem;
4020
+ padding-inline: 0.8rem;
4059
4021
  min-width: 0;
4060
4022
  }
4061
4023
  .pa-col-sm-25 {
4062
4024
  flex: 0 0 25%;
4063
4025
  max-width: 25%;
4064
- padding-left: 0.8rem;
4065
- padding-right: 0.8rem;
4026
+ padding-inline: 0.8rem;
4066
4027
  min-width: 0;
4067
4028
  }
4068
4029
  .pa-col-sm-30 {
4069
4030
  flex: 0 0 30%;
4070
4031
  max-width: 30%;
4071
- padding-left: 0.8rem;
4072
- padding-right: 0.8rem;
4032
+ padding-inline: 0.8rem;
4073
4033
  min-width: 0;
4074
4034
  }
4075
4035
  .pa-col-sm-35 {
4076
4036
  flex: 0 0 35%;
4077
4037
  max-width: 35%;
4078
- padding-left: 0.8rem;
4079
- padding-right: 0.8rem;
4038
+ padding-inline: 0.8rem;
4080
4039
  min-width: 0;
4081
4040
  }
4082
4041
  .pa-col-sm-40 {
4083
4042
  flex: 0 0 40%;
4084
4043
  max-width: 40%;
4085
- padding-left: 0.8rem;
4086
- padding-right: 0.8rem;
4044
+ padding-inline: 0.8rem;
4087
4045
  min-width: 0;
4088
4046
  }
4089
4047
  .pa-col-sm-45 {
4090
4048
  flex: 0 0 45%;
4091
4049
  max-width: 45%;
4092
- padding-left: 0.8rem;
4093
- padding-right: 0.8rem;
4050
+ padding-inline: 0.8rem;
4094
4051
  min-width: 0;
4095
4052
  }
4096
4053
  .pa-col-sm-50 {
4097
4054
  flex: 0 0 50%;
4098
4055
  max-width: 50%;
4099
- padding-left: 0.8rem;
4100
- padding-right: 0.8rem;
4056
+ padding-inline: 0.8rem;
4101
4057
  min-width: 0;
4102
4058
  }
4103
4059
  .pa-col-sm-55 {
4104
4060
  flex: 0 0 55%;
4105
4061
  max-width: 55%;
4106
- padding-left: 0.8rem;
4107
- padding-right: 0.8rem;
4062
+ padding-inline: 0.8rem;
4108
4063
  min-width: 0;
4109
4064
  }
4110
4065
  .pa-col-sm-60 {
4111
4066
  flex: 0 0 60%;
4112
4067
  max-width: 60%;
4113
- padding-left: 0.8rem;
4114
- padding-right: 0.8rem;
4068
+ padding-inline: 0.8rem;
4115
4069
  min-width: 0;
4116
4070
  }
4117
4071
  .pa-col-sm-65 {
4118
4072
  flex: 0 0 65%;
4119
4073
  max-width: 65%;
4120
- padding-left: 0.8rem;
4121
- padding-right: 0.8rem;
4074
+ padding-inline: 0.8rem;
4122
4075
  min-width: 0;
4123
4076
  }
4124
4077
  .pa-col-sm-70 {
4125
4078
  flex: 0 0 70%;
4126
4079
  max-width: 70%;
4127
- padding-left: 0.8rem;
4128
- padding-right: 0.8rem;
4080
+ padding-inline: 0.8rem;
4129
4081
  min-width: 0;
4130
4082
  }
4131
4083
  .pa-col-sm-75 {
4132
4084
  flex: 0 0 75%;
4133
4085
  max-width: 75%;
4134
- padding-left: 0.8rem;
4135
- padding-right: 0.8rem;
4086
+ padding-inline: 0.8rem;
4136
4087
  min-width: 0;
4137
4088
  }
4138
4089
  .pa-col-sm-80 {
4139
4090
  flex: 0 0 80%;
4140
4091
  max-width: 80%;
4141
- padding-left: 0.8rem;
4142
- padding-right: 0.8rem;
4092
+ padding-inline: 0.8rem;
4143
4093
  min-width: 0;
4144
4094
  }
4145
4095
  .pa-col-sm-85 {
4146
4096
  flex: 0 0 85%;
4147
4097
  max-width: 85%;
4148
- padding-left: 0.8rem;
4149
- padding-right: 0.8rem;
4098
+ padding-inline: 0.8rem;
4150
4099
  min-width: 0;
4151
4100
  }
4152
4101
  .pa-col-sm-90 {
4153
4102
  flex: 0 0 90%;
4154
4103
  max-width: 90%;
4155
- padding-left: 0.8rem;
4156
- padding-right: 0.8rem;
4104
+ padding-inline: 0.8rem;
4157
4105
  min-width: 0;
4158
4106
  }
4159
4107
  .pa-col-sm-95 {
4160
4108
  flex: 0 0 95%;
4161
4109
  max-width: 95%;
4162
- padding-left: 0.8rem;
4163
- padding-right: 0.8rem;
4110
+ padding-inline: 0.8rem;
4164
4111
  min-width: 0;
4165
4112
  }
4166
4113
  .pa-col-sm-100 {
4167
4114
  flex: 0 0 100%;
4168
4115
  max-width: 100%;
4169
- padding-left: 0.8rem;
4170
- padding-right: 0.8rem;
4116
+ padding-inline: 0.8rem;
4171
4117
  min-width: 0;
4172
4118
  }
4173
4119
  .pa-col-sm-1-2 {
4174
4120
  flex: 0 0 50%;
4175
4121
  max-width: 50%;
4176
- padding-left: 0.8rem;
4177
- padding-right: 0.8rem;
4122
+ padding-inline: 0.8rem;
4178
4123
  min-width: 0;
4179
4124
  }
4180
4125
  .pa-col-sm-1-3 {
4181
4126
  flex: 0 0 33.333%;
4182
4127
  max-width: 33.333%;
4183
- padding-left: 0.8rem;
4184
- padding-right: 0.8rem;
4128
+ padding-inline: 0.8rem;
4185
4129
  min-width: 0;
4186
4130
  }
4187
4131
  .pa-col-sm-2-3 {
4188
4132
  flex: 0 0 66.667%;
4189
4133
  max-width: 66.667%;
4190
- padding-left: 0.8rem;
4191
- padding-right: 0.8rem;
4134
+ padding-inline: 0.8rem;
4192
4135
  min-width: 0;
4193
4136
  }
4194
4137
  .pa-col-sm-1-4 {
4195
4138
  flex: 0 0 25%;
4196
4139
  max-width: 25%;
4197
- padding-left: 0.8rem;
4198
- padding-right: 0.8rem;
4140
+ padding-inline: 0.8rem;
4199
4141
  min-width: 0;
4200
4142
  }
4201
4143
  .pa-col-sm-3-4 {
4202
4144
  flex: 0 0 75%;
4203
4145
  max-width: 75%;
4204
- padding-left: 0.8rem;
4205
- padding-right: 0.8rem;
4146
+ padding-inline: 0.8rem;
4206
4147
  min-width: 0;
4207
4148
  }
4208
4149
  .pa-col-sm-1-5 {
4209
4150
  flex: 0 0 20%;
4210
4151
  max-width: 20%;
4211
- padding-left: 0.8rem;
4212
- padding-right: 0.8rem;
4152
+ padding-inline: 0.8rem;
4213
4153
  min-width: 0;
4214
4154
  }
4215
4155
  .pa-col-sm-2-5 {
4216
4156
  flex: 0 0 40%;
4217
4157
  max-width: 40%;
4218
- padding-left: 0.8rem;
4219
- padding-right: 0.8rem;
4158
+ padding-inline: 0.8rem;
4220
4159
  min-width: 0;
4221
4160
  }
4222
4161
  .pa-col-sm-3-5 {
4223
4162
  flex: 0 0 60%;
4224
4163
  max-width: 60%;
4225
- padding-left: 0.8rem;
4226
- padding-right: 0.8rem;
4164
+ padding-inline: 0.8rem;
4227
4165
  min-width: 0;
4228
4166
  }
4229
4167
  .pa-col-sm-4-5 {
4230
4168
  flex: 0 0 80%;
4231
4169
  max-width: 80%;
4232
- padding-left: 0.8rem;
4233
- padding-right: 0.8rem;
4170
+ padding-inline: 0.8rem;
4234
4171
  min-width: 0;
4235
4172
  }
4236
4173
  .pa-col-sm-1-6 {
4237
4174
  flex: 0 0 16.667%;
4238
4175
  max-width: 16.667%;
4239
- padding-left: 0.8rem;
4240
- padding-right: 0.8rem;
4176
+ padding-inline: 0.8rem;
4241
4177
  min-width: 0;
4242
4178
  }
4243
4179
  .pa-col-sm-5-6 {
4244
4180
  flex: 0 0 83.333%;
4245
4181
  max-width: 83.333%;
4246
- padding-left: 0.8rem;
4247
- padding-right: 0.8rem;
4182
+ padding-inline: 0.8rem;
4248
4183
  min-width: 0;
4249
4184
  }
4250
4185
  .pa-col-sm-1-12 {
4251
4186
  flex: 0 0 8.333%;
4252
4187
  max-width: 8.333%;
4253
- padding-left: 0.8rem;
4254
- padding-right: 0.8rem;
4188
+ padding-inline: 0.8rem;
4255
4189
  min-width: 0;
4256
4190
  }
4257
4191
  .pa-col-sm-5-12 {
4258
4192
  flex: 0 0 41.667%;
4259
4193
  max-width: 41.667%;
4260
- padding-left: 0.8rem;
4261
- padding-right: 0.8rem;
4194
+ padding-inline: 0.8rem;
4262
4195
  min-width: 0;
4263
4196
  }
4264
4197
  .pa-col-sm-7-12 {
4265
4198
  flex: 0 0 58.333%;
4266
4199
  max-width: 58.333%;
4267
- padding-left: 0.8rem;
4268
- padding-right: 0.8rem;
4200
+ padding-inline: 0.8rem;
4269
4201
  min-width: 0;
4270
4202
  }
4271
4203
  .pa-col-sm-11-12 {
4272
4204
  flex: 0 0 91.667%;
4273
4205
  max-width: 91.667%;
4274
- padding-left: 0.8rem;
4275
- padding-right: 0.8rem;
4206
+ padding-inline: 0.8rem;
4276
4207
  min-width: 0;
4277
4208
  }
4278
4209
  .pa-offset-sm-5 {
4279
- margin-left: 5%;
4210
+ margin-inline-start: 5%;
4280
4211
  }
4281
4212
  .pa-offset-sm-10 {
4282
- margin-left: 10%;
4213
+ margin-inline-start: 10%;
4283
4214
  }
4284
4215
  .pa-offset-sm-15 {
4285
- margin-left: 15%;
4216
+ margin-inline-start: 15%;
4286
4217
  }
4287
4218
  .pa-offset-sm-20 {
4288
- margin-left: 20%;
4219
+ margin-inline-start: 20%;
4289
4220
  }
4290
4221
  .pa-offset-sm-25 {
4291
- margin-left: 25%;
4222
+ margin-inline-start: 25%;
4292
4223
  }
4293
4224
  .pa-offset-sm-30 {
4294
- margin-left: 30%;
4225
+ margin-inline-start: 30%;
4295
4226
  }
4296
4227
  .pa-offset-sm-35 {
4297
- margin-left: 35%;
4228
+ margin-inline-start: 35%;
4298
4229
  }
4299
4230
  .pa-offset-sm-40 {
4300
- margin-left: 40%;
4231
+ margin-inline-start: 40%;
4301
4232
  }
4302
4233
  .pa-offset-sm-45 {
4303
- margin-left: 45%;
4234
+ margin-inline-start: 45%;
4304
4235
  }
4305
4236
  .pa-offset-sm-50 {
4306
- margin-left: 50%;
4237
+ margin-inline-start: 50%;
4307
4238
  }
4308
4239
  .pa-offset-sm-55 {
4309
- margin-left: 55%;
4240
+ margin-inline-start: 55%;
4310
4241
  }
4311
4242
  .pa-offset-sm-60 {
4312
- margin-left: 60%;
4243
+ margin-inline-start: 60%;
4313
4244
  }
4314
4245
  .pa-offset-sm-65 {
4315
- margin-left: 65%;
4246
+ margin-inline-start: 65%;
4316
4247
  }
4317
4248
  .pa-offset-sm-70 {
4318
- margin-left: 70%;
4249
+ margin-inline-start: 70%;
4319
4250
  }
4320
4251
  .pa-offset-sm-75 {
4321
- margin-left: 75%;
4252
+ margin-inline-start: 75%;
4322
4253
  }
4323
4254
  .pa-offset-sm-80 {
4324
- margin-left: 80%;
4255
+ margin-inline-start: 80%;
4325
4256
  }
4326
4257
  .pa-offset-sm-85 {
4327
- margin-left: 85%;
4258
+ margin-inline-start: 85%;
4328
4259
  }
4329
4260
  .pa-offset-sm-90 {
4330
- margin-left: 90%;
4261
+ margin-inline-start: 90%;
4331
4262
  }
4332
4263
  .pa-offset-sm-95 {
4333
- margin-left: 95%;
4264
+ margin-inline-start: 95%;
4334
4265
  }
4335
4266
  .pa-col-sm-auto {
4336
4267
  flex: 0 0 auto;
@@ -4341,304 +4272,269 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
4341
4272
  .pa-col-md-5 {
4342
4273
  flex: 0 0 5%;
4343
4274
  max-width: 5%;
4344
- padding-left: 0.8rem;
4345
- padding-right: 0.8rem;
4275
+ padding-inline: 0.8rem;
4346
4276
  min-width: 0;
4347
4277
  }
4348
4278
  .pa-col-md-10 {
4349
4279
  flex: 0 0 10%;
4350
4280
  max-width: 10%;
4351
- padding-left: 0.8rem;
4352
- padding-right: 0.8rem;
4281
+ padding-inline: 0.8rem;
4353
4282
  min-width: 0;
4354
4283
  }
4355
4284
  .pa-col-md-15 {
4356
4285
  flex: 0 0 15%;
4357
4286
  max-width: 15%;
4358
- padding-left: 0.8rem;
4359
- padding-right: 0.8rem;
4287
+ padding-inline: 0.8rem;
4360
4288
  min-width: 0;
4361
4289
  }
4362
4290
  .pa-col-md-20 {
4363
4291
  flex: 0 0 20%;
4364
4292
  max-width: 20%;
4365
- padding-left: 0.8rem;
4366
- padding-right: 0.8rem;
4293
+ padding-inline: 0.8rem;
4367
4294
  min-width: 0;
4368
4295
  }
4369
4296
  .pa-col-md-25 {
4370
4297
  flex: 0 0 25%;
4371
4298
  max-width: 25%;
4372
- padding-left: 0.8rem;
4373
- padding-right: 0.8rem;
4299
+ padding-inline: 0.8rem;
4374
4300
  min-width: 0;
4375
4301
  }
4376
4302
  .pa-col-md-30 {
4377
4303
  flex: 0 0 30%;
4378
4304
  max-width: 30%;
4379
- padding-left: 0.8rem;
4380
- padding-right: 0.8rem;
4305
+ padding-inline: 0.8rem;
4381
4306
  min-width: 0;
4382
4307
  }
4383
4308
  .pa-col-md-35 {
4384
4309
  flex: 0 0 35%;
4385
4310
  max-width: 35%;
4386
- padding-left: 0.8rem;
4387
- padding-right: 0.8rem;
4311
+ padding-inline: 0.8rem;
4388
4312
  min-width: 0;
4389
4313
  }
4390
4314
  .pa-col-md-40 {
4391
4315
  flex: 0 0 40%;
4392
4316
  max-width: 40%;
4393
- padding-left: 0.8rem;
4394
- padding-right: 0.8rem;
4317
+ padding-inline: 0.8rem;
4395
4318
  min-width: 0;
4396
4319
  }
4397
4320
  .pa-col-md-45 {
4398
4321
  flex: 0 0 45%;
4399
4322
  max-width: 45%;
4400
- padding-left: 0.8rem;
4401
- padding-right: 0.8rem;
4323
+ padding-inline: 0.8rem;
4402
4324
  min-width: 0;
4403
4325
  }
4404
4326
  .pa-col-md-50 {
4405
4327
  flex: 0 0 50%;
4406
4328
  max-width: 50%;
4407
- padding-left: 0.8rem;
4408
- padding-right: 0.8rem;
4329
+ padding-inline: 0.8rem;
4409
4330
  min-width: 0;
4410
4331
  }
4411
4332
  .pa-col-md-55 {
4412
4333
  flex: 0 0 55%;
4413
4334
  max-width: 55%;
4414
- padding-left: 0.8rem;
4415
- padding-right: 0.8rem;
4335
+ padding-inline: 0.8rem;
4416
4336
  min-width: 0;
4417
4337
  }
4418
4338
  .pa-col-md-60 {
4419
4339
  flex: 0 0 60%;
4420
4340
  max-width: 60%;
4421
- padding-left: 0.8rem;
4422
- padding-right: 0.8rem;
4341
+ padding-inline: 0.8rem;
4423
4342
  min-width: 0;
4424
4343
  }
4425
4344
  .pa-col-md-65 {
4426
4345
  flex: 0 0 65%;
4427
4346
  max-width: 65%;
4428
- padding-left: 0.8rem;
4429
- padding-right: 0.8rem;
4347
+ padding-inline: 0.8rem;
4430
4348
  min-width: 0;
4431
4349
  }
4432
4350
  .pa-col-md-70 {
4433
4351
  flex: 0 0 70%;
4434
4352
  max-width: 70%;
4435
- padding-left: 0.8rem;
4436
- padding-right: 0.8rem;
4353
+ padding-inline: 0.8rem;
4437
4354
  min-width: 0;
4438
4355
  }
4439
4356
  .pa-col-md-75 {
4440
4357
  flex: 0 0 75%;
4441
4358
  max-width: 75%;
4442
- padding-left: 0.8rem;
4443
- padding-right: 0.8rem;
4359
+ padding-inline: 0.8rem;
4444
4360
  min-width: 0;
4445
4361
  }
4446
4362
  .pa-col-md-80 {
4447
4363
  flex: 0 0 80%;
4448
4364
  max-width: 80%;
4449
- padding-left: 0.8rem;
4450
- padding-right: 0.8rem;
4365
+ padding-inline: 0.8rem;
4451
4366
  min-width: 0;
4452
4367
  }
4453
4368
  .pa-col-md-85 {
4454
4369
  flex: 0 0 85%;
4455
4370
  max-width: 85%;
4456
- padding-left: 0.8rem;
4457
- padding-right: 0.8rem;
4371
+ padding-inline: 0.8rem;
4458
4372
  min-width: 0;
4459
4373
  }
4460
4374
  .pa-col-md-90 {
4461
4375
  flex: 0 0 90%;
4462
4376
  max-width: 90%;
4463
- padding-left: 0.8rem;
4464
- padding-right: 0.8rem;
4377
+ padding-inline: 0.8rem;
4465
4378
  min-width: 0;
4466
4379
  }
4467
4380
  .pa-col-md-95 {
4468
4381
  flex: 0 0 95%;
4469
4382
  max-width: 95%;
4470
- padding-left: 0.8rem;
4471
- padding-right: 0.8rem;
4383
+ padding-inline: 0.8rem;
4472
4384
  min-width: 0;
4473
4385
  }
4474
4386
  .pa-col-md-100 {
4475
4387
  flex: 0 0 100%;
4476
4388
  max-width: 100%;
4477
- padding-left: 0.8rem;
4478
- padding-right: 0.8rem;
4389
+ padding-inline: 0.8rem;
4479
4390
  min-width: 0;
4480
4391
  }
4481
4392
  .pa-col-md-1-2 {
4482
4393
  flex: 0 0 50%;
4483
4394
  max-width: 50%;
4484
- padding-left: 0.8rem;
4485
- padding-right: 0.8rem;
4395
+ padding-inline: 0.8rem;
4486
4396
  min-width: 0;
4487
4397
  }
4488
4398
  .pa-col-md-1-3 {
4489
4399
  flex: 0 0 33.333%;
4490
4400
  max-width: 33.333%;
4491
- padding-left: 0.8rem;
4492
- padding-right: 0.8rem;
4401
+ padding-inline: 0.8rem;
4493
4402
  min-width: 0;
4494
4403
  }
4495
4404
  .pa-col-md-2-3 {
4496
4405
  flex: 0 0 66.667%;
4497
4406
  max-width: 66.667%;
4498
- padding-left: 0.8rem;
4499
- padding-right: 0.8rem;
4407
+ padding-inline: 0.8rem;
4500
4408
  min-width: 0;
4501
4409
  }
4502
4410
  .pa-col-md-1-4 {
4503
4411
  flex: 0 0 25%;
4504
4412
  max-width: 25%;
4505
- padding-left: 0.8rem;
4506
- padding-right: 0.8rem;
4413
+ padding-inline: 0.8rem;
4507
4414
  min-width: 0;
4508
4415
  }
4509
4416
  .pa-col-md-3-4 {
4510
4417
  flex: 0 0 75%;
4511
4418
  max-width: 75%;
4512
- padding-left: 0.8rem;
4513
- padding-right: 0.8rem;
4419
+ padding-inline: 0.8rem;
4514
4420
  min-width: 0;
4515
4421
  }
4516
4422
  .pa-col-md-1-5 {
4517
4423
  flex: 0 0 20%;
4518
4424
  max-width: 20%;
4519
- padding-left: 0.8rem;
4520
- padding-right: 0.8rem;
4425
+ padding-inline: 0.8rem;
4521
4426
  min-width: 0;
4522
4427
  }
4523
4428
  .pa-col-md-2-5 {
4524
4429
  flex: 0 0 40%;
4525
4430
  max-width: 40%;
4526
- padding-left: 0.8rem;
4527
- padding-right: 0.8rem;
4431
+ padding-inline: 0.8rem;
4528
4432
  min-width: 0;
4529
4433
  }
4530
4434
  .pa-col-md-3-5 {
4531
4435
  flex: 0 0 60%;
4532
4436
  max-width: 60%;
4533
- padding-left: 0.8rem;
4534
- padding-right: 0.8rem;
4437
+ padding-inline: 0.8rem;
4535
4438
  min-width: 0;
4536
4439
  }
4537
4440
  .pa-col-md-4-5 {
4538
4441
  flex: 0 0 80%;
4539
4442
  max-width: 80%;
4540
- padding-left: 0.8rem;
4541
- padding-right: 0.8rem;
4443
+ padding-inline: 0.8rem;
4542
4444
  min-width: 0;
4543
4445
  }
4544
4446
  .pa-col-md-1-6 {
4545
4447
  flex: 0 0 16.667%;
4546
4448
  max-width: 16.667%;
4547
- padding-left: 0.8rem;
4548
- padding-right: 0.8rem;
4449
+ padding-inline: 0.8rem;
4549
4450
  min-width: 0;
4550
4451
  }
4551
4452
  .pa-col-md-5-6 {
4552
4453
  flex: 0 0 83.333%;
4553
4454
  max-width: 83.333%;
4554
- padding-left: 0.8rem;
4555
- padding-right: 0.8rem;
4455
+ padding-inline: 0.8rem;
4556
4456
  min-width: 0;
4557
4457
  }
4558
4458
  .pa-col-md-1-12 {
4559
4459
  flex: 0 0 8.333%;
4560
4460
  max-width: 8.333%;
4561
- padding-left: 0.8rem;
4562
- padding-right: 0.8rem;
4461
+ padding-inline: 0.8rem;
4563
4462
  min-width: 0;
4564
4463
  }
4565
4464
  .pa-col-md-5-12 {
4566
4465
  flex: 0 0 41.667%;
4567
4466
  max-width: 41.667%;
4568
- padding-left: 0.8rem;
4569
- padding-right: 0.8rem;
4467
+ padding-inline: 0.8rem;
4570
4468
  min-width: 0;
4571
4469
  }
4572
4470
  .pa-col-md-7-12 {
4573
4471
  flex: 0 0 58.333%;
4574
4472
  max-width: 58.333%;
4575
- padding-left: 0.8rem;
4576
- padding-right: 0.8rem;
4473
+ padding-inline: 0.8rem;
4577
4474
  min-width: 0;
4578
4475
  }
4579
4476
  .pa-col-md-11-12 {
4580
4477
  flex: 0 0 91.667%;
4581
4478
  max-width: 91.667%;
4582
- padding-left: 0.8rem;
4583
- padding-right: 0.8rem;
4479
+ padding-inline: 0.8rem;
4584
4480
  min-width: 0;
4585
4481
  }
4586
4482
  .pa-offset-md-5 {
4587
- margin-left: 5%;
4483
+ margin-inline-start: 5%;
4588
4484
  }
4589
4485
  .pa-offset-md-10 {
4590
- margin-left: 10%;
4486
+ margin-inline-start: 10%;
4591
4487
  }
4592
4488
  .pa-offset-md-15 {
4593
- margin-left: 15%;
4489
+ margin-inline-start: 15%;
4594
4490
  }
4595
4491
  .pa-offset-md-20 {
4596
- margin-left: 20%;
4492
+ margin-inline-start: 20%;
4597
4493
  }
4598
4494
  .pa-offset-md-25 {
4599
- margin-left: 25%;
4495
+ margin-inline-start: 25%;
4600
4496
  }
4601
4497
  .pa-offset-md-30 {
4602
- margin-left: 30%;
4498
+ margin-inline-start: 30%;
4603
4499
  }
4604
4500
  .pa-offset-md-35 {
4605
- margin-left: 35%;
4501
+ margin-inline-start: 35%;
4606
4502
  }
4607
4503
  .pa-offset-md-40 {
4608
- margin-left: 40%;
4504
+ margin-inline-start: 40%;
4609
4505
  }
4610
4506
  .pa-offset-md-45 {
4611
- margin-left: 45%;
4507
+ margin-inline-start: 45%;
4612
4508
  }
4613
4509
  .pa-offset-md-50 {
4614
- margin-left: 50%;
4510
+ margin-inline-start: 50%;
4615
4511
  }
4616
4512
  .pa-offset-md-55 {
4617
- margin-left: 55%;
4513
+ margin-inline-start: 55%;
4618
4514
  }
4619
4515
  .pa-offset-md-60 {
4620
- margin-left: 60%;
4516
+ margin-inline-start: 60%;
4621
4517
  }
4622
4518
  .pa-offset-md-65 {
4623
- margin-left: 65%;
4519
+ margin-inline-start: 65%;
4624
4520
  }
4625
4521
  .pa-offset-md-70 {
4626
- margin-left: 70%;
4522
+ margin-inline-start: 70%;
4627
4523
  }
4628
4524
  .pa-offset-md-75 {
4629
- margin-left: 75%;
4525
+ margin-inline-start: 75%;
4630
4526
  }
4631
4527
  .pa-offset-md-80 {
4632
- margin-left: 80%;
4528
+ margin-inline-start: 80%;
4633
4529
  }
4634
4530
  .pa-offset-md-85 {
4635
- margin-left: 85%;
4531
+ margin-inline-start: 85%;
4636
4532
  }
4637
4533
  .pa-offset-md-90 {
4638
- margin-left: 90%;
4534
+ margin-inline-start: 90%;
4639
4535
  }
4640
4536
  .pa-offset-md-95 {
4641
- margin-left: 95%;
4537
+ margin-inline-start: 95%;
4642
4538
  }
4643
4539
  .pa-col-md-auto {
4644
4540
  flex: 0 0 auto;
@@ -4649,304 +4545,269 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
4649
4545
  .pa-col-lg-5 {
4650
4546
  flex: 0 0 5%;
4651
4547
  max-width: 5%;
4652
- padding-left: 0.8rem;
4653
- padding-right: 0.8rem;
4548
+ padding-inline: 0.8rem;
4654
4549
  min-width: 0;
4655
4550
  }
4656
4551
  .pa-col-lg-10 {
4657
4552
  flex: 0 0 10%;
4658
4553
  max-width: 10%;
4659
- padding-left: 0.8rem;
4660
- padding-right: 0.8rem;
4554
+ padding-inline: 0.8rem;
4661
4555
  min-width: 0;
4662
4556
  }
4663
4557
  .pa-col-lg-15 {
4664
4558
  flex: 0 0 15%;
4665
4559
  max-width: 15%;
4666
- padding-left: 0.8rem;
4667
- padding-right: 0.8rem;
4560
+ padding-inline: 0.8rem;
4668
4561
  min-width: 0;
4669
4562
  }
4670
4563
  .pa-col-lg-20 {
4671
4564
  flex: 0 0 20%;
4672
4565
  max-width: 20%;
4673
- padding-left: 0.8rem;
4674
- padding-right: 0.8rem;
4566
+ padding-inline: 0.8rem;
4675
4567
  min-width: 0;
4676
4568
  }
4677
4569
  .pa-col-lg-25 {
4678
4570
  flex: 0 0 25%;
4679
4571
  max-width: 25%;
4680
- padding-left: 0.8rem;
4681
- padding-right: 0.8rem;
4572
+ padding-inline: 0.8rem;
4682
4573
  min-width: 0;
4683
4574
  }
4684
4575
  .pa-col-lg-30 {
4685
4576
  flex: 0 0 30%;
4686
4577
  max-width: 30%;
4687
- padding-left: 0.8rem;
4688
- padding-right: 0.8rem;
4578
+ padding-inline: 0.8rem;
4689
4579
  min-width: 0;
4690
4580
  }
4691
4581
  .pa-col-lg-35 {
4692
4582
  flex: 0 0 35%;
4693
4583
  max-width: 35%;
4694
- padding-left: 0.8rem;
4695
- padding-right: 0.8rem;
4584
+ padding-inline: 0.8rem;
4696
4585
  min-width: 0;
4697
4586
  }
4698
4587
  .pa-col-lg-40 {
4699
4588
  flex: 0 0 40%;
4700
4589
  max-width: 40%;
4701
- padding-left: 0.8rem;
4702
- padding-right: 0.8rem;
4590
+ padding-inline: 0.8rem;
4703
4591
  min-width: 0;
4704
4592
  }
4705
4593
  .pa-col-lg-45 {
4706
4594
  flex: 0 0 45%;
4707
4595
  max-width: 45%;
4708
- padding-left: 0.8rem;
4709
- padding-right: 0.8rem;
4596
+ padding-inline: 0.8rem;
4710
4597
  min-width: 0;
4711
4598
  }
4712
4599
  .pa-col-lg-50 {
4713
4600
  flex: 0 0 50%;
4714
4601
  max-width: 50%;
4715
- padding-left: 0.8rem;
4716
- padding-right: 0.8rem;
4602
+ padding-inline: 0.8rem;
4717
4603
  min-width: 0;
4718
4604
  }
4719
4605
  .pa-col-lg-55 {
4720
4606
  flex: 0 0 55%;
4721
4607
  max-width: 55%;
4722
- padding-left: 0.8rem;
4723
- padding-right: 0.8rem;
4608
+ padding-inline: 0.8rem;
4724
4609
  min-width: 0;
4725
4610
  }
4726
4611
  .pa-col-lg-60 {
4727
4612
  flex: 0 0 60%;
4728
4613
  max-width: 60%;
4729
- padding-left: 0.8rem;
4730
- padding-right: 0.8rem;
4614
+ padding-inline: 0.8rem;
4731
4615
  min-width: 0;
4732
4616
  }
4733
4617
  .pa-col-lg-65 {
4734
4618
  flex: 0 0 65%;
4735
4619
  max-width: 65%;
4736
- padding-left: 0.8rem;
4737
- padding-right: 0.8rem;
4620
+ padding-inline: 0.8rem;
4738
4621
  min-width: 0;
4739
4622
  }
4740
4623
  .pa-col-lg-70 {
4741
4624
  flex: 0 0 70%;
4742
4625
  max-width: 70%;
4743
- padding-left: 0.8rem;
4744
- padding-right: 0.8rem;
4626
+ padding-inline: 0.8rem;
4745
4627
  min-width: 0;
4746
4628
  }
4747
4629
  .pa-col-lg-75 {
4748
4630
  flex: 0 0 75%;
4749
4631
  max-width: 75%;
4750
- padding-left: 0.8rem;
4751
- padding-right: 0.8rem;
4632
+ padding-inline: 0.8rem;
4752
4633
  min-width: 0;
4753
4634
  }
4754
4635
  .pa-col-lg-80 {
4755
4636
  flex: 0 0 80%;
4756
4637
  max-width: 80%;
4757
- padding-left: 0.8rem;
4758
- padding-right: 0.8rem;
4638
+ padding-inline: 0.8rem;
4759
4639
  min-width: 0;
4760
4640
  }
4761
4641
  .pa-col-lg-85 {
4762
4642
  flex: 0 0 85%;
4763
4643
  max-width: 85%;
4764
- padding-left: 0.8rem;
4765
- padding-right: 0.8rem;
4644
+ padding-inline: 0.8rem;
4766
4645
  min-width: 0;
4767
4646
  }
4768
4647
  .pa-col-lg-90 {
4769
4648
  flex: 0 0 90%;
4770
4649
  max-width: 90%;
4771
- padding-left: 0.8rem;
4772
- padding-right: 0.8rem;
4650
+ padding-inline: 0.8rem;
4773
4651
  min-width: 0;
4774
4652
  }
4775
4653
  .pa-col-lg-95 {
4776
4654
  flex: 0 0 95%;
4777
4655
  max-width: 95%;
4778
- padding-left: 0.8rem;
4779
- padding-right: 0.8rem;
4656
+ padding-inline: 0.8rem;
4780
4657
  min-width: 0;
4781
4658
  }
4782
4659
  .pa-col-lg-100 {
4783
4660
  flex: 0 0 100%;
4784
4661
  max-width: 100%;
4785
- padding-left: 0.8rem;
4786
- padding-right: 0.8rem;
4662
+ padding-inline: 0.8rem;
4787
4663
  min-width: 0;
4788
4664
  }
4789
4665
  .pa-col-lg-1-2 {
4790
4666
  flex: 0 0 50%;
4791
4667
  max-width: 50%;
4792
- padding-left: 0.8rem;
4793
- padding-right: 0.8rem;
4668
+ padding-inline: 0.8rem;
4794
4669
  min-width: 0;
4795
4670
  }
4796
4671
  .pa-col-lg-1-3 {
4797
4672
  flex: 0 0 33.333%;
4798
4673
  max-width: 33.333%;
4799
- padding-left: 0.8rem;
4800
- padding-right: 0.8rem;
4674
+ padding-inline: 0.8rem;
4801
4675
  min-width: 0;
4802
4676
  }
4803
4677
  .pa-col-lg-2-3 {
4804
4678
  flex: 0 0 66.667%;
4805
4679
  max-width: 66.667%;
4806
- padding-left: 0.8rem;
4807
- padding-right: 0.8rem;
4680
+ padding-inline: 0.8rem;
4808
4681
  min-width: 0;
4809
4682
  }
4810
4683
  .pa-col-lg-1-4 {
4811
4684
  flex: 0 0 25%;
4812
4685
  max-width: 25%;
4813
- padding-left: 0.8rem;
4814
- padding-right: 0.8rem;
4686
+ padding-inline: 0.8rem;
4815
4687
  min-width: 0;
4816
4688
  }
4817
4689
  .pa-col-lg-3-4 {
4818
4690
  flex: 0 0 75%;
4819
4691
  max-width: 75%;
4820
- padding-left: 0.8rem;
4821
- padding-right: 0.8rem;
4692
+ padding-inline: 0.8rem;
4822
4693
  min-width: 0;
4823
4694
  }
4824
4695
  .pa-col-lg-1-5 {
4825
4696
  flex: 0 0 20%;
4826
4697
  max-width: 20%;
4827
- padding-left: 0.8rem;
4828
- padding-right: 0.8rem;
4698
+ padding-inline: 0.8rem;
4829
4699
  min-width: 0;
4830
4700
  }
4831
4701
  .pa-col-lg-2-5 {
4832
4702
  flex: 0 0 40%;
4833
4703
  max-width: 40%;
4834
- padding-left: 0.8rem;
4835
- padding-right: 0.8rem;
4704
+ padding-inline: 0.8rem;
4836
4705
  min-width: 0;
4837
4706
  }
4838
4707
  .pa-col-lg-3-5 {
4839
4708
  flex: 0 0 60%;
4840
4709
  max-width: 60%;
4841
- padding-left: 0.8rem;
4842
- padding-right: 0.8rem;
4710
+ padding-inline: 0.8rem;
4843
4711
  min-width: 0;
4844
4712
  }
4845
4713
  .pa-col-lg-4-5 {
4846
4714
  flex: 0 0 80%;
4847
4715
  max-width: 80%;
4848
- padding-left: 0.8rem;
4849
- padding-right: 0.8rem;
4716
+ padding-inline: 0.8rem;
4850
4717
  min-width: 0;
4851
4718
  }
4852
4719
  .pa-col-lg-1-6 {
4853
4720
  flex: 0 0 16.667%;
4854
4721
  max-width: 16.667%;
4855
- padding-left: 0.8rem;
4856
- padding-right: 0.8rem;
4722
+ padding-inline: 0.8rem;
4857
4723
  min-width: 0;
4858
4724
  }
4859
4725
  .pa-col-lg-5-6 {
4860
4726
  flex: 0 0 83.333%;
4861
4727
  max-width: 83.333%;
4862
- padding-left: 0.8rem;
4863
- padding-right: 0.8rem;
4728
+ padding-inline: 0.8rem;
4864
4729
  min-width: 0;
4865
4730
  }
4866
4731
  .pa-col-lg-1-12 {
4867
4732
  flex: 0 0 8.333%;
4868
4733
  max-width: 8.333%;
4869
- padding-left: 0.8rem;
4870
- padding-right: 0.8rem;
4734
+ padding-inline: 0.8rem;
4871
4735
  min-width: 0;
4872
4736
  }
4873
4737
  .pa-col-lg-5-12 {
4874
4738
  flex: 0 0 41.667%;
4875
4739
  max-width: 41.667%;
4876
- padding-left: 0.8rem;
4877
- padding-right: 0.8rem;
4740
+ padding-inline: 0.8rem;
4878
4741
  min-width: 0;
4879
4742
  }
4880
4743
  .pa-col-lg-7-12 {
4881
4744
  flex: 0 0 58.333%;
4882
4745
  max-width: 58.333%;
4883
- padding-left: 0.8rem;
4884
- padding-right: 0.8rem;
4746
+ padding-inline: 0.8rem;
4885
4747
  min-width: 0;
4886
4748
  }
4887
4749
  .pa-col-lg-11-12 {
4888
4750
  flex: 0 0 91.667%;
4889
4751
  max-width: 91.667%;
4890
- padding-left: 0.8rem;
4891
- padding-right: 0.8rem;
4752
+ padding-inline: 0.8rem;
4892
4753
  min-width: 0;
4893
4754
  }
4894
4755
  .pa-offset-lg-5 {
4895
- margin-left: 5%;
4756
+ margin-inline-start: 5%;
4896
4757
  }
4897
4758
  .pa-offset-lg-10 {
4898
- margin-left: 10%;
4759
+ margin-inline-start: 10%;
4899
4760
  }
4900
4761
  .pa-offset-lg-15 {
4901
- margin-left: 15%;
4762
+ margin-inline-start: 15%;
4902
4763
  }
4903
4764
  .pa-offset-lg-20 {
4904
- margin-left: 20%;
4765
+ margin-inline-start: 20%;
4905
4766
  }
4906
4767
  .pa-offset-lg-25 {
4907
- margin-left: 25%;
4768
+ margin-inline-start: 25%;
4908
4769
  }
4909
4770
  .pa-offset-lg-30 {
4910
- margin-left: 30%;
4771
+ margin-inline-start: 30%;
4911
4772
  }
4912
4773
  .pa-offset-lg-35 {
4913
- margin-left: 35%;
4774
+ margin-inline-start: 35%;
4914
4775
  }
4915
4776
  .pa-offset-lg-40 {
4916
- margin-left: 40%;
4777
+ margin-inline-start: 40%;
4917
4778
  }
4918
4779
  .pa-offset-lg-45 {
4919
- margin-left: 45%;
4780
+ margin-inline-start: 45%;
4920
4781
  }
4921
4782
  .pa-offset-lg-50 {
4922
- margin-left: 50%;
4783
+ margin-inline-start: 50%;
4923
4784
  }
4924
4785
  .pa-offset-lg-55 {
4925
- margin-left: 55%;
4786
+ margin-inline-start: 55%;
4926
4787
  }
4927
4788
  .pa-offset-lg-60 {
4928
- margin-left: 60%;
4789
+ margin-inline-start: 60%;
4929
4790
  }
4930
4791
  .pa-offset-lg-65 {
4931
- margin-left: 65%;
4792
+ margin-inline-start: 65%;
4932
4793
  }
4933
4794
  .pa-offset-lg-70 {
4934
- margin-left: 70%;
4795
+ margin-inline-start: 70%;
4935
4796
  }
4936
4797
  .pa-offset-lg-75 {
4937
- margin-left: 75%;
4798
+ margin-inline-start: 75%;
4938
4799
  }
4939
4800
  .pa-offset-lg-80 {
4940
- margin-left: 80%;
4801
+ margin-inline-start: 80%;
4941
4802
  }
4942
4803
  .pa-offset-lg-85 {
4943
- margin-left: 85%;
4804
+ margin-inline-start: 85%;
4944
4805
  }
4945
4806
  .pa-offset-lg-90 {
4946
- margin-left: 90%;
4807
+ margin-inline-start: 90%;
4947
4808
  }
4948
4809
  .pa-offset-lg-95 {
4949
- margin-left: 95%;
4810
+ margin-inline-start: 95%;
4950
4811
  }
4951
4812
  .pa-col-lg-auto {
4952
4813
  flex: 0 0 auto;
@@ -4957,304 +4818,269 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
4957
4818
  .pa-col-xl-5 {
4958
4819
  flex: 0 0 5%;
4959
4820
  max-width: 5%;
4960
- padding-left: 0.8rem;
4961
- padding-right: 0.8rem;
4821
+ padding-inline: 0.8rem;
4962
4822
  min-width: 0;
4963
4823
  }
4964
4824
  .pa-col-xl-10 {
4965
4825
  flex: 0 0 10%;
4966
4826
  max-width: 10%;
4967
- padding-left: 0.8rem;
4968
- padding-right: 0.8rem;
4827
+ padding-inline: 0.8rem;
4969
4828
  min-width: 0;
4970
4829
  }
4971
4830
  .pa-col-xl-15 {
4972
4831
  flex: 0 0 15%;
4973
4832
  max-width: 15%;
4974
- padding-left: 0.8rem;
4975
- padding-right: 0.8rem;
4833
+ padding-inline: 0.8rem;
4976
4834
  min-width: 0;
4977
4835
  }
4978
4836
  .pa-col-xl-20 {
4979
4837
  flex: 0 0 20%;
4980
4838
  max-width: 20%;
4981
- padding-left: 0.8rem;
4982
- padding-right: 0.8rem;
4839
+ padding-inline: 0.8rem;
4983
4840
  min-width: 0;
4984
4841
  }
4985
4842
  .pa-col-xl-25 {
4986
4843
  flex: 0 0 25%;
4987
4844
  max-width: 25%;
4988
- padding-left: 0.8rem;
4989
- padding-right: 0.8rem;
4845
+ padding-inline: 0.8rem;
4990
4846
  min-width: 0;
4991
4847
  }
4992
4848
  .pa-col-xl-30 {
4993
4849
  flex: 0 0 30%;
4994
4850
  max-width: 30%;
4995
- padding-left: 0.8rem;
4996
- padding-right: 0.8rem;
4851
+ padding-inline: 0.8rem;
4997
4852
  min-width: 0;
4998
4853
  }
4999
4854
  .pa-col-xl-35 {
5000
4855
  flex: 0 0 35%;
5001
4856
  max-width: 35%;
5002
- padding-left: 0.8rem;
5003
- padding-right: 0.8rem;
4857
+ padding-inline: 0.8rem;
5004
4858
  min-width: 0;
5005
4859
  }
5006
4860
  .pa-col-xl-40 {
5007
4861
  flex: 0 0 40%;
5008
4862
  max-width: 40%;
5009
- padding-left: 0.8rem;
5010
- padding-right: 0.8rem;
4863
+ padding-inline: 0.8rem;
5011
4864
  min-width: 0;
5012
4865
  }
5013
4866
  .pa-col-xl-45 {
5014
4867
  flex: 0 0 45%;
5015
4868
  max-width: 45%;
5016
- padding-left: 0.8rem;
5017
- padding-right: 0.8rem;
4869
+ padding-inline: 0.8rem;
5018
4870
  min-width: 0;
5019
4871
  }
5020
4872
  .pa-col-xl-50 {
5021
4873
  flex: 0 0 50%;
5022
4874
  max-width: 50%;
5023
- padding-left: 0.8rem;
5024
- padding-right: 0.8rem;
4875
+ padding-inline: 0.8rem;
5025
4876
  min-width: 0;
5026
4877
  }
5027
4878
  .pa-col-xl-55 {
5028
4879
  flex: 0 0 55%;
5029
4880
  max-width: 55%;
5030
- padding-left: 0.8rem;
5031
- padding-right: 0.8rem;
4881
+ padding-inline: 0.8rem;
5032
4882
  min-width: 0;
5033
4883
  }
5034
4884
  .pa-col-xl-60 {
5035
4885
  flex: 0 0 60%;
5036
4886
  max-width: 60%;
5037
- padding-left: 0.8rem;
5038
- padding-right: 0.8rem;
4887
+ padding-inline: 0.8rem;
5039
4888
  min-width: 0;
5040
4889
  }
5041
4890
  .pa-col-xl-65 {
5042
4891
  flex: 0 0 65%;
5043
4892
  max-width: 65%;
5044
- padding-left: 0.8rem;
5045
- padding-right: 0.8rem;
4893
+ padding-inline: 0.8rem;
5046
4894
  min-width: 0;
5047
4895
  }
5048
4896
  .pa-col-xl-70 {
5049
4897
  flex: 0 0 70%;
5050
4898
  max-width: 70%;
5051
- padding-left: 0.8rem;
5052
- padding-right: 0.8rem;
4899
+ padding-inline: 0.8rem;
5053
4900
  min-width: 0;
5054
4901
  }
5055
4902
  .pa-col-xl-75 {
5056
4903
  flex: 0 0 75%;
5057
4904
  max-width: 75%;
5058
- padding-left: 0.8rem;
5059
- padding-right: 0.8rem;
4905
+ padding-inline: 0.8rem;
5060
4906
  min-width: 0;
5061
4907
  }
5062
4908
  .pa-col-xl-80 {
5063
4909
  flex: 0 0 80%;
5064
4910
  max-width: 80%;
5065
- padding-left: 0.8rem;
5066
- padding-right: 0.8rem;
4911
+ padding-inline: 0.8rem;
5067
4912
  min-width: 0;
5068
4913
  }
5069
4914
  .pa-col-xl-85 {
5070
4915
  flex: 0 0 85%;
5071
4916
  max-width: 85%;
5072
- padding-left: 0.8rem;
5073
- padding-right: 0.8rem;
4917
+ padding-inline: 0.8rem;
5074
4918
  min-width: 0;
5075
4919
  }
5076
4920
  .pa-col-xl-90 {
5077
4921
  flex: 0 0 90%;
5078
4922
  max-width: 90%;
5079
- padding-left: 0.8rem;
5080
- padding-right: 0.8rem;
4923
+ padding-inline: 0.8rem;
5081
4924
  min-width: 0;
5082
4925
  }
5083
4926
  .pa-col-xl-95 {
5084
4927
  flex: 0 0 95%;
5085
4928
  max-width: 95%;
5086
- padding-left: 0.8rem;
5087
- padding-right: 0.8rem;
4929
+ padding-inline: 0.8rem;
5088
4930
  min-width: 0;
5089
4931
  }
5090
4932
  .pa-col-xl-100 {
5091
4933
  flex: 0 0 100%;
5092
4934
  max-width: 100%;
5093
- padding-left: 0.8rem;
5094
- padding-right: 0.8rem;
4935
+ padding-inline: 0.8rem;
5095
4936
  min-width: 0;
5096
4937
  }
5097
4938
  .pa-col-xl-1-2 {
5098
4939
  flex: 0 0 50%;
5099
4940
  max-width: 50%;
5100
- padding-left: 0.8rem;
5101
- padding-right: 0.8rem;
4941
+ padding-inline: 0.8rem;
5102
4942
  min-width: 0;
5103
4943
  }
5104
4944
  .pa-col-xl-1-3 {
5105
4945
  flex: 0 0 33.333%;
5106
4946
  max-width: 33.333%;
5107
- padding-left: 0.8rem;
5108
- padding-right: 0.8rem;
4947
+ padding-inline: 0.8rem;
5109
4948
  min-width: 0;
5110
4949
  }
5111
4950
  .pa-col-xl-2-3 {
5112
4951
  flex: 0 0 66.667%;
5113
4952
  max-width: 66.667%;
5114
- padding-left: 0.8rem;
5115
- padding-right: 0.8rem;
4953
+ padding-inline: 0.8rem;
5116
4954
  min-width: 0;
5117
4955
  }
5118
4956
  .pa-col-xl-1-4 {
5119
4957
  flex: 0 0 25%;
5120
4958
  max-width: 25%;
5121
- padding-left: 0.8rem;
5122
- padding-right: 0.8rem;
4959
+ padding-inline: 0.8rem;
5123
4960
  min-width: 0;
5124
4961
  }
5125
4962
  .pa-col-xl-3-4 {
5126
4963
  flex: 0 0 75%;
5127
4964
  max-width: 75%;
5128
- padding-left: 0.8rem;
5129
- padding-right: 0.8rem;
4965
+ padding-inline: 0.8rem;
5130
4966
  min-width: 0;
5131
4967
  }
5132
4968
  .pa-col-xl-1-5 {
5133
4969
  flex: 0 0 20%;
5134
4970
  max-width: 20%;
5135
- padding-left: 0.8rem;
5136
- padding-right: 0.8rem;
4971
+ padding-inline: 0.8rem;
5137
4972
  min-width: 0;
5138
4973
  }
5139
4974
  .pa-col-xl-2-5 {
5140
4975
  flex: 0 0 40%;
5141
4976
  max-width: 40%;
5142
- padding-left: 0.8rem;
5143
- padding-right: 0.8rem;
4977
+ padding-inline: 0.8rem;
5144
4978
  min-width: 0;
5145
4979
  }
5146
4980
  .pa-col-xl-3-5 {
5147
4981
  flex: 0 0 60%;
5148
4982
  max-width: 60%;
5149
- padding-left: 0.8rem;
5150
- padding-right: 0.8rem;
4983
+ padding-inline: 0.8rem;
5151
4984
  min-width: 0;
5152
4985
  }
5153
4986
  .pa-col-xl-4-5 {
5154
4987
  flex: 0 0 80%;
5155
4988
  max-width: 80%;
5156
- padding-left: 0.8rem;
5157
- padding-right: 0.8rem;
4989
+ padding-inline: 0.8rem;
5158
4990
  min-width: 0;
5159
4991
  }
5160
4992
  .pa-col-xl-1-6 {
5161
4993
  flex: 0 0 16.667%;
5162
4994
  max-width: 16.667%;
5163
- padding-left: 0.8rem;
5164
- padding-right: 0.8rem;
4995
+ padding-inline: 0.8rem;
5165
4996
  min-width: 0;
5166
4997
  }
5167
4998
  .pa-col-xl-5-6 {
5168
4999
  flex: 0 0 83.333%;
5169
5000
  max-width: 83.333%;
5170
- padding-left: 0.8rem;
5171
- padding-right: 0.8rem;
5001
+ padding-inline: 0.8rem;
5172
5002
  min-width: 0;
5173
5003
  }
5174
5004
  .pa-col-xl-1-12 {
5175
5005
  flex: 0 0 8.333%;
5176
5006
  max-width: 8.333%;
5177
- padding-left: 0.8rem;
5178
- padding-right: 0.8rem;
5007
+ padding-inline: 0.8rem;
5179
5008
  min-width: 0;
5180
5009
  }
5181
5010
  .pa-col-xl-5-12 {
5182
5011
  flex: 0 0 41.667%;
5183
5012
  max-width: 41.667%;
5184
- padding-left: 0.8rem;
5185
- padding-right: 0.8rem;
5013
+ padding-inline: 0.8rem;
5186
5014
  min-width: 0;
5187
5015
  }
5188
5016
  .pa-col-xl-7-12 {
5189
5017
  flex: 0 0 58.333%;
5190
5018
  max-width: 58.333%;
5191
- padding-left: 0.8rem;
5192
- padding-right: 0.8rem;
5019
+ padding-inline: 0.8rem;
5193
5020
  min-width: 0;
5194
5021
  }
5195
5022
  .pa-col-xl-11-12 {
5196
5023
  flex: 0 0 91.667%;
5197
5024
  max-width: 91.667%;
5198
- padding-left: 0.8rem;
5199
- padding-right: 0.8rem;
5025
+ padding-inline: 0.8rem;
5200
5026
  min-width: 0;
5201
5027
  }
5202
5028
  .pa-offset-xl-5 {
5203
- margin-left: 5%;
5029
+ margin-inline-start: 5%;
5204
5030
  }
5205
5031
  .pa-offset-xl-10 {
5206
- margin-left: 10%;
5032
+ margin-inline-start: 10%;
5207
5033
  }
5208
5034
  .pa-offset-xl-15 {
5209
- margin-left: 15%;
5035
+ margin-inline-start: 15%;
5210
5036
  }
5211
5037
  .pa-offset-xl-20 {
5212
- margin-left: 20%;
5038
+ margin-inline-start: 20%;
5213
5039
  }
5214
5040
  .pa-offset-xl-25 {
5215
- margin-left: 25%;
5041
+ margin-inline-start: 25%;
5216
5042
  }
5217
5043
  .pa-offset-xl-30 {
5218
- margin-left: 30%;
5044
+ margin-inline-start: 30%;
5219
5045
  }
5220
5046
  .pa-offset-xl-35 {
5221
- margin-left: 35%;
5047
+ margin-inline-start: 35%;
5222
5048
  }
5223
5049
  .pa-offset-xl-40 {
5224
- margin-left: 40%;
5050
+ margin-inline-start: 40%;
5225
5051
  }
5226
5052
  .pa-offset-xl-45 {
5227
- margin-left: 45%;
5053
+ margin-inline-start: 45%;
5228
5054
  }
5229
5055
  .pa-offset-xl-50 {
5230
- margin-left: 50%;
5056
+ margin-inline-start: 50%;
5231
5057
  }
5232
5058
  .pa-offset-xl-55 {
5233
- margin-left: 55%;
5059
+ margin-inline-start: 55%;
5234
5060
  }
5235
5061
  .pa-offset-xl-60 {
5236
- margin-left: 60%;
5062
+ margin-inline-start: 60%;
5237
5063
  }
5238
5064
  .pa-offset-xl-65 {
5239
- margin-left: 65%;
5065
+ margin-inline-start: 65%;
5240
5066
  }
5241
5067
  .pa-offset-xl-70 {
5242
- margin-left: 70%;
5068
+ margin-inline-start: 70%;
5243
5069
  }
5244
5070
  .pa-offset-xl-75 {
5245
- margin-left: 75%;
5071
+ margin-inline-start: 75%;
5246
5072
  }
5247
5073
  .pa-offset-xl-80 {
5248
- margin-left: 80%;
5074
+ margin-inline-start: 80%;
5249
5075
  }
5250
5076
  .pa-offset-xl-85 {
5251
- margin-left: 85%;
5077
+ margin-inline-start: 85%;
5252
5078
  }
5253
5079
  .pa-offset-xl-90 {
5254
- margin-left: 90%;
5080
+ margin-inline-start: 90%;
5255
5081
  }
5256
5082
  .pa-offset-xl-95 {
5257
- margin-left: 95%;
5083
+ margin-inline-start: 95%;
5258
5084
  }
5259
5085
  .pa-col-xl-auto {
5260
5086
  flex: 0 0 auto;
@@ -5262,8 +5088,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
5262
5088
  }
5263
5089
  }
5264
5090
  .pa-col--no-padding {
5265
- padding-left: 0;
5266
- padding-right: 0;
5091
+ padding-inline: 0;
5267
5092
  }
5268
5093
 
5269
5094
  .pa-col--grow {
@@ -5977,19 +5802,22 @@ a.pa-card p {
5977
5802
  .pa-tabs--vertical {
5978
5803
  flex-direction: column;
5979
5804
  border-bottom: none;
5980
- border-right: 1px solid var(--pa-border-color);
5805
+ border-inline-end: 1px solid var(--pa-border-color);
5981
5806
  gap: 0;
5982
5807
  margin-bottom: 0;
5983
- padding-right: 0;
5808
+ padding-inline-end: 0;
5984
5809
  width: fit-content;
5985
5810
  min-width: max-content;
5986
5811
  }
5987
5812
  .pa-tabs--vertical .pa-tabs__item {
5988
5813
  justify-content: flex-start;
5989
5814
  border-bottom: none;
5990
- border-right: 2px solid transparent;
5815
+ border-inline-end: 2px solid transparent;
5991
5816
  padding: 0.8rem;
5992
- border-radius: 4px 0 0 4px;
5817
+ border-start-start-radius: 4px;
5818
+ border-end-start-radius: 4px;
5819
+ border-start-end-radius: 0;
5820
+ border-end-end-radius: 0;
5993
5821
  gap: 1.2rem;
5994
5822
  white-space: nowrap;
5995
5823
  min-height: 4rem;
@@ -5998,7 +5826,7 @@ a.pa-card p {
5998
5826
  background-color: rgba(0, 123, 255, 0.05);
5999
5827
  }
6000
5828
  .pa-tabs--vertical .pa-tabs__item--active {
6001
- border-right-color: #007bff;
5829
+ border-inline-end-color: #007bff;
6002
5830
  background-color: rgba(0, 123, 255, 0.1);
6003
5831
  }
6004
5832
  .pa-tabs--vertical .pa-tabs__item i {
@@ -6060,14 +5888,20 @@ a.pa-card p {
6060
5888
  .pa-tabs--scrollable .pa-tabs__scroll-btn:hover {
6061
5889
  background: linear-gradient(to right, var(--pa-main-bg), color-mix(in srgb, var(--pa-main-bg) 80%, transparent));
6062
5890
  }
6063
- .pa-tabs--scrollable .pa-tabs__scroll-btn--left {
6064
- left: 0;
5891
+ .pa-tabs--scrollable .pa-tabs__scroll-btn--left, .pa-tabs--scrollable .pa-tabs__scroll-btn--start {
5892
+ inset-inline-start: 0;
6065
5893
  background: linear-gradient(to right, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
6066
5894
  }
6067
- .pa-tabs--scrollable .pa-tabs__scroll-btn--right {
6068
- right: 0;
5895
+ [dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--left, [dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--start {
6069
5896
  background: linear-gradient(to left, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
6070
5897
  }
5898
+ .pa-tabs--scrollable .pa-tabs__scroll-btn--right, .pa-tabs--scrollable .pa-tabs__scroll-btn--end {
5899
+ inset-inline-end: 0;
5900
+ background: linear-gradient(to left, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
5901
+ }
5902
+ [dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--right, [dir=rtl] .pa-tabs--scrollable .pa-tabs__scroll-btn--end {
5903
+ background: linear-gradient(to right, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
5904
+ }
6071
5905
  .pa-tabs--scrollable .pa-tabs__scroll-btn--visible {
6072
5906
  opacity: 1;
6073
5907
  pointer-events: auto;
@@ -6163,7 +5997,7 @@ a.pa-card p {
6163
5997
  }
6164
5998
  .pa-tabs__container--card .pa-tabs__overflow {
6165
5999
  position: relative;
6166
- margin-left: auto;
6000
+ margin-inline-start: auto;
6167
6001
  flex-shrink: 0;
6168
6002
  }
6169
6003
  .pa-tabs__container--card .pa-tabs__overflow-toggle {
@@ -6179,7 +6013,7 @@ a.pa-card p {
6179
6013
  color: var(--pa-text-color-2);
6180
6014
  cursor: pointer;
6181
6015
  transition: all 0.1s ease-out;
6182
- border-left: 1px solid var(--pa-border-color);
6016
+ border-inline-start: 1px solid var(--pa-border-color);
6183
6017
  margin: -0.5rem -1rem -0.5rem 0;
6184
6018
  box-sizing: content-box;
6185
6019
  height: 4rem;
@@ -6206,7 +6040,7 @@ a.pa-card p {
6206
6040
  .pa-tabs__container--card .pa-tabs__overflow-menu {
6207
6041
  position: absolute;
6208
6042
  top: 4rem;
6209
- right: 0;
6043
+ inset-inline-end: 0;
6210
6044
  min-width: 15rem;
6211
6045
  background: var(--pa-card-bg);
6212
6046
  border: 1px solid var(--pa-border-color);
@@ -6225,7 +6059,7 @@ a.pa-card p {
6225
6059
  border: none;
6226
6060
  border-bottom: none;
6227
6061
  border-radius: 0;
6228
- text-align: left;
6062
+ text-align: start;
6229
6063
  white-space: nowrap;
6230
6064
  }
6231
6065
  .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item:hover {
@@ -6251,7 +6085,7 @@ a.pa-card p {
6251
6085
  margin-bottom: 1.6rem;
6252
6086
  }
6253
6087
  .pa-tabs__vertical-layout--bordered .pa-tabs--vertical {
6254
- border-right: 1px solid var(--pa-border-color);
6088
+ border-inline-end: 1px solid var(--pa-border-color);
6255
6089
  }
6256
6090
  .pa-tabs__vertical-layout--bordered .pa-tabs--vertical .pa-tabs__item {
6257
6091
  width: 100%;
@@ -6430,7 +6264,7 @@ a.pa-card p {
6430
6264
  ======================================== */
6431
6265
  .pa-list-basic {
6432
6266
  margin: 0;
6433
- padding-left: 2.4rem;
6267
+ padding-inline-start: 2.4rem;
6434
6268
  }
6435
6269
  .pa-list-basic li {
6436
6270
  margin-bottom: 0.8rem;
@@ -6444,18 +6278,18 @@ a.pa-card p {
6444
6278
  }
6445
6279
  .pa-list-basic--unstyled {
6446
6280
  list-style: none;
6447
- padding-left: 0;
6281
+ padding-inline-start: 0;
6448
6282
  }
6449
6283
  .pa-list-basic--inline {
6450
6284
  list-style: none;
6451
- padding-left: 0;
6285
+ padding-inline-start: 0;
6452
6286
  display: flex;
6453
6287
  flex-wrap: wrap;
6454
6288
  gap: 1.6rem;
6455
6289
  }
6456
6290
  .pa-list-basic--bordered {
6457
6291
  list-style: none;
6458
- padding-left: 0;
6292
+ padding-inline-start: 0;
6459
6293
  }
6460
6294
  .pa-list-basic--bordered li {
6461
6295
  padding: 0.8rem 1.6rem;
@@ -6466,7 +6300,7 @@ a.pa-card p {
6466
6300
  }
6467
6301
  .pa-list-basic--striped {
6468
6302
  list-style: none;
6469
- padding-left: 0;
6303
+ padding-inline-start: 0;
6470
6304
  }
6471
6305
  .pa-list-basic--striped li {
6472
6306
  padding: 0.8rem 1.6rem;
@@ -6476,7 +6310,7 @@ a.pa-card p {
6476
6310
  }
6477
6311
  .pa-list-basic--icon {
6478
6312
  list-style: none;
6479
- padding-left: 0;
6313
+ padding-inline-start: 0;
6480
6314
  }
6481
6315
  .pa-list-basic--icon li {
6482
6316
  display: flex;
@@ -6504,12 +6338,12 @@ a.pa-card p {
6504
6338
 
6505
6339
  .pa-list-ordered {
6506
6340
  margin: 0;
6507
- padding-left: 2.4rem;
6341
+ padding-inline-start: 2.4rem;
6508
6342
  }
6509
6343
  .pa-list-ordered li {
6510
6344
  margin-bottom: 0.8rem;
6511
6345
  line-height: 1.6;
6512
- padding-left: 0.4rem;
6346
+ padding-inline-start: 0.4rem;
6513
6347
  }
6514
6348
  .pa-list-ordered--roman {
6515
6349
  list-style-type: upper-roman;
@@ -6531,22 +6365,22 @@ a.pa-card p {
6531
6365
  margin-top: 0;
6532
6366
  }
6533
6367
  .pa-list-definition dd {
6534
- margin-left: 2.4rem;
6368
+ margin-inline-start: 2.4rem;
6535
6369
  margin-bottom: 0.8rem;
6536
6370
  color: var(--pa-text-color-2);
6537
6371
  line-height: 1.6;
6538
6372
  }
6539
6373
  .pa-list-definition--inline dt {
6540
6374
  display: inline;
6541
- margin-right: 0.4rem;
6375
+ margin-inline-end: 0.4rem;
6542
6376
  }
6543
6377
  .pa-list-definition--inline dt::after {
6544
6378
  content: ":";
6545
6379
  }
6546
6380
  .pa-list-definition--inline dd {
6547
6381
  display: inline;
6548
- margin-left: 0;
6549
- margin-right: 1.6rem;
6382
+ margin-inline-start: 0;
6383
+ margin-inline-end: 1.6rem;
6550
6384
  }
6551
6385
  .pa-list-definition--inline dd::after {
6552
6386
  content: "";
@@ -7456,14 +7290,14 @@ a.pa-card p {
7456
7290
  height: 4.1rem;
7457
7291
  }
7458
7292
  .pa-btn__icon {
7459
- margin-right: 0.8rem;
7293
+ margin-inline-end: 0.8rem;
7460
7294
  }
7461
7295
  .pa-btn__icon:last-child {
7462
- margin-right: 0;
7463
- margin-left: 0.8rem;
7296
+ margin-inline-end: 0;
7297
+ margin-inline-start: 0.8rem;
7464
7298
  }
7465
7299
  .pa-btn:has(.pa-btn__icon) {
7466
- text-align: left;
7300
+ text-align: start;
7467
7301
  display: inline-flex;
7468
7302
  align-items: center;
7469
7303
  gap: 0.8rem;
@@ -7484,13 +7318,13 @@ a.pa-card p {
7484
7318
  justify-content: flex-start;
7485
7319
  }
7486
7320
  .pa-btn--align-left .pa-btn__icon {
7487
- padding-left: 0;
7321
+ padding-inline-start: 0;
7488
7322
  }
7489
7323
  .pa-btn--align-right {
7490
7324
  justify-content: flex-end;
7491
7325
  }
7492
7326
  .pa-btn--align-right .pa-btn__icon {
7493
- padding-right: 0;
7327
+ padding-inline-end: 0;
7494
7328
  }
7495
7329
  .pa-btn--align-center {
7496
7330
  justify-content: center;
@@ -7499,10 +7333,10 @@ a.pa-card p {
7499
7333
  justify-content: space-between;
7500
7334
  }
7501
7335
  .pa-btn--align-justify .pa-btn__icon:first-child {
7502
- padding-left: 0;
7336
+ padding-inline-start: 0;
7503
7337
  }
7504
7338
  .pa-btn--align-justify > *:last-child {
7505
- padding-right: 0;
7339
+ padding-inline-end: 0;
7506
7340
  }
7507
7341
 
7508
7342
  .pa-btn-group {
@@ -7848,7 +7682,7 @@ a.pa-card p {
7848
7682
  }
7849
7683
  .pa-tooltip--multiline::before {
7850
7684
  white-space: normal;
7851
- text-align: left;
7685
+ text-align: start;
7852
7686
  width: 32rem;
7853
7687
  max-width: 32rem;
7854
7688
  line-height: 1.5;
@@ -8293,7 +8127,7 @@ a.pa-card p {
8293
8127
  font-size: 1.4rem;
8294
8128
  line-height: 1.5;
8295
8129
  color: var(--pa-text-color-1);
8296
- text-align: left;
8130
+ text-align: start;
8297
8131
  }
8298
8132
  .pa-popover__body p {
8299
8133
  margin: 0 0 0.8rem 0;
@@ -8310,7 +8144,7 @@ a.pa-card p {
8310
8144
  }
8311
8145
  .pa-popover__body ul, .pa-popover__body ol {
8312
8146
  margin: 0.8rem 0;
8313
- padding-left: 2.4rem;
8147
+ padding-inline-start: 2.4rem;
8314
8148
  }
8315
8149
  .pa-popover__body code {
8316
8150
  padding: 0.2rem 0.4rem;
@@ -8350,8 +8184,12 @@ a.pa-card p {
8350
8184
  .pa-popover--center .pa-popover__body {
8351
8185
  text-align: center;
8352
8186
  }
8187
+ .pa-popover--end .pa-popover__body {
8188
+ text-align: end;
8189
+ }
8190
+
8353
8191
  .pa-popover--right .pa-popover__body {
8354
- text-align: right;
8192
+ text-align: end;
8355
8193
  }
8356
8194
 
8357
8195
  .pa-tooltip-floating {
@@ -8369,7 +8207,7 @@ a.pa-card p {
8369
8207
  }
8370
8208
  .pa-tooltip-floating.pa-tooltip--multiline {
8371
8209
  white-space: normal;
8372
- text-align: left;
8210
+ text-align: start;
8373
8211
  max-width: 32rem;
8374
8212
  }
8375
8213
  .pa-tooltip-floating.pa-tooltip--primary {
@@ -8524,7 +8362,7 @@ a.pa-card p {
8524
8362
  font-size: 1.6rem;
8525
8363
  }
8526
8364
  .pa-alert--dismissible {
8527
- padding-right: 4.8rem;
8365
+ padding-inline-end: 4.8rem;
8528
8366
  }
8529
8367
  .pa-alert__icon {
8530
8368
  flex-shrink: 0;
@@ -8542,7 +8380,7 @@ a.pa-card p {
8542
8380
  }
8543
8381
  .pa-alert__list {
8544
8382
  margin: 0.8rem 0;
8545
- padding-left: 2.4rem;
8383
+ padding-inline-start: 2.4rem;
8546
8384
  }
8547
8385
  .pa-alert__actions {
8548
8386
  margin-top: 1.2rem;
@@ -8552,7 +8390,7 @@ a.pa-card p {
8552
8390
  .pa-alert__close {
8553
8391
  position: absolute;
8554
8392
  top: 0;
8555
- right: 0;
8393
+ inset-inline-end: 0;
8556
8394
  z-index: 2px;
8557
8395
  padding: 1.2rem 1rem;
8558
8396
  background: none;
@@ -8605,7 +8443,7 @@ a.pa-card p {
8605
8443
  position: relative;
8606
8444
  padding: 1.2rem 1rem;
8607
8445
  margin-bottom: 1.6rem;
8608
- border-left: 0.4rem solid var(--pa-border-color);
8446
+ border-inline-start: 0.4rem solid var(--pa-border-color);
8609
8447
  border-radius: 4px;
8610
8448
  font-size: 1.4rem;
8611
8449
  background-color: var(--pa-card-bg);
@@ -8617,27 +8455,27 @@ a.pa-card p {
8617
8455
  margin-bottom: 0;
8618
8456
  }
8619
8457
  .pa-callout--primary {
8620
- border-left-color: var(--pa-accent);
8458
+ border-inline-start-color: var(--pa-accent);
8621
8459
  background-color: rgba(0, 123, 255, 0.08);
8622
8460
  }
8623
8461
  .pa-callout--secondary {
8624
- border-left-color: var(--pa-text-color-2);
8462
+ border-inline-start-color: var(--pa-text-color-2);
8625
8463
  background-color: color-mix(in srgb, var(--pa-text-color-2) 5%, transparent);
8626
8464
  }
8627
8465
  .pa-callout--success {
8628
- border-left-color: var(--pa-success-bg);
8466
+ border-inline-start-color: var(--pa-success-bg);
8629
8467
  background-color: var(--pa-success-bg-subtle);
8630
8468
  }
8631
8469
  .pa-callout--danger {
8632
- border-left-color: var(--pa-danger-bg);
8470
+ border-inline-start-color: var(--pa-danger-bg);
8633
8471
  background-color: var(--pa-danger-bg-subtle);
8634
8472
  }
8635
8473
  .pa-callout--warning {
8636
- border-left-color: var(--pa-warning-bg);
8474
+ border-inline-start-color: var(--pa-warning-bg);
8637
8475
  background-color: var(--pa-warning-bg-subtle);
8638
8476
  }
8639
8477
  .pa-callout--info {
8640
- border-left-color: var(--pa-info-bg);
8478
+ border-inline-start-color: var(--pa-info-bg);
8641
8479
  background-color: var(--pa-info-bg-subtle);
8642
8480
  }
8643
8481
  .pa-callout--sm {
@@ -8650,7 +8488,12 @@ a.pa-card p {
8650
8488
  }
8651
8489
  .pa-callout__icon {
8652
8490
  float: left;
8653
- margin-right: 0.8rem;
8491
+ margin-inline-end: 0.8rem;
8492
+ }
8493
+ [dir=rtl] .pa-callout__icon {
8494
+ float: right;
8495
+ }
8496
+ .pa-callout__icon {
8654
8497
  font-size: 1.8rem;
8655
8498
  line-height: 1;
8656
8499
  }
@@ -8675,7 +8518,7 @@ a.pa-card p {
8675
8518
  }
8676
8519
  .pa-callout ul, .pa-callout ol {
8677
8520
  margin: 0.8rem 0;
8678
- padding-left: 2.4rem;
8521
+ padding-inline-start: 2.4rem;
8679
8522
  }
8680
8523
  .pa-callout ul:last-child, .pa-callout ol:last-child {
8681
8524
  margin-bottom: 0;
@@ -9106,6 +8949,7 @@ a.pa-card p {
9106
8949
  /* ========================================
9107
8950
  Input Groups
9108
8951
  Input groups with prepend/append addons and buttons
8952
+ RTL-aware using CSS logical properties
9109
8953
  ======================================== */
9110
8954
  .pa-input-group {
9111
8955
  display: flex;
@@ -9116,18 +8960,18 @@ a.pa-card p {
9116
8960
  flex: 1;
9117
8961
  }
9118
8962
  .pa-input-group .pa-input:first-child {
9119
- border-top-left-radius: 4px;
9120
- border-bottom-left-radius: 4px;
8963
+ border-start-start-radius: 4px;
8964
+ border-end-start-radius: 4px;
9121
8965
  }
9122
8966
  .pa-input-group .pa-input:last-child {
9123
- border-top-right-radius: 4px;
9124
- border-bottom-right-radius: 4px;
8967
+ border-start-end-radius: 4px;
8968
+ border-end-end-radius: 4px;
9125
8969
  }
9126
8970
  .pa-input-group .pa-input:not(:first-child) {
9127
- border-left: none;
8971
+ border-inline-start: none;
9128
8972
  }
9129
8973
  .pa-input-group .pa-input:not(:last-child) {
9130
- border-right: none;
8974
+ border-inline-end: none;
9131
8975
  }
9132
8976
  .pa-input-group__prepend, .pa-input-group__append {
9133
8977
  display: flex;
@@ -9144,50 +8988,50 @@ a.pa-card p {
9144
8988
  background-color: var(--pa-input-group-prepend-bg);
9145
8989
  color: var(--pa-input-group-prepend-text);
9146
8990
  border-color: var(--pa-input-group-prepend-bg);
9147
- border-right: none;
8991
+ border-inline-end: none;
9148
8992
  }
9149
8993
  .pa-input-group__prepend:first-child {
9150
- border-top-left-radius: 4px;
9151
- border-bottom-left-radius: 4px;
8994
+ border-start-start-radius: 4px;
8995
+ border-end-start-radius: 4px;
9152
8996
  }
9153
8997
  .pa-input-group__append {
9154
8998
  background-color: var(--pa-input-group-append-bg);
9155
8999
  color: var(--pa-input-group-append-text);
9156
9000
  border-color: var(--pa-input-group-append-bg);
9157
- border-left: none;
9001
+ border-inline-start: none;
9158
9002
  }
9159
9003
  .pa-input-group__append:last-child {
9160
- border-top-right-radius: 4px;
9161
- border-bottom-right-radius: 4px;
9004
+ border-start-end-radius: 4px;
9005
+ border-end-end-radius: 4px;
9162
9006
  }
9163
9007
  .pa-input-group__prepend + .pa-input-group__prepend {
9164
- border-left: 1px solid var(--pa-input-group-prepend-bg);
9008
+ border-inline-start: 1px solid var(--pa-input-group-prepend-bg);
9165
9009
  }
9166
9010
  .pa-input-group__append + .pa-input-group__append {
9167
- border-left: 1px solid var(--pa-input-group-append-bg);
9011
+ border-inline-start: 1px solid var(--pa-input-group-append-bg);
9168
9012
  }
9169
9013
  .pa-input-group:has(.pa-input:focus) .pa-input-group__prepend {
9170
- border-right: 1px solid var(--pa-input-focus-border-color);
9014
+ border-inline-end: 1px solid var(--pa-input-focus-border-color);
9171
9015
  }
9172
9016
  .pa-input-group:has(.pa-input:focus) .pa-input-group__prepend:has(+ .pa-input-group__prepend) {
9173
- border-right: none;
9017
+ border-inline-end: none;
9174
9018
  }
9175
9019
  .pa-input-group:has(.pa-input:focus) .pa-input-group__append {
9176
- border-left: 1px solid var(--pa-input-focus-border-color);
9020
+ border-inline-start: 1px solid var(--pa-input-focus-border-color);
9177
9021
  }
9178
9022
  .pa-input-group:has(.pa-input:focus) .pa-input-group__append + .pa-input-group__append {
9179
- border-left: 1px solid var(--pa-border-color);
9023
+ border-inline-start: 1px solid var(--pa-border-color);
9180
9024
  }
9181
9025
  .pa-input-group__button {
9182
9026
  border-radius: 0;
9183
9027
  }
9184
9028
  .pa-input-group__button:first-child {
9185
- border-top-left-radius: 4px;
9186
- border-bottom-left-radius: 4px;
9029
+ border-start-start-radius: 4px;
9030
+ border-end-start-radius: 4px;
9187
9031
  }
9188
9032
  .pa-input-group__button:last-child {
9189
- border-top-right-radius: 4px;
9190
- border-bottom-right-radius: 4px;
9033
+ border-start-end-radius: 4px;
9034
+ border-end-end-radius: 4px;
9191
9035
  }
9192
9036
  .pa-input-group--xs .pa-input-group__prepend,
9193
9037
  .pa-input-group--xs .pa-input-group__append {
@@ -9231,11 +9075,11 @@ a.pa-card p {
9231
9075
  .pa-input-wrapper .pa-virtual-textbox {
9232
9076
  flex: 1;
9233
9077
  min-width: 0;
9234
- padding-right: 4rem;
9078
+ padding-inline-end: 4rem;
9235
9079
  }
9236
9080
  .pa-input-wrapper__clear {
9237
9081
  position: absolute;
9238
- right: 0.4rem;
9082
+ inset-inline-end: 0.4rem;
9239
9083
  top: 50%;
9240
9084
  transform: translateY(-50%);
9241
9085
  background: transparent;
@@ -9277,7 +9121,7 @@ a.pa-card p {
9277
9121
  }
9278
9122
 
9279
9123
  .pa-search-token-remove {
9280
- margin-left: 0.4rem;
9124
+ margin-inline-start: 0.4rem;
9281
9125
  padding: 0 0.4rem;
9282
9126
  border: none;
9283
9127
  background: transparent;
@@ -9368,7 +9212,7 @@ a.pa-card p {
9368
9212
  color: var(--pa-accent);
9369
9213
  }
9370
9214
  .pa-search-autocomplete__item-type {
9371
- margin-left: auto;
9215
+ margin-inline-start: auto;
9372
9216
  font-size: 1.2rem;
9373
9217
  color: var(--pa-text-color-2);
9374
9218
  opacity: 0.7;
@@ -9833,7 +9677,7 @@ web-multiselect {
9833
9677
  }
9834
9678
  .pa-file-dropzone__drop-prompt-icon {
9835
9679
  display: inline-block;
9836
- margin-right: 0.4rem;
9680
+ margin-inline-end: 0.4rem;
9837
9681
  font-size: 1.8rem;
9838
9682
  }
9839
9683
  .pa-file-dropzone__files-grid {
@@ -10067,7 +9911,7 @@ web-multiselect {
10067
9911
  z-index: 1;
10068
9912
  }
10069
9913
  .pa-file-popover__table th {
10070
- text-align: left;
9914
+ text-align: start;
10071
9915
  padding: 0.4rem 0.8rem;
10072
9916
  border-bottom: 1px solid var(--pa-border-color);
10073
9917
  color: var(--pa-text-color-2);
@@ -10421,12 +10265,12 @@ web-multiselect {
10421
10265
  width: 100%;
10422
10266
  }
10423
10267
  .pa-checkbox-list__label .pa-checkbox {
10424
- margin-right: 1.2rem;
10268
+ margin-inline-end: 1.2rem;
10425
10269
  gap: 0;
10426
10270
  }
10427
10271
  .pa-checkbox-list__checkbox {
10428
10272
  margin: 0;
10429
- margin-right: 1.2rem;
10273
+ margin-inline-end: 1.2rem;
10430
10274
  width: 1.6rem;
10431
10275
  height: 1.6rem;
10432
10276
  cursor: pointer;
@@ -10443,7 +10287,7 @@ web-multiselect {
10443
10287
  }
10444
10288
  .pa-checkbox-list__actions {
10445
10289
  position: absolute;
10446
- right: 1.2rem;
10290
+ inset-inline-end: 1.2rem;
10447
10291
  top: 50%;
10448
10292
  transform: translateY(-50%);
10449
10293
  display: flex;
@@ -10455,7 +10299,7 @@ web-multiselect {
10455
10299
  pointer-events: auto;
10456
10300
  }
10457
10301
  .pa-checkbox-list__item:has(.pa-checkbox-list__actions) .pa-checkbox-list__label {
10458
- padding-right: 6rem;
10302
+ padding-inline-end: 6rem;
10459
10303
  }
10460
10304
 
10461
10305
  .pa-checkbox-list--compact .pa-checkbox-list__label {
@@ -10558,7 +10402,7 @@ web-multiselect {
10558
10402
  gap: 0;
10559
10403
  }
10560
10404
  .pa-checkbox-list--2col .pa-checkbox-list__item:nth-child(odd) {
10561
- border-right: 1px solid var(--pa-border-color);
10405
+ border-inline-end: 1px solid var(--pa-border-color);
10562
10406
  }
10563
10407
 
10564
10408
  .pa-checkbox-list--3col {
@@ -10567,7 +10411,7 @@ web-multiselect {
10567
10411
  gap: 0;
10568
10412
  }
10569
10413
  .pa-checkbox-list--3col .pa-checkbox-list__item:not(:nth-child(3n)) {
10570
- border-right: 1px solid var(--pa-border-color);
10414
+ border-inline-end: 1px solid var(--pa-border-color);
10571
10415
  }
10572
10416
 
10573
10417
  .pa-table .pa-table__checkbox-col {
@@ -10716,11 +10560,11 @@ web-multiselect {
10716
10560
  }
10717
10561
  .pa-table-card__body .pa-table th:first-child,
10718
10562
  .pa-table-card__body .pa-table td:first-child {
10719
- padding-left: 1rem;
10563
+ padding-inline-start: 1rem;
10720
10564
  }
10721
10565
  .pa-table-card__body .pa-table th:last-child,
10722
10566
  .pa-table-card__body .pa-table td:last-child {
10723
- padding-right: 1rem;
10567
+ padding-inline-end: 1rem;
10724
10568
  }
10725
10569
  .pa-table-card__body .pa-table tbody tr:last-child td {
10726
10570
  border-bottom: none;
@@ -10728,8 +10572,8 @@ web-multiselect {
10728
10572
  .pa-table-card__footer {
10729
10573
  padding: 1.2rem 1rem;
10730
10574
  border-top: 1px solid var(--pa-border-color);
10731
- border-bottom-left-radius: 8px;
10732
- border-bottom-right-radius: 8px;
10575
+ border-end-start-radius: 8px;
10576
+ border-end-end-radius: 8px;
10733
10577
  background: var(--pa-card-footer-bg);
10734
10578
  display: flex;
10735
10579
  justify-content: space-between;
@@ -10878,15 +10722,13 @@ web-multiselect {
10878
10722
  background: transparent;
10879
10723
  border-bottom: none;
10880
10724
  border-radius: 0;
10881
- padding-left: 0;
10882
- padding-right: 0;
10725
+ padding-inline: 0;
10883
10726
  }
10884
10727
  .pa-table-card--plain .pa-table-card__footer {
10885
10728
  background: transparent;
10886
10729
  border-top: none;
10887
10730
  border-radius: 0;
10888
- padding-left: 0;
10889
- padding-right: 0;
10731
+ padding-inline: 0;
10890
10732
  }
10891
10733
 
10892
10734
  .pa-table {
@@ -10898,7 +10740,7 @@ web-multiselect {
10898
10740
  .pa-table th,
10899
10741
  .pa-table td {
10900
10742
  padding: 0.8rem 0.8rem;
10901
- text-align: left;
10743
+ text-align: start;
10902
10744
  border-bottom: 1px solid var(--pa-border-color);
10903
10745
  vertical-align: middle;
10904
10746
  line-height: 1.2;
@@ -11079,7 +10921,7 @@ web-multiselect {
11079
10921
  .pa-load-more__count {
11080
10922
  color: var(--pa-text-color-2);
11081
10923
  font-size: 1.2rem;
11082
- margin-left: 0.4rem;
10924
+ margin-inline-start: 0.4rem;
11083
10925
  }
11084
10926
 
11085
10927
  .pa-virtual-table {
@@ -11105,13 +10947,13 @@ web-multiselect {
11105
10947
  .pa-virtual-table__header-cell {
11106
10948
  padding: 0.5rem 0.8rem;
11107
10949
  font-weight: 600;
11108
- border-right: 1px solid var(--pa-border-color);
10950
+ border-inline-end: 1px solid var(--pa-border-color);
11109
10951
  background: var(--pa-table-header-bg);
11110
10952
  color: var(--pa-text-color-1);
11111
10953
  }
11112
10954
 
11113
10955
  .pa-virtual-table__header-cell:last-child {
11114
- border-right: none;
10956
+ border-inline-end: none;
11115
10957
  }
11116
10958
 
11117
10959
  .pa-virtual-table__body {
@@ -11135,7 +10977,7 @@ web-multiselect {
11135
10977
 
11136
10978
  .pa-virtual-table__cell {
11137
10979
  padding: 0.5rem 0.8rem;
11138
- border-right: 1px solid var(--pa-border-color);
10980
+ border-inline-end: 1px solid var(--pa-border-color);
11139
10981
  overflow: hidden;
11140
10982
  text-overflow: ellipsis;
11141
10983
  white-space: nowrap;
@@ -11144,15 +10986,14 @@ web-multiselect {
11144
10986
  }
11145
10987
 
11146
10988
  .pa-virtual-table__cell:last-child {
11147
- border-right: none;
10989
+ border-inline-end: none;
11148
10990
  }
11149
10991
 
11150
10992
  @media (max-width: 1024px) and (min-width: 769px) {
11151
10993
  .pa-table--responsive {
11152
10994
  overflow-x: auto;
11153
10995
  -webkit-overflow-scrolling: touch;
11154
- border-left: 1px solid var(--pa-border-color);
11155
- border-right: 1px solid var(--pa-border-color);
10996
+ border-inline: 1px solid var(--pa-border-color);
11156
10997
  }
11157
10998
  }
11158
10999
  @media (max-width: 768px) {
@@ -11171,7 +11012,7 @@ web-multiselect {
11171
11012
  }
11172
11013
  .pa-table--responsive tbody td {
11173
11014
  display: block;
11174
- text-align: right;
11015
+ text-align: end;
11175
11016
  padding: 1.2rem;
11176
11017
  position: relative;
11177
11018
  border-bottom: 1px solid var(--pa-border-color);
@@ -11182,14 +11023,14 @@ web-multiselect {
11182
11023
  .pa-table--responsive tbody td::before {
11183
11024
  content: attr(data-label);
11184
11025
  position: absolute;
11185
- left: 1.2rem;
11026
+ inset-inline-start: 1.2rem;
11186
11027
  top: 1.2rem;
11187
11028
  font-weight: 600;
11188
- text-align: left;
11029
+ text-align: start;
11189
11030
  width: 40%;
11190
11031
  }
11191
11032
  .pa-table--responsive tbody td {
11192
- padding-left: calc(40% + 2.4rem);
11033
+ padding-inline-start: calc(40% + 2.4rem);
11193
11034
  }
11194
11035
  .pa-table--responsive .col-auto {
11195
11036
  width: auto;
@@ -11215,8 +11056,7 @@ web-multiselect {
11215
11056
  display: block;
11216
11057
  overflow-x: auto;
11217
11058
  -webkit-overflow-scrolling: touch;
11218
- border-left: 1px solid var(--pa-border-color);
11219
- border-right: 1px solid var(--pa-border-color);
11059
+ border-inline: 1px solid var(--pa-border-color);
11220
11060
  }
11221
11061
  }
11222
11062
  @media (max-width: 768px) {
@@ -11304,7 +11144,7 @@ web-multiselect {
11304
11144
  .pa-comparison-table thead th {
11305
11145
  background-color: var(--pa-table-header-bg);
11306
11146
  font-weight: 600;
11307
- text-align: left;
11147
+ text-align: start;
11308
11148
  padding: 0.8rem 1.6rem;
11309
11149
  border-bottom: 2px solid var(--pa-border-color);
11310
11150
  }
@@ -11350,7 +11190,7 @@ tbody tr:hover .pa-comparison-table__copy {
11350
11190
  .pa-comparison-table__changed::before {
11351
11191
  content: "";
11352
11192
  position: absolute;
11353
- left: 0;
11193
+ inset-inline-start: 0;
11354
11194
  top: 0;
11355
11195
  bottom: 0;
11356
11196
  width: 2px;
@@ -11404,7 +11244,7 @@ tbody tr:hover .pa-comparison-table__copy {
11404
11244
  .pa-comparison-table tbody td::before {
11405
11245
  content: attr(data-label);
11406
11246
  font-weight: 600;
11407
- margin-right: 0.8rem;
11247
+ margin-inline-end: 0.8rem;
11408
11248
  min-width: 120px;
11409
11249
  }
11410
11250
  .pa-comparison-table__label {
@@ -11448,43 +11288,43 @@ code {
11448
11288
  }
11449
11289
  .pa-code--numbered {
11450
11290
  counter-reset: line;
11451
- padding-left: 5.6rem;
11291
+ padding-inline-start: 5.6rem;
11452
11292
  position: relative;
11453
11293
  }
11454
11294
  .pa-code--numbered::before {
11455
11295
  content: "";
11456
11296
  position: absolute;
11457
- left: 0;
11297
+ inset-inline-start: 0;
11458
11298
  top: 0;
11459
11299
  bottom: 0;
11460
11300
  width: 4.4rem;
11461
11301
  background-color: rgba(0, 0, 0, 0.05);
11462
- border-right: 1px solid var(--pa-border-color);
11302
+ border-inline-end: 1px solid var(--pa-border-color);
11463
11303
  }
11464
11304
  .pa-code--compact {
11465
11305
  padding: 0.8rem;
11466
11306
  font-size: 1.2rem;
11467
11307
  }
11468
11308
  .pa-code--json {
11469
- border-left: 2px solid #f59e0b;
11309
+ border-inline-start: 2px solid #f59e0b;
11470
11310
  }
11471
11311
  .pa-code--javascript {
11472
- border-left: 2px solid #f0db4f;
11312
+ border-inline-start: 2px solid #f0db4f;
11473
11313
  }
11474
11314
  .pa-code--html {
11475
- border-left: 2px solid #e34c26;
11315
+ border-inline-start: 2px solid #e34c26;
11476
11316
  }
11477
11317
  .pa-code--css {
11478
- border-left: 2px solid #264de4;
11318
+ border-inline-start: 2px solid #264de4;
11479
11319
  }
11480
11320
  .pa-code--bash {
11481
- border-left: 2px solid #4eaa25;
11321
+ border-inline-start: 2px solid #4eaa25;
11482
11322
  }
11483
11323
  .pa-code--sql {
11484
- border-left: 2px solid #00758f;
11324
+ border-inline-start: 2px solid #00758f;
11485
11325
  }
11486
11326
  .pa-code--python {
11487
- border-left: 2px solid #3776ab;
11327
+ border-inline-start: 2px solid #3776ab;
11488
11328
  }
11489
11329
 
11490
11330
  .pa-code-block {
@@ -11651,7 +11491,7 @@ code {
11651
11491
  .pa-load-more__count {
11652
11492
  color: var(--pa-text-color-2);
11653
11493
  font-size: 1.2rem;
11654
- margin-left: 0.4rem;
11494
+ margin-inline-start: 0.4rem;
11655
11495
  }
11656
11496
 
11657
11497
  /* ========================================
@@ -11697,7 +11537,7 @@ code {
11697
11537
  .pa-profile-panel {
11698
11538
  position: fixed;
11699
11539
  top: 0;
11700
- right: 0;
11540
+ inset-inline-end: 0;
11701
11541
  height: 100vh;
11702
11542
  z-index: 5000;
11703
11543
  pointer-events: none;
@@ -11716,7 +11556,7 @@ code {
11716
11556
  .pa-profile-panel__overlay {
11717
11557
  position: absolute;
11718
11558
  top: 0;
11719
- left: 0;
11559
+ inset-inline-start: 0;
11720
11560
  width: 100vw;
11721
11561
  height: 100vh;
11722
11562
  background-color: var(--pa-profile-overlay-bg);
@@ -11725,7 +11565,7 @@ code {
11725
11565
  .pa-profile-panel__content {
11726
11566
  position: absolute;
11727
11567
  top: 0;
11728
- right: 0;
11568
+ inset-inline-end: 0;
11729
11569
  height: 100vh;
11730
11570
  background-color: var(--pa-card-bg);
11731
11571
  box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
@@ -11735,6 +11575,9 @@ code {
11735
11575
  flex-direction: column;
11736
11576
  overflow: hidden;
11737
11577
  }
11578
+ [dir=rtl] .pa-profile-panel__content {
11579
+ transform: translateX(-100%);
11580
+ }
11738
11581
  .pa-profile-panel__header {
11739
11582
  padding: 2.4rem;
11740
11583
  background-color: var(--pa-header-bg);
@@ -11764,7 +11607,7 @@ code {
11764
11607
  .pa-profile-panel__info {
11765
11608
  flex: 1;
11766
11609
  min-width: 0;
11767
- padding-right: 3.2rem;
11610
+ padding-inline-end: 3.2rem;
11768
11611
  }
11769
11612
  .pa-profile-panel__name {
11770
11613
  margin: 0 0 0.4rem 0;
@@ -11797,7 +11640,7 @@ code {
11797
11640
  .pa-profile-panel__close {
11798
11641
  position: absolute;
11799
11642
  top: 1.6rem;
11800
- right: 1.6rem;
11643
+ inset-inline-end: 1.6rem;
11801
11644
  width: 3.2rem;
11802
11645
  height: 3.2rem;
11803
11646
  background: none;
@@ -11942,7 +11785,7 @@ code {
11942
11785
  }
11943
11786
  .pa-profile-panel__favorite-remove {
11944
11787
  opacity: 0;
11945
- margin-left: auto;
11788
+ margin-inline-start: auto;
11946
11789
  background: none;
11947
11790
  border: none;
11948
11791
  padding: 0.4rem;
@@ -11980,10 +11823,7 @@ code {
11980
11823
  ======================================== */
11981
11824
  .pa-modal {
11982
11825
  position: fixed;
11983
- top: 0;
11984
- left: 0;
11985
- width: 100%;
11986
- height: 100%;
11826
+ inset: 0;
11987
11827
  display: none;
11988
11828
  justify-content: center;
11989
11829
  align-items: center;
@@ -11999,10 +11839,7 @@ code {
11999
11839
 
12000
11840
  .pa-modal__backdrop {
12001
11841
  position: fixed;
12002
- top: 0;
12003
- left: 0;
12004
- width: 100%;
12005
- height: 100%;
11842
+ inset: 0;
12006
11843
  background-color: var(--pa-modal-overlay-bg);
12007
11844
  z-index: 6000;
12008
11845
  }
@@ -12150,32 +11987,38 @@ code {
12150
11987
  flex-direction: column;
12151
11988
  gap: 1.2rem;
12152
11989
  }
12153
- .pa-toast-container--top-right {
11990
+ .pa-toast-container--top-end {
12154
11991
  top: 2.4rem;
12155
- right: 2.4rem;
11992
+ inset-inline-end: 2.4rem;
12156
11993
  }
12157
- .pa-toast-container--top-left {
11994
+ .pa-toast-container--top-start {
12158
11995
  top: 2.4rem;
12159
- left: 2.4rem;
11996
+ inset-inline-start: 2.4rem;
12160
11997
  }
12161
- .pa-toast-container--bottom-right {
11998
+ .pa-toast-container--bottom-end {
12162
11999
  bottom: 2.4rem;
12163
- right: 2.4rem;
12000
+ inset-inline-end: 2.4rem;
12164
12001
  }
12165
- .pa-toast-container--bottom-left {
12002
+ .pa-toast-container--bottom-start {
12166
12003
  bottom: 2.4rem;
12167
- left: 2.4rem;
12004
+ inset-inline-start: 2.4rem;
12168
12005
  }
12169
12006
  .pa-toast-container--top-center {
12170
12007
  top: 2.4rem;
12171
- left: 50%;
12008
+ inset-inline-start: 50%;
12172
12009
  transform: translateX(-50%);
12173
12010
  }
12011
+ [dir=rtl] .pa-toast-container--top-center {
12012
+ transform: translateX(50%);
12013
+ }
12174
12014
  .pa-toast-container--bottom-center {
12175
12015
  bottom: 2.4rem;
12176
- left: 50%;
12016
+ inset-inline-start: 50%;
12177
12017
  transform: translateX(-50%);
12178
12018
  }
12019
+ [dir=rtl] .pa-toast-container--bottom-center {
12020
+ transform: translateX(50%);
12021
+ }
12179
12022
 
12180
12023
  .pa-toast {
12181
12024
  background-color: var(--pa-card-bg);
@@ -12203,13 +12046,31 @@ code {
12203
12046
  opacity: 0;
12204
12047
  transform: translateX(100%);
12205
12048
  }
12206
- .pa-toast-container--top-left .pa-toast, .pa-toast-container--bottom-left .pa-toast {
12049
+ .pa-toast-container--top-start .pa-toast, .pa-toast-container--bottom-start .pa-toast {
12207
12050
  transform: translateX(-100%);
12208
12051
  }
12209
- .pa-toast-container--top-left .pa-toast.pa-toast--show, .pa-toast-container--bottom-left .pa-toast.pa-toast--show {
12052
+ .pa-toast-container--top-start .pa-toast.pa-toast--show, .pa-toast-container--bottom-start .pa-toast.pa-toast--show {
12210
12053
  transform: translateX(0);
12211
12054
  }
12212
- .pa-toast-container--top-left .pa-toast.pa-toast--hide, .pa-toast-container--bottom-left .pa-toast.pa-toast--hide {
12055
+ .pa-toast-container--top-start .pa-toast.pa-toast--hide, .pa-toast-container--bottom-start .pa-toast.pa-toast--hide {
12056
+ transform: translateX(-100%);
12057
+ }
12058
+ [dir=rtl] .pa-toast-container--top-start .pa-toast, [dir=rtl] .pa-toast-container--bottom-start .pa-toast {
12059
+ transform: translateX(100%);
12060
+ }
12061
+ [dir=rtl] .pa-toast-container--top-start .pa-toast.pa-toast--show, [dir=rtl] .pa-toast-container--bottom-start .pa-toast.pa-toast--show {
12062
+ transform: translateX(0);
12063
+ }
12064
+ [dir=rtl] .pa-toast-container--top-start .pa-toast.pa-toast--hide, [dir=rtl] .pa-toast-container--bottom-start .pa-toast.pa-toast--hide {
12065
+ transform: translateX(100%);
12066
+ }
12067
+ [dir=rtl] .pa-toast-container--top-end .pa-toast, [dir=rtl] .pa-toast-container--bottom-end .pa-toast {
12068
+ transform: translateX(-100%);
12069
+ }
12070
+ [dir=rtl] .pa-toast-container--top-end .pa-toast.pa-toast--show, [dir=rtl] .pa-toast-container--bottom-end .pa-toast.pa-toast--show {
12071
+ transform: translateX(0);
12072
+ }
12073
+ [dir=rtl] .pa-toast-container--top-end .pa-toast.pa-toast--hide, [dir=rtl] .pa-toast-container--bottom-end .pa-toast.pa-toast--hide {
12213
12074
  transform: translateX(-100%);
12214
12075
  }
12215
12076
  .pa-toast-container--top-center .pa-toast, .pa-toast-container--bottom-center .pa-toast {
@@ -12281,7 +12142,7 @@ code {
12281
12142
  .pa-toast__progress {
12282
12143
  position: absolute;
12283
12144
  bottom: 0;
12284
- left: 0;
12145
+ inset-inline-start: 0;
12285
12146
  height: 3px;
12286
12147
  background-color: currentColor;
12287
12148
  opacity: 0.3;
@@ -12345,14 +12206,13 @@ code {
12345
12206
 
12346
12207
  @media (max-width: 768px) {
12347
12208
  .pa-toast-container {
12348
- left: 1.2rem !important;
12349
- right: 1.2rem !important;
12209
+ inset-inline: 1.2rem !important;
12350
12210
  transform: none !important;
12351
12211
  }
12352
- .pa-toast-container--top-right, .pa-toast-container--top-left, .pa-toast-container--top-center {
12212
+ .pa-toast-container--top-end, .pa-toast-container--top-start, .pa-toast-container--top-center {
12353
12213
  top: 1.2rem;
12354
12214
  }
12355
- .pa-toast-container--bottom-right, .pa-toast-container--bottom-left, .pa-toast-container--bottom-center {
12215
+ .pa-toast-container--bottom-end, .pa-toast-container--bottom-start, .pa-toast-container--bottom-center {
12356
12216
  bottom: 1.2rem;
12357
12217
  }
12358
12218
  .pa-toast {
@@ -12372,9 +12232,9 @@ code {
12372
12232
  position: relative;
12373
12233
  }
12374
12234
  .pa-timeline--simple {
12375
- border-left: 1px solid var(--pa-border-color);
12376
- margin-left: 10px;
12377
- padding-left: 20px;
12235
+ border-inline-start: 1px solid var(--pa-border-color);
12236
+ margin-inline-start: 10px;
12237
+ padding-inline-start: 20px;
12378
12238
  }
12379
12239
  .pa-timeline--simple .pa-timeline__item {
12380
12240
  padding-bottom: 2.4rem;
@@ -12387,7 +12247,7 @@ code {
12387
12247
  .pa-timeline--simple .pa-timeline__item::before {
12388
12248
  content: "";
12389
12249
  position: absolute;
12390
- left: -30px;
12250
+ inset-inline-start: -30px;
12391
12251
  top: 0;
12392
12252
  width: 15px;
12393
12253
  height: 15px;
@@ -12824,10 +12684,7 @@ code {
12824
12684
  ======================================== */
12825
12685
  .pa-command-palette {
12826
12686
  position: fixed;
12827
- top: 0;
12828
- left: 0;
12829
- right: 0;
12830
- bottom: 0;
12687
+ inset: 0;
12831
12688
  z-index: 10500;
12832
12689
  display: none;
12833
12690
  align-items: flex-start;
@@ -12839,10 +12696,7 @@ code {
12839
12696
  }
12840
12697
  .pa-command-palette__backdrop {
12841
12698
  position: absolute;
12842
- top: 0;
12843
- left: 0;
12844
- right: 0;
12845
- bottom: 0;
12699
+ inset: 0;
12846
12700
  background-color: var(--pa-command-palette-backdrop-bg);
12847
12701
  backdrop-filter: blur(4px);
12848
12702
  animation: fadeIn 0.15s ease;
@@ -12874,7 +12728,7 @@ code {
12874
12728
  margin: 0;
12875
12729
  }
12876
12730
  .pa-command-palette__tokens .pa-badge__remove {
12877
- margin-left: 0.4rem;
12731
+ margin-inline-start: 0.4rem;
12878
12732
  padding: 0 0.4rem;
12879
12733
  border: none;
12880
12734
  background: transparent;
@@ -12910,7 +12764,7 @@ code {
12910
12764
  }
12911
12765
  .pa-command-palette__context {
12912
12766
  position: absolute;
12913
- right: calc(0.8rem + 0.8rem);
12767
+ inset-inline-end: calc(0.8rem + 0.8rem);
12914
12768
  top: 50%;
12915
12769
  transform: translateY(-50%);
12916
12770
  font-size: 1.2rem;
@@ -12934,10 +12788,7 @@ code {
12934
12788
  .pa-command-palette__results--loading::after {
12935
12789
  content: "";
12936
12790
  position: absolute;
12937
- top: 0;
12938
- left: 0;
12939
- right: 0;
12940
- bottom: 0;
12791
+ inset: 0;
12941
12792
  background-color: rgba(255, 255, 255, 0.7);
12942
12793
  pointer-events: none;
12943
12794
  z-index: 1;
@@ -13901,13 +13752,13 @@ code {
13901
13752
  min-width: 0;
13902
13753
  overflow: hidden;
13903
13754
  flex-shrink: 0;
13904
- border-left: 0 solid var(--pa-border-color);
13755
+ border-inline-start: 0 solid var(--pa-border-color);
13905
13756
  }
13906
13757
  .pa-detail-view__panel--open {
13907
13758
  width: var(--pa-local-detail-panel-width);
13908
13759
  min-width: 28rem;
13909
13760
  max-width: var(--pa-local-detail-panel-max-width);
13910
- border-left-width: 1px;
13761
+ border-inline-start-width: 1px;
13911
13762
  overflow: visible;
13912
13763
  }
13913
13764
 
@@ -13918,17 +13769,14 @@ code {
13918
13769
  .pa-detail-view--overlay .pa-detail-view__panel {
13919
13770
  position: absolute;
13920
13771
  top: 0;
13921
- right: 0;
13772
+ inset-inline-end: 0;
13922
13773
  height: 100%;
13923
13774
  z-index: 2;
13924
13775
  }
13925
13776
 
13926
13777
  .pa-detail-view__overlay {
13927
13778
  position: absolute;
13928
- top: 0;
13929
- left: 0;
13930
- width: 100%;
13931
- height: 100%;
13779
+ inset: 0;
13932
13780
  background-color: var(--pa-detail-panel-overlay-bg);
13933
13781
  z-index: 1;
13934
13782
  opacity: 0;
@@ -13942,9 +13790,7 @@ code {
13942
13790
 
13943
13791
  .pa-detail-panel--overlay {
13944
13792
  position: fixed;
13945
- top: 0;
13946
- right: 0;
13947
- height: 100vh;
13793
+ inset: 0;
13948
13794
  z-index: var(--pa-detail-panel-z-index);
13949
13795
  pointer-events: none;
13950
13796
  opacity: 0;
@@ -13970,19 +13816,25 @@ code {
13970
13816
  position: absolute;
13971
13817
  top: 0;
13972
13818
  right: 0;
13819
+ left: auto;
13973
13820
  height: 100vh;
13974
13821
  width: var(--pa-local-detail-panel-width);
13975
13822
  max-width: var(--pa-local-detail-panel-max-width);
13976
13823
  box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
13977
13824
  transform: translateX(100%);
13978
13825
  }
13826
+ [dir=rtl] .pa-detail-panel--overlay .pa-detail-panel__content {
13827
+ right: auto;
13828
+ left: 0;
13829
+ transform: translateX(-100%);
13830
+ }
13831
+ [dir=rtl] .pa-detail-panel--overlay.pa-detail-panel--open .pa-detail-panel__content {
13832
+ transform: translateX(0);
13833
+ }
13979
13834
 
13980
13835
  .pa-detail-panel__overlay {
13981
13836
  position: absolute;
13982
- top: 0;
13983
- left: 0;
13984
- width: 100vw;
13985
- height: 100vh;
13837
+ inset: 0;
13986
13838
  background-color: var(--pa-detail-panel-overlay-bg);
13987
13839
  cursor: pointer;
13988
13840
  }
@@ -14069,7 +13921,7 @@ code {
14069
13921
  .pa-detail-panel-resize {
14070
13922
  position: absolute;
14071
13923
  top: 0;
14072
- left: 0;
13924
+ inset-inline-start: 0;
14073
13925
  width: 6px;
14074
13926
  height: 100%;
14075
13927
  cursor: col-resize;
@@ -14099,9 +13951,7 @@ code {
14099
13951
  .pa-detail-panel--mobile-overlay {
14100
13952
  display: block;
14101
13953
  position: fixed;
14102
- top: 0;
14103
- right: 0;
14104
- height: 100vh;
13954
+ inset: 0;
14105
13955
  z-index: var(--pa-detail-panel-z-index);
14106
13956
  pointer-events: none;
14107
13957
  opacity: 0;
@@ -14119,18 +13969,24 @@ code {
14119
13969
  position: absolute;
14120
13970
  top: 0;
14121
13971
  right: 0;
13972
+ left: auto;
14122
13973
  height: 100vh;
14123
13974
  width: 90vw;
14124
13975
  max-width: none;
14125
13976
  box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
14126
13977
  transform: translateX(100%);
14127
13978
  }
13979
+ [dir=rtl] .pa-detail-panel--mobile-overlay .pa-detail-panel__content {
13980
+ right: auto;
13981
+ left: 0;
13982
+ transform: translateX(-100%);
13983
+ }
13984
+ [dir=rtl] .pa-detail-panel--mobile-overlay.pa-detail-panel--open .pa-detail-panel__content {
13985
+ transform: translateX(0);
13986
+ }
14128
13987
  .pa-detail-panel--mobile-overlay .pa-detail-panel__overlay {
14129
13988
  position: absolute;
14130
- top: 0;
14131
- left: 0;
14132
- width: 100vw;
14133
- height: 100vh;
13989
+ inset: 0;
14134
13990
  background-color: var(--pa-detail-panel-overlay-bg);
14135
13991
  cursor: pointer;
14136
13992
  }
@@ -14141,22 +13997,25 @@ code {
14141
13997
  ======================================== */
14142
13998
  .pa-settings-panel {
14143
13999
  position: fixed;
14144
- right: -320px;
14000
+ inset-inline-end: -320px;
14145
14001
  top: 15vh;
14146
14002
  z-index: 10000;
14147
14003
  width: 320px;
14148
- transition: right 0.3s ease;
14004
+ transition: inset-inline-end 0.3s ease;
14149
14005
  }
14150
14006
  .pa-settings-panel__toggle {
14151
14007
  position: absolute;
14152
- right: 320px;
14008
+ inset-inline-end: 320px;
14153
14009
  top: 0;
14154
14010
  width: 40px;
14155
14011
  height: 40px;
14156
14012
  background: #007bff;
14157
14013
  color: white;
14158
14014
  border: none;
14159
- border-radius: 4px 0 0 4px;
14015
+ border-start-start-radius: 4px;
14016
+ border-end-start-radius: 4px;
14017
+ border-start-end-radius: 0;
14018
+ border-end-end-radius: 0;
14160
14019
  cursor: pointer;
14161
14020
  font-size: 2rem;
14162
14021
  display: flex;
@@ -14168,13 +14027,16 @@ code {
14168
14027
  .pa-settings-panel__toggle:hover {
14169
14028
  background: rgba(0, 123, 255, 0.12);
14170
14029
  width: 45px;
14171
- right: 325px;
14030
+ inset-inline-end: 325px;
14172
14031
  }
14173
14032
  .pa-settings-panel__content {
14174
14033
  background: var(--pa-subtle-bg);
14175
14034
  border: 1px solid var(--pa-border-color);
14176
- border-right: none;
14177
- border-radius: 4px 0 0 4px;
14035
+ border-inline-end: none;
14036
+ border-start-start-radius: 4px;
14037
+ border-end-start-radius: 4px;
14038
+ border-start-end-radius: 0;
14039
+ border-end-end-radius: 0;
14178
14040
  box-shadow: -5px 0 20px rgba(0, 0, 0, 0.1);
14179
14041
  padding: 2.4rem;
14180
14042
  width: 100%;
@@ -14219,6 +14081,12 @@ code {
14219
14081
  border-color: #007bff;
14220
14082
  box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
14221
14083
  }
14084
+ .pa-settings-panel__hint {
14085
+ display: block;
14086
+ margin-top: 0.4rem;
14087
+ color: var(--pa-text-color-3);
14088
+ font-size: 1.2rem;
14089
+ }
14222
14090
  .pa-settings-panel__checkbox-group {
14223
14091
  display: flex;
14224
14092
  flex-direction: column;
@@ -14232,14 +14100,14 @@ code {
14232
14100
  font-size: 1.4rem;
14233
14101
  }
14234
14102
  .pa-settings-panel__checkbox input[type=checkbox] {
14235
- margin-right: 0.8rem;
14103
+ margin-inline-end: 0.8rem;
14236
14104
  cursor: pointer;
14237
14105
  }
14238
14106
  .pa-settings-panel__checkbox:hover {
14239
14107
  color: #007bff;
14240
14108
  }
14241
14109
  .pa-settings-panel--open {
14242
- right: 0;
14110
+ inset-inline-end: 0;
14243
14111
  }
14244
14112
  .pa-settings-panel--open .pa-settings-panel__toggle {
14245
14113
  background: rgba(0, 123, 255, 0.12);
@@ -14303,7 +14171,7 @@ code {
14303
14171
  content: "Click to copy";
14304
14172
  font-size: 1rem;
14305
14173
  opacity: 0;
14306
- margin-left: 0.8rem;
14174
+ margin-inline-start: 0.8rem;
14307
14175
  transition: opacity 0.15s;
14308
14176
  }
14309
14177
  .pa-field--copy-click .pa-field__value:hover::after {
@@ -14363,8 +14231,8 @@ code {
14363
14231
  display: flex;
14364
14232
  flex-direction: column;
14365
14233
  gap: 1.6rem;
14366
- border-left: 3px solid #007bff;
14367
- padding-left: 1.6rem;
14234
+ border-inline-start: 3px solid #007bff;
14235
+ padding-inline-start: 1.6rem;
14368
14236
  }
14369
14237
  .pa-fields--cols-2, .pa-fields--cols-3, .pa-fields--cols-4 {
14370
14238
  display: grid;
@@ -14517,52 +14385,28 @@ code {
14517
14385
  background: color-mix(in srgb, var(--pa-color-9) 10%, transparent);
14518
14386
  }
14519
14387
  .pa-fields--no-border {
14520
- border-left: none;
14521
- padding-left: 0;
14388
+ border-inline-start: none;
14389
+ padding-inline-start: 0;
14522
14390
  }
14523
14391
 
14524
14392
  /* ========================================
14525
14393
  Utility Components
14526
14394
  Font utilities, compact mode, component showcase
14527
14395
  ======================================== */
14528
- html.font-size-2xs {
14529
- font-size: 1rem;
14530
- }
14531
-
14532
- html.font-size-xs {
14533
- font-size: 1.2rem;
14534
- }
14535
-
14536
14396
  html.font-size-small {
14537
- font-size: 1.4rem;
14538
- }
14539
-
14540
- html.font-size-medium {
14541
- font-size: 1.5rem;
14397
+ font-size: 9px;
14542
14398
  }
14543
14399
 
14544
14400
  html.font-size-default {
14545
- font-size: 1.6rem;
14401
+ font-size: 10px;
14546
14402
  }
14547
14403
 
14548
14404
  html.font-size-large {
14549
- font-size: 1.8rem;
14405
+ font-size: 11px;
14550
14406
  }
14551
14407
 
14552
14408
  html.font-size-xlarge {
14553
- font-size: 2rem;
14554
- }
14555
-
14556
- html.font-size-2xl {
14557
- font-size: 2.4rem;
14558
- }
14559
-
14560
- html.font-size-3xl {
14561
- font-size: 2.8rem;
14562
- }
14563
-
14564
- html.font-size-4xl {
14565
- font-size: 3.2rem;
14409
+ font-size: 12px;
14566
14410
  }
14567
14411
 
14568
14412
  .font-family-serif {
@@ -14816,14 +14660,20 @@ html.font-size-4xl {
14816
14660
  .pa-text--secondary {
14817
14661
  color: var(--pa-text-color-2);
14818
14662
  }
14819
- .pa-text--left {
14820
- text-align: left;
14663
+ .pa-text--start {
14664
+ text-align: start;
14821
14665
  }
14822
14666
  .pa-text--center {
14823
14667
  text-align: center;
14824
14668
  }
14669
+ .pa-text--end {
14670
+ text-align: end;
14671
+ }
14672
+ .pa-text--left {
14673
+ text-align: start;
14674
+ }
14825
14675
  .pa-text--right {
14826
- text-align: right;
14676
+ text-align: end;
14827
14677
  }
14828
14678
  .pa-text--caption {
14829
14679
  font-size: 1.2rem;
@@ -15195,3 +15045,159 @@ html.font-size-4xl {
15195
15045
  .pa-border-color-9 {
15196
15046
  border-color: var(--pa-color-9);
15197
15047
  }
15048
+
15049
+ .ms-0 {
15050
+ margin-inline-start: 0;
15051
+ }
15052
+
15053
+ .ms-xs {
15054
+ margin-inline-start: 0.4rem;
15055
+ }
15056
+
15057
+ .ms-sm {
15058
+ margin-inline-start: 0.8rem;
15059
+ }
15060
+
15061
+ .ms-md {
15062
+ margin-inline-start: 1.2rem;
15063
+ }
15064
+
15065
+ .ms-base {
15066
+ margin-inline-start: 1.6rem;
15067
+ }
15068
+
15069
+ .ms-lg {
15070
+ margin-inline-start: 2.4rem;
15071
+ }
15072
+
15073
+ .ms-xl {
15074
+ margin-inline-start: 3.2rem;
15075
+ }
15076
+
15077
+ .ms-2xl {
15078
+ margin-inline-start: 4.8rem;
15079
+ }
15080
+
15081
+ .ms-auto {
15082
+ margin-inline-start: auto;
15083
+ }
15084
+
15085
+ .me-0 {
15086
+ margin-inline-end: 0;
15087
+ }
15088
+
15089
+ .me-xs {
15090
+ margin-inline-end: 0.4rem;
15091
+ }
15092
+
15093
+ .me-sm {
15094
+ margin-inline-end: 0.8rem;
15095
+ }
15096
+
15097
+ .me-md {
15098
+ margin-inline-end: 1.2rem;
15099
+ }
15100
+
15101
+ .me-base {
15102
+ margin-inline-end: 1.6rem;
15103
+ }
15104
+
15105
+ .me-lg {
15106
+ margin-inline-end: 2.4rem;
15107
+ }
15108
+
15109
+ .me-xl {
15110
+ margin-inline-end: 3.2rem;
15111
+ }
15112
+
15113
+ .me-2xl {
15114
+ margin-inline-end: 4.8rem;
15115
+ }
15116
+
15117
+ .me-auto {
15118
+ margin-inline-end: auto;
15119
+ }
15120
+
15121
+ .ps-0 {
15122
+ padding-inline-start: 0;
15123
+ }
15124
+
15125
+ .ps-xs {
15126
+ padding-inline-start: 0.4rem;
15127
+ }
15128
+
15129
+ .ps-sm {
15130
+ padding-inline-start: 0.8rem;
15131
+ }
15132
+
15133
+ .ps-md {
15134
+ padding-inline-start: 1.2rem;
15135
+ }
15136
+
15137
+ .ps-base {
15138
+ padding-inline-start: 1.6rem;
15139
+ }
15140
+
15141
+ .ps-lg {
15142
+ padding-inline-start: 2.4rem;
15143
+ }
15144
+
15145
+ .ps-xl {
15146
+ padding-inline-start: 3.2rem;
15147
+ }
15148
+
15149
+ .ps-2xl {
15150
+ padding-inline-start: 4.8rem;
15151
+ }
15152
+
15153
+ .pe-0 {
15154
+ padding-inline-end: 0;
15155
+ }
15156
+
15157
+ .pe-xs {
15158
+ padding-inline-end: 0.4rem;
15159
+ }
15160
+
15161
+ .pe-sm {
15162
+ padding-inline-end: 0.8rem;
15163
+ }
15164
+
15165
+ .pe-md {
15166
+ padding-inline-end: 1.2rem;
15167
+ }
15168
+
15169
+ .pe-base {
15170
+ padding-inline-end: 1.6rem;
15171
+ }
15172
+
15173
+ .pe-lg {
15174
+ padding-inline-end: 2.4rem;
15175
+ }
15176
+
15177
+ .pe-xl {
15178
+ padding-inline-end: 3.2rem;
15179
+ }
15180
+
15181
+ .pe-2xl {
15182
+ padding-inline-end: 4.8rem;
15183
+ }
15184
+
15185
+ .text-start {
15186
+ text-align: start;
15187
+ }
15188
+
15189
+ .text-center {
15190
+ text-align: center;
15191
+ }
15192
+
15193
+ .text-end {
15194
+ text-align: end;
15195
+ }
15196
+
15197
+ .text-left {
15198
+ text-align: start;
15199
+ }
15200
+
15201
+ .text-right {
15202
+ text-align: end;
15203
+ }