@transferwise/components 0.0.0-experimental-7df8816 → 0.0.0-experimental-bca35d9

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 (142) hide show
  1. package/build/main.css +350 -206
  2. package/build/mocks.js +7 -0
  3. package/build/mocks.js.map +1 -1
  4. package/build/mocks.mjs +7 -1
  5. package/build/mocks.mjs.map +1 -1
  6. package/build/styles/accordion/Accordion.css +2 -6
  7. package/build/styles/actionButton/ActionButton.css +12 -4
  8. package/build/styles/avatar/Avatar.css +13 -10
  9. package/build/styles/avatarView/AvatarView.css +5 -3
  10. package/build/styles/avatarView/Dot.css +2 -1
  11. package/build/styles/button/Button.css +1 -0
  12. package/build/styles/card/Card.css +2 -2
  13. package/build/styles/carousel/Carousel.css +5 -2
  14. package/build/styles/checkboxButton/CheckboxButton.css +0 -1
  15. package/build/styles/chips/Chip.css +31 -12
  16. package/build/styles/circularButton/CircularButton.css +6 -0
  17. package/build/styles/common/Option/Option.css +2 -2
  18. package/build/styles/common/RadioButton/RadioButton.css +1 -1
  19. package/build/styles/common/bottomSheet/BottomSheet.css +1 -1
  20. package/build/styles/common/card/Card.css +1 -1
  21. package/build/styles/common/closeButton/CloseButton.css +7 -2
  22. package/build/styles/criticalBanner/CriticalCommsBanner.css +4 -0
  23. package/build/styles/dateLookup/DateLookup.css +5 -3
  24. package/build/styles/definitionList/DefinitionList.css +1 -1
  25. package/build/styles/divider/Divider.css +1 -1
  26. package/build/styles/emphasis/Emphasis.css +4 -5
  27. package/build/styles/expressiveMoneyInput/ExpressiveMoneyInput.css +2 -0
  28. package/build/styles/expressiveMoneyInput/amountInput/AmountInput.css +1 -0
  29. package/build/styles/expressiveMoneyInput/chevron/Chevron.css +1 -0
  30. package/build/styles/flowNavigation/FlowNavigation.css +2 -1
  31. package/build/styles/header/Header.css +2 -2
  32. package/build/styles/iconButton/IconButton.css +27 -4
  33. package/build/styles/inputs/Input.css +5 -5
  34. package/build/styles/inputs/InputGroup.css +3 -2
  35. package/build/styles/inputs/SelectInput.css +14 -13
  36. package/build/styles/inputs/TextArea.css +5 -5
  37. package/build/styles/instructionsList/InstructionsList.css +2 -0
  38. package/build/styles/listItem/ListItem.css +22 -8
  39. package/build/styles/logo/Logo.css +2 -0
  40. package/build/styles/main.css +350 -206
  41. package/build/styles/moneyInput/MoneyInput.css +2 -2
  42. package/build/styles/navigationOption/NavigationOption.css +1 -3
  43. package/build/styles/nudge/Nudge.css +1 -1
  44. package/build/styles/overlayHeader/OverlayHeader.css +2 -1
  45. package/build/styles/popover/Popover.css +2 -2
  46. package/build/styles/progress/Progress.css +3 -3
  47. package/build/styles/progressBar/ProgressBar.css +2 -2
  48. package/build/styles/promoCard/PromoCard.css +3 -3
  49. package/build/styles/prompt/InlinePrompt/InlinePrompt.css +39 -3
  50. package/build/styles/segmentedControl/SegmentedControl.css +6 -2
  51. package/build/styles/select/Select.css +25 -41
  52. package/build/styles/slidingPanel/SlidingPanel.css +4 -4
  53. package/build/styles/snackbar/Snackbar.css +4 -4
  54. package/build/styles/statusIcon/StatusIcon.css +10 -2
  55. package/build/styles/stepper/Stepper.css +4 -4
  56. package/build/styles/summary/Summary.css +5 -2
  57. package/build/styles/switch/Switch.css +3 -2
  58. package/build/styles/table/Table.css +13 -5
  59. package/build/styles/tabs/Tabs.css +10 -9
  60. package/build/styles/tile/Tile.css +8 -5
  61. package/build/styles/typeahead/Typeahead.css +2 -1
  62. package/build/styles/typeahead/typeaheadOption/TypeaheadOption.css +1 -4
  63. package/build/styles/upload/Upload.css +1 -1
  64. package/build/styles/uploadInput/uploadButton/UploadButton.css +4 -2
  65. package/build/styles/uploadInput/uploadItem/UploadItem.css +8 -4
  66. package/build/types/mocks.d.ts +1 -0
  67. package/build/types/mocks.d.ts.map +1 -1
  68. package/build/types/test-utils/window-mock.d.ts +1 -0
  69. package/build/types/test-utils/window-mock.d.ts.map +1 -1
  70. package/package.json +5 -5
  71. package/src/accordion/Accordion.css +2 -6
  72. package/src/accordion/Accordion.less +0 -7
  73. package/src/actionButton/ActionButton.css +12 -4
  74. package/src/avatar/Avatar.css +13 -10
  75. package/src/avatarView/AvatarView.css +5 -3
  76. package/src/avatarView/Dot.css +2 -1
  77. package/src/button/Button.css +1 -0
  78. package/src/card/Card.css +2 -2
  79. package/src/carousel/Carousel.css +5 -2
  80. package/src/checkboxButton/CheckboxButton.css +0 -1
  81. package/src/chips/Chip.css +31 -12
  82. package/src/circularButton/CircularButton.css +6 -0
  83. package/src/common/Option/Option.css +2 -2
  84. package/src/common/RadioButton/RadioButton.css +1 -1
  85. package/src/common/bottomSheet/BottomSheet.css +1 -1
  86. package/src/common/card/Card.css +1 -1
  87. package/src/common/closeButton/CloseButton.css +7 -2
  88. package/src/criticalBanner/CriticalCommsBanner.css +4 -0
  89. package/src/dateLookup/DateLookup.css +5 -3
  90. package/src/definitionList/DefinitionList.css +1 -1
  91. package/src/divider/Divider.css +1 -1
  92. package/src/emphasis/Emphasis.css +4 -5
  93. package/src/expressiveMoneyInput/ExpressiveMoneyInput.css +2 -0
  94. package/src/expressiveMoneyInput/ExpressiveMoneyInput.spec.tsx +229 -0
  95. package/src/expressiveMoneyInput/amountInput/AmountInput.css +1 -0
  96. package/src/expressiveMoneyInput/amountInput/AmountInput.spec.tsx +282 -0
  97. package/src/expressiveMoneyInput/chevron/Chevron.css +1 -0
  98. package/src/expressiveMoneyInput/currencySelector/CurrencySelector.spec.tsx +160 -0
  99. package/src/flowNavigation/FlowNavigation.css +2 -1
  100. package/src/header/Header.css +2 -2
  101. package/src/iconButton/IconButton.css +27 -4
  102. package/src/inputs/Input.css +5 -5
  103. package/src/inputs/InputGroup.css +3 -2
  104. package/src/inputs/SelectInput.css +14 -13
  105. package/src/inputs/SelectInput.spec.tsx +7 -1
  106. package/src/inputs/TextArea.css +5 -5
  107. package/src/instructionsList/InstructionsList.css +2 -0
  108. package/src/listItem/ListItem.css +22 -8
  109. package/src/logo/Logo.css +2 -0
  110. package/src/main.css +350 -206
  111. package/src/mocks.ts +7 -0
  112. package/src/moneyInput/MoneyInput.css +2 -2
  113. package/src/moneyInput/MoneyInput.spec.tsx +9 -1
  114. package/src/navigationOption/NavigationOption.css +1 -3
  115. package/src/nudge/Nudge.css +1 -1
  116. package/src/overlayHeader/OverlayHeader.css +2 -1
  117. package/src/popover/Popover.css +2 -2
  118. package/src/progress/Progress.css +3 -3
  119. package/src/progressBar/ProgressBar.css +2 -2
  120. package/src/promoCard/PromoCard.css +3 -3
  121. package/src/prompt/InlinePrompt/InlinePrompt.css +39 -3
  122. package/src/segmentedControl/SegmentedControl.css +6 -2
  123. package/src/select/Select.css +25 -41
  124. package/src/select/Select.less +0 -24
  125. package/src/slidingPanel/SlidingPanel.css +4 -4
  126. package/src/snackbar/Snackbar.css +4 -4
  127. package/src/snackbar/Snackbar.less +2 -4
  128. package/src/statusIcon/StatusIcon.css +10 -2
  129. package/src/stepper/Stepper.css +4 -4
  130. package/src/summary/Summary.css +5 -2
  131. package/src/switch/Switch.css +3 -2
  132. package/src/table/Table.css +13 -5
  133. package/src/tabs/Tabs.css +10 -9
  134. package/src/test-utils/jest.setup.ts +0 -5
  135. package/src/test-utils/window-mock.ts +5 -0
  136. package/src/tile/Tile.css +8 -5
  137. package/src/typeahead/Typeahead.css +2 -1
  138. package/src/typeahead/typeaheadOption/TypeaheadOption.css +1 -4
  139. package/src/typeahead/typeaheadOption/TypeaheadOption.less +0 -6
  140. package/src/upload/Upload.css +1 -1
  141. package/src/uploadInput/uploadButton/UploadButton.css +4 -2
  142. package/src/uploadInput/uploadItem/UploadItem.css +8 -4
@@ -1,8 +1,11 @@
1
1
  .np-theme-personal .critical-comms .alert-warning {
2
+ color: #ffffff;
2
3
  color: var(--color-contrast-overlay);
4
+ background-color: #cb272f;
3
5
  background-color: var(--color-sentiment-negative);
4
6
  }
5
7
  .np-theme-personal .critical-comms .alert-warning .np-text-title-body {
8
+ color: #ffffff;
6
9
  color: var(--color-contrast-overlay);
7
10
  }
8
11
  .np-theme-personal .critical-comms .status-circle.warning {
@@ -10,6 +13,7 @@
10
13
  background-color: var(--color-background-screen);
11
14
  }
12
15
  .np-theme-personal .critical-comms .status-circle.warning .status-icon {
16
+ color: #121511;
13
17
  color: var(--color-contrast-theme);
14
18
  }
15
19
  .np-theme-personal .critical-comms .alert__message .alert__action {
@@ -44,14 +48,10 @@
44
48
  .np-accordion-item .decision:not(.disabled):not(:disabled):hover {
45
49
  background-color: transparent;
46
50
  }
47
- .np-accordion-item.np-accordion-item--dark .media-body,
48
- .np-accordion-item.np-accordion-item--dark .np-text-title-body {
49
- color: #ffffff;
50
- }
51
51
  .np-accordion-item__content {
52
52
  padding: 0 12px 24px 12px;
53
53
  padding: 0 var(--size-12) var(--size-24) var(--size-12);
54
- border-bottom: 1px solid rgba(0,0,0,0.10196);
54
+ border-bottom: 1px solid rgba(14,15,12,0.12157);
55
55
  border-bottom: 1px solid var(--color-border-neutral);
56
56
  }
57
57
  @media (min-width: 480px) {
@@ -105,7 +105,7 @@
105
105
  padding: 0 56px 16px 16px;
106
106
  padding: 0 var(--size-56) var(--size-16) var(--size-16);
107
107
  border-bottom: none;
108
- color: #5d7079;
108
+ color: #454745;
109
109
  color: var(--color-content-secondary);
110
110
  }
111
111
  .np-action-btn {
@@ -124,8 +124,9 @@
124
124
  border-radius: 10px;
125
125
  border-radius: var(--radius-small);
126
126
  align-items: center;
127
+ color: #163300;
127
128
  color: var(--color-interactive-control);
128
- background-color: #00a2dd;
129
+ background-color: #9fe870;
129
130
  background-color: var(--color-interactive-accent);
130
131
  border-radius: 24px;
131
132
  border-radius: var(--radius-large);
@@ -138,35 +139,42 @@
138
139
  }
139
140
  }
140
141
  .np-action-btn.btn-priority-2 {
141
- background-color: rgba(134,167,189,0.10196);
142
+ background-color: rgba(22,51,0,0.07843);
142
143
  background-color: var(--color-background-neutral);
144
+ color: #163300;
143
145
  color: var(--color-interactive-primary);
144
146
  }
145
147
  .np-action-btn.btn-priority-3 {
146
148
  background-color: transparent !important;
149
+ color: #163300;
147
150
  color: var(--color-interactive-primary);
148
151
  }
149
152
  .np-action-btn:not(:disabled):hover {
150
- background-color: #008fc9;
153
+ background-color: #80e142;
151
154
  background-color: var(--color-interactive-accent-hover);
152
155
  }
153
156
  .np-action-btn:not(:disabled):hover.btn-priority-2 {
157
+ background-color: rgba(22,51,0,0.12941);
154
158
  background-color: var(--color-background-neutral-hover);
155
159
  }
156
160
  .np-action-btn:not(:disabled):hover.btn-priority-3 {
161
+ color: #0d1f00;
157
162
  color: var(--color-interactive-primary-hover);
158
163
  }
159
164
  .np-action-btn:not(:disabled):active {
160
165
  box-shadow: none;
161
166
  border-color: transparent;
162
- background-color: #0081ba;
167
+ background-color: #65cf21;
163
168
  background-color: var(--color-interactive-accent-active);
164
169
  }
165
170
  .np-action-btn:not(:disabled):active.btn-priority-2 {
171
+ background-color: rgba(22,51,0,0.18039);
166
172
  background-color: var(--color-background-neutral-active);
167
173
  }
168
174
  .np-action-btn:not(:disabled):active.btn-priority-3 {
175
+ color: #0e0f0c;
169
176
  color: var(--color-interactive-primary-active);
177
+ background-color: rgba(22,51,0,0.12941) !important;
170
178
  background-color: var(--color-background-screen-active) !important;
171
179
  }
