@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
package/dist/css/buttons.css CHANGED
@@ -18,12 +18,9 @@
18
18
  border: 1px solid transparent;
19
19
  white-space: nowrap;
20
20
  padding-bottom: 10px;
21
- font-weight: 600;
22
21
  font-weight: var(--font-weight-semi-bold);
23
22
  padding: var(--btn-padding);
24
- font-size: 1rem;
25
23
  font-size: var(--font-size-16);
26
- line-height: 1.5rem;
27
24
  line-height: var(--line-height-24);
28
25
  border-radius: var(--btn-radius-base);
29
26
  min-height: var(--btn-height);
@@ -32,9 +29,7 @@
32
29
  user-select: none;
33
30
  }
34
31
  .btn .dropdown-menu > li > a {
35
- font-size: 1rem;
36
32
  font-size: var(--font-size-16);
37
- line-height: 1.5rem;
38
33
  line-height: var(--line-height-24);
39
34
  }
40
35
  .np-theme-personal .btn {
@@ -43,6 +38,7 @@
43
38
  }
44
39
  .np-theme-personal .btn:not(.disabled):not(:disabled):not(.np-dropdown-toggle):focus-visible.btn-negative,
45
40
  .np-theme-personal .btn:not(.disabled):not(:disabled):not(.np-dropdown-toggle).focus.btn-negative {
41
+ outline-color: #a8200d;
46
42
  outline-color: var(--color-sentiment-negative);
47
43
  }
48
44
  .np-theme-personal .critical-comms--cta .btn:not(.disabled):not(:disabled):not(.np-dropdown-toggle):focus-visible.btn-negative,
@@ -54,10 +50,11 @@
54
50
  }
55
51
  .np-theme-personal .btn.btn-negative:not(.disabled):not(:disabled):not(.np-dropdown-toggle):focus,
56
52
  .np-theme-personal .btn.btn-negative:not(.disabled):not(:disabled):not(.np-dropdown-toggle).focus {
53
+ outline-color: #a8200d;
57
54
  outline-color: var(--color-sentiment-negative);
58
55
  }
59
56
  .btn:not(.disabled):not(:disabled):hover {
60
- color: #008fc9;
57
+ color: #80e142;
61
58
  color: var(--color-interactive-accent-hover);
62
59
  -webkit-text-decoration: none;
63
60
  text-decoration: none;
@@ -74,36 +71,35 @@ fieldset[disabled] a.btn {
74
71
  pointer-events: none;
75
72
  }
76
73
  .btn-default {
77
- color: #0097c7;
78
74
  color: var(--color-content-accent);
79
75
  background-color: transparent;
80
- border-color: #00a2dd;
76
+ border-color: #9fe870;
81
77
  border-color: var(--color-interactive-accent);
82
78
  transition: color, background-color 0.15s ease-in-out;
83
79
  }
84
80
  .btn-default:not(.disabled):not(:disabled):hover {
85
81
  color: #FFF;
86
- background-color: #008fc9;
82
+ background-color: #80e142;
87
83
  background-color: var(--color-interactive-accent-hover);
88
- border-color: #008fc9;
84
+ border-color: #80e142;
89
85
  border-color: var(--color-interactive-accent-hover);
90
86
  }
91
87
  .btn-default:not(.disabled):not(:disabled):active,
92
88
  .btn-default:not(.disabled):not(:disabled).active,
93
89
  .open > .dropdown-toggle.btn-default {
94
90
  color: #FFF;
95
- background-color: #0081ba;
91
+ background-color: #65cf21;
96
92
  background-color: var(--color-interactive-accent-active);
97
- border-color: #0081ba;
93
+ border-color: #65cf21;
98
94
  border-color: var(--color-interactive-accent-active);
99
95
  }
100
96
  .btn-default:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
101
97
  .btn-default:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
102
98
  .open > .dropdown-toggle.btn-default:not(.disabled):not(:disabled):hover {
103
99
  color: #FFF;
104
- background-color: #0081ba;
100
+ background-color: #65cf21;
105
101
  background-color: var(--color-interactive-accent-active);
106
- border-color: #0081ba;
102
+ border-color: #65cf21;
107
103
  border-color: var(--color-interactive-accent-active);
108
104
  }
109
105
  .btn-default:not(.disabled):not(:disabled).active,
@@ -112,40 +108,43 @@ fieldset[disabled] a.btn {
112
108
  }
113
109
  .btn-default .badge {
114
110
  color: transparent;
115
- background-color: #0097c7;
116
111
  background-color: var(--color-content-accent);
117
112
  }
118
113
  .np-theme-personal .btn-default {
114
+ color: #163300;
119
115
  color: var(--color-interactive-control);
120
- background-color: #00a2dd;
116
+ background-color: #9fe870;
121
117
  background-color: var(--color-interactive-accent);
122
- border-color: #00a2dd;
118
+ border-color: #9fe870;
123
119
  border-color: var(--color-interactive-accent);
124
120
  transition: color, background-color 0.15s ease-in-out;
125
121
  }
126
122
  .np-theme-personal .btn-default:not(.disabled):not(:disabled):hover {
123
+ color: #163300;
127
124
  color: var(--color-interactive-control);
128
- background-color: #008fc9;
125
+ background-color: #80e142;
129
126
  background-color: var(--color-interactive-accent-hover);
130
- border-color: #008fc9;
127
+ border-color: #80e142;
131
128
  border-color: var(--color-interactive-accent-hover);
132
129
  }
133
130
  .np-theme-personal .btn-default:not(.disabled):not(:disabled):active,
134
131
  .np-theme-personal .btn-default:not(.disabled):not(:disabled).active,
135
132
  .open > .dropdown-toggle.np-theme-personal .btn-default {
133
+ color: #163300;
136
134
  color: var(--color-interactive-control);
137
- background-color: #0081ba;
135
+ background-color: #65cf21;
138
136
  background-color: var(--color-interactive-accent-active);
139
- border-color: #0081ba;
137
+ border-color: #65cf21;
140
138
  border-color: var(--color-interactive-accent-active);
141
139
  }
142
140
  .np-theme-personal .btn-default:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
143
141
  .np-theme-personal .btn-default:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
144
142
  .open > .dropdown-toggle.np-theme-personal .btn-default:not(.disabled):not(:disabled):hover {
143
+ color: #163300;
145
144
  color: var(--color-interactive-control);
146
- background-color: #0081ba;
145
+ background-color: #65cf21;
147
146
  background-color: var(--color-interactive-accent-active);
148
- border-color: #0081ba;
147
+ border-color: #65cf21;
149
148
  border-color: var(--color-interactive-accent-active);
150
149
  }
151
150
  .np-theme-personal .btn-default:not(.disabled):not(:disabled).active,
@@ -153,39 +152,45 @@ fieldset[disabled] a.btn {
153
152
  background-image: none;
154
153
  }
155
154
  .np-theme-personal .btn-default .badge {
156
- color: #00a2dd;
155
+ color: #9fe870;
157
156
  color: var(--color-interactive-accent);
157
+ background-color: #163300;
158
158
  background-color: var(--color-interactive-control);
159
159
  }
160
160
  .np-theme-personal .btn-default.btn-priority-2 {
161
+ color: #163300;
161
162
  color: var(--color-interactive-primary);
162
163
  background-color: transparent;
164
+ border-color: #163300;
163
165
  border-color: var(--color-interactive-primary);
164
166
  transition: color, background-color 0.15s ease-in-out;
165
167
  }
166
168
  .np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled):hover {
169
+ color: #163300;
167
170
  color: var(--color-interactive-control);
168
- background-color: #008fc9;
171
+ background-color: #80e142;
169
172
  background-color: var(--color-interactive-accent-hover);
170
- border-color: #008fc9;
173
+ border-color: #80e142;
171
174
  border-color: var(--color-interactive-accent-hover);
172
175
  }
