kaui 4.0.26 → 4.0.27

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 (33) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/kaui/account.css +177 -172
  3. data/app/assets/stylesheets/kaui/account_timeline.css +21 -21
  4. data/app/assets/stylesheets/kaui/admin_allowed_users.css +26 -26
  5. data/app/assets/stylesheets/kaui/audit_logs.css +41 -41
  6. data/app/assets/stylesheets/kaui/auth_pages.css +6 -6
  7. data/app/assets/stylesheets/kaui/breadcrumb.css +5 -5
  8. data/app/assets/stylesheets/kaui/chargebacks.css +9 -9
  9. data/app/assets/stylesheets/kaui/clock.css +9 -9
  10. data/app/assets/stylesheets/kaui/common.css +207 -207
  11. data/app/assets/stylesheets/kaui/custom_fields.css +64 -64
  12. data/app/assets/stylesheets/kaui/dashboard.css +3 -3
  13. data/app/assets/stylesheets/kaui/datatable.css +14 -14
  14. data/app/assets/stylesheets/kaui/header.css +17 -17
  15. data/app/assets/stylesheets/kaui/home.css +2 -2
  16. data/app/assets/stylesheets/kaui/invoice.css +113 -113
  17. data/app/assets/stylesheets/kaui/payment.css +120 -120
  18. data/app/assets/stylesheets/kaui/queues.css +48 -48
  19. data/app/assets/stylesheets/kaui/refunds.css +15 -15
  20. data/app/assets/stylesheets/kaui/role_definitions.css +9 -9
  21. data/app/assets/stylesheets/kaui/sidebar.css +14 -14
  22. data/app/assets/stylesheets/kaui/subscription.css +58 -58
  23. data/app/assets/stylesheets/kaui/tag_definitions.css +45 -45
  24. data/app/assets/stylesheets/kaui/tags.css +65 -65
  25. data/app/assets/stylesheets/kaui/tenants.css +152 -152
  26. data/app/assets/stylesheets/kaui/tooltip.css +5 -5
  27. data/app/assets/stylesheets/kaui/wallets.css +8 -8
  28. data/app/views/kaui/account_emails/_account_emails_table.html.erb +1 -1
  29. data/app/views/kaui/accounts/_add_parent.html.erb +1 -1
  30. data/app/views/kaui/payment_methods/_plugin_properties.html.erb +1 -1
  31. data/app/views/kaui/transactions/_control_plugin_names.html.erb +1 -1
  32. data/lib/kaui/version.rb +1 -1
  33. metadata +4 -4
@@ -2,7 +2,7 @@
2
2
  font-size: 0.875rem !important;
3
3
  font-weight: 500 !important;
4
4
  line-height: 1.25rem !important;
5
- color: #414651 !important;
5
+ color: var(--kb-on-surface-secondary) !important;
6
6
  }
7
7
 
8
8
  .kaui-tenant-select .choose-tenant-title {
@@ -13,7 +13,7 @@
13
13
  font-size: 1.125rem;
14
14
  line-height: 1.75rem;
15
15
  letter-spacing: 0;
16
- color: #1b1c1e;
16
+ color: var(--kb-on-surface-primary);
17
17
  padding: 1rem 0;
18
18
  margin-bottom: 1.5rem;
19
19
  }
@@ -22,7 +22,7 @@
22
22
  display: inline-flex;
23
23
  justify-content: center;
24
24
  align-items: center;
25
- border: 0.0625rem solid #d5d7da;
25
+ border: 0.0625rem solid var(--kb-outline-secondary);
26
26
  border-radius: 0.375rem;
27
27
  width: 2.5rem;
28
28
  height: 2.5rem;
@@ -38,7 +38,7 @@
38
38
  font-size: 0.875rem !important;
39
39
  font-weight: 500 !important;
40
40
  line-height: 1.25rem !important;
41
- color: #414651 !important;
41
+ color: var(--kb-on-surface-secondary) !important;
42
42
  }
43
43
 
44
44
  .kaui-tenant-select select#kb_tenant_id {
@@ -52,10 +52,10 @@
52
52
  font-size: 1rem;
53
53
  font-weight: 400;
54
54
  line-height: 1.5;
55
- color: #212529;
56
- background-color: #fff;
55
+ color: var(--kb-neutral-800);
56
+ background-color: var(--kb-neutral-0);
57
57
  background-clip: padding-box;
58
- border: 0.0625rem solid #ced4da;
58
+ border: 0.0625rem solid var(--kb-outline-secondary);
59
59
  border-radius: 0.375rem;
60
60
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
61
61
  background-image: url("data:image/svg+xml;utf8,<svg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M4 6L8 10L12 6' stroke='%23A4A7AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
@@ -68,7 +68,7 @@
68
68
  .kaui-tenant-select select#kb_tenant_id:focus {
69
69
  box-shadow: none;
70
70
  outline: none;
71
- border-color: #1570ef;
71
+ border-color: var(--kb-primary);
72
72
  }
73
73
 
74
74
  /* app/views/kaui/admin_tenants/index.html.erb */
@@ -78,14 +78,14 @@
78
78
  align-items: start;
79
79
  justify-content: space-between;
80
80
  padding: 0;
81
- border-bottom: 0.0625rem solid #E9EAEB;
81
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
82
82
  }
83
83
 
84
84
  .admin-tenant-details .admin-tenant-details-header h2 {
85
85
  font-weight: 600;
86
86
  font-size: 1.125rem;
87
87
  line-height: 1.75rem;
88
- color: #414651;
88
+ color: var(--kb-on-surface-secondary);
89
89
  margin-bottom: 1.25rem;
90
90
  }
91
91
 
@@ -100,7 +100,7 @@
100
100
  font-size: 0.875rem;
101
101
  line-height: 1.125rem;
102
102
  letter-spacing: 0;
103
- color: #717680;
103
+ color: var(--kb-on-surface-quaternary);
104
104
  text-transform: capitalize;