172
180
  .np-action-btn:not(:disabled):focus {
@@ -194,10 +202,10 @@
194
202
  .tw-avatar .tw-avatar__content {
195
203
  align-items: center;
196
204
  background-color: rgba(134,167,189,0.10196);
197
- background-color: #86a7bd1a;
205
+ background-color: #16330014;
198
206
  background-color: var(--color-background-neutral);
199
207
  border-radius: 50%;
200
- color: #37517e;
208
+ color: #0e0f0c;
201
209
  color: var(--color-content-primary);
202
210
  display: flex;
203
211
  height: 100%;
@@ -208,12 +216,12 @@
208
216
  width: 100%;
209
217
  }
210
218
  .tw-avatar--outlined {
211
- border: 1px solid #00a2dd;
219
+ border: 1px solid #9fe870;
212
220
  border: 1px solid var(--color-interactive-accent);
213
221
  cursor: pointer;
214
222
  }
215
223
  .tw-avatar--outlined:not(.disabled):not(:disabled):hover {
216
- border-color: #008fc9;
224
+ border-color: #80e142;
217
225
  border-color: var(--color-interactive-accent-hover);
218
226
  }
219
227
  .tw-avatar--thumbnail * {
@@ -234,7 +242,7 @@
234
242
  }
235
243
  .tw-avatar.tw-avatar--initials,
236
244
  .tw-avatar.tw-avatar--icon {
237
- color: #37517e;
245
+ color: #0e0f0c;
238
246
  color: var(--color-content-primary);
239
247
  }
240
248
  .tw-avatar.tw-avatar--initials,
@@ -245,6 +253,7 @@
245
253
  font-family: 'Wise Sans', 'Inter', sans-serif;
246
254
  font-family: var(--font-family-display);
247
255
  font-feature-settings: "ss01";
256
+ color: #21231d;
248
257
  color: var(--color-dark-charcoal);
249
258
  line-height: 1;
250
259
  }
@@ -278,7 +287,7 @@
278
287
  left: 0;
279
288
  right: 0;
280
289
  bottom: 0;
281
- border: 1px solid rgba(0,0,0,0.10196);
290
+ border: 1px solid rgba(14,15,12,0.12157);
282
291
  border: 1px solid var(--color-border-overlay);
283
292
  content: "";
284
293
  border-radius: 50%;
@@ -313,7 +322,7 @@
313
322
  left: 0;
314
323
  right: 0;
315
324
  bottom: 0;
316
- border: 1px solid rgba(0,0,0,0.10196);
325
+ border: 1px solid rgba(14,15,12,0.12157);
317
326
  border: 1px solid var(--color-border-overlay);
318
327
  content: "";
319
328
  border-radius: 50%;
@@ -348,7 +357,7 @@
348
357
  left: 0;
349
358
  right: 0;
350
359
  bottom: 0;
351
- border: 1px solid rgba(0,0,0,0.10196);
360
+ border: 1px solid rgba(14,15,12,0.12157);
352
361
  border: 1px solid var(--color-border-overlay);
353
362
  content: "";
354
363
  border-radius: 50%;
@@ -383,7 +392,7 @@
383
392
  left: 0;
384
393
  right: 0;
385
394
  bottom: 0;
386
- border: 1px solid rgba(0,0,0,0.10196);
395
+ border: 1px solid rgba(14,15,12,0.12157);
387
396
  border: 1px solid var(--color-border-overlay);
388
397
  content: "";
389
398
  border-radius: 50%;
@@ -418,7 +427,7 @@
418
427
  left: 0;
419
428
  right: 0;
420
429
  bottom: 0;
421
- border: 1px solid rgba(0,0,0,0.10196);
430
+ border: 1px solid rgba(14,15,12,0.12157);
422
431
  border: 1px solid var(--color-border-overlay);
423
432
  content: "";
424
433
  border-radius: 50%;
@@ -428,9 +437,11 @@
428
437
  height: 100%;
429
438
  }
430
439
  .np-theme-personal .tw-avatar--outlined {
440
+ border-color: #163300;
431
441
  border-color: var(--color-interactive-primary);
432
442
  }
433
443
  .np-theme-personal .tw-avatar--outlined:not(.disabled):not(:disabled):hover {
444
+ border-color: #0d1f00;
434
445
  border-color: var(--color-interactive-primary-hover);
435
446
  }
436
447
  .wds-inline-prompt {
@@ -479,66 +490,85 @@
479
490
  }
480
491
  .wds-inline-prompt__media-wrapper .tw-icon-tags,
481
492
  .wds-inline-prompt__media-wrapper .tw-icon-confetti {
493
+ color: #054d28;
482
494
  color: var(--color-sentiment-positive-primary);
483
495
  }
484
496
  .wds-inline-prompt--negative {
497
+ background-color: #fbeaea;
485
498
  background-color: var(--color-sentiment-negative-secondary);
499
+ color: #cb272f;
486
500
  color: var(--color-sentiment-negative-primary);
487
501
  }
488
502
  .wds-inline-prompt--negative a,
489
503
  .wds-inline-prompt--negative button {
504
+ color: #cb272f;
490
505
  color: var(--color-sentiment-negative-primary);
491
506
  }
492
507
  .wds-inline-prompt--negative a:hover,
493
508
  .wds-inline-prompt--negative button:hover {
509
+ color: #b8232b;
494
510
  color: var(--color-sentiment-negative-primary-hover);
495
511
  }
496
512
  .wds-inline-prompt--negative a:active,
497
513
  .wds-inline-prompt--negative button:active {
514
+ color: #a72027;
498
515
  color: var(--color-sentiment-negative-primary-active);
499
516
  }
500
517
  .wds-inline-prompt.wds-inline-prompt--negative:has(a, button):hover {
518
+ background-color: #f9e1e1;
501
519
  background-color: var(--color-sentiment-negative-secondary-hover);
502
520
  }
503
521
  .wds-inline-prompt.wds-inline-prompt--negative:has(a, button):active {
522
+ background-color: #f8d8d8;
504
523
  background-color: var(--color-sentiment-negative-secondary-active);
505
524
  }
506
525
  .wds-inline-prompt--positive {
526
+ background-color: #e2f6d5;
507
527
  background-color: var(--color-sentiment-positive-secondary);
528
+ color: #054d28;
508
529
  color: var(--color-sentiment-positive-primary);
509
530
  }
510
531
  .wds-inline-prompt--positive a,
511
532
  .wds-inline-prompt--positive button {
533
+ color: #054d28;
512
534
  color: var(--color-sentiment-positive-primary);
513
535
  }
514
536
  .wds-inline-prompt--positive a:hover,
515
537
  .wds-inline-prompt--positive button:hover {
538
+ color: #043a1e;
516
539
  color: var(--color-sentiment-positive-primary-hover);
517
540
  }
518
541
  .wds-inline-prompt--positive a:active,
519
542
  .wds-inline-prompt--positive button:active {
543
+ color: #022614;
520
544
  color: var(--color-sentiment-positive-primary-active);
521
545
  }
522
546
  .wds-inline-prompt.wds-inline-prompt--positive:has(a, button):hover {
547
+ background-color: #d3f2c0;
523
548
  background-color: var(--color-sentiment-positive-secondary-hover);
524
549
  }
525
550
  .wds-inline-prompt.wds-inline-prompt--positive:has(a, button):active {
551
+ background-color: #c5edab;
526
552
  background-color: var(--color-sentiment-positive-secondary-active);
527
553
  }
528
554
  .wds-inline-prompt--proposition {
529
555
  background-color: #D2F9F7;
556
+ color: #163300;
530
557
  color: var(--color-interactive-primary);
531
558
  }
532
559
  .wds-inline-prompt--proposition a,
533
560
  .wds-inline-prompt--proposition button {
561
+ color: #163300;
534
562
  color: var(--color-interactive-primary);
535
563
  }
536
564
  .wds-inline-prompt--proposition a:hover,
537
565
  .wds-inline-prompt--proposition button:hover {
566
+ color: #0d1f00;
538
567
  color: var(--color-interactive-primary-hover);
539
568
  }
540
569
  .wds-inline-prompt--proposition a:active,
541
570
  .wds-inline-prompt--proposition button:active {
571
+ color: #0e0f0c;
542
572
  color: var(--color-interactive-primary-active);
543
573
  }
544
574
  .wds-inline-prompt.wds-inline-prompt--proposition:has(a, button):hover {
@@ -548,44 +578,61 @@
548
578
  background-color: #91F0EE;
549
579
  }
550
580
  .wds-inline-prompt--neutral {
551
- background-color: rgba(134,167,189,0.10196);
581
+ background-color: rgba(22,51,0,0.07843);
552
582
  background-color: var(--color-background-neutral);
553
- color: #37517e;
583
+ color: #0e0f0c;
554
584
  color: var(--color-content-primary);
555
585
  }
556
586
  .wds-inline-prompt--neutral a,
557
587
  .wds-inline-prompt--neutral button {
558
- color: #37517e;
588
+ color: #0e0f0c;
559
589
  color: var(--color-content-primary);
560
590
  }
561
591
  .wds-inline-prompt.wds-inline-prompt--neutral:has(a, button):hover {
592
+ background-color: rgba(22,51,0,0.12941);
562
593
  background-color: var(--color-background-neutral-hover);
563
594
  }
564
595
  .wds-inline-prompt.wds-inline-prompt--neutral:has(a, button):active {
596
+ background-color: rgba(22,51,0,0.18039);
565
597
  background-color: var(--color-background-neutral-active);
566
598
  }
567
599
  .wds-inline-prompt--warning {
600
+ background-color: #fff7d7;
568
601
  background-color: var(--color-sentiment-warning-secondary);
602
+ color: #4a3b1c;
569
603
  color: var(--color-sentiment-warning-content);
570
604
  }
571
605
  .wds-inline-prompt--warning a,
572
606
  .wds-inline-prompt--warning button {
607
+ color: #4a3b1c;
573
608
  color: var(--color-sentiment-warning-content);
574
609
  }
575
610
  .wds-inline-prompt--warning a:hover,
576
611
  .wds-inline-prompt--warning button:hover {
612
+ color: #3b2f16;
577
613
  color: var(--color-sentiment-warning-content-hover);
578
614
  }
579
615
  .wds-inline-prompt--warning a:active,
580
616
  .wds-inline-prompt--warning button:active {
617
+ color: #2c2311;
581
618
  color: var(--color-sentiment-warning-content-active);
582
619
  }
620
+ .wds-inline-prompt.wds-inline-prompt--warning:has(a, button):hover {
621
+ background-color: rgb(255, 244, 200);
622
+ }
623
+ @supports (color: color-mix(in lch, red, blue)) {
583
624
  .wds-inline-prompt.wds-inline-prompt--warning:has(a, button):hover {
584
625
  background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 92%, var(--color-sentiment-warning-primary));
585
626
  }
627
+ }
628
+ .wds-inline-prompt.wds-inline-prompt--warning:has(a, button):active {
629
+ background-color: rgb(255, 241, 185);
630
+ }
631
+ @supports (color: color-mix(in lch, red, blue)) {
586
632
  .wds-inline-prompt.wds-inline-prompt--warning:has(a, button):active {
587
633
  background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 84%, var(--color-sentiment-warning-primary));
588
634
  }
635
+ }
589
636
  .np-dot {
590
637
  --np-dot-size: 14px;
591
638
  position: relative;
@@ -606,22 +653,24 @@
606
653
  right: 0;
607
654
  }
608
655
  .np-dot-badge-notification {
656
+ background-color: #cb272f;
609
657
  background-color: var(--color-sentiment-negative);
610
658
  }
611
659
  .np-dot-badge-online {
612
- background-color: #00a2dd;
660
+ background-color: #9fe870;
613
661
  background-color: var(--color-interactive-accent);
614
662
  }
615
663
  .np-avatar-view .np-avatar-view-content {
616
- color: #37517e;
664
+ color: #0e0f0c;
617
665
  color: var(--color-content-primary);
618
666
  }
619
667
  .np-avatar-view-interactive {
620
668
  cursor: pointer;
621
669
  }
622
670
  .np-avatar-view-interactive .np-circle {
623
- background-color: rgba(134,167,189,0.10196);
671
+ background-color: rgba(22,51,0,0.07843);
624
672
  background-color: var(--color-background-neutral);
673
+ color: #163300;
625
674
  color: var(--color-interactive-primary);
626
675
  }
627
676
  .np-avatar-view-non-interactive .np-circle {
@@ -676,82 +725,105 @@
676
725
  border: none;
677
726
  }
678
727
  .np-icon-button-tertiary-default {
728
+ color: #163300;
679
729
  color: var(--color-interactive-primary);
680
- background-color: rgba(134,167,189,0.10196);
730
+ background-color: rgba(22,51,0,0.07843);
681
731
  background-color: var(--color-background-neutral);
682
732
  }
683
733
  .np-icon-button-tertiary-default:not(.disabled):not(:disabled):hover {
734
+ background-color: rgba(22,51,0,0.12941);
684
735
  background-color: var(--color-background-neutral-hover);
685
736
  }
686
737
  .np-icon-button-tertiary-default:not(.disabled):not(:disabled):active {
738
+ background-color: rgba(22,51,0,0.18039);
687
739
  background-color: var(--color-background-neutral-active);
688
740
  }
689
741
  .np-icon-button-primary-default {
742
+ color: #163300;
690
743
  color: var(--color-interactive-control);
691
- background-color: #00a2dd;
744
+ background-color: #9fe870;
692
745
  background-color: var(--color-interactive-accent);
693
746
  }
694
747
  .np-icon-button-primary-default:not(.disabled):not(:disabled):hover {
695
- background-color: #008fc9;
748
+ background-color: #80e142;
696
749
  background-color: var(--color-interactive-accent-hover);
697
750
  }
698
751
  .np-icon-button-primary-default:not(.disabled):not(:disabled):active {
699
- background-color: #0081ba;
752
+ background-color: #65cf21;
700
753
  background-color: var(--color-interactive-accent-active);
701
754
  }
702
755
  .np-icon-button-primary-negative {
756
+ color: #ffffff;
703
757
  color: var(--color-contrast-overlay);
758
+ background-color: #cb272f;
704
759
  background-color: var(--color-sentiment-negative-primary);
705
760
  }
706
761
  .np-icon-button-primary-negative:not(.disabled):not(:disabled):hover {
762
+ background-color: #b8232b;
707
763
  background-color: var(--color-sentiment-negative-primary-hover);
708
764
  }
709
765
  .np-icon-button-primary-negative:not(.disabled):not(:disabled):active {
766
+ background-color: #a72027;
710
767
  background-color: var(--color-sentiment-negative-primary-active);
711
768
  }
712
769
  .np-theme-personal--bright-green .np-icon-button-primary-negative {
770
+ color: #ffffff;
713
771
  color: var(--color-white);
714
772
  }
715
773
  .np-icon-button-minimal-default {
774
+ color: #163300;
716
775
  color: var(--color-interactive-primary);
717
776
  background-color: #ffffff;
718
777
  background-color: var(--color-background-screen);
719
778
  background-color: transparent;
720
779
  }
721
780
  .np-icon-button-minimal-default:not(.disabled):not(:disabled):hover {
781
+ background-color: rgba(22,51,0,0.07843);
722
782
  background-color: var(--color-background-screen-hover);
723
783
  }