173
176
  .np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled):active,
174
177
  .np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled).active,
175
178
  .open > .dropdown-toggle.np-theme-personal .btn-default.btn-priority-2 {
179
+ color: #163300;
176
180
  color: var(--color-interactive-control);
177
- background-color: #0081ba;
181
+ background-color: #65cf21;
178
182
  background-color: var(--color-interactive-accent-active);
179
- border-color: #0081ba;
183
+ border-color: #65cf21;
180
184
  border-color: var(--color-interactive-accent-active);
181
185
  }
182
186
  .np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
183
187
  .np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
184
188
  .open > .dropdown-toggle.np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled):hover {
189
+ color: #163300;
185
190
  color: var(--color-interactive-control);
186
- background-color: #0081ba;
191
+ background-color: #65cf21;
187
192
  background-color: var(--color-interactive-accent-active);
188
- border-color: #0081ba;
193
+ border-color: #65cf21;
189
194
  border-color: var(--color-interactive-accent-active);
190
195
  }
191
196
  .np-theme-personal .btn-default.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -194,23 +199,24 @@ fieldset[disabled] a.btn {
194
199
  }
195
200
  .np-theme-personal .btn-default.btn-priority-2 .badge {
196
201
  color: transparent;
202
+ background-color: #163300;
197
203
  background-color: var(--color-interactive-primary);
198
204
  }
199
205
  .btn-accent,
200
206
  .btn-primary {
201
207
  color: #fff;
202
- background-color: #00a2dd;
208
+ background-color: #9fe870;
203
209
  background-color: var(--color-interactive-accent);
204
- border-color: #00a2dd;
210
+ border-color: #9fe870;
205
211
  border-color: var(--color-interactive-accent);
206
212
  transition: color, background-color 0.15s ease-in-out;
207
213
  }
208
214
  .btn-accent:not(.disabled):not(:disabled):hover,
209
215
  .btn-primary:not(.disabled):not(:disabled):hover {
210
216
  color: #fff;
211
- background-color: #008fc9;
217
+ background-color: #80e142;
212
218
  background-color: var(--color-interactive-accent-hover);
213
- border-color: #008fc9;
219
+ border-color: #80e142;
214
220
  border-color: var(--color-interactive-accent-hover);
215
221
  }
216
222
  .btn-accent:not(.disabled):not(:disabled):active,