105
105
  }
106
106
 
@@ -110,7 +110,7 @@
110
110
  padding: 1rem 0.5rem !important;
111
111
  line-height: 1.125rem !important;
112
112
  text-align: start;
113
- color: #535862 !important;
113
+ color: var(--kb-on-surface-tertiary) !important;
114
114
  }
115
115
 
116
116
  /* app/views/kaui/admin_tenants/new.html.erb */
@@ -123,7 +123,7 @@
123
123
  font-size: 1.125rem;
124
124
  line-height: 1.75rem;
125
125
  letter-spacing: 0;
126
- color: #1B1C1E;
126
+ color: var(--kb-on-surface-primary);
127
127
  padding: 1.5rem 0;
128
128
  }
129
129
 
@@ -131,7 +131,7 @@
131
131
  display: inline-flex;
132
132
  justify-content: center;
133
133
  align-items: center;
134
- border: 0.0625rem solid #D5D7DA;
134
+ border: 0.0625rem solid var(--kb-outline-secondary);
135
135
  border-radius: 0.375rem;
136
136
  width: 2.5rem;
137
137
  height: 2.5rem;
@@ -147,7 +147,7 @@
147
147
  font-size: 0.875rem !important;
148
148
  font-weight: 500 !important;
149
149
  line-height: 1.25rem !important;
150
- color: #414651 !important;
150
+ color: var(--kb-on-surface-secondary) !important;
151
151
  }
152
152
 
153
153
  .add-new-tenant-details .form-group .form-control {
@@ -168,7 +168,7 @@
168
168
  align-items: start;
169
169
  justify-content: space-between;
170
170
  padding: 0;
171
- border-bottom: 0.0625rem solid #E9EAEB;
171
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
172
172
  padding-bottom: 1rem;
173
173
  }
174
174
 
@@ -176,14 +176,14 @@
176
176
  font-weight: 600;
177
177
  font-size: 1.125rem;
178
178
  line-height: 1.75rem;
179
- color: #414651;
179
+ color: var(--kb-on-surface-secondary);
180
180
  margin: 0;
181
181
  }
182
182
 
183
183
  .useful-links-container .useful-links b {
184
184
  display: block;
185
185
  margin-bottom: 0.25rem;
186
- color: #414651 !important;
186
+ color: var(--kb-on-surface-secondary) !important;
187
187
  font-weight: 600;
188
188
  font-size: 0.875rem !important;
189
189
  line-height: 1.25rem;
@@ -192,7 +192,7 @@
192
192
 
193
193
  .useful-links-container .useful-links p {
194
194
  display: block;
195
- color: #717680 !important;
195
+ color: var(--kb-on-surface-quaternary) !important;
196
196
  font-weight: 400;
197
197
  font-size: 0.875rem !important;
198
198
  line-height: 1.25rem;
@@ -215,7 +215,7 @@
215
215
  text-decoration: underline;
216
216
  text-decoration-style: solid;
217
217
  text-decoration-skip-ink: auto;
218
- color: #717680 !important;
218
+ color: var(--kb-on-surface-quaternary) !important;
219
219
  }
220
220
 
221
221
  /* app/views/kaui/admin_tenants/_tenant_details.html.erb */
@@ -230,7 +230,7 @@
230
230
  align-items: start;
231
231
  justify-content: space-between;
232
232
  padding: 0;
233
- border-bottom: 0.0625rem solid #E9EAEB;
233
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
234
234
  padding-bottom: 1rem;
235
235
  }
236
236
 
@@ -238,14 +238,14 @@
238
238
  font-weight: 600;
239
239
  font-size: 1.125rem;
240
240
  line-height: 1.75rem;
241
- color: #414651;
241
+ color: var(--kb-on-surface-secondary);
242
242
  margin: 0;
243
243
  }
244
244
 
245
245
  .tenant-details-container .tenant-details b {
246
246
  display: block;
247
247
  margin-bottom: 0.25rem;
248
- color: #414651 !important;
248
+ color: var(--kb-on-surface-secondary) !important;
249
249
  font-weight: 600;
250
250
  font-size: 0.875rem !important;
251
251
  line-height: 1.25rem;
@@ -254,7 +254,7 @@
254
254
 
255
255
  .tenant-details-container .tenant-details p {
256
256
  display: block;
257
- color: #717680 !important;
257
+ color: var(--kb-on-surface-quaternary) !important;
258
258
  font-weight: 400;
259
259
  font-size: 0.875rem !important;
260
260
  line-height: 1.25rem;
@@ -279,14 +279,14 @@
279
279
  align-items: start;
280
280
  justify-content: space-between;
281
281
  padding: 0;
282
- border-bottom: 0.0625rem solid #E9EAEB;
282
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
283
283
  }
284
284
 
285
285
  .admin-tenant-show .allowed-users-container .allowed-users-header h2 {
286
286
  font-weight: 600;
287
287
  font-size: 1.125rem;
288
288
  line-height: 1.75rem;
289
- color: #414651;
289
+ color: var(--kb-on-surface-secondary);
290
290
  margin-bottom: 1.25rem;
291
291
  }
292
292
 
@@ -295,7 +295,7 @@
295
295
  background-color: transparent !important;
296
296
  border: none !important;
297
297
  text-decoration: none !important;
298
- color: #D92D20 !important;
298
+ color: var(--kb-error) !important;
299
299
  font-weight: 500;
300
300
  padding-right: 0.5rem !important;
301
301
  font-size: 0.875rem;
@@ -303,8 +303,8 @@
303
303
  }
304
304
 
305
305
  .admin-tenant-show .card {
306
- background: #FAFAFA;
307
- border: 0.0625rem solid #E9EAEB;
306
+ background: var(--kb-surface-container-low);
307
+ border: 0.0625rem solid var(--kb-outline-primary);
308
308
  border-radius: 0.5rem;
309
309
  }
310
310
 