724
784
  .np-icon-button-minimal-default:not(.disabled):not(:disabled):active {
785
+ background-color: rgba(22,51,0,0.12941);
725
786
  background-color: var(--color-background-screen-active);
726
787
  }
727
788
  .np-icon-button-secondary-default {
789
+ color: #163300;
728
790
  color: var(--color-interactive-primary);
791
+ background-color: #e2f6d5;
729
792
  background-color: var(--color-interactive-neutral);
730
793
  }
731
794
  .np-icon-button-secondary-default:not(.disabled):not(:disabled):hover {
795
+ background-color: #d3f2c0;
732
796
  background-color: var(--color-interactive-neutral-hover);
733
797
  }
734
798
  .np-icon-button-secondary-default:not(.disabled):not(:disabled):active {
799
+ background-color: #c5edab;
735
800
  background-color: var(--color-interactive-neutral-active);
736
801
  }
737
802
  .np-theme-personal--bright-green .np-icon-button-secondary-default,
738
803
  .np-theme-personal--forest-green .np-icon-button-secondary-default {
804
+ color: #163300;
739
805
  color: var(--color-interactive-control);
740
806
  }
741
807
  .np-icon-button-secondary-negative {
808
+ color: #cb272f;
742
809
  color: var(--color-sentiment-negative-primary);
810
+ background-color: #fbeaea;
743
811
  background-color: var(--color-sentiment-negative-secondary);
744
812
  }
745
813
  .np-icon-button-secondary-negative:not(.disabled):not(:disabled):hover {
814
+ background-color: #f9e1e1;
746
815
  background-color: var(--color-sentiment-negative-secondary-hover);
747
816
  }
748
817
  .np-icon-button-secondary-negative:not(.disabled):not(:disabled):active {
818
+ background-color: #f8d8d8;
749
819
  background-color: var(--color-sentiment-negative-secondary-active);
750
820
  }
751
821
  .np-theme-personal--bright-green .np-icon-button-secondary-negative {
822
+ color: #ffffff;
752
823
  color: var(--color-white);
753
824
  }
754
825
  .np-theme-personal--forest-green .np-icon-button-secondary-negative {
826
+ color: #ffffff;
755
827
  color: var(--color-contrast-overlay);
756
828
  }
757
829
  .tw-badge {
@@ -960,6 +1032,7 @@
960
1032
  --Button-color-active: var(--Button-secondary-neutral-color);
961
1033
  }
962
1034
  .wds-Button--secondary-neutral .wds-Button-icon--end {
1035
+ color: #163300;
963
1036
  color: var(--color-interactive-primary);
964
1037
  }
965
1038
  .wds-Button--tertiary {
@@ -1103,7 +1176,7 @@
1103
1176
  .np-card--expanded {
1104
1177
  background-color: #ffffff;
1105
1178
  background-color: var(--color-background-elevated);
1106
- box-shadow: 0 1px 10px rgba(0,0,0,0.10196);
1179
+ box-shadow: 0 1px 10px rgba(14,15,12,0.12157);
1107
1180
  box-shadow: 0 1px 10px var(--color-border-neutral);
1108
1181
  }
1109
1182
  .np-theme-personal .np-card--expanded {
@@ -1156,7 +1229,7 @@
1156
1229
  transition: margin 0.35s ease;
1157
1230
  }
1158
1231
  .np-card__divider--expanded {
1159
- background-color: rgba(0,0,0,0.10196);
1232
+ background-color: rgba(14,15,12,0.12157);
1160
1233
  background-color: var(--color-border-neutral);
1161
1234
  height: 1px;
1162
1235
  margin: 0 16px;
@@ -1236,7 +1309,7 @@
1236
1309
  text-align: left;
1237
1310
  border: none;
1238
1311
  overflow: hidden;
1239
- background: rgba(134,167,189,0.10196);
1312
+ background: rgba(22,51,0,0.07843);
1240
1313
  background: var(--color-background-neutral);
1241
1314
  border-radius: 32px;
1242
1315
  border-radius: var(--size-32);
@@ -1281,9 +1354,11 @@
1281
1354
  outline-offset: var(--ring-outline-offset) !important;
1282
1355
  }
1283
1356
  .carousel__card:hover {
1357
+ background-color: rgba(22,51,0,0.12941);
1284
1358
  background-color: var(--color-background-neutral-hover);
1285
1359
  }
1286
1360
  .carousel__card:focus {
1361
+ background-color: rgba(22,51,0,0.12941);
1287
1362
  background-color: var(--color-background-neutral-hover);
1288
1363
  }
1289
1364
  .carousel__card-content {
@@ -1307,7 +1382,7 @@
1307
1382
  height: var(--size-12);
1308
1383
  border-radius: 8px;
1309
1384
  border-radius: var(--size-8);
1310
- background: #c9cbce;
1385
+ background: #868685;
1311
1386
  background: var(--color-interactive-secondary);
1312
1387
  border: none;
1313
1388
  -webkit-appearance: none;
@@ -1321,6 +1396,7 @@
1321
1396
  }
1322
1397
  .carousel__indicator--selected,
1323
1398
  .carousel__indicator--selected:hover {
1399
+ background: #163300;
1324
1400
  background: var(--color-interactive-primary);
1325
1401
  width: 24px;
1326
1402
  width: var(--size-24);
@@ -1365,16 +1441,15 @@
1365
1441
  transform: translate(-50%, -50%);
1366
1442
  }
1367
1443
  .np-tw-checkbox-indeterminate .has-error::after {
1368
- background-color: #e74848;
1369
1444
  background-color: var(--color-interactive-negative);
1370
1445
  }
1371
1446
  .np-chip {
1372
1447
  background-color: transparent;
1373
- border: 1px solid rgba(0,0,0,0.10196);
1448
+ border: 1px solid rgba(14,15,12,0.12157);
1374
1449
  border: 1px solid var(--color-border-neutral);
1375
1450
  border-radius: 16px;
1376
1451
  border-radius: var(--size-16);
1377
- color: #5d7079;
1452
+ color: #454745;
1378
1453
  color: var(--color-content-secondary);
1379
1454
  height: 32px;
1380
1455
  height: var(--size-32);
@@ -1408,33 +1483,32 @@
1408
1483
  margin-right: initial;
1409
1484
  }
1410
1485
  .np-chip:active {
1411
- background-color: #0081ba;
1486
+ background-color: #65cf21;
1412
1487
  background-color: var(--color-interactive-accent-active);
1413
- border-color: #0081ba;
1488
+ border-color: #65cf21;
1414
1489
  border-color: var(--color-interactive-accent-active);
1415
1490
  color: #fff;
1416
1491
  }
1417
1492
  .np-chip--selected {
1418
1493
  color: #fff;
1419
- background-color: #00a2dd;
1494
+ background-color: #9fe870;
1420
1495
  background-color: var(--color-interactive-accent);
1421
- border-color: #00a2dd;
1496
+ border-color: #9fe870;
1422
1497
  border-color: var(--color-interactive-accent);
1423
1498
  pointer-events: none;
1424
1499
  }
1425
1500
  .np-chip--selected:hover,
1426
1501
  .np-chip--selected:active {
1427
1502
  color: #fff;
1428
- background-color: #008fc9;
1503
+ background-color: #80e142;
1429
1504
  background-color: var(--color-interactive-accent-hover);
1430
- border-color: #008fc9;
1505
+ border-color: #80e142;
1431
1506
  border-color: var(--color-interactive-accent-hover);
1432
1507
  }
1433
1508
  .np-chip--selected .np-close-button {
1434
1509
  color: white;
1435
1510
  }
1436
1511
  .np-chip.has-error {
1437
- background: #e74848;
1438
1512
  background: var(--color-interactive-negative);
1439
1513
  color: #fff;
1440
1514
  }
@@ -1442,40 +1516,51 @@
1442
1516
  color: white;
1443
1517
  }
1444
1518
  .np-theme-personal .np-chip.has-error {
1519
+ background: #cb272f;
1445
1520
  background: var(--color-sentiment-negative);
1446
1521
  }
1447
1522
  .np-theme-personal .np-chip.has-error,
1448
1523
  .np-theme-personal .np-chip.has-error:not(.disabled):not(:disabled):hover,
1449
1524
  .np-theme-personal .np-chip.has-error:not(.disabled):not(:disabled):active {
1525
+ color: #ffffff;
1450
1526
  color: var(--color-contrast);
1451
1527
  }
1452
1528
  .np-theme-personal .np-chip.has-error:not(.disabled):not(:disabled):hover {
1529
+ background: #b8232b;
1453
1530
  background: var(--color-sentiment-negative-hover);
1531
+ border-color: #b8232b !important;
1454
1532
  border-color: var(--color-sentiment-negative-hover) !important;
1455
1533
  }
1456
1534
  .np-theme-personal .np-chip.has-error:not(.disabled):not(:disabled):active {
1535
+ background: #a72027;
1457
1536
  background: var(--color-sentiment-negative-active);
1537
+ border-color: #a72027 !important;
1458
1538
  border-color: var(--color-sentiment-negative-active) !important;
1459
1539
  }
1460
1540
  .np-theme-personal .np-chip {
1461
1541
  font-weight: 600;
1462
1542
  font-weight: var(--font-weight-semi-bold);
1543
+ color: #163300;
1463
1544
  color: var(--color-interactive-primary);
1464
1545
  padding: 0 16px;
1465
1546
  padding: 0 var(--size-16);
1466
- border-color: #c9cbce;
1547
+ border-color: #868685;
1467
1548
  border-color: var(--color-interactive-secondary);
1468
1549
  }
1469
1550
  .np-theme-personal .np-chip:not(.disabled):not(:disabled):hover {
1551
+ color: #0d1f00;
1470
1552
  color: var(--color-interactive-primary-hover);
1553
+ background-color: rgba(22,51,0,0.07843);
1471
1554
  background-color: var(--color-background-screen-hover);
1472
- border-color: #b5b7ba;
1555
+ border-color: #6c6c6b;
1473
1556
  border-color: var(--color-interactive-secondary-hover);
1474
1557
  }
1475
1558
  .np-theme-personal .np-chip:not(.disabled):not(:disabled):active {
1559
+ color: #0e0f0c;
1476
1560
  color: var(--color-interactive-primary-active);
1561
+ background-color: rgba(22,51,0,0.12941);
1477
1562
  background-color: var(--color-background-screen-active);
1478
- border-color: #a7a9ab;
1563
+ border-color: #525251;
1479
1564
  border-color: var(--color-interactive-secondary-active);
1480
1565
  }
1481
1566
  .np-theme-personal .np-chip .np-close-button {
@@ -1532,20 +1617,29 @@
1532
1617
  }
1533
1618
  .np-theme-personal .np-chip--selected,
1534
1619
  .np-theme-personal .np-chip--valid {
1620
+ color: #9fe870;
1535
1621
  color: var(--color-interactive-contrast);
1622
+ background-color: #163300;
1536
1623
  background-color: var(--color-interactive-primary);
1624
+ border-color: #163300;
1537
1625
  border-color: var(--color-interactive-primary);
1538
1626
  }
1539
1627
  .np-theme-personal .np-chip--selected:not(.disabled):not(:disabled):hover,
1540
1628
  .np-theme-personal .np-chip--valid:not(.disabled):not(:disabled):hover {
1629
+ color: #cdffad;
1541
1630
  color: var(--color-interactive-contrast-hover);
1631
+ background-color: #0d1f00;
1542
1632
  background-color: var(--color-interactive-primary-hover);
1633
+ border-color: #0d1f00;
1543
1634
  border-color: var(--color-interactive-primary-hover);
1544
1635
  }
1545
1636
  .np-theme-personal .np-chip--selected:not(.disabled):not(:disabled):active,
1546
1637
  .np-theme-personal .np-chip--valid:not(.disabled):not(:disabled):active {
1638
+ color: #ecffe0;
1547
1639
  color: var(--color-interactive-contrast-active);
1640
+ background-color: #0e0f0c;
1548
1641
  background-color: var(--color-interactive-primary-active);
1642
+ border-color: #0e0f0c;
1549
1643
  border-color: var(--color-interactive-primary-active);
1550
1644
  }
1551
1645
  .np-theme-personal .np-chip--selected .np-close-button,
@@ -1567,26 +1661,32 @@
1567
1661
  .np-circular-btn-primary-default .np-circular-btn-label,
1568
1662
  .np-circular-btn-secondary-default .np-circular-btn-label {
1569
1663
  text-align: center;
1664
+ color: #163300;
1570
1665
  color: var(--color-interactive-primary);
1571
1666
  }
1572
1667
  .np-circular-btn-primary-default .np-circular-btn-label:not(.disabled):not(:disabled):hover,
1573
1668
  .np-circular-btn-secondary-default .np-circular-btn-label:not(.disabled):not(:disabled):hover {
1669
+ color: #0d1f00;
1574
1670
  color: var(--color-interactive-primary-hover);
1575
1671
  }
1576
1672
  .np-circular-btn-primary-default .np-circular-btn-label:not(.disabled):not(:disabled):active,
1577
1673
  .np-circular-btn-secondary-default .np-circular-btn-label:not(.disabled):not(:disabled):active {
1674
+ color: #0e0f0c;
1578
1675
  color: var(--color-interactive-primary-active);
1579
1676
  }
1580
1677
  .np-circular-btn-primary-negative .np-circular-btn-label,
1581
1678
  .np-circular-btn-secondary-negative .np-circular-btn-label {
1679
+ color: #cb272f;
1582
1680
  color: var(--color-sentiment-negative-primary);
1583
1681
  }
1584
1682
  .np-circular-btn-primary-negative .np-circular-btn-label:not(.disabled):not(:disabled):hover,
1585
1683
  .np-circular-btn-secondary-negative .np-circular-btn-label:not(.disabled):not(:disabled):hover {
1684
+ color: #b8232b;
1586
1685
  color: var(--color-sentiment-negative-primary-hover);
1587
1686
  }
1588
1687
  .np-circular-btn-primary-negative .np-circular-btn-label:not(.disabled):not(:disabled):active,
1589
1688
  .np-circular-btn-secondary-negative .np-circular-btn-label:not(.disabled):not(:disabled):active {
1689
+ color: #a72027;
1590
1690
  color: var(--color-sentiment-negative-primary-active);
1591
1691
  }