@@ -220,9 +226,9 @@ fieldset[disabled] a.btn {
220
226
  .open > .dropdown-toggle.btn-accent,
221
227
  .open > .dropdown-toggle.btn-primary {
222
228
  color: #fff;
223
- background-color: #0081ba;
229
+ background-color: #65cf21;
224
230
  background-color: var(--color-interactive-accent-active);
225
- border-color: #0081ba;
231
+ border-color: #65cf21;
226
232
  border-color: var(--color-interactive-accent-active);
227
233
  }
228
234
  .btn-accent:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -232,9 +238,9 @@ fieldset[disabled] a.btn {
232
238
  .open > .dropdown-toggle.btn-accent:not(.disabled):not(:disabled):hover,
233
239
  .open > .dropdown-toggle.btn-primary:not(.disabled):not(:disabled):hover {
234
240
  color: #fff;
235
- background-color: #0081ba;
241
+ background-color: #65cf21;
236
242
  background-color: var(--color-interactive-accent-active);
237
- border-color: #0081ba;
243
+ border-color: #65cf21;
238
244
  border-color: var(--color-interactive-accent-active);
239
245
  }
240
246
  .btn-accent:not(.disabled):not(:disabled).active,
@@ -245,25 +251,25 @@ fieldset[disabled] a.btn {
245
251
  }
246
252
  .btn-accent .badge,
247
253
  .btn-primary .badge {
248
- color: #00a2dd;
254
+ color: #9fe870;
249
255
  color: var(--color-interactive-accent);
250
256
  background-color: #fff;
251
257
  }
252
258
  .btn-accent.btn-priority-2,
253
259
  .btn-primary.btn-priority-2 {
254
- color: #00a2dd;
260
+ color: #9fe870;
255
261
  color: var(--color-interactive-accent);
256
262
  background-color: transparent;
257
- border-color: #00a2dd;
263
+ border-color: #9fe870;
258
264
  border-color: var(--color-interactive-accent);
259
265
  transition: color, background-color 0.15s ease-in-out;
260
266
  }
261
267
  .btn-accent.btn-priority-2:not(.disabled):not(:disabled):hover,
262
268
  .btn-primary.btn-priority-2:not(.disabled):not(:disabled):hover {
263
269
  color: #fff;
264
- background-color: #008fc9;
270
+ background-color: #80e142;
265
271
  background-color: var(--color-interactive-accent-hover);
266
- border-color: #008fc9;
272
+ border-color: #80e142;
267
273
  border-color: var(--color-interactive-accent-hover);
268
274
  }
269
275
  .btn-accent.btn-priority-2:not(.disabled):not(:disabled):active,
@@ -273,9 +279,9 @@ fieldset[disabled] a.btn {
273
279
  .open > .dropdown-toggle.btn-accent.btn-priority-2,
274
280
  .open > .dropdown-toggle.btn-primary.btn-priority-2 {
275
281
  color: #fff;
276
- background-color: #0081ba;
282
+ background-color: #65cf21;
277
283
  background-color: var(--color-interactive-accent-active);
278
- border-color: #0081ba;
284
+ border-color: #65cf21;
279
285
  border-color: var(--color-interactive-accent-active);
280
286
  }
281
287
  .btn-accent.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -285,9 +291,9 @@ fieldset[disabled] a.btn {
285
291
  .open > .dropdown-toggle.btn-accent.btn-priority-2:not(.disabled):not(:disabled):hover,
286
292
  .open > .dropdown-toggle.btn-primary.btn-priority-2:not(.disabled):not(:disabled):hover {
287
293
  color: #fff;
288
- background-color: #0081ba;
294
+ background-color: #65cf21;
289
295
  background-color: var(--color-interactive-accent-active);
290
- border-color: #0081ba;
296
+ border-color: #65cf21;
291
297
  border-color: var(--color-interactive-accent-active);
292
298
  }
293
299
  .btn-accent.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -299,24 +305,26 @@ fieldset[disabled] a.btn {
299
305
  .btn-accent.btn-priority-2 .badge,
300
306
  .btn-primary.btn-priority-2 .badge {
301
307
  color: transparent;
302
- background-color: #00a2dd;
308
+ background-color: #9fe870;
303
309
  background-color: var(--color-interactive-accent);
304
310
  }
305
311
  .np-theme-personal .btn-accent,
306
312
  .np-theme-personal .btn-primary {
313
+ color: #163300;
307
314
  color: var(--color-interactive-control);
308
- background-color: #00a2dd;
315
+ background-color: #9fe870;
309
316
  background-color: var(--color-interactive-accent);
310
- border-color: #00a2dd;
317
+ border-color: #9fe870;
311
318
  border-color: var(--color-interactive-accent);
312
319
  transition: color, background-color 0.15s ease-in-out;
313
320
  }
314
321
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled):hover,
315
322
  .np-theme-personal .btn-primary:not(.disabled):not(:disabled):hover {
323
+ color: #163300;
316
324
  color: var(--color-interactive-control);
317
- background-color: #008fc9;
325
+ background-color: #80e142;
318
326
  background-color: var(--color-interactive-accent-hover);
319
- border-color: #008fc9;
327
+ border-color: #80e142;
320
328
  border-color: var(--color-interactive-accent-hover);
321
329
  }
322
330
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled):active,
@@ -325,10 +333,11 @@ fieldset[disabled] a.btn {
325
333
  .np-theme-personal .btn-primary:not(.disabled):not(:disabled).active,
326
334
  .open > .dropdown-toggle.np-theme-personal .btn-accent,
327
335
  .open > .dropdown-toggle.np-theme-personal .btn-primary {
336
+ color: #163300;
328
337
  color: var(--color-interactive-control);
329
- background-color: #0081ba;
338
+ background-color: #65cf21;
330
339
  background-color: var(--color-interactive-accent-active);
331
- border-color: #0081ba;
340
+ border-color: #65cf21;
332
341
  border-color: var(--color-interactive-accent-active);
333
342
  }
334
343
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -337,10 +346,11 @@ fieldset[disabled] a.btn {
337
346
  .np-theme-personal .btn-primary:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
338
347
  .open > .dropdown-toggle.np-theme-personal .btn-accent:not(.disabled):not(:disabled):hover,
339
348
  .open > .dropdown-toggle.np-theme-personal .btn-primary:not(.disabled):not(:disabled):hover {
349
+ color: #163300;
340
350
  color: var(--color-interactive-control);
341
- background-color: #0081ba;
351
+ background-color: #65cf21;
342
352
  background-color: var(--color-interactive-accent-active);
343
- border-color: #0081ba;
353
+ border-color: #65cf21;
344
354
  border-color: var(--color-interactive-accent-active);
345
355
  }
346
356
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled).active,
@@ -351,23 +361,27 @@ fieldset[disabled] a.btn {
351
361
  }
352
362
  .np-theme-personal .btn-accent .badge,
353
363
  .np-theme-personal .btn-primary .badge {
354
- color: #00a2dd;
364
+ color: #9fe870;
355
365
  color: var(--color-interactive-accent);
366
+ background-color: #163300;
356
367
  background-color: var(--color-interactive-control);
357
368
  }
358
369
  .np-theme-personal .btn-accent.btn-priority-2,
359
370
  .np-theme-personal .btn-primary.btn-priority-2 {
371
+ color: #163300;
360
372
  color: var(--color-interactive-primary);
361
373
  background-color: transparent;
374
+ border-color: #163300;
362
375
  border-color: var(--color-interactive-primary);
363
376
  transition: color, background-color 0.15s ease-in-out;
364
377
  }
365
378
  .np-theme-personal .btn-accent.btn-priority-2:not(.disabled):not(:disabled):hover,
366
379
  .np-theme-personal .btn-primary.btn-priority-2:not(.disabled):not(:disabled):hover {
380
+ color: #163300;
367
381
  color: var(--color-interactive-control);
368
- background-color: #008fc9;
382
+ background-color: #80e142;
369
383
  background-color: var(--color-interactive-accent-hover);
370
- border-color: #008fc9;
384
+ border-color: #80e142;
371
385
  border-color: var(--color-interactive-accent-hover);
372
386
  }
373
387
  .np-theme-personal .btn-accent.btn-priority-2:not(.disabled):not(:disabled):active,
@@ -376,10 +390,11 @@ fieldset[disabled] a.btn {
376
390
  .np-theme-personal .btn-primary.btn-priority-2:not(.disabled):not(:disabled).active,
377
391
  .open > .dropdown-toggle.np-theme-personal .btn-accent.btn-priority-2,
378
392
  .open > .dropdown-toggle.np-theme-personal .btn-primary.btn-priority-2 {
393
+ color: #163300;
379
394
  color: var(--color-interactive-control);
380
- background-color: #0081ba;
395
+ background-color: #65cf21;
381
396
  background-color: var(--color-interactive-accent-active);
382
- border-color: #0081ba;
397
+ border-color: #65cf21;
383
398
  border-color: var(--color-interactive-accent-active);
384
399
  }
385
400
  .np-theme-personal .btn-accent.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -388,10 +403,11 @@ fieldset[disabled] a.btn {
388
403
  .np-theme-personal .btn-primary.btn-priority-2:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
389
404
  .open > .dropdown-toggle.np-theme-personal .btn-accent.btn-priority-2:not(.disabled):not(:disabled):hover,
390
405
  .open > .dropdown-toggle.np-theme-personal .btn-primary.btn-priority-2:not(.disabled):not(:disabled):hover {
406
+ color: #163300;
391
407
  color: var(--color-interactive-control);
392
- background-color: #0081ba;
408
+ background-color: #65cf21;
393
409
  background-color: var(--color-interactive-accent-active);
394
- border-color: #0081ba;
410
+ border-color: #65cf21;
395
411
  border-color: var(--color-interactive-accent-active);
396
412
  }
397
413
  .np-theme-personal .btn-accent.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -403,11 +419,11 @@ fieldset[disabled] a.btn {
403
419
  .np-theme-personal .btn-accent.btn-priority-2 .badge,
404
420
  .np-theme-personal .btn-primary.btn-priority-2 .badge {
405
421
  color: transparent;
422
+ background-color: #163300;
406
423
  background-color: var(--color-interactive-primary);
407
424
  }
408
425
  .btn-link,
409
426
  .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
410
- color: #0097c7;
411
427
  color: var(--color-content-accent);
412
428
  -webkit-text-decoration: underline;
413
429
  text-decoration: underline;
@@ -429,7 +445,6 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
429
445
  .btn-accent:not(.disabled):not(:disabled).btn-priority-3:not(.disabled):not(:disabled):hover,
430
446
  .btn-link:not(.disabled):not(:disabled):focus-visible,
431
447
  .btn-accent:not(.disabled):not(:disabled).btn-priority-3:not(.disabled):not(:disabled):focus-visible {
432
- color: #0084b3;
433
448
  color: var(--color-content-accent-hover);
434
449
  -webkit-text-decoration: underline;
435
450
  text-decoration: underline;
@@ -438,11 +453,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
438
453
  }
439
454
  .btn-link:not(.disabled):not(:disabled):active,
440
455
  .btn-accent:not(.disabled):not(:disabled).btn-priority-3:not(.disabled):not(:disabled):active {
441
- color: #0077a5;
442
456
  color: var(--color-content-accent-active);
443
457
  }
444
458
  .np-theme-personal .btn-link,
445
459
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
460
+ color: #163300;
446
461
  color: var(--color-interactive-primary);
447
462
  border-color: transparent;
448
463
  -webkit-text-decoration: underline;
@@ -453,19 +468,21 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
453
468
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled).btn-priority-3:not(.disabled):not(:disabled):hover,
454
469
  .np-theme-personal .btn-link:not(.disabled):not(:disabled):focus-visible,
455
470
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled).btn-priority-3:not(.disabled):not(:disabled):focus-visible {
471
+ color: #0d1f00;
456
472
  color: var(--color-interactive-primary-hover);
457
473
  border-color: transparent;
458
474
  }
459
475
  .np-theme-personal .btn-link:not(.disabled):not(:disabled):active,
460
476
  .np-theme-personal .btn-accent:not(.disabled):not(:disabled).btn-priority-3:not(.disabled):not(:disabled):active {
477
+ color: #0e0f0c;
461
478
  color: var(--color-interactive-primary-active);
479
+ background-color: rgba(22,51,0,0.12941) !important;
462
480
  background-color: var(--color-background-screen-active) !important;
463
481
  }
464
482
  .btn-accent.disabled.btn-priority-3,
465
483
  .btn-accent.btn-priority-3:disabled {
466
484
  background: transparent;
467
485
  border-color: transparent;
468
- color: #0097c7;
469
486
  color: var(--color-content-accent);
470
487
  -webkit-text-decoration: underline;
471
488
  text-decoration: underline;
@@ -479,18 +496,14 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
479
496
  .btn-positive,
480
497
  .btn-success {
481
498
  color: #fff;
482
- background-color: #2ead4b;
483
499
  background-color: var(--color-interactive-positive);
484
- border-color: #2ead4b;
485
500
  border-color: var(--color-interactive-positive);
486
501
  transition: color, background-color 0.15s ease-in-out;
487
502
  }
488
503
  .btn-positive:not(.disabled):not(:disabled):hover,
489
504
  .btn-success:not(.disabled):not(:disabled):hover {
490
505
  color: #fff;
491
- background-color: #069939;
492
506
  background-color: var(--color-interactive-positive-hover);
493
- border-color: #069939;
494
507
  border-color: var(--color-interactive-positive-hover);
495
508
  }
496
509
  .btn-positive:not(.disabled):not(:disabled):active,
@@ -500,9 +513,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
500
513
  .open > .dropdown-toggle.btn-positive,
501
514
  .open > .dropdown-toggle.btn-success {
502
515
  color: #fff;
503
- background-color: #008b2b;
504
516
  background-color: var(--color-interactive-positive-active);
505
- border-color: #008b2b;
506
517
  border-color: var(--color-interactive-positive-active);
507
518
  }
508
519
  .btn-positive:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -512,9 +523,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
512
523
  .open > .dropdown-toggle.btn-positive:not(.disabled):not(:disabled):hover,
513
524
  .open > .dropdown-toggle.btn-success:not(.disabled):not(:disabled):hover {
514
525
  color: #fff;
515
- background-color: #008b2b;
516
526
  background-color: var(--color-interactive-positive-active);
517
- border-color: #008b2b;
518
527
  border-color: var(--color-interactive-positive-active);
519
528
  }
520
529
  .btn-positive:not(.disabled):not(:disabled).active,
@@ -525,25 +534,20 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
525
534
  }
526
535
  .btn-positive .badge,
527
536
  .btn-success .badge {
528
- color: #2ead4b;
529
537
  color: var(--color-interactive-positive);
530
538
  background-color: #fff;
531
539
  }
532
540
  .btn-positive.btn-priority-2,
533
541
  .btn-success.btn-priority-2 {
534
- color: #2ead4b;
535
542
  color: var(--color-interactive-positive);
536
543
  background-color: transparent;
537
- border-color: #2ead4b;
538
544
  border-color: var(--color-interactive-positive);
539
545
  transition: color, background-color 0.15s ease-in-out;
540
546
  }
541
547
  .btn-positive.btn-priority-2:not(.disabled):not(:disabled):hover,
542
548
  .btn-success.btn-priority-2:not(.disabled):not(:disabled):hover {
543
549
  color: #fff;
544
- background-color: #069939;
545
550
  background-color: var(--color-interactive-positive-hover);
546
- border-color: #069939;
547
551
  border-color: var(--color-interactive-positive-hover);
548
552
  }
549
553
  .btn-positive.btn-priority-2:not(.disabled):not(:disabled):active,
@@ -553,9 +557,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
553
557
  .open > .dropdown-toggle.btn-positive.btn-priority-2,
554
558
  .open > .dropdown-toggle.btn-success.btn-priority-2 {
555
559
  color: #fff;
556
- background-color: #008b2b;
557
560
  background-color: var(--color-interactive-positive-active);
558
- border-color: #008b2b;
559
561
  border-color: var(--color-interactive-positive-active);
560
562
  }
561
563
  .btn-positive.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -565,9 +567,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
565
567
  .open > .dropdown-toggle.btn-positive.btn-priority-2:not(.disabled):not(:disabled):hover,
566
568
  .open > .dropdown-toggle.btn-success.btn-priority-2:not(.disabled):not(:disabled):hover {
567
569
  color: #fff;
568
- background-color: #008b2b;
569
570
  background-color: var(--color-interactive-positive-active);
570
- border-color: #008b2b;
571
571
  border-color: var(--color-interactive-positive-active);
572
572
  }
573
573
  .btn-positive.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -579,24 +579,25 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
579
579
  .btn-positive.btn-priority-2 .badge,
580
580
  .btn-success.btn-priority-2 .badge {
581
581
  color: transparent;
582
- background-color: #2ead4b;
583
582
  background-color: var(--color-interactive-positive);
584
583
  }
585
584
  .np-theme-personal .btn-positive,
586
585
  .np-theme-personal .btn-success {
586
+ color: #163300;
587
587
  color: var(--color-interactive-control);
588
- background-color: #00a2dd;
588
+ background-color: #9fe870;
589
589
  background-color: var(--color-interactive-accent);
590
- border-color: #00a2dd;
590
+ border-color: #9fe870;
591
591
  border-color: var(--color-interactive-accent);
592
592
  transition: color, background-color 0.15s ease-in-out;
593
593
  }
594
594
  .np-theme-personal .btn-positive:not(.disabled):not(:disabled):hover,
595
595
  .np-theme-personal .btn-success:not(.disabled):not(:disabled):hover {
596
+ color: #163300;
596
597
  color: var(--color-interactive-control);
597
- background-color: #008fc9;
598
+ background-color: #80e142;
598
599
  background-color: var(--color-interactive-accent-hover);
599
- border-color: #00a2dd;
600
+ border-color: #9fe870;
600
601
  border-color: var(--color-interactive-accent);
601
602
  }
602
603
  .np-theme-personal .btn-positive:not(.disabled):not(:disabled):active,
@@ -605,10 +606,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
605
606
  .np-theme-personal .btn-success:not(.disabled):not(:disabled).active,
606
607
  .open > .dropdown-toggle.np-theme-personal .btn-positive,
607
608
  .open > .dropdown-toggle.np-theme-personal .btn-success {
609
+ color: #163300;
608
610
  color: var(--color-interactive-control);
609
- background-color: #0081ba;
611
+ background-color: #65cf21;
610
612
  background-color: var(--color-interactive-accent-active);
611
- border-color: #00a2dd;
613
+ border-color: #9fe870;
612
614
  border-color: var(--color-interactive-accent);
613
615
  }
614
616
  .np-theme-personal .btn-positive:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -617,10 +619,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
617
619
  .np-theme-personal .btn-success:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
618
620
  .open > .dropdown-toggle.np-theme-personal .btn-positive:not(.disabled):not(:disabled):hover,
619
621
  .open > .dropdown-toggle.np-theme-personal .btn-success:not(.disabled):not(:disabled):hover {
622
+ color: #163300;
620
623
  color: var(--color-interactive-control);
621
- background-color: #0081ba;
624
+ background-color: #65cf21;
622
625
  background-color: var(--color-interactive-accent-active);
623
- border-color: #00a2dd;
626
+ border-color: #9fe870;
624
627
  border-color: var(--color-interactive-accent);
625
628
  }
626
629
  .np-theme-personal .btn-positive:not(.disabled):not(:disabled).active,
@@ -631,23 +634,27 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
631
634
  }
632
635
  .np-theme-personal .btn-positive .badge,
633
636
  .np-theme-personal .btn-success .badge {
634
- color: #00a2dd;
637
+ color: #9fe870;
635
638
  color: var(--color-interactive-accent);
639
+ background-color: #163300;
636
640
  background-color: var(--color-interactive-control);
637
641
  }
638
642
  .np-theme-personal .btn-positive.btn-priority-2,
639
643
  .np-theme-personal .btn-success.btn-priority-2 {
644
+ color: #163300;
640
645
  color: var(--color-interactive-primary);
641
646
  background-color: transparent;
647
+ border-color: #163300;
642
648
  border-color: var(--color-interactive-primary);
643
649
  transition: color, background-color 0.15s ease-in-out;
644
650
  }
645
651
  .np-theme-personal .btn-positive.btn-priority-2:not(.disabled):not(:disabled):hover,
646
652
  .np-theme-personal .btn-success.btn-priority-2:not(.disabled):not(:disabled):hover {
653
+ color: #163300;
647
654
  color: var(--color-interactive-control);
648
- background-color: #008fc9;
655
+ background-color: #80e142;
649
656
  background-color: var(--color-interactive-accent-hover);
650
- border-color: #008fc9;
657
+ border-color: #80e142;
651
658
  border-color: var(--color-interactive-accent-hover);
652
659
  }
653
660
  .np-theme-personal .btn-positive.btn-priority-2:not(.disabled):not(:disabled):active,
@@ -656,10 +663,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
656
663
  .np-theme-personal .btn-success.btn-priority-2:not(.disabled):not(:disabled).active,
657
664
  .open > .dropdown-toggle.np-theme-personal .btn-positive.btn-priority-2,
658
665
  .open > .dropdown-toggle.np-theme-personal .btn-success.btn-priority-2 {
666
+ color: #163300;
659
667
  color: var(--color-interactive-control);
660
- background-color: #0081ba;
668
+ background-color: #65cf21;
661
669
  background-color: var(--color-interactive-accent-active);
662
- border-color: #0081ba;
670
+ border-color: #65cf21;
663
671
  border-color: var(--color-interactive-accent-active);
664
672
  }
665
673
  .np-theme-personal .btn-positive.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -668,10 +676,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
668
676
  .np-theme-personal .btn-success.btn-priority-2:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
669
677
  .open > .dropdown-toggle.np-theme-personal .btn-positive.btn-priority-2:not(.disabled):not(:disabled):hover,
670
678
  .open > .dropdown-toggle.np-theme-personal .btn-success.btn-priority-2:not(.disabled):not(:disabled):hover {
679
+ color: #163300;
671
680
  color: var(--color-interactive-control);
672
- background-color: #0081ba;
681
+ background-color: #65cf21;
673
682
  background-color: var(--color-interactive-accent-active);
674
- border-color: #0081ba;
683
+ border-color: #65cf21;
675
684
  border-color: var(--color-interactive-accent-active);
676
685
  }
677
686
  .np-theme-personal .btn-positive.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -683,6 +692,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
683
692
  .np-theme-personal .btn-positive.btn-priority-2 .badge,
684
693
  .np-theme-personal .btn-success.btn-priority-2 .badge {
685
694
  color: transparent;
695
+ background-color: #163300;
686
696
  background-color: var(--color-interactive-primary);
687
697
  }
688
698
  .btn-info {
@@ -754,18 +764,14 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
754
764
  .btn-danger,
755
765
  .btn-negative {
756
766
  color: #fff;
757
- background-color: #e74848;
758
767
  background-color: var(--color-interactive-negative);
759
- border-color: #e74848;
760
768
  border-color: var(--color-interactive-negative);
761
769
  transition: color, background-color 0.15s ease-in-out;
762
770
  }
763
771
  .btn-danger:not(.disabled):not(:disabled):hover,
764
772
  .btn-negative:not(.disabled):not(:disabled):hover {
765
773
  color: #fff;
766
- background-color: #d03238;
767
774
  background-color: var(--color-interactive-negative-hover);
768
- border-color: #d03238;
769
775
  border-color: var(--color-interactive-negative-hover);
770
776
  }
771
777
  .btn-danger:not(.disabled):not(:disabled):active,
@@ -775,9 +781,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
775
781
  .open > .dropdown-toggle.btn-danger,
776
782
  .open > .dropdown-toggle.btn-negative {
777
783
  color: #fff;
778
- background-color: #bf1e2c;
779
784
  background-color: var(--color-interactive-negative-active);
780
- border-color: #bf1e2c;
781
785
  border-color: var(--color-interactive-negative-active);
782
786
  }
783
787
  .btn-danger:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -787,9 +791,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
787
791
  .open > .dropdown-toggle.btn-danger:not(.disabled):not(:disabled):hover,
788
792
  .open > .dropdown-toggle.btn-negative:not(.disabled):not(:disabled):hover {
789
793
  color: #fff;
790
- background-color: #bf1e2c;
791
794
  background-color: var(--color-interactive-negative-active);
792
- border-color: #bf1e2c;
793
795
  border-color: var(--color-interactive-negative-active);
794
796
  }
795
797
  .btn-danger:not(.disabled):not(:disabled).active,
@@ -800,25 +802,20 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
800
802
  }
801
803
  .btn-danger .badge,
802
804
  .btn-negative .badge {
803
- color: #e74848;
804
805
  color: var(--color-interactive-negative);
805
806
  background-color: #fff;
806
807
  }
807
808
  .btn-danger.btn-priority-2,
808
809
  .btn-negative.btn-priority-2 {
809
- color: #e74848;
810
810
  color: var(--color-interactive-negative);
811
811
  background-color: transparent;
812
- border-color: #e74848;
813
812
  border-color: var(--color-interactive-negative);
814
813
  transition: color, background-color 0.15s ease-in-out;
815
814
  }
816
815
  .btn-danger.btn-priority-2:not(.disabled):not(:disabled):hover,
817
816
  .btn-negative.btn-priority-2:not(.disabled):not(:disabled):hover {
818
817
  color: #fff;
819
- background-color: #d03238;
820
818
  background-color: var(--color-interactive-negative-hover);
821
- border-color: #d03238;
822
819
  border-color: var(--color-interactive-negative-hover);
823
820
  }
824
821
  .btn-danger.btn-priority-2:not(.disabled):not(:disabled):active,
@@ -828,9 +825,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
828
825
  .open > .dropdown-toggle.btn-danger.btn-priority-2,
829
826
  .open > .dropdown-toggle.btn-negative.btn-priority-2 {
830
827
  color: #fff;
831
- background-color: #bf1e2c;
832
828
  background-color: var(--color-interactive-negative-active);
833
- border-color: #bf1e2c;
834
829
  border-color: var(--color-interactive-negative-active);
835
830
  }
836
831
  .btn-danger.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -840,9 +835,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
840
835
  .open > .dropdown-toggle.btn-danger.btn-priority-2:not(.disabled):not(:disabled):hover,
841
836
  .open > .dropdown-toggle.btn-negative.btn-priority-2:not(.disabled):not(:disabled):hover {
842
837
  color: #fff;
843
- background-color: #bf1e2c;
844
838
  background-color: var(--color-interactive-negative-active);
845
- border-color: #bf1e2c;
846
839
  border-color: var(--color-interactive-negative-active);
847
840
  }
848
841
  .btn-danger.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -854,20 +847,23 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
854
847
  .btn-danger.btn-priority-2 .badge,
855
848
  .btn-negative.btn-priority-2 .badge {
856
849
  color: transparent;
857
- background-color: #e74848;
858
850
  background-color: var(--color-interactive-negative);
859
851
  }
860
852
  .np-theme-personal .btn-danger,
861
853
  .np-theme-personal .btn-negative {
862
854
  color: var(--color-contrast);
855
+ background-color: #a8200d;
863
856
  background-color: var(--color-sentiment-negative);
857
+ border-color: #a8200d;
864
858
  border-color: var(--color-sentiment-negative);
865
859
  transition: color, background-color 0.15s ease-in-out;
866
860
  }
867
861
  .np-theme-personal .btn-danger:not(.disabled):not(:disabled):hover,
868
862
  .np-theme-personal .btn-negative:not(.disabled):not(:disabled):hover {
869
863
  color: var(--color-contrast);
864
+ background-color: #8e1b0b;
870
865
  background-color: var(--color-sentiment-negative-hover);
866
+ border-color: #8e1b0b;
871
867
  border-color: var(--color-sentiment-negative-hover);
872
868
  }
873
869
  .np-theme-personal .btn-danger:not(.disabled):not(:disabled):active,
@@ -877,7 +873,9 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
877
873
  .open > .dropdown-toggle.np-theme-personal .btn-danger,
878
874
  .open > .dropdown-toggle.np-theme-personal .btn-negative {
879
875
  color: var(--color-contrast);
876
+ background-color: #761709;
880
877
  background-color: var(--color-sentiment-negative-active);
878
+ border-color: #761709;
881
879
  border-color: var(--color-sentiment-negative-active);
882
880
  }
883
881
  .np-theme-personal .btn-danger:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -887,7 +885,9 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
887
885
  .open > .dropdown-toggle.np-theme-personal .btn-danger:not(.disabled):not(:disabled):hover,
888
886
  .open > .dropdown-toggle.np-theme-personal .btn-negative:not(.disabled):not(:disabled):hover {
889
887
  color: var(--color-contrast);
888
+ background-color: #761709;
890
889
  background-color: var(--color-sentiment-negative-active);
890
+ border-color: #761709;
891
891
  border-color: var(--color-sentiment-negative-active);
892
892
  }
893
893
  .np-theme-personal .btn-danger:not(.disabled):not(:disabled).active,
@@ -898,20 +898,25 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
898
898
  }
899
899
  .np-theme-personal .btn-danger .badge,
900
900
  .np-theme-personal .btn-negative .badge {
901
+ color: #a8200d;
901
902
  color: var(--color-sentiment-negative);
902
903
  background-color: var(--color-contrast);
903
904
  }
904
905
  .np-theme-personal .btn-danger.btn-priority-2,
905
906
  .np-theme-personal .btn-negative.btn-priority-2 {
907
+ color: #a8200d;
906
908
  color: var(--color-sentiment-negative);
907
909
  background-color: transparent;
910
+ border-color: #a8200d;
908
911
  border-color: var(--color-sentiment-negative);
909
912
  transition: color, background-color 0.15s ease-in-out;
910
913
  }
911
914
  .np-theme-personal .btn-danger.btn-priority-2:not(.disabled):not(:disabled):hover,
912
915
  .np-theme-personal .btn-negative.btn-priority-2:not(.disabled):not(:disabled):hover {
913
916
  color: var(--color-contrast);
917
+ background-color: #8e1b0b;
914
918
  background-color: var(--color-sentiment-negative-hover);
919
+ border-color: #8e1b0b;
915
920
  border-color: var(--color-sentiment-negative-hover);
916
921
  }
917
922
  .np-theme-personal .btn-danger.btn-priority-2:not(.disabled):not(:disabled):active,
@@ -921,7 +926,9 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
921
926
  .open > .dropdown-toggle.np-theme-personal .btn-danger.btn-priority-2,
922
927
  .open > .dropdown-toggle.np-theme-personal .btn-negative.btn-priority-2 {
923
928
  color: var(--color-contrast);
929
+ background-color: #761709;
924
930
  background-color: var(--color-sentiment-negative-active);
931
+ border-color: #761709;
925
932
  border-color: var(--color-sentiment-negative-active);
926
933
  }
927
934
  .np-theme-personal .btn-danger.btn-priority-2:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -931,7 +938,9 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
931
938
  .open > .dropdown-toggle.np-theme-personal .btn-danger.btn-priority-2:not(.disabled):not(:disabled):hover,
932
939
  .open > .dropdown-toggle.np-theme-personal .btn-negative.btn-priority-2:not(.disabled):not(:disabled):hover {
933
940
  color: var(--color-contrast);
941
+ background-color: #761709;
934
942
  background-color: var(--color-sentiment-negative-active);
943
+ border-color: #761709;
935
944
  border-color: var(--color-sentiment-negative-active);
936
945
  }
937
946
  .np-theme-personal .btn-danger.btn-priority-2:not(.disabled):not(:disabled).active,
@@ -943,25 +952,26 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
943
952
  .np-theme-personal .btn-danger.btn-priority-2 .badge,
944
953
  .np-theme-personal .btn-negative.btn-priority-2 .badge {
945
954
  color: transparent;
955
+ background-color: #a8200d;
946
956
  background-color: var(--color-sentiment-negative);
947
957
  }
948
958
  .bootstrap-select .btn-default,
949
959
  .btn-input {
950
- color: #37517e;
960
+ color: #0e0f0c;
951
961
  color: var(--color-content-primary);
952
962
  background-color: #ffffff;
953
963
  background-color: var(--color-background-screen);
954
- border-color: #c9cbce;
964
+ border-color: #868685;
955
965
  border-color: var(--color-interactive-secondary);
956
966
  transition: color, background-color 0.15s ease-in-out;
957
967
  }
958
968
  .bootstrap-select .btn-default:not(.disabled):not(:disabled):hover,
959
969
  .btn-input:not(.disabled):not(:disabled):hover {
960
- color: #37517e;
970
+ color: #0e0f0c;
961
971
  color: var(--color-content-primary);
962
972
  background-color: #ffffff;
963
973
  background-color: var(--color-background-screen);
964
- border-color: #b5b7ba;
974
+ border-color: #6c6c6b;
965
975
  border-color: var(--color-interactive-secondary-hover);
966
976
  }
967
977
  .bootstrap-select .btn-default:not(.disabled):not(:disabled):active,
@@ -970,11 +980,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
970
980
  .btn-input:not(.disabled):not(:disabled).active,
971
981
  .open > .dropdown-toggle.bootstrap-select .btn-default,
972
982
  .open > .dropdown-toggle.btn-input {
973
- color: #37517e;
983
+ color: #0e0f0c;
974
984
  color: var(--color-content-primary);
975
985
  background-color: #ffffff;
976
986
  background-color: var(--color-background-screen);
977
- border-color: #a7a9ab;
987
+ border-color: #525251;
978
988
  border-color: var(--color-interactive-secondary-active);
979
989
  }
980
990
  .bootstrap-select .btn-default:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
@@ -983,11 +993,11 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
983
993
  .btn-input:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
984
994
  .open > .dropdown-toggle.bootstrap-select .btn-default:not(.disabled):not(:disabled):hover,
985
995
  .open > .dropdown-toggle.btn-input:not(.disabled):not(:disabled):hover {
986
- color: #37517e;
996
+ color: #0e0f0c;
987
997
  color: var(--color-content-primary);
988
998
  background-color: #ffffff;
989
999
  background-color: var(--color-background-screen);
990
- border-color: #a7a9ab;
1000
+ border-color: #525251;
991
1001
  border-color: var(--color-interactive-secondary-active);
992
1002
  }
993
1003
  .bootstrap-select .btn-default:not(.disabled):not(:disabled).active,
@@ -1000,7 +1010,7 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1000
1010
  .btn-input .badge {
1001
1011
  color: #ffffff;
1002
1012
  color: var(--color-background-screen);
1003
- background-color: #37517e;
1013
+ background-color: #0e0f0c;
1004
1014
  background-color: var(--color-content-primary);
1005
1015
  }
1006
1016
  .btn-image {
@@ -1018,11 +1028,9 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1018
1028
  background: #384347;
1019
1029
  }
1020
1030
  .btn-input .caret {
1021
- margin-left: 8px;
1022
1031
  margin-left: var(--size-8);
1023
1032
  }
1024
1033
  [dir="rtl"] .btn-input .caret {
1025
- margin-right: 8px;
1026
1034
  margin-right: var(--size-8);
1027
1035
  margin-left: 0;
1028
1036
  margin-left: initial;
@@ -1062,17 +1070,13 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1062
1070
  }
1063
1071
  .btn-lg {
1064
1072
  padding: var(--btn-lg-padding);
1065
- font-size: 1.125rem;
1066
1073
  font-size: var(--font-size-18);
1067
- line-height: 1.75rem;
1068
1074
  line-height: var(--line-height-28);
1069
1075
  border-radius: var(--btn-lg-radius-base);
1070
1076
  min-height: var(--btn-lg-height);
1071
1077
  }
1072
1078
  .btn-lg .dropdown-menu > li > a {
1073
- font-size: 1.125rem;
1074
1079
  font-size: var(--font-size-18);
1075
- line-height: 1.75rem;
1076
1080
  line-height: var(--line-height-28);
1077
1081
  }
1078
1082
  .np-theme-personal .btn-lg {
@@ -1085,18 +1089,14 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1085
1089
  .btn-sm,
1086
1090
  .navbar .btn {
1087
1091
  padding: var(--btn-sm-padding);
1088
- font-size: 0.875rem;
1089
1092
  font-size: var(--font-size-14);
1090
- line-height: 1.375rem;
1091
1093
  line-height: var(--line-height-22);
1092
1094
  border-radius: var(--btn-sm-radius-base);
1093
1095
  min-height: var(--btn-sm-height);
1094
1096
  }
1095
1097
  .btn-sm .dropdown-menu > li > a,
1096
1098
  .navbar .btn .dropdown-menu > li > a {
1097
- font-size: 0.875rem;
1098
1099
  font-size: var(--font-size-14);
1099
- line-height: 1.375rem;
1100
1100
  line-height: var(--line-height-22);
1101
1101
  }
1102
1102
  .np-theme-personal .btn-sm,
@@ -1106,17 +1106,13 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1106
1106
  }
1107
1107
  .btn-xs {
1108
1108
  padding: var(--btn-xs-padding);
1109
- font-size: 0.75rem;
1110
1109
  font-size: var(--font-size-12);
1111
- line-height: 1.25rem;
1112
1110
  line-height: var(--line-height-20);
1113
1111
  border-radius: var(--btn-sm-radius-base);
1114
1112
  min-height: 22px;
1115
1113
  }
1116
1114
  .btn-xs .dropdown-menu > li > a {
1117
- font-size: 0.75rem;
1118
1115
  font-size: var(--font-size-12);
1119
- line-height: 1.25rem;
1120
1116
  line-height: var(--line-height-20);
1121
1117
  }
1122
1118
  .np-theme-personal .btn-xs {
@@ -1124,7 +1120,6 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1124
1120
  line-height: 18px;
1125
1121
  }
1126
1122
  .np-theme-personal .btn-xs .btn-loader {
1127
- margin-left: calc(8px / 2) !important;
1128
1123
  margin-left: calc(var(--padding-x-small) / 2) !important;
1129
1124
  height: 18px;
1130
1125
  background-size: 12px 12px !important;
@@ -1132,17 +1127,13 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1132
1127
  @media (max-width: 767px) {
1133
1128
  .navbar-collapse .btn {
1134
1129
  padding: var(--btn-padding);
1135
- font-size: 1rem;
1136
1130
  font-size: var(--font-size-16);
1137
- line-height: 1.5rem;
1138
1131
  line-height: var(--line-height-24);
1139
1132
  border-radius: var(border-radius-base);
1140
1133
  min-height: var(--btn-height);
1141
1134
  }
1142
1135
  .navbar-collapse .btn .dropdown-menu > li > a {
1143
- font-size: 1rem;
1144
1136
  font-size: var(--font-size-16);
1145
- line-height: 1.5rem;
1146
1137
  line-height: var(--line-height-24);
1147
1138
  }
1148
1139
  .np-theme-personal .navbar-collapse .btn {
@@ -1156,7 +1147,6 @@ fieldset[disabled] .btn-accent:not(.disabled):not(:disabled).btn-priority-3 {
1156
1147
  width: 100%;
1157
1148
  }
1158
1149
  .btn-block + .btn-block {
1159
- margin-top: 8px;
1160
1150
  margin-top: var(--size-8);
1161
1151
  }
1162
1152
  input[type="submit"].btn-block,
@@ -1165,7 +1155,6 @@ input[type="button"].btn-block {
1165
1155
  width: 100%;
1166
1156
  }
1167
1157
  .btn-input {
1168
- font-weight: 400;
1169
1158
  font-weight: var(--font-weight-regular);
1170
1159
  padding-left: 16px;
1171
1160
  padding-right: 16px;
@@ -1181,14 +1170,14 @@ input[type="button"].btn-block {
1181
1170
  padding-right: initial;
1182
1171
  }
1183
1172
  .btn-input:not(.disabled):not(:disabled):hover {
1184
- border-color: #b5b7ba;
1173
+ border-color: #6c6c6b;
1185
1174
  border-color: var(--color-interactive-secondary-hover);
1186
1175
  }
1187
1176
  .btn-input:not(.disabled):not(:disabled).active,
1188
1177
  .btn-input:not(.disabled):not(:disabled):active,
1189
1178
  .btn-input:not(.disabled):not(:disabled).focus,
1190
1179
  .btn-input:not(.disabled):not(:disabled):focus-visible {
1191
- border-color: #0081ba;
1180
+ border-color: #65cf21;
1192
1181
  border-color: var(--color-interactive-accent-active);
1193
1182
  outline: 0 none !important;
1194
1183
  }
@@ -1196,11 +1185,10 @@ input[type="button"].btn-block {
1196
1185
  .np-theme-personal .btn-input:not(.disabled):not(:disabled):active,
1197
1186
  .np-theme-personal .btn-input:not(.disabled):not(:disabled).focus,
1198
1187
  .np-theme-personal .btn-input:not(.disabled):not(:disabled):focus-visible {
1199
- border-color: #a7a9ab;
1188
+ border-color: #525251;
1200
1189
  border-color: var(--color-interactive-secondary-active);
1201
1190
  }
1202
1191
  .btn-input .caret {
1203
- color: #0097c7;
1204
1192
  color: var(--color-content-accent);
1205
1193
  }
1206
1194
  .btn-input.btn-sm {
@@ -1218,62 +1206,12 @@ input[type="button"].btn-block {
1218
1206
  padding-right: initial;
1219
1207
  }
1220
1208
  .btn-input.btn-lg {
1221
- font-size: 1.25rem;
1222
1209
  font-size: var(--font-size-20);
1223
1210
  }
1224
1211
  .btn-input.btn-lg.btn-addon,
1225
1212
  .btn-input.btn-lg.btn-input-inverse {
1226
- font-weight: 600;
1227
1213
  font-weight: var(--font-weight-semi-bold);
1228
1214
  }
1229
- .btn-input-inverse {
1230
- --color-content-primary: #ffffff;
1231
- --color-content-accent: #00b9ff;
1232
- }
1233
- .btn-input-inverse,
1234
- .btn-addon {
1235
- color: #ffffff;
1236
- background-color: #2e4369;
1237
- border-color: #37517e;
1238
- transition: color, background-color 0.15s ease-in-out;
1239
- }
1240
- .btn-input-inverse:not(.disabled):not(:disabled):hover,
1241
- .btn-addon:not(.disabled):not(:disabled):hover {
1242
- color: #ffffff;
1243
- background-color: #2e4369;
1244
- border-color: #2e4369;
1245
- }
1246
- .btn-input-inverse:not(.disabled):not(:disabled):active,
1247
- .btn-addon:not(.disabled):not(:disabled):active,
1248
- .btn-input-inverse:not(.disabled):not(:disabled).active,
1249
- .btn-addon:not(.disabled):not(:disabled).active,
1250
- .open > .dropdown-toggle.btn-input-inverse,
1251
- .open > .dropdown-toggle.btn-addon {
1252
- color: #ffffff;
1253
- background-color: #2e4369;
1254
- border-color: #2e4369;
1255
- }
1256
- .btn-input-inverse:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
1257
- .btn-addon:not(.disabled):not(:disabled):active:not(.disabled):not(:disabled):hover,
1258
- .btn-input-inverse:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
1259
- .btn-addon:not(.disabled):not(:disabled).active:not(.disabled):not(:disabled):hover,
1260
- .open > .dropdown-toggle.btn-input-inverse:not(.disabled):not(:disabled):hover,
1261
- .open > .dropdown-toggle.btn-addon:not(.disabled):not(:disabled):hover {
1262
- color: #ffffff;
1263
- background-color: #2e4369;
1264
- border-color: #2e4369;
1265
- }
1266
- .btn-input-inverse:not(.disabled):not(:disabled).active,
1267
- .btn-addon:not(.disabled):not(:disabled).active,
1268
- .open > .dropdown-toggle.btn-input-inverse,
1269
- .open > .dropdown-toggle.btn-addon {
1270
- background-image: none;
1271
- }
1272
- .btn-input-inverse .badge,
1273
- .btn-addon .badge {
1274
- color: #2e4369;
1275
- background-color: #ffffff;
1276
- }
1277
1215
  .form-group-sm .bootstrap-select .btn-default {
1278
1216
  padding: 4px 12px;
1279
1217
  }
@@ -1281,11 +1219,11 @@ input[type="button"].btn-block {
1281
1219
  padding: 12px 16px;
1282
1220
  }
1283
1221
  .bootstrap-select.open > .dropdown-toggle.btn-default {
1284
- border-color: #00a2dd;
1222
+ border-color: #9fe870;
1285
1223
  border-color: var(--color-interactive-accent);
1286
1224
  background-color: #ffffff;
1287
1225
  background-color: var(--color-background-screen);
1288
- color: #37517e;
1226
+ color: #0e0f0c;
1289
1227
  color: var(--color-content-primary);
1290
1228
  }
1291
1229
  .btn-loader {
@@ -1299,7 +1237,6 @@ input[type="button"].btn-block {
1299
1237
  .np-theme-personal--dark .btn-loader .process-circle,
1300
1238
  .np-theme-personal--bright-green .btn-loader .process-circle,
1301
1239
  .np-theme-personal--forest-green .btn-loader .process-circle {
1302
- stroke: #e74848;
1303
1240
  stroke: var(--color-interactive-negative);
1304
1241
  }
1305
1242
  .btn-loading:not(.btn-block) {
@@ -1327,7 +1264,6 @@ input[type="button"].btn-block {
1327
1264
  background-size: 16px 16px;
1328
1265
  }
1329
1266
  .np-theme-personal .btn-sm .btn-loader {
1330
- margin-left: calc(16px / 2) !important;
1331
1267
  margin-left: calc(var(--padding-small) / 2) !important;
1332
1268
  }
1333
1269
  @keyframes rotating {
@@ -1346,13 +1282,10 @@ input[type="button"].btn-block {
1346
1282
  }
1347
1283
  .btn-input.btn .tw-icon {
1348
1284
  position: absolute;
1349
- right: 16px;
1350
1285
  right: var(--size-16);
1351
- top: 16px;
1352
1286
  top: var(--size-16);
1353
1287
  }
1354
1288
  [dir="rtl"] .btn-input.btn .tw-icon {
1355
- left: 16px;
1356
1289
  left: var(--size-16);
1357
1290
  right: auto;
1358
1291
  right: initial;
@@ -1362,13 +1295,10 @@ input[type="button"].btn-block {
1362
1295
  position: initial;
1363
1296
  }
1364
1297
  .btn-input.btn.btn-sm .tw-icon {
1365
- right: 8px;
1366
1298
  right: var(--size-8);
1367
- top: 8px;
1368
1299
  top: var(--size-8);
1369
1300
  }
1370
1301
  [dir="rtl"] .btn-input.btn.btn-sm .tw-icon {
1371
- left: 8px;
1372
1302
  left: var(--size-8);
1373
1303
  right: auto;
1374
1304
  right: initial;