@@ -327,7 +327,7 @@
327
327
  font-size: 0.875rem;
328
328
  line-height: 1.125rem;
329
329
  letter-spacing: 0;
330
- color: #717680;
330
+ color: var(--kb-on-surface-quaternary);
331
331
  text-transform: capitalize;
332
332
  }
333
333
 
@@ -337,12 +337,12 @@
337
337
  padding: 1rem 0.5rem !important;
338
338
  line-height: 1.125rem !important;
339
339
  text-align: start;
340
- color: #535862 !important;
340
+ color: var(--kb-on-surface-tertiary) !important;
341
341
  }
342
342
 
343
343
  .admin-tenant-show .nav-tabs-details .nav-link.active {
344
- border-bottom: 0.125rem solid #1570EF !important;
345
- color: #175CD3 !important;
344
+ border-bottom: 0.125rem solid var(--kb-primary) !important;
345
+ color: var(--kb-primary) !important;
346
346
  border-top: none !important;
347
347
  border-left: none !important;
348
348
  border-right: none !important;
@@ -354,7 +354,7 @@
354
354
  border-left: none !important;
355
355
  border-right: none !important;
356
356
  padding: 0.25rem 0 0.75rem 0.25rem !important;
357
- color: #717680;
357
+ color: var(--kb-on-surface-quaternary);
358
358
  margin-right: 0.75rem !important;
359
359
  font-weight: 500 !important;
360
360
  font-size: 0.875rem !important;
@@ -374,7 +374,7 @@
374
374
  font-weight: 500;
375
375
  font-size: 0.875rem;
376
376
  line-height: 1.25rem;
377
- color: #414651;
377
+ color: var(--kb-on-surface-secondary);
378
378
  }
379
379
 
380
380
  .addAllowedUserModal .modal-body {
@@ -393,7 +393,7 @@
393
393
  font-weight: 600;
394
394
  font-size: 1.125rem;
395
395
  line-height: 1.75rem;
396
- color: #181D27;
396
+ color: var(--kb-on-surface-primary);
397
397
  }
398
398
 
399
399
  .addAllowedUserModal .close-button {
@@ -412,7 +412,7 @@
412
412
  display: inline-flex;
413
413
  justify-content: center;
414
414
  align-items: center;
415
- border: 0.0625rem solid #D5D7DA;
415
+ border: 0.0625rem solid var(--kb-outline-secondary);
416
416
  border-radius: 0.375rem;
417
417
  width: 2.5rem;
418
418
  height: 2.5rem;
@@ -441,7 +441,7 @@
441
441
  font-weight: 500;
442
442
  font-size: 0.875rem;
443
443
  line-height: 1.25rem;
444
- color: #414651;
444
+ color: var(--kb-on-surface-secondary);
445
445
  margin-top: -1.25rem;
446
446
  min-width: 9.59375rem;
447
447
  }
@@ -498,14 +498,14 @@
498
498
  .addAllowedUserModal #search-labels-container .label {
499
499
  margin-left: 0.3125rem;
500
500
  margin-bottom: 0.3125rem;
501
- color: white;
501
+ color: var(--kb-neutral-0);
502
502
  }
503
503
 
504
504
  .addAllowedUserModal .col-form-label {
505
505
  font-weight: 500;
506
506
  font-size: 0.875rem;
507
507
  line-height: 1.25rem;
508
- color: #414651;
508
+ color: var(--kb-on-surface-secondary);
509
509
  padding: 0;
510
510
  }
511
511
 
@@ -535,7 +535,7 @@
535
535
  display: inline-flex;
536
536
  justify-content: center;
537
537
  align-items: center;
538
- border: 0.0625rem solid #D5D7DA;
538
+ border: 0.0625rem solid var(--kb-outline-secondary);
539
539
  border-radius: 0.375rem;
540
540
  width: 2.5rem;
541
541
  height: 2.5rem;
@@ -575,14 +575,14 @@
575
575
  align-items: start;
576
576
  justify-content: space-between;
577
577
  padding: 0;
578
- border-bottom: 0.0625rem solid #E9EAEB;
578
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
579
579
  }
580
580
 
581
581
  .existing-overdue-config-for-tenants-container .existing-overdue-config-for-tenants-header h2 {
582
582
  font-weight: 600;
583
583
  font-size: 1.125rem;
584
584
  line-height: 1.75rem;
585
- color: #414651;
585
+ color: var(--kb-on-surface-secondary);
586
586
  margin-bottom: 1.25rem;
587
587
  }
588
588
 
@@ -593,7 +593,7 @@
593
593
  }
594
594
 
595
595
  .existing-overdue-config-for-tenants-container table.existing-overdue-config-for-tenants-table tbody tr {
596
- border-bottom: 0.0625rem solid #E9EAEB !important;
596
+ border-bottom: 0.0625rem solid var(--kb-outline-primary) !important;
597
597
  }
598
598
 
599
599
  .existing-overdue-config-for-tenants-container table.existing-overdue-config-for-tenants-table ul {
@@ -611,9 +611,9 @@
611
611
  font-size: 0.75rem !important;
612
612
  line-height: 1.125rem;
613
613
  letter-spacing: 0;
614
- color: #717680;
614
+ color: var(--kb-on-surface-quaternary);
615
615
  text-transform: capitalize;
616
- background-color: #FAFAFA !important;
616
+ background-color: var(--kb-surface-container-low) !important;
617
617
  }
618
618
 
619
619
  .existing-overdue-config-for-tenants-container table.existing-overdue-config-for-tenants-table td {
@@ -623,7 +623,7 @@
623
623
  line-height: 1.125rem !important;
624
624
  text-align: start;
625
625
  padding: 0.3125rem 0.75rem !important;
626
- color: #535862 !important;
626
+ color: var(--kb-on-surface-tertiary) !important;
627
627
  }
628
628
 
629
629
  /* app/views/kaui/admin_tenants/_form_invoice_template.erb */