1592
1692
  .np-circular-btn-disabled {
@@ -1657,7 +1757,7 @@
1657
1757
  .np-bottom-sheet--handler {
1658
1758
  width: 40px;
1659
1759
  height: 4px;
1660
- background: #c9cbce;
1760
+ background: #868685;
1661
1761
  background: var(--color-interactive-secondary);
1662
1762
  border-radius: 10px;
1663
1763
  border-radius: var(--radius-small);
@@ -1699,7 +1799,7 @@
1699
1799
  display: flex;
1700
1800
  flex-direction: column;
1701
1801
  align-items: stretch;
1702
- background-color: rgba(134,167,189,0.10196);
1802
+ background-color: rgba(22,51,0,0.07843);
1703
1803
  background-color: var(--Card-background-color);
1704
1804
  border-radius: 32px;
1705
1805
  border-radius: var(--Card-border-radius);
@@ -1739,7 +1839,7 @@
1739
1839
  }
1740
1840
  .np-close-button {
1741
1841
  transition: color 0.15s ease-in-out;
1742
- color: #00a2dd;
1842
+ color: #9fe870;
1743
1843
  color: var(--color-interactive-accent);
1744
1844
  border: none;
1745
1845
  background: none;
@@ -1754,10 +1854,11 @@
1754
1854
  height: var(--size-24);
1755
1855
  }
1756
1856
  .np-close-button:hover {
1757
- color: #008fc9;
1857
+ color: #80e142;
1758
1858
  color: var(--color-interactive-accent-hover);
1759
1859
  }
1760
1860
  .np-theme-personal .np-close-button {
1861
+ color: #163300;
1761
1862
  color: var(--color-interactive-primary);
1762
1863
  height: 32px;
1763
1864
  height: var(--size-32);
@@ -1824,11 +1925,15 @@
1824
1925
  }
1825
1926
  }
1826
1927
  .np-theme-personal .np-close-button:not(.disabled):not(:disabled):hover {
1928
+ color: #0d1f00;
1827
1929
  color: var(--color-interactive-primary-hover);
1930
+ background-color: rgba(22,51,0,0.12941);
1828
1931
  background-color: var(--color-background-neutral-hover);
1829
1932
  }
1830
1933
  .np-theme-personal .np-close-button:not(.disabled):not(:disabled):active {
1934
+ color: #0e0f0c;
1831
1935
  color: var(--color-interactive-primary-active);
1936
+ background-color: rgba(22,51,0,0.18039);
1832
1937
  background-color: var(--color-background-neutral-active);
1833
1938
  }
1834
1939
  .np-option:has(:focus-visible) {
@@ -1847,7 +1952,7 @@
1847
1952
  height: var(--size-40);
1848
1953
  }
