@keenmate/pure-admin-theme-minimal 1.0.0 → 1.1.1

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 (3) hide show
  1. package/dist/minimal.css +1217 -514
  2. package/package.json +7 -2
  3. package/src/scss/minimal.scss +38 -28
package/dist/minimal.css CHANGED
@@ -72,10 +72,10 @@ figure {
72
72
  body {
73
73
  margin: 0;
74
74
  padding: 0;
75
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
75
+ font-family: var(--base-font-family);
76
76
  font-size: 1.6rem;
77
- color: var(--pa-text-primary);
78
- background-color: var(--pa-primary-bg);
77
+ color: var(--pa-text-color-1);
78
+ background-color: var(--pa-main-bg);
79
79
  line-height: 1.5;
80
80
  overflow-x: hidden;
81
81
  overflow-y: scroll;
@@ -88,7 +88,7 @@ body::before {
88
88
  left: 0;
89
89
  right: 0;
90
90
  bottom: 0;
91
- background: radial-gradient(circle at 20% 80%, rgba(85, 85, 85, 0.03) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(85, 85, 85, 0.03) 0%, transparent 50%);
91
+ background: radial-gradient(circle at 20% 80%, rgba(0, 123, 255, 0.03) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(0, 123, 255, 0.03) 0%, transparent 50%);
92
92
  pointer-events: none;
93
93
  z-index: -1;
94
94
  }
@@ -114,14 +114,14 @@ label {
114
114
  }
115
115
 
116
116
  *::-webkit-scrollbar-track {
117
- background: var(--pa-primary-bg);
117
+ background: var(--pa-main-bg);
118
118
  border-radius: 3px;
119
119
  }
120
120
 
121
121
  *::-webkit-scrollbar-thumb {
122
122
  background: var(--pa-border-color);
123
123
  border-radius: 3px;
124
- border: 1px solid var(--pa-primary-bg);
124
+ border: 1px solid var(--pa-main-bg);
125
125
  }
126
126
 
127
127
  *::-webkit-scrollbar-thumb:hover {
@@ -133,13 +133,13 @@ label {
133
133
  }
134
134
 
135
135
  *::-webkit-scrollbar-corner {
136
- background: var(--pa-primary-bg);
136
+ background: var(--pa-main-bg);
137
137
  }
138
138
 
139
139
  /* Firefox */
140
140
  * {
141
141
  scrollbar-width: thin;
142
- scrollbar-color: var(--pa-border-color) var(--pa-primary-bg);
142
+ scrollbar-color: var(--pa-border-color) var(--pa-main-bg);
143
143
  }
144
144
 
145
145
  /* ========================================
@@ -249,7 +249,7 @@ body.pa-layout--sticky {
249
249
  .pa-layout {
250
250
  max-width: 100%;
251
251
  margin: 4.8rem auto 0;
252
- background-color: var(--pa-primary-bg);
252
+ background-color: var(--pa-main-bg);
253
253
  overflow: visible;
254
254
  display: flex;
255
255
  flex-direction: column;
@@ -322,7 +322,7 @@ body.pa-layout--sticky .pa-layout__inner {
322
322
  }
323
323
 
324
324
  .pa-layout__footer {
325
- min-height: 3.2rem;
325
+ min-height: 4.8rem;
326
326
  background-color: var(--pa-footer-bg);
327
327
  border-top: 1px solid var(--pa-footer-border-color);
328
328
  display: flex;
@@ -390,13 +390,13 @@ body.pa-layout--sticky .pa-layout__inner {
390
390
  Sidebar navigation with nested submenus
391
391
  ======================================== */
392
392
  :root {
393
- --pa-sidebar-width: 29rem;
394
- --pa-sidebar-min-width: 18rem;
395
- --pa-sidebar-max-width: 50rem;
393
+ --pa-local-sidebar-width: 28.8rem;
394
+ --pa-local-sidebar-min-width: 18rem;
395
+ --pa-local-sidebar-max-width: 50rem;
396
396
  }
397
397
 
398
398
  :where(.pa-layout__sidebar) {
399
- width: var(--pa-sidebar-width);
399
+ width: var(--pa-local-sidebar-width);
400
400
  }
401
401
 
402
402
  .pa-layout__sidebar {
@@ -607,7 +607,7 @@ body.loaded .pa-sidebar__chevron {
607
607
  opacity: 1;
608
608
  overflow: visible !important;
609
609
  z-index: 1050;
610
- border-right: 1px solid #e8e8e8;
610
+ border-right: 1px solid #e1e5e9;
611
611
  }
612
612
 
613
613
  .sidebar-hidden .pa-layout__sidebar--icon-collapse .pa-sidebar__item {
@@ -782,7 +782,7 @@ body.loaded .pa-sidebar__chevron {
782
782
  }
783
783
 
784
784
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse {
785
- width: 29rem;
785
+ width: 28.8rem;
786
786
  }
787
787
 
788
788
  body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__label {
@@ -927,7 +927,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
927
927
  .pa-header__dropdown li a {
928
928
  display: block;
929
929
  padding: 0.8rem 1.6rem;
930
- color: var(--pa-text-primary);
930
+ color: var(--pa-text-color-1);
931
931
  border-radius: 0;
932
932
  white-space: nowrap;
933
933
  text-decoration: none;
@@ -2762,7 +2762,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2762
2762
  .pa-card__header h4,
2763
2763
  .pa-card__header h5,
2764
2764
  .pa-card__header h6 {
2765
- color: var(--pa-text-primary);
2765
+ color: var(--pa-text-color-1);
2766
2766
  font-size: 1.6rem;
2767
2767
  }
2768
2768
 
@@ -2790,7 +2790,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2790
2790
  text-overflow: ellipsis;
2791
2791
  white-space: nowrap;
2792
2792
  margin: 0;
2793
- color: var(--pa-text-primary);
2793
+ color: var(--pa-text-color-1);
2794
2794
  font-size: 1.6rem;
2795
2795
  font-weight: 600;
2796
2796
  line-height: 1;
@@ -2832,7 +2832,7 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2832
2832
  }
2833
2833
 
2834
2834
  .pa-card__meta {
2835
- color: var(--pa-text-secondary);
2835
+ color: var(--pa-text-color-2);
2836
2836
  font-size: 1.4rem;
2837
2837
  }
2838
2838
 
@@ -2922,15 +2922,15 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2922
2922
  padding: 1.2rem 1rem;
2923
2923
  border: none;
2924
2924
  background: none;
2925
- color: var(--pa-text-secondary);
2925
+ color: var(--pa-text-color-2);
2926
2926
  cursor: pointer;
2927
2927
  transition: all 0.1s ease-out;
2928
2928
  border-bottom: 2px solid transparent;
2929
2929
  }
2930
2930
 
2931
2931
  .pa-card__tab:hover {
2932
- color: var(--pa-text-primary);
2933
- background-color: rgba(85, 85, 85, 0.05);
2932
+ color: var(--pa-text-color-1);
2933
+ background-color: rgba(0, 123, 255, 0.05);
2934
2934
  }
2935
2935
 
2936
2936
  .pa-card__tab--active {
@@ -2960,14 +2960,14 @@ body:not(.sidebar-hidden) .pa-layout__sidebar--icon-collapse .pa-sidebar__icon {
2960
2960
  border-radius: 4px;
2961
2961
  font-size: 1.4rem;
2962
2962
  background: transparent;
2963
- color: var(--pa-text-secondary);
2963
+ color: var(--pa-text-color-2);
2964
2964
  cursor: pointer;
2965
2965
  transition: all 0.1s ease-out;
2966
2966
  }
2967
2967
 
2968
2968
  .pa-card__tabs--inline .pa-card__tab:hover {
2969
- background-color: rgba(85, 85, 85, 0.05);
2970
- color: var(--pa-text-primary);
2969
+ background-color: rgba(0, 123, 255, 0.05);
2970
+ color: var(--pa-text-color-1);
2971
2971
  }
2972
2972
 
2973
2973
  .pa-card__tabs--inline .pa-card__tab--active {
@@ -2986,11 +2986,11 @@ a.pa-card:hover, a.pa-card:visited {
2986
2986
  }
2987
2987
 
2988
2988
  a.pa-card h1, a.pa-card h2, a.pa-card h3, a.pa-card h4, a.pa-card h5, a.pa-card h6 {
2989
- color: var(--pa-text-primary);
2989
+ color: var(--pa-text-color-1);
2990
2990
  }
2991
2991
 
2992
2992
  a.pa-card p {
2993
- color: var(--pa-text-secondary);
2993
+ color: var(--pa-text-color-2);
2994
2994
  }
2995
2995
 
2996
2996
  .pa-section {
@@ -2998,14 +2998,14 @@ a.pa-card p {
2998
2998
  }
2999
2999
 
3000
3000
  .pa-section h3 {
3001
- color: var(--pa-text-primary);
3001
+ color: var(--pa-text-color-1);
3002
3002
  margin-bottom: 1.6rem;
3003
3003
  border-bottom: 2px solid var(--pa-accent);
3004
3004
  padding-bottom: 0.8rem;
3005
3005
  }
3006
3006
 
3007
3007
  .pa-section-title {
3008
- color: var(--pa-text-primary);
3008
+ color: var(--pa-text-color-1);
3009
3009
  margin-bottom: 1.6rem;
3010
3010
  border-bottom: 2px solid var(--pa-accent);
3011
3011
  padding-bottom: 0.8rem;
@@ -3027,7 +3027,7 @@ a.pa-card p {
3027
3027
  padding: 0.8rem 1.2rem;
3028
3028
  border: none;
3029
3029
  background: none;
3030
- color: var(--pa-text-secondary);
3030
+ color: var(--pa-text-color-2);
3031
3031
  cursor: pointer;
3032
3032
  transition: all 0.1s ease-out;
3033
3033
  border-bottom: 2px solid transparent;
@@ -3039,13 +3039,13 @@ a.pa-card p {
3039
3039
  }
3040
3040
 
3041
3041
  .pa-tabs__item:hover {
3042
- color: var(--pa-text-primary);
3043
- background-color: rgba(85, 85, 85, 0.05);
3042
+ color: var(--pa-text-color-1);
3043
+ background-color: rgba(0, 123, 255, 0.05);
3044
3044
  }
3045
3045
 
3046
3046
  .pa-tabs__item--active {
3047
- color: #555555;
3048
- border-bottom-color: #555555;
3047
+ color: #007bff;
3048
+ border-bottom-color: #007bff;
3049
3049
  font-weight: 600;
3050
3050
  }
3051
3051
 
@@ -3074,13 +3074,13 @@ a.pa-card p {
3074
3074
  .pa-tabs--pills .pa-tabs__item {
3075
3075
  border-radius: 8px;
3076
3076
  border: 1px solid transparent;
3077
- background-color: var(--pa-primary-bg);
3077
+ background-color: var(--pa-main-bg);
3078
3078
  }
3079
3079
 
3080
3080
  .pa-tabs--pills .pa-tabs__item:hover {
3081
- background-color: rgba(85, 85, 85, 0.1);
3082
- border-color: rgba(85, 85, 85, 0.3);
3083
- color: var(--pa-text-primary);
3081
+ background-color: rgba(0, 123, 255, 0.1);
3082
+ border-color: rgba(0, 123, 255, 0.3);
3083
+ color: var(--pa-text-color-1);
3084
3084
  }
3085
3085
 
3086
3086
  .pa-tabs--pills .pa-tabs__item--active {
@@ -3093,7 +3093,7 @@ a.pa-card p {
3093
3093
  border: 1px solid var(--pa-border-color);
3094
3094
  border-radius: 8px;
3095
3095
  padding: 0.4rem;
3096
- background-color: var(--pa-primary-bg);
3096
+ background-color: var(--pa-main-bg);
3097
3097
  gap: 0.4rem;
3098
3098
  }
3099
3099
 
@@ -3105,13 +3105,13 @@ a.pa-card p {
3105
3105
  }
3106
3106
 
3107
3107
  .pa-tabs--boxed .pa-tabs__item:hover {
3108
- background-color: rgba(85, 85, 85, 0.1);
3109
- color: var(--pa-text-primary);
3108
+ background-color: rgba(0, 123, 255, 0.1);
3109
+ color: var(--pa-text-color-1);
3110
3110
  }
3111
3111
 
3112
3112
  .pa-tabs--boxed .pa-tabs__item--active {
3113
3113
  background-color: var(--pa-card-bg);
3114
- color: var(--pa-text-primary);
3114
+ color: var(--pa-text-color-1);
3115
3115
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
3116
3116
  }
3117
3117
 
@@ -3138,12 +3138,12 @@ a.pa-card p {
3138
3138
  }
3139
3139
 
3140
3140
  .pa-tabs--vertical .pa-tabs__item:hover {
3141
- background-color: rgba(85, 85, 85, 0.05);
3141
+ background-color: rgba(0, 123, 255, 0.05);
3142
3142
  }
3143
3143
 
3144
3144
  .pa-tabs--vertical .pa-tabs__item--active {
3145
- border-right-color: #555555;
3146
- background-color: rgba(85, 85, 85, 0.1);
3145
+ border-right-color: #007bff;
3146
+ background-color: rgba(0, 123, 255, 0.1);
3147
3147
  }
3148
3148
 
3149
3149
  .pa-tabs--vertical .pa-tabs__item i {
@@ -3199,8 +3199,8 @@ a.pa-card p {
3199
3199
  bottom: 0;
3200
3200
  width: 3.2rem;
3201
3201
  border: none;
3202
- background: linear-gradient(to right, color-mix(in srgb, var(--pa-primary-bg) 95%, transparent), transparent);
3203
- color: var(--pa-text-primary);
3202
+ background: linear-gradient(to right, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
3203
+ color: var(--pa-text-color-1);
3204
3204
  cursor: pointer;
3205
3205
  z-index: 1;
3206
3206
  display: flex;
@@ -3212,17 +3212,17 @@ a.pa-card p {
3212
3212
  }
3213
3213
 
3214
3214
  .pa-tabs--scrollable .pa-tabs__scroll-btn:hover {
3215
- background: linear-gradient(to right, var(--pa-primary-bg), color-mix(in srgb, var(--pa-primary-bg) 80%, transparent));
3215
+ background: linear-gradient(to right, var(--pa-main-bg), color-mix(in srgb, var(--pa-main-bg) 80%, transparent));
3216
3216
  }
3217
3217
 
3218
3218
  .pa-tabs--scrollable .pa-tabs__scroll-btn--left {
3219
3219
  left: 0;
3220
- background: linear-gradient(to right, color-mix(in srgb, var(--pa-primary-bg) 95%, transparent), transparent);
3220
+ background: linear-gradient(to right, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
3221
3221
  }
3222
3222
 
3223
3223
  .pa-tabs--scrollable .pa-tabs__scroll-btn--right {
3224
3224
  right: 0;
3225
- background: linear-gradient(to left, color-mix(in srgb, var(--pa-primary-bg) 95%, transparent), transparent);
3225
+ background: linear-gradient(to left, color-mix(in srgb, var(--pa-main-bg) 95%, transparent), transparent);
3226
3226
  }
3227
3227
 
3228
3228
  .pa-tabs--scrollable .pa-tabs__scroll-btn--visible {
@@ -3266,7 +3266,7 @@ a.pa-card p {
3266
3266
  }
3267
3267
 
3268
3268
  .pa-tabs--border-top .pa-tabs__item--active {
3269
- border-top-color: #555555;
3269
+ border-top-color: #007bff;
3270
3270
  border-bottom-color: transparent;
3271
3271
  }
3272
3272
 
@@ -3355,7 +3355,7 @@ a.pa-card p {
3355
3355
  padding: 0;
3356
3356
  border: none;
3357
3357
  background: transparent;
3358
- color: var(--pa-text-secondary);
3358
+ color: var(--pa-text-color-2);
3359
3359
  cursor: pointer;
3360
3360
  transition: all 0.1s ease-out;
3361
3361
  border-left: 1px solid var(--pa-border-color);
@@ -3365,8 +3365,8 @@ a.pa-card p {
3365
3365
  }
3366
3366
 
3367
3367
  .pa-tabs__container--card .pa-tabs__overflow-toggle:hover {
3368
- background-color: rgba(85, 85, 85, 0.05);
3369
- color: var(--pa-text-primary);
3368
+ background-color: rgba(0, 123, 255, 0.05);
3369
+ color: var(--pa-text-color-1);
3370
3370
  }
3371
3371
 
3372
3372
  .pa-tabs__container--card .pa-tabs__overflow-toggle--has-active {
@@ -3416,11 +3416,11 @@ a.pa-card p {
3416
3416
  }
3417
3417
 
3418
3418
  .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item:hover {
3419
- background-color: rgba(85, 85, 85, 0.05);
3419
+ background-color: rgba(0, 123, 255, 0.05);
3420
3420
  }
3421
3421
 
3422
3422
  .pa-tabs__container--card .pa-tabs__overflow-menu .pa-tabs__item--active {
3423
- background-color: rgba(85, 85, 85, 0.1);
3423
+ background-color: rgba(0, 123, 255, 0.1);
3424
3424
  border-bottom: none;
3425
3425
  }
3426
3426
 
@@ -3471,8 +3471,8 @@ a.pa-card p {
3471
3471
  }
3472
3472
 
3473
3473
  .pa-stat__icon--primary {
3474
- background-color: rgba(85, 85, 85, 0.1);
3475
- color: #555555;
3474
+ background-color: rgba(0, 123, 255, 0.1);
3475
+ color: #007bff;
3476
3476
  }
3477
3477
 
3478
3478
  .pa-stat__icon--success {
@@ -3497,12 +3497,12 @@ a.pa-card p {
3497
3497
  .pa-stat__number {
3498
3498
  font-size: 2.4rem;
3499
3499
  font-weight: 600;
3500
- color: var(--pa-text-primary);
3500
+ color: var(--pa-text-color-1);
3501
3501
  margin-bottom: 0.4rem;
3502
3502
  }
3503
3503
 
3504
3504
  .pa-stat__label {
3505
- color: var(--pa-text-secondary);
3505
+ color: var(--pa-text-color-2);
3506
3506
  font-size: 1.4rem;
3507
3507
  }
3508
3508
 
@@ -3517,14 +3517,14 @@ a.pa-card p {
3517
3517
  text-transform: uppercase;
3518
3518
  letter-spacing: 0.05em;
3519
3519
  font-weight: 500;
3520
- color: var(--pa-text-secondary);
3520
+ color: var(--pa-text-color-2);
3521
3521
  margin-bottom: 0.8rem;
3522
3522
  }
3523
3523
 
3524
3524
  .pa-stat--hero .pa-stat__value {
3525
3525
  font-size: 3.2rem;
3526
3526
  font-weight: 700;
3527
- color: var(--pa-text-primary);
3527
+ color: var(--pa-text-color-1);
3528
3528
  line-height: 1.1;
3529
3529
  margin-bottom: 0.8rem;
3530
3530
  }
@@ -3543,7 +3543,7 @@ a.pa-card p {
3543
3543
  }
3544
3544
 
3545
3545
  .pa-stat--hero .pa-stat__change--neutral {
3546
- color: var(--pa-text-secondary);
3546
+ color: var(--pa-text-color-2);
3547
3547
  }
3548
3548
 
3549
3549
  .pa-stat--square {
@@ -3610,7 +3610,7 @@ a.pa-card p {
3610
3610
  }
3611
3611
 
3612
3612
  .pa-stat--square.pa-stat--primary {
3613
- background-color: #555555;
3613
+ background-color: #007bff;
3614
3614
  color: #ffffff;
3615
3615
  }
3616
3616
 
@@ -3635,7 +3635,7 @@ a.pa-card p {
3635
3635
  }
3636
3636
 
3637
3637
  .pa-stat--square.pa-stat--secondary {
3638
- background-color: var(--pa-text-secondary);
3638
+ background-color: var(--pa-text-color-2);
3639
3639
  color: #ffffff;
3640
3640
  }
3641
3641
 
@@ -3763,7 +3763,7 @@ a.pa-card p {
3763
3763
 
3764
3764
  .pa-list-definition dt {
3765
3765
  font-weight: 600;
3766
- color: var(--pa-text-primary);
3766
+ color: var(--pa-text-color-1);
3767
3767
  margin-bottom: 0.4rem;
3768
3768
  margin-top: 1.6rem;
3769
3769
  }
@@ -3775,7 +3775,7 @@ a.pa-card p {
3775
3775
  .pa-list-definition dd {
3776
3776
  margin-left: 2.4rem;
3777
3777
  margin-bottom: 0.8rem;
3778
- color: var(--pa-text-secondary);
3778
+ color: var(--pa-text-color-2);
3779
3779
  line-height: 1.6;
3780
3780
  }
3781
3781
 
@@ -3812,14 +3812,14 @@ a.pa-card p {
3812
3812
  }
3813
3813
 
3814
3814
  .pa-list__item:hover {
3815
- background-color: var(--pa-primary-bg);
3815
+ background-color: var(--pa-main-bg);
3816
3816
  }
3817
3817
 
3818
3818
  .pa-list__avatar {
3819
3819
  width: 3.5rem;
3820
3820
  height: 3.5rem;
3821
3821
  border-radius: 50%;
3822
- background-color: var(--pa-primary-bg);
3822
+ background-color: var(--pa-main-bg);
3823
3823
  display: flex;
3824
3824
  align-items: center;
3825
3825
  justify-content: center;
@@ -3832,18 +3832,18 @@ a.pa-card p {
3832
3832
 
3833
3833
  .pa-list__title {
3834
3834
  font-weight: 500;
3835
- color: var(--pa-text-primary);
3835
+ color: var(--pa-text-color-1);
3836
3836
  margin-bottom: 0.4rem;
3837
3837
  }
3838
3838
 
3839
3839
  .pa-list__subtitle {
3840
- color: var(--pa-text-secondary);
3840
+ color: var(--pa-text-color-2);
3841
3841
  font-size: 1.4rem;
3842
3842
  margin-bottom: 0.4rem;
3843
3843
  }
3844
3844
 
3845
3845
  .pa-list__meta {
3846
- color: var(--pa-text-secondary);
3846
+ color: var(--pa-text-color-2);
3847
3847
  font-size: 1.2rem;
3848
3848
  }
3849
3849
 
@@ -4031,40 +4031,40 @@ a.pa-card p {
4031
4031
  Color variations for composite badges
4032
4032
  ======================================== */
4033
4033
  .pa-composite-badge--primary .pa-composite-badge__icon {
4034
- background-color: #555555;
4034
+ background-color: #007bff;
4035
4035
  color: #ffffff;
4036
4036
  }
4037
4037
 
4038
4038
  .pa-composite-badge--primary .pa-composite-badge__label {
4039
- background-color: rgba(85, 85, 85, 0.05);
4040
- color: #555555;
4039
+ background-color: rgba(0, 123, 255, 0.05);
4040
+ color: #007bff;
4041
4041
  }
4042
4042
 
4043
4043
  .pa-composite-badge--primary .pa-composite-badge__label:hover {
4044
- background-color: rgba(85, 85, 85, 0.1);
4044
+ background-color: rgba(0, 123, 255, 0.12);
4045
4045
  }
4046
4046
 
4047
4047
  .pa-composite-badge--primary .pa-composite-badge__button {
4048
- background-color: #555555;
4048
+ background-color: #007bff;
4049
4049
  color: #ffffff;
4050
4050
  }
4051
4051
 
4052
4052
  .pa-composite-badge--primary .pa-composite-badge__button:hover {
4053
- background-color: #444444;
4053
+ background-color: rgb(51, 149.4, 255);
4054
4054
  }
4055
4055
 
4056
4056
  .pa-composite-badge--primary .pa-composite-badge__button:focus {
4057
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4057
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4058
4058
  }
4059
4059
 
4060
4060
  .pa-composite-badge--secondary .pa-composite-badge__icon {
4061
- background-color: #e8e8e8;
4061
+ background-color: #6c757d;
4062
4062
  color: #ffffff;
4063
4063
  }
4064
4064
 
4065
4065
  .pa-composite-badge--secondary .pa-composite-badge__label {
4066
- background-color: #fafafa;
4067
- color: var(--pa-text-secondary);
4066
+ background-color: #f8f9fa;
4067
+ color: var(--pa-text-color-2);
4068
4068
  }
4069
4069
 
4070
4070
  .pa-composite-badge--secondary .pa-composite-badge__label:hover {
@@ -4072,16 +4072,16 @@ a.pa-card p {
4072
4072
  }
4073
4073
 
4074
4074
  .pa-composite-badge--secondary .pa-composite-badge__button {
4075
- background-color: #e8e8e8;
4075
+ background-color: #6c757d;
4076
4076
  color: #ffffff;
4077
4077
  }
4078
4078
 
4079
4079
  .pa-composite-badge--secondary .pa-composite-badge__button:hover {
4080
- background-color: #d8d8d8;
4080
+ background-color: #545b62;
4081
4081
  }
4082
4082
 
4083
4083
  .pa-composite-badge--secondary .pa-composite-badge__button:focus {
4084
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4084
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4085
4085
  }
4086
4086
 
4087
4087
  .pa-composite-badge--success .pa-composite-badge__icon {
@@ -4104,11 +4104,11 @@ a.pa-card p {
4104
4104
  }
4105
4105
 
4106
4106
  .pa-composite-badge--success .pa-composite-badge__button:hover {
4107
- background-color: #218838;
4107
+ background-color: rgb(30.1449275362, 125.8550724638, 52);
4108
4108
  }
4109
4109
 
4110
4110
  .pa-composite-badge--success .pa-composite-badge__button:focus {
4111
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4111
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4112
4112
  }
4113
4113
 
4114
4114
  .pa-composite-badge--danger .pa-composite-badge__icon {
@@ -4131,11 +4131,11 @@ a.pa-card p {
4131
4131
  }
4132
4132
 
4133
4133
  .pa-composite-badge--danger .pa-composite-badge__button:hover {
4134
- background-color: #c82333;
4134
+ background-color: rgb(189.2151898734, 32.7848101266, 47.7721518987);
4135
4135
  }
4136
4136
 
4137
4137
  .pa-composite-badge--danger .pa-composite-badge__button:focus {
4138
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4138
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4139
4139
  }
4140
4140
 
4141
4141
  .pa-composite-badge--warning .pa-composite-badge__icon {
@@ -4158,11 +4158,11 @@ a.pa-card p {
4158
4158
  }
4159
4159
 
4160
4160
  .pa-composite-badge--warning .pa-composite-badge__button:hover {
4161
- background-color: #e0a800;
4161
+ background-color: rgb(211, 158.25, 0);
4162
4162
  }
4163
4163
 
4164
4164
  .pa-composite-badge--warning .pa-composite-badge__button:focus {
4165
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4165
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4166
4166
  }
4167
4167
 
4168
4168
  .pa-composite-badge--info .pa-composite-badge__icon {
@@ -4185,38 +4185,38 @@ a.pa-card p {
4185
4185
  }
4186
4186
 
4187
4187
  .pa-composite-badge--info .pa-composite-badge__button:hover {
4188
- background-color: #138496;
4188
+ background-color: rgb(17.3333333333, 122.0869565217, 138.6666666667);
4189
4189
  }
4190
4190
 
4191
4191
  .pa-composite-badge--info .pa-composite-badge__button:focus {
4192
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4192
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4193
4193
  }
4194
4194
 
4195
4195
  .pa-composite-badge--light .pa-composite-badge__icon {
4196
4196
  background-color: #f8f9fa;
4197
- color: #333333;
4197
+ color: #2c3e50;
4198
4198
  }
4199
4199
 
4200
4200
  .pa-composite-badge--light .pa-composite-badge__label {
4201
- background-color: #fafafa;
4202
- color: #333333;
4201
+ background-color: #ffffff;
4202
+ color: #2c3e50;
4203
4203
  }
4204
4204
 
4205
4205
  .pa-composite-badge--light .pa-composite-badge__label:hover {
4206
- background-color: #e2e6ea;
4206
+ background-color: #e9ecef;
4207
4207
  }
4208
4208
 
4209
4209
  .pa-composite-badge--light .pa-composite-badge__button {
4210
4210
  background-color: #f8f9fa;
4211
- color: #333333;
4211
+ color: #2c3e50;
4212
4212
  }
4213
4213
 
4214
4214
  .pa-composite-badge--light .pa-composite-badge__button:hover {
4215
- background-color: #e2e6ea;
4215
+ background-color: #e9ecef;
4216
4216
  }
4217
4217
 
4218
4218
  .pa-composite-badge--light .pa-composite-badge__button:focus {
4219
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4219
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4220
4220
  }
4221
4221
 
4222
4222
  .pa-composite-badge--dark .pa-composite-badge__icon {
@@ -4226,11 +4226,11 @@ a.pa-card p {
4226
4226
 
4227
4227
  .pa-composite-badge--dark .pa-composite-badge__label {
4228
4228
  background-color: #f8f9fa;
4229
- color: var(--pa-text-primary);
4229
+ color: var(--pa-text-color-1);
4230
4230
  }
4231
4231
 
4232
4232
  .pa-composite-badge--dark .pa-composite-badge__label:hover {
4233
- background-color: #e8e8e8;
4233
+ background-color: #e1e5e9;
4234
4234
  }
4235
4235
 
4236
4236
  .pa-composite-badge--dark .pa-composite-badge__button {
@@ -4239,19 +4239,19 @@ a.pa-card p {
4239
4239
  }
4240
4240
 
4241
4241
  .pa-composite-badge--dark .pa-composite-badge__button:hover {
4242
- background-color: #23272b;
4242
+ background-color: #1d2124;
4243
4243
  }
4244
4244
 
4245
4245
  .pa-composite-badge--dark .pa-composite-badge__button:focus {
4246
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.1);
4246
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.12);
4247
4247
  }
4248
4248
 
4249
4249
  .pa-composite-badge--primary .pa-composite-badge__icon {
4250
- background-color: #555555;
4250
+ background-color: #007bff;
4251
4251
  }
4252
4252
 
4253
4253
  .pa-composite-badge--secondary .pa-composite-badge__icon {
4254
- background-color: #e8e8e8;
4254
+ background-color: #6c757d;
4255
4255
  }
4256
4256
 
4257
4257
  .pa-composite-badge--success .pa-composite-badge__icon {
@@ -4273,7 +4273,7 @@ a.pa-card p {
4273
4273
 
4274
4274
  .pa-composite-badge--light .pa-composite-badge__icon {
4275
4275
  background-color: #f8f9fa;
4276
- color: #333333;
4276
+ color: #2c3e50;
4277
4277
  }
4278
4278
 
4279
4279
  .pa-composite-badge--dark .pa-composite-badge__icon {
@@ -4281,21 +4281,21 @@ a.pa-card p {
4281
4281
  }
4282
4282
 
4283
4283
  .pa-composite-badge--label-primary .pa-composite-badge__label {
4284
- background-color: #bbbbbb;
4285
- color: rgb(8.5, 8.5, 8.5);
4284
+ background-color: rgb(204, 228.6, 255);
4285
+ color: rgb(0, 49.2, 102);
4286
4286
  }
4287
4287
 
4288
4288
  .pa-composite-badge--label-primary .pa-composite-badge__label:hover {
4289
- background-color: rgb(174.25, 174.25, 174.25);
4289
+ background-color: rgb(178.5, 215.4, 255);
4290
4290
  }
4291
4291
 
4292
4292
  .pa-composite-badge--label-secondary .pa-composite-badge__label {
4293
- background-color: hsl(0, 0%, 125.9803921569%);
4293
+ background-color: rgb(202.1566523605, 205.9613733906, 209.3433476395);
4294
4294
  color: #383d41;
4295
4295
  }
4296
4296
 
4297
4297
  .pa-composite-badge--label-secondary .pa-composite-badge__label:hover {
4298
- background-color: hsl(0, 0%, 120.9803921569%);
4298
+ background-color: rgb(188.4763948498, 193.2660944206, 197.5236051502);
4299
4299
  }
4300
4300
 
4301
4301
  .pa-composite-badge--label-success .pa-composite-badge__label {
@@ -4336,11 +4336,11 @@ a.pa-card p {
4336
4336
 
4337
4337
  .pa-composite-badge--label-light .pa-composite-badge__label {
4338
4338
  background-color: rgb(253.95, 254.1, 254.25);
4339
- color: #333333;
4339
+ color: #2c3e50;
4340
4340
  }
4341
4341
 
4342
4342
  .pa-composite-badge--label-light .pa-composite-badge__label:hover {
4343
- background-color: hsl(0, 0%, 125.9803921569%);
4343
+ background-color: rgb(202.1566523605, 205.9613733906, 209.3433476395);
4344
4344
  }
4345
4345
 
4346
4346
  .pa-composite-badge--label-dark .pa-composite-badge__label {
@@ -4353,27 +4353,27 @@ a.pa-card p {
4353
4353
  }
4354
4354
 
4355
4355
  .pa-composite-badge--btn-primary .pa-composite-badge__button {
4356
- background-color: #555555;
4356
+ background-color: #007bff;
4357
4357
  }
4358
4358
 
4359
4359
  .pa-composite-badge--btn-primary .pa-composite-badge__button:hover {
4360
- background-color: #444444;
4360
+ background-color: rgb(51, 149.4, 255);
4361
4361
  }
4362
4362
 
4363
4363
  .pa-composite-badge--btn-primary .pa-composite-badge__button:focus {
4364
- box-shadow: 0 0 0 2px rgba(85, 85, 85, 0.25);
4364
+ box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
4365
4365
  }
4366
4366
 
4367
4367
  .pa-composite-badge--btn-secondary .pa-composite-badge__button {
4368
- background-color: #e8e8e8;
4368
+ background-color: #6c757d;
4369
4369
  }
4370
4370
 
4371
4371
  .pa-composite-badge--btn-secondary .pa-composite-badge__button:hover {
4372
- background-color: #d8d8d8;
4372
+ background-color: #545b62;
4373
4373
  }
4374
4374
 
4375
4375
  .pa-composite-badge--btn-secondary .pa-composite-badge__button:focus {
4376
- box-shadow: 0 0 0 2px rgba(232, 232, 232, 0.25);
4376
+ box-shadow: 0 0 0 2px rgba(108, 117, 125, 0.25);
4377
4377
  }
4378
4378
 
4379
4379
  .pa-composite-badge--btn-success .pa-composite-badge__button {
@@ -4381,7 +4381,7 @@ a.pa-card p {
4381
4381
  }
4382
4382
 
4383
4383
  .pa-composite-badge--btn-success .pa-composite-badge__button:hover {
4384
- background-color: #218838;
4384
+ background-color: rgb(30.1449275362, 125.8550724638, 52);
4385
4385
  }
4386
4386
 
4387
4387
  .pa-composite-badge--btn-success .pa-composite-badge__button:focus {
@@ -4394,7 +4394,7 @@ a.pa-card p {
4394
4394
  }
4395
4395
 
4396
4396
  .pa-composite-badge--btn-warning .pa-composite-badge__button:hover {
4397
- background-color: #e0a800;
4397
+ background-color: rgb(211, 158.25, 0);
4398
4398
  }
4399
4399
 
4400
4400
  .pa-composite-badge--btn-warning .pa-composite-badge__button:focus {
@@ -4406,7 +4406,7 @@ a.pa-card p {
4406
4406
  }
4407
4407
 
4408
4408
  .pa-composite-badge--btn-info .pa-composite-badge__button:hover {
4409
- background-color: #138496;
4409
+ background-color: rgb(17.3333333333, 122.0869565217, 138.6666666667);
4410
4410
  }
4411
4411
 
4412
4412
  .pa-composite-badge--btn-info .pa-composite-badge__button:focus {
@@ -4415,11 +4415,11 @@ a.pa-card p {
4415
4415
 
4416
4416
  .pa-composite-badge--btn-light .pa-composite-badge__button {
4417
4417
  background-color: #f8f9fa;
4418
- color: #333333;
4418
+ color: #2c3e50;
4419
4419
  }
4420
4420
 
4421
4421
  .pa-composite-badge--btn-light .pa-composite-badge__button:hover {
4422
- background-color: #e2e6ea;
4422
+ background-color: #e9ecef;
4423
4423
  }
4424
4424
 
4425
4425
  .pa-composite-badge--btn-light .pa-composite-badge__button:focus {
@@ -4431,7 +4431,7 @@ a.pa-card p {
4431
4431
  }
4432
4432
 
4433
4433
  .pa-composite-badge--btn-dark .pa-composite-badge__button:hover {
4434
- background-color: #23272b;
4434
+ background-color: #1d2124;
4435
4435
  }
4436
4436
 
4437
4437
  .pa-composite-badge--btn-dark .pa-composite-badge__button:focus {
@@ -4467,7 +4467,7 @@ a.pa-card p {
4467
4467
  gap: 0.4rem;
4468
4468
  padding: 0.4rem 0.8rem;
4469
4469
  background-color: var(--pa-accent-light);
4470
- color: var(--pa-text-primary);
4470
+ color: var(--pa-text-color-1);
4471
4471
  font-size: 1.2rem;
4472
4472
  font-weight: 500;
4473
4473
  line-height: 1.2;
@@ -4624,7 +4624,7 @@ a.pa-card p {
4624
4624
  cursor: pointer;
4625
4625
  transition: all 0.1s ease-out;
4626
4626
  background: none;
4627
- color: var(--pa-text-primary);
4627
+ color: var(--pa-text-color-1);
4628
4628
  }
4629
4629
 
4630
4630
  .pa-btn:hover {
@@ -4645,11 +4645,11 @@ a.pa-card p {
4645
4645
  .pa-btn--secondary {
4646
4646
  background-color: transparent;
4647
4647
  border-color: var(--pa-border-color);
4648
- color: var(--pa-text-primary);
4648
+ color: var(--pa-text-color-1);
4649
4649
  }
4650
4650
 
4651
4651
  .pa-btn--secondary:hover {
4652
- background-color: var(--pa-primary-bg);
4652
+ background-color: var(--pa-main-bg);
4653
4653
  border-color: var(--pa-accent);
4654
4654
  }
4655
4655
 
@@ -5069,11 +5069,11 @@ a.pa-card p {
5069
5069
  }
5070
5070
 
5071
5071
  .pa-spinner--primary {
5072
- border-top-color: #555555;
5072
+ border-top-color: #007bff;
5073
5073
  }
5074
5074
 
5075
5075
  .pa-spinner--secondary {
5076
- border-top-color: #e8e8e8;
5076
+ border-top-color: #6c757d;
5077
5077
  }
5078
5078
 
5079
5079
  .pa-spinner--success {
@@ -5488,7 +5488,7 @@ a.pa-card p {
5488
5488
 
5489
5489
  .pa-tooltip--warning::before {
5490
5490
  background-color: var(--pa-btn-warning-bg);
5491
- color: var(--pa-text-primary);
5491
+ color: var(--pa-text-color-1);
5492
5492
  }
5493
5493
 
5494
5494
  .pa-tooltip--warning::after {
@@ -5826,7 +5826,7 @@ a.pa-card p {
5826
5826
  border: 1px solid var(--pa-border-color);
5827
5827
  border-radius: 50%;
5828
5828
  background-color: var(--pa-popover-content-bg);
5829
- color: var(--pa-text-secondary);
5829
+ color: var(--pa-text-color-2);
5830
5830
  font-size: 1.2rem;
5831
5831
  font-weight: 700;
5832
5832
  cursor: pointer;
@@ -5860,7 +5860,7 @@ a.pa-card p {
5860
5860
  align-items: center;
5861
5861
  justify-content: space-between;
5862
5862
  padding: 0.8rem 0.3rem 0.8rem 0.8rem;
5863
- border-bottom: 1px solid #e8e8e8;
5863
+ border-bottom: 1px solid #e1e5e9;
5864
5864
  background-color: var(--pa-card-header-bg);
5865
5865
  border-radius: 4px 4px 0 0;
5866
5866
  }
@@ -5869,14 +5869,14 @@ a.pa-card p {
5869
5869
  margin: 0;
5870
5870
  font-size: 1.8rem;
5871
5871
  font-weight: 600;
5872
- color: var(--pa-text-primary);
5872
+ color: var(--pa-text-color-1);
5873
5873
  }
5874
5874
 
5875
5875
  .pa-popover__body {
5876
5876
  padding: 1.6rem;
5877
5877
  font-size: 1.4rem;
5878
5878
  line-height: 1.5;
5879
- color: var(--pa-text-primary);
5879
+ color: var(--pa-text-color-1);
5880
5880
  text-align: left;
5881
5881
  }
5882
5882
 
@@ -5904,7 +5904,7 @@ a.pa-card p {
5904
5904
 
5905
5905
  .pa-popover__body code {
5906
5906
  padding: 0.2rem 0.4rem;
5907
- background-color: color-mix(in srgb, var(--pa-text-secondary) 15%, transparent);
5907
+ background-color: color-mix(in srgb, var(--pa-text-color-2) 15%, transparent);
5908
5908
  border-radius: 2px;
5909
5909
  font-family: monospace;
5910
5910
  font-size: 0.9em;
@@ -5915,7 +5915,7 @@ a.pa-card p {
5915
5915
  border: none;
5916
5916
  font-size: 1.8rem;
5917
5917
  line-height: 1;
5918
- color: var(--pa-text-secondary);
5918
+ color: var(--pa-text-color-2);
5919
5919
  cursor: pointer;
5920
5920
  padding: 0;
5921
5921
  width: 2.4rem;
@@ -5928,8 +5928,8 @@ a.pa-card p {
5928
5928
  }
5929
5929
 
5930
5930
  .pa-popover__close:hover {
5931
- background-color: color-mix(in srgb, var(--pa-text-secondary) 10%, transparent);
5932
- color: var(--pa-text-primary);
5931
+ background-color: color-mix(in srgb, var(--pa-text-color-2) 10%, transparent);
5932
+ color: var(--pa-text-color-1);
5933
5933
  }
5934
5934
 
5935
5935
  .pa-popover--sm .pa-popover__content {
@@ -6056,13 +6056,13 @@ a.pa-card p {
6056
6056
 
6057
6057
  .pa-alert--primary {
6058
6058
  color: var(--pa-accent);
6059
- background-color: rgba(85, 85, 85, 0.08);
6060
- border-color: rgba(85, 85, 85, 0.2);
6059
+ background-color: rgba(0, 123, 255, 0.08);
6060
+ border-color: rgba(0, 123, 255, 0.2);
6061
6061
  }
6062
6062
 
6063
6063
  .pa-alert--secondary {
6064
- color: var(--pa-text-secondary);
6065
- background-color: color-mix(in srgb, var(--pa-text-secondary) 15%, transparent);
6064
+ color: var(--pa-text-color-2);
6065
+ background-color: color-mix(in srgb, var(--pa-text-color-2) 15%, transparent);
6066
6066
  border-color: var(--pa-border-color);
6067
6067
  }
6068
6068
 
@@ -6092,15 +6092,15 @@ a.pa-card p {
6092
6092
  }
6093
6093
 
6094
6094
  .pa-alert--light {
6095
- color: var(--pa-text-primary);
6096
- background-color: color-mix(in srgb, var(--pa-text-primary) 5%, transparent);
6095
+ color: var(--pa-text-color-1);
6096
+ background-color: color-mix(in srgb, var(--pa-text-color-1) 5%, transparent);
6097
6097
  border-color: var(--pa-border-color);
6098
6098
  }
6099
6099
 
6100
6100
  .pa-alert--dark {
6101
- color: var(--pa-text-primary);
6102
- background-color: color-mix(in srgb, var(--pa-text-primary) 5%, transparent);
6103
- border-color: color-mix(in srgb, var(--pa-text-primary) 10%, transparent);
6101
+ color: var(--pa-text-color-1);
6102
+ background-color: color-mix(in srgb, var(--pa-text-color-1) 5%, transparent);
6103
+ border-color: color-mix(in srgb, var(--pa-text-color-1) 10%, transparent);
6104
6104
  }
6105
6105
 
6106
6106
  .pa-alert--outline-primary {
@@ -6254,12 +6254,12 @@ a.pa-card p {
6254
6254
 
6255
6255
  .pa-callout--primary {
6256
6256
  border-left-color: var(--pa-accent);
6257
- background-color: rgba(85, 85, 85, 0.08);
6257
+ background-color: rgba(0, 123, 255, 0.08);
6258
6258
  }
6259
6259
 
6260
6260
  .pa-callout--secondary {
6261
- border-left-color: var(--pa-text-secondary);
6262
- background-color: color-mix(in srgb, var(--pa-text-secondary) 5%, transparent);
6261
+ border-left-color: var(--pa-text-color-2);
6262
+ background-color: color-mix(in srgb, var(--pa-text-color-2) 5%, transparent);
6263
6263
  }
6264
6264
 
6265
6265
  .pa-callout--success {
@@ -6388,7 +6388,7 @@ a.pa-card p {
6388
6388
  flex-shrink: 0;
6389
6389
  padding-top: 0.8rem;
6390
6390
  margin-bottom: 0;
6391
- color: var(--pa-text-primary);
6391
+ color: var(--pa-text-color-1);
6392
6392
  font-weight: 500;
6393
6393
  font-size: 1.4rem;
6394
6394
  }
@@ -6404,7 +6404,7 @@ a.pa-card p {
6404
6404
  align-items: center;
6405
6405
  gap: 0.8rem;
6406
6406
  margin-bottom: 0.3rem;
6407
- color: var(--pa-text-primary);
6407
+ color: var(--pa-text-color-1);
6408
6408
  font-weight: 500;
6409
6409
  font-size: 1.4rem;
6410
6410
  }
@@ -6428,7 +6428,7 @@ a.pa-card p {
6428
6428
  border-radius: 4px;
6429
6429
  font-size: 1.4rem;
6430
6430
  background-color: var(--pa-input-bg);
6431
- color: var(--pa-text-primary);
6431
+ color: var(--pa-text-color-1);
6432
6432
  transition: border-color 0.1s ease-out;
6433
6433
  }
6434
6434
 
@@ -6446,7 +6446,7 @@ a.pa-card p {
6446
6446
  border-radius: 4px;
6447
6447
  font-size: 1.4rem;
6448
6448
  background-color: var(--pa-input-bg);
6449
- color: var(--pa-text-primary);
6449
+ color: var(--pa-text-color-1);
6450
6450
  transition: border-color 0.1s ease-out;
6451
6451
  }
6452
6452
 
@@ -6463,7 +6463,7 @@ a.pa-card p {
6463
6463
  border-radius: 4px;
6464
6464
  font-size: 1.4rem;
6465
6465
  background-color: var(--pa-input-bg);
6466
- color: var(--pa-text-primary);
6466
+ color: var(--pa-text-color-1);
6467
6467
  transition: border-color 0.1s ease-out;
6468
6468
  resize: vertical;
6469
6469
  min-height: 9.6rem;
@@ -6476,7 +6476,7 @@ a.pa-card p {
6476
6476
  }
6477
6477
 
6478
6478
  .pa-textarea::placeholder {
6479
- color: var(--pa-text-secondary);
6479
+ color: var(--pa-text-color-2);
6480
6480
  }
6481
6481
 
6482
6482
  .pa-input--xs,
@@ -6507,6 +6507,34 @@ a.pa-card p {
6507
6507
  font-size: 1.8rem;
6508
6508
  }
6509
6509
 
6510
+ .pa-textarea--xs {
6511
+ height: 4rem;
6512
+ min-height: 4rem;
6513
+ padding: 0.6rem 0.8rem;
6514
+ font-size: 1.2rem;
6515
+ }
6516
+
6517
+ .pa-textarea--sm {
6518
+ height: 6rem;
6519
+ min-height: 6rem;
6520
+ padding: 0.8rem 0.8rem;
6521
+ font-size: 1.4rem;
6522
+ }
6523
+
6524
+ .pa-textarea--lg {
6525
+ height: 12rem;
6526
+ min-height: 12rem;
6527
+ padding: 0.8rem 0.8rem;
6528
+ font-size: 1.6rem;
6529
+ }
6530
+
6531
+ .pa-textarea--xl {
6532
+ height: 16rem;
6533
+ min-height: 16rem;
6534
+ padding: 0.8rem 0.8rem;
6535
+ font-size: 1.8rem;
6536
+ }
6537
+
6510
6538
  .pa-mode-dark input[type=date]::-webkit-calendar-picker-indicator,
6511
6539
  .pa-mode-dark input[type=time]::-webkit-calendar-picker-indicator,
6512
6540
  .pa-mode-dark input[type=datetime-local]::-webkit-calendar-picker-indicator,
@@ -6589,7 +6617,7 @@ a.pa-card p {
6589
6617
  display: block;
6590
6618
  margin-top: 0.4rem;
6591
6619
  font-size: 1.2rem;
6592
- color: var(--pa-text-secondary);
6620
+ color: var(--pa-text-color-2);
6593
6621
  }
6594
6622
 
6595
6623
  .pa-form-help--error {
@@ -6600,6 +6628,163 @@ a.pa-card p {
6600
6628
  color: var(--pa-success-bg);
6601
6629
  }
6602
6630
 
6631
+ .pa-form-help--warning {
6632
+ color: var(--pa-warning-bg);
6633
+ }
6634
+
6635
+ .pa-form-help--color-1 {
6636
+ color: var(--pa-color-1);
6637
+ }
6638
+
6639
+ .pa-form-help--color-2 {
6640
+ color: var(--pa-color-2);
6641
+ }
6642
+
6643
+ .pa-form-help--color-3 {
6644
+ color: var(--pa-color-3);
6645
+ }
6646
+
6647
+ .pa-form-help--color-4 {
6648
+ color: var(--pa-color-4);
6649
+ }
6650
+
6651
+ .pa-form-help--color-5 {
6652
+ color: var(--pa-color-5);
6653
+ }
6654
+
6655
+ .pa-form-help--color-6 {
6656
+ color: var(--pa-color-6);
6657
+ }
6658
+
6659
+ .pa-form-help--color-7 {
6660
+ color: var(--pa-color-7);
6661
+ }
6662
+
6663
+ .pa-form-help--color-8 {
6664
+ color: var(--pa-color-8);
6665
+ }
6666
+
6667
+ .pa-form-help--color-9 {
6668
+ color: var(--pa-color-9);
6669
+ }
6670
+
6671
+ .pa-input--color-1,
6672
+ .pa-select--color-1,
6673
+ .pa-textarea--color-1 {
6674
+ border-color: var(--pa-color-1);
6675
+ }
6676
+
6677
+ .pa-input--color-1:focus,
6678
+ .pa-select--color-1:focus,
6679
+ .pa-textarea--color-1:focus {
6680
+ border-color: var(--pa-color-1);
6681
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-1) 25%, transparent);
6682
+ }
6683
+
6684
+ .pa-input--color-2,
6685
+ .pa-select--color-2,
6686
+ .pa-textarea--color-2 {
6687
+ border-color: var(--pa-color-2);
6688
+ }
6689
+
6690
+ .pa-input--color-2:focus,
6691
+ .pa-select--color-2:focus,
6692
+ .pa-textarea--color-2:focus {
6693
+ border-color: var(--pa-color-2);
6694
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-2) 25%, transparent);
6695
+ }
6696
+
6697
+ .pa-input--color-3,
6698
+ .pa-select--color-3,
6699
+ .pa-textarea--color-3 {
6700
+ border-color: var(--pa-color-3);
6701
+ }
6702
+
6703
+ .pa-input--color-3:focus,
6704
+ .pa-select--color-3:focus,
6705
+ .pa-textarea--color-3:focus {
6706
+ border-color: var(--pa-color-3);
6707
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-3) 25%, transparent);
6708
+ }
6709
+
6710
+ .pa-input--color-4,
6711
+ .pa-select--color-4,
6712
+ .pa-textarea--color-4 {
6713
+ border-color: var(--pa-color-4);
6714
+ }
6715
+
6716
+ .pa-input--color-4:focus,
6717
+ .pa-select--color-4:focus,
6718
+ .pa-textarea--color-4:focus {
6719
+ border-color: var(--pa-color-4);
6720
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-4) 25%, transparent);
6721
+ }
6722
+
6723
+ .pa-input--color-5,
6724
+ .pa-select--color-5,
6725
+ .pa-textarea--color-5 {
6726
+ border-color: var(--pa-color-5);
6727
+ }
6728
+
6729
+ .pa-input--color-5:focus,
6730
+ .pa-select--color-5:focus,
6731
+ .pa-textarea--color-5:focus {
6732
+ border-color: var(--pa-color-5);
6733
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-5) 25%, transparent);
6734
+ }
6735
+
6736
+ .pa-input--color-6,
6737
+ .pa-select--color-6,
6738
+ .pa-textarea--color-6 {
6739
+ border-color: var(--pa-color-6);
6740
+ }
6741
+
6742
+ .pa-input--color-6:focus,
6743
+ .pa-select--color-6:focus,
6744
+ .pa-textarea--color-6:focus {
6745
+ border-color: var(--pa-color-6);
6746
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-6) 25%, transparent);
6747
+ }
6748
+
6749
+ .pa-input--color-7,
6750
+ .pa-select--color-7,
6751
+ .pa-textarea--color-7 {
6752
+ border-color: var(--pa-color-7);
6753
+ }
6754
+
6755
+ .pa-input--color-7:focus,
6756
+ .pa-select--color-7:focus,
6757
+ .pa-textarea--color-7:focus {
6758
+ border-color: var(--pa-color-7);
6759
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-7) 25%, transparent);
6760
+ }
6761
+
6762
+ .pa-input--color-8,
6763
+ .pa-select--color-8,
6764
+ .pa-textarea--color-8 {
6765
+ border-color: var(--pa-color-8);
6766
+ }
6767
+
6768
+ .pa-input--color-8:focus,
6769
+ .pa-select--color-8:focus,
6770
+ .pa-textarea--color-8:focus {
6771
+ border-color: var(--pa-color-8);
6772
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-8) 25%, transparent);
6773
+ }
6774
+
6775
+ .pa-input--color-9,
6776
+ .pa-select--color-9,
6777
+ .pa-textarea--color-9 {
6778
+ border-color: var(--pa-color-9);
6779
+ }
6780
+
6781
+ .pa-input--color-9:focus,
6782
+ .pa-select--color-9:focus,
6783
+ .pa-textarea--color-9:focus {
6784
+ border-color: var(--pa-color-9);
6785
+ box-shadow: 0 0 0 3px color-mix(in srgb, var(--pa-color-9) 25%, transparent);
6786
+ }
6787
+
6603
6788
  /* ========================================
6604
6789
  Input Groups
6605
6790
  Input groups with prepend/append addons and buttons
@@ -6760,7 +6945,7 @@ a.pa-card p {
6760
6945
  transform: translateY(-50%);
6761
6946
  background: transparent;
6762
6947
  border: none;
6763
- color: var(--pa-text-secondary);
6948
+ color: var(--pa-text-color-2);
6764
6949
  cursor: pointer;
6765
6950
  padding: 0.4rem;
6766
6951
  font-size: 1.6rem;
@@ -6848,13 +7033,13 @@ a.pa-card p {
6848
7033
  position: relative;
6849
7034
  z-index: 1;
6850
7035
  background: transparent;
6851
- color: var(--pa-text-primary);
7036
+ color: var(--pa-text-color-1);
6852
7037
  }
6853
7038
 
6854
7039
  .pa-search-highlight__field {
6855
7040
  display: inline;
6856
- background-color: rgba(85, 85, 85, 0.15);
6857
- color: #555555;
7041
+ background-color: rgba(0, 123, 255, 0.15);
7042
+ color: #007bff;
6858
7043
  padding: 0.2rem 0.4rem;
6859
7044
  border-radius: 0.4rem;
6860
7045
  font-weight: 500;
@@ -6873,7 +7058,7 @@ a.pa-card p {
6873
7058
  position: absolute;
6874
7059
  z-index: 1000;
6875
7060
  background: var(--pa-input-bg);
6876
- border: 1px solid #e8e8e8;
7061
+ border: 1px solid #e1e5e9;
6877
7062
  border-radius: 4px;
6878
7063
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
6879
7064
  max-height: 24rem;
@@ -6903,7 +7088,7 @@ a.pa-card p {
6903
7088
  .pa-search-autocomplete__item-type {
6904
7089
  margin-left: auto;
6905
7090
  font-size: 1.2rem;
6906
- color: var(--pa-text-secondary);
7091
+ color: var(--pa-text-color-2);
6907
7092
  opacity: 0.7;
6908
7093
  }
6909
7094
 
@@ -6911,7 +7096,7 @@ a.pa-card p {
6911
7096
  padding: 0.4rem 1.2rem;
6912
7097
  font-size: 1.2rem;
6913
7098
  font-weight: 500;
6914
- color: var(--pa-text-secondary);
7099
+ color: var(--pa-text-color-2);
6915
7100
  text-transform: uppercase;
6916
7101
  letter-spacing: 0.05em;
6917
7102
  background-color: var(--pa-card-header-bg);
@@ -6921,18 +7106,18 @@ a.pa-card p {
6921
7106
  .pa-search-autocomplete__empty {
6922
7107
  padding: 1.2rem;
6923
7108
  text-align: center;
6924
- color: var(--pa-text-secondary);
7109
+ color: var(--pa-text-color-2);
6925
7110
  font-size: 1.4rem;
6926
7111
  }
6927
7112
 
6928
7113
  .pa-virtual-textbox {
6929
7114
  width: 100%;
6930
7115
  padding: 0.8rem 0.8rem;
6931
- border: 1px solid #e8e8e8;
7116
+ border: 1px solid #e1e5e9;
6932
7117
  border-radius: 4px;
6933
7118
  font-size: 1.4rem;
6934
7119
  background-color: var(--pa-input-bg);
6935
- color: var(--pa-text-primary);
7120
+ color: var(--pa-text-color-1);
6936
7121
  cursor: text;
6937
7122
  overflow-wrap: break-word;
6938
7123
  word-wrap: break-word;
@@ -6942,13 +7127,13 @@ a.pa-card p {
6942
7127
 
6943
7128
  .pa-virtual-textbox:focus {
6944
7129
  outline: none;
6945
- border-color: #555555;
6946
- box-shadow: 0 0 0 3px rgba(85, 85, 85, 0.05);
7130
+ border-color: #007bff;
7131
+ box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
6947
7132
  }
6948
7133
 
6949
7134
  .pa-virtual-textbox:empty::before {
6950
7135
  content: attr(data-placeholder);
6951
- color: var(--pa-text-secondary);
7136
+ color: var(--pa-text-color-2);
6952
7137
  opacity: 0.7;
6953
7138
  pointer-events: none;
6954
7139
  }
@@ -6984,7 +7169,7 @@ a.pa-card p {
6984
7169
  border: 1px solid transparent;
6985
7170
  border-radius: 4px;
6986
7171
  font-size: 1.4rem;
6987
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
7172
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
6988
7173
  white-space: pre-wrap;
6989
7174
  word-wrap: break-word;
6990
7175
  pointer-events: none;
@@ -6999,13 +7184,13 @@ a.pa-card p {
6999
7184
  z-index: 2;
7000
7185
  width: 100%;
7001
7186
  padding: 0.8rem 0.8rem;
7002
- border: 1px solid #e8e8e8;
7187
+ border: 1px solid #e1e5e9;
7003
7188
  border-radius: 4px;
7004
7189
  font-size: 1.4rem;
7005
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
7190
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
7006
7191
  background: transparent;
7007
7192
  color: transparent;
7008
- caret-color: var(--pa-text-primary);
7193
+ caret-color: var(--pa-text-color-1);
7009
7194
  resize: none;
7010
7195
  overflow: hidden;
7011
7196
  line-height: 1.5;
@@ -7015,12 +7200,12 @@ a.pa-card p {
7015
7200
 
7016
7201
  .pa-inline-query-editor__input:focus {
7017
7202
  outline: none;
7018
- border-color: #555555;
7019
- box-shadow: 0 0 0 3px rgba(85, 85, 85, 0.05);
7203
+ border-color: #007bff;
7204
+ box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
7020
7205
  }
7021
7206
 
7022
7207
  .pa-inline-query-editor__input::placeholder {
7023
- color: var(--pa-text-secondary);
7208
+ color: var(--pa-text-color-2);
7024
7209
  opacity: 0.7;
7025
7210
  }
7026
7211
 
@@ -7030,29 +7215,29 @@ a.pa-card p {
7030
7215
  }
7031
7216
 
7032
7217
  .pa-inline-query-token--field {
7033
- background-color: rgba(85, 85, 85, 0.15);
7034
- color: var(--pa-text-primary);
7218
+ background-color: rgba(0, 123, 255, 0.15);
7219
+ color: var(--pa-text-color-1);
7035
7220
  }
7036
7221
 
7037
7222
  .pa-inline-query-token--field.pa-inline-query-token--invalid {
7038
7223
  background-color: rgba(220, 53, 69, 0.15);
7039
- color: var(--pa-text-primary);
7224
+ color: var(--pa-text-color-1);
7040
7225
  text-decoration: wavy underline;
7041
7226
  }
7042
7227
 
7043
7228
  .pa-inline-query-token--operator {
7044
- background-color: rgba(var(--pa-text-secondary), 0.15);
7045
- color: var(--pa-text-primary);
7229
+ background-color: rgba(var(--pa-text-color-2), 0.15);
7230
+ color: var(--pa-text-color-1);
7046
7231
  }
7047
7232
 
7048
7233
  .pa-inline-query-token--value {
7049
7234
  background-color: rgba(40, 167, 69, 0.15);
7050
- color: var(--pa-text-primary);
7235
+ color: var(--pa-text-color-1);
7051
7236
  }
7052
7237
 
7053
7238
  .pa-inline-query-token--keyword {
7054
7239
  background-color: rgba(255, 193, 7, 0.15);
7055
- color: var(--pa-text-primary);
7240
+ color: var(--pa-text-color-1);
7056
7241
  font-style: italic;
7057
7242
  }
7058
7243
 
@@ -7060,7 +7245,7 @@ a.pa-card p {
7060
7245
  position: absolute;
7061
7246
  z-index: 1000;
7062
7247
  background: var(--pa-input-bg);
7063
- border: 1px solid #e8e8e8;
7248
+ border: 1px solid #e1e5e9;
7064
7249
  border-radius: 4px;
7065
7250
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
7066
7251
  max-height: 24rem;
@@ -7096,14 +7281,14 @@ a.pa-card p {
7096
7281
  .pa-inline-query-autocomplete__item-name {
7097
7282
  display: block;
7098
7283
  font-weight: 500;
7099
- color: #555555;
7284
+ color: #007bff;
7100
7285
  line-height: 1.3;
7101
7286
  }
7102
7287
 
7103
7288
  .pa-inline-query-autocomplete__item-type {
7104
7289
  display: block;
7105
7290
  font-size: 1.2rem;
7106
- color: var(--pa-text-secondary);
7291
+ color: var(--pa-text-color-2);
7107
7292
  opacity: 0.7;
7108
7293
  line-height: 1.3;
7109
7294
  }
@@ -7112,10 +7297,10 @@ a.pa-card p {
7112
7297
  flex-shrink: 0;
7113
7298
  font-size: 1.2rem;
7114
7299
  padding: 0.2rem 0.6rem;
7115
- background-color: rgba(var(--pa-text-secondary), 0.1);
7116
- color: var(--pa-text-secondary);
7300
+ background-color: rgba(var(--pa-text-color-2), 0.1);
7301
+ color: var(--pa-text-color-2);
7117
7302
  border-radius: 0.4rem;
7118
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
7303
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
7119
7304
  }
7120
7305
 
7121
7306
  /* ========================================
@@ -7135,7 +7320,7 @@ a.pa-card p {
7135
7320
  gap: 0.8rem;
7136
7321
  cursor: pointer;
7137
7322
  font-size: 1.4rem;
7138
- color: var(--pa-text-primary);
7323
+ color: var(--pa-text-color-1);
7139
7324
  user-select: none;
7140
7325
  }
7141
7326
 
@@ -7276,7 +7461,7 @@ input:indeterminate + .pa-checkbox__box::after {
7276
7461
  gap: 0.8rem;
7277
7462
  cursor: pointer;
7278
7463
  font-size: 1.4rem;
7279
- color: var(--pa-text-primary);
7464
+ color: var(--pa-text-color-1);
7280
7465
  }
7281
7466
 
7282
7467
  .pa-radio input {
@@ -7326,12 +7511,12 @@ input:indeterminate + .pa-checkbox__box::after {
7326
7511
  web-daterangepicker {
7327
7512
  /* ===== BASE PRIMITIVES ===== */
7328
7513
  /* Colors */
7329
- --drp-accent-color: #555555;
7330
- --drp-primary-bg: #555555;
7331
- --drp-primary-bg-hover: #444444;
7332
- --drp-text-primary: var(--pa-text-primary);
7333
- --drp-text-secondary: var(--pa-text-secondary);
7334
- --drp-border-color: #e8e8e8;
7514
+ --drp-accent-color: #007bff;
7515
+ --drp-primary-bg: #007bff;
7516
+ --drp-primary-bg-hover: rgb(51, 149.4, 255);
7517
+ --drp-text-primary: var(--pa-text-color-1);
7518
+ --drp-text-secondary: var(--pa-text-color-2);
7519
+ --drp-border-color: #e1e5e9;
7335
7520
  --drp-card-bg: var(--pa-card-bg);
7336
7521
  --drp-hover-bg: #f8f9fa;
7337
7522
  /* Spacing */
@@ -7369,18 +7554,18 @@ web-daterangepicker {
7369
7554
  /* ===== INPUT FIELD SEMANTIC VARIABLES ===== */
7370
7555
  /* Input colors */
7371
7556
  --drp-input-background: var(--pa-input-bg);
7372
- --drp-input-color: var(--pa-text-primary);
7373
- --drp-input-border-color: 1px solid #e8e8e8;
7374
- --drp-input-border-color-hover: #555555;
7375
- --drp-input-border-color-focus: #555555;
7376
- --drp-input-placeholder-color: var(--pa-text-secondary);
7557
+ --drp-input-color: var(--pa-text-color-1);
7558
+ --drp-input-border-color: #ced4da;
7559
+ --drp-input-border-color-hover: #007bff;
7560
+ --drp-input-border-color-focus: #007bff;
7561
+ --drp-input-placeholder-color: var(--pa-text-color-2);
7377
7562
  --drp-input-disabled-background: var(--pa-input-bg);
7378
- --drp-input-disabled-color: var(--pa-text-secondary);
7563
+ --drp-input-disabled-color: var(--pa-text-color-2);
7379
7564
  /* Input focus effects */
7380
- --drp-input-focus-shadow-color: rgba(85, 85, 85, 0.05);
7565
+ --drp-input-focus-shadow-color: rgba(0, 123, 255, 0.05);
7381
7566
  --drp-input-focus-shadow-size: 3px;
7382
7567
  /* Input icon */
7383
- --drp-input-icon-color: var(--pa-text-secondary);
7568
+ --drp-input-icon-color: var(--pa-text-color-2);
7384
7569
  --drp-input-icon-opacity: 1;
7385
7570
  /* Input size variants - matched to Pure Admin .pa-input sizes (10px base)
7386
7571
  Heights: xs=31px, sm=33px, md=35px, lg=38px, xl=41px */
@@ -7416,7 +7601,7 @@ web-daterangepicker {
7416
7601
  --drp-input-size-xl-icon-size: 2rem; /* 20px (10px base) */
7417
7602
  /* ===== CALENDAR CONTAINER ===== */
7418
7603
  --drp-calendar-bg: var(--pa-card-bg);
7419
- --drp-calendar-border: #e8e8e8;
7604
+ --drp-calendar-border: #e1e5e9;
7420
7605
  --drp-calendar-shadow: 0 0 60px rgba(0, 0, 0, 0.12);
7421
7606
  --drp-calendar-border-radius: 4px;
7422
7607
  --drp-calendar-padding: 1.6rem;
@@ -7425,49 +7610,49 @@ web-daterangepicker {
7425
7610
  --drp-header-padding: 0.8rem 1.2rem;
7426
7611
  --drp-header-font-size: 1.6rem;
7427
7612
  --drp-header-font-weight: 600;
7428
- --drp-header-text-color: var(--pa-text-primary);
7429
- --drp-header-bg-hover: rgba(85, 85, 85, 0.1);
7430
- --drp-header-bg-active: rgba(85, 85, 85, 0.05);
7613
+ --drp-header-text-color: var(--pa-text-color-1);
7614
+ --drp-header-bg-hover: rgba(0, 123, 255, 0.12);
7615
+ --drp-header-bg-active: rgba(0, 123, 255, 0.05);
7431
7616
  /* ===== NAVIGATION ===== */
7432
7617
  --drp-nav-btn-size: 3.2rem; /* 32px (10px base) */
7433
- --drp-nav-text-color: var(--pa-text-primary);
7434
- --drp-nav-border-color: #e8e8e8;
7435
- --drp-nav-bg-hover: rgba(85, 85, 85, 0.1);
7436
- --drp-nav-bg-active: rgba(85, 85, 85, 0.05);
7437
- --drp-nav-border-hover: #555555;
7618
+ --drp-nav-text-color: var(--pa-text-color-1);
7619
+ --drp-nav-border-color: #e1e5e9;
7620
+ --drp-nav-bg-hover: rgba(0, 123, 255, 0.12);
7621
+ --drp-nav-bg-active: rgba(0, 123, 255, 0.05);
7622
+ --drp-nav-border-hover: #007bff;
7438
7623
  /* ===== WEEKDAY HEADER ===== */
7439
7624
  --drp-weekday-font-size: 1.2rem;
7440
7625
  --drp-weekday-font-weight: 600;
7441
- --drp-weekday-color: var(--pa-text-secondary);
7626
+ --drp-weekday-color: var(--pa-text-color-2);
7442
7627
  --drp-weekday-padding: 0.4rem;
7443
7628
  /* ===== CALENDAR GRID ===== */
7444
7629
  --drp-day-size: 3.6rem; /* 36px (10px base) */
7445
7630
  --drp-day-font-size: 1.4rem;
7446
7631
  --drp-day-border-radius: 2px;
7447
7632
  /* Day states */
7448
- --drp-day-text-color: var(--pa-text-primary);
7449
- --drp-day-bg-hover: rgba(85, 85, 85, 0.1);
7633
+ --drp-day-text-color: var(--pa-text-color-1);
7634
+ --drp-day-bg-hover: rgba(0, 123, 255, 0.12);
7450
7635
  --drp-day-border-hover: transparent;
7451
7636
  /* Today indicator */
7452
- --drp-day-today-border: #555555;
7637
+ --drp-day-today-border: #007bff;
7453
7638
  /* Selected state */
7454
- --drp-day-selected-bg: #555555;
7639
+ --drp-day-selected-bg: #007bff;
7455
7640
  --drp-day-selected-color: #ffffff;
7456
7641
  /* Range state */
7457
- --drp-day-range-bg: rgba(85, 85, 85, 0.05);
7458
- --drp-day-range-text: var(--pa-text-primary);
7642
+ --drp-day-range-bg: rgba(0, 123, 255, 0.05);
7643
+ --drp-day-range-text: var(--pa-text-color-1);
7459
7644
  /* Focused state */
7460
- --drp-day-focused-outline: #555555;
7645
+ --drp-day-focused-outline: #007bff;
7461
7646
  /* Disabled state */
7462
- --drp-day-disabled-color: var(--pa-text-secondary);
7647
+ --drp-day-disabled-color: var(--pa-text-color-2);
7463
7648
  --drp-day-disabled-opacity: 0.65;
7464
7649
  /* Other month */
7465
- --drp-day-other-month-color: var(--pa-text-secondary);
7650
+ --drp-day-other-month-color: var(--pa-text-color-2);
7466
7651
  --drp-day-other-month-opacity: 0.5;
7467
7652
  /* ===== BADGES ===== */
7468
7653
  /* Dot badges (original style) */
7469
7654
  --drp-badge-size: 0.6rem; /* 6px (10px base) */
7470
- --drp-badge-primary: #555555;
7655
+ --drp-badge-primary: #007bff;
7471
7656
  --drp-badge-success: #28a745;
7472
7657
  --drp-badge-warning: #ffc107;
7473
7658
  --drp-badge-danger: #dc3545;
@@ -7476,40 +7661,40 @@ web-daterangepicker {
7476
7661
  --drp-badge-number-bg: #dc3545;
7477
7662
  --drp-badge-number-color: #ffffff;
7478
7663
  /* Count badges */
7479
- --drp-badge-count-bg: #555555;
7664
+ --drp-badge-count-bg: #007bff;
7480
7665
  --drp-badge-count-color: #ffffff;
7481
7666
  /* Text badges */
7482
- --drp-badge-text-bg: rgba(85, 85, 85, 0.05);
7483
- --drp-badge-text-color: var(--pa-text-primary);
7667
+ --drp-badge-text-bg: rgba(0, 123, 255, 0.05);
7668
+ --drp-badge-text-color: var(--pa-text-color-1);
7484
7669
  /* ===== SUMMARY BAR ===== */
7485
- --drp-summary-bg: #fafafa;
7486
- --drp-summary-border-color: #e8e8e8;
7487
- --drp-summary-text-color: var(--pa-text-primary);
7488
- --drp-summary-count-color: #555555;
7670
+ --drp-summary-bg: #f8f9fa;
7671
+ --drp-summary-border-color: #e1e5e9;
7672
+ --drp-summary-text-color: var(--pa-text-color-1);
7673
+ --drp-summary-count-color: #007bff;
7489
7674
  --drp-summary-padding: 0.8rem 1.2rem;
7490
7675
  --drp-summary-font-size: 1.4rem;
7491
7676
  --drp-summary-font-weight: 500;
7492
7677
  /* ===== BUTTONS ===== */
7493
7678
  /* Today button */
7494
- --drp-button-today-bg: #e8e8e8;
7495
- --drp-button-today-bg-hover: #d8d8d8;
7679
+ --drp-button-today-bg: #6c757d;
7680
+ --drp-button-today-bg-hover: #545b62;
7496
7681
  --drp-button-today-color: #ffffff;
7497
- --drp-button-today-border: #e8e8e8;
7682
+ --drp-button-today-border: #e1e5e9;
7498
7683
  /* Clear button */
7499
- --drp-button-clear-bg: #e8e8e8;
7500
- --drp-button-clear-bg-hover: #d8d8d8;
7684
+ --drp-button-clear-bg: #6c757d;
7685
+ --drp-button-clear-bg-hover: #545b62;
7501
7686
  --drp-button-clear-color: #ffffff;
7502
- --drp-button-clear-border: #e8e8e8;
7687
+ --drp-button-clear-border: #e1e5e9;
7503
7688
  /* Cancel button */
7504
- --drp-button-cancel-bg: #e8e8e8;
7505
- --drp-button-cancel-bg-hover: #d8d8d8;
7689
+ --drp-button-cancel-bg: #6c757d;
7690
+ --drp-button-cancel-bg-hover: #545b62;
7506
7691
  --drp-button-cancel-color: #ffffff;
7507
- --drp-button-cancel-border: #e8e8e8;
7692
+ --drp-button-cancel-border: #e1e5e9;
7508
7693
  /* Apply button */
7509
- --drp-button-apply-bg: #555555;
7510
- --drp-button-apply-bg-hover: #444444;
7694
+ --drp-button-apply-bg: #007bff;
7695
+ --drp-button-apply-bg-hover: rgb(51, 149.4, 255);
7511
7696
  --drp-button-apply-color: #ffffff;
7512
- --drp-button-apply-border: #555555;
7697
+ --drp-button-apply-border: #007bff;
7513
7698
  /* Button sizing */
7514
7699
  --drp-button-padding: 0.8rem 1rem;
7515
7700
  --drp-button-font-size: 1.4rem;
@@ -7517,26 +7702,26 @@ web-daterangepicker {
7517
7702
  --drp-button-gap: 0.8rem;
7518
7703
  /* ===== UNIFIED NAVIGATION ===== */
7519
7704
  /* Range selectors in unified nav */
7520
- --drp-unified-range-text-color: var(--pa-text-primary);
7521
- --drp-unified-range-bg-hover: rgba(85, 85, 85, 0.1);
7522
- --drp-unified-range-bg-active: rgba(85, 85, 85, 0.05);
7705
+ --drp-unified-range-text-color: var(--pa-text-color-1);
7706
+ --drp-unified-range-bg-hover: rgba(0, 123, 255, 0.12);
7707
+ --drp-unified-range-bg-active: rgba(0, 123, 255, 0.05);
7523
7708
  /* Month/Year display */
7524
- --drp-unified-month-color: var(--pa-text-primary);
7709
+ --drp-unified-month-color: var(--pa-text-color-1);
7525
7710
  /* Rolling selector disabled state */
7526
- --drp-unified-rolling-disabled-color: var(--pa-text-secondary);
7711
+ --drp-unified-rolling-disabled-color: var(--pa-text-color-2);
7527
7712
  /* ===== ROLLING SELECTOR ===== */
7528
7713
  --drp-rolling-bg: var(--pa-card-bg);
7529
- --drp-rolling-border: #e8e8e8;
7714
+ --drp-rolling-border: #e1e5e9;
7530
7715
  --drp-rolling-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
7531
- --drp-rolling-item-hover-bg: rgba(85, 85, 85, 0.1);
7532
- --drp-rolling-item-selected-bg: #555555;
7716
+ --drp-rolling-item-hover-bg: rgba(0, 123, 255, 0.12);
7717
+ --drp-rolling-item-selected-bg: #007bff;
7533
7718
  --drp-rolling-item-selected-text: #ffffff;
7534
7719
  --drp-rolling-font-size: 1.4rem;
7535
- --drp-rolling-item-text-color: var(--pa-text-primary);
7536
- --drp-rolling-item-disabled-color: var(--pa-text-secondary);
7720
+ --drp-rolling-item-text-color: var(--pa-text-color-1);
7721
+ --drp-rolling-item-disabled-color: var(--pa-text-color-2);
7537
7722
  /* ===== LOADING OVERLAY ===== */
7538
7723
  --drp-loading-bg: rgba(255, 255, 255, 0.8);
7539
- --drp-loading-spinner-color: #555555;
7724
+ --drp-loading-spinner-color: #007bff;
7540
7725
  --drp-loading-spinner-size: 1.6rem;
7541
7726
  /* ===== MULTIPLE MONTHS ===== */
7542
7727
  --drp-months-gap: 2.4rem;
@@ -7566,7 +7751,7 @@ web-daterangepicker {
7566
7751
 
7567
7752
  .pa-file-input__filename {
7568
7753
  font-size: 1.4rem;
7569
- color: var(--pa-text-secondary);
7754
+ color: var(--pa-text-color-2);
7570
7755
  overflow: hidden;
7571
7756
  text-overflow: ellipsis;
7572
7757
  white-space: nowrap;
@@ -7574,7 +7759,7 @@ web-daterangepicker {
7574
7759
 
7575
7760
  .pa-file-dropzone {
7576
7761
  position: relative;
7577
- border: 3.2px dashed #e8e8e8;
7762
+ border: 3.2px dashed #e1e5e9;
7578
7763
  border-radius: 4px;
7579
7764
  padding: 3.2rem;
7580
7765
  text-align: center;
@@ -7584,13 +7769,13 @@ web-daterangepicker {
7584
7769
  }
7585
7770
 
7586
7771
  .pa-file-dropzone:hover {
7587
- border-color: #555555;
7588
- background: rgba(85, 85, 85, 0.05);
7772
+ border-color: #007bff;
7773
+ background: rgba(0, 123, 255, 0.05);
7589
7774
  }
7590
7775
 
7591
7776
  .pa-file-dropzone--active {
7592
- border-color: #555555;
7593
- background: rgba(85, 85, 85, 0.1);
7777
+ border-color: #007bff;
7778
+ background: rgba(0, 123, 255, 0.1);
7594
7779
  border-style: solid;
7595
7780
  }
7596
7781
 
@@ -7616,27 +7801,27 @@ web-daterangepicker {
7616
7801
 
7617
7802
  .pa-file-dropzone__text {
7618
7803
  font-size: 1.6rem;
7619
- color: var(--pa-text-primary);
7804
+ color: var(--pa-text-color-1);
7620
7805
  margin-bottom: 0.4rem;
7621
7806
  }
7622
7807
 
7623
7808
  .pa-file-dropzone__text strong {
7624
- color: #555555;
7809
+ color: #007bff;
7625
7810
  font-weight: 600;
7626
7811
  }
7627
7812
 
7628
7813
  .pa-file-dropzone__hint {
7629
7814
  font-size: 1.2rem;
7630
- color: var(--pa-text-secondary);
7815
+ color: var(--pa-text-color-2);
7631
7816
  }
7632
7817
 
7633
7818
  .pa-file-dropzone__drop-prompt {
7634
7819
  padding: 1.2rem;
7635
- border-bottom: 1.6px dashed #e8e8e8;
7820
+ border-bottom: 1.6px dashed #e1e5e9;
7636
7821
  margin: -3.2rem -3.2rem 1.2rem -3.2rem;
7637
7822
  text-align: center;
7638
7823
  font-size: 1.4rem;
7639
- color: var(--pa-text-secondary);
7824
+ color: var(--pa-text-color-2);
7640
7825
  }
7641
7826
 
7642
7827
  .pa-file-dropzone__drop-prompt-icon {
@@ -7666,7 +7851,7 @@ web-daterangepicker {
7666
7851
  }
7667
7852
 
7668
7853
  .pa-file-dropzone__file-card:hover {
7669
- border-color: #555555;
7854
+ border-color: #007bff;
7670
7855
  box-shadow: 0 1.6px 4.8px rgba(0, 0, 0, 0.1);
7671
7856
  }
7672
7857
 
@@ -7677,7 +7862,7 @@ web-daterangepicker {
7677
7862
 
7678
7863
  .pa-file-dropzone__file-card-name {
7679
7864
  font-size: 1rem;
7680
- color: var(--pa-text-primary);
7865
+ color: var(--pa-text-color-1);
7681
7866
  overflow: hidden;
7682
7867
  text-overflow: ellipsis;
7683
7868
  white-space: nowrap;
@@ -7687,7 +7872,7 @@ web-daterangepicker {
7687
7872
 
7688
7873
  .pa-file-dropzone__file-card-size {
7689
7874
  font-size: 1rem;
7690
- color: var(--pa-text-secondary);
7875
+ color: var(--pa-text-color-2);
7691
7876
  margin-top: 0.4rem;
7692
7877
  }
7693
7878
 
@@ -7777,7 +7962,7 @@ web-daterangepicker {
7777
7962
  border: none;
7778
7963
  background: transparent;
7779
7964
  font-size: 1.6rem;
7780
- color: var(--pa-text-secondary);
7965
+ color: var(--pa-text-color-2);
7781
7966
  }
7782
7967
 
7783
7968
  .pa-file-dropzone__summary-line {
@@ -7790,7 +7975,7 @@ web-daterangepicker {
7790
7975
  }
7791
7976
 
7792
7977
  .pa-file-dropzone__summary-line:hover {
7793
- background-color: rgba(85, 85, 85, 0.1);
7978
+ background-color: rgba(0, 123, 255, 0.1);
7794
7979
  }
7795
7980
 
7796
7981
  .pa-file-dropzone__summary-line:not(:last-child)::after {
@@ -7803,11 +7988,11 @@ web-daterangepicker {
7803
7988
 
7804
7989
  .pa-file-dropzone__summary-count {
7805
7990
  font-weight: 500;
7806
- color: #555555;
7991
+ color: #007bff;
7807
7992
  }
7808
7993
 
7809
7994
  .pa-file-dropzone__summary-size {
7810
- color: var(--pa-text-secondary);
7995
+ color: var(--pa-text-color-2);
7811
7996
  font-weight: normal;
7812
7997
  }
7813
7998
 
@@ -7815,7 +8000,7 @@ web-daterangepicker {
7815
8000
  display: block;
7816
8001
  margin-top: 0.4rem;
7817
8002
  font-style: italic;
7818
- color: var(--pa-text-primary);
8003
+ color: var(--pa-text-color-1);
7819
8004
  overflow: hidden;
7820
8005
  text-overflow: ellipsis;
7821
8006
  white-space: nowrap;
@@ -7866,7 +8051,7 @@ web-daterangepicker {
7866
8051
  .pa-file-popover__title {
7867
8052
  font-size: 1.6rem;
7868
8053
  font-weight: 600;
7869
- color: var(--pa-text-primary);
8054
+ color: var(--pa-text-color-1);
7870
8055
  }
7871
8056
 
7872
8057
  .pa-file-popover__close {
@@ -7874,7 +8059,7 @@ web-daterangepicker {
7874
8059
  height: 2.4rem;
7875
8060
  border: none;
7876
8061
  background: transparent;
7877
- color: var(--pa-text-secondary);
8062
+ color: var(--pa-text-color-2);
7878
8063
  cursor: pointer;
7879
8064
  border-radius: 2px;
7880
8065
  font-size: 2rem;
@@ -7886,8 +8071,8 @@ web-daterangepicker {
7886
8071
  }
7887
8072
 
7888
8073
  .pa-file-popover__close:hover {
7889
- background: rgba(var(--pa-text-secondary), 0.1);
7890
- color: var(--pa-text-primary);
8074
+ background: rgba(var(--pa-text-color-2), 0.1);
8075
+ color: var(--pa-text-color-1);
7891
8076
  }
7892
8077
 
7893
8078
  .pa-file-popover__body {
@@ -7913,7 +8098,7 @@ web-daterangepicker {
7913
8098
  text-align: left;
7914
8099
  padding: 0.4rem 0.8rem;
7915
8100
  border-bottom: 1px solid var(--pa-border-color);
7916
- color: var(--pa-text-secondary);
8101
+ color: var(--pa-text-color-2);
7917
8102
  font-weight: 600;
7918
8103
  font-size: 1.2rem;
7919
8104
  text-transform: uppercase;
@@ -7922,15 +8107,15 @@ web-daterangepicker {
7922
8107
  .pa-file-popover__table td {
7923
8108
  padding: 0.4rem 0.8rem;
7924
8109
  border-bottom: 1px solid var(--pa-border-color);
7925
- color: var(--pa-text-primary);
8110
+ color: var(--pa-text-color-1);
7926
8111
  }
7927
8112
 
7928
8113
  .pa-file-popover__table tbody tr:hover {
7929
- background: rgba(85, 85, 85, 0.05);
8114
+ background: rgba(0, 123, 255, 0.05);
7930
8115
  }
7931
8116
 
7932
8117
  .pa-file-popover__table tbody tr.uploading {
7933
- background: rgba(85, 85, 85, 0.1);
8118
+ background: rgba(0, 123, 255, 0.1);
7934
8119
  }
7935
8120
 
7936
8121
  .pa-file-popover__file-name {
@@ -7941,7 +8126,7 @@ web-daterangepicker {
7941
8126
  }
7942
8127
 
7943
8128
  .pa-file-popover__file-size {
7944
- color: var(--pa-text-secondary);
8129
+ color: var(--pa-text-color-2);
7945
8130
  white-space: nowrap;
7946
8131
  }
7947
8132
 
@@ -7951,7 +8136,7 @@ web-daterangepicker {
7951
8136
 
7952
8137
  .pa-file-popover__progress-bar {
7953
8138
  height: 6.4px;
7954
- background: rgba(85, 85, 85, 0.2);
8139
+ background: rgba(0, 123, 255, 0.2);
7955
8140
  border-radius: 2px;
7956
8141
  overflow: hidden;
7957
8142
  margin-bottom: 0.4rem;
@@ -7959,14 +8144,14 @@ web-daterangepicker {
7959
8144
 
7960
8145
  .pa-file-popover__progress-fill {
7961
8146
  height: 100%;
7962
- background: #555555;
8147
+ background: #007bff;
7963
8148
  border-radius: 2px;
7964
8149
  transition: width 0.48s ease;
7965
8150
  }
7966
8151
 
7967
8152
  .pa-file-popover__progress-text {
7968
8153
  font-size: 1rem;
7969
- color: var(--pa-text-secondary);
8154
+ color: var(--pa-text-color-2);
7970
8155
  }
7971
8156
 
7972
8157
  .pa-file-popover__status {
@@ -7976,11 +8161,11 @@ web-daterangepicker {
7976
8161
  }
7977
8162
 
7978
8163
  .pa-file-popover__status--pending {
7979
- color: var(--pa-text-secondary);
8164
+ color: var(--pa-text-color-2);
7980
8165
  }
7981
8166
 
7982
8167
  .pa-file-popover__status--uploading {
7983
- color: #555555;
8168
+ color: #007bff;
7984
8169
  }
7985
8170
 
7986
8171
  .pa-file-popover__status--complete {
@@ -8058,9 +8243,9 @@ web-daterangepicker {
8058
8243
  display: flex;
8059
8244
  align-items: center;
8060
8245
  justify-content: center;
8061
- background: rgba(85, 85, 85, 0.1);
8246
+ background: rgba(0, 123, 255, 0.1);
8062
8247
  border-radius: 4px;
8063
- color: #555555;
8248
+ color: #007bff;
8064
8249
  }
8065
8250
 
8066
8251
  .pa-file-item__info {
@@ -8071,7 +8256,7 @@ web-daterangepicker {
8071
8256
  .pa-file-item__name {
8072
8257
  font-size: 1.4rem;
8073
8258
  font-weight: 600;
8074
- color: var(--pa-text-primary);
8259
+ color: var(--pa-text-color-1);
8075
8260
  overflow: hidden;
8076
8261
  text-overflow: ellipsis;
8077
8262
  white-space: nowrap;
@@ -8079,7 +8264,7 @@ web-daterangepicker {
8079
8264
 
8080
8265
  .pa-file-item__meta {
8081
8266
  font-size: 1.2rem;
8082
- color: var(--pa-text-secondary);
8267
+ color: var(--pa-text-color-2);
8083
8268
  margin-top: 0.4rem;
8084
8269
  }
8085
8270
 
@@ -8089,7 +8274,7 @@ web-daterangepicker {
8089
8274
  height: 2.4rem;
8090
8275
  border: none;
8091
8276
  background: transparent;
8092
- color: var(--pa-text-secondary);
8277
+ color: var(--pa-text-color-2);
8093
8278
  cursor: pointer;
8094
8279
  border-radius: 2px;
8095
8280
  font-size: 1.8rem;
@@ -8182,21 +8367,21 @@ web-daterangepicker {
8182
8367
 
8183
8368
  .pa-file-progress__bar {
8184
8369
  height: 6.4px;
8185
- background: rgba(85, 85, 85, 0.2);
8370
+ background: rgba(0, 123, 255, 0.2);
8186
8371
  border-radius: 2px;
8187
8372
  overflow: hidden;
8188
8373
  }
8189
8374
 
8190
8375
  .pa-file-progress__fill {
8191
8376
  height: 100%;
8192
- background: #555555;
8377
+ background: #007bff;
8193
8378
  border-radius: 2px;
8194
8379
  transition: width 0.48s ease;
8195
8380
  }
8196
8381
 
8197
8382
  .pa-file-progress__text {
8198
8383
  font-size: 1.2rem;
8199
- color: var(--pa-text-secondary);
8384
+ color: var(--pa-text-color-2);
8200
8385
  margin-top: 0.4rem;
8201
8386
  display: flex;
8202
8387
  justify-content: space-between;
@@ -8253,9 +8438,9 @@ web-daterangepicker {
8253
8438
  }
8254
8439
 
8255
8440
  .pa-file-dropzone-overlay {
8256
- background: rgba(85, 85, 85, 0.15);
8441
+ background: rgba(0, 123, 255, 0.15);
8257
8442
  backdrop-filter: blur(3.2px);
8258
- border: 4.8px dashed #555555;
8443
+ border: 4.8px dashed #007bff;
8259
8444
  border-radius: 4px;
8260
8445
  display: flex;
8261
8446
  align-items: center;
@@ -8276,7 +8461,7 @@ web-daterangepicker {
8276
8461
  .pa-file-dropzone-overlay__text {
8277
8462
  font-size: 2rem;
8278
8463
  font-weight: 600;
8279
- color: #555555;
8464
+ color: #007bff;
8280
8465
  }
8281
8466
 
8282
8467
  /* ========================================
@@ -8313,7 +8498,7 @@ web-daterangepicker {
8313
8498
  margin: 0;
8314
8499
  cursor: pointer;
8315
8500
  font-size: 1.4rem;
8316
- color: var(--pa-text-primary);
8501
+ color: var(--pa-text-color-1);
8317
8502
  user-select: none;
8318
8503
  width: 100%;
8319
8504
  }
@@ -8340,7 +8525,7 @@ web-daterangepicker {
8340
8525
  display: block;
8341
8526
  margin-top: 0.4rem;
8342
8527
  font-size: 1.2rem;
8343
- color: var(--pa-text-secondary);
8528
+ color: var(--pa-text-color-2);
8344
8529
  }
8345
8530
 
8346
8531
  .pa-checkbox-list__actions {
@@ -8553,12 +8738,12 @@ web-daterangepicker {
8553
8738
  .pa-table th {
8554
8739
  background-color: var(--pa-table-header-bg);
8555
8740
  font-weight: 600;
8556
- color: var(--pa-text-primary);
8741
+ color: var(--pa-text-color-1);
8557
8742
  border-bottom: 2px solid var(--pa-border-color);
8558
8743
  }
8559
8744
 
8560
8745
  .pa-table td {
8561
- color: var(--pa-text-primary);
8746
+ color: var(--pa-text-color-1);
8562
8747
  background-color: var(--pa-table-bg);
8563
8748
  height: 3.5rem0.8rem;
8564
8749
  }
@@ -8679,7 +8864,7 @@ web-daterangepicker {
8679
8864
  }
8680
8865
 
8681
8866
  .pa-pager__text {
8682
- color: var(--pa-text-secondary);
8867
+ color: var(--pa-text-color-2);
8683
8868
  font-size: 1.4rem;
8684
8869
  }
8685
8870
 
@@ -8720,7 +8905,7 @@ web-daterangepicker {
8720
8905
  background-color: transparent;
8721
8906
  border: 1px solid var(--pa-border-color);
8722
8907
  border-radius: 4px;
8723
- color: var(--pa-text-primary);
8908
+ color: var(--pa-text-color-1);
8724
8909
  font-size: 1.4rem;
8725
8910
  cursor: pointer;
8726
8911
  transition: all 0.1s ease-out;
@@ -8754,7 +8939,7 @@ web-daterangepicker {
8754
8939
  }
8755
8940
 
8756
8941
  .pa-load-more__count {
8757
- color: var(--pa-text-secondary);
8942
+ color: var(--pa-text-color-2);
8758
8943
  font-size: 1.2rem;
8759
8944
  margin-left: 0.4rem;
8760
8945
  }
@@ -8784,7 +8969,7 @@ web-daterangepicker {
8784
8969
  font-weight: 600;
8785
8970
  border-right: 1px solid var(--pa-border-color);
8786
8971
  background: var(--pa-table-header-bg);
8787
- color: var(--pa-text-primary);
8972
+ color: var(--pa-text-color-1);
8788
8973
  }
8789
8974
 
8790
8975
  .pa-virtual-table__header-cell:last-child {
@@ -8816,7 +9001,7 @@ web-daterangepicker {
8816
9001
  overflow: hidden;
8817
9002
  text-overflow: ellipsis;
8818
9003
  white-space: nowrap;
8819
- color: var(--pa-text-primary);
9004
+ color: var(--pa-text-color-1);
8820
9005
  background-color: inherit;
8821
9006
  }
8822
9007
 
@@ -8921,7 +9106,7 @@ web-daterangepicker {
8921
9106
  content: attr(data-label);
8922
9107
  display: block;
8923
9108
  font-weight: 600;
8924
- color: var(--pa-text-secondary);
9109
+ color: var(--pa-text-color-2);
8925
9110
  font-size: 1.2rem;
8926
9111
  margin-bottom: 0.4rem;
8927
9112
  text-transform: uppercase;
@@ -9000,8 +9185,8 @@ web-daterangepicker {
9000
9185
 
9001
9186
  .pa-comparison-table__label {
9002
9187
  font-weight: 500;
9003
- color: var(--pa-text-secondary);
9004
- background-color: var(--pa-primary-bg);
9188
+ color: var(--pa-text-color-2);
9189
+ background-color: var(--pa-main-bg);
9005
9190
  }
9006
9191
 
9007
9192
  .pa-comparison-table__value {
@@ -9071,7 +9256,7 @@ tbody tr:hover .pa-comparison-table__copy {
9071
9256
  .pa-comparison-table__section td {
9072
9257
  background-color: var(--pa-table-header-bg);
9073
9258
  font-weight: 600;
9074
- color: var(--pa-text-secondary);
9259
+ color: var(--pa-text-color-2);
9075
9260
  padding: 0.4rem 1.6rem;
9076
9261
  border-top: 2px solid var(--pa-border-color);
9077
9262
  border-bottom: 1px solid var(--pa-border-color);
@@ -9132,8 +9317,8 @@ code {
9132
9317
  font-family: "Courier New", Courier, monospace;
9133
9318
  font-size: 1.4rem;
9134
9319
  line-height: 1.8;
9135
- background-color: var(--pa-primary-bg);
9136
- color: var(--pa-text-primary);
9320
+ background-color: var(--pa-main-bg);
9321
+ color: var(--pa-text-color-1);
9137
9322
  border: 1px solid var(--pa-border-color);
9138
9323
  border-radius: 4px;
9139
9324
  overflow-x: auto;
@@ -9209,7 +9394,7 @@ code {
9209
9394
  .pa-code-block__title {
9210
9395
  font-size: 1.4rem;
9211
9396
  font-weight: 600;
9212
- color: var(--pa-text-secondary);
9397
+ color: var(--pa-text-color-2);
9213
9398
  margin: 0;
9214
9399
  }
9215
9400
 
@@ -9237,7 +9422,7 @@ code {
9237
9422
  }
9238
9423
 
9239
9424
  .pa-code-comment {
9240
- color: var(--pa-text-secondary);
9425
+ color: var(--pa-text-color-2);
9241
9426
  font-style: italic;
9242
9427
  }
9243
9428
 
@@ -9306,7 +9491,7 @@ code {
9306
9491
  }
9307
9492
 
9308
9493
  .pa-pager__text {
9309
- color: var(--pa-text-secondary);
9494
+ color: var(--pa-text-color-2);
9310
9495
  font-size: 1.4rem;
9311
9496
  }
9312
9497
 
@@ -9347,7 +9532,7 @@ code {
9347
9532
  background-color: transparent;
9348
9533
  border: 1px solid var(--pa-border-color);
9349
9534
  border-radius: 4px;
9350
- color: var(--pa-text-primary);
9535
+ color: var(--pa-text-color-1);
9351
9536
  font-size: 1.4rem;
9352
9537
  cursor: pointer;
9353
9538
  transition: all 0.1s ease-out;
@@ -9372,7 +9557,7 @@ code {
9372
9557
  width: 1.6rem;
9373
9558
  height: 1.6rem;
9374
9559
  border: 2px solid var(--pa-border-color);
9375
- border-top: 2px solid #555555;
9560
+ border-top: 2px solid #007bff;
9376
9561
  border-radius: 50%;
9377
9562
  }
9378
9563
 
@@ -9381,7 +9566,7 @@ code {
9381
9566
  }
9382
9567
 
9383
9568
  .pa-load-more__count {
9384
- color: var(--pa-text-secondary);
9569
+ color: var(--pa-text-color-2);
9385
9570
  font-size: 1.2rem;
9386
9571
  margin-left: 0.4rem;
9387
9572
  }
@@ -9391,23 +9576,24 @@ code {
9391
9576
  Profile panel and header button
9392
9577
  ======================================== */
9393
9578
  :root {
9394
- --pa-profile-panel-width: 20vw;
9395
- --pa-profile-panel-max-width: 48rem;
9579
+ --pa-local-profile-panel-width: 20vw;
9580
+ --pa-local-profile-panel-max-width: 48rem;
9396
9581
  }
9397
9582
 
9398
9583
  :where(.pa-profile-panel__content) {
9399
- width: var(--pa-profile-panel-width);
9400
- max-width: var(--pa-profile-panel-max-width);
9584
+ width: var(--pa-local-profile-panel-width);
9585
+ max-width: var(--pa-local-profile-panel-max-width);
9401
9586
  }
9402
9587
 
9403
9588
  .pa-header__profile-btn {
9404
9589
  display: flex;
9405
9590
  align-items: center;
9591
+ gap: 0.4rem;
9406
9592
  background: none;
9407
9593
  border: none;
9408
9594
  padding: 0.4rem 0.8rem;
9409
9595
  border-radius: 4px;
9410
- color: var(--pa-text-primary);
9596
+ color: var(--pa-header-text);
9411
9597
  cursor: pointer;
9412
9598
  font-size: 1.4rem;
9413
9599
  transition: background-color 0.1s ease-out;
@@ -9424,7 +9610,7 @@ code {
9424
9610
 
9425
9611
  .pa-header__profile-name {
9426
9612
  font-weight: 500;
9427
- color: #333333;
9613
+ color: var(--pa-header-profile-name-color);
9428
9614
  }
9429
9615
 
9430
9616
  .pa-profile-panel {
@@ -9513,7 +9699,7 @@ code {
9513
9699
  margin: 0 0 0.4rem 0;
9514
9700
  font-size: 1.8rem;
9515
9701
  font-weight: 600;
9516
- color: var(--pa-text-primary);
9702
+ color: var(--pa-text-color-1);
9517
9703
  overflow: hidden;
9518
9704
  text-overflow: ellipsis;
9519
9705
  white-space: nowrap;
@@ -9522,7 +9708,7 @@ code {
9522
9708
  .pa-profile-panel__email {
9523
9709
  margin: 0 0 0.8rem 0;
9524
9710
  font-size: 1.4rem;
9525
- color: var(--pa-text-secondary);
9711
+ color: var(--pa-text-color-2);
9526
9712
  overflow: hidden;
9527
9713
  text-overflow: ellipsis;
9528
9714
  white-space: nowrap;
@@ -9552,7 +9738,7 @@ code {
9552
9738
  display: flex;
9553
9739
  align-items: center;
9554
9740
  justify-content: center;
9555
- color: var(--pa-text-secondary);
9741
+ color: var(--pa-text-color-2);
9556
9742
  border-radius: 4px;
9557
9743
  transition: background-color 0.1s ease-out, color 0.1s ease-out;
9558
9744
  }
@@ -9591,7 +9777,7 @@ code {
9591
9777
  align-items: center;
9592
9778
  gap: 1.2rem;
9593
9779
  padding: 0.8rem 1.6rem;
9594
- color: var(--pa-text-primary);
9780
+ color: var(--pa-text-color-1);
9595
9781
  text-decoration: none;
9596
9782
  border-radius: 4px;
9597
9783
  transition: background-color 0.1s ease-out, color 0.1s ease-out;
@@ -9661,6 +9847,10 @@ code {
9661
9847
  border-bottom-color: var(--pa-accent);
9662
9848
  }
9663
9849
 
9850
+ .pa-profile-panel__tabs--icon-only .pa-profile-panel__tab-text {
9851
+ display: none;
9852
+ }
9853
+
9664
9854
  .pa-profile-panel__favorites ul {
9665
9855
  list-style: none;
9666
9856
  margin: 0;
@@ -9676,7 +9866,7 @@ code {
9676
9866
  align-items: center;
9677
9867
  gap: 1.2rem;
9678
9868
  padding: 0.8rem 1.6rem;
9679
- color: var(--pa-text-primary);
9869
+ color: var(--pa-text-color-1);
9680
9870
  text-decoration: none;
9681
9871
  border-radius: 4px;
9682
9872
  cursor: pointer;
@@ -9713,7 +9903,7 @@ code {
9713
9903
  background: none;
9714
9904
  border: none;
9715
9905
  padding: 0.4rem;
9716
- color: var(--pa-text-secondary);
9906
+ color: var(--pa-text-color-2);
9717
9907
  cursor: pointer;
9718
9908
  border-radius: 4px;
9719
9909
  font-size: 1.4rem;
@@ -9722,7 +9912,7 @@ code {
9722
9912
  }
9723
9913
 
9724
9914
  .pa-profile-panel__favorite-remove:hover {
9725
- color: var(--pa-danger);
9915
+ color: var(--pa-danger-bg);
9726
9916
  background-color: var(--pa-danger-bg-light);
9727
9917
  }
9728
9918
 
@@ -9830,14 +10020,14 @@ code {
9830
10020
  margin: 0;
9831
10021
  font-size: 1.8rem;
9832
10022
  font-weight: 600;
9833
- color: var(--pa-text-primary);
10023
+ color: var(--pa-text-color-1);
9834
10024
  }
9835
10025
 
9836
10026
  .pa-modal__body {
9837
10027
  padding: 1.2rem 1.6rem;
9838
10028
  flex: 1;
9839
10029
  overflow-y: auto;
9840
- color: var(--pa-text-primary);
10030
+ color: var(--pa-text-color-1);
9841
10031
  }
9842
10032
 
9843
10033
  .pa-modal__footer {
@@ -10036,13 +10226,13 @@ code {
10036
10226
  .pa-toast__title {
10037
10227
  font-weight: 600;
10038
10228
  margin: 0 0 0.4rem 0;
10039
- color: var(--pa-text-primary);
10229
+ color: var(--pa-text-color-1);
10040
10230
  font-size: 1.4rem;
10041
10231
  }
10042
10232
 
10043
10233
  .pa-toast__message {
10044
10234
  margin: 0;
10045
- color: var(--pa-text-secondary);
10235
+ color: var(--pa-text-color-2);
10046
10236
  font-size: 1.4rem;
10047
10237
  line-height: 1.5;
10048
10238
  }
@@ -10051,7 +10241,7 @@ code {
10051
10241
  flex-shrink: 0;
10052
10242
  background: none;
10053
10243
  border: none;
10054
- color: var(--pa-text-secondary);
10244
+ color: var(--pa-text-color-2);
10055
10245
  cursor: pointer;
10056
10246
  padding: 0;
10057
10247
  width: 2.4rem;
@@ -10067,7 +10257,7 @@ code {
10067
10257
 
10068
10258
  .pa-toast__close:hover {
10069
10259
  background-color: var(--pa-accent-hover);
10070
- color: var(--pa-text-primary);
10260
+ color: var(--pa-text-color-1);
10071
10261
  }
10072
10262
 
10073
10263
  .pa-toast__close:focus {
@@ -10203,15 +10393,15 @@ code {
10203
10393
  top: 0;
10204
10394
  width: 15px;
10205
10395
  height: 15px;
10206
- background: var(--pa-primary-bg);
10207
- border: 1px solid #555555;
10396
+ background: var(--pa-main-bg);
10397
+ border: 1px solid #007bff;
10208
10398
  border-radius: 50%;
10209
- box-shadow: 3px 3px 0 rgba(85, 85, 85, 0.3);
10399
+ box-shadow: 3px 3px 0 rgba(0, 123, 255, 0.3);
10210
10400
  }
10211
10401
 
10212
10402
  .pa-timeline--simple .pa-timeline__item--primary::before {
10213
- border-color: #555555;
10214
- box-shadow: 3px 3px 0 rgba(85, 85, 85, 0.3);
10403
+ border-color: #007bff;
10404
+ box-shadow: 3px 3px 0 rgba(0, 123, 255, 0.3);
10215
10405
  }
10216
10406
 
10217
10407
  .pa-timeline--simple .pa-timeline__item--success::before {
@@ -10235,16 +10425,16 @@ code {
10235
10425
  }
10236
10426
 
10237
10427
  .pa-timeline--simple .pa-timeline__item--secondary::before {
10238
- border-color: var(--pa-text-secondary);
10239
- box-shadow: 3px 3px 0 rgba(var(--pa-text-secondary), 0.3);
10428
+ border-color: var(--pa-text-color-2);
10429
+ box-shadow: 3px 3px 0 rgba(var(--pa-text-color-2), 0.3);
10240
10430
  }
10241
10431
 
10242
10432
  .pa-timeline--simple .pa-timeline__item--filled::before {
10243
- background: #555555;
10433
+ background: #007bff;
10244
10434
  }
10245
10435
 
10246
10436
  .pa-timeline--simple .pa-timeline__item--filled.pa-timeline__item--primary::before {
10247
- background: #555555;
10437
+ background: #007bff;
10248
10438
  }
10249
10439
 
10250
10440
  .pa-timeline--simple .pa-timeline__item--filled.pa-timeline__item--success::before {
@@ -10264,20 +10454,20 @@ code {
10264
10454
  }
10265
10455
 
10266
10456
  .pa-timeline--simple .pa-timeline__item--filled.pa-timeline__item--secondary::before {
10267
- background: var(--pa-text-secondary);
10457
+ background: var(--pa-text-color-2);
10268
10458
  }
10269
10459
 
10270
10460
  .pa-timeline--simple .pa-timeline__time {
10271
10461
  display: block;
10272
10462
  font-size: 1.4rem;
10273
10463
  font-weight: 600;
10274
- color: var(--pa-text-primary);
10464
+ color: var(--pa-text-color-1);
10275
10465
  margin-bottom: 0.4rem;
10276
10466
  }
10277
10467
 
10278
10468
  .pa-timeline--simple .pa-timeline__content {
10279
10469
  font-size: 1.4rem;
10280
- color: var(--pa-text-secondary);
10470
+ color: var(--pa-text-color-2);
10281
10471
  line-height: 1.8;
10282
10472
  margin-top: 0.6rem;
10283
10473
  }
@@ -10293,7 +10483,7 @@ code {
10293
10483
  content: "";
10294
10484
  position: absolute;
10295
10485
  width: 2px;
10296
- background: #555555;
10486
+ background: #007bff;
10297
10487
  top: 0;
10298
10488
  bottom: 0;
10299
10489
  left: 50%;
@@ -10332,8 +10522,8 @@ code {
10332
10522
  height: 16px;
10333
10523
  top: calc(50% - 8px);
10334
10524
  right: -8px;
10335
- background: var(--pa-primary-bg);
10336
- border: 2px solid #555555;
10525
+ background: var(--pa-main-bg);
10526
+ border: 2px solid #007bff;
10337
10527
  border-radius: 50%;
10338
10528
  z-index: 1;
10339
10529
  }
@@ -10345,7 +10535,7 @@ code {
10345
10535
  height: 2px;
10346
10536
  top: calc(50% - 1px);
10347
10537
  right: 8px;
10348
- background: #555555;
10538
+ background: #007bff;
10349
10539
  z-index: 1;
10350
10540
  }
10351
10541
 
@@ -10374,8 +10564,8 @@ code {
10374
10564
  height: 16px;
10375
10565
  top: calc(50% - 8px);
10376
10566
  left: -8px;
10377
- background: var(--pa-primary-bg);
10378
- border: 2px solid #555555;
10567
+ background: var(--pa-main-bg);
10568
+ border: 2px solid #007bff;
10379
10569
  border-radius: 50%;
10380
10570
  z-index: 1;
10381
10571
  }
@@ -10387,7 +10577,7 @@ code {
10387
10577
  height: 2px;
10388
10578
  top: calc(50% - 1px);
10389
10579
  left: 8px;
10390
- background: #555555;
10580
+ background: #007bff;
10391
10581
  z-index: 1;
10392
10582
  }
10393
10583
 
@@ -10398,7 +10588,7 @@ code {
10398
10588
  text-align: center;
10399
10589
  font-size: 1.4rem;
10400
10590
  font-weight: 700;
10401
- color: #555555;
10591
+ color: #007bff;
10402
10592
  text-transform: uppercase;
10403
10593
  letter-spacing: 1px;
10404
10594
  z-index: 1;
@@ -10413,10 +10603,10 @@ code {
10413
10603
  height: 40px;
10414
10604
  top: calc(50% - 20px);
10415
10605
  background: #ffc107;
10416
- border: 2px solid #555555;
10606
+ border: 2px solid #007bff;
10417
10607
  border-radius: 50%;
10418
10608
  font-size: 1.8rem;
10419
- color: #555555;
10609
+ color: #007bff;
10420
10610
  z-index: 1;
10421
10611
  }
10422
10612
 
@@ -10429,7 +10619,7 @@ code {
10429
10619
  margin: 0 0 0.8rem 0;
10430
10620
  font-size: 1.8rem;
10431
10621
  font-weight: 400;
10432
- color: var(--pa-text-primary);
10622
+ color: var(--pa-text-color-1);
10433
10623
  }
10434
10624
 
10435
10625
  .pa-timeline--alternating .pa-timeline__content p {
@@ -10596,12 +10786,12 @@ code {
10596
10786
  .pa-timeline--feed .pa-timeline__content {
10597
10787
  flex: 1;
10598
10788
  font-size: 1.4rem;
10599
- color: var(--pa-text-secondary);
10789
+ color: var(--pa-text-color-2);
10600
10790
  line-height: 1.8;
10601
10791
  }
10602
10792
 
10603
10793
  .pa-timeline--feed .pa-timeline__content a {
10604
- color: #555555;
10794
+ color: #007bff;
10605
10795
  text-decoration: none;
10606
10796
  font-weight: 500;
10607
10797
  }
@@ -10611,7 +10801,7 @@ code {
10611
10801
  }
10612
10802
 
10613
10803
  .pa-timeline--feed .pa-timeline__content time {
10614
- color: var(--pa-text-secondary);
10804
+ color: var(--pa-text-color-2);
10615
10805
  font-size: 1.2rem;
10616
10806
  }
10617
10807
 
@@ -10641,7 +10831,7 @@ code {
10641
10831
 
10642
10832
  .pa-timeline--feed .pa-timeline__comment p {
10643
10833
  margin: 0 0 0.8rem 0;
10644
- color: var(--pa-text-primary);
10834
+ color: var(--pa-text-color-1);
10645
10835
  line-height: 1.8;
10646
10836
  }
10647
10837
 
@@ -10669,7 +10859,7 @@ code {
10669
10859
  .pa-timeline--feed .pa-timeline__date-label {
10670
10860
  font-size: 1.4rem;
10671
10861
  font-weight: 600;
10672
- color: var(--pa-text-primary);
10862
+ color: var(--pa-text-color-1);
10673
10863
  text-transform: uppercase;
10674
10864
  letter-spacing: 0.5px;
10675
10865
  }
@@ -10678,7 +10868,7 @@ code {
10678
10868
  flex-shrink: 0;
10679
10869
  width: 50px;
10680
10870
  font-size: 1.2rem;
10681
- color: var(--pa-text-secondary);
10871
+ color: var(--pa-text-color-2);
10682
10872
  font-weight: 500;
10683
10873
  text-align: right;
10684
10874
  padding-right: 0.8rem;
@@ -10700,7 +10890,7 @@ code {
10700
10890
  .pa-timeline__loader-text {
10701
10891
  margin-top: 0.8rem;
10702
10892
  font-size: 1.4rem;
10703
- color: var(--pa-text-secondary);
10893
+ color: var(--pa-text-color-2);
10704
10894
  }
10705
10895
 
10706
10896
  .pa-timeline__load-more-wrapper {
@@ -10795,18 +10985,18 @@ code {
10795
10985
  border: 1px solid var(--pa-border-color);
10796
10986
  border-radius: 4px;
10797
10987
  background-color: var(--pa-input-bg);
10798
- color: var(--pa-text-primary);
10988
+ color: var(--pa-text-color-1);
10799
10989
  outline: none;
10800
10990
  transition: border-color 0.1s ease-out;
10801
10991
  }
10802
10992
 
10803
10993
  .pa-command-palette__input:focus {
10804
- border-color: #555555;
10805
- box-shadow: 0 0 0 3px rgba(85, 85, 85, 0.05);
10994
+ border-color: #007bff;
10995
+ box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
10806
10996
  }
10807
10997
 
10808
10998
  .pa-command-palette__input::placeholder {
10809
- color: var(--pa-text-secondary);
10999
+ color: var(--pa-text-color-2);
10810
11000
  opacity: 0.5;
10811
11001
  }
10812
11002
 
@@ -10851,7 +11041,7 @@ code {
10851
11041
  .pa-command-palette__empty {
10852
11042
  padding: 4.8rem 0.8rem;
10853
11043
  text-align: center;
10854
- color: var(--pa-text-secondary);
11044
+ color: var(--pa-text-color-2);
10855
11045
  font-size: 1.4rem;
10856
11046
  }
10857
11047
 
@@ -10861,7 +11051,7 @@ code {
10861
11051
  align-items: center;
10862
11052
  justify-content: center;
10863
11053
  gap: 0.8rem;
10864
- color: var(--pa-text-secondary);
11054
+ color: var(--pa-text-color-2);
10865
11055
  font-size: 1.4rem;
10866
11056
  }
10867
11057
 
@@ -10908,7 +11098,7 @@ code {
10908
11098
  .pa-command-palette__item-title {
10909
11099
  font-size: 1.4rem;
10910
11100
  font-weight: 500;
10911
- color: var(--pa-text-primary);
11101
+ color: var(--pa-text-color-1);
10912
11102
  margin: 0;
10913
11103
  white-space: nowrap;
10914
11104
  overflow: hidden;
@@ -10925,7 +11115,7 @@ code {
10925
11115
 
10926
11116
  .pa-command-palette__item-meta {
10927
11117
  font-size: 1.2rem;
10928
- color: var(--pa-text-secondary);
11118
+ color: var(--pa-text-color-2);
10929
11119
  margin: 0;
10930
11120
  margin-top: 2px;
10931
11121
  white-space: nowrap;
@@ -10937,8 +11127,8 @@ code {
10937
11127
  flex-shrink: 0;
10938
11128
  font-size: 1.2rem;
10939
11129
  padding: 2px 0.4rem;
10940
- background-color: #e8e8e8;
10941
- color: var(--pa-text-secondary);
11130
+ background-color: #e9ecef;
11131
+ color: var(--pa-text-color-2);
10942
11132
  border-radius: 2px;
10943
11133
  }
10944
11134
 
@@ -10948,7 +11138,7 @@ code {
10948
11138
  display: flex;
10949
11139
  gap: 1.6rem;
10950
11140
  font-size: 1.2rem;
10951
- color: var(--pa-text-secondary);
11141
+ color: var(--pa-text-color-2);
10952
11142
  }
10953
11143
 
10954
11144
  .pa-command-palette__hint {
@@ -10959,10 +11149,10 @@ code {
10959
11149
 
10960
11150
  .pa-command-palette__key {
10961
11151
  padding: 2px 0.4rem;
10962
- background-color: #e8e8e8;
11152
+ background-color: #e9ecef;
10963
11153
  border: 1px solid var(--pa-border-color);
10964
11154
  border-radius: 2px;
10965
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
11155
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
10966
11156
  font-weight: 500;
10967
11157
  font-size: 1rem;
10968
11158
  line-height: 1;
@@ -10972,7 +11162,7 @@ code {
10972
11162
  padding: 0.8rem 0.8rem 0.4rem;
10973
11163
  font-size: 1.2rem;
10974
11164
  font-weight: 600;
10975
- color: var(--pa-text-secondary);
11165
+ color: var(--pa-text-color-2);
10976
11166
  text-transform: uppercase;
10977
11167
  letter-spacing: 0.5px;
10978
11168
  }
@@ -10981,7 +11171,7 @@ code {
10981
11171
  padding: 0.4rem 0.8rem;
10982
11172
  text-align: center;
10983
11173
  font-size: 1.2rem;
10984
- color: var(--pa-text-secondary);
11174
+ color: var(--pa-text-color-2);
10985
11175
  border-top: 1px solid var(--pa-border-color);
10986
11176
  }
10987
11177
 
@@ -11031,13 +11221,13 @@ code {
11031
11221
  }
11032
11222
 
11033
11223
  .pa-navbar-search:hover {
11034
- border-color: #555555;
11224
+ border-color: #007bff;
11035
11225
  }
11036
11226
 
11037
11227
  .pa-navbar-search:focus {
11038
11228
  outline: none;
11039
- border-color: #555555;
11040
- box-shadow: 0 0 0 3px rgba(85, 85, 85, 0.05);
11229
+ border-color: #007bff;
11230
+ box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
11041
11231
  }
11042
11232
 
11043
11233
  .pa-navbar-search--xs {
@@ -11072,7 +11262,7 @@ code {
11072
11262
 
11073
11263
  .pa-navbar-search__placeholder {
11074
11264
  flex: 1;
11075
- color: var(--pa-text-secondary);
11265
+ color: var(--pa-text-color-2);
11076
11266
  white-space: nowrap;
11077
11267
  overflow: hidden;
11078
11268
  text-overflow: ellipsis;
@@ -11092,11 +11282,11 @@ code {
11092
11282
  min-width: 2rem;
11093
11283
  height: 2rem;
11094
11284
  padding: 0 0.4rem;
11095
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
11285
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
11096
11286
  font-size: 1rem;
11097
11287
  font-weight: 500;
11098
- color: var(--pa-text-secondary);
11099
- background-color: #e8e8e8;
11288
+ color: var(--pa-text-color-2);
11289
+ background-color: #e9ecef;
11100
11290
  border: 1px solid var(--pa-border-color);
11101
11291
  border-radius: 2px;
11102
11292
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
@@ -11131,7 +11321,7 @@ code {
11131
11321
  font-weight: 600;
11132
11322
  text-transform: uppercase;
11133
11323
  letter-spacing: 0.5px;
11134
- color: var(--pa-text-secondary);
11324
+ color: var(--pa-text-color-2);
11135
11325
  margin: 0;
11136
11326
  padding-bottom: 0.4rem;
11137
11327
  border-bottom: 1px solid var(--pa-border-color);
@@ -11165,29 +11355,29 @@ code {
11165
11355
  min-width: 2.4rem;
11166
11356
  height: 2.4rem;
11167
11357
  padding: 0 0.4rem;
11168
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
11358
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
11169
11359
  font-size: 1rem;
11170
11360
  font-weight: 500;
11171
- color: var(--pa-text-primary);
11172
- background-color: #e8e8e8;
11361
+ color: var(--pa-text-color-1);
11362
+ background-color: #e9ecef;
11173
11363
  border: 1px solid var(--pa-border-color);
11174
11364
  border-radius: 2px;
11175
11365
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
11176
11366
  }
11177
11367
 
11178
11368
  .pa-shortcut-help__separator {
11179
- color: var(--pa-text-secondary);
11369
+ color: var(--pa-text-color-2);
11180
11370
  font-size: 1.2rem;
11181
11371
  }
11182
11372
 
11183
11373
  .pa-shortcut-help__description {
11184
- color: var(--pa-text-primary);
11374
+ color: var(--pa-text-color-1);
11185
11375
  font-size: 1.4rem;
11186
11376
  }
11187
11377
 
11188
11378
  .pa-shortcut-help__empty {
11189
11379
  text-align: center;
11190
- color: var(--pa-text-secondary);
11380
+ color: var(--pa-text-color-2);
11191
11381
  padding: 3.2rem;
11192
11382
  }
11193
11383
 
@@ -11200,18 +11390,18 @@ code {
11200
11390
  background: #f9fafb;
11201
11391
  border-radius: 4px;
11202
11392
  min-height: 6.4rem;
11203
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
11393
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
11204
11394
  }
11205
11395
 
11206
11396
  .pa-logic-tree__empty {
11207
11397
  text-align: center;
11208
- color: var(--pa-text-secondary);
11398
+ color: var(--pa-text-color-2);
11209
11399
  padding: 3.2rem;
11210
11400
  font-style: italic;
11211
11401
  }
11212
11402
 
11213
11403
  .pa-logic-tree__empty-branch {
11214
- color: var(--pa-text-secondary);
11404
+ color: var(--pa-text-color-2);
11215
11405
  font-style: italic;
11216
11406
  padding: 0.8rem 1.2rem;
11217
11407
  background: #f9fafb;
@@ -11243,7 +11433,7 @@ code {
11243
11433
 
11244
11434
  .pa-logic-tree__block--condition {
11245
11435
  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
11246
- border-color: var(--pa-primary-bg);
11436
+ border-color: var(--pa-main-bg);
11247
11437
  border-left-width: 6.4px;
11248
11438
  }
11249
11439
 
@@ -11360,10 +11550,10 @@ code {
11360
11550
  .pa-logic-tree__group-label {
11361
11551
  font-weight: 500;
11362
11552
  font-size: 1.4rem;
11363
- color: var(--pa-text-secondary);
11553
+ color: var(--pa-text-color-2);
11364
11554
  margin-bottom: 0.8rem;
11365
11555
  padding-bottom: 0.8rem;
11366
- border-bottom: 1.6px dashed #e8e8e8;
11556
+ border-bottom: 1.6px dashed #e1e5e9;
11367
11557
  }
11368
11558
 
11369
11559
  .pa-logic-tree__group-content {
@@ -11458,7 +11648,7 @@ code {
11458
11648
  background: none;
11459
11649
  border: none;
11460
11650
  border-radius: 4px;
11461
- color: var(--pa-text-primary);
11651
+ color: var(--pa-header-text);
11462
11652
  cursor: pointer;
11463
11653
  transition: background-color 0.1s ease-out;
11464
11654
  }
@@ -11528,14 +11718,14 @@ code {
11528
11718
  margin: 0;
11529
11719
  font-size: 1.4rem;
11530
11720
  font-weight: 600;
11531
- color: var(--pa-text-primary);
11721
+ color: var(--pa-text-color-1);
11532
11722
  }
11533
11723
 
11534
11724
  .pa-notifications__mark-read {
11535
11725
  background: none;
11536
11726
  border: none;
11537
11727
  padding: 0;
11538
- color: #555555;
11728
+ color: #007bff;
11539
11729
  font-size: 1.4rem;
11540
11730
  font-weight: 500;
11541
11731
  cursor: pointer;
@@ -11543,7 +11733,7 @@ code {
11543
11733
  }
11544
11734
 
11545
11735
  .pa-notifications__mark-read:hover {
11546
- color: rgba(85, 85, 85, 0.1);
11736
+ color: rgba(0, 123, 255, 0.12);
11547
11737
  }
11548
11738
 
11549
11739
  .pa-notifications__list {
@@ -11572,11 +11762,11 @@ code {
11572
11762
  }
11573
11763
 
11574
11764
  .pa-notifications__item--unread {
11575
- background-color: rgba(85, 85, 85, 0.05);
11765
+ background-color: rgba(0, 123, 255, 0.05);
11576
11766
  }
11577
11767
 
11578
11768
  .pa-notifications__item--unread:hover {
11579
- background-color: rgba(85, 85, 85, 0.1);
11769
+ background-color: rgba(0, 123, 255, 0.1);
11580
11770
  }
11581
11771
 
11582
11772
  .pa-notifications__icon-wrapper {
@@ -11593,8 +11783,8 @@ code {
11593
11783
  }
11594
11784
 
11595
11785
  .pa-notifications__icon-wrapper--primary {
11596
- background-color: rgba(85, 85, 85, 0.1);
11597
- color: #555555;
11786
+ background-color: rgba(0, 123, 255, 0.1);
11787
+ color: #007bff;
11598
11788
  }
11599
11789
 
11600
11790
  .pa-notifications__icon-wrapper--success {
@@ -11613,8 +11803,8 @@ code {
11613
11803
  }
11614
11804
 
11615
11805
  .pa-notifications__icon-wrapper--secondary {
11616
- background-color: rgba(var(--pa-text-secondary), 0.1);
11617
- color: var(--pa-text-secondary);
11806
+ background-color: rgba(var(--pa-text-color-2), 0.1);
11807
+ color: var(--pa-text-color-2);
11618
11808
  }
11619
11809
 
11620
11810
  .pa-notifications__content {
@@ -11626,13 +11816,13 @@ code {
11626
11816
  margin: 0 0 0.2rem 0;
11627
11817
  font-size: 1.2rem;
11628
11818
  font-weight: 600;
11629
- color: var(--pa-text-primary);
11819
+ color: var(--pa-text-color-1);
11630
11820
  }
11631
11821
 
11632
11822
  .pa-notifications__content p {
11633
11823
  margin: 0 0 0.2rem 0;
11634
11824
  font-size: 1.2rem;
11635
- color: var(--pa-text-secondary);
11825
+ color: var(--pa-text-color-2);
11636
11826
  line-height: 1.3;
11637
11827
  overflow: hidden;
11638
11828
  text-overflow: ellipsis;
@@ -11643,7 +11833,7 @@ code {
11643
11833
 
11644
11834
  .pa-notifications__time {
11645
11835
  font-size: 1rem;
11646
- color: var(--pa-text-secondary);
11836
+ color: var(--pa-text-color-2);
11647
11837
  font-weight: 400;
11648
11838
  opacity: 0.7;
11649
11839
  }
@@ -11655,7 +11845,7 @@ code {
11655
11845
  }
11656
11846
 
11657
11847
  .pa-notifications__footer a {
11658
- color: #555555;
11848
+ color: #007bff;
11659
11849
  font-size: 1.4rem;
11660
11850
  font-weight: 500;
11661
11851
  text-decoration: none;
@@ -11663,7 +11853,7 @@ code {
11663
11853
  }
11664
11854
 
11665
11855
  .pa-notifications__footer a:hover {
11666
- color: rgba(85, 85, 85, 0.1);
11856
+ color: rgba(0, 123, 255, 0.12);
11667
11857
  }
11668
11858
 
11669
11859
  @media (max-width: 768px) {
@@ -11770,7 +11960,7 @@ code {
11770
11960
  .pa-popconfirm__message p {
11771
11961
  margin: 0;
11772
11962
  font-size: 1.4rem;
11773
- color: var(--pa-text-primary);
11963
+ color: var(--pa-text-color-1);
11774
11964
  line-height: 1.5;
11775
11965
  }
11776
11966
 
@@ -11807,7 +11997,7 @@ code {
11807
11997
  display: flex;
11808
11998
  gap: 0.8rem;
11809
11999
  justify-content: flex-end;
11810
- background-color: rgba(232, 232, 232, 0.3);
12000
+ background-color: rgba(225, 229, 233, 0.3);
11811
12001
  }
11812
12002
 
11813
12003
  .pa-popconfirm__actions .pa-btn {
@@ -11894,7 +12084,7 @@ code {
11894
12084
  top: 0;
11895
12085
  width: 40px;
11896
12086
  height: 40px;
11897
- background: #555555;
12087
+ background: #007bff;
11898
12088
  color: white;
11899
12089
  border: none;
11900
12090
  border-radius: 4px 0 0 4px;
@@ -11908,13 +12098,13 @@ code {
11908
12098
  }
11909
12099
 
11910
12100
  .pa-settings-panel__toggle:hover {
11911
- background: rgba(85, 85, 85, 0.1);
12101
+ background: rgba(0, 123, 255, 0.12);
11912
12102
  width: 45px;
11913
12103
  right: 325px;
11914
12104
  }
11915
12105
 
11916
12106
  .pa-settings-panel__content {
11917
- background: var(--pa-content-bg);
12107
+ background: var(--pa-subtle-bg);
11918
12108
  border: 1px solid var(--pa-border-color);
11919
12109
  border-right: none;
11920
12110
  border-radius: 4px 0 0 4px;
@@ -11931,7 +12121,7 @@ code {
11931
12121
  margin: 0 0 2.4rem 0;
11932
12122
  padding-bottom: 1.2rem;
11933
12123
  border-bottom: 2px solid var(--pa-border-color);
11934
- color: var(--pa-text-primary);
12124
+ color: var(--pa-text-color-1);
11935
12125
  font-size: 1.8rem;
11936
12126
  font-weight: 600;
11937
12127
  }
@@ -11947,7 +12137,7 @@ code {
11947
12137
  .pa-settings-panel__label {
11948
12138
  display: block;
11949
12139
  margin-bottom: 0.8rem;
11950
- color: var(--pa-text-primary);
12140
+ color: var(--pa-text-color-1);
11951
12141
  font-size: 1.4rem;
11952
12142
  font-weight: 500;
11953
12143
  }
@@ -11958,15 +12148,15 @@ code {
11958
12148
  border: 1px solid var(--pa-border-color);
11959
12149
  border-radius: 4px;
11960
12150
  background: var(--pa-input-bg);
11961
- color: var(--pa-text-primary);
12151
+ color: var(--pa-text-color-1);
11962
12152
  font-size: 1.4rem;
11963
12153
  cursor: pointer;
11964
12154
  }
11965
12155
 
11966
12156
  .pa-settings-panel__select:focus {
11967
12157
  outline: none;
11968
- border-color: #555555;
11969
- box-shadow: 0 0 0 3px rgba(85, 85, 85, 0.05);
12158
+ border-color: #007bff;
12159
+ box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.05);
11970
12160
  }
11971
12161
 
11972
12162
  .pa-settings-panel__checkbox-group {
@@ -11979,7 +12169,7 @@ code {
11979
12169
  display: flex;
11980
12170
  align-items: center;
11981
12171
  cursor: pointer;
11982
- color: var(--pa-text-primary);
12172
+ color: var(--pa-text-color-1);
11983
12173
  font-size: 1.4rem;
11984
12174
  }
11985
12175
 
@@ -11989,7 +12179,7 @@ code {
11989
12179
  }
11990
12180
 
11991
12181
  .pa-settings-panel__checkbox:hover {
11992
- color: #555555;
12182
+ color: #007bff;
11993
12183
  }
11994
12184
 
11995
12185
  .pa-settings-panel--open {
@@ -11997,7 +12187,7 @@ code {
11997
12187
  }
11998
12188
 
11999
12189
  .pa-settings-panel--open .pa-settings-panel__toggle {
12000
- background: rgba(85, 85, 85, 0.1);
12190
+ background: rgba(0, 123, 255, 0.12);
12001
12191
  transform: rotate(180deg);
12002
12192
  }
12003
12193
 
@@ -12279,7 +12469,7 @@ html.font-size-4xl {
12279
12469
 
12280
12470
  .pa-text {
12281
12471
  font-size: 1.4rem;
12282
- color: var(--pa-text-primary);
12472
+ color: var(--pa-text-color-1);
12283
12473
  }
12284
12474
 
12285
12475
  .pa-text--xs {
@@ -12299,11 +12489,11 @@ html.font-size-4xl {
12299
12489
  }
12300
12490
 
12301
12491
  .pa-text--primary {
12302
- color: var(--pa-text-primary);
12492
+ color: var(--pa-text-color-1);
12303
12493
  }
12304
12494
 
12305
12495
  .pa-text--secondary {
12306
- color: var(--pa-text-secondary);
12496
+ color: var(--pa-text-color-2);
12307
12497
  }
12308
12498
 
12309
12499
  .pa-text--left {
@@ -12320,7 +12510,7 @@ html.font-size-4xl {
12320
12510
 
12321
12511
  .pa-text--caption {
12322
12512
  font-size: 1.2rem;
12323
- color: var(--pa-text-secondary);
12513
+ color: var(--pa-text-color-2);
12324
12514
  margin-bottom: 0.8rem;
12325
12515
  }
12326
12516
 
@@ -12333,34 +12523,98 @@ html.font-size-4xl {
12333
12523
  gap: 0;
12334
12524
  }
12335
12525
 
12526
+ .row-gap-0 {
12527
+ row-gap: 0;
12528
+ }
12529
+
12530
+ .column-gap-0 {
12531
+ column-gap: 0;
12532
+ }
12533
+
12336
12534
  .gap-xs {
12337
12535
  gap: 0.4rem;
12338
12536
  }
12339
12537
 
12538
+ .row-gap-xs {
12539
+ row-gap: 0.4rem;
12540
+ }
12541
+
12542
+ .column-gap-xs {
12543
+ column-gap: 0.4rem;
12544
+ }
12545
+
12340
12546
  .gap-sm {
12341
12547
  gap: 0.8rem;
12342
12548
  }
12343
12549
 
12550
+ .row-gap-sm {
12551
+ row-gap: 0.8rem;
12552
+ }
12553
+
12554
+ .column-gap-sm {
12555
+ column-gap: 0.8rem;
12556
+ }
12557
+
12344
12558
  .gap-md {
12345
12559
  gap: 1.2rem;
12346
12560
  }
12347
12561
 
12562
+ .row-gap-md {
12563
+ row-gap: 1.2rem;
12564
+ }
12565
+
12566
+ .column-gap-md {
12567
+ column-gap: 1.2rem;
12568
+ }
12569
+
12348
12570
  .gap-base {
12349
12571
  gap: 1.6rem;
12350
12572
  }
12351
12573
 
12574
+ .row-gap-base {
12575
+ row-gap: 1.6rem;
12576
+ }
12577
+
12578
+ .column-gap-base {
12579
+ column-gap: 1.6rem;
12580
+ }
12581
+
12352
12582
  .gap-lg {
12353
12583
  gap: 2.4rem;
12354
12584
  }
12355
12585
 
12586
+ .row-gap-lg {
12587
+ row-gap: 2.4rem;
12588
+ }
12589
+
12590
+ .column-gap-lg {
12591
+ column-gap: 2.4rem;
12592
+ }
12593
+
12356
12594
  .gap-xl {
12357
12595
  gap: 3.2rem;
12358
12596
  }
12359
12597
 
12598
+ .row-gap-xl {
12599
+ row-gap: 3.2rem;
12600
+ }
12601
+
12602
+ .column-gap-xl {
12603
+ column-gap: 3.2rem;
12604
+ }
12605
+
12360
12606
  .gap-2xl {
12361
12607
  gap: 4.8rem;
12362
12608
  }
12363
12609
 
12610
+ .row-gap-2xl {
12611
+ row-gap: 4.8rem;
12612
+ }
12613
+
12614
+ .column-gap-2xl {
12615
+ column-gap: 4.8rem;
12616
+ }
12617
+
12364
12618
  .gap-1 {
12365
12619
  gap: 0.1rem;
12366
12620
  }
@@ -12405,54 +12659,6 @@ html.font-size-4xl {
12405
12659
  gap: 2rem;
12406
12660
  }
12407
12661
 
12408
- .row-gap-0 {
12409
- row-gap: 0;
12410
- }
12411
-
12412
- .row-gap-xs {
12413
- row-gap: 0.4rem;
12414
- }
12415
-
12416
- .row-gap-sm {
12417
- row-gap: 0.8rem;
12418
- }
12419
-
12420
- .row-gap-md {
12421
- row-gap: 1.2rem;
12422
- }
12423
-
12424
- .row-gap-base {
12425
- row-gap: 1.6rem;
12426
- }
12427
-
12428
- .row-gap-lg {
12429
- row-gap: 2.4rem;
12430
- }
12431
-
12432
- .column-gap-0 {
12433
- column-gap: 0;
12434
- }
12435
-
12436
- .column-gap-xs {
12437
- column-gap: 0.4rem;
12438
- }
12439
-
12440
- .column-gap-sm {
12441
- column-gap: 0.8rem;
12442
- }
12443
-
12444
- .column-gap-md {
12445
- column-gap: 1.2rem;
12446
- }
12447
-
12448
- .column-gap-base {
12449
- column-gap: 1.6rem;
12450
- }
12451
-
12452
- .column-gap-lg {
12453
- column-gap: 2.4rem;
12454
- }
12455
-
12456
12662
  .self-start {
12457
12663
  align-self: flex-start;
12458
12664
  }
@@ -12670,6 +12876,8 @@ html.font-size-4xl {
12670
12876
  border-color: var(--pa-color-9);
12671
12877
  }
12672
12878
 
12879
+ /* Pure Admin Visual Framework - SCSS Variables Only */
12880
+ /* NOTE: 10px rem base - all rem values are now in 10px units (1rem = 10px) */
12673
12881
  .m-0 {
12674
12882
  margin: 0 !important;
12675
12883
  }
@@ -13420,6 +13628,486 @@ html.font-size-4xl {
13420
13628
  margin-bottom: auto !important;
13421
13629
  }
13422
13630
 
13631
+ .m-0 {
13632
+ margin: 0 !important;
13633
+ }
13634
+
13635
+ .mt-0 {
13636
+ margin-top: 0 !important;
13637
+ }
13638
+
13639
+ .mr-0 {
13640
+ margin-right: 0 !important;
13641
+ }
13642
+
13643
+ .mb-0 {
13644
+ margin-bottom: 0 !important;
13645
+ }
13646
+
13647
+ .ml-0 {
13648
+ margin-left: 0 !important;
13649
+ }
13650
+
13651
+ .mx-0 {
13652
+ margin-left: 0 !important;
13653
+ margin-right: 0 !important;
13654
+ }
13655
+
13656
+ .my-0 {
13657
+ margin-top: 0 !important;
13658
+ margin-bottom: 0 !important;
13659
+ }
13660
+
13661
+ .m-xs {
13662
+ margin: 0.4rem !important;
13663
+ }
13664
+
13665
+ .mt-xs {
13666
+ margin-top: 0.4rem !important;
13667
+ }
13668
+
13669
+ .mr-xs {
13670
+ margin-right: 0.4rem !important;
13671
+ }
13672
+
13673
+ .mb-xs {
13674
+ margin-bottom: 0.4rem !important;
13675
+ }
13676
+
13677
+ .ml-xs {
13678
+ margin-left: 0.4rem !important;
13679
+ }
13680
+
13681
+ .mx-xs {
13682
+ margin-left: 0.4rem !important;
13683
+ margin-right: 0.4rem !important;
13684
+ }
13685
+
13686
+ .my-xs {
13687
+ margin-top: 0.4rem !important;
13688
+ margin-bottom: 0.4rem !important;
13689
+ }
13690
+
13691
+ .m-sm {
13692
+ margin: 0.8rem !important;
13693
+ }
13694
+
13695
+ .mt-sm {
13696
+ margin-top: 0.8rem !important;
13697
+ }
13698
+
13699
+ .mr-sm {
13700
+ margin-right: 0.8rem !important;
13701
+ }
13702
+
13703
+ .mb-sm {
13704
+ margin-bottom: 0.8rem !important;
13705
+ }
13706
+
13707
+ .ml-sm {
13708
+ margin-left: 0.8rem !important;
13709
+ }
13710
+
13711
+ .mx-sm {
13712
+ margin-left: 0.8rem !important;
13713
+ margin-right: 0.8rem !important;
13714
+ }
13715
+
13716
+ .my-sm {
13717
+ margin-top: 0.8rem !important;
13718
+ margin-bottom: 0.8rem !important;
13719
+ }
13720
+
13721
+ .m-md {
13722
+ margin: 1.2rem !important;
13723
+ }
13724
+
13725
+ .mt-md {
13726
+ margin-top: 1.2rem !important;
13727
+ }
13728
+
13729
+ .mr-md {
13730
+ margin-right: 1.2rem !important;
13731
+ }
13732
+
13733
+ .mb-md {
13734
+ margin-bottom: 1.2rem !important;
13735
+ }
13736
+
13737
+ .ml-md {
13738
+ margin-left: 1.2rem !important;
13739
+ }
13740
+
13741
+ .mx-md {
13742
+ margin-left: 1.2rem !important;
13743
+ margin-right: 1.2rem !important;
13744
+ }
13745
+
13746
+ .my-md {
13747
+ margin-top: 1.2rem !important;
13748
+ margin-bottom: 1.2rem !important;
13749
+ }
13750
+
13751
+ .m-base {
13752
+ margin: 1.6rem !important;
13753
+ }
13754
+
13755
+ .mt-base {
13756
+ margin-top: 1.6rem !important;
13757
+ }
13758
+
13759
+ .mr-base {
13760
+ margin-right: 1.6rem !important;
13761
+ }
13762
+
13763
+ .mb-base {
13764
+ margin-bottom: 1.6rem !important;
13765
+ }
13766
+
13767
+ .ml-base {
13768
+ margin-left: 1.6rem !important;
13769
+ }
13770
+
13771
+ .mx-base {
13772
+ margin-left: 1.6rem !important;
13773
+ margin-right: 1.6rem !important;
13774
+ }
13775
+
13776
+ .my-base {
13777
+ margin-top: 1.6rem !important;
13778
+ margin-bottom: 1.6rem !important;
13779
+ }
13780
+
13781
+ .m-lg {
13782
+ margin: 2.4rem !important;
13783
+ }
13784
+
13785
+ .mt-lg {
13786
+ margin-top: 2.4rem !important;
13787
+ }
13788
+
13789
+ .mr-lg {
13790
+ margin-right: 2.4rem !important;
13791
+ }
13792
+
13793
+ .mb-lg {
13794
+ margin-bottom: 2.4rem !important;
13795
+ }
13796
+
13797
+ .ml-lg {
13798
+ margin-left: 2.4rem !important;
13799
+ }
13800
+
13801
+ .mx-lg {
13802
+ margin-left: 2.4rem !important;
13803
+ margin-right: 2.4rem !important;
13804
+ }
13805
+
13806
+ .my-lg {
13807
+ margin-top: 2.4rem !important;
13808
+ margin-bottom: 2.4rem !important;
13809
+ }
13810
+
13811
+ .m-xl {
13812
+ margin: 3.2rem !important;
13813
+ }
13814
+
13815
+ .mt-xl {
13816
+ margin-top: 3.2rem !important;
13817
+ }
13818
+
13819
+ .mr-xl {
13820
+ margin-right: 3.2rem !important;
13821
+ }
13822
+
13823
+ .mb-xl {
13824
+ margin-bottom: 3.2rem !important;
13825
+ }
13826
+
13827
+ .ml-xl {
13828
+ margin-left: 3.2rem !important;
13829
+ }
13830
+
13831
+ .mx-xl {
13832
+ margin-left: 3.2rem !important;
13833
+ margin-right: 3.2rem !important;
13834
+ }
13835
+
13836
+ .my-xl {
13837
+ margin-top: 3.2rem !important;
13838
+ margin-bottom: 3.2rem !important;
13839
+ }
13840
+
13841
+ .m-2xl {
13842
+ margin: 4.8rem !important;
13843
+ }
13844
+
13845
+ .mt-2xl {
13846
+ margin-top: 4.8rem !important;
13847
+ }
13848
+
13849
+ .mr-2xl {
13850
+ margin-right: 4.8rem !important;
13851
+ }
13852
+
13853
+ .mb-2xl {
13854
+ margin-bottom: 4.8rem !important;
13855
+ }
13856
+
13857
+ .ml-2xl {
13858
+ margin-left: 4.8rem !important;
13859
+ }
13860
+
13861
+ .mx-2xl {
13862
+ margin-left: 4.8rem !important;
13863
+ margin-right: 4.8rem !important;
13864
+ }
13865
+
13866
+ .my-2xl {
13867
+ margin-top: 4.8rem !important;
13868
+ margin-bottom: 4.8rem !important;
13869
+ }
13870
+
13871
+ .p-0 {
13872
+ padding: 0 !important;
13873
+ }
13874
+
13875
+ .pt-0 {
13876
+ padding-top: 0 !important;
13877
+ }
13878
+
13879
+ .pr-0 {
13880
+ padding-right: 0 !important;
13881
+ }
13882
+
13883
+ .pb-0 {
13884
+ padding-bottom: 0 !important;
13885
+ }
13886
+
13887
+ .pl-0 {
13888
+ padding-left: 0 !important;
13889
+ }
13890
+
13891
+ .px-0 {
13892
+ padding-left: 0 !important;
13893
+ padding-right: 0 !important;
13894
+ }
13895
+
13896
+ .py-0 {
13897
+ padding-top: 0 !important;
13898
+ padding-bottom: 0 !important;
13899
+ }
13900
+
13901
+ .p-xs {
13902
+ padding: 0.4rem !important;
13903
+ }
13904
+
13905
+ .pt-xs {
13906
+ padding-top: 0.4rem !important;
13907
+ }
13908
+
13909
+ .pr-xs {
13910
+ padding-right: 0.4rem !important;
13911
+ }
13912
+
13913
+ .pb-xs {
13914
+ padding-bottom: 0.4rem !important;
13915
+ }
13916
+
13917
+ .pl-xs {
13918
+ padding-left: 0.4rem !important;
13919
+ }
13920
+
13921
+ .px-xs {
13922
+ padding-left: 0.4rem !important;
13923
+ padding-right: 0.4rem !important;
13924
+ }
13925
+
13926
+ .py-xs {
13927
+ padding-top: 0.4rem !important;
13928
+ padding-bottom: 0.4rem !important;
13929
+ }
13930
+
13931
+ .p-sm {
13932
+ padding: 0.8rem !important;
13933
+ }
13934
+
13935
+ .pt-sm {
13936
+ padding-top: 0.8rem !important;
13937
+ }
13938
+
13939
+ .pr-sm {
13940
+ padding-right: 0.8rem !important;
13941
+ }
13942
+
13943
+ .pb-sm {
13944
+ padding-bottom: 0.8rem !important;
13945
+ }
13946
+
13947
+ .pl-sm {
13948
+ padding-left: 0.8rem !important;
13949
+ }
13950
+
13951
+ .px-sm {
13952
+ padding-left: 0.8rem !important;
13953
+ padding-right: 0.8rem !important;
13954
+ }
13955
+
13956
+ .py-sm {
13957
+ padding-top: 0.8rem !important;
13958
+ padding-bottom: 0.8rem !important;
13959
+ }
13960
+
13961
+ .p-md {
13962
+ padding: 1.2rem !important;
13963
+ }
13964
+
13965
+ .pt-md {
13966
+ padding-top: 1.2rem !important;
13967
+ }
13968
+
13969
+ .pr-md {
13970
+ padding-right: 1.2rem !important;
13971
+ }
13972
+
13973
+ .pb-md {
13974
+ padding-bottom: 1.2rem !important;
13975
+ }
13976
+
13977
+ .pl-md {
13978
+ padding-left: 1.2rem !important;
13979
+ }
13980
+
13981
+ .px-md {
13982
+ padding-left: 1.2rem !important;
13983
+ padding-right: 1.2rem !important;
13984
+ }
13985
+
13986
+ .py-md {
13987
+ padding-top: 1.2rem !important;
13988
+ padding-bottom: 1.2rem !important;
13989
+ }
13990
+
13991
+ .p-base {
13992
+ padding: 1.6rem !important;
13993
+ }
13994
+
13995
+ .pt-base {
13996
+ padding-top: 1.6rem !important;
13997
+ }
13998
+
13999
+ .pr-base {
14000
+ padding-right: 1.6rem !important;
14001
+ }
14002
+
14003
+ .pb-base {
14004
+ padding-bottom: 1.6rem !important;
14005
+ }
14006
+
14007
+ .pl-base {
14008
+ padding-left: 1.6rem !important;
14009
+ }
14010
+
14011
+ .px-base {
14012
+ padding-left: 1.6rem !important;
14013
+ padding-right: 1.6rem !important;
14014
+ }
14015
+
14016
+ .py-base {
14017
+ padding-top: 1.6rem !important;
14018
+ padding-bottom: 1.6rem !important;
14019
+ }
14020
+
14021
+ .p-lg {
14022
+ padding: 2.4rem !important;
14023
+ }
14024
+
14025
+ .pt-lg {
14026
+ padding-top: 2.4rem !important;
14027
+ }
14028
+
14029
+ .pr-lg {
14030
+ padding-right: 2.4rem !important;
14031
+ }
14032
+
14033
+ .pb-lg {
14034
+ padding-bottom: 2.4rem !important;
14035
+ }
14036
+
14037
+ .pl-lg {
14038
+ padding-left: 2.4rem !important;
14039
+ }
14040
+
14041
+ .px-lg {
14042
+ padding-left: 2.4rem !important;
14043
+ padding-right: 2.4rem !important;
14044
+ }
14045
+
14046
+ .py-lg {
14047
+ padding-top: 2.4rem !important;
14048
+ padding-bottom: 2.4rem !important;
14049
+ }
14050
+
14051
+ .p-xl {
14052
+ padding: 3.2rem !important;
14053
+ }
14054
+
14055
+ .pt-xl {
14056
+ padding-top: 3.2rem !important;
14057
+ }
14058
+
14059
+ .pr-xl {
14060
+ padding-right: 3.2rem !important;
14061
+ }
14062
+
14063
+ .pb-xl {
14064
+ padding-bottom: 3.2rem !important;
14065
+ }
14066
+
14067
+ .pl-xl {
14068
+ padding-left: 3.2rem !important;
14069
+ }
14070
+
14071
+ .px-xl {
14072
+ padding-left: 3.2rem !important;
14073
+ padding-right: 3.2rem !important;
14074
+ }
14075
+
14076
+ .py-xl {
14077
+ padding-top: 3.2rem !important;
14078
+ padding-bottom: 3.2rem !important;
14079
+ }
14080
+
14081
+ .p-2xl {
14082
+ padding: 4.8rem !important;
14083
+ }
14084
+
14085
+ .pt-2xl {
14086
+ padding-top: 4.8rem !important;
14087
+ }
14088
+
14089
+ .pr-2xl {
14090
+ padding-right: 4.8rem !important;
14091
+ }
14092
+
14093
+ .pb-2xl {
14094
+ padding-bottom: 4.8rem !important;
14095
+ }
14096
+
14097
+ .pl-2xl {
14098
+ padding-left: 4.8rem !important;
14099
+ }
14100
+
14101
+ .px-2xl {
14102
+ padding-left: 4.8rem !important;
14103
+ padding-right: 4.8rem !important;
14104
+ }
14105
+
14106
+ .py-2xl {
14107
+ padding-top: 4.8rem !important;
14108
+ padding-bottom: 4.8rem !important;
14109
+ }
14110
+
13423
14111
  .d-none {
13424
14112
  display: none !important;
13425
14113
  }
@@ -14789,12 +15477,20 @@ html.font-size-4xl {
14789
15477
  --base-text-color-3: #e2e6ea;
14790
15478
  --base-text-color-4: #d8d8d8;
14791
15479
  --base-text-color-on-accent: #ffffff;
15480
+ --base-main-bg: #ffffff;
15481
+ --base-page-bg: #f8f9fa;
15482
+ --base-subtle-bg: #e9ecef;
15483
+ --base-inverse-bg: #2c3e50;
15484
+ --base-overlay-bg: rgba(0, 0, 0, 0.4);
15485
+ --base-shadow-color: rgba(0, 0, 0, 0.1);
15486
+ --base-hover-bg: #e9ecef;
15487
+ --base-active-bg: rgb(218.2368421053, 223.25, 228.2631578947);
15488
+ --base-disabled-bg: #e9ecef;
15489
+ --base-elevated-bg: #f5f5f5;
14792
15490
  --base-surface-1: #ffffff;
14793
15491
  --base-surface-2: #fafafa;
14794
15492
  --base-surface-3: #e8e8e8;
14795
15493
  --base-surface-inverse: #333333;
14796
- --base-overlay-bg: rgba(0, 0, 0, 0.4);
14797
- --base-shadow-color: rgba(0, 0, 0, 0.1);
14798
15494
  --base-primary-bg: #ffffff;
14799
15495
  --base-primary-bg-hover: rgb(242.25, 242.25, 242.25);
14800
15496
  --base-border-color: #e8e8e8;
@@ -14871,11 +15567,11 @@ html.font-size-4xl {
14871
15567
  --base-border-radius-sm: 0.4;
14872
15568
  --base-border-radius-md: 0.6;
14873
15569
  --base-border-radius-lg: 0.8;
14874
- --pa-primary-bg: #ffffff;
14875
- --pa-bg-secondary: #fafafa;
14876
- --pa-content-bg: #ffffff;
14877
- --pa-text-primary: #333333;
14878
- --pa-text-secondary: #777777;
15570
+ --pa-main-bg: #ffffff;
15571
+ --pa-page-bg: #f8f9fa;
15572
+ --pa-subtle-bg: #ffffff;
15573
+ --pa-text-color-1: #333333;
15574
+ --pa-text-color-2: #777777;
14879
15575
  --pa-accent: #555555;
14880
15576
  --pa-accent-hover: rgba(85, 85, 85, 0.1);
14881
15577
  --pa-accent-light: rgba(85, 85, 85, 0.05);
@@ -14894,11 +15590,11 @@ html.font-size-4xl {
14894
15590
  --pa-footer-bg: #fafafa;
14895
15591
  --pa-footer-border-color: #e8e8e8;
14896
15592
  --pa-btn-primary-bg: #555555;
14897
- --pa-btn-primary-bg-hover: #444444;
15593
+ --pa-btn-primary-bg-hover: rgb(110.5, 110.5, 110.5);
14898
15594
  --pa-btn-primary-bg-light: rgba(85, 85, 85, 0.05);
14899
15595
  --pa-btn-primary-text: #ffffff;
14900
- --pa-btn-secondary-bg: #e8e8e8;
14901
- --pa-btn-secondary-bg-hover: #d8d8d8;
15596
+ --pa-btn-secondary-bg: #6c757d;
15597
+ --pa-btn-secondary-bg-hover: #545b62;
14902
15598
  --pa-btn-secondary-text: #ffffff;
14903
15599
  --pa-btn-success-bg: #28a745;
14904
15600
  --pa-btn-success-bg-hover: #218838;
@@ -15014,9 +15710,9 @@ html.font-size-4xl {
15014
15710
  --pa-multiselect-dropdown-bg: #ffffff;
15015
15711
  --pa-multiselect-dropdown-border: #e8e8e8;
15016
15712
  --pa-multiselect-dropdown-text: #333333;
15017
- --pa-multiselect-hint-bg: #fafafa;
15713
+ --pa-multiselect-hint-bg: #f8f9fa;
15018
15714
  --pa-multiselect-hint-border: #e8e8e8;
15019
- --pa-multiselect-option-hover-bg: #fafafa;
15715
+ --pa-multiselect-option-hover-bg: #f8f9fa;
15020
15716
  --pa-multiselect-pill-bg: rgba(85, 85, 85, 0.05);
15021
15717
  --pa-multiselect-pill-border: #555555;
15022
15718
  --pa-color-1: #374151;
@@ -15036,8 +15732,8 @@ html.font-size-4xl {
15036
15732
  --drp-border-color: #e8e8e8;
15037
15733
  --drp-primary-bg: #fafafa;
15038
15734
  --drp-primary-bg-hover: #f8f9fa;
15039
- --drp-text-primary: #333333;
15040
- --drp-text-secondary: #777777;
15735
+ --drp-text-color-1: #333333;
15736
+ --drp-text-bg: #777777;
15041
15737
  --drp-button-bg: transparent;
15042
15738
  --drp-button-color: #333333;
15043
15739
  --drp-button-accent-text-color: #ffffff;
@@ -15062,11 +15758,11 @@ html.font-size-4xl {
15062
15758
  --page-loader-bg: rgba(26, 26, 26, 0.95);
15063
15759
  --page-loader-spinner-border: #404040;
15064
15760
  --page-loader-spinner-accent: #e8e8e8;
15065
- --pa-primary-bg: #1a1a1a;
15066
- --pa-bg-secondary: #1a1a1a;
15067
- --pa-content-bg: #141414;
15068
- --pa-text-primary: #e8e8e8;
15069
- --pa-text-secondary: #a0a0a0;
15761
+ --pa-main-bg: #1a1a1a;
15762
+ --pa-page-bg: #1a1a1a;
15763
+ --pa-subtle-bg: #141414;
15764
+ --pa-text-color-1: #e8e8e8;
15765
+ --pa-text-color-2: #a0a0a0;
15070
15766
  --pa-accent: #e8e8e8;
15071
15767
  --pa-accent-hover: rgba(232, 232, 232, 0.15);
15072
15768
  --pa-accent-light: rgba(232, 232, 232, 0.08);
@@ -15152,6 +15848,13 @@ html.font-size-4xl {
15152
15848
  --pa-danger-bg-light: rgba(220, 53, 69, 0.2);
15153
15849
  --pa-info-bg: #17a2b8;
15154
15850
  --pa-info-bg-light: rgba(23, 162, 184, 0.2);
15851
+ --base-main-bg: #242424;
15852
+ --base-page-bg: #1a1a1a;
15853
+ --base-subtle-bg: #2e2e2e;
15854
+ --base-hover-bg: #2e2e2e;
15855
+ --base-active-bg: #404040;
15856
+ --base-disabled-bg: #2e2e2e;
15857
+ --base-elevated-bg: #2e2e2e;
15155
15858
  --base-surface-1: #242424;
15156
15859
  --base-surface-2: #1a1a1a;
15157
15860
  --base-surface-3: #2e2e2e;
@@ -15182,8 +15885,8 @@ html.font-size-4xl {
15182
15885
  --drp-border-color: #404040;
15183
15886
  --drp-primary-bg: #1a1a1a;
15184
15887
  --drp-primary-bg-hover: #2e2e2e;
15185
- --drp-text-primary: #e8e8e8;
15186
- --drp-text-secondary: #a0a0a0;
15888
+ --drp-text-color-1: #e8e8e8;
15889
+ --drp-text-bg: #a0a0a0;
15187
15890
  --drp-button-bg: transparent;
15188
15891
  --drp-button-color: #e8e8e8;
15189
15892
  --drp-button-accent-text-color: #1a1a1a;
@@ -15209,11 +15912,11 @@ html.font-size-4xl {
15209
15912
  .pa-mode-dark .pa-card {
15210
15913
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
15211
15914
  }
15212
- .pa-mode-dark .pa-btn--primary {
15915
+ .pa-mode-dark .pa-btn--color-1 {
15213
15916
  background-color: #e8e8e8 !important;
15214
15917
  color: #1a1a1a !important;
15215
15918
  }
15216
- .pa-mode-dark .pa-btn--primary:hover {
15919
+ .pa-mode-dark .pa-btn--color-1:hover {
15217
15920
  background-color: #ffffff !important;
15218
15921
  }
15219
15922
  .pa-mode-dark .pa-btn--secondary {
@@ -15225,11 +15928,11 @@ html.font-size-4xl {
15225
15928
  background-color: #505050 !important;
15226
15929
  border-color: #606060 !important;
15227
15930
  }
15228
- .pa-mode-dark .pa-btn--outline-secondary {
15931
+ .pa-mode-dark .pa-btn--outline-bg {
15229
15932
  border-color: #606060 !important;
15230
15933
  color: #a0a0a0 !important;
15231
15934
  }
15232
- .pa-mode-dark .pa-btn--outline-secondary:hover {
15935
+ .pa-mode-dark .pa-btn--outline-bg:hover {
15233
15936
  background-color: #404040 !important;
15234
15937
  color: #e8e8e8 !important;
15235
15938
  }