@@ -638,7 +638,7 @@
638
638
  font-weight: 500;
639
639
  font-size: 0.875rem;
640
640
  line-height: 1.25rem;
641
- color: #414651;
641
+ color: var(--kb-on-surface-secondary);
642
642
  }
643
643
 
644
644
  /* app/views/kaui/admin_tenants/_form_invoice_translation.erb */
@@ -653,14 +653,14 @@
653
653
  align-items: start;
654
654
  justify-content: space-between;
655
655
  padding: 0;
656
- border-bottom: 0.0625rem solid #E9EAEB;
656
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
657
657
  }
658
658
 
659
659
  .existing-invoice-translations-container .existing-invoice-translations-header h2 {
660
660
  font-weight: 600;
661
661
  font-size: 1.125rem;
662
662
  line-height: 1.75rem;
663
- color: #414651;
663
+ color: var(--kb-on-surface-secondary);
664
664
  margin-bottom: 1.25rem;
665
665
  }
666
666
 
@@ -671,7 +671,7 @@
671
671
  }
672
672
 
673
673
  .existing-invoice-translations-container table.existing-invoice-translations-table tbody tr {
674
- border-bottom: 0.0625rem solid #E9EAEB !important;
674
+ border-bottom: 0.0625rem solid var(--kb-outline-primary) !important;
675
675
  }
676
676
 
677
677
  .existing-invoice-translations-container table.existing-invoice-translations-table th {
@@ -680,9 +680,9 @@
680
680
  font-size: 0.75rem !important;
681
681
  line-height: 1.125rem;
682
682
  letter-spacing: 0;
683
- color: #717680;
683
+ color: var(--kb-on-surface-quaternary);
684
684
  text-transform: capitalize;
685
- background-color: #FAFAFA !important;
685
+ background-color: var(--kb-surface-container-low) !important;
686
686
  }
687
687
 
688
688
  .existing-invoice-translations-container table.existing-invoice-translations-table td {
@@ -691,7 +691,7 @@
691
691
  line-height: 1.125rem !important;
692
692
  text-align: start;
693
693
  padding: 0.3125rem 0.75rem !important;
694
- color: #535862 !important;
694
+ color: var(--kb-on-surface-tertiary) !important;
695
695
  }
696
696
 
697
697
  /* app/views/kaui/admin_tenants/_show_catalog_simple.erb */
@@ -714,14 +714,14 @@
714
714
  align-items: start;
715
715
  justify-content: space-between;
716
716
  padding: 0;
717
- border-bottom: 0.0625rem solid #E9EAEB;
717
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
718
718
  }
719
719
 
720
720
  .show-catalog-simple .existing-plans-container .existing-plans-header h2 {
721
721
  font-weight: 600;
722
722
  font-size: 1.125rem;
723
723
  line-height: 1.75rem;
724
- color: #414651;
724
+ color: var(--kb-on-surface-secondary);
725
725
  margin-bottom: 1.25rem;
726
726
  }
727
727
 
@@ -729,10 +729,10 @@
729
729
  height: 2.125rem;
730
730
  font-size: 1rem;
731
731
  line-height: 1.5;
732
- color: #495057;
733
- background-color: #fff;
732
+ color: var(--kb-on-surface-secondary);
733
+ background-color: var(--kb-neutral-0);
734
734
  background-clip: padding-box;
735
- border: 0.0625rem solid #ced4da;
735
+ border: 0.0625rem solid var(--kb-outline-secondary);
736
736
  border-radius: 0.375rem;
737
737
  margin-top: 0.0625rem;
738
738
  -webkit-appearance: none;
@@ -748,7 +748,7 @@
748
748
  font-weight: 500;
749
749
  font-size: 0.875rem;
750
750
  line-height: 1.25rem;
751
- color: #414651;
751
+ color: var(--kb-on-surface-secondary);
752
752
  }
753
753
 
754
754
  .show-catalog-simple .select-catalog-version select:focus {
@@ -767,10 +767,10 @@
767
767
  font-weight: 500;
768
768
  font-size: 0.75rem;
769
769
  line-height: 1.125rem;
770
- color: #495057;
771
- background-color: #fff;
770
+ color: var(--kb-on-surface-secondary);
771
+ background-color: var(--kb-neutral-0);
772
772
  background-clip: padding-box;
773
- border: 0.0625rem solid #ced4da;
773
+ border: 0.0625rem solid var(--kb-outline-secondary);
774
774
  border-radius: 0.375rem;
775
775
  -webkit-appearance: none;
776
776
  -moz-appearance: none;
@@ -792,9 +792,9 @@
792
792
  font-size: 0.75rem;
793
793
  line-height: 1.125rem;
794
794
  letter-spacing: 0;
795
- color: #717680;
795
+ color: var(--kb-on-surface-quaternary);
796
796
  text-transform: capitalize;
797
- background-color: #FAFAFA !important;
797
+ background-color: var(--kb-surface-container-low) !important;
798
798
  }
799
799
 
800
800
  .show-catalog-simple table.existing-plans-table td {
@@ -803,14 +803,14 @@
803
803
  padding: 1rem 0.5rem !important;
804
804
  line-height: 1.125rem !important;
805
805
  text-align: start;
806
- color: #535862 !important;
806
+ color: var(--kb-on-surface-tertiary) !important;
807
807
  }
808
808
 