1849
1954
  .np-option__title {
1850
- color: #37517e;
1955
+ color: #0e0f0c;
1851
1956
  color: var(--color-content-primary);
1852
1957
  font-size: 1rem;
1853
1958
  font-weight: 600;
@@ -1860,7 +1965,7 @@
1860
1965
  .np-option__body {
1861
1966
  margin-top: 4px;
1862
1967
  margin-top: var(--size-4);
1863
- color: #5d7079;
1968
+ color: #454745;
1864
1969
  color: var(--color-content-secondary);
1865
1970
  font-size: 0.875rem;
1866
1971
  font-size: var(--font-size-14);
@@ -2027,7 +2132,7 @@ button.np-option {
2027
2132
  background-color: var(--color-background-elevated);
2028
2133
  }
2029
2134
  .radio:hover {
2030
- border-color: rgba(0,0,0,0.10196);
2135
+ border-color: rgba(14,15,12,0.12157);
2031
2136
  border-color: var(--color-border-neutral);
2032
2137
  }
2033
2138
  .tw-date label {
@@ -2056,7 +2161,7 @@ button.np-option {
2056
2161
  background-color: inherit;
2057
2162
  }
2058
2163
  .tw-date-lookup-calendar > tbody > tr > td.weekend button {
2059
- color: #5d7079;
2164
+ color: #454745;
2060
2165
  color: var(--color-content-secondary);
2061
2166
  }
2062
2167
  .tw-date-lookup-calendar > tbody > tr > td {
@@ -2075,7 +2180,6 @@ button.np-option {
2075
2180
  width: 100%;
2076
2181
  padding: 4px 0;
2077
2182
  padding: var(--size-4) 0;
2078
- color: #0097c7;
2079
2183
  color: var(--color-content-accent);
2080
2184
  border: transparent;
2081
2185
  border-radius: 10px;
@@ -2083,7 +2187,7 @@ button.np-option {
2083
2187
  background-color: transparent;
2084
2188
  font-weight: 600;
2085
2189
  font-weight: var(--font-weight-semi-bold);
2086
- color: #37517e;
2190
+ color: #0e0f0c;
2087
2191
  color: var(--color-content-primary);
2088
2192
  }
2089
2193
  @media (max-width: 320px) {
@@ -2113,10 +2217,13 @@ button.np-option {
2113
2217
  }
2114
2218
  .tw-date-lookup-calendar > tbody > tr > td:not(.disabled):not(:disabled) button.show-focus,
2115
2219
  .tw-date-lookup-calendar > tbody > tr > td:hover button:not(.disabled):not(:disabled) {
2220
+ background-color: rgba(22,51,0,0.07843);
2116
2221
  background-color: var(--color-background-screen-hover);
2117
2222
  }
2118
2223
  .tw-date-lookup-calendar > tbody > tr > td:not(.disabled):not(:disabled) button.active {
2224
+ background-color: #163300;
2119
2225
  background-color: var(--color-interactive-primary);
2226
+ color: #9fe870;
2120
2227
  color: var(--color-interactive-contrast);
2121
2228
  }
2122
2229
  .tw-date-lookup-calendar abbr {
@@ -2235,7 +2342,7 @@ button.np-option {
2235
2342
  }
2236
2343
  }
2237
2344
  .np-theme-personal .tw-definition-list dt {
2238
- color: #5d7079;
2345
+ color: #454745;
2239
2346
  color: var(--color-content-secondary);
2240
2347
  }
2241
2348
  .no-scroll {
@@ -2370,7 +2477,7 @@ button.np-option {
2370
2477
  --Divider-border-style: solid;
2371
2478
  --Divider-dash-length: 4px;
2372
2479
  --Divider-dash-spacing: 4px;
2373
- border-top: 4px solid rgba(0,0,0,0.10196);
2480
+ border-top: 4px solid rgba(14,15,12,0.12157);
2374
2481
  border-top: var(--Divider-border-width) var(--Divider-border-style) var(--Divider-border-color);
2375
2482
  display: inline-block;
2376
2483
  margin: 0;
@@ -2413,29 +2520,28 @@ button.np-option {
2413
2520
  font-style: normal;
2414
2521
  }
2415
2522
  .emphasis--important {
2416
- color: #37517e;
2523
+ color: #0e0f0c;
2417
2524
  color: var(--color-content-primary);
2418
2525
  }
2419
2526
  .emphasis--positive {
2420
- color: #008026;
2421
2527
  color: var(--color-content-positive);
2422
2528
  }
2423
2529
  .np-theme-personal .emphasis--positive {
2530
+ color: #054d28;
2424
2531
  color: var(--color-sentiment-positive);
2425
2532
  }
2426
2533
  .emphasis--negative {
2427
- color: #cf2929;
2428
2534
  color: var(--color-content-negative);
2429
2535
  }
2430
2536
  .np-theme-personal .emphasis--negative {
2537
+ color: #cb272f;
2431
2538
  color: var(--color-sentiment-negative);
2432
2539
  }
2433
2540
  .emphasis--warning {
2434
- color: #9a6500;
2435
2541
  color: var(--color-content-warning);
2436
2542
  }
2437
2543
  .np-theme-personal .emphasis--warning {
2438
- color: #5d7079;
2544
+ color: #454745;
2439
2545
  color: var(--color-content-secondary);
2440
2546
  }
2441
2547
  .np-animated-label {
@@ -2474,7 +2580,7 @@ button.np-option {
2474
2580
  }
2475
2581
  .np-flow-navigation--border-bottom {
2476
2582
  min-height: 96px;
2477
- border-bottom: 1px solid rgba(0,0,0,0.10196);
2583
+ border-bottom: 1px solid rgba(14,15,12,0.12157);
2478
2584
  border-bottom: 1px solid var(--color-border-neutral);
2479
2585
  }
2480
2586
  .np-flow-navigation__content {
@@ -2542,6 +2648,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2542
2648
  .np-theme-personal--forest-green .np-flow-navigation .np-flow-header__left path,
2543
2649
  .np-theme-personal--bright-green .np-flow-navigation .np-flow-header__left path,
2544
2650
  .np-theme-personal--dark .np-flow-navigation .np-flow-header__left path {
2651
+ fill: #163300;
2545
2652
  fill: var(--color-interactive-primary);
2546
2653
  }
2547
2654
  .np-header {
@@ -2563,12 +2670,12 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2563
2670
  }
2564
2671
  .np-header--group {
2565
2672
  align-items: flex-end;
2566
- border-bottom: 1px solid rgba(0,0,0,0.10196);
2673
+ border-bottom: 1px solid rgba(14,15,12,0.12157);
2567
2674
  border-bottom: 1px solid var(--color-border-neutral);
2568
2675
  }
2569
2676
  .np-header--group,
2570
2677
  .np-header--group .np-header__title {
2571
- color: #5d7079;
2678
+ color: #454745;
2572
2679
  color: var(--color-content-secondary);
2573
2680
  }
2574
2681
  .np-header__action {
@@ -2610,9 +2717,9 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2610
2717
  padding-left: var(--size-16);
2611
2718
  padding-right: 16px;
2612
2719
  padding-right: var(--size-16);
2613
- color: #37517e;
2720
+ color: #0e0f0c;
2614
2721
  color: var(--color-content-primary);
2615
- box-shadow: inset 0 0 0 1px #c9cbce;
2722
+ box-shadow: inset 0 0 0 1px #868685;
2616
2723
  box-shadow: inset 0 0 0 var(--ring-width) var(--ring-color);
2617
2724
  transition-property: color, opacity, box-shadow;
2618
2725
  transition-timing-function: ease-in-out;
@@ -2691,7 +2798,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2691
2798
  }
2692
2799
  .np-form-control--size-lg {
2693
2800
  margin: 0;
2694
- color: #37517e;
2801
+ color: #0e0f0c;
2695
2802
  color: var(--color-content-primary);
2696
2803
  line-height: 1.2;
2697
2804
  line-height: var(--line-height-title);
@@ -2744,11 +2851,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2744
2851
  margin-top: var(--size-8);
2745
2852
  }
2746
2853
  .np-input::-moz-placeholder {
2747
- color: #768e9c;
2854
+ color: #6a6c6a;
2748
2855
  color: var(--color-content-tertiary);
2749
2856
  }
2750
2857
  .np-input::placeholder {
2751
- color: #768e9c;
2858
+ color: #6a6c6a;
2752
2859
  color: var(--color-content-tertiary);
2753
2860
  }
2754
2861
  .np-input--shape-rectangle {
@@ -3186,7 +3293,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3186
3293
  }
3187
3294
  .wds-list-item a .wds-list-item-subtitle,
3188
3295
  .wds-list-item a .wds-list-item-subtitle-value {
3189
- color: #5d7079;
3296
+ color: #454745;
3190
3297
  color: var(--color-content-secondary);
3191
3298
  }
3192
3299
  .wds-list-item-interactive .wds-list-item-control:focus-visible,
@@ -3241,9 +3348,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3241
3348
  border-radius: var(--radius-medium);
3242
3349
  }
3243
3350
  .wds-list-item-interactive:not(.wds-list-item-spotlight):not(.disabled):not(:disabled):hover:before {
3351
+ background-color: rgba(22,51,0,0.07843);
3244
3352
  background-color: var(--color-background-screen-hover);
3245
3353
  }
3246
3354
  .wds-list-item-interactive:not(.wds-list-item-spotlight):not(.disabled):not(:disabled):active:before {
3355
+ background-color: rgba(22,51,0,0.12941);
3247
3356
  background-color: var(--color-background-screen-active);
3248
3357
  }
3249
3358
  .wds-list-item-interactive:not(.wds-list-item-spotlight):has(.wds-list-item-prompt:hover a, .wds-list-item-prompt:hover button):hover:before {
@@ -3304,7 +3413,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3304
3413
  }
3305
3414
  .wds-list-item-title,
3306
3415
  .wds-list-item-title-value {
3307
- color: #37517e;
3416
+ color: #0e0f0c;
3308
3417
  color: var(--color-content-primary);
3309
3418
  }
3310
3419
  .wds-list-item-body-center {
@@ -3314,7 +3423,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3314
3423
  }
3315
3424
  .wds-list-item-additional-info {
3316
3425
  grid-area: info;
3317
- color: #768e9c;
3426
+ color: #6a6c6a;
3318
3427
  color: var(--color-content-tertiary);
3319
3428
  margin-top: calc(4px * -1);
3320
3429
  margin-top: calc(var(--size-4) * -1);
@@ -3326,7 +3435,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3326
3435
  grid-area: control;
3327
3436
  }
3328
3437
  .wds-list-item-navigation .tw-icon-chevron-right {
3329
- color: #c9cbce;
3438
+ color: #868685;
3330
3439
  color: var(--color-interactive-secondary);
3331
3440
  }
3332
3441
  .wds-list-item-control {
@@ -3347,7 +3456,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3347
3456
  .wds-list-item.disabled .wds-list-item-subtitle,
3348
3457
  .wds-list-item.disabled .wds-list-item-subtitle-value,
3349
3458
  .wds-list-item.disabled .wds-list-item-additional-info {
3350
- color: #768e9c;
3459
+ color: #6a6c6a;
3351
3460
  color: var(--color-content-tertiary);
3352
3461
  }
3353
3462
  .wds-list-item.disabled .wds-list-item-media,
@@ -3365,29 +3474,41 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3365
3474
  padding-right: var(--size-12);
3366
3475
  }
3367
3476
  .wds-list-item-spotlight-active {
3368
- background-color: rgba(134,167,189,0.10196);
3477
+ background-color: rgba(22,51,0,0.07843);
3369
3478
  background-color: var(--color-background-neutral);
3370
3479
  }
3371
3480
  .wds-list-item-spotlight-active:not(.disabled):not(:disabled):hover {
3481
+ background-color: rgba(22,51,0,0.12941);
3372
3482
  background-color: var(--color-background-neutral-hover);
3373
3483
  }
3374
3484
  .wds-list-item-spotlight-active:not(.disabled):not(:disabled):active {
3485
+ background-color: rgba(22,51,0,0.18039);
3375
3486
  background-color: var(--color-background-neutral-active);
3376
3487
  }
3377
3488
  .wds-list-item-spotlight-inactive {
3378
- background-color: rgba(134, 167, 189, 0.025);
3489
+ background-color: rgba(22, 51, 0, 0.02);
3379
3490
  }
3380
3491
  @supports (color: color-mix(in lch, red, blue)) {
3381
3492
  .wds-list-item-spotlight-inactive {
3382
3493
  background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
3383
3494
  }
3384
3495
  }
3496
+ .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):hover {
3497
+ background-color: rgba(22, 51, 0, 0.045);
3498
+ }
3499
+ @supports (color: color-mix(in lch, red, blue)) {
3385
3500
  .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):hover {
3386
3501
  background-color: color-mix(in srgb, var(--color-background-neutral-hover) 35%, transparent);
3387
3502
  }
3503
+ }
3504
+ .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):active {
3505
+ background-color: rgba(22, 51, 0, 0.081);
3506
+ }
3507
+ @supports (color: color-mix(in lch, red, blue)) {
3388
3508
  .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):active {
3389
3509
  background-color: color-mix(in srgb, var(--color-background-neutral-active) 45%, transparent);
3390
3510
  }
3511
+ }
3391
3512
  .wds-list-item .wds-list-item-spotlight__border {
3392
3513
  position: absolute;
3393
3514
  inset: 0;
@@ -3399,7 +3520,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3399
3520
  --wds-list-item-spotlight-borderWidthOffset: 0.5px;
3400
3521
  --wds-list-item-spotlight-strokeDashSize: calc(var(--size-12) * 0.5);
3401
3522
  fill: none;
3402
- stroke: rgba(0,0,0,0.10196);
3523
+ stroke: rgba(14,15,12,0.12157);
3403
3524
  stroke: var(--color-border-neutral);
3404
3525
  width: calc(100% - 1px);
3405
3526
  width: calc(100% - var(--wds-list-item-spotlight-borderWidth));
@@ -3437,7 +3558,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3437
3558
  z-index: 10;
3438
3559
  display: inline-flex;
3439
3560
  align-items: center;
3440
- color: #c9cbce;
3561
+ color: #868685;
3441
3562
  color: var(--color-interactive-secondary);
3442
3563
  transition-property: color, opacity;
3443
3564
  transition-timing-function: ease-out;
@@ -3448,10 +3569,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3448
3569
  mix-blend-mode: luminosity;
3449
3570
  }
3450
3571
  .np-input-group:has( > :is(input,button,select):focus-visible) .np-input-addon {
3572
+ color: #163300;
3451
3573
  color: var(--color-interactive-primary);
3452
3574
  }
3453
3575
  .np-input-group:has( > :is(input,button,select):hover) .np-input-addon {
3454
- color: #b5b7ba;
3576
+ color: #6c6c6b;
3455
3577
  color: var(--color-interactive-secondary-hover);
3456
3578
  }
3457
3579
  .np-input-addon--placement-start {
@@ -3490,7 +3612,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3490
3612
  .np-bottom-sheet-v2-backdrop {
3491
3613
  position: fixed;
3492
3614
  inset: 0px;
3493
- background-color: #37517e;
3615
+ background-color: #0e0f0c;
3494
3616
  background-color: var(--color-content-primary);
3495
3617
  opacity: 0.4;
3496
3618
  transition-property: opacity;
@@ -3572,11 +3694,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3572
3694
  padding-top: 0px;
3573
3695
  }
3574
3696
  .np-bottom-sheet-v2-title {
3575
- color: #37517e;
3697
+ color: #0e0f0c;
3576
3698
  color: var(--color-content-primary);
3577
3699
  }
3578
3700
  .np-bottom-sheet-v2-body {
3579
- color: #5d7079;
3701
+ color: #454745;
3580
3702
  color: var(--color-content-secondary);
3581
3703
  }
3582
3704
  .np-button-input {
@@ -3626,11 +3748,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3626
3748
  padding: var(--size-16);
3627
3749
  }
3628
3750
  .np-popover-v2-title {
3629
- color: #37517e;
3751
+ color: #0e0f0c;
3630
3752
  color: var(--color-content-primary);
3631
3753
  }
3632
3754
  .np-popover-v2-content {
3633
- color: #5d7079;
3755
+ color: #454745;
3634
3756
  color: var(--color-content-secondary);
3635
3757
  }
3636
3758
  .np-select-input-content {
@@ -3639,7 +3761,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3639
3761
  white-space: nowrap;
3640
3762
  }
3641
3763
  .np-select-input-placeholder {
3642
- color: #768e9c;
3764
+ color: #6a6c6a;
3643
3765
  color: var(--color-content-tertiary);
3644
3766
  }
3645
3767
  .np-select-input-options-container {
@@ -3668,7 +3790,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3668
3790
  .np-select-input-options-status-icon {
3669
3791
  padding: 0 4px;
3670
3792
  padding: 0 var(--size-4);
3671
- color: #768e9c;
3793
+ color: #6a6c6a;
3672
3794
  color: var(--color-content-tertiary);
3673
3795
  }
3674
3796
  .np-select-input-query-container {
@@ -3750,13 +3872,14 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3750
3872
  border-radius: var(--radius-small);
3751
3873
  padding: 12px 16px;
3752
3874
  padding: var(--size-12) var(--size-16);
3875
+ color: #163300;
3753
3876
  color: var(--color-interactive-primary);
3754
3877
  }
3755
3878
  .np-select-input-option-container:focus {
3756
3879
  outline: none;
3757
3880
  }
3758
3881
  .np-select-input-option-container--active {
3759
- box-shadow: inset 0 0 0 1px #c9cbce;
3882
+ box-shadow: inset 0 0 0 1px #868685;
3760
3883
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
3761
3884
  }
3762
3885
  .np-select-input-option-container--disabled {
@@ -3775,7 +3898,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3775
3898
  column-gap: 8px;
3776
3899
  -moz-column-gap: var(--size-8);
3777
3900
  column-gap: var(--size-8);
3778
- color: #37517e;
3901
+ color: #0e0f0c;
3779
3902
  color: var(--color-content-primary);
3780
3903
  }
3781
3904
  .np-select-input-option-content-icon {
@@ -3791,7 +3914,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3791
3914
  overflow: hidden;
3792
3915
  }
3793
3916
  .np-select-input-option-content-text-secondary {
3794
- color: #5d7079;
3917
+ color: #454745;
3795
3918
  color: var(--color-content-secondary);
3796
3919
  }
3797
3920
  .np-select-input-option-content-text-within-trigger {
@@ -3835,11 +3958,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3835
3958
  }
3836
3959
  .np-select-input-addon--interactive {
3837
3960
  pointer-events: auto;
3838
- color: #c9cbce;
3961
+ color: #868685;
3839
3962
  color: var(--color-interactive-secondary);
3840
3963
  }
3841
3964
  .np-select-input-addon--interactive:hover {
3842
- color: #b5b7ba;
3965
+ color: #6c6c6b;
3843
3966
  color: var(--color-interactive-secondary-hover);
3844
3967
  }
3845
3968
  .np-select-input-addon--interactive:focus {
@@ -3852,7 +3975,7 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3852
3975
  .np-select-input-addon-separator {
3853
3976
  height: 24px;
3854
3977
  height: var(--size-24);
3855
- border-inline-start: 1px solid rgba(0,0,0,0.10196);
3978
+ border-inline-start: 1px solid rgba(14,15,12,0.12157);
3856
3979
  border-inline-start: 1px solid var(--color-border-neutral);
3857
3980
  }
3858
3981
  .np-text-area {
@@ -3867,11 +3990,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3867
3990
  border-radius: var(--radius-small) !important;
3868
3991
  }
3869
3992
  .np-text-area::-moz-placeholder {
3870
- color: #768e9c;
3993
+ color: #6a6c6a;
3871
3994
  color: var(--color-content-tertiary);
3872
3995
  }
3873
3996
  .np-text-area::placeholder {
3874
- color: #768e9c;
3997
+ color: #6a6c6a;
3875
3998
  color: var(--color-content-tertiary);
3876
3999
  }
3877
4000
  .tw-instructions {
@@ -3895,9 +4018,11 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
3895
4018
  margin-bottom: 0;
3896
4019
  }
3897
4020
  .tw-instructions .instruction .do {
4021
+ color: #054d28;
3898
4022
  color: var(--color-sentiment-positive);
3899
4023
  }
3900
4024
  .tw-instructions .instruction .dont {
4025
+ color: #cb272f;
3901
4026
  color: var(--color-sentiment-negative);
3902
4027
  }
3903
4028
  a,
@@ -4155,9 +4280,11 @@ button.np-link {
4155
4280
  }
4156
4281
  .np-theme-personal--forest-green .np-logo-svg path,
4157
4282
  .np-theme-personal--bright-green .np-logo-svg path {
4283
+ fill: #163300;
4158
4284
  fill: var(--color-interactive-primary);
4159
4285
  }
4160
4286
  .np-theme-personal--dark .np-logo-svg path {
4287
+ fill: #ffffff;
4161
4288
  fill: var(--color-white);
4162
4289
  }
4163
4290
  .np-logo-svg--size-sm {
@@ -4283,7 +4410,7 @@ button.np-link {
4283
4410
  padding-left: initial !important;
4284
4411
  }
4285
4412
  .tw-money-input .tw-money-input__fixed-currency .np-text-title-subsection {
4286
- color: #768e9c;
4413
+ color: #6a6c6a;
4287
4414
  color: var(--color-content-tertiary);
4288
4415
  font-weight: 600;
4289
4416
  font-weight: var(--font-weight-semi-bold);
@@ -4342,7 +4469,7 @@ button.np-link {
4342
4469
  box-shadow: none;
4343
4470
  }
4344
4471
  .tw-money-input:not(.disabled):not(:disabled):not(.np-button-input:active):has(.np-button-input:focus-visible) {
4345
- box-shadow: inset 0 0 0 1px #c9cbce !important;
4472
+ box-shadow: inset 0 0 0 1px #868685 !important;
4346
4473
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary) !important;
4347
4474
  }
4348
4475
  .wds-amount-input-container {
@@ -4353,6 +4480,7 @@ button.np-link {
4353
4480
  justify-content: right;
4354
4481
  width: 100%;
4355
4482
  transition: font-size 0.4s cubic-bezier(0.3, 0, 0.1, 1), height 0.4s cubic-bezier(0.3, 0, 0.1, 1), margin-top 0.4s cubic-bezier(0.3, 0, 0.1, 1), color 0.4s ease;
4483
+ color: #163300;
4356
4484
  color: var(--color-interactive-primary);
4357
4485
  overflow: hidden;
4358
4486
  margin-bottom: 0 !important;
@@ -4387,6 +4515,7 @@ button.np-link {
4387
4515
  width: 32px;
4388
4516
  width: var(--size-32);
4389
4517
  overflow: hidden;
4518
+ color: #163300;
4390
4519
  color: var(--color-interactive-primary);
4391
4520
  margin-left: 8px;
4392
4521
  margin-left: var(--size-8);
@@ -4436,7 +4565,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4436
4565
  background-color: var(--color-background-screen);
4437
4566
  }
4438
4567
  .np-theme-personal .np-navigation-option:not(.disabled):not(:disabled):hover .tw-avatar__content {
4439
- background-color: rgba(134,167,189,0.10196);
4568
+ background-color: rgba(22,51,0,0.07843);
4440
4569
  background-color: var(--color-background-neutral);
4441
4570
  }
4442
4571
  .np-navigation-option .circle {
@@ -4461,11 +4590,9 @@ html:not([dir="rtl"]) .np-navigation-option {
4461
4590
  }
4462
4591
  .np-navigation-option__chevron:not(.disabled):not(:disabled):hover,
4463
4592
  .np-navigation-option__chevron:not(.disabled):not(:disabled):focus {
4464
- color: #0084b3;
4465
4593
  color: var(--color-content-accent-hover);
4466
4594
  }
4467
4595
  .np-navigation-option__chevron:not(.disabled):not(:disabled):active {
4468
- color: #0077a5;
4469
4596
  color: var(--color-content-accent-active);
4470
4597
  }
4471
4598
  .np-theme-personal .np-option__container-aligned {
@@ -4501,7 +4628,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4501
4628
  --nudge-control-width: var(--size-24);
4502
4629
  --nudge-control-background-color: var(--color-background-neutral);
4503
4630
  align-items: stretch;
4504
- background-color: rgba(134,167,189,0.10196);
4631
+ background-color: rgba(22,51,0,0.07843);
4505
4632
  background-color: var(--nudge-background-color);
4506
4633
  border-radius: 16px;
4507
4634
  border-radius: var(--nudge-border-radius);
@@ -4694,12 +4821,13 @@ html:not([dir="rtl"]) .np-navigation-option {
4694
4821
  max-width: 1164px;
4695
4822
  }
4696
4823
  .np-theme-personal .np-overlay-header {
4697
- border-bottom: 1px solid rgba(0,0,0,0.10196);
4824
+ border-bottom: 1px solid rgba(14,15,12,0.12157);
4698
4825
  border-bottom: 1px solid var(--color-border-neutral);
4699
4826
  }
4700
4827
  .np-theme-personal--forest-green .np-overlay-header .np-flow-header__left path,
4701
4828
  .np-theme-personal--bright-green .np-overlay-header .np-flow-header__left path,
4702
4829
  .np-theme-personal--dark .np-overlay-header .np-flow-header__left path {
4830
+ fill: #163300;
4703
4831
  fill: var(--color-interactive-primary);
4704
4832
  }
4705
4833
  .tw-telephone {
@@ -4730,7 +4858,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4730
4858
  border-radius: var(--radius-medium);
4731
4859
  }
4732
4860
  .np-popover__container .np-popover__content {
4733
- color: #5d7079;
4861
+ color: #454745;
4734
4862
  color: var(--color-content-secondary);
4735
4863
  font-size: 0.875rem;
4736
4864
  font-size: var(--font-size-14);
@@ -4749,7 +4877,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4749
4877
  }
4750
4878
  .np-popover__container.np-bottom-sheet .np-popover__title {
4751
4879
  margin: 0;
4752
- color: #37517e;
4880
+ color: #0e0f0c;
4753
4881
  color: var(--color-content-primary);
4754
4882
  line-height: 1.2;
4755
4883
  line-height: var(--line-height-title);
@@ -4837,7 +4965,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4837
4965
  right: calc(var(--size-24) * -1);
4838
4966
  }
4839
4967
  .np-Card-description {
4840
- color: #5d7079;
4968
+ color: #454745;
4841
4969
  color: var(--color-content-secondary);
4842
4970
  }
4843
4971
  .np-Card-indicator {
@@ -4926,7 +5054,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4926
5054
  outline: none;
4927
5055
  }
4928
5056
  .np-Card--link .np-Card-titleLink {
4929
- color: #37517e;
5057
+ color: #0e0f0c;
4930
5058
  color: var(--color-content-primary);
4931
5059
  -webkit-text-decoration: none;
4932
5060
  text-decoration: none;
@@ -4945,7 +5073,7 @@ html:not([dir="rtl"]) .np-navigation-option {
4945
5073
  z-index: 10;
4946
5074
  }
4947
5075
  .np-Card--checked.is-checked {
4948
- box-shadow: 0 0 0 4px var(--color-interactive-primary);
5076
+ box-shadow: 0 0 0 4px #163300;
4949
5077
  box-shadow: 0 0 0 var(--size-4) var(--color-interactive-primary);
4950
5078
  }
4951
5079
  .np-Card--checked.is-checked .np-Card-check {
@@ -5089,19 +5217,19 @@ html:not([dir="rtl"]) .np-navigation-option {
5089
5217
  box-shadow: inset -1px 0 0 0 #e2e6e8;
5090
5218
  }
5091
5219
  .np-theme-personal .sliding-panel.sliding-panel--border-top {
5092
- box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.10196);
5220
+ box-shadow: inset 0 -1px 0 0 rgba(14,15,12,0.12157);
5093
5221
  box-shadow: inset 0 -1px 0 0 var(--color-border-neutral);
5094
5222
  }
5095
5223
  .np-theme-personal .sliding-panel.sliding-panel--border-right {
5096
- box-shadow: inset 1px 0 0 0 rgba(0,0,0,0.10196);
5224
+ box-shadow: inset 1px 0 0 0 rgba(14,15,12,0.12157);
5097
5225
  box-shadow: inset 1px 0 0 0 var(--color-border-neutral);
5098
5226
  }
5099
5227
  .np-theme-personal .sliding-panel.sliding-panel--border-bottom {
5100
- box-shadow: inset 0 1px 0 0 rgba(0,0,0,0.10196);
5228
+ box-shadow: inset 0 1px 0 0 rgba(14,15,12,0.12157);
5101
5229
  box-shadow: inset 0 1px 0 0 var(--color-border-neutral);
5102
5230
  }
5103
5231
  .np-theme-personal .sliding-panel.sliding-panel--border-left {
5104
- box-shadow: inset -1px 0 0 0 rgba(0,0,0,0.10196);
5232
+ box-shadow: inset -1px 0 0 0 rgba(14,15,12,0.12157);
5105
5233
  box-shadow: inset -1px 0 0 0 var(--color-border-neutral);
5106
5234
  }
5107
5235
  .snackbar {
@@ -5122,8 +5250,10 @@ html:not([dir="rtl"]) .np-navigation-option {
5122
5250
  right: 0;
5123
5251
  }
5124
5252
  .snackbar__text {
5125
- background: #37517e;
5253
+ background: #121511;
5254
+ background: var(--color-contrast-theme);
5126
5255
  color: #ffffff;
5256
+ color: var(--color-contrast-overlay);
5127
5257
  display: inline-flex;
5128
5258
  border-radius: 2px;
5129
5259
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
@@ -5146,10 +5276,8 @@ html:not([dir="rtl"]) .np-navigation-option {
5146
5276
  .np-theme-personal .snackbar__text {
5147
5277
  box-shadow: 0 2px 4px 0 rgba(69, 71, 69, 0.35);
5148
5278
  position: relative;
5149
- background: var(--color-contrast-theme);
5150
5279
  border-radius: 10px;
5151
5280
  border-radius: var(--radius-small);
5152
- color: var(--color-contrast-overlay);
5153
5281
  }
5154
5282
  .np-theme-personal .snackbar__text::after {
5155
5283
  display: block;
@@ -5161,7 +5289,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5161
5289
  left: 0;
5162
5290
  top: 0;
5163
5291
  z-index: -1;
5164
- background-color: rgba(134,167,189,0.10196);
5292
+ background-color: rgba(22,51,0,0.07843);
5165
5293
  background-color: var(--color-background-neutral);
5166
5294
  }
5167
5295
  .np-theme-personal--dark .snackbar__text,
@@ -5198,41 +5326,49 @@ html:not([dir="rtl"]) .np-navigation-option {
5198
5326
  }
5199
5327
  }
5200
5328
  .status-circle .light {
5329
+ color: #ffffff;
5201
5330
  color: var(--color-contrast-overlay);
5202
5331
  }
5203
5332
  .np-theme-personal--bright-green .status-circle .light {
5333
+ color: #ffffff;
5204
5334
  color: var(--color-white);
5205
5335
  }
5206
5336
  .status-circle .dark {
5207
- color: #37517e;
5337
+ color: #0e0f0c;
5208
5338
  color: var(--color-content-primary);
5209
5339
  }
5210
5340
  .status-circle.warning,
5211
5341
  .status-circle.pending {
5342
+ background-color: #ffd11a;
5212
5343
  background-color: var(--color-sentiment-warning);
5213
5344
  }
5214
5345
  .np-theme-personal .status-circle.warning .status-icon,
5215
5346
  .np-theme-personal .status-circle.pending .status-icon {
5347
+ color: #121511;
5216
5348
  color: var(--color-dark);
5217
5349
  }
5218
5350
  .status-circle.negative,
5219
5351
  .status-circle.error {
5352
+ background-color: #cb272f;
5220
5353
  background-color: var(--color-sentiment-negative);
5221
5354
  }
5222
5355
  .status-circle.negative .status-icon,
5223
5356
  .status-circle.error .status-icon {
5357
+ color: #fbeaea;
5224
5358
  color: var(--color-sentiment-negative-secondary);
5225
5359
  }
5226
5360
  .status-circle.neutral {
5227
- background-color: #5d7079;
5361
+ background-color: #454745;
5228
5362
  background-color: var(--color-content-secondary);
5229
5363
  }
5230
5364
  .status-circle.positive,
5231
5365
  .status-circle.success {
5366
+ background-color: #054d28;
5232
5367
  background-color: var(--color-sentiment-positive);
5233
5368
  }
5234
5369
  .status-circle.positive .status-icon,
5235
5370
  .status-circle.success .status-icon {
5371
+ color: #e2f6d5;
5236
5372
  color: var(--color-sentiment-positive-secondary);
5237
5373
  }
5238
5374
  .tw-stepper {
@@ -5251,18 +5387,17 @@ html:not([dir="rtl"]) .np-navigation-option {
5251
5387
  }
5252
5388
  .tw-stepper__step--active .tw-stepper__step-label {
5253
5389
  cursor: default;
5254
- color: #37517e;
5390
+ color: #0e0f0c;
5255
5391
  color: var(--color-content-primary);
5256
5392
  }
5257
5393
  .tw-stepper__step--clickable .tw-stepper__step-label {
5258
- color: #0097c7;
5259
5394
  color: var(--color-content-accent);
5260
5395
  transition: color 0.15s ease-in-out;
5261
5396
  line-height: 0;
5262
5397
  border-radius: 2px;
5263
5398
  }
5264
5399
  .np-theme-personal .tw-stepper__step--clickable .tw-stepper__step-label {
5265
- color: #5d7079;
5400
+ color: #454745;
5266
5401
  color: var(--color-content-secondary);
5267
5402
  top: 0;
5268
5403
  }
@@ -5280,7 +5415,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5280
5415
  .tw-stepper__step-label {
5281
5416
  position: absolute;
5282
5417
  top: 0;
5283
- color: #5d7079;
5418
+ color: #454745;
5284
5419
  color: var(--color-content-secondary);
5285
5420
  transition: color 0.6s ease-in-out;
5286
5421
  white-space: nowrap;
@@ -5308,6 +5443,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5308
5443
  }
5309
5444
  .progress-bar {
5310
5445
  -webkit-backface-visibility: hidden;
5446
+ background-color: #163300;
5311
5447
  background-color: var(--color-interactive-primary);
5312
5448
  transition: width 0.6s ease-in-out;
5313
5449
  will-change: width;
@@ -5315,11 +5451,11 @@ html:not([dir="rtl"]) .np-navigation-option {
5315
5451
  .np-select .np-dropdown-toggle {
5316
5452
  background-color: #ffffff;
5317
5453
  background-color: var(--color-background-screen);
5318
- border: 1px solid #c9cbce;
5454
+ border: 1px solid #868685;
5319
5455
  border: 1px solid var(--color-interactive-secondary);
5320
5456
  border-radius: 10px;
5321
5457
  border-radius: var(--radius-small);
5322
- color: #37517e;
5458
+ color: #0e0f0c;
5323
5459
  color: var(--color-content-primary);
5324
5460
  font-weight: 400;
5325
5461
  font-weight: var(--font-weight-regular);
@@ -5341,17 +5477,8 @@ html:not([dir="rtl"]) .np-navigation-option {
5341
5477
  border-radius: var(--radius-small);
5342
5478
  }
5343
5479
  .has-error .np-select .np-dropdown-toggle {
5344
- border: 1px solid #e74848;
5345
5480
  border: 1px solid var(--color-interactive-negative);
5346
5481
  }
5347
- .np-select .np-dropdown-toggle-navy {
5348
- --color-content-accent: #00b9ff;
5349
- --color-content-primary: #ffffff;
5350
- --color-content-secondary: #c9cbce;
5351
- --color-background-screen: #2e4369;
5352
- --color-interactive-secondary: #2e4369;
5353
- --color-interactive-secondary-hover: #2e4369;
5354
- }
5355
5482
  .np-select .np-dropdown-toggle.np-btn-sm {
5356
5483
  padding-right: 32px;
5357
5484
  padding-right: var(--size-32);
@@ -5415,19 +5542,19 @@ html:not([dir="rtl"]) .np-navigation-option {
5415
5542
  top: 27px;
5416
5543
  }
5417
5544
  .np-select .btn:not(.disabled):not(:disabled):not(.btn-loading) {
5418
- color: #37517e;
5545
+ color: #0e0f0c;
5419
5546
  color: var(--color-content-primary);
5420
5547
  }
5421
5548
  .np-select .btn:not(.disabled):not(:disabled):not(.btn-loading):hover {
5422
- border-color: #b5b7ba;
5549
+ border-color: #6c6c6b;
5423
5550
  border-color: var(--color-interactive-secondary-hover);
5424
5551
  }
5425
5552
  .np-select .btn:not(.disabled):not(:disabled):not(.btn-loading):focus {
5426
- border-color: #00a2dd;
5553
+ border-color: #9fe870;
5427
5554
  border-color: var(--color-interactive-accent);
5428
5555
  }
5429
5556
  .np-theme-personal .np-select .btn:not(.disabled):not(:disabled):not(.btn-loading):focus {
5430
- border-color: #c9cbce;
5557
+ border-color: #868685;
5431
5558
  border-color: var(--color-interactive-secondary);
5432
5559
  }
5433
5560
  .np-option-content {
@@ -5478,7 +5605,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5478
5605
  width: 420px;
5479
5606
  }
5480
5607
  .np-dropdown-menu .np-dropdown-item--focused {
5481
- background-color: rgba(134,167,189,0.10196);
5608
+ background-color: rgba(22,51,0,0.07843);
5482
5609
  background-color: var(--color-background-neutral);
5483
5610
  border-radius: 10px;
5484
5611
  border-radius: var(--radius-small);
@@ -5497,7 +5624,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5497
5624
  clear: both;
5498
5625
  border-radius: 10px;
5499
5626
  border-radius: var(--radius-small);
5500
- color: #37517e;
5627
+ color: #0e0f0c;
5501
5628
  color: var(--color-content-primary);
5502
5629
  font-size: 0.875rem;
5503
5630
  font-size: var(--font-size-14);
@@ -5532,32 +5659,15 @@ html:not([dir="rtl"]) .np-navigation-option {
5532
5659
  }
5533
5660
  .np-dropdown-menu > li:not(.active):not(.selected):not(:has(input)) > a:not([disabled]):not(.disabled):hover,
5534
5661
  .np-dropdown-menu > li:not(.active):not(.selected):not(:has(input)) > a:not([disabled]):not(.disabled):focus {
5535
- color: #37517e;
5662
+ color: #0e0f0c;
5536
5663
  color: var(--color-content-primary);
5537
- background-color: rgba(134,167,189,0.10196);
5664
+ background-color: rgba(22,51,0,0.07843);
5538
5665
  background-color: var(--color-background-neutral);
5539
5666
  }
5540
- .np-dropdown-menu > li:not(.active):not(.selected):not(:has(input)) > a:not([disabled]):not(.disabled):active {
5541
- color: #ffffff;
5542
- background-color: #37517e;
5543
- }
5544
- .np-dropdown-menu > .active > a,
5545
- .np-dropdown-menu > .selected > a,
5546
- .np-dropdown-menu > .active > a:hover,
5547
- .np-dropdown-menu > .selected > a:hover,
5548
- .np-dropdown-menu > .active > a:focus,
5549
- .np-dropdown-menu > .selected > a:focus {
5550
- color: #ffffff;
5551
- background-color: #37517e;
5552
- }
5553
5667
  .np-dropdown-menu > .active > a strong,
5554
5668
  .np-dropdown-menu > .selected > a strong {
5555
5669
  color: inherit;
5556
5670
  }
5557
- .np-dropdown-menu > .active > a .np-text-body-default,
5558
- .np-dropdown-menu > .selected > a .np-text-body-default {
5559
- color: #c9cbce;
5560
- }
5561
5671
  .np-dropdown-menu .np-select-filter,
5562
5672
  .np-dropdown-menu .input-group-addon {
5563
5673
  border: 0;
@@ -5566,13 +5676,13 @@ html:not([dir="rtl"]) .np-navigation-option {
5566
5676
  height: 1px;
5567
5677
  margin: 0;
5568
5678
  overflow: hidden;
5569
- background-color: rgba(134,167,189,0.10196);
5679
+ background-color: rgba(22,51,0,0.07843);
5570
5680
  background-color: var(--color-background-neutral);
5571
5681
  }
5572
5682
  .np-dropdown-menu .np-dropdown-header {
5573
5683
  padding: 8px 16px;
5574
5684
  padding: var(--size-8) var(--size-16);
5575
- color: #5d7079;
5685
+ color: #454745;
5576
5686
  color: var(--color-content-secondary);
5577
5687
  display: block;
5578
5688
  font-size: 0.875rem;
@@ -5603,7 +5713,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5603
5713
  }
5604
5714
  .np-select .np-text-body-default,
5605
5715
  .np-dropdown-menu .np-text-body-default {
5606
- color: #5d7079;
5716
+ color: #454745;
5607
5717
  color: var(--color-content-secondary);
5608
5718
  }
5609
5719
  .np-select .tw-icon-search,
@@ -5619,25 +5729,28 @@ html:not([dir="rtl"]) .np-navigation-option {
5619
5729
  background-color: initial;
5620
5730
  transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
5621
5731
  border: none;
5622
- box-shadow: inset 0 0 0 1px #c9cbce;
5732
+ box-shadow: inset 0 0 0 1px #868685;
5623
5733
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
5624
5734
  }
5625
5735
  .np-theme-personal .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):hover {
5626
- box-shadow: inset 0 0 0 2px #b5b7ba;
5736
+ box-shadow: inset 0 0 0 2px #6c6c6b;
5627
5737
  box-shadow: inset 0 0 0 2px var(--color-interactive-secondary-hover);
5628
5738
  }
5629
5739
  .np-theme-personal .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):focus,
5630
5740
  .np-theme-personal .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):focus-visible,
5631
5741
  .np-theme-personal .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):focus-within {
5742
+ box-shadow: inset 0 0 0 3px #163300;
5632
5743
  box-shadow: inset 0 0 0 3px var(--color-interactive-primary);
5633
5744
  }
5634
5745
  .np-theme-personal .has-error .np-select .np-dropdown-toggle,
5635
5746
  .np-theme-personal .has-error .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):hover {
5747
+ box-shadow: inset 0 0 0 2px #cb272f;
5636
5748
  box-shadow: inset 0 0 0 2px var(--color-sentiment-negative);
5637
5749
  }
5638
5750
  .np-theme-personal .has-error .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):focus,
5639
5751
  .np-theme-personal .has-error .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):focus-visible,
5640
5752
  .np-theme-personal .has-error .np-select .np-dropdown-toggle:not(.disabled):not(:disabled):focus-within {
5753
+ box-shadow: inset 0 0 0 3px #cb272f;
5641
5754
  box-shadow: inset 0 0 0 3px var(--color-sentiment-negative);
5642
5755
  }
5643
5756
  .np-theme-personal .np-dropdown-menu {
@@ -5649,7 +5762,9 @@ html:not([dir="rtl"]) .np-navigation-option {
5649
5762
  .np-theme-personal .np-dropdown-menu .selected a:focus,
5650
5763
  .np-theme-personal .np-dropdown-menu .active a:hover,
5651
5764
  .np-theme-personal .np-dropdown-menu .selected a:hover {
5765
+ color: #163300;
5652
5766
  color: var(--color-interactive-primary);
5767
+ background-color: rgba(22,51,0,0.18039);
5653
5768
  background-color: var(--color-background-neutral-active);
5654
5769
  }
5655
5770
  .np-theme-personal .np-dropdown-menu .active a .body-2,
@@ -5664,20 +5779,25 @@ html:not([dir="rtl"]) .np-navigation-option {
5664
5779
  .np-theme-personal .np-dropdown-menu .selected a:focus .np-text-body-default,
5665
5780
  .np-theme-personal .np-dropdown-menu .active a:hover .np-text-body-default,
5666
5781
  .np-theme-personal .np-dropdown-menu .selected a:hover .np-text-body-default {
5782
+ color: #163300;
5667
5783
  color: var(--color-interactive-primary);
5668
5784
  }
5669
5785
  .np-theme-personal .np-dropdown-menu li:not(.active):not(.selected):not(:has(input)) a:not([disabled]):not(.disabled):active {
5786
+ color: #163300 !important;
5670
5787
  color: var(--color-interactive-primary) !important;
5788
+ background-color: rgba(22,51,0,0.18039) !important;
5671
5789
  background-color: var(--color-background-neutral-active) !important;
5672
5790
  }
5673
5791
  .np-theme-personal .np-dropdown-menu li:not(.active):not(.selected):not(:has(input)) a:not([disabled]):not(.disabled):active .body-2,
5674
5792
  .np-theme-personal .np-dropdown-menu li:not(.active):not(.selected):not(:has(input)) a:not([disabled]):not(.disabled):active .np-text-body-default {
5793
+ color: #163300;
5675
5794
  color: var(--color-interactive-primary);
5676
5795
  }
5677
5796
  .np-theme-personal .np-dropdown-menu .np-dropdown-item {
5678
5797
  outline: none;
5679
5798
  }
5680
5799
  .np-theme-personal .np-dropdown-menu .np-dropdown-item--focused {
5800
+ box-shadow: inset 0 0 0 2px #163300;
5681
5801
  box-shadow: inset 0 0 0 2px var(--color-interactive-primary);
5682
5802
  }
5683
5803
  .segmented-control {
@@ -5693,7 +5813,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5693
5813
  width: 100%;
5694
5814
  justify-content: center;
5695
5815
  align-items: center;
5696
- background: rgba(134,167,189,0.10196);
5816
+ background: rgba(22,51,0,0.07843);
5697
5817
  background: var(--color-background-neutral);
5698
5818
  border-radius: 24px;
5699
5819
  border-radius: var(--size-24);
@@ -5701,6 +5821,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5701
5821
  outline: 2px solid transparent;
5702
5822
  }
5703
5823
  .segmented-control--input:has(:focus-visible) > .segmented-control__segments::after {
5824
+ outline: 2px solid #163300;
5704
5825
  outline: 2px solid var(--color-interactive-primary);
5705
5826
  }
5706
5827
  .segmented-control__segments::after {
@@ -5740,13 +5861,14 @@ html:not([dir="rtl"]) .np-navigation-option {
5740
5861
  z-index: 1;
5741
5862
  cursor: pointer;
5742
5863
  transition: background 300ms;
5864
+ color: #163300;
5743
5865
  color: var(--color-interactive-primary);
5744
5866
  }
5745
5867
  .segmented-control__segment:first-child {
5746
5868
  margin-left: 0;
5747
5869
  }
5748
5870
  .segmented-control__segment:hover {
5749
- background: rgba(0,0,0,0.10196);
5871
+ background: rgba(22,51,0,0.07843);
5750
5872
  background: var(--color-background-overlay);
5751
5873
  }
5752
5874
  .segmented-control__radio-input {
@@ -5770,6 +5892,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5770
5892
  outline-offset: 0px;
5771
5893
  }
5772
5894
  .segmented-control__button:focus-visible {
5895
+ outline-color: #163300;
5773
5896
  outline-color: var(--color-interactive-primary);
5774
5897
  }
5775
5898
  .segmented-control__selected-segment:hover {
@@ -5778,6 +5901,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5778
5901
  .segmented-control__text {
5779
5902
  word-wrap: break-word;
5780
5903
  word-break: break-word;
5904
+ color: #163300;
5781
5905
  color: var(--color-interactive-primary);
5782
5906
  transition: font-weight 300ms;
5783
5907
  }
@@ -5807,17 +5931,20 @@ html:not([dir="rtl"]) .np-navigation-option {
5807
5931
  margin-top: 0;
5808
5932
  }
5809
5933
  .np-summary__title .np-info .tw-icon {
5934
+ color: #163300;
5810
5935
  color: var(--color-interactive-primary);
5811
5936
  }
5812
5937
  .np-summary__icon {
5813
5938
  position: relative;
5814
- color: #37517e;
5939
+ color: #0e0f0c;
5815
5940
  color: var(--color-content-primary);
5816
5941
  }
5817
5942
  .np-summary__icon .np-summary-icon__done {
5943
+ color: #054d28;
5818
5944
  color: var(--color-sentiment-positive);
5819
5945
  }
5820
5946
  .np-summary__icon .np-summary-icon__pending {
5947
+ color: #ffd11a;
5821
5948
  color: var(--color-sentiment-warning);
5822
5949
  }
5823
5950
  .np-summary__icon :nth-child(2) {
@@ -5840,7 +5967,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5840
5967
  font-size: 0.875rem;
5841
5968
  font-size: var(--font-size-14);
5842
5969
  line-height: calc(20 / 14);
5843
- color: #5d7079;
5970
+ color: #454745;
5844
5971
  color: var(--color-content-secondary);
5845
5972
  padding-right: calc(24px + 8px);
5846
5973
  padding-right: calc(var(--size-24) + var(--size-8));
@@ -5890,14 +6017,14 @@ html:not([dir="rtl"]) .np-navigation-option {
5890
6017
  color: #fff;
5891
6018
  }
5892
6019
  .np-switch--unchecked {
5893
- background: #c9cbce;
6020
+ background: #868685;
5894
6021
  background: var(--color-interactive-secondary);
5895
6022
  }
5896
6023
  .np-switch--unchecked .switch--thumb {
5897
6024
  transform: translateX(0);
5898
6025
  }
5899
6026
  .np-switch--checked {
5900
- background: #00a2dd;
6027
+ background: #9fe870;
5901
6028
  background: var(--color-interactive-accent);
5902
6029
  }
5903
6030
  .np-switch--checked .np-switch--thumb {
@@ -5915,6 +6042,7 @@ html:not([dir="rtl"]) .np-navigation-option {
5915
6042
  padding: 1px 2px;
5916
6043
  }
5917
6044
  .np-theme-personal .np-switch--checked {
6045
+ background: #163300;
5918
6046
  background: var(--color-interactive-primary);
5919
6047
  }
5920
6048
  .np-theme-personal .np-switch--thumb {
@@ -5939,23 +6067,23 @@ html:not([dir="rtl"]) .np-navigation-option {
5939
6067
  padding: 8px;
5940
6068
  padding: var(--size-8);
5941
6069
  margin-bottom: -2px;
5942
- color: #37517e;
6070
+ color: #0e0f0c;
5943
6071
  color: var(--color-content-primary);
5944
6072
  font-weight: 600;
5945
6073
  font-weight: var(--font-weight-semi-bold);
5946
6074
  transition: color 0.15s ease-in-out;
5947
6075
  }
5948
6076
  .np-theme-personal .tabs__tab {
5949
- color: #5d7079;
6077
+ color: #454745;
5950
6078
  color: var(--color-content-secondary);
5951
6079
  font-weight: 400;
5952
6080
  font-weight: var(--font-weight-regular);
5953
6081
  }
5954
6082
  .tabs__tab--selected {
5955
- color: #0097c7;
5956
6083
  color: var(--color-content-accent);
5957
6084
  }
5958
6085
  .np-theme-personal .tabs__tab--selected {
6086
+ color: #163300;
5959
6087
  color: var(--color-interactive-primary);
5960
6088
  font-weight: 600;
5961
6089
  font-weight: var(--font-weight-semi-bold);
@@ -5964,29 +6092,29 @@ html:not([dir="rtl"]) .np-navigation-option {
5964
6092
  border-radius: 2px;
5965
6093
  }
5966
6094
  .tabs__tab:not(.disabled):not(:disabled):focus-visible .tabs__tab__content {
5967
- color: #0084b3;
5968
6095
  color: var(--color-content-accent-hover);
5969
6096
  }
5970
6097
  .np-theme-personal .tabs__tab:not(.disabled):not(:disabled):focus-visible .tabs__tab__content {
6098
+ color: #0d1f00;
5971
6099
  color: var(--color-interactive-primary-hover);
5972
6100
  outline: var(--ring-outline-color) solid var(--ring-outline-width);
5973
6101
  outline-offset: var(--ring-outline-offset);
5974
6102
  }
5975
6103
  @media (min-width: 992px) {
5976
6104
  .tabs__tab:not(.disabled):not(:disabled):hover {
5977
- color: #0084b3;
5978
6105
  color: var(--color-content-accent-hover);
5979
6106
  }
5980
6107
  .np-theme-personal .tabs__tab:not(.disabled):not(:disabled):hover {
6108
+ color: #0d1f00;
5981
6109
  color: var(--color-interactive-primary-hover);
5982
6110
  }
5983
6111
  }
5984
6112
  @media (hover: hover) {
5985
6113
  .tabs__tab:not(.disabled):not(:disabled):hover {
5986
- color: #0084b3;
5987
6114
  color: var(--color-content-accent-hover);
5988
6115
  }
5989
6116
  .np-theme-personal .tabs__tab:not(.disabled):not(:disabled):hover {
6117
+ color: #0d1f00;
5990
6118
  color: var(--color-interactive-primary-hover);
5991
6119
  }
5992
6120
  }
@@ -5994,18 +6122,19 @@ html:not([dir="rtl"]) .np-navigation-option {
5994
6122
  list-style: none;
5995
6123
  padding: 0;
5996
6124
  margin: 0;
5997
- border-bottom: 1px solid rgba(0,0,0,0.10196);
6125
+ border-bottom: 1px solid rgba(14,15,12,0.12157);
5998
6126
  border-bottom: 1px solid var(--color-border-neutral);
5999
6127
  }
6000
6128
  .tabs__line {
6001
6129
  height: 2px;
6002
- background-color: #00a2dd;
6130
+ background-color: #9fe870;
6003
6131
  background-color: var(--color-interactive-accent);
6004
6132
  transition: transform cubic-bezier(0, 0.94, 0.62, 1) 350ms;
6005
6133
  position: relative;
6006
6134
  bottom: -1px;
6007
6135
  }
6008
6136
  .np-theme-personal .tabs__line {
6137
+ background-color: #163300;
6009
6138
  background-color: var(--color-interactive-primary);
6010
6139
  }
6011
6140
  .tabs__panel-container {
@@ -6028,7 +6157,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6028
6157
  opacity: 0;
6029
6158
  }
6030
6159
  .tabs--inverse .tabs__tab-list {
6031
- border-bottom-color: rgba(0,0,0,0.10196);
6160
+ border-bottom-color: rgba(14,15,12,0.12157);
6032
6161
  border-bottom-color: var(--color-border-neutral);
6033
6162
  }
6034
6163
  .tabs--inverse .tabs__tab:not(.tabs__tab--selected) {
@@ -6083,7 +6212,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6083
6212
  .np-table-container {
6084
6213
  padding: 8px;
6085
6214
  padding: var(--size-8);
6086
- background-color: rgba(134,167,189,0.10196);
6215
+ background-color: rgba(22,51,0,0.07843);
6087
6216
  background-color: var(--color-background-neutral);
6088
6217
  border-radius: inherit;
6089
6218
  }
@@ -6091,9 +6220,11 @@ html:not([dir="rtl"]) .np-navigation-option {
6091
6220
  background-image: none;
6092
6221
  }
6093
6222
  .np-table-inner-container {
6223
+ background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(to right, #ffffff, #ffffff), linear-gradient(to right, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0)), linear-gradient(to left, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0));
6094
6224
  background-image: linear-gradient(to right, var(--color-contrast-overlay), var(--color-contrast-overlay)), linear-gradient(to right, var(--color-contrast-overlay), var(--color-contrast-overlay)), linear-gradient(to right, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0)), linear-gradient(to left, rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0));
6095
6225
  background-position: left center, right center, left center, right center;
6096
6226
  background-repeat: no-repeat;
6227
+ background-color: #ffffff;
6097
6228
  background-color: var(--color-contrast-overlay);
6098
6229
  background-size: 15px 100%, 15px 100%, 15px 100%, 15px 100%;
6099
6230
  background-attachment: local, local, scroll, scroll;
@@ -6101,6 +6232,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6101
6232
  border-radius: 10px;
6102
6233
  }
6103
6234
  .np-theme-personal--dark .np-table-inner-container {
6235
+ background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(to right, #ffffff, #ffffff), linear-gradient(to right, #000000, rgba(0, 0, 0, 0)), linear-gradient(to left, #000000, rgba(0, 0, 0, 0));
6104
6236
  background-image: linear-gradient(to right, var(--color-contrast-overlay), var(--color-contrast-overlay)), linear-gradient(to right, var(--color-contrast-overlay), var(--color-contrast-overlay)), linear-gradient(to right, #000000, rgba(0, 0, 0, 0)), linear-gradient(to left, #000000, rgba(0, 0, 0, 0));
6105
6237
  }
6106
6238
  .np-table-row:last-child .np-table-cell:first-child {
@@ -6131,6 +6263,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6131
6263
  width: 100%;
6132
6264
  top: 0;
6133
6265
  left: 0;
6266
+ background-color: rgba(22,51,0,0.07843);
6134
6267
  background-color: var(--color-background-screen-hover);
6135
6268
  }
6136
6269
  .np-table-row--clickable .np-table-cell:first-child:before,
@@ -6216,8 +6349,9 @@ html:not([dir="rtl"]) .np-navigation-option {
6216
6349
  padding-bottom: var(--size-8);
6217
6350
  padding-left: 8px;
6218
6351
  padding-left: var(--size-8);
6219
- background-color: rgba(134,167,189,0.10196);
6352
+ background-color: rgba(22,51,0,0.07843);
6220
6353
  background-color: var(--color-background-neutral);
6354
+ color: #163300;
6221
6355
  color: var(--color-interactive-primary);
6222
6356
  }
6223
6357
  .np-table-header-content {
@@ -6230,6 +6364,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6230
6364
  letter-spacing: var(--letter-spacing-sm);
6231
6365
  }
6232
6366
  .np-table-header--error {
6367
+ color: #cb272f;
6233
6368
  color: var(--color-sentiment-negative);
6234
6369
  }
6235
6370
  .np-table-header--action {
@@ -6260,21 +6395,23 @@ html:not([dir="rtl"]) .np-navigation-option {
6260
6395
  margin-bottom: 4px;
6261
6396
  margin-bottom: var(--size-4);
6262
6397
  height: 1px;
6263
- background-color: rgba(134,167,189,0.10196);
6398
+ background-color: rgba(22,51,0,0.07843);
6264
6399
  background-color: var(--color-background-neutral);
6265
6400
  padding: 0;
6266
6401
  }
6267
6402
  .np-table-cell .np-text-body-default-bold {
6268
6403
  display: flex;
6269
6404
  align-items: center;
6270
- color: #37517e;
6405
+ color: #0e0f0c;
6271
6406
  color: var(--color-content-primary);
6272
6407
  white-space: nowrap;
6273
6408
  }
6274
6409
  .np-table-cell .np-table-content--success {
6410
+ color: #054d28;
6275
6411
  color: var(--color-sentiment-positive);
6276
6412
  }
6277
6413
  .np-table-cell .np-table-content--error {
6414
+ color: #cb272f;
6278
6415
  color: var(--color-sentiment-negative);
6279
6416
  }
6280
6417
  .np-table-cell .tw-loader {
@@ -6307,7 +6444,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6307
6444
  flex-direction: column;
6308
6445
  font-size: 0.75rem;
6309
6446
  font-size: var(--font-size-12);
6310
- color: #768e9c;
6447
+ color: #6a6c6a;
6311
6448
  color: var(--color-content-tertiary);
6312
6449
  }
6313
6450
  .np-table-content--reversed {
@@ -6331,28 +6468,31 @@ html:not([dir="rtl"]) .np-navigation-option {
6331
6468
  width: 100%;
6332
6469
  }
6333
6470
  .np-theme-personal .np-tile {
6334
- background-color: rgba(134,167,189,0.10196);
6471
+ background-color: rgba(22,51,0,0.07843);
6335
6472
  background-color: var(--color-background-neutral);
6336
6473
  }
6337
6474
  .np-theme-personal .np-tile .tw-avatar .tw-avatar__content {
6475
+ background-color: #ffffff;
6338
6476
  background-color: var(--color-contrast);
6339
6477
  }
6340
6478
  .np-tile.decision {
6341
6479
  margin-top: 0;
6342
- border: 1px solid rgba(0,0,0,0.10196);
6480
+ border: 1px solid rgba(14,15,12,0.12157);
6343
6481
  border: 1px solid var(--color-border-neutral);
6344
6482
  }
6345
6483
  .np-theme-personal .np-tile.decision {
6346
6484
  border: none;
6347
6485
  }
6348
6486
  .np-theme-personal .np-tile.decision:hover {
6487
+ background-color: rgba(22,51,0,0.12941);
6349
6488
  background-color: var(--color-background-neutral-hover);
6350
6489
  }
6351
6490
  .np-theme-personal .np-tile.decision:active {
6491
+ background-color: rgba(22,51,0,0.18039);
6352
6492
  background-color: var(--color-background-neutral-active);
6353
6493
  }
6354
6494
  .np-theme-personal .np-tile.decision .np-text-body-default {
6355
- color: #5d7079;
6495
+ color: #454745;
6356
6496
  color: var(--color-content-secondary);
6357
6497
  }
6358
6498
  .np-tile.np-decision__tile--fixed-width {
@@ -6362,7 +6502,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6362
6502
  width: 100%;
6363
6503
  }
6364
6504
  .np-tile__description {
6365
- color: #5d7079;
6505
+ color: #454745;
6366
6506
  color: var(--color-content-secondary);
6367
6507
  margin-top: 12px;
6368
6508
  margin-top: var(--size-12);
@@ -6383,7 +6523,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6383
6523
  background-color: var(--color-background-screen);
6384
6524
  }
6385
6525
  .np-tile__description {
6386
- color: #5d7079;
6526
+ color: #454745;
6387
6527
  color: var(--color-content-secondary);
6388
6528
  font-weight: 400;
6389
6529
  font-weight: var(--font-weight-regular);
@@ -6606,10 +6746,11 @@ html:not([dir="rtl"]) .np-navigation-option {
6606
6746
  }
6607
6747
  }
6608
6748
  .np-theme-personal .typeahead .input-group:not(.disabled):not(:disabled):not(.input-group--has-error):focus-within .tw-icon-search {
6749
+ color: #163300;
6609
6750
  color: var(--color-interactive-primary);
6610
6751
  }
6611
6752
  .np-theme-personal .typeahead .tw-icon-search {
6612
- color: #c9cbce;
6753
+ color: #868685;
6613
6754
  color: var(--color-interactive-secondary);
6614
6755
  }
6615
6756
  .np-theme-personal .typeahead .np-chip {
@@ -6625,11 +6766,8 @@ html:not([dir="rtl"]) .np-navigation-option {
6625
6766
  padding-right: var(--size-32);
6626
6767
  }
6627
6768
  }
6628
- .typeahead__option.tw-dropdown-item .dropdown-item:active strong {
6629
- color: #ffffff;
6630
- }
6631
6769
  .typeahead__option.tw-dropdown-item--focused {
6632
- box-shadow: inset 0 0 0 1px #c9cbce;
6770
+ box-shadow: inset 0 0 0 1px #868685;
6633
6771
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
6634
6772
  border-radius: 10px;
6635
6773
  border-radius: var(--radius-small);
@@ -6658,7 +6796,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6658
6796
  .upload-error-message {
6659
6797
  margin-top: 24px;
6660
6798
  margin-top: var(--padding-medium);
6661
- border-top: 1px solid rgba(0,0,0,0.10196);
6799
+ border-top: 1px solid rgba(14,15,12,0.12157);
6662
6800
  border-top: 1px solid var(--color-border-neutral);
6663
6801
  text-align: start;
6664
6802
  }
@@ -6683,6 +6821,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6683
6821
  cursor: pointer;
6684
6822
  }
6685
6823
  .np-upload-input__upload-button .np-upload-input__title {
6824
+ color: #163300;
6686
6825
  color: var(--color-content-link);
6687
6826
  -webkit-text-decoration: underline;
6688
6827
  text-decoration: underline;
@@ -6695,6 +6834,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6695
6834
  .np-upload-input__upload-button .np-upload-input__icon {
6696
6835
  padding-right: 16px;
6697
6836
  padding-right: var(--size-16);
6837
+ color: #163300;
6698
6838
  color: var(--color-interactive-primary);
6699
6839
  }
6700
6840
  .np-upload-input__upload-button.is-dropping .np-upload-input__icon,
@@ -6729,7 +6869,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6729
6869
  display: block;
6730
6870
  position: absolute;
6731
6871
  height: 1px;
6732
- background-color: rgba(0,0,0,0.10196);
6872
+ background-color: rgba(14,15,12,0.12157);
6733
6873
  background-color: var(--color-border-neutral);
6734
6874
  content: " ";
6735
6875
  left: 16px;
@@ -6746,7 +6886,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6746
6886
  .np-upload-input__upload-button--enabled.is-dropping,
6747
6887
  .np-upload-input__upload-button--enabled:hover,
6748
6888
  .np-upload-input__upload-button--enabled:active {
6749
- background: rgba(134,167,189,0.10196);
6889
+ background: rgba(22,51,0,0.07843);
6750
6890
  background: var(--color-background-neutral);
6751
6891
  }
6752
6892
  .np-upload-input__upload-button--enabled.is-dropping:before,
@@ -6802,7 +6942,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6802
6942
  width: calc(100% - 2 * 16px);
6803
6943
  width: calc(100% - 2 * var(--size-16));
6804
6944
  top: 0;
6805
- background: rgba(0,0,0,0.10196);
6945
+ background: rgba(14,15,12,0.12157);
6806
6946
  background: var(--color-border-neutral);
6807
6947
  }
6808
6948
  .np-upload-input__item .np-upload-input__item-content {
@@ -6821,7 +6961,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6821
6961
  margin: 0;
6822
6962
  -moz-text-align-last: left;
6823
6963
  text-align-last: left;
6824
- color: #5d7079;
6964
+ color: #454745;
6825
6965
  color: var(--color-content-secondary);
6826
6966
  }
6827
6967
  .np-upload-input__item .np-upload-input__title + .np-upload-input__text {
@@ -6865,8 +7005,9 @@ html:not([dir="rtl"]) .np-navigation-option {
6865
7005
  padding: 0 var(--size-4);
6866
7006
  border-radius: 50%;
6867
7007
  border: 0;
6868
- background-color: rgba(134,167,189,0.10196);
7008
+ background-color: rgba(22,51,0,0.07843);
6869
7009
  background-color: var(--color-background-neutral);
7010
+ color: #163300;
6870
7011
  color: var(--color-interactive-primary);
6871
7012
  transition: color, background-color 0.15s ease-in-out;
6872
7013
  outline-offset: 0;
@@ -6885,10 +7026,13 @@ html:not([dir="rtl"]) .np-navigation-option {
6885
7026
  right: var(--clickAreaTopRightOffset);
6886
7027
  }
6887
7028
  .np-upload-input__item .np-upload-input__item-action .np-upload-input__item-button:hover {
7029
+ background-color: #cb272f;
6888
7030
  background-color: var(--color-sentiment-negative);
7031
+ color: #ffffff !important;
6889
7032
  color: var(--color-contrast-overlay) !important;
6890
7033
  }
6891
7034
  .np-upload-input__item .np-upload-input__item-action .np-upload-input__item-button:active {
7035
+ background-color: rgba(22,51,0,0.18039);
6892
7036
  background-color: var(--color-background-neutral-active);
6893
7037
  }
6894
7038
  .np-upload-input__item.is-interactive {
@@ -6914,7 +7058,7 @@ html:not([dir="rtl"]) .np-navigation-option {
6914
7058
  }
6915
7059
  .np-upload-input__item.is-interactive .np-upload-input__item-link:hover,
6916
7060
  .np-upload-input__item.is-interactive .np-upload-input__item-link:active {
6917
- background-color: rgba(134,167,189,0.10196);
7061
+ background-color: rgba(22,51,0,0.07843);
6918
7062
  background-color: var(--color-background-neutral);
6919
7063
  }
6920
7064
  .np-upload-input__item.is-interactive:first-child .np-upload-input__item-link {
@@ -6950,27 +7094,27 @@ html:not([dir="rtl"]) .np-navigation-option {
6950
7094
  height: var(--size-8);
6951
7095
  }
6952
7096
  .np-progress::-webkit-progress-bar {
6953
- background-color: rgba(134,167,189,0.10196);
7097
+ background-color: rgba(22,51,0,0.07843);
6954
7098
  background-color: var(--color-background-neutral);
6955
7099
  border-radius: 10px;
6956
7100
  border-radius: var(--radius-small);
6957
7101
  }
6958
7102
  .np-progress::-webkit-progress-value {
6959
- background-color: #0097c7;
6960
7103
  background-color: var(--color-content-accent);
6961
7104
  border-radius: 10px;
6962
7105
  border-radius: var(--radius-small);
6963
7106
  }
6964
7107
  .np-theme-personal .np-progress::-webkit-progress-value {
7108
+ background-color: #163300;
6965
7109
  background-color: var(--color-interactive-primary);
6966
7110
  }
6967
7111
  .np-progress::-moz-progress-bar {
6968
- background-color: #0097c7;
6969
7112
  background-color: var(--color-content-accent);
6970
7113
  border-radius: 10px;
6971
7114
  border-radius: var(--radius-small);
6972
7115
  }
6973
7116
  .np-theme-personal .np-progress::-moz-progress-bar {
7117
+ background-color: #163300;
6974
7118
  background-color: var(--color-interactive-primary);
6975
7119
  }
6976
7120
  @media (prefers-reduced-motion: no-preference) {
@@ -6986,13 +7130,13 @@ html:not([dir="rtl"]) .np-navigation-option {
6986
7130
  }
6987
7131
  }
6988
7132
  .np-progress-bar__title .h4 {
6989
- color: #37517e;
7133
+ color: #0e0f0c;
6990
7134
  color: var(--color-content-primary);
6991
7135
  margin-bottom: 4px;
6992
7136
  margin-bottom: var(--size-4);
6993
7137
  }
6994
7138
  .np-progress-bar p {
6995
- color: #37517e;
7139
+ color: #0e0f0c;
6996
7140
  color: var(--color-content-primary);
6997
7141
  margin-top: 4px;
6998
7142
  margin-top: var(--size-4);