@transferwise/neptune-css 0.0.0-experimental-bb7ed4a → 0.0.0-experimental-7cfec48

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 (59) hide show
  1. package/dist/css/accordion.css +6 -21
  2. package/dist/css/alerts.css +14 -159
  3. package/dist/css/background.css +2 -6
  4. package/dist/css/badge.css +1 -11
  5. package/dist/css/breadcrumbs.css +1 -2
  6. package/dist/css/button-groups.css +2 -8
  7. package/dist/css/buttons.css +142 -212
  8. package/dist/css/chevron.css +1 -1
  9. package/dist/css/circles.css +10 -22
  10. package/dist/css/close.css +2 -3
  11. package/dist/css/column-layout.css +0 -4
  12. package/dist/css/currency-flags.css +1 -5
  13. package/dist/css/decision.css +5 -14
  14. package/dist/css/dropdowns.css +8 -28
  15. package/dist/css/droppable.css +11 -18
  16. package/dist/css/flex.css +0 -32
  17. package/dist/css/footer.css +8 -46
  18. package/dist/css/grid.css +0 -6
  19. package/dist/css/input-groups.css +142 -188
  20. package/dist/css/link-callout.css +0 -2
  21. package/dist/css/list-group.css +8 -39
  22. package/dist/css/media.css +0 -6
  23. package/dist/css/modals.css +3 -13
  24. package/dist/css/navbar-base.css +19 -107
  25. package/dist/css/navbar.css +37 -175
  26. package/dist/css/navs.css +8 -33
  27. package/dist/css/neptune-addons.css +4 -466
  28. package/dist/css/neptune-core.css +32 -196
  29. package/dist/css/neptune.css +655 -2204
  30. package/dist/css/panels.css +0 -3
  31. package/dist/css/popovers.css +6 -30
  32. package/dist/css/process.css +8 -8
  33. package/dist/css/progress-bars.css +2 -11
  34. package/dist/css/ring.css +2 -2
  35. package/dist/css/select.css +2 -12
  36. package/dist/css/sequences.css +25 -173
  37. package/dist/css/table.css +18 -65
  38. package/dist/css/tick.css +0 -2
  39. package/dist/css/tooltip.css +1 -7
  40. package/dist/css/wells.css +5 -25
  41. package/dist/less/neptune-tokens.less +153 -264
  42. package/dist/props/neptune-tokens.css +145 -132
  43. package/package.json +2 -2
  44. package/src/less/addons/_background-utilities.less +33 -33
  45. package/src/less/alerts.less +28 -28
  46. package/src/less/background.less +0 -3
  47. package/src/less/buttons.less +19 -19
  48. package/src/less/column-layout.less +1 -1
  49. package/src/less/core/_scaffolding.less +13 -13
  50. package/src/less/core/_typography-utilities.less +18 -18
  51. package/src/less/dropdowns.less +7 -7
  52. package/src/less/footer.less +26 -26
  53. package/src/less/modals.less +1 -1
  54. package/src/less/navbar-base.less +25 -25
  55. package/src/less/navbar.less +3 -3
  56. package/src/less/navs.less +9 -9
  57. package/src/less/sequences.less +13 -13
  58. package/src/less/table.less +31 -31
  59. package/src/variables/neptune-tokens.less +8 -8