809
809
  .show-catalog-simple .currency-button {
810
810
  padding: 0 !important;
811
811
  background-color: transparent !important;
812
812
  border: none !important;
813
- color: #175CD3 !important;
813
+ color: var(--kb-primary) !important;
814
814
  font-weight: 500 !important;
815
815
  font-size: 0.75rem !important;
816
816
  line-height: 1.125rem !important;
@@ -819,28 +819,28 @@
819
819
  .show-catalog-simple .selected_catalog .category {
820
820
  display: inline-block;
821
821
  padding: 0.125rem 0.5rem !important;
822
- border: 0.0625rem solid #D1E9FF !important;
822
+ border: 0.0625rem solid var(--kb-primary-50) !important;
823
823
  border-radius: 39.0586rem;
824
824
  font-weight: 500 !important;
825
825
  font-size: 0.75rem !important;
826
826
  line-height: 1.125rem !important;
827
827
  text-align: start;
828
- color: #175CD3 !important;
829
- background-color: #EFF8FF;
828
+ color: var(--kb-primary) !important;
829
+ background-color: var(--kb-primary-25);
830
830
  text-transform: capitalize;
831
831
  }
832
832
 
833
833
  .show-catalog-simple .selected_catalog .phase-duration {
834
834
  display: inline-block;
835
835
  padding: 0.125rem 0.5rem !important;
836
- border: 0.0625rem solid #DCFAE6 !important;
836
+ border: 0.0625rem solid var(--kb-success-50) !important;
837
837
  border-radius: 39.0586rem;
838
838
  font-weight: 500 !important;
839
839
  font-size: 0.75rem !important;
840
840
  line-height: 1.125rem !important;
841
841
  text-align: start;
842
- color: #067647 !important;
843
- background-color: #ECFDF3;
842
+ color: var(--kb-success-hover) !important;
843
+ background-color: var(--kb-success-25);
844
844
  text-transform: capitalize;
845
845
  }
846
846
 
@@ -850,7 +850,7 @@
850
850
  background-color: transparent !important;
851
851
  border: none !important;
852
852
  text-decoration: none !important;
853
- color: #D92D20 !important;
853
+ color: var(--kb-error) !important;
854
854
  font-weight: 500;
855
855
  padding-right: 0.3125rem !important;
856
856
  font-size: 0.875rem;
@@ -870,14 +870,14 @@
870
870
  align-items: start;
871
871
  justify-content: space-between;
872
872
  padding: 0;
873
- border-bottom: 0.0625rem solid #E9EAEB;
873
+ border-bottom: 0.0625rem solid var(--kb-outline-primary);
874
874
  }
875
875
 
876
876
  .show-catalog-xml .catalog-container .catalog-header h2 {
877
877
  font-weight: 600;
878
878
  font-size: 1.125rem;
879
879
  line-height: 1.75rem;
880
- color: #414651;
880
+ color: var(--kb-on-surface-secondary);
881
881
  margin-bottom: 1.25rem;
882
882
  }
883
883
 
@@ -893,9 +893,9 @@
893
893
  font-size: 0.75rem !important;
894
894
  line-height: 1.125rem;
895
895
  letter-spacing: 0;
896
- color: #717680;
896
+ color: var(--kb-on-surface-quaternary);
897
897
  text-transform: capitalize;
898
- background-color: #FAFAFA !important;
898
+ background-color: var(--kb-surface-container-low) !important;
899
899
  }
900
900
 
901
901
  .show-catalog-xml table td {
@@ -904,14 +904,14 @@
904
904
  padding: 1rem 0.5rem !important;
905
905
  line-height: 1.125rem !important;
906
906
  text-align: start;
907
- color: #535862 !important;
907
+ color: var(--kb-on-surface-tertiary) !important;
908
908
  }
909
909
 
910
910
  .show-catalog-xml .currency-button {
911
911
  padding: 0 !important;
912
912
  background-color: transparent !important;
913
913
  border: none !important;
914
- color: #175CD3 !important;
914
+ color: var(--kb-primary) !important;
915
915
  font-weight: 500 !important;
916
916
  font-size: 0.75rem !important;
917
917
  line-height: 1.125rem !important;
@@ -927,7 +927,7 @@
927
927
  font-size: 1.125rem;
928
928
  line-height: 1.75rem;
929
929
  letter-spacing: 0;
930
- color: #1B1C1E;
930
+ color: var(--kb-on-surface-primary);
931
931
  padding: 1.5rem 0;
932
932
  }
933
933
 
@@ -935,7 +935,7 @@
935
935
  display: inline-flex;
936
936
  justify-content: center;
937
937
  align-items: center;
938
- border: 0.0625rem solid #D5D7DA;
938
+ border: 0.0625rem solid var(--kb-outline-secondary);
939
939
  border-radius: 0.375rem;
940
940
  width: 2.5rem;
941
941
  height: 2.5rem;
@@ -951,11 +951,11 @@
951
951
  font-size: 0.875rem !important;
952
952
  font-weight: 500 !important;
953
953
  line-height: 1.25rem !important;
954
- color: #414651 !important;
954
+ color: var(--kb-on-surface-secondary) !important;
955
955
  }
956
956
 
957
957
  .kaui-new-catalog .question-circle {
958
- color: #A4A7AE;
958
+ color: var(--kb-on-surface-quaternary);
959
959
  font-size: 1rem;
960
960
  width: 1rem;
961
961
  height: 1rem;
@@ -992,10 +992,10 @@
992
992
  font-size: 1rem;
993
993
  font-weight: 400;
994
994
  line-height: 1.5;
995
- color: #212529;
996
- background-color: #fff;
995
+ color: var(--kb-neutral-800);
996
+ background-color: var(--kb-neutral-0);
997
997
  background-clip: padding-box;
998
- border: 0.0625rem solid #ced4da;
998
+ border: 0.0625rem solid var(--kb-outline-secondary);
999
999
  border-radius: 0.375rem;
1000
1000
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
1001
1001
  background-image: url("data:image/svg+xml;utf8,<svg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M4 6L8 10L12 6' stroke='%23A4A7AE' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
@@ -1008,7 +1008,7 @@
1008
1008
  .kaui-new-catalog select:focus {
1009
1009
  box-shadow: none;
1010
1010
  outline: none;
1011
- border-color: #1570ef;
1011
+ border-color: var(--kb-primary);
1012
1012
  }
1013
1013
 
1014
1014
  .kaui-new-catalog .additional-base-products select {
@@ -1019,10 +1019,10 @@
1019
1019
  font-size: 1rem;
1020
1020
  font-weight: 400;
1021
1021
  line-height: 1.5;
1022
- color: #212529;
1023
- background-color: #fff;
1022
+ color: var(--kb-neutral-800);
1023
+ background-color: var(--kb-neutral-0);
1024
1024
  background-clip: padding-box;
1025
- border: 0.0625rem solid #ced4da;
1025
+ border: 0.0625rem solid var(--kb-outline-secondary);
1026
1026
  border-radius: 0.375rem;
1027
1027
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
1028
1028
  }
@@ -1030,13 +1030,13 @@
1030
1030
  .kaui-new-catalog .additional-base-products select:focus {
1031
1031
  box-shadow: none;
1032
1032
  outline: none;
1033
- border-color: #1570ef;
1033
+ border-color: var(--kb-primary);
1034
1034
  }
1035
1035
 
1036
1036
  .kaui-new-catalog .toggle-segment {
1037
1037
  display: flex;
1038
1038
  align-items: center;
1039
- border: 0.0625rem solid #D5D7DA;
1039
+ border: 0.0625rem solid var(--kb-outline-secondary);
1040
1040
  width: fit-content;
1041
1041
  border-radius: 0.375rem;
1042
1042
  overflow: hidden;
@@ -1048,8 +1048,8 @@
1048
1048
  align-items: center;
1049
1049
  padding: 0.625rem 1rem;
1050
1050
  cursor: pointer;
1051
- color: #414651;
1052
- border-right: 0.0625rem solid #D5D7DA;
1051
+ color: var(--kb-on-surface-secondary);
1052
+ border-right: 0.0625rem solid var(--kb-outline-secondary);
1053
1053
  font-weight: 500;
1054
1054
  font-size: 0.875rem;
1055
1055
  line-height: 1.25rem;
@@ -1066,14 +1066,14 @@
1066
1066
  display: none;
1067
1067
  width: 0.5rem;
1068
1068
  height: 0.5rem;
1069
- background-color: #17B26A;
1069
+ background-color: var(--kb-success-pressed);
1070
1070
  border-radius: 50%;
1071
1071
  }
1072
1072
 
1073
1073
  .kaui-new-catalog .toggle-segment .toggle-option.active-btn {
1074
- background-color: #FAFAFA;
1074
+ background-color: var(--kb-surface-container-low);
1075
1075
  font-weight: 600;
1076
- color: #252B37;
1076
+ color: var(--kb-neutral-700);
1077
1077
  gap: 1rem;
1078
1078
  }
1079
1079
 
@@ -1082,34 +1082,34 @@
1082
1082
  }
1083
1083
 
1084
1084
  .kaui-new-catalog .upload-status {
1085
- border: 0.0625rem solid #E9EAEB;
1085
+ border: 0.0625rem solid var(--kb-outline-primary);
1086
1086
  border-radius: 0.75rem;
1087
- background-color: #fff;
1087
+ background-color: var(--kb-neutral-0);
1088
1088
  padding: 1rem 1.5rem;
1089
1089
  margin-top: 1rem;
1090
1090
  }
1091
1091
 
1092
1092
  .kaui-new-catalog .upload-status-box {
1093
- border: 0.0625rem solid #d5d7da;
1093
+ border: 0.0625rem solid var(--kb-outline-secondary);
1094
1094
  border-radius: 0.75rem;
1095
1095
  padding: 1rem 1.25rem;
1096
- background-color: #fff;
1096
+ background-color: var(--kb-neutral-0);
1097
1097
  }
1098
1098
 
1099
1099
  .kaui-new-catalog #fileName {
1100
1100
  font-weight: 500;
1101
1101
  font-size: 0.875rem;
1102
1102
  line-height: 1.25rem;
1103
- color: #414651;
1103
+ color: var(--kb-on-surface-secondary);
1104
1104
  }
1105
1105
 
1106
1106
  .kaui-new-catalog .upload-content p {
1107
1107
  margin: 0;
1108
- color: #555;
1108
+ color: var(--kb-on-surface-secondary);
1109
1109
  }
1110
1110
 
1111
1111
  .kaui-new-catalog .upload-content .highlight {
1112
- color: #1570ef;
1112
+ color: var(--kb-primary);
1113
1113
  font-weight: 500;
1114
1114
  cursor: pointer;
1115
1115
  }
@@ -1129,7 +1129,7 @@
1129
1129
  font-size: 1.125rem;
1130
1130
  line-height: 1.75rem;
1131
1131
  letter-spacing: 0;
1132
- color: #1B1C1E;
1132
+ color: var(--kb-on-surface-primary);
1133
1133
  padding: 1.5rem 0;
1134
1134
  }
1135
1135
 
@@ -1137,7 +1137,7 @@
1137
1137
  display: inline-flex;
1138
1138
  justify-content: center;
1139
1139
  align-items: center;
1140
- border: 0.0625rem solid #D5D7DA;
1140
+ border: 0.0625rem solid var(--kb-outline-secondary);
1141
1141
  border-radius: 0.375rem;
1142
1142
  width: 2.5rem;
1143
1143
  height: 2.5rem;
@@ -1152,7 +1152,7 @@
1152
1152
  .kaui-new-overdue-config .toggle-segment {
1153
1153
  display: flex;
1154
1154
  align-items: center;
1155
- border: 0.0625rem solid #D5D7DA;
1155
+ border: 0.0625rem solid var(--kb-outline-secondary);
1156
1156
  width: fit-content;
1157
1157
  border-radius: 0.375rem;
1158
1158
  overflow: hidden;
@@ -1164,8 +1164,8 @@
1164
1164
  align-items: center;
1165
1165
  padding: 0.625rem 1rem;
1166
1166
  cursor: pointer;
1167
- color: #414651;
1168
- border-right: 0.0625rem solid #D5D7DA;
1167
+ color: var(--kb-on-surface-secondary);
1168
+ border-right: 0.0625rem solid var(--kb-outline-secondary);
1169
1169
  font-weight: 500;
1170
1170
  font-size: 0.875rem;
1171
1171
  line-height: 1.25rem;
@@ -1182,14 +1182,14 @@
1182
1182
  display: none;
1183
1183
  width: 0.5rem;
1184
1184
  height: 0.5rem;
1185
- background-color: #17B26A;
1185
+ background-color: var(--kb-success-pressed);
1186
1186
  border-radius: 50%;
1187
1187
  }