@@ -21,15 +21,13 @@ legend {
21
21
  label {
22
22
  display: inline-block;
23
23
  max-width: 100%;
24
- margin-bottom: 4px;
25
24
  margin-bottom: var(--size-4);
26
25
  }
27
26
  label,
28
27
  .secondary {
29
- color: #5d7079;
28
+ color: #454745;
30
29
  color: var(--color-content-secondary);
31
30
  transition: color ease-in-out 0.15s;
32
- font-size: 0.875rem;
33
31
  font-size: var(--font-size-14);
34
32
  line-height: 20px;
35
33
  }
@@ -73,30 +71,26 @@ input[type='checkbox']:focus {
73
71
  output {
74
72
  display: block;
75
73
  padding-top: 9px;
76
- font-size: 1rem;
77
74
  font-size: var(--font-size-16);
78
- line-height: 1.2;
79
75
  line-height: var(--line-height-control);
80
- color: #37517e;
76
+ color: #0e0f0c;
81
77
  color: var(--color-content-primary);
82
78
  }
83
79
  .form-control {
84
80
  display: block;
85
81
  width: 100%;
86
- color: #37517e;
82
+ color: #0e0f0c;
87
83
  color: var(--color-content-primary);
88
84
  background-color: #ffffff;
89
85
  background-color: var(--color-background-screen);
90
86
  background-image: none;
91
- border: 1px solid #c9cbce;
87
+ border: 1px solid #868685;
92
88
  border: 1px solid var(--color-interactive-secondary);
93
89
  transition: border-color ease-in-out 0.15s;
94
90
  min-height: var(--input-height-base);
95
91
  padding: var(--input-padding);
96
92
  border-radius: 3px;
97
- font-weight: 400;
98
93
  font-weight: var(--font-weight-regular);
99
- font-size: 1rem;
100
94
  font-size: var(--font-size-16);
101
95
  line-height: 150%;
102
96
  letter-spacing: -0.011em;
@@ -110,16 +104,16 @@ select[multiple].form-control {
110
104
  height: auto;
111
105
  }
112
106
  .form-control:not(.disabled):not(:disabled):focus {
113
- border-color: #0081ba;
107
+ border-color: #65cf21;
114
108
  border-color: var(--color-interactive-accent-active);
115
109
  outline: 0;
116
110
  }
117
111
  .form-control::-moz-placeholder {
118
- color: #768e9c;
112
+ color: #6a6c6a;
119
113
  color: var(--color-content-tertiary);
120
114
  }
121
115
  .form-control::placeholder {
122
- color: #768e9c;
116
+ color: #6a6c6a;
123
117
  color: var(--color-content-tertiary);
124
118
  }
125
119
  textarea.form-control {
@@ -136,18 +130,20 @@ textarea.form-control {
136
130
  margin-top: 8px;
137
131
  }
138
132
  .form-control:focus {
139
- border-color: #0081ba;
133
+ border-color: #65cf21;
140
134
  border-color: var(--color-interactive-accent-active);
141
135
  }
142
136
  .np-theme-personal .form-control:not(.disabled):not(:disabled):focus {
137
+ border-color: #163300;
143
138
  border-color: var(--color-interactive-primary);
144
139
  outline: 0;
145
140
  }
146
141
  .np-theme-personal .form-control:hover {
147
- border-color: #b5b7ba;
142
+ border-color: #6c6c6b;
148
143
  border-color: var(--color-interactive-secondary-hover);
149
144
  }
150
145
  .np-theme-personal .form-control:focus {
146
+ border-color: #163300;
151
147
  border-color: var(--color-interactive-primary);
152
148
  }
153
149
  input[type='search'] {
@@ -180,7 +176,6 @@ input[type='search'] {
180
176
  .input-group-lg input[type='time'],
181
177
  .input-group-lg input[type='datetime-local'],
182
178
  .input-group-lg input[type='month'] {
183
- line-height: calc(var(--input-height-large) - 1.5);
184
179
  line-height: calc(var(--input-height-large) - var(--line-height-body));
185
180
  }
186
181
  }
@@ -192,7 +187,6 @@ input[type='search'] {
192
187
  }
193
188
  .form-group:focus-within .control-label,
194
189
  .form-group:focus-within > label {
195
- color: #0097c7;
196
190
  color: var(--color-content-accent);
197
191
  }
198
192
  .row-equal-height > [class*='col-'] > .form-group {
@@ -282,13 +276,12 @@ fieldset[disabled] .checkbox label {
282
276
  }
283
277
  .form-control-static {
284
278
  margin-bottom: 0;
285
- min-height: calc(1.2 * 2);
286
279
  min-height: calc(var(--line-height-control) * 2);
287
- color: #5d7079;
280
+ color: #454745;
288
281
  color: var(--color-content-secondary);
289
- background-color: rgba(134,167,189,0.10196);
282
+ background-color: rgba(22,51,0,0.07843);
290
283
  background-color: var(--color-background-neutral);
291
- border: 1px solid #c9cbce;
284
+ border: 1px solid #868685;
292
285
  border: 1px solid var(--color-interactive-secondary);
293
286
  border-radius: 3px;
294
287
  padding: var(--input-padding);
@@ -316,11 +309,9 @@ fieldset[disabled] .checkbox label {
316
309
  border-radius: 3px;
317
310
  font-size: 14px;
318
311
  line-height: 24px;
319
- font-size: 0.875rem;
320
312
  font-size: var(--font-size-14);
321
313
  line-height: 155%;
322
314
  letter-spacing: -0.006em;
323
- font-weight: 400;
324
315
  font-weight: var(--font-weight-regular);
325
316
  }
326
317
  select.input-sm {
@@ -334,7 +325,6 @@ select[multiple].input-sm {
334
325
  .navbar .form-control {
335
326
  height: 32px;
336
327
  padding: var(--input-padding-small);
337
- font-size: 0.875rem;
338
328
  font-size: var(--font-size-14);
339
329
  line-height: 24px;
340
330
  border-radius: 3px;
@@ -353,10 +343,8 @@ select[multiple].input-sm {
353
343
  .form-group-sm .form-control-static,
354
344
  .navbar .form-control-static {
355
345
  height: 32px;
356
- min-height: calc(1.2 + 14px);
357
346
  min-height: calc(var(--line-height-control) + 14px);
358
347
  padding: var(--input-padding-small);
359
- font-size: 0.875rem;
360
348
  font-size: var(--font-size-14);
361
349
  line-height: 24px;
362
350
  }
@@ -364,9 +352,7 @@ select[multiple].input-sm {
364
352
  min-height: var(--input-height-large);
365
353
  padding: var(--input-padding-large);
366
354
  border-radius: 3px;
367
- font-weight: 400;
368
355
  font-weight: var(--font-weight-regular);
369
- font-size: 1rem;
370
356
  font-size: var(--font-size-16);
371
357
  line-height: 150%;
372
358
  letter-spacing: -0.011em;
@@ -385,7 +371,6 @@ select[multiple].input-lg {
385
371
  .form-group-lg .input-group-lg > .form-control,
386
372
  .form-group-lg .input-group-lg > .input-group-addon {
387
373
  height: var(--input-height-large);
388
- padding: calc(4px + 24px) 12px 4px;
389
374
  padding: calc(4px + var(--size-24)) 12px 4px;
390
375
  font-size: 22px;
391
376
  line-height: 32px;
@@ -399,7 +384,6 @@ select[multiple].input-lg {
399
384
  }
400
385
  .form-group-lg .form-control-static {
401
386
  height: var(--input-height-large);
402
- min-height: calc(1.2 + 22px);
403
387
  min-height: calc(var(--line-height-control) + 22px);
404
388
  padding: var(--input-padding-large);
405
389
  font-size: 22px;
@@ -458,17 +442,16 @@ select[multiple].input-lg {
458
442
  }
459
443
  .focus .control-label,
460
444
  .has-focus .control-label {
461
- color: #0077a5;
462
445
  color: var(--color-content-accent-active);
463
446
  }
464
447
  .focus .input-group-addon,
465
448
  .has-focus .input-group-addon {
466
- border-color: #c9cbce;
449
+ border-color: #868685;
467
450
  border-color: var(--color-interactive-secondary);
468
451
  }
469
452
  .focus .input-group-addon:active,
470
453
  .has-focus .input-group-addon:active {
471
- border-color: #a7a9ab;
454
+ border-color: #525251;
472
455
  border-color: var(--color-interactive-secondary-active);
473
456
  }
474
457
  .help-block,
@@ -477,7 +460,6 @@ select[multiple].input-lg {
477
460
  margin-bottom: 4px;
478
461
  border-width: 0;
479
462
  border-style: solid;
480
- border-radius: 10px;
481
463
  border-radius: var(--radius-small);
482
464
  padding: 4px 16px 3px;
483
465
  transition: border-color 0.15s ease-in-out, background-color 0.15s ease-in-out;
@@ -487,11 +469,11 @@ select[multiple].input-lg {
487
469
  color: inherit;
488
470
  }
489
471
  .help-block {
490
- color: #5d7079;
472
+ color: #454745;
491
473
  color: var(--color-content-secondary);
492
- border-color: #c9cbce;
474
+ border-color: #868685;
493
475
  border-color: var(--color-interactive-secondary);
494
- background-color: rgba(134,167,189,0.10196);
476
+ background-color: rgba(22,51,0,0.07843);
495
477
  background-color: var(--color-background-neutral);
496
478
  display: block;
497
479
  position: relative;
@@ -564,11 +546,10 @@ select[multiple].input-lg {
564
546
  }
565
547
  .focus .alert,
566
548
  .has-focus .alert {
567
- border-color: #0081ba;
549
+ border-color: #65cf21;
568
550
  border-color: var(--color-interactive-accent-active);
569
551
  }
570
552
  .has-success {
571
- border-color: #2ead4b !important;
572
553
  border-color: var(--color-interactive-positive) !important;
573
554
  }
574
555
  .has-success .control-label,
@@ -585,9 +566,7 @@ select[multiple].input-lg {
585
566
  .has-success .radio-inline label,
586
567
  .has-success .checkbox-inline label,
587
568
  .has-success .input-group-addon {
588
- color: #008026 !important;
589
569
  color: var(--color-content-positive) !important;
590
- border-color: #2ead4b !important;
591
570
  border-color: var(--color-interactive-positive) !important;
592
571
  }
593
572
  .has-success .form-control,
@@ -596,7 +575,6 @@ select[multiple].input-lg {
596
575
  .has-success .btn-input:not(.disabled):not(:disabled):hover,
597
576
  .has-success .input-group-addon,
598
577
  .has-success .alert {
599
- border-color: #2ead4b !important;
600
578
  border-color: var(--color-interactive-positive) !important;
601
579
  }
602
580
  .has-success:active .form-control,
@@ -620,32 +598,27 @@ select[multiple].input-lg {
620
598
  .has-success:active .alert,
621
599
  .has-success:focus .alert,
622
600
  .has-success:focus-within .alert {
623
- border-color: #069939 !important;
624
601
  border-color: var(--color-interactive-positive-hover) !important;
625
602
  }
626
603
  .has-success:not(.disabled):not(:disabled):hover.radio label,
627
604
  .has-success:not(.disabled):not(:disabled):hover.checkbox label,
628
605
  .has-success:not(.disabled):not(:disabled):hover .btn-input,
629
606
  .has-success:not(.disabled):not(:disabled):hover .alert {
630
- border-color: #069939 !important;
631
607
  border-color: var(--color-interactive-positive-hover) !important;
632
608
  }
633
609
  .has-success .form-control-feedback {
634
- color: #008026;
635
610
  color: var(--color-content-positive);
636
611
  }
637
612
  .has-success .radio > label:not(.disabled):not(:disabled),
638
613
  .has-success.checkbox > label:not(.disabled):not(:disabled) {
639
- border-color: #2ead4b;
640
614
  border-color: var(--color-interactive-positive);
641
- color: #37517e;
615
+ color: #0e0f0c;
642
616
  color: var(--color-content-primary);
643
617
  }
644
618
  .has-success .radio > label:not(.disabled):not(:disabled):hover,
645
619
  .has-success.checkbox > label:not(.disabled):not(:disabled):hover,
646
620
  .has-success .radio > label:focus-within,
647
621
  .has-success.checkbox > label:focus-within {
648
- border-color: #069939 !important;
649
622
  border-color: var(--color-interactive-positive-hover) !important;
650
623
  }
651
624
  .has-success .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -656,17 +629,16 @@ select[multiple].input-lg {
656
629
  .has-success.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
657
630
  .has-success .radio > label:focus-within .tw-radio-button,
658
631
  .has-success.checkbox > label:focus-within .tw-radio-button {
659
- border-color: #069939 !important;
660
632
  border-color: var(--color-interactive-positive-hover) !important;
661
633
  }
662
634
  .has-success .radio .tw-checkbox-button,
663
635
  .has-success.checkbox .tw-checkbox-button,
664
636
  .has-success .radio .tw-radio-button,
665
637
  .has-success.checkbox .tw-radio-button {
666
- border-color: #2ead4b;
667
638
  border-color: var(--color-interactive-positive);
668
639
  }
669
640
  .np-theme-personal .has-success {
641
+ border-color: #2f5711 !important;
670
642
  border-color: var(--color-sentiment-positive) !important;
671
643
  }
672
644
  .np-theme-personal .has-success .control-label,
@@ -683,7 +655,9 @@ select[multiple].input-lg {
683
655
  .np-theme-personal .has-success .radio-inline label,
684
656
  .np-theme-personal .has-success .checkbox-inline label,
685
657
  .np-theme-personal .has-success .input-group-addon {
658
+ color: #2f5711 !important;
686
659
  color: var(--color-sentiment-positive) !important;
660
+ border-color: #2f5711 !important;
687
661
  border-color: var(--color-sentiment-positive) !important;
688
662
  }
689
663
  .np-theme-personal .has-success .form-control,
@@ -692,6 +666,7 @@ select[multiple].input-lg {
692
666
  .np-theme-personal .has-success .btn-input:not(.disabled):not(:disabled):hover,
693
667
  .np-theme-personal .has-success .input-group-addon,
694
668
  .np-theme-personal .has-success .alert {
669
+ border-color: #2f5711 !important;
695
670
  border-color: var(--color-sentiment-positive) !important;
696
671
  }
697
672
  .np-theme-personal .has-success:active .form-control,
@@ -715,27 +690,32 @@ select[multiple].input-lg {
715
690
  .np-theme-personal .has-success:active .alert,
716
691
  .np-theme-personal .has-success:focus .alert,
717
692
  .np-theme-personal .has-success:focus-within .alert {
693
+ border-color: #2f5711 !important;
718
694
  border-color: var(--color-sentiment-positive) !important;
719
695
  }
720
696
  .np-theme-personal .has-success:not(.disabled):not(:disabled):hover.radio label,
721
697
  .np-theme-personal .has-success:not(.disabled):not(:disabled):hover.checkbox label,
722
698
  .np-theme-personal .has-success:not(.disabled):not(:disabled):hover .btn-input,
723
699
  .np-theme-personal .has-success:not(.disabled):not(:disabled):hover .alert {
700
+ border-color: #2f5711 !important;
724
701
  border-color: var(--color-sentiment-positive) !important;
725
702
  }
726
703
  .np-theme-personal .has-success .form-control-feedback {
704
+ color: #2f5711;
727
705
  color: var(--color-sentiment-positive);
728
706
  }
729
707
  .np-theme-personal .has-success .radio > label:not(.disabled):not(:disabled),
730
708
  .np-theme-personal .has-success.checkbox > label:not(.disabled):not(:disabled) {
709
+ border-color: #2f5711;
731
710
  border-color: var(--color-sentiment-positive);
732
- color: #37517e;
711
+ color: #0e0f0c;
733
712
  color: var(--color-content-primary);
734
713
  }
735
714
  .np-theme-personal .has-success .radio > label:not(.disabled):not(:disabled):hover,
736
715
  .np-theme-personal .has-success.checkbox > label:not(.disabled):not(:disabled):hover,
737
716
  .np-theme-personal .has-success .radio > label:focus-within,
738
717
  .np-theme-personal .has-success.checkbox > label:focus-within {
718
+ border-color: #2f5711 !important;
739
719
  border-color: var(--color-sentiment-positive) !important;
740
720
  }
741
721
  .np-theme-personal .has-success .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -746,16 +726,18 @@ select[multiple].input-lg {
746
726
  .np-theme-personal .has-success.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
747
727
  .np-theme-personal .has-success .radio > label:focus-within .tw-radio-button,
748
728
  .np-theme-personal .has-success.checkbox > label:focus-within .tw-radio-button {
729
+ border-color: #2f5711 !important;
749
730
  border-color: var(--color-sentiment-positive) !important;
750
731
  }
751
732
  .np-theme-personal .has-success .radio .tw-checkbox-button,
752
733
  .np-theme-personal .has-success.checkbox .tw-checkbox-button,
753
734
  .np-theme-personal .has-success .radio .tw-radio-button,
754
735
  .np-theme-personal .has-success.checkbox .tw-radio-button {
736
+ border-color: #2f5711;
755
737
  border-color: var(--color-sentiment-positive);
756
738
  }
757
739
  .has-info {
758
- border-color: #00a2dd !important;
740
+ border-color: #9fe870 !important;
759
741
  border-color: var(--color-interactive-accent) !important;
760
742
  }
761
743
  .has-info .control-label,
@@ -772,9 +754,8 @@ select[multiple].input-lg {
772
754
  .has-info .radio-inline label,
773
755
  .has-info .checkbox-inline label,
774
756
  .has-info .input-group-addon {
775
- color: #0097c7 !important;
776
757
  color: var(--color-content-accent) !important;
777
- border-color: #00a2dd !important;
758
+ border-color: #9fe870 !important;
778
759
  border-color: var(--color-interactive-accent) !important;
779
760
  }
780
761
  .has-info .form-control,
@@ -783,7 +764,7 @@ select[multiple].input-lg {
783
764
  .has-info .btn-input:not(.disabled):not(:disabled):hover,
784
765
  .has-info .input-group-addon,
785
766
  .has-info .alert {
786
- border-color: #00a2dd !important;
767
+ border-color: #9fe870 !important;
787
768
  border-color: var(--color-interactive-accent) !important;
788
769
  }
789
770
  .has-info:active .form-control,
@@ -807,32 +788,31 @@ select[multiple].input-lg {
807
788
  .has-info:active .alert,
808
789
  .has-info:focus .alert,
809
790
  .has-info:focus-within .alert {
810
- border-color: #008fc9 !important;
791
+ border-color: #80e142 !important;
811
792
  border-color: var(--color-interactive-accent-hover) !important;
812
793
  }
813
794
  .has-info:not(.disabled):not(:disabled):hover.radio label,
814
795
  .has-info:not(.disabled):not(:disabled):hover.checkbox label,
815
796
  .has-info:not(.disabled):not(:disabled):hover .btn-input,
816
797
  .has-info:not(.disabled):not(:disabled):hover .alert {
817
- border-color: #008fc9 !important;
798
+ border-color: #80e142 !important;
818
799
  border-color: var(--color-interactive-accent-hover) !important;
819
800
  }
820
801
  .has-info .form-control-feedback {
821
- color: #0097c7;
822
802
  color: var(--color-content-accent);
823
803
  }
824
804
  .has-info .radio > label:not(.disabled):not(:disabled),
825
805
  .has-info.checkbox > label:not(.disabled):not(:disabled) {
826
- border-color: #00a2dd;
806
+ border-color: #9fe870;
827
807
  border-color: var(--color-interactive-accent);
828
- color: #37517e;
808
+ color: #0e0f0c;
829
809
  color: var(--color-content-primary);
830
810
  }
831
811
  .has-info .radio > label:not(.disabled):not(:disabled):hover,
832
812
  .has-info.checkbox > label:not(.disabled):not(:disabled):hover,
833
813
  .has-info .radio > label:focus-within,
834
814
  .has-info.checkbox > label:focus-within {
835
- border-color: #008fc9 !important;
815
+ border-color: #80e142 !important;
836
816
  border-color: var(--color-interactive-accent-hover) !important;
837
817
  }
838
818
  .has-info .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -843,14 +823,14 @@ select[multiple].input-lg {
843
823
  .has-info.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
844
824
  .has-info .radio > label:focus-within .tw-radio-button,
845
825
  .has-info.checkbox > label:focus-within .tw-radio-button {
846
- border-color: #008fc9 !important;
826
+ border-color: #80e142 !important;
847
827
  border-color: var(--color-interactive-accent-hover) !important;
848
828
  }
849
829
  .has-info .radio .tw-checkbox-button,
850
830
  .has-info.checkbox .tw-checkbox-button,
851
831
  .has-info .radio .tw-radio-button,
852
832
  .has-info.checkbox .tw-radio-button {
853
- border-color: #00a2dd;
833
+ border-color: #9fe870;
854
834
  border-color: var(--color-interactive-accent);
855
835
  }
856
836
  .np-theme-personal .has-info {
@@ -870,7 +850,7 @@ select[multiple].input-lg {
870
850
  .np-theme-personal .has-info .radio-inline label,
871
851
  .np-theme-personal .has-info .checkbox-inline label,
872
852
  .np-theme-personal .has-info .input-group-addon {
873
- color: #37517e !important;
853
+ color: #0e0f0c !important;
874
854
  color: var(--color-content-primary) !important;
875
855
  border-color: transparent !important;
876
856
  }
@@ -912,13 +892,13 @@ select[multiple].input-lg {
912
892
  border-color: transparent !important;
913
893
  }
914
894
  .np-theme-personal .has-info .form-control-feedback {
915
- color: #37517e;
895
+ color: #0e0f0c;
916
896
  color: var(--color-content-primary);
917
897
  }
918
898
  .np-theme-personal .has-info .radio > label:not(.disabled):not(:disabled),
919
899
  .np-theme-personal .has-info.checkbox > label:not(.disabled):not(:disabled) {
920
900
  border-color: transparent;
921
- color: #37517e;
901
+ color: #0e0f0c;
922
902
  color: var(--color-content-primary);
923
903
  }
924
904
  .np-theme-personal .has-info .radio > label:not(.disabled):not(:disabled):hover,
@@ -944,7 +924,6 @@ select[multiple].input-lg {
944
924
  border-color: transparent;
945
925
  }
946
926
  .has-warning {
947
- border-color: #df8700 !important;
948
927
  border-color: var(--color-interactive-warning) !important;
949
928
  }
950
929
  .has-warning .control-label,
@@ -961,9 +940,7 @@ select[multiple].input-lg {
961
940
  .has-warning .radio-inline label,
962
941
  .has-warning .checkbox-inline label,
963
942
  .has-warning .input-group-addon {
964
- color: #9a6500 !important;
965
943
  color: var(--color-content-warning) !important;
966
- border-color: #df8700 !important;
967
944
  border-color: var(--color-interactive-warning) !important;
968
945
  }
969
946
  .has-warning .form-control,
@@ -972,7 +949,6 @@ select[multiple].input-lg {
972
949
  .has-warning .btn-input:not(.disabled):not(:disabled):hover,
973
950
  .has-warning .input-group-addon,
974
951
  .has-warning .alert {
975
- border-color: #df8700 !important;
976
952
  border-color: var(--color-interactive-warning) !important;
977
953
  }
978
954
  .has-warning:active .form-control,
@@ -996,32 +972,27 @@ select[multiple].input-lg {
996
972
  .has-warning:active .alert,
997
973
  .has-warning:focus .alert,
998
974
  .has-warning:focus-within .alert {
999
- border-color: #c97500 !important;
1000
975
  border-color: var(--color-interactive-warning-hover) !important;
1001
976
  }
1002
977
  .has-warning:not(.disabled):not(:disabled):hover.radio label,
1003
978
  .has-warning:not(.disabled):not(:disabled):hover.checkbox label,
1004
979
  .has-warning:not(.disabled):not(:disabled):hover .btn-input,
1005
980
  .has-warning:not(.disabled):not(:disabled):hover .alert {
1006
- border-color: #c97500 !important;
1007
981
  border-color: var(--color-interactive-warning-hover) !important;
1008
982
  }
1009
983
  .has-warning .form-control-feedback {
1010
- color: #9a6500;
1011
984
  color: var(--color-content-warning);
1012
985
  }
1013
986
  .has-warning .radio > label:not(.disabled):not(:disabled),
1014
987
  .has-warning.checkbox > label:not(.disabled):not(:disabled) {
1015
- border-color: #df8700;
1016
988
  border-color: var(--color-interactive-warning);
1017
- color: #37517e;
989
+ color: #0e0f0c;
1018
990
  color: var(--color-content-primary);
1019
991
  }
1020
992
  .has-warning .radio > label:not(.disabled):not(:disabled):hover,
1021
993
  .has-warning.checkbox > label:not(.disabled):not(:disabled):hover,
1022
994
  .has-warning .radio > label:focus-within,
1023
995
  .has-warning.checkbox > label:focus-within {
1024
- border-color: #c97500 !important;
1025
996
  border-color: var(--color-interactive-warning-hover) !important;
1026
997
  }
1027
998
  .has-warning .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -1032,17 +1003,16 @@ select[multiple].input-lg {
1032
1003
  .has-warning.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
1033
1004
  .has-warning .radio > label:focus-within .tw-radio-button,
1034
1005
  .has-warning.checkbox > label:focus-within .tw-radio-button {
1035
- border-color: #c97500 !important;
1036
1006
  border-color: var(--color-interactive-warning-hover) !important;
1037
1007
  }
1038
1008
  .has-warning .radio .tw-checkbox-button,
1039
1009
  .has-warning.checkbox .tw-checkbox-button,
1040
1010
  .has-warning .radio .tw-radio-button,
1041
1011
  .has-warning.checkbox .tw-radio-button {
1042
- border-color: #df8700;
1043
1012
  border-color: var(--color-interactive-warning);
1044
1013
  }
1045
1014
  .np-theme-personal .has-warning {
1015
+ border-color: #edc843 !important;
1046
1016
  border-color: var(--color-sentiment-warning) !important;
1047
1017
  }
1048
1018
  .np-theme-personal .has-warning .control-label,
@@ -1059,7 +1029,9 @@ select[multiple].input-lg {
1059
1029
  .np-theme-personal .has-warning .radio-inline label,
1060
1030
  .np-theme-personal .has-warning .checkbox-inline label,
1061
1031
  .np-theme-personal .has-warning .input-group-addon {
1032
+ color: #edc843 !important;
1062
1033
  color: var(--color-sentiment-warning) !important;
1034
+ border-color: #edc843 !important;
1063
1035
  border-color: var(--color-sentiment-warning) !important;
1064
1036
  }
1065
1037
  .np-theme-personal .has-warning .form-control,
@@ -1068,6 +1040,7 @@ select[multiple].input-lg {
1068
1040
  .np-theme-personal .has-warning .btn-input:not(.disabled):not(:disabled):hover,
1069
1041
  .np-theme-personal .has-warning .input-group-addon,
1070
1042
  .np-theme-personal .has-warning .alert {
1043
+ border-color: #edc843 !important;
1071
1044
  border-color: var(--color-sentiment-warning) !important;
1072
1045
  }
1073
1046
  .np-theme-personal .has-warning:active .form-control,
@@ -1091,27 +1064,32 @@ select[multiple].input-lg {
1091
1064
  .np-theme-personal .has-warning:active .alert,
1092
1065
  .np-theme-personal .has-warning:focus .alert,
1093
1066
  .np-theme-personal .has-warning:focus-within .alert {
1067
+ border-color: #edc843 !important;
1094
1068
  border-color: var(--color-sentiment-warning) !important;
1095
1069
  }
1096
1070
  .np-theme-personal .has-warning:not(.disabled):not(:disabled):hover.radio label,
1097
1071
  .np-theme-personal .has-warning:not(.disabled):not(:disabled):hover.checkbox label,
1098
1072
  .np-theme-personal .has-warning:not(.disabled):not(:disabled):hover .btn-input,
1099
1073
  .np-theme-personal .has-warning:not(.disabled):not(:disabled):hover .alert {
1074
+ border-color: #edc843 !important;
1100
1075
  border-color: var(--color-sentiment-warning) !important;
1101
1076
  }
1102
1077
  .np-theme-personal .has-warning .form-control-feedback {
1078
+ color: #edc843;
1103
1079
  color: var(--color-sentiment-warning);
1104
1080
  }
1105
1081
  .np-theme-personal .has-warning .radio > label:not(.disabled):not(:disabled),
1106
1082
  .np-theme-personal .has-warning.checkbox > label:not(.disabled):not(:disabled) {
1083
+ border-color: #edc843;
1107
1084
  border-color: var(--color-sentiment-warning);
1108
- color: #37517e;
1085
+ color: #0e0f0c;
1109
1086
  color: var(--color-content-primary);
1110
1087
  }
1111
1088
  .np-theme-personal .has-warning .radio > label:not(.disabled):not(:disabled):hover,
1112
1089
  .np-theme-personal .has-warning.checkbox > label:not(.disabled):not(:disabled):hover,
1113
1090
  .np-theme-personal .has-warning .radio > label:focus-within,
1114
1091
  .np-theme-personal .has-warning.checkbox > label:focus-within {
1092
+ border-color: #edc843 !important;
1115
1093
  border-color: var(--color-sentiment-warning) !important;
1116
1094
  }
1117
1095
  .np-theme-personal .has-warning .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -1122,16 +1100,17 @@ select[multiple].input-lg {
1122
1100
  .np-theme-personal .has-warning.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
1123
1101
  .np-theme-personal .has-warning .radio > label:focus-within .tw-radio-button,
1124
1102
  .np-theme-personal .has-warning.checkbox > label:focus-within .tw-radio-button {
1103
+ border-color: #edc843 !important;
1125
1104
  border-color: var(--color-sentiment-warning) !important;
1126
1105
  }
1127
1106
  .np-theme-personal .has-warning .radio .tw-checkbox-button,
1128
1107
  .np-theme-personal .has-warning.checkbox .tw-checkbox-button,
1129
1108
  .np-theme-personal .has-warning .radio .tw-radio-button,
1130
1109
  .np-theme-personal .has-warning.checkbox .tw-radio-button {
1110
+ border-color: #edc843;
1131
1111
  border-color: var(--color-sentiment-warning);
1132
1112
  }
1133
1113
  .has-error {
1134
- border-color: #e74848 !important;
1135
1114
  border-color: var(--color-interactive-negative) !important;
1136
1115
  }
1137
1116
  .has-error .control-label,
@@ -1148,9 +1127,7 @@ select[multiple].input-lg {
1148
1127
  .has-error .radio-inline label,
1149
1128
  .has-error .checkbox-inline label,
1150
1129
  .has-error .input-group-addon {
1151
- color: #cf2929 !important;
1152
1130
  color: var(--color-content-negative) !important;
1153
- border-color: #e74848 !important;
1154
1131
  border-color: var(--color-interactive-negative) !important;
1155
1132
  }
1156
1133
  .has-error .form-control,
@@ -1159,7 +1136,6 @@ select[multiple].input-lg {
1159
1136
  .has-error .btn-input:not(.disabled):not(:disabled):hover,
1160
1137
  .has-error .input-group-addon,
1161
1138
  .has-error .alert {
1162
- border-color: #e74848 !important;
1163
1139
  border-color: var(--color-interactive-negative) !important;
1164
1140
  }
1165
1141
  .has-error:active .form-control,
@@ -1183,32 +1159,27 @@ select[multiple].input-lg {
1183
1159
  .has-error:active .alert,
1184
1160
  .has-error:focus .alert,
1185
1161
  .has-error:focus-within .alert {
1186
- border-color: #d03238 !important;
1187
1162
  border-color: var(--color-interactive-negative-hover) !important;
1188
1163
  }
1189
1164
  .has-error:not(.disabled):not(:disabled):hover.radio label,
1190
1165
  .has-error:not(.disabled):not(:disabled):hover.checkbox label,
1191
1166
  .has-error:not(.disabled):not(:disabled):hover .btn-input,
1192
1167
  .has-error:not(.disabled):not(:disabled):hover .alert {
1193
- border-color: #d03238 !important;
1194
1168
  border-color: var(--color-interactive-negative-hover) !important;
1195
1169
  }
1196
1170
  .has-error .form-control-feedback {
1197
- color: #cf2929;
1198
1171
  color: var(--color-content-negative);
1199
1172
  }
1200
1173
  .has-error .radio > label:not(.disabled):not(:disabled),
1201
1174
  .has-error.checkbox > label:not(.disabled):not(:disabled) {
1202
- border-color: #e74848;
1203
1175
  border-color: var(--color-interactive-negative);
1204
- color: #37517e;
1176
+ color: #0e0f0c;
1205
1177
  color: var(--color-content-primary);
1206
1178
  }
1207
1179
  .has-error .radio > label:not(.disabled):not(:disabled):hover,
1208
1180
  .has-error.checkbox > label:not(.disabled):not(:disabled):hover,
1209
1181
  .has-error .radio > label:focus-within,
1210
1182
  .has-error.checkbox > label:focus-within {
1211
- border-color: #d03238 !important;
1212
1183
  border-color: var(--color-interactive-negative-hover) !important;
1213
1184
  }
1214
1185
  .has-error .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -1219,17 +1190,16 @@ select[multiple].input-lg {
1219
1190
  .has-error.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
1220
1191
  .has-error .radio > label:focus-within .tw-radio-button,
1221
1192
  .has-error.checkbox > label:focus-within .tw-radio-button {
1222
- border-color: #d03238 !important;
1223
1193
  border-color: var(--color-interactive-negative-hover) !important;
1224
1194
  }
1225
1195
  .has-error .radio .tw-checkbox-button,
1226
1196
  .has-error.checkbox .tw-checkbox-button,
1227
1197
  .has-error .radio .tw-radio-button,
1228
1198
  .has-error.checkbox .tw-radio-button {
1229
- border-color: #e74848;
1230
1199
  border-color: var(--color-interactive-negative);
1231
1200
  }
1232
1201
  .np-theme-personal .has-error {
1202
+ border-color: #a8200d !important;
1233
1203
  border-color: var(--color-sentiment-negative) !important;
1234
1204
  }
1235
1205
  .np-theme-personal .has-error .control-label,
@@ -1246,7 +1216,9 @@ select[multiple].input-lg {
1246
1216
  .np-theme-personal .has-error .radio-inline label,
1247
1217
  .np-theme-personal .has-error .checkbox-inline label,
1248
1218
  .np-theme-personal .has-error .input-group-addon {
1219
+ color: #a8200d !important;
1249
1220
  color: var(--color-sentiment-negative) !important;
1221
+ border-color: #a8200d !important;
1250
1222
  border-color: var(--color-sentiment-negative) !important;
1251
1223
  }
1252
1224
  .np-theme-personal .has-error .form-control,
@@ -1255,6 +1227,7 @@ select[multiple].input-lg {
1255
1227
  .np-theme-personal .has-error .btn-input:not(.disabled):not(:disabled):hover,
1256
1228
  .np-theme-personal .has-error .input-group-addon,
1257
1229
  .np-theme-personal .has-error .alert {
1230
+ border-color: #a8200d !important;
1258
1231
  border-color: var(--color-sentiment-negative) !important;
1259
1232
  }
1260
1233
  .np-theme-personal .has-error:active .form-control,
@@ -1278,27 +1251,32 @@ select[multiple].input-lg {
1278
1251
  .np-theme-personal .has-error:active .alert,
1279
1252
  .np-theme-personal .has-error:focus .alert,
1280
1253
  .np-theme-personal .has-error:focus-within .alert {
1254
+ border-color: #8e1b0b !important;
1281
1255
  border-color: var(--color-sentiment-negative-hover) !important;
1282
1256
  }
1283
1257
  .np-theme-personal .has-error:not(.disabled):not(:disabled):hover.radio label,
1284
1258
  .np-theme-personal .has-error:not(.disabled):not(:disabled):hover.checkbox label,
1285
1259
  .np-theme-personal .has-error:not(.disabled):not(:disabled):hover .btn-input,
1286
1260
  .np-theme-personal .has-error:not(.disabled):not(:disabled):hover .alert {
1261
+ border-color: #8e1b0b !important;
1287
1262
  border-color: var(--color-sentiment-negative-hover) !important;
1288
1263
  }
1289
1264
  .np-theme-personal .has-error .form-control-feedback {
1265
+ color: #a8200d;
1290
1266
  color: var(--color-sentiment-negative);
1291
1267
  }
1292
1268
  .np-theme-personal .has-error .radio > label:not(.disabled):not(:disabled),
1293
1269
  .np-theme-personal .has-error.checkbox > label:not(.disabled):not(:disabled) {
1270
+ border-color: #a8200d;
1294
1271
  border-color: var(--color-sentiment-negative);
1295
- color: #37517e;
1272
+ color: #0e0f0c;
1296
1273
  color: var(--color-content-primary);
1297
1274
  }
1298
1275
  .np-theme-personal .has-error .radio > label:not(.disabled):not(:disabled):hover,
1299
1276
  .np-theme-personal .has-error.checkbox > label:not(.disabled):not(:disabled):hover,
1300
1277
  .np-theme-personal .has-error .radio > label:focus-within,
1301
1278
  .np-theme-personal .has-error.checkbox > label:focus-within {
1279
+ border-color: #8e1b0b !important;
1302
1280
  border-color: var(--color-sentiment-negative-hover) !important;
1303
1281
  }
1304
1282
  .np-theme-personal .has-error .radio > label:not(.disabled):not(:disabled):hover .tw-checkbox-button,
@@ -1309,16 +1287,17 @@ select[multiple].input-lg {
1309
1287
  .np-theme-personal .has-error.checkbox > label:not(.disabled):not(:disabled):hover .tw-radio-button,
1310
1288
  .np-theme-personal .has-error .radio > label:focus-within .tw-radio-button,
1311
1289
  .np-theme-personal .has-error.checkbox > label:focus-within .tw-radio-button {
1290
+ border-color: #8e1b0b !important;
1312
1291
  border-color: var(--color-sentiment-negative-hover) !important;
1313
1292
  }
1314
1293
  .np-theme-personal .has-error .radio .tw-checkbox-button,
1315
1294
  .np-theme-personal .has-error.checkbox .tw-checkbox-button,
1316
1295
  .np-theme-personal .has-error .radio .tw-radio-button,
1317
1296
  .np-theme-personal .has-error.checkbox .tw-radio-button {
1297
+ border-color: #a8200d;
1318
1298
  border-color: var(--color-sentiment-negative);
1319
1299
  }
1320
1300
  .has-feedback label ~ .form-control-feedback {
1321
- top: 1.2;
1322
1301
  top: var(--line-height-control);
1323
1302
  }
1324
1303
  .has-feedback label.sr-only ~ .form-control-feedback {
@@ -1396,7 +1375,6 @@ select[multiple].input-lg {
1396
1375
  }
1397
1376
  .form-horizontal .radio,
1398
1377
  .form-horizontal .checkbox {
1399
- min-height: calc(1.2 + (8px + 1));
1400
1378
  min-height: calc(var(--line-height-control) + (8px + 1));
1401
1379
  }
1402
1380
  .form-horizontal .form-group {
@@ -1432,20 +1410,18 @@ select[multiple].input-lg {
1432
1410
  @media (min-width: 576px) {
1433
1411
  .form-horizontal .form-group-lg .control-label {
1434
1412
  padding-top: 17px;
1435
- font-size: 1.25rem;
1436
1413
  font-size: var(--font-size-20);
1437
1414
  }
1438
1415
  }
1439
1416
  @media (min-width: 576px) {
1440
1417
  .form-horizontal .form-group-sm .control-label {
1441
1418
  padding-top: 8px;
1442
- font-size: 0.875rem;
1443
1419
  font-size: var(--font-size-14);
1444
1420
  }
1445
1421
  }
1446
1422
  .radio,
1447
1423
  .checkbox {
1448
- border-color: #c9cbce;
1424
+ border-color: #868685;
1449
1425
  border-color: var(--color-interactive-secondary);
1450
1426
  }
1451
1427
  .radio > label,
@@ -1477,7 +1453,7 @@ select[multiple].input-lg {
1477
1453
  left: initial;
1478
1454
  }
1479
1455
  .tw-checkbox-button {
1480
- border: 1px solid #c9cbce;
1456
+ border: 1px solid #868685;
1481
1457
  border: 1px solid var(--color-interactive-secondary);
1482
1458
  background: #ffffff;
1483
1459
  background: var(--color-background-screen);
@@ -1492,7 +1468,7 @@ select[multiple].input-lg {
1492
1468
  }
1493
1469
  .np-theme-personal .tw-checkbox-button {
1494
1470
  border: none;
1495
- box-shadow: inset 0 0 0 1px #c9cbce;
1471
+ box-shadow: inset 0 0 0 1px #868685;
1496
1472
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
1497
1473
  }
1498
1474
  .tw-checkbox-button .tw-checkbox-check {
@@ -1506,13 +1482,13 @@ select[multiple].input-lg {
1506
1482
  .tw-checkbox-button:not(.disabled):not(:disabled):hover,
1507
1483
  input[type="checkbox"]:hover + .tw-checkbox-button,
1508
1484
  .checkbox:hover .tw-checkbox-button {
1509
- border-color: #b5b7ba;
1485
+ border-color: #6c6c6b;
1510
1486
  border-color: var(--color-interactive-secondary-hover);
1511
1487
  }
1512
1488
  .np-theme-personal .tw-checkbox-button:not(.disabled):not(:disabled):hover,
1513
1489
  .np-theme-personal input[type="checkbox"]:hover + .tw-checkbox-button,
1514
1490
  .np-theme-personal .checkbox:hover .tw-checkbox-button {
1515
- box-shadow: inset 0 0 0 1px #b5b7ba;
1491
+ box-shadow: inset 0 0 0 1px #6c6c6b;
1516
1492
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary-hover);
1517
1493
  }
1518
1494
  .tw-checkbox-button:not(.disabled):not(:disabled):focus,
@@ -1523,7 +1499,7 @@ input[type="checkbox"]:focus + .tw-checkbox-button,
1523
1499
  .tw-checkbox-button:not(.disabled):not(:disabled):active,
1524
1500
  .tw-checkbox-button:not(.disabled):not(:disabled).active,
1525
1501
  input[type="checkbox"]:active + .tw-checkbox-button {
1526
- border-color: #c9cbce;
1502
+ border-color: #868685;
1527
1503
  border-color: var(--color-interactive-secondary);
1528
1504
  outline: none;
1529
1505
  }
@@ -1537,9 +1513,9 @@ input[type="checkbox"]:focus-visible + .tw-checkbox-button {
1537
1513
  .tw-checkbox-button:checked,
1538
1514
  .tw-checkbox-button.checked,
1539
1515
  input[type="checkbox"]:checked + .tw-checkbox-button {
1540
- border-color: #00a2dd !important;
1516
+ border-color: #9fe870 !important;
1541
1517
  border-color: var(--color-interactive-accent) !important;
1542
- background-color: #00a2dd;
1518
+ background-color: #9fe870;
1543
1519
  background-color: var(--color-interactive-accent);
1544
1520
  }
1545
1521
  .tw-checkbox-button:checked .tw-checkbox-check,
@@ -1550,74 +1526,74 @@ input[type="checkbox"]:checked + .tw-checkbox-button .tw-checkbox-check {
1550
1526
  .np-theme-personal .tw-checkbox-button:checked,
1551
1527
  .np-theme-personal .tw-checkbox-button.checked,
1552
1528
  .np-theme-personal input[type="checkbox"]:checked + .tw-checkbox-button {
1529
+ background-color: #163300;
1553
1530
  background-color: var(--color-interactive-primary);
1531
+ box-shadow: inset 0 0 0 1px #163300;
1554
1532
  box-shadow: inset 0 0 0 1px var(--color-interactive-primary);
1555
1533
  }
1556
1534
  .tw-checkbox-button:checked:hover,
1557
1535
  .tw-checkbox-button.checked:hover,
1558
1536
  input[type="checkbox"]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button {
1559
- border-color: #008fc9 !important;
1537
+ border-color: #80e142 !important;
1560
1538
  border-color: var(--color-interactive-accent-hover) !important;
1561
- background-color: #008fc9;
1539
+ background-color: #80e142;
1562
1540
  background-color: var(--color-interactive-accent-hover);
1563
1541
  }
1564
1542
  .np-theme-personal .tw-checkbox-button:checked:hover,
1565
1543
  .np-theme-personal .tw-checkbox-button.checked:hover,
1566
1544
  .np-theme-personal input[type="checkbox"]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button {
1545
+ border-color: #0d1f00 !important;
1567
1546
  border-color: var(--color-interactive-primary-hover) !important;
1547
+ background-color: #0d1f00;
1568
1548
  background-color: var(--color-interactive-primary-hover);
1549
+ box-shadow: inset 0 0 0 1px #0d1f00;
1569
1550
  box-shadow: inset 0 0 0 1px var(--color-interactive-primary-hover);
1570
1551
  }
1571
1552
  .tw-checkbox-button:checked:active,
1572
1553
  .tw-checkbox-button.checked:active,
1573
1554
  input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkbox-button {
1574
- border-color: #0081ba !important;
1555
+ border-color: #65cf21 !important;
1575
1556
  border-color: var(--color-interactive-accent-active) !important;
1576
- background-color: #0081ba;
1557
+ background-color: #65cf21;
1577
1558
  background-color: var(--color-interactive-accent-active);
1578
1559
  }
1579
1560
  .np-theme-personal .tw-checkbox-button:checked:active,
1580
1561
  .np-theme-personal .tw-checkbox-button.checked:active,
1581
1562
  .np-theme-personal input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkbox-button {
1563
+ border-color: #0e0f0c !important;
1582
1564
  border-color: var(--color-interactive-primary-active) !important;
1565
+ background-color: #0e0f0c;
1583
1566
  background-color: var(--color-interactive-primary-active);
1567
+ box-shadow: inset 0 0 0 1px #0e0f0c;
1584
1568
  box-shadow: inset 0 0 0 1px var(--color-interactive-primary-active);
1585
1569
  }
1586
1570
  .checkbox.has-error .tw-checkbox-button,
1587
1571
  .tw-checkbox-button.has-error {
1588
- border-color: #e74848 !important;
1589
1572
  border-color: var(--color-interactive-negative) !important;
1590
1573
  }
1591
1574
  .checkbox.has-error .tw-checkbox-button:checked,
1592
1575
  .tw-checkbox-button.has-error:checked,
1593
1576
  .checkbox.has-error .tw-checkbox-button.checked,
1594
1577
  .tw-checkbox-button.has-error.checked {
1595
- background-color: #e74848;
1596
1578
  background-color: var(--color-interactive-negative);
1597
1579
  }
1598
1580
  .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked + .tw-checkbox-button {
1599
- border-color: #e74848 !important;
1600
1581
  border-color: var(--color-interactive-negative) !important;
1601
- background-color: #e74848;
1602
1582
  background-color: var(--color-interactive-negative);
1603
1583
  }
1604
1584
  .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button {
1605
- border-color: #d03238 !important;
1606
1585
  border-color: var(--color-interactive-negative-hover) !important;
1607
- background-color: #d03238;
1608
1586
  background-color: var(--color-interactive-negative-hover);
1609
1587
  }
1610
1588
  .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkbox-button {
1611
- border-color: #bf1e2c !important;
1612
1589
  border-color: var(--color-interactive-negative-active) !important;
1613
- background-color: #bf1e2c;
1614
1590
  background-color: var(--color-interactive-negative-active);
1615
1591
  }
1616
1592
  .tw-radio-button {
1617
1593
  width: 24px;
1618
1594
  height: 24px;
1619
1595
  border-radius: 50%;
1620
- border: 1px solid #c9cbce;
1596
+ border: 1px solid #868685;
1621
1597
  border: 1px solid var(--color-interactive-secondary);
1622
1598
  background: #ffffff;
1623
1599
  background: var(--color-background-screen);
@@ -1629,7 +1605,7 @@ input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkb
1629
1605
  }
1630
1606
  .np-theme-personal .tw-radio-button {
1631
1607
  border: none;
1632
- box-shadow: inset 0 0 0 1px #c9cbce;
1608
+ box-shadow: inset 0 0 0 1px #868685;
1633
1609
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
1634
1610
  position: relative;
1635
1611
  top: 0;
@@ -1646,67 +1622,69 @@ input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkb
1646
1622
  }
1647
1623
  .radio:not(.disabled):not(:disabled):hover .tw-radio-button,
1648
1624
  .tw-radio-button:not(.disabled):not(:disabled):hover {
1649
- border-color: #b5b7ba;
1625
+ border-color: #6c6c6b;
1650
1626
  border-color: var(--color-interactive-secondary-hover);
1651
1627
  }
1652
1628
  .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button,
1653
1629
  .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover {
1654
1630
  border-color: transparent;
1655
- box-shadow: inset 0 0 0 1px #b5b7ba;
1631
+ box-shadow: inset 0 0 0 1px #6c6c6b;
1656
1632
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary-hover);
1657
1633
  }
1658
1634
  .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button:checked,
1659
1635
  .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover:checked,
1660
1636
  .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button.checked,
1661
1637
  .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover.checked {
1638
+ box-shadow: inset 0 0 0 1px #163300;
1662
1639
  box-shadow: inset 0 0 0 1px var(--color-interactive-primary);
1663
1640
  }
1664
1641
  .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button:checked .tw-radio-check,
1665
1642
  .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover:checked .tw-radio-check,
1666
1643
  .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button.checked .tw-radio-check,
1667
1644
  .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover.checked .tw-radio-check {
1645
+ background-color: #0d1f00;
1668
1646
  background-color: var(--color-interactive-primary-hover);
1669
1647
  }
1670
1648
  .tw-radio-button:not(.disabled):not(:disabled):focus,
1671
1649
  .tw-radio-button:not(.disabled):not(:disabled).focus,
1672
1650
  .tw-radio-button:not(.disabled):not(:disabled):active,
1673
1651
  .tw-radio-button:not(.disabled):not(:disabled).active {
1674
- border-color: #a7a9ab;
1652
+ border-color: #525251;
1675
1653
  border-color: var(--color-interactive-secondary-active);
1676
1654
  outline: none;
1677
1655
  }
1678
1656
  .tw-radio-button:checked,
1679
1657
  .tw-radio-button.checked {
1680
- border-color: #00a2dd !important;
1658
+ border-color: #9fe870 !important;
1681
1659
  border-color: var(--color-interactive-accent) !important;
1682
1660
  }
1683
1661
  .tw-radio-button:checked .tw-radio-check,
1684
1662
  .tw-radio-button.checked .tw-radio-check {
1685
1663
  opacity: 1;
1686
- background-color: #00a2dd;
1664
+ background-color: #9fe870;
1687
1665
  background-color: var(--color-interactive-accent);
1688
1666
  }
1689
1667
  .np-theme-personal .tw-radio-button:checked,
1690
1668
  .np-theme-personal .tw-radio-button.checked {
1691
1669
  border-color: transparent !important;
1670
+ box-shadow: inset 0 0 0 1px #163300;
1692
1671
  box-shadow: inset 0 0 0 1px var(--color-interactive-primary);
1693
1672
  }
1694
1673
  .np-theme-personal .tw-radio-button:checked .tw-radio-check,
1695
1674
  .np-theme-personal .tw-radio-button.checked .tw-radio-check {
1675
+ background-color: #163300;
1696
1676
  background-color: var(--color-interactive-primary);
1697
1677
  max-height: 12px;
1698
1678
  max-width: 12px;
1699
1679
  }
1700
1680
  .radio.has-error .tw-radio-button,
1701
1681
  .tw-radio-button.has-error {
1702
- border-color: #e74848 !important;
1703
1682
  border-color: var(--color-interactive-negative) !important;
1704
1683
  }
1705
1684
  .radio.has-error .tw-radio-button:checked .tw-radio-check,
1706
1685
  .tw-radio-button.has-error:checked .tw-radio-check,
1707
1686
  .radio.has-error .tw-radio-button.checked .tw-radio-check,
1708
1687
  .tw-radio-button.has-error.checked .tw-radio-check {
1709
- background-color: #e74848;
1710
1688
  background-color: var(--color-interactive-negative);
1711
1689
  }
1712
1690
  .radio .tw-radio-button {
@@ -1763,12 +1741,10 @@ input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkb
1763
1741
  .np-checkbox.checkbox > label {
1764
1742
  display: flex;
1765
1743
  align-items: center;
1766
- padding: 8px 16px;
1767
1744
  padding: var(--size-8) var(--size-16) ;
1768
1745
  }
1769
1746
  [dir="rtl"] .np-radio.radio > label,
1770
1747
  [dir="rtl"] .np-checkbox.checkbox > label {
1771
- padding: 8px 16px;
1772
1748
  padding: var(--size-8) var(--size-16) ;
1773
1749
  }
1774
1750
  .np-radio.radio > label .np-checkbox__text,
@@ -1782,11 +1758,8 @@ input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkb
1782
1758
  :not(.np-theme-personal) .np-checkbox.checkbox > label .np-checkbox__text,
1783
1759
  :not(.np-theme-personal) .np-radio.radio > label .np-radio__text,
1784
1760
  :not(.np-theme-personal) .np-checkbox.checkbox > label .np-radio__text {
1785
- font-weight: 400;
1786
1761
  font-weight: var(--font-weight-regular);
1787
- font-size: 1rem;
1788
1762
  font-size: var(--font-size-16);
1789
- line-height: 1.25rem;
1790
1763
  line-height: var(--line-height-20);
1791
1764
  padding-top: 3px;
1792
1765
  }
@@ -1804,7 +1777,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1804
1777
  border-left: 0 solid transparent;
1805
1778
  }
1806
1779
  .input-group-addon {
1807
- color: #5d7079;
1780
+ color: #454745;
1808
1781
  color: var(--color-content-secondary);
1809
1782
  transition: border-color ease-in-out 0.15s;
1810
1783
  }
@@ -1819,14 +1792,13 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1819
1792
  top: -3px;
1820
1793
  }
1821
1794
  .label .label-default {
1822
- color: #5d7079;
1795
+ color: #454745;
1823
1796
  color: var(--color-content-secondary);
1824
- background-color: rgba(134,167,189,0.10196);
1797
+ background-color: rgba(22,51,0,0.07843);
1825
1798
  background-color: var(--color-background-neutral);
1826
1799
  }
1827
1800
  .form-group {
1828
1801
  position: relative;
1829
- font-size: 0.875rem;
1830
1802
  font-size: var(--font-size-14);
1831
1803
  }
1832
1804
  .form-group .row {
@@ -1907,11 +1879,11 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1907
1879
  padding-top: 12px;
1908
1880
  padding-bottom: 10px;
1909
1881
  padding-right: 16px;
1910
- color: #37517e;
1882
+ color: #0e0f0c;
1911
1883
  color: var(--color-content-primary);
1912
1884
  background-color: #ffffff;
1913
1885
  background-color: var(--color-background-screen);
1914
- border: 1px solid #c9cbce;
1886
+ border: 1px solid #868685;
1915
1887
  border: 1px solid var(--color-interactive-secondary);
1916
1888
  border-radius: 3px;
1917
1889
  transition: border 0.15s ease-in-out, background-color 0.15s ease-in-out;
@@ -1924,12 +1896,11 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1924
1896
  }
1925
1897
  .np-theme-personal .checkbox > label,
1926
1898
  .np-theme-personal .radio > label {
1927
- border-radius: 10px;
1928
1899
  border-radius: var(--radius-small);
1929
1900
  }
1930
1901
  .checkbox > label:not(.disabled):not(:disabled):hover,
1931
1902
  .radio > label:not(.disabled):not(:disabled):hover {
1932
- border-color: #b5b7ba;
1903
+ border-color: #6c6c6b;
1933
1904
  border-color: var(--color-interactive-secondary-hover);
1934
1905
  }
1935
1906
  .checkbox > label:not(.disabled):not(:disabled).focus,
@@ -1942,7 +1913,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1942
1913
  .radio > label:not(.disabled):not(:disabled).has-focus:hover,
1943
1914
  .checkbox > label:not(.disabled):not(:disabled):focus-within,
1944
1915
  .radio > label:not(.disabled):not(:disabled):focus-within {
1945
- border-color: #0081ba;
1916
+ border-color: #65cf21;
1946
1917
  border-color: var(--color-interactive-accent-active);
1947
1918
  }
1948
1919
  .np-theme-personal .checkbox > label:not(.disabled):not(:disabled).focus,
@@ -1955,14 +1926,13 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1955
1926
  .np-theme-personal .radio > label:not(.disabled):not(:disabled).has-focus:hover,
1956
1927
  .np-theme-personal .checkbox > label:not(.disabled):not(:disabled):focus-within,
1957
1928
  .np-theme-personal .radio > label:not(.disabled):not(:disabled):focus-within {
1958
- border-color: #c9cbce;
1929
+ border-color: #868685;
1959
1930
  border-color: var(--color-interactive-secondary);
1960
1931
  }
1961
1932
  .checkbox.checkbox-lg > label,
1962
1933
  .radio.checkbox-lg > label,
1963
1934
  .checkbox.radio-lg > label,
1964
1935
  .radio.radio-lg > label {
1965
- min-height: 72px;
1966
1936
  min-height: var(--size-72);
1967
1937
  }
1968
1938
  .checkbox.checkbox-lg > label small,
@@ -1982,14 +1952,12 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
1982
1952
  .checkbox.radio-lg > label .np-text-body-default,
1983
1953
  .radio.radio-lg > label .np-text-body-default {
1984
1954
  display: block;
1985
- color: #5d7079;
1955
+ color: #454745;
1986
1956
  color: var(--color-content-secondary);
1987
1957
  }
1988
1958
  .error-messages {
1989
1959
  display: none;
1990
- color: #cf2929;
1991
1960
  color: var(--color-content-negative);
1992
- background-color: rgba(255,135,135,0.10196);
1993
1961
  background-color: var(--color-background-negative);
1994
1962
  position: relative;
1995
1963
  }
@@ -2082,15 +2050,13 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2082
2050
  .form-control-placeholder {
2083
2051
  text-overflow: ellipsis;
2084
2052
  overflow: hidden;
2085
- font-weight: 400;
2086
2053
  font-weight: var(--font-weight-regular);
2087
- font-size: 1rem;
2088
2054
  font-size: var(--font-size-16);
2089
2055
  line-height: 150%;
2090
2056
  letter-spacing: -0.011em;
2091
2057
  display: block;
2092
2058
  width: 100%;
2093
- color: #768e9c;
2059
+ color: #6a6c6a;
2094
2060
  color: var(--color-content-tertiary);
2095
2061
  }
2096
2062
  .np-theme-personal .btn-input,
@@ -2102,7 +2068,6 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2102
2068
  background-color: transparent;
2103
2069
  background-color: initial;
2104
2070
  border: none !important;
2105
- border-radius: 10px;
2106
2071
  border-radius: var(--radius-small);
2107
2072
  }
2108
2073
  .np-theme-personal .btn-input,
@@ -2110,7 +2075,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2110
2075
  .np-theme-personal .form-control,
2111
2076
  .np-theme-personal .radio > label,
2112
2077
  .np-theme-personal .checkbox > label {
2113
- box-shadow: inset 0 0 0 1px #c9cbce;
2078
+ box-shadow: inset 0 0 0 1px #868685;
2114
2079
  box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
2115
2080
  transition: box-shadow 0.3s ease-in-out;
2116
2081
  }
@@ -2124,7 +2089,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2124
2089
  .np-theme-personal .form-control:not(.disabled):not(:disabled):hover,
2125
2090
  .np-theme-personal .radio > label:not(.disabled):not(:disabled):hover,
2126
2091
  .np-theme-personal .checkbox > label:not(.disabled):not(:disabled):hover {
2127
- box-shadow: inset 0 0 0 2px #b5b7ba;
2092
+ box-shadow: inset 0 0 0 2px #6c6c6b;
2128
2093
  box-shadow: inset 0 0 0 2px var(--color-interactive-secondary-hover);
2129
2094
  }
2130
2095
  .np-theme-personal .btn-input:not(.disabled):not(:disabled):hover:has(:checked, .checked),
@@ -2132,6 +2097,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2132
2097
  .np-theme-personal .form-control:not(.disabled):not(:disabled):hover:has(:checked, .checked),
2133
2098
  .np-theme-personal .radio > label:not(.disabled):not(:disabled):hover:has(:checked, .checked),
2134
2099
  .np-theme-personal .checkbox > label:not(.disabled):not(:disabled):hover:has(:checked, .checked) {
2100
+ box-shadow: inset 0 0 0 2px #0d1f00;
2135
2101
  box-shadow: inset 0 0 0 2px var(--color-interactive-primary-hover);
2136
2102
  }
2137
2103
  .np-theme-personal .btn-input:not(.disabled):not(:disabled):focus-visible,
@@ -2144,6 +2110,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2144
2110
  .np-theme-personal .radio > label:not(.disabled):not(:disabled):has(:focus-visible),
2145
2111
  .np-theme-personal .checkbox > label:not(.disabled):not(:disabled):focus-visible,
2146
2112
  .np-theme-personal .checkbox > label:not(.disabled):not(:disabled):has(:focus-visible) {
2113
+ box-shadow: inset 0 0 0 3px #163300;
2147
2114
  box-shadow: inset 0 0 0 3px var(--color-interactive-primary);
2148
2115
  }
2149
2116
  .np-theme-personal .has-error .btn-input,
@@ -2151,12 +2118,14 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2151
2118
  .np-theme-personal .has-error .form-control,
2152
2119
  .np-theme-personal .has-error .radio > label,
2153
2120
  .np-theme-personal .has-error .checkbox > label {
2121
+ box-shadow: inset 0 0 0 2px #a8200d;
2154
2122
  box-shadow: inset 0 0 0 2px var(--color-sentiment-negative);
2155
2123
  }
2156
2124
  .np-theme-personal .has-error .input-group:not(.disabled):not(:disabled):hover,
2157
2125
  .np-theme-personal .has-error .form-control:not(.disabled):not(:disabled):hover,
2158
2126
  .np-theme-personal .has-error .radio > label:not(.disabled):not(:disabled):hover,
2159
2127
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):hover {
2128
+ box-shadow: inset 0 0 0 2px #8e1b0b;
2160
2129
  box-shadow: inset 0 0 0 2px var(--color-sentiment-negative-hover);
2161
2130
  }
2162
2131
  .np-theme-personal .has-error .input-group:not(.disabled):not(:disabled):active,
@@ -2171,15 +2140,19 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2171
2140
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):active,
2172
2141
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):focus-visible,
2173
2142
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):has(:focus-visible) {
2143
+ box-shadow: inset 0 0 0 3px #a8200d;
2174
2144
  box-shadow: inset 0 0 0 3px var(--color-sentiment-negative);
2175
2145
  }
2176
2146
  .np-theme-personal .has-error .tw-radio-button {
2147
+ border-color: #a8200d !important;
2177
2148
  border-color: var(--color-sentiment-negative) !important;
2178
2149
  }
2179
2150
  .np-theme-personal .has-error .tw-radio-button.checked {
2151
+ box-shadow: inset 0 0 0 1px #a8200d;
2180
2152
  box-shadow: inset 0 0 0 1px var(--color-sentiment-negative);
2181
2153
  }
2182
2154
  .np-theme-personal .has-error .tw-radio-button.checked .tw-radio-check {
2155
+ background: #a8200d !important;
2183
2156
  background: var(--color-sentiment-negative) !important;
2184
2157
  }
2185
2158
  .np-theme-personal .has-error .checkbox:hover .tw-checkbox-button,
@@ -2188,6 +2161,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2188
2161
  .np-theme-personal .has-error input[type=checkbox]:hover + .tw-checkbox-button,
2189
2162
  .np-theme-personal .has-error input[type=radio]:not(.disabled):not(:disabled):hover + .tw-radio-button,
2190
2163
  .np-theme-personal .has-error input[type=checkbox]:not(.disabled):not(:disabled):hover + .tw-checkbox-button {
2164
+ box-shadow: inset 0 0 0 2px #8e1b0b;
2191
2165
  box-shadow: inset 0 0 0 2px var(--color-sentiment-negative-hover);
2192
2166
  }
2193
2167
  .np-theme-personal .has-error .tw-checkbox-button.checked,
@@ -2196,12 +2170,15 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2196
2170
  .np-theme-personal .has-error .tw-checkbox-button.checked:hover,
2197
2171
  .np-theme-personal .has-error .tw-checkbox-button:checked:hover,
2198
2172
  .np-theme-personal .has-error input[type=checkbox]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button {
2173
+ box-shadow: inset 0 0 0 3px #a8200d;
2199
2174
  box-shadow: inset 0 0 0 3px var(--color-sentiment-negative);
2175
+ background: #a8200d;
2200
2176
  background: var(--color-sentiment-negative);
2201
2177
  }
2202
2178
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):active input[type=checkbox] + .tw-checkbox-button,
2203
2179
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):focus-visible input[type=checkbox] + .tw-checkbox-button,
2204
2180
  .np-theme-personal .has-error .checkbox > label:not(.disabled):not(:disabled):has(:focus-visible) input[type=checkbox] + .tw-checkbox-button {
2181
+ box-shadow: inset 0 0 0 2px #761709;
2205
2182
  box-shadow: inset 0 0 0 2px var(--color-sentiment-negative-active);
2206
2183
  }
2207
2184
  .np-theme-personal .tw-radio-button,
@@ -2221,7 +2198,6 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2221
2198
  background-color: initial !important;
2222
2199
  }
2223
2200
  .np-theme-personal .form-group label {
2224
- margin-bottom: 8px;
2225
2201
  margin-bottom: var(--padding-x-small);
2226
2202
  }
2227
2203
  .np-theme-personal .form-group .np-upload-input label {
@@ -2233,11 +2209,12 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2233
2209
  .np-theme-personal .has-warning label,
2234
2210
  .np-theme-personal .has-success .control-label,
2235
2211
  .np-theme-personal .has-success label {
2236
- color: #5d7079 !important;
2212
+ color: #454745 !important;
2237
2213
  color: var(--color-content-secondary) !important;
2238
2214
  }
2239
2215
  .np-theme-personal .has-error .control-label,
2240
2216
  .np-theme-personal .has-error label {
2217
+ color: #a8200d !important;
2241
2218
  color: var(--color-sentiment-negative) !important;
2242
2219
  }
2243
2220
  .np-theme-personal .form-group .alert:before,
@@ -2246,11 +2223,9 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2246
2223
  }
2247
2224
  .np-theme-personal .error-messages,
2248
2225
  .np-theme-personal .alert-detach {
2249
- color: #5d7079;
2226
+ color: #454745;
2250
2227
  color: var(--color-content-secondary);
2251
- line-height: 1.2;
2252
2228
  line-height: var(--line-height-control);
2253
- margin: 8px 0;
2254
2229
  margin: var(--padding-x-small) 0;
2255
2230
  padding: 0;
2256
2231
  background-color: transparent;
@@ -2258,20 +2233,20 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2258
2233
  }
2259
2234
  .np-theme-personal .has-error .error-messages,
2260
2235
  .np-theme-personal .has-error .alert-detach.alert-danger {
2236
+ color: #a8200d;
2261
2237
  color: var(--color-sentiment-negative);
2262
2238
  display: flex;
2263
2239
  }
2264
2240
  .np-theme-personal .has-error .error-messages .tw-icon,
2265
2241
  .np-theme-personal .has-error .alert-detach.alert-danger .tw-icon {
2266
- margin-right: 8px;
2267
2242
  margin-right: var(--padding-x-small);
2268
2243
  }
2269
2244
  .has-required::after {
2270
2245
  content: "\00a0*";
2271
- color: #cf2929;
2272
2246
  color: var(--color-content-negative);
2273
2247
  }
2274
2248
  .np-theme-personal .has-required::after {
2249
+ color: #a8200d;
2275
2250
  color: var(--color-sentiment-negative);
2276
2251
  }
2277
2252
  .input-group {
@@ -2293,7 +2268,7 @@ html:not([dir="rtl"]) .input-group .input-group-btn + input {
2293
2268
  float: left;
2294
2269
  width: 100%;
2295
2270
  margin-bottom: 0;
2296
- border-color: #c9cbce;
2271
+ border-color: #868685;
2297
2272
  border-color: var(--color-interactive-secondary);
2298
2273
  }
2299
2274
  [dir="rtl"] .input-group .form-control {
@@ -2338,23 +2313,18 @@ html:not([dir="rtl"]) .input-group .form-control:not(:last-child) {
2338
2313
  min-height: var(--input-height-large);
2339
2314
  padding: var(--input-padding-large);
2340
2315
  border-radius: 3px;
2341
- font-weight: 400;
2342
2316
  font-weight: var(--font-weight-regular);
2343
- font-size: 1rem;
2344
2317
  font-size: var(--font-size-16);
2345
2318
  line-height: 150%;
2346
2319
  letter-spacing: -0.011em;
2347
2320
  margin: 0;
2348
- color: #37517e;
2321
+ color: #0e0f0c;
2349
2322
  color: var(--color-content-primary);
2350
- line-height: 1.2;
2351
2323
  line-height: var(--line-height-title);
2352
2324
  letter-spacing: 0;
2353
2325
  margin-bottom: 0;
2354
2326
  margin-bottom: initial;
2355
- font-size: 1.375rem;
2356
2327
  font-size: var(--font-size-22);
2357
- font-weight: 600;
2358
2328
  font-weight: var(--font-weight-semi-bold);
2359
2329
  letter-spacing: -0.018em;
2360
2330
  line-height: 125%;
@@ -2382,7 +2352,6 @@ select[multiple].input-group-lg > .input-group-btn .btn {
2382
2352
  .input-group-lg > .form-control + ol:not(.list-unstyled),
2383
2353
  .input-group-lg > .input-group-addon + ol:not(.list-unstyled),
2384
2354
  .input-group-lg > .input-group-btn .btn + ol:not(.list-unstyled) {
2385
- margin-top: 8px;
2386
2355
  margin-top: var(--size-8);
2387
2356
  }
2388
2357
  .input-group-sm > .form-control,
@@ -2392,11 +2361,9 @@ select[multiple].input-group-lg > .input-group-btn .btn {
2392
2361
  border-radius: 3px;
2393
2362
  font-size: 14px;
2394
2363
  line-height: 24px;
2395
- font-size: 0.875rem;
2396
2364
  font-size: var(--font-size-14);
2397
2365
  line-height: 155%;
2398
2366
  letter-spacing: -0.006em;
2399
- font-weight: 400;
2400
2367
  font-weight: var(--font-weight-regular);
2401
2368
  }
2402
2369
  select.input-group-sm > .form-control,
@@ -2411,7 +2378,6 @@ select[multiple].input-group-sm > .input-group-addon {
2411
2378
  }
2412
2379
  .input-group-sm > .form-control .icon,
2413
2380
  .input-group-sm > .input-group-addon .icon {
2414
- font-size: 1.25rem;
2415
2381
  font-size: var(--font-size-20);
2416
2382
  }
2417
2383
  .input-group-sm > .input-group-btn > .btn {
@@ -2433,16 +2399,14 @@ select[multiple].input-group-sm > .input-group-addon {
2433
2399
  }
2434
2400
  .input-group-addon {
2435
2401
  padding: var(--input-group-addon-padding);
2436
- font-size: 1rem;
2437
2402
  font-size: var(--font-size-16);
2438
- line-height: 1.5;
2439
2403
  line-height: var(--line-height-body);
2440
- color: #5d7079;
2404
+ color: #454745;
2441
2405
  color: var(--color-content-secondary);
2442
2406
  text-align: center;
2443
2407
  background-color: #ffffff;
2444
2408
  background-color: var(--color-background-screen);
2445
- border: 1px solid #c9cbce;
2409
+ border: 1px solid #868685;
2446
2410
  border: 1px solid var(--color-interactive-secondary);
2447
2411
  }
2448
2412
  .input-group-addon.input-sm {
@@ -2583,16 +2547,12 @@ html:not([dir="rtl"]) .input-group > :first-child .btn-group {
2583
2547
  }
2584
2548
  [dir="rtl"] .np-theme-personal .input-group > :first-child .btn,
2585
2549
  [dir="rtl"] .np-theme-personal .input-group > :first-child .btn-group {
2586
- border-bottom-right-radius: 10px;
2587
2550
  border-bottom-right-radius: var(--radius-small);
2588
- border-top-right-radius: 10px;
2589
2551
  border-top-right-radius: var(--radius-small);
2590
2552
  }
2591
2553
  html:not([dir="rtl"]) .np-theme-personal .input-group > :first-child .btn,
2592
2554
  html:not([dir="rtl"]) .np-theme-personal .input-group > :first-child .btn-group {
2593
- border-bottom-left-radius: 10px;
2594
2555
  border-bottom-left-radius: var(--radius-small);
2595
- border-top-left-radius: 10px;
2596
2556
  border-top-left-radius: var(--radius-small);
2597
2557
  }
2598
2558
  [dir="rtl"] .input-group > :last-child .btn,
@@ -2607,16 +2567,12 @@ html:not([dir="rtl"]) .input-group > :last-child .btn-group {
2607
2567
  }
2608
2568
  [dir="rtl"] .np-theme-personal .input-group > :last-child .btn,
2609
2569
  [dir="rtl"] .np-theme-personal .input-group > :last-child .btn-group {
2610
- border-bottom-right-radius: 10px;
2611
2570
  border-bottom-right-radius: var(--radius-small);
2612
- border-top-right-radius: 10px;
2613
2571
  border-top-right-radius: var(--radius-small);
2614
2572
  }
2615
2573
  html:not([dir="rtl"]) .np-theme-personal .input-group > :last-child .btn,
2616
2574
  html:not([dir="rtl"]) .np-theme-personal .input-group > :last-child .btn-group {
2617
- border-bottom-left-radius: 10px;
2618
2575
  border-bottom-left-radius: var(--radius-small);
2619
- border-top-left-radius: 10px;
2620
2576
  border-top-left-radius: var(--radius-small);
2621
2577
  }
2622
2578
  .input-group-btn {
@@ -2654,43 +2610,41 @@ html:not([dir="rtl"]) .np-theme-personal .input-group > :last-child .btn-group {
2654
2610
  .input-group:hover:not(.disabled):not(:disabled) .input-group-addon,
2655
2611
  .input-group:hover:not(.disabled):not(:disabled) .btn-input,
2656
2612
  .input-group:hover:not(.disabled):not(:disabled) .bootstrap-select .btn-default {
2657
- border-color: #b5b7ba;
2613
+ border-color: #6c6c6b;
2658
2614
  border-color: var(--color-interactive-secondary-hover);
2659
2615
  }
2660
2616
  .form-control:hover:not(.disabled):not(:disabled) {
2661
- border-color: #b5b7ba;
2617
+ border-color: #6c6c6b;
2662
2618
  border-color: var(--color-interactive-secondary-hover);
2663
2619
  }
2664
2620
  .input-group:focus-within:not(.disabled):not(:disabled) .form-control,
2665
2621
  .input-group:focus-within:not(.disabled):not(:disabled) .input-group-addon,
2666
2622
  .input-group:focus-within:not(.disabled):not(:disabled) .btn-input,
2667
2623
  .input-group:focus-within:not(.disabled):not(:disabled) .bootstrap-select .btn-default {
2668
- border-color: #00a2dd;
2624
+ border-color: #9fe870;
2669
2625
  border-color: var(--color-interactive-accent);
2670
2626
  }
2671
2627
  .np-theme-personal .input-group:focus-within:not(.disabled):not(:disabled) .form-control,
2672
2628
  .np-theme-personal .input-group:focus-within:not(.disabled):not(:disabled) .input-group-addon,
2673
2629
  .np-theme-personal .input-group:focus-within:not(.disabled):not(:disabled) .btn-input,
2674
2630
  .np-theme-personal .input-group:focus-within:not(.disabled):not(:disabled) .bootstrap-select .btn-default {
2675
- border-color: #c9cbce;
2631
+ border-color: #868685;
2676
2632
  border-color: var(--color-interactive-secondary);
2677
2633
  }
2678
2634
  .form-control:focus-within:not(.disabled):not(:disabled) {
2679
- border-color: #00a2dd;
2635
+ border-color: #9fe870;
2680
2636
  border-color: var(--color-interactive-accent);
2681
2637
  }
2682
2638
  .np-theme-personal .form-control:focus-within:not(.disabled):not(:disabled) {
2683
- border-color: #c9cbce;
2639
+ border-color: #868685;
2684
2640
  border-color: var(--color-interactive-secondary);
2685
2641
  }
2686
2642
  .has-error .input-group .form-control,
2687
2643
  .has-error .input-group .input-group-addon {
2688
- border-color: #e74848;
2689
2644
  border-color: var(--color-interactive-negative);
2690
2645
  }
2691
2646
  .has-error .input-group .form-control:hover,
2692
2647
  .has-error .input-group .input-group-addon:hover {
2693
- border-color: #d03238;
2694
2648
  border-color: var(--color-interactive-negative-hover);
2695
2649
  }
2696
2650
  .dropdown-menu .input-group-addon {