1188
1188
 
1189
1189
  .kaui-new-overdue-config .toggle-segment .toggle-option.active-btn {
1190
- background-color: #FAFAFA;
1190
+ background-color: var(--kb-surface-container-low);
1191
1191
  font-weight: 600;
1192
- color: #252B37;
1192
+ color: var(--kb-neutral-700);
1193
1193
  gap: 1rem;
1194
1194
  }
1195
1195
 
@@ -1201,14 +1201,14 @@
1201
1201
  font-size: 0.875rem !important;
1202
1202
  font-weight: 500 !important;
1203
1203
  line-height: 1.25rem !important;
1204
- color: #414651 !important;
1204
+ color: var(--kb-on-surface-secondary) !important;
1205
1205
  }
1206
1206
 
1207
1207
  .kaui-new-overdue-config .new-overdue-states-button {
1208
1208
  padding: 0 !important;
1209
1209
  background-color: transparent !important;
1210
1210
  border: none !important;
1211
- color: #175CD3 !important;
1211
+ color: var(--kb-primary) !important;
1212
1212
  font-weight: 500;
1213
1213
  font-size: 0.875rem;
1214
1214
  line-height: 1.25rem;
@@ -1249,10 +1249,10 @@
1249
1249
  font-size: 1rem;
1250
1250
  font-weight: 400;
1251
1251
  line-height: 1.5;
1252
- color: #212529;
1253
- background-color: #fff;
1252
+ color: var(--kb-neutral-800);
1253
+ background-color: var(--kb-neutral-0);
1254
1254
  background-clip: padding-box;
1255
- border: 0.0625rem solid #ced4da;
1255
+ border: 0.0625rem solid var(--kb-outline-secondary);
1256
1256
  border-radius: 0.375rem;
1257
1257
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
1258
1258
  background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4 6L8 10L12 6" stroke="%23A4A7AE" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
@@ -1273,9 +1273,9 @@
1273
1273
  font-size: 0.75rem;
1274
1274
  line-height: 1.125rem;
1275
1275
  letter-spacing: 0;
1276
- color: #717680;
1276
+ color: var(--kb-on-surface-quaternary);
1277
1277
  text-transform: capitalize;
1278
- background-color: #FAFAFA !important;
1278
+ background-color: var(--kb-surface-container-low) !important;
1279
1279
  max-width: 8.5625rem !important;
1280
1280
  }
1281
1281
 
@@ -1285,7 +1285,7 @@
1285
1285
  padding: 0.3125rem 0.75rem !important;
1286
1286
  line-height: 1.125rem !important;
1287
1287
  text-align: start;
1288
- color: #535862 !important;
1288
+ color: var(--kb-on-surface-tertiary) !important;
1289
1289
  max-width: 8.5625rem !important;
1290
1290
  }
1291
1291
 
@@ -1302,10 +1302,10 @@
1302
1302
  font-size: 1rem;
1303
1303
  font-weight: 400;
1304
1304
  line-height: 1.5;
1305
- color: #212529;
1306
- background-color: #fff;
1305
+ color: var(--kb-neutral-800);
1306
+ background-color: var(--kb-neutral-0);
1307
1307
  background-clip: padding-box;
1308
- border: 0.0625rem solid #ced4da;
1308
+ border: 0.0625rem solid var(--kb-outline-secondary);
1309
1309
  border-radius: 0.375rem;
1310
1310
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
1311
1311
  }
@@ -1313,13 +1313,13 @@
1313
1313
  .kaui-new-overdue-config table.existing-overdue-config-for-tenants td input:focus {
1314
1314
  box-shadow: none;
1315
1315
  outline: none;
1316
- border-color: #1570ef;
1316
+ border-color: var(--kb-primary);
1317
1317
  }
1318
1318
 
1319
1319
  .kaui-new-overdue-config select:focus {
1320
1320
  box-shadow: none;
1321
1321
  outline: none;
1322
- border-color: #1570ef;
1322
+ border-color: var(--kb-primary);
1323
1323
  }
1324
1324
 
1325
1325
  /* app/views/kaui/admin_tenants/new_plan_currency.html.erb */
@@ -1332,7 +1332,7 @@
1332
1332
  font-size: 1.125rem;
1333
1333
  line-height: 1.75rem;
1334
1334
  letter-spacing: 0;
1335
- color: #1B1C1E;
1335
+ color: var(--kb-on-surface-primary);
1336
1336
  padding: 1.5rem 0;
1337
1337
  }
1338
1338
 
@@ -1340,7 +1340,7 @@
1340
1340
  display: inline-flex;
1341
1341
  justify-content: center;
1342
1342
  align-items: center;
1343
- border: 0.0625rem solid #D5D7DA;
1343
+ border: 0.0625rem solid var(--kb-outline-secondary);
1344
1344
  border-radius: 0.375rem;
1345
1345
  width: 2.5rem;
1346
1346
  height: 2.5rem;
@@ -1356,11 +1356,11 @@
1356
1356
  font-size: 0.875rem !important;
1357
1357
  font-weight: 500 !important;
1358
1358
  line-height: 1.25rem !important;
1359
- color: #414651 !important;
1359
+ color: var(--kb-on-surface-secondary) !important;
1360
1360
  }
1361
1361
 
1362
1362
  .catalog-simple-new-plan-currency .question-circle {
1363
- color: #A4A7AE;
1363
+ color: var(--kb-on-surface-quaternary);
1364
1364
  font-size: 1rem;
1365
1365
  width: 1rem;
1366
1366
  height: 1rem;
@@ -1396,10 +1396,10 @@
1396
1396
  font-size: 1rem;
1397
1397
  font-weight: 400;
1398
1398
  line-height: 1.5;
1399
- color: #212529;
1400
- background-color: #fff;
1399
+ color: var(--kb-neutral-800);
1400
+ background-color: var(--kb-neutral-0);
1401
1401
  background-clip: padding-box;
1402
- border: 0.0625rem solid #ced4da;
1402
+ border: 0.0625rem solid var(--kb-outline-secondary);
1403
1403
  border-left: none;
1404
1404
  border-radius: 0 0.375rem 0.375rem 0 !important;
1405
1405
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@@ -1413,12 +1413,12 @@
1413
1413
  .catalog-simple-new-plan-currency select:focus {
1414
1414
  box-shadow: none;
1415
1415
  outline: none;
1416
- border-color: #1570ef;
1416
+ border-color: var(--kb-primary);
1417
1417
  }
1418
1418
 
1419
1419
  .catalog-simple-new-plan-currency .amount-input {
1420
1420
  height: 2.5rem;
1421
- border: 0.0625rem solid #D5D7DA;
1421
+ border: 0.0625rem solid var(--kb-outline-secondary);
1422
1422
  border-right: none;
1423
1423
  border-radius: 0.375rem 0 0 0.375rem !important;
1424
1424
  }
@@ -1431,10 +1431,10 @@
1431
1431
  font-size: 1rem;
1432
1432
  font-weight: 400;
1433
1433
  line-height: 1.5;
1434
- color: #212529;
1435
- background-color: #fff;
1434
+ color: var(--kb-neutral-800);
1435
+ background-color: var(--kb-neutral-0);
1436
1436
  background-clip: padding-box;
1437
- border: 0.0625rem solid #ced4da;
1437
+ border: 0.0625rem solid var(--kb-outline-secondary);
1438
1438
  border-radius: 0.375rem;
1439
1439
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
1440
1440
  }
@@ -1442,13 +1442,13 @@
1442
1442
  .catalog-simple-new-plan-currency .additional-base-products select:focus {
1443
1443
  box-shadow: none;
1444
1444
  outline: none;
1445
- border-color: #1570ef;
1445
+ border-color: var(--kb-primary);
1446
1446
  }
1447
1447
 
1448
1448
  .catalog-simple-new-plan-currency .toggle-segment {
1449
1449
  display: flex;
1450
1450
  align-items: center;
1451
- border: 0.0625rem solid #D5D7DA;
1451
+ border: 0.0625rem solid var(--kb-outline-secondary);
1452
1452
  width: fit-content;
1453
1453
  border-radius: 0.375rem;
1454
1454
  overflow: hidden;
@@ -1460,8 +1460,8 @@
1460
1460
  align-items: center;
1461
1461
  padding: 0.625rem 1rem;
1462
1462
  cursor: pointer;
1463
- color: #414651;
1464
- border-right: 0.0625rem solid #D5D7DA;
1463
+ color: var(--kb-on-surface-secondary);
1464
+ border-right: 0.0625rem solid var(--kb-outline-secondary);
1465
1465
  font-weight: 500;
1466
1466
  font-size: 0.875rem;
1467
1467
  line-height: 1.25rem;
@@ -1478,14 +1478,14 @@
1478
1478
  display: none;
1479
1479
  width: 0.5rem;
1480
1480
  height: 0.5rem;
1481
- background-color: #17B26A;
1481
+ background-color: var(--kb-success-pressed);
1482
1482
  border-radius: 50%;
1483
1483
  }
1484
1484
 
1485
1485
  .catalog-simple-new-plan-currency .toggle-segment .toggle-option.active-btn {
1486
- background-color: #FAFAFA;
1486
+ background-color: var(--kb-surface-container-low);
1487
1487
  font-weight: 600;
1488
- color: #252B37;
1488
+ color: var(--kb-neutral-700);
1489
1489
  gap: 1rem;
1490
1490
  }
1491
1491
 
@@ -1494,34 +1494,34 @@
1494
1494
  }
1495
1495
 
1496
1496
  .catalog-simple-new-plan-currency .upload-status {
1497
- border: 0.0625rem solid #E9EAEB;
1497
+ border: 0.0625rem solid var(--kb-outline-primary);
1498
1498
  border-radius: 0.75rem;
1499
- background-color: #fff;
1499
+ background-color: var(--kb-neutral-0);
1500
1500
  padding: 1rem 1.5rem;
1501
1501
  margin-top: 1rem;
1502
1502
  }
1503
1503
 
1504
1504
  .catalog-simple-new-plan-currency .upload-status-box {
1505
- border: 0.0625rem solid #d5d7da;
1505
+ border: 0.0625rem solid var(--kb-outline-secondary);
1506
1506
  border-radius: 0.75rem;
1507
1507
  padding: 1rem 1.25rem;
1508
- background-color: #fff;
1508
+ background-color: var(--kb-neutral-0);
1509
1509
  }
1510
1510
 
1511
1511
  .catalog-simple-new-plan-currency #fileName {
1512
1512
  font-weight: 500;
1513
1513
  font-size: 0.875rem;
1514
1514
  line-height: 1.25rem;
1515
- color: #414651;
1515
+ color: var(--kb-on-surface-secondary);
1516
1516
  }
1517
1517
 
1518
1518
  .catalog-simple-new-plan-currency .upload-content p {
1519
1519
  margin: 0;
1520
- color: #555;
1520
+ color: var(--kb-on-surface-secondary);
1521
1521
  }
1522
1522
 
1523
1523
  .catalog-simple-new-plan-currency .upload-content .highlight {
1524
- color: #1570ef;
1524
+ color: var(--kb-primary);
1525
1525
  font-weight: 500;
1526
1526
  cursor: pointer;
1527
1527
  }