@npm_leadtech/legal-lib-components 2.9.2 → 2.10.0

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 (14) hide show
  1. package/dist/cjs/index.js +1 -1
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/legal-lib-components.css +567 -340
  4. package/dist/cjs/src/components/atoms/AddButton/AddButton.d.ts +1 -0
  5. package/dist/cjs/src/components/atoms/WideInfoBar/WideInfoBar.d.ts +1 -0
  6. package/dist/cjs/src/components/atoms/WideInfoBar/__stories__/WideInfoBar.stories.d.ts +1 -0
  7. package/dist/esm/index.js +1 -1
  8. package/dist/esm/index.js.map +1 -1
  9. package/dist/esm/legal-lib-components.css +567 -340
  10. package/dist/esm/src/components/atoms/AddButton/AddButton.d.ts +1 -0
  11. package/dist/esm/src/components/atoms/WideInfoBar/WideInfoBar.d.ts +1 -0
  12. package/dist/esm/src/components/atoms/WideInfoBar/__stories__/WideInfoBar.stories.d.ts +1 -0
  13. package/dist/index.d.ts +1 -0
  14. package/package.json +3 -1
package/dist/esm/legal-lib-components.css CHANGED
@@ -1,3 +1,227 @@
1
+ html[data-theme='districtlaws'] {
2
+ --primary-main-light-6: #fff5ee;
3
+ --primary-main-light-5: #ffe1cc;
4
+ --primary-main-light-4: #ffc59b;
5
+ --primary-main-light-3: #ffa05c;
6
+ --primary-main-light-2: #ff862e;
7
+ --primary-main-light-1: #c95500;
8
+ --primary-main: #f26600;
9
+ --primary-main-dark-1: #4f2100;
10
+ --primary-main-dark-2: #220f00;
11
+ --secondary-main-light-5: #eff7f5;
12
+ --secondary-main-light-4: #e4f8f3;
13
+ --secondary-main-light-3: #c0f7e8;
14
+ --secondary-main-light-2: #5dd8c3;
15
+ --secondary-main-light-1: #34b2a7;
16
+ --secondary-main: #078080;
17
+ --secondary-main-dark-1: #05646e;
18
+ --secondary-main-dark-2: #02374a;
19
+ --neutral-main: #1e2021;
20
+ --neutral-neutral-1: #3d4042;
21
+ --neutral-neutral-2: #6b6e6f;
22
+ --neutral-neutral-3: #cacaca;
23
+ --neutral-neutral-4: #e1e1e1;
24
+ --neutral-neutral-5: #f4f4f4;
25
+ --neutral-neutral-6: #f8f9fa;
26
+ --error-main: #d63737;
27
+ --error-error-2: #f09d9e;
28
+ --error-error-3: #ffecef;
29
+ --others-white: #ffffff;
30
+ --others-disabled: #6b7280;
31
+ --others-black: #000000; }
32
+
33
+ html[data-theme='lawdistricts'] {
34
+ --primary-main-light-6: #f9f9ff;
35
+ --primary-main-light-5: #eceeff;
36
+ --primary-main-light-4: #c3c9ff;
37
+ --primary-main-light-3: #9aa4ff;
38
+ --primary-main-light-2: #717fff;
39
+ --primary-main-light-1: #1725a6;
40
+ --primary-main: #485aff;
41
+ --primary-main-dark-1: #050e5a;
42
+ --primary-main-dark-2: #000533;
43
+ --secondary-main-light-5: #eff7f5;
44
+ --secondary-main-light-4: #e4f8f3;
45
+ --secondary-main-light-3: #c0f7e8;
46
+ --secondary-main-light-2: #5dd8c3;
47
+ --secondary-main-light-1: #34b2a7;
48
+ --secondary-main: #078080;
49
+ --secondary-main-dark-1: #05646e;
50
+ --secondary-main-dark-2: #02374a;
51
+ --neutral-main: #1e2021;
52
+ --neutral-neutral-1: #3d4042;
53
+ --neutral-neutral-2: #6b6e6f;
54
+ --neutral-neutral-3: #cacaca;
55
+ --neutral-neutral-4: #e1e1e1;
56
+ --neutral-neutral-5: #f4f4f4;
57
+ --neutral-neutral-6: #f8f9fa;
58
+ --error-main: #d63737;
59
+ --error-error-2: #f09d9e;
60
+ --error-error-3: #ffecef;
61
+ --others-white: #ffffff;
62
+ --others-disabled: #6b7280;
63
+ --others-black: #000000; }
64
+
65
+ html[data-theme='lawdistrict'] {
66
+ --primary-main-light-6: #eff7f5;
67
+ --primary-main-light-5: #e4f8f3;
68
+ --primary-main-light-4: #c0f7e8;
69
+ --primary-main-light-3: #5dd8c3;
70
+ --primary-main-light-2: #34b2a7;
71
+ --primary-main-light-1: #05646e;
72
+ --primary-main: #078080;
73
+ --primary-main-dark-1: #02374a;
74
+ --primary-main-dark-2: #032a38;
75
+ --secondary-main-light-5: #fcf9f5;
76
+ --secondary-main-light-4: #fcf4e5;
77
+ --secondary-main-light-3: #f7e8cf;
78
+ --secondary-main-light-2: #f5dab0;
79
+ --secondary-main-light-1: #f4cc8c;
80
+ --secondary-main: #f2bd6a;
81
+ --secondary-main-dark-1: #cd9a4c;
82
+ --secondary-main-dark-2: #936c2f;
83
+ --neutral-main: #1e2021;
84
+ --neutral-neutral-1: #3d4042;
85
+ --neutral-neutral-2: #6d7275;
86
+ --neutral-neutral-3: #b5babd;
87
+ --neutral-neutral-4: #dbe1e5;
88
+ --neutral-neutral-5: #f3f7fa;
89
+ --neutral-neutral-6: #f8f9fa;
90
+ --error-main: #d63737;
91
+ --error-error-2: #f09d9e;
92
+ --error-error-3: #ffecef;
93
+ --others-white: #ffffff;
94
+ --others-disabled: #6b7280;
95
+ --others-black: #000000; }
96
+
97
+ html[data-theme='lawdistrictpro'] {
98
+ --primary-main-light-6: #f9f5ff;
99
+ --primary-main-light-5: #e3d1ff;
100
+ --primary-main-light-4: #b68aff;
101
+ --primary-main-light-3: #a56dff;
102
+ --primary-main-light-2: #9e63ff;
103
+ --primary-main-light-1: #320085;
104
+ --primary-main: #7d2eff;
105
+ --primary-main-dark-1: #23005c;
106
+ --primary-main-dark-2: #11002d;
107
+ --secondary-main-light-5: #eff7f5;
108
+ --secondary-main-light-4: #e4f8f3;
109
+ --secondary-main-light-3: #c0f7e8;
110
+ --secondary-main-light-2: #5dd8c3;
111
+ --secondary-main-light-1: #34b2a7;
112
+ --secondary-main: #078080;
113
+ --secondary-main-dark-1: #05646e;
114
+ --secondary-main-dark-2: #02374a;
115
+ --neutral-main: #1e2021;
116
+ --neutral-neutral-1: #3d4042;
117
+ --neutral-neutral-2: #6b6e6f;
118
+ --neutral-neutral-3: #cacaca;
119
+ --neutral-neutral-4: #e1e1e1;
120
+ --neutral-neutral-5: #f4f4f4;
121
+ --neutral-neutral-6: #f8f9fa;
122
+ --error-main: #d63737;
123
+ --error-error-2: #f09d9e;
124
+ --error-error-3: #ffecef;
125
+ --others-white: #ffffff;
126
+ --others-disabled: #6b7280;
127
+ --others-black: #000000; }
128
+
129
+ html[data-theme='thedistrictlaw'] {
130
+ --primary-main-light-6: #f1fff7;
131
+ --primary-main-light-5: #d5ffe6;
132
+ --primary-main-light-4: #6affa5;
133
+ --primary-main-light-3: #16ff73;
134
+ --primary-main-light-2: #00df59;
135
+ --primary-main-light-1: #008e39;
136
+ --primary-main: #00b649;
137
+ --primary-main-dark-1: #003c18;
138
+ --primary-main-dark-2: #001709;
139
+ --secondary-main-light-5: #eff7f5;
140
+ --secondary-main-light-4: #e4f8f3;
141
+ --secondary-main-light-3: #c0f7e8;
142
+ --secondary-main-light-2: #5dd8c3;
143
+ --secondary-main-light-1: #34b2a7;
144
+ --secondary-main: #078080;
145
+ --secondary-main-dark-1: #05646e;
146
+ --secondary-main-dark-2: #02374a;
147
+ --neutral-main: #1e2021;
148
+ --neutral-neutral-1: #3d4042;
149
+ --neutral-neutral-2: #6b6e6f;
150
+ --neutral-neutral-3: #cacaca;
151
+ --neutral-neutral-4: #e1e1e1;
152
+ --neutral-neutral-5: #f4f4f4;
153
+ --neutral-neutral-6: #f8f9fa;
154
+ --error-main: #d63737;
155
+ --error-error-2: #f09d9e;
156
+ --error-error-3: #ffecef;
157
+ --others-white: #ffffff;
158
+ --others-disabled: #6b7280;
159
+ --others-black: #000000; }
160
+
161
+ html[data-theme='uslawdistrict'] {
162
+ --primary-main-light-6: #fffbf2;
163
+ --primary-main-light-5: #fff6e5;
164
+ --primary-main-light-4: #ffe6b7;
165
+ --primary-main-light-3: #ffc75c;
166
+ --primary-main-light-2: #ffa800;
167
+ --primary-main-light-1: #855800;
168
+ --primary-main: #d68d00;
169
+ --primary-main-dark-1: #3d2800;
170
+ --primary-main-dark-2: #231700;
171
+ --secondary-main-light-5: #eff7f5;
172
+ --secondary-main-light-4: #e4f8f3;
173
+ --secondary-main-light-3: #c0f7e8;
174
+ --secondary-main-light-2: #5dd8c3;
175
+ --secondary-main-light-1: #34b2a7;
176
+ --secondary-main: #078080;
177
+ --secondary-main-dark-1: #05646e;
178
+ --secondary-main-dark-2: #02374a;
179
+ --neutral-main: #1e2021;
180
+ --neutral-neutral-1: #3d4042;
181
+ --neutral-neutral-2: #6b6e6f;
182
+ --neutral-neutral-3: #cacaca;
183
+ --neutral-neutral-4: #e1e1e1;
184
+ --neutral-neutral-5: #f4f4f4;
185
+ --neutral-neutral-6: #f8f9fa;
186
+ --error-main: #d63737;
187
+ --error-error-2: #f09d9e;
188
+ --error-error-3: #ffecef;
189
+ --others-white: #ffffff;
190
+ --others-disabled: #6b7280;
191
+ --others-black: #000000; }
192
+
193
+ html[data-theme='uslawdistricts'] {
194
+ --primary-main-light-6: #f9ffea;
195
+ --primary-main-light-5: #f0ffc4;
196
+ --primary-main-light-4: #e6ff9f;
197
+ --primary-main-light-3: #c9ff2f;
198
+ --primary-main-light-2: #b1e815;
199
+ --primary-main-light-1: #6f9600;
200
+ --primary-main: #8ebf00;
201
+ --primary-main-dark-1: #384c00;
202
+ --primary-main-dark-2: #192101;
203
+ --secondary-main-light-5: #eff7f5;
204
+ --secondary-main-light-4: #e4f8f3;
205
+ --secondary-main-light-3: #c0f7e8;
206
+ --secondary-main-light-2: #5dd8c3;
207
+ --secondary-main-light-1: #34b2a7;
208
+ --secondary-main: #078080;
209
+ --secondary-main-dark-1: #05646e;
210
+ --secondary-main-dark-2: #02374a;
211
+ --neutral-main: #1e2021;
212
+ --neutral-neutral-1: #3d4042;
213
+ --neutral-neutral-2: #6b6e6f;
214
+ --neutral-neutral-3: #cacaca;
215
+ --neutral-neutral-4: #e1e1e1;
216
+ --neutral-neutral-5: #f4f4f4;
217
+ --neutral-neutral-6: #f8f9fa;
218
+ --error-main: #d63737;
219
+ --error-error-2: #f09d9e;
220
+ --error-error-3: #ffecef;
221
+ --others-white: #ffffff;
222
+ --others-disabled: #6b7280;
223
+ --others-black: #000000; }
224
+
1
225
  .e-addButton {
2
226
  display: inline-block; }
3
227
  .e-addButton .tooltip {
@@ -7,18 +231,18 @@
7
231
  .e-addButton__inner {
8
232
  display: inline-block;
9
233
  margin-top: 1rem;
10
- color: #05646E;
234
+ color: var(--primary-main);
11
235
  border-radius: 4px;
12
236
  transition: all .3s ease;
13
237
  font-weight: bold; }
14
238
  .e-addButton__inner label:hover {
15
- background-color: #C0F7E8; }
239
+ background-color: var(--primary-main-light-4); }
16
240
  .e-addButton__inner label {
17
241
  display: flex;
18
242
  flex-basis: 100%;
19
243
  align-items: center;
20
244
  position: relative;
21
- border: 1px solid #05646E;
245
+ border: 1px solid var(--primary-main);
22
246
  border-radius: 4px;
23
247
  cursor: pointer;
24
248
  padding: .75rem 1rem;
@@ -35,17 +259,17 @@
35
259
  border-radius: 4px;
36
260
  border: 1px solid; }
37
261
  .base-box--active {
38
- background-color: #EFF7F5; }
262
+ background-color: var(--primary-main-light-6); }
39
263
  .base-box--padded {
40
264
  padding: 2rem; }
41
265
  .base-box--color-neutral3 {
42
- border-color: #B5BABD; }
266
+ border-color: var(--neutral-neutral-3); }
43
267
  .base-box--color-neutral4 {
44
- border-color: #DBE1E5; }
268
+ border-color: var(--neutral-neutral-4); }
45
269
 
46
270
  .bill-card {
47
- background-color: #F8F9FA;
48
- border: 1px solid #DBE1E5;
271
+ background-color: var(--neutral-neutral-6);
272
+ border: 1px solid var(--neutral-neutral-4);
49
273
  border-radius: 4px;
50
274
  display: flex;
51
275
  flex-direction: column;
@@ -61,7 +285,7 @@
61
285
  flex-direction: row;
62
286
  justify-content: space-between;
63
287
  align-items: center;
64
- border-bottom: 1px solid #DBE1E5;
288
+ border-bottom: 1px solid var(--neutral-neutral-4);
65
289
  padding-bottom: 1rem; }
66
290
  @media (min-width: 575px) {
67
291
  .bill-card .date-price {
@@ -71,7 +295,7 @@
71
295
  @media (min-width: 575px) {
72
296
  .bill-card .date-price__left {
73
297
  padding: 0.2rem 1rem 0.2rem 0;
74
- border-right: 1px solid #DBE1E5; } }
298
+ border-right: 1px solid var(--neutral-neutral-4); } }
75
299
  @media (min-width: 720px) {
76
300
  .bill-card .date-price__left {
77
301
  padding: 0.2rem 1.5rem 0.2rem 0; } }
@@ -92,7 +316,7 @@
92
316
  display: flex;
93
317
  align-items: center; }
94
318
  .inline-list a, .inline-list span {
95
- color: #078080;
319
+ color: var(--primary-main-light-1);
96
320
  font-weight: 700;
97
321
  font-size: 12px;
98
322
  line-height: 16px;
@@ -127,79 +351,79 @@
127
351
  padding: 0;
128
352
  position: absolute; }
129
353
  .e-button.--skipStep label {
130
- color: #1E2021; }
354
+ color: var(--neutral-main); }
131
355
  .e-button.--styleless {
132
- background-color: #FFFFFF;
356
+ background-color: var(--others-white);
133
357
  font-size: 0.9rem;
134
- color: #6D7275;
358
+ color: var(--neutral-neutral-2);
135
359
  text-align: left;
136
360
  border: none; }
137
361
  .e-button.--styleless:hover {
138
- color: #05646E; }
362
+ color: var(--primary-main); }
139
363
  .e-button.--primary {
140
364
  display: inline-block; }
141
365
  .e-button.--primary-1 {
142
- background-color: #078080;
143
- border: 2px solid #078080;
144
- color: #FFFFFF;
366
+ background-color: var(--primary-main-light-1);
367
+ border: 2px solid var(--primary-main-light-1);
368
+ color: var(--others-white);
145
369
  font-weight: bold;
146
370
  height: 100%; }
147
371
  .e-button.--primary-1:hover {
148
- background-color: #05646E;
149
- border-color: #05646E; }
372
+ background-color: var(--primary-main);
373
+ border-color: var(--primary-main); }
150
374
  .e-button.--primary-2 {
151
- background-color: #032A38;
152
- border: 2px solid #032A38;
153
- color: #FFFFFF;
375
+ background-color: var(--primary-main-dark-2);
376
+ border: 2px solid var(--primary-main-dark-2);
377
+ color: var(--others-white);
154
378
  font-weight: bold; }
155
379
  .e-button.--primary-2:hover {
156
- background-color: #02374A;
157
- border-color: #02374A; }
380
+ background-color: var(--primary-main-dark-1);
381
+ border-color: var(--primary-main-dark-1); }
158
382
  .e-button.--primary-3 {
159
- background-color: #F2BD6A;
160
- border: 2px solid #F2BD6A;
161
- color: #1E2021;
383
+ background-color: var(--secondary-main);
384
+ border: 2px solid var(--secondary-main);
385
+ color: var(--neutral-main);
162
386
  font-weight: bold; }
163
387
  .e-button.--primary-3:hover {
164
- background-color: #CD9A4C;
165
- border-color: #CD9A4C; }
388
+ background-color: var(--secondary-main-dark-1);
389
+ border-color: var(--secondary-main-dark-1); }
166
390
  .e-button.--primary-4 {
167
- background-color: #032A38;
168
- border: 2px solid #032A38;
169
- color: #EFF7F5;
391
+ background-color: var(--primary-main-dark-2);
392
+ border: 2px solid var(--primary-main-dark-2);
393
+ color: var(--primary-main-light-6);
170
394
  font-weight: bold; }
171
395
  .e-button.--primary-4:hover {
172
- background-color: #02374A;
173
- border-color: #02374A; }
396
+ background-color: var(--primary-main-dark-1);
397
+ border-color: var(--primary-main-dark-1); }
174
398
  .e-button.--secondary {
175
399
  display: inline-block; }
176
400
  .e-button.--secondary-1 {
177
- background-color: #FFFFFF;
178
- border: 2px solid #078080;
179
- color: #078080;
401
+ background-color: var(--others-white);
402
+ border: 2px solid var(--primary-main-light-1);
403
+ color: var(--primary-main-light-1);
180
404
  font-weight: bold; }
181
405
  .e-button.--secondary-1:hover {
182
- background-color: #E4F8F3; }
406
+ background-color: var(--primary-main-light-5); }
183
407
  .e-button.--secondary-2 {
184
- background-color: #FFFFFF;
185
- border: 2px solid #F2BD6A;
186
- color: #1E2021;
408
+ background-color: var(--others-white);
409
+ border: 2px solid var(--secondary-main);
410
+ color: var(--neutral-main);
187
411
  font-weight: bold; }
188
412
  .e-button.--secondary-2:hover {
189
- background-color: #FCF4E5; }
413
+ background-color: var(--secondary-main-light-4); }
190
414
  .e-button.--secondary-icon {
191
415
  display: flex;
192
416
  justify-content: center;
193
417
  border-radius: 4px;
194
- border: 2px solid #6D7275;
195
- background-color: #F3F7FA; }
418
+ border: 2px solid var(--neutral-neutral-2);
419
+ background-color: var(--neutral-neutral-5); }
196
420
  .e-button.--secondary-icon svg {
197
421
  width: 20px;
198
422
  margin-right: 1rem; }
199
423
  .e-button.--secondary-icon img {
200
424
  max-width: 20px; }
201
425
  .e-button.--secondary-icon:hover {
202
- background-color: #DBE1E5; }
426
+ background-color: var(--neutral-neutral-4); }
203
427
  .e-button.--secondary-icon.--bold {
204
428
  font-weight: 900;
205
429
  min-width: 8rem;
@@ -210,62 +434,62 @@
210
434
  .e-button.--secondary-icon.--bold img {
211
435
  margin-right: 0.8rem; }
212
436
  .e-button.--secondary-icon.--dark {
213
- background-color: #1E2021;
214
- border: 1px solid #FFFFFF !important;
215
- color: #FFFFFF; }
437
+ background-color: var(--neutral-main);
438
+ border: 1px solid var(--others-white) !important;
439
+ color: var(--others-white); }
216
440
  .e-button.--secondary-icon.--dark svg {
217
- fill: #FFFFFF; }
441
+ fill: var(--others-white); }
218
442
  .e-button.--secondary-icon.--dark:hover {
219
- background-color: #3D4042; }
443
+ background-color: var(--neutral-neutral-1); }
220
444
  .e-button.--transparent {
221
445
  background-color: transparent; }
222
446
  .e-button.--disabled {
223
- background-color: #DBE1E5;
224
- color: #3D4042;
447
+ background-color: var(--neutral-neutral-4);
448
+ color: var(--neutral-neutral-1);
225
449
  pointer-events: none; }
226
450
  .e-button.--error {
227
- border-color: #D63737;
228
- color: #D63737; }
451
+ border-color: var(--error-main);
452
+ color: var(--error-main); }
229
453
  .e-button--fluid {
230
454
  width: 100%; }
231
455
 
232
456
  .button--secondary-3 {
233
- color: #3D4042;
457
+ color: var(--neutral-neutral-1);
234
458
  display: flex;
235
459
  font-size: 14px;
236
460
  font-weight: bold;
237
461
  justify-content: center;
238
462
  border-radius: 4px;
239
- border: 2px solid #6D7275;
240
- background-color: #F8F9FA; }
463
+ border: 2px solid var(--neutral-neutral-2);
464
+ background-color: var(--neutral-neutral-6); }
241
465
  .button--secondary-3 .button__icon {
242
466
  width: 20px;
243
467
  margin-right: 0.25rem; }
244
468
  .button--secondary-3 .button__icon__g {
245
- fill: #3D4042; }
469
+ fill: var(--neutral-neutral-1); }
246
470
  .button--secondary-3 img {
247
471
  max-width: 20px; }
248
472
  .button--secondary-3:hover {
249
- background-color: #DBE1E5; }
473
+ background-color: var(--neutral-neutral-4); }
250
474
 
251
475
  .button--secondary-4 {
252
- background-color: #1E2021;
253
- border: 1px solid #FFFFFF !important;
254
- color: #FFFFFF; }
476
+ background-color: var(--neutral-main);
477
+ border: 1px solid var(--others-white) !important;
478
+ color: var(--others-white); }
255
479
  .button--secondary-4 svg {
256
- fill: #FFFFFF; }
480
+ fill: var(--others-white); }
257
481
  .button--secondary-4:hover {
258
- background-color: #3D4042; }
482
+ background-color: var(--neutral-neutral-1); }
259
483
 
260
484
  .button--tertiary {
261
485
  font-weight: bold;
262
486
  padding: 0.5rem 1rem;
263
487
  display: inline-block;
264
- color: #05646E;
488
+ color: var(--primary-main);
265
489
  border: none;
266
490
  background: none; }
267
491
  .button--tertiary:hover {
268
- background-color: #C0F7E8; }
492
+ background-color: var(--primary-main-light-4); }
269
493
 
270
494
  .button--small {
271
495
  line-height: 1; }
@@ -283,18 +507,18 @@
283
507
  .button-icon {
284
508
  background: none;
285
509
  border-radius: 4px;
286
- border: 1px solid #DBE1E5;
510
+ border: 1px solid var(--neutral-neutral-4);
287
511
  display: inline-flex;
288
512
  padding: 0.1875rem;
289
513
  transition: all .3s ease;
290
514
  position: relative;
291
515
  cursor: pointer; }
292
516
  .button-icon--disabled {
293
- background-color: #DBE1E5;
294
- color: #3D4042;
517
+ background-color: var(--neutral-neutral-4);
518
+ color: var(--neutral-neutral-1);
295
519
  pointer-events: none; }
296
520
  .button-icon:hover {
297
- background-color: #E4F8F3; }
521
+ background-color: var(--primary-main-light-5); }
298
522
  .button-icon:hover .button-icon__tooltip {
299
523
  transform: translate(-50%, 0);
300
524
  visibility: visible;
@@ -302,7 +526,7 @@
302
526
  .button-icon__tooltip {
303
527
  font-size: 12px;
304
528
  position: absolute;
305
- color: #6D7275;
529
+ color: var(--neutral-neutral-2);
306
530
  bottom: -1.25rem;
307
531
  left: 50%;
308
532
  margin: 0 auto;
@@ -334,7 +558,7 @@
334
558
 
335
559
  .pane {
336
560
  align-items: flex-start;
337
- border-top: 1px solid #DBE1E5;
561
+ border-top: 1px solid var(--neutral-neutral-4);
338
562
  display: flex;
339
563
  font-family: "Inter", sans-serif;
340
564
  padding: 1.5rem 0;
@@ -372,7 +596,7 @@
372
596
  display: inline-block;
373
597
  text-indent: -0.625rem; }
374
598
  .pane--title {
375
- color: #6D7275;
599
+ color: var(--neutral-neutral-2);
376
600
  font-size: 0.875rem;
377
601
  line-height: 1.29; }
378
602
  @media (min-width: 575px) {
@@ -385,16 +609,16 @@
385
609
  .pane--title {
386
610
  font-size: 0.875rem; } }
387
611
  .pane--description {
388
- color: #1E2021;
612
+ color: var(--neutral-main);
389
613
  font-size: 1rem;
390
614
  font-weight: 700;
391
615
  letter-spacing: -0.3px;
392
616
  line-height: 1.38;
393
617
  margin-top: 2px; }
394
618
  .pane--description--active {
395
- color: #05646E; }
619
+ color: var(--primary-main); }
396
620
  .pane--description--inactive {
397
- color: #D63737; }
621
+ color: var(--error-main); }
398
622
  @media (min-width: 575px) {
399
623
  .pane {
400
624
  flex-direction: row; } }
@@ -429,8 +653,8 @@
429
653
  .e-checkbox input:not(:checked) + label:before,
430
654
  .e-checkbox input:checked + label:before {
431
655
  content: "";
432
- background-color: #FFFFFF;
433
- border: 1px solid #1E2021;
656
+ background-color: var(--others-white);
657
+ border: 1px solid var(--neutral-main);
434
658
  left: 1px;
435
659
  position: absolute;
436
660
  top: 0;
@@ -451,13 +675,13 @@
451
675
  top: 3px;
452
676
  left: .25rem; }
453
677
  .e-checkbox input:not(:checked) + label:hover:before {
454
- background-color: #E4F8F3; }
678
+ background-color: var(--primary-main-light-5); }
455
679
  .e-checkbox input:checked + label:after {
456
680
  opacity: 1;
457
681
  transform: scale(1); }
458
682
  .e-checkbox input:checked + label:before {
459
- background-color: #E4F8F3;
460
- border: 1.5px solid #05646E;
683
+ background-color: var(--primary-main-light-5);
684
+ border: 1.5px solid var(--primary-main);
461
685
  border-radius: 4px; }
462
686
  .e-checkbox input[disabled] + label {
463
687
  opacity: 0.4; }
@@ -466,7 +690,7 @@
466
690
  .e-checkbox.--is-invalid input:not(:checked) + label:before,
467
691
  .e-checkbox.--is-invalid input:checked + label:before, .e-checkbox.--group-invalid input:not(:checked) + label:before,
468
692
  .e-checkbox.--group-invalid input:checked + label:before {
469
- border: 2px solid #D63737; }
693
+ border: 2px solid var(--error-main); }
470
694
 
471
695
  @charset "UTF-8";
472
696
  .react-datepicker__year-read-view--down-arrow,
@@ -1226,12 +1450,12 @@
1226
1450
  .e-datepicker ul li::before {
1227
1451
  background-color: transparent; }
1228
1452
  .e-datepicker .react-datepicker {
1229
- border: 0.5px solid #DBE1E5; }
1453
+ border: 0.5px solid var(--neutral-neutral-4); }
1230
1454
  .e-datepicker .react-datepicker__input-container input {
1231
- color: #1E2021;
1455
+ color: var(--neutral-main);
1232
1456
  border-radius: 4px;
1233
1457
  font-size: 1rem;
1234
- background-color: #DBE1E5;
1458
+ background-color: var(--neutral-neutral-4);
1235
1459
  height: 40px;
1236
1460
  width: 100%;
1237
1461
  padding: .75rem 0 .75rem .75rem;
@@ -1239,16 +1463,16 @@
1239
1463
  background-position: 95% 50%;
1240
1464
  background-repeat: no-repeat;
1241
1465
  transition: box-shadow .3s ease;
1242
- box-shadow: 0 0 0 0 #C0F7E8;
1466
+ box-shadow: 0 0 0 0 var(--primary-main-light-4);
1243
1467
  margin: .0005em;
1244
1468
  border: none; }
1245
1469
  .e-datepicker .react-datepicker__input-container input:focus {
1246
1470
  outline: none;
1247
- box-shadow: 0 0 0 2px #078080; }
1471
+ box-shadow: 0 0 0 2px var(--primary-main-light-1); }
1248
1472
  .e-datepicker .react-datepicker__day {
1249
1473
  font-size: 14px;
1250
1474
  text-align: center;
1251
- border: 0.5px solid #DBE1E5;
1475
+ border: 0.5px solid var(--neutral-neutral-4);
1252
1476
  width: 39px;
1253
1477
  height: 38px;
1254
1478
  border-collapse: collapse;
@@ -1256,12 +1480,12 @@
1256
1480
  display: table-cell;
1257
1481
  line-height: 1.7rem; }
1258
1482
  .e-datepicker .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after {
1259
- border-bottom-color: #FFFFFF; }
1483
+ border-bottom-color: var(--others-white); }
1260
1484
  .e-datepicker .react-datepicker__day--selected {
1261
- background-color: #34B2A7;
1262
- border: 1px double #34B2A7; }
1485
+ background-color: var(--primary-main-light-2);
1486
+ border: 1px double var(--primary-main-light-2); }
1263
1487
  .e-datepicker .react-datepicker__day--selected:hover {
1264
- background-color: #34B2A7; }
1488
+ background-color: var(--primary-main-light-2); }
1265
1489
  .e-datepicker .react-datepicker__day--keyboard-selected {
1266
1490
  background-color: inherit;
1267
1491
  color: inherit; }
@@ -1276,14 +1500,14 @@
1276
1500
  background-color: inherit;
1277
1501
  border: none; }
1278
1502
  .e-datepicker .react-datepicker__header button {
1279
- border: 0.5px solid #DBE1E5; }
1503
+ border: 0.5px solid var(--neutral-neutral-4); }
1280
1504
  .e-datepicker .react-datepicker__header select {
1281
1505
  -webkit-appearance: menulist-button;
1282
- background-color: #FFFFFF; }
1506
+ background-color: var(--others-white); }
1283
1507
  .e-datepicker .react-datepicker__day-name {
1284
1508
  width: 33px; }
1285
1509
  .e-datepicker .react-datepicker__day--outside-month {
1286
- color: #B5BABD;
1510
+ color: var(--neutral-neutral-3);
1287
1511
  pointer-events: none; }
1288
1512
 
1289
1513
  .dialog-menu-icon {
@@ -1298,7 +1522,7 @@
1298
1522
  align-self: center; } }
1299
1523
  .dialog-menu-icon__message {
1300
1524
  visibility: hidden;
1301
- background-color: #3D4042;
1525
+ background-color: var(--neutral-neutral-1);
1302
1526
  color: white;
1303
1527
  padding: 1rem 1rem;
1304
1528
  border-radius: 0.3rem;
@@ -1335,7 +1559,7 @@
1335
1559
  width: 0;
1336
1560
  height: 0;
1337
1561
  box-shadow: 0 0.25rem 0.5rem -0.5rem;
1338
- border-bottom: 0.5rem solid #3D4042;
1562
+ border-bottom: 0.5rem solid var(--neutral-neutral-1);
1339
1563
  -webkit-transform: translate(-100%, 0);
1340
1564
  transform: translate(-100%, 0);
1341
1565
  top: 1.1rem;
@@ -1352,15 +1576,15 @@
1352
1576
  .disclaimer {
1353
1577
  padding: 1rem 0; } }
1354
1578
  .disclaimer__wrapper {
1355
- background-color: #1E2021;
1356
- color: #DBE1E5; }
1579
+ background-color: var(--neutral-main);
1580
+ color: var(--neutral-neutral-4); }
1357
1581
  .disclaimer__wrapper .standard {
1358
- color: #DBE1E5;
1582
+ color: var(--neutral-neutral-4);
1359
1583
  text-decoration: underline; }
1360
1584
 
1361
1585
  .grey-color {
1362
- color: #3D4042;
1363
- background-color: #DBE1E5; }
1586
+ color: var(--neutral-neutral-1);
1587
+ background-color: var(--neutral-neutral-4); }
1364
1588
 
1365
1589
  .disclaimer__copy {
1366
1590
  margin-bottom: 0.5rem; }
@@ -1384,7 +1608,7 @@
1384
1608
  .divider__line {
1385
1609
  width: 45%;
1386
1610
  height: 0px;
1387
- border-bottom: 1px solid #DBE1E5; }
1611
+ border-bottom: 1px solid var(--neutral-neutral-4); }
1388
1612
  .divider__word, .divider__image {
1389
1613
  width: fit-content;
1390
1614
  text-align: center;
@@ -1412,17 +1636,17 @@
1412
1636
  .document-status .icon {
1413
1637
  margin-right: .25rem; }
1414
1638
  .document-status.--is-completed {
1415
- background-color: #E4F8F3;
1416
- border-color: #5DD8C3;
1417
- color: #05646E; }
1639
+ background-color: var(--primary-main-light-5);
1640
+ border-color: var(--primary-main-light-3);
1641
+ color: var(--primary-main); }
1418
1642
  .document-status.--in-progress {
1419
- background-color: #FCF4E5;
1420
- border-color: #CD9A4C;
1421
- color: #936C2F; }
1643
+ background-color: var(--secondary-main-light-4);
1644
+ border-color: var(--secondary-main-dark-1);
1645
+ color: var(--secondary-main-dark-2); }
1422
1646
  .document-status.--is-new {
1423
- background-color: #936C2F;
1424
- border-color: #F2BD6A;
1425
- color: #FCF4E5; }
1647
+ background-color: var(--secondary-main-dark-2);
1648
+ border-color: var(--secondary-main);
1649
+ color: var(--secondary-main-light-4); }
1426
1650
  .document-status.--is-new .icon {
1427
1651
  margin-right: 1.4rem; }
1428
1652
 
@@ -1432,7 +1656,7 @@
1432
1656
  cursor: default; }
1433
1657
  .form-faq::before {
1434
1658
  content: "\2022";
1435
- color: #936C2F;
1659
+ color: var(--secondary-main-dark-2);
1436
1660
  margin-right: .25rem;
1437
1661
  margin-top: .2rem; }
1438
1662
  .form-faq__container {
@@ -1444,19 +1668,19 @@
1444
1668
  display: block; }
1445
1669
  .form-faq__title {
1446
1670
  display: inline-block;
1447
- color: #3D4042;
1671
+ color: var(--neutral-neutral-1);
1448
1672
  padding: 0.25rem;
1449
1673
  transition: background-color 0.3s ease; }
1450
1674
  .form-faq__title:hover {
1451
- background-color: #FCF4E5; }
1675
+ background-color: var(--secondary-main-light-4); }
1452
1676
  .form-faq__answer {
1453
1677
  display: none;
1454
- background: #3D4042;
1678
+ background: var(--neutral-neutral-1);
1455
1679
  position: absolute;
1456
1680
  border-radius: 4px;
1457
1681
  top: 0;
1458
1682
  transform: translateY(-100%);
1459
- color: #FFFFFF;
1683
+ color: var(--others-white);
1460
1684
  padding: 0.75rem;
1461
1685
  width: 100%;
1462
1686
  max-width: 600px;
@@ -1474,14 +1698,14 @@
1474
1698
  border-left: 1rem solid transparent;
1475
1699
  border-right: 1rem solid transparent;
1476
1700
  bottom: -0.35rem;
1477
- border-top: 1rem solid #3D4042; }
1701
+ border-top: 1rem solid var(--neutral-neutral-1); }
1478
1702
 
1479
1703
  .google-button {
1480
1704
  display: flex;
1481
1705
  width: 100%;
1482
1706
  align-items: center;
1483
1707
  justify-content: center;
1484
- border: 1px solid #B5BABD;
1708
+ border: 1px solid var(--neutral-neutral-3);
1485
1709
  padding: 0.5rem 0;
1486
1710
  background-color: white;
1487
1711
  border-radius: 2px;
@@ -1499,17 +1723,17 @@
1499
1723
  display: flex;
1500
1724
  flex-direction: row; }
1501
1725
  .info-box.error {
1502
- border-color: #D63737;
1503
- color: #D63737;
1504
- background-color: #FFECEF; }
1726
+ border-color: var(--error-main);
1727
+ color: var(--error-main);
1728
+ background-color: var(--error-error-3); }
1505
1729
  .info-box.error use {
1506
- fill: #D63737; }
1730
+ fill: var(--error-main); }
1507
1731
  .info-box.warning {
1508
- border-color: #CD9A4C;
1509
- color: #936C2F;
1510
- background-color: #FCF4E5; }
1732
+ border-color: var(--secondary-main-dark-1);
1733
+ color: var(--secondary-main-dark-2);
1734
+ background-color: var(--secondary-main-light-4); }
1511
1735
  .info-box.warning use {
1512
- fill: #CD9A4C; }
1736
+ fill: var(--secondary-main-dark-1); }
1513
1737
  .info-box .info-box__img {
1514
1738
  width: 1.5rem;
1515
1739
  height: 1.5rem; }
@@ -1558,22 +1782,22 @@
1558
1782
  .menu-items__item svg {
1559
1783
  vertical-align: bottom; }
1560
1784
  .menu-items__item.active {
1561
- color: #078080;
1785
+ color: var(--primary-main-light-1);
1562
1786
  font-weight: 700;
1563
- background-color: #E4F8F3; }
1787
+ background-color: var(--primary-main-light-5); }
1564
1788
  .menu-items__item.inactive {
1565
- color: #6D7275;
1789
+ color: var(--neutral-neutral-2);
1566
1790
  font-weight: 400; }
1567
1791
  .menu-items__item.disabled {
1568
- color: #B5BABD; }
1792
+ color: var(--neutral-neutral-3); }
1569
1793
  .menu-items__item.disabled svg > g > g {
1570
- fill: #B5BABD; }
1794
+ fill: var(--neutral-neutral-3); }
1571
1795
  .menu-items__item:not(.disabled):hover {
1572
- background-color: #E4F8F3;
1796
+ background-color: var(--primary-main-light-5);
1573
1797
  cursor: pointer; }
1574
1798
  .menu-items__item:not(.disabled):hover svg > g > g {
1575
1799
  transition: all 0.3s ease;
1576
- fill: #05646E; }
1800
+ fill: var(--primary-main); }
1577
1801
  .menu-items__item a {
1578
1802
  display: flex; }
1579
1803
  .menu-items__item svg {
@@ -1583,9 +1807,9 @@
1583
1807
  .menu-items__item svg {
1584
1808
  width: 1rem; } }
1585
1809
  .menu-items__item svg > g > g {
1586
- fill: #3D4042; }
1810
+ fill: var(--neutral-neutral-1); }
1587
1811
  .menu-items__item svg #color-bin {
1588
- fill: #3D4042; }
1812
+ fill: var(--neutral-neutral-1); }
1589
1813
 
1590
1814
  .e-message-error {
1591
1815
  box-shadow: 0 0 0 1px #d63837;
@@ -1625,7 +1849,7 @@
1625
1849
 
1626
1850
  .progressbar {
1627
1851
  height: 100%;
1628
- background: #05646E;
1852
+ background: var(--primary-main);
1629
1853
  transition: width .3s ease;
1630
1854
  will-change: width; }
1631
1855
 
@@ -1633,7 +1857,7 @@
1633
1857
  position: absolute;
1634
1858
  width: 100%;
1635
1859
  height: 100%;
1636
- background: #E4F8F3;
1860
+ background: var(--primary-main-light-5);
1637
1861
  z-index: -1;
1638
1862
  transform: translateY(-100%); }
1639
1863
 
@@ -1656,7 +1880,7 @@
1656
1880
  flex-basis: 100%;
1657
1881
  display: flex;
1658
1882
  align-items: center;
1659
- color: #1E2021;
1883
+ color: var(--neutral-main);
1660
1884
  font-size: 16px;
1661
1885
  position: relative;
1662
1886
  cursor: pointer;
@@ -1665,12 +1889,12 @@
1665
1889
  position: absolute;
1666
1890
  left: -9999px; }
1667
1891
  .e-radio.--regular input:not(:checked):hover + label:before {
1668
- background-color: #E4F8F3; }
1892
+ background-color: var(--primary-main-light-5); }
1669
1893
  .e-radio.--regular input:checked:hover + label:before {
1670
- background-color: #05646E; }
1894
+ background-color: var(--primary-main); }
1671
1895
  .e-radio.--regular input:checked + label {
1672
- color: #05646E;
1673
- text-shadow: -0.02ex 0 #05646E, 0.02ex 0 #05646E; }
1896
+ color: var(--primary-main);
1897
+ text-shadow: -0.02ex 0 var(--primary-main), 0.02ex 0 var(--primary-main); }
1674
1898
  .e-radio.--regular input:checked + label:before {
1675
1899
  content: "";
1676
1900
  position: absolute;
@@ -1678,8 +1902,8 @@
1678
1902
  left: -23px;
1679
1903
  height: 1.25rem;
1680
1904
  width: 1.25rem;
1681
- background-color: #05646E;
1682
- border: 1px solid #05646E;
1905
+ background-color: var(--primary-main);
1906
+ border: 1px solid var(--primary-main);
1683
1907
  border-radius: 50%;
1684
1908
  box-sizing: border-box; }
1685
1909
  .e-radio.--regular input:checked + label:after {
@@ -1708,7 +1932,7 @@
1708
1932
  width: 1.25rem;
1709
1933
  border-radius: 50%;
1710
1934
  background-color: transparent;
1711
- border: 1px solid #1E2021;
1935
+ border: 1px solid var(--neutral-main);
1712
1936
  box-sizing: border-box; }
1713
1937
  .e-radio.--regular input + label:after {
1714
1938
  position: absolute;
@@ -1719,7 +1943,7 @@
1719
1943
  width: .5rem;
1720
1944
  opacity: 0;
1721
1945
  transform: scale(0);
1722
- color: #FFFFFF;
1946
+ color: var(--others-white);
1723
1947
  transition: all .1s;
1724
1948
  content: "";
1725
1949
  bottom: .5rem;
@@ -1738,7 +1962,7 @@
1738
1962
  flex-basis: 100%;
1739
1963
  display: flex;
1740
1964
  align-items: center;
1741
- color: #1E2021;
1965
+ color: var(--neutral-main);
1742
1966
  font-size: 16px;
1743
1967
  position: relative;
1744
1968
  cursor: pointer;
@@ -1747,12 +1971,12 @@
1747
1971
  position: absolute;
1748
1972
  left: -9999px; }
1749
1973
  .e-radio.--regular:not(.--icons) input:not(:checked):hover + label:before {
1750
- background-color: #E4F8F3; }
1974
+ background-color: var(--primary-main-light-5); }
1751
1975
  .e-radio.--regular:not(.--icons) input:checked:hover + label:before {
1752
- background-color: #05646E; }
1976
+ background-color: var(--primary-main); }
1753
1977
  .e-radio.--regular:not(.--icons) input:checked + label {
1754
- color: #05646E;
1755
- text-shadow: -0.02ex 0 #05646E, 0.02ex 0 #05646E; }
1978
+ color: var(--primary-main);
1979
+ text-shadow: -0.02ex 0 var(--primary-main), 0.02ex 0 var(--primary-main); }
1756
1980
  .e-radio.--regular:not(.--icons) input:checked + label:before {
1757
1981
  content: "";
1758
1982
  position: absolute;
@@ -1760,8 +1984,8 @@
1760
1984
  left: -23px;
1761
1985
  height: 1.25rem;
1762
1986
  width: 1.25rem;
1763
- background-color: #05646E;
1764
- border: 1px solid #05646E;
1987
+ background-color: var(--primary-main);
1988
+ border: 1px solid var(--primary-main);
1765
1989
  border-radius: 50%;
1766
1990
  box-sizing: border-box; }
1767
1991
  .e-radio.--regular:not(.--icons) input:checked + label:after {
@@ -1790,7 +2014,7 @@
1790
2014
  width: 1.25rem;
1791
2015
  border-radius: 50%;
1792
2016
  background-color: transparent;
1793
- border: 1px solid #1E2021;
2017
+ border: 1px solid var(--neutral-main);
1794
2018
  box-sizing: border-box; }
1795
2019
  .e-radio.--regular:not(.--icons) input + label:after {
1796
2020
  position: absolute;
@@ -1801,7 +2025,7 @@
1801
2025
  width: .5rem;
1802
2026
  opacity: 0;
1803
2027
  transform: scale(0);
1804
- color: #FFFFFF;
2028
+ color: var(--others-white);
1805
2029
  transition: all .1s;
1806
2030
  content: "";
1807
2031
  bottom: .5rem;
@@ -1814,14 +2038,14 @@
1814
2038
  margin-bottom: 2rem;
1815
2039
  width: 10rem;
1816
2040
  margin-top: 1rem;
1817
- border: 1px solid #B5BABD;
1818
- background: #F8F9FA;
2041
+ border: 1px solid var(--neutral-neutral-3);
2042
+ background: var(--neutral-neutral-6);
1819
2043
  border-radius: 4px;
1820
2044
  transition: all .3s ease; }
1821
2045
  .e-radio.--tabs .e-radio__inner .e-radio-label {
1822
2046
  width: 100%;
1823
2047
  display: flex;
1824
- border-right: 1px solid #B5BABD;
2048
+ border-right: 1px solid var(--neutral-neutral-3);
1825
2049
  border-top-left-radius: 4px;
1826
2050
  border-bottom-left-radius: 4px; }
1827
2051
  .e-radio.--tabs .e-radio__inner .e-radio-label:last-child {
@@ -1834,22 +2058,22 @@
1834
2058
  font-size: 14px;
1835
2059
  transition: all .3s ease; }
1836
2060
  .e-radio.--tabs input + label:hover {
1837
- background: #DBE1E5; }
2061
+ background: var(--neutral-neutral-4); }
1838
2062
  .e-radio.--tabs input:checked + label {
1839
2063
  font-weight: bold;
1840
- color: #FFFFFF;
2064
+ color: var(--others-white);
1841
2065
  width: 100%;
1842
2066
  cursor: pointer;
1843
2067
  transition: all .3s ease;
1844
- background-color: #078080;
2068
+ background-color: var(--primary-main-light-1);
1845
2069
  text-align: center;
1846
2070
  padding: 10px; }
1847
2071
  .e-radio.--tabs input:checked + label:hover {
1848
- background-color: #078080; }
2072
+ background-color: var(--primary-main-light-1); }
1849
2073
  .e-radio.--tabs input:not(:checked) + label {
1850
2074
  text-align: center;
1851
2075
  width: 100%;
1852
- color: #3D4042;
2076
+ color: var(--neutral-neutral-1);
1853
2077
  font-weight: bold;
1854
2078
  padding: 10px; }
1855
2079
  .e-radio.--tabs input:hover:not(:checked) + label {
@@ -1862,14 +2086,14 @@
1862
2086
  margin-bottom: 2rem;
1863
2087
  width: 10rem;
1864
2088
  margin-top: 1rem;
1865
- border: 1px solid #B5BABD;
1866
- background: #F8F9FA;
2089
+ border: 1px solid var(--neutral-neutral-3);
2090
+ background: var(--neutral-neutral-6);
1867
2091
  border-radius: 4px;
1868
2092
  transition: all .3s ease; }
1869
2093
  .e-radio.--tabs:not(.--icons) .e-radio__inner .e-radio-label {
1870
2094
  width: 100%;
1871
2095
  display: flex;
1872
- border-right: 1px solid #B5BABD;
2096
+ border-right: 1px solid var(--neutral-neutral-3);
1873
2097
  border-top-left-radius: 4px;
1874
2098
  border-bottom-left-radius: 4px; }
1875
2099
  .e-radio.--tabs:not(.--icons) .e-radio__inner .e-radio-label:last-child {
@@ -1882,22 +2106,22 @@
1882
2106
  font-size: 14px;
1883
2107
  transition: all .3s ease; }
1884
2108
  .e-radio.--tabs:not(.--icons) input + label:hover {
1885
- background: #DBE1E5; }
2109
+ background: var(--neutral-neutral-4); }
1886
2110
  .e-radio.--tabs:not(.--icons) input:checked + label {
1887
2111
  font-weight: bold;
1888
- color: #FFFFFF;
2112
+ color: var(--others-white);
1889
2113
  width: 100%;
1890
2114
  cursor: pointer;
1891
2115
  transition: all .3s ease;
1892
- background-color: #078080;
2116
+ background-color: var(--primary-main-light-1);
1893
2117
  text-align: center;
1894
2118
  padding: 10px; }
1895
2119
  .e-radio.--tabs:not(.--icons) input:checked + label:hover {
1896
- background-color: #078080; }
2120
+ background-color: var(--primary-main-light-1); }
1897
2121
  .e-radio.--tabs:not(.--icons) input:not(:checked) + label {
1898
2122
  text-align: center;
1899
2123
  width: 100%;
1900
- color: #3D4042;
2124
+ color: var(--neutral-neutral-1);
1901
2125
  font-weight: bold;
1902
2126
  padding: 10px; }
1903
2127
  .e-radio.--tabs:not(.--icons) input:hover:not(:checked) + label {
@@ -1919,7 +2143,7 @@
1919
2143
  min-height: 3.5rem;
1920
2144
  margin-bottom: 0.5rem;
1921
2145
  border-radius: 4px;
1922
- border-color: #DBE1E5;
2146
+ border-color: var(--neutral-neutral-4);
1923
2147
  cursor: pointer; }
1924
2148
  .e-radio.--icons .radio-item-container:not(:nth-child(2n+0)) {
1925
2149
  margin-right: 0.5rem; }
@@ -1927,10 +2151,10 @@
1927
2151
  position: absolute;
1928
2152
  visibility: hidden; }
1929
2153
  .e-radio.--icons .radio-item-container.active {
1930
- border: 2px solid #02374A;
1931
- background-color: #F3F7FA; }
2154
+ border: 2px solid var(--primary-main-dark-1);
2155
+ background-color: var(--neutral-neutral-5); }
1932
2156
  .e-radio.--icons .radio-item-container:hover {
1933
- background-color: #F3F7FA;
2157
+ background-color: var(--neutral-neutral-5);
1934
2158
  font-weight: bold; }
1935
2159
  .e-radio.--icons .e-radio-label {
1936
2160
  display: flex;
@@ -1942,17 +2166,17 @@
1942
2166
  margin-right: 1rem; } }
1943
2167
 
1944
2168
  .e-radio.--is-invalid.--regular input + label:before, .e-radio.--group-invalid.--regular input + label:before {
1945
- border-color: #D63737; }
2169
+ border-color: var(--error-main); }
1946
2170
 
1947
2171
  .e-radio.--is-invalid.--tabs .e-radio__inner, .e-radio.--is-invalid.--group-invalid .e-radio__inner, .e-radio.--group-invalid.--tabs .e-radio__inner, .e-radio.--group-invalid.--group-invalid .e-radio__inner {
1948
- border: 1px solid #D63737; }
2172
+ border: 1px solid var(--error-main); }
1949
2173
  .e-radio.--is-invalid.--tabs .e-radio__inner label label, .e-radio.--is-invalid.--group-invalid .e-radio__inner label label, .e-radio.--group-invalid.--tabs .e-radio__inner label label, .e-radio.--group-invalid.--group-invalid .e-radio__inner label label {
1950
- border-right: 1px solid #D63737; }
2174
+ border-right: 1px solid var(--error-main); }
1951
2175
  .e-radio.--is-invalid.--tabs .e-radio__inner label:last-child label, .e-radio.--is-invalid.--group-invalid .e-radio__inner label:last-child label, .e-radio.--group-invalid.--tabs .e-radio__inner label:last-child label, .e-radio.--group-invalid.--group-invalid .e-radio__inner label:last-child label {
1952
2176
  border-right: none; }
1953
2177
 
1954
2178
  .radio-group__label {
1955
- color: #3D4042; }
2179
+ color: var(--neutral-neutral-1); }
1956
2180
 
1957
2181
  .e-radio.radio--small.--tabs input + label {
1958
2182
  font-size: 0.875rem;
@@ -1981,7 +2205,7 @@
1981
2205
  .e-removeButton__inner {
1982
2206
  display: inline-block;
1983
2207
  margin-top: 1rem;
1984
- color: #D63737;
2208
+ color: var(--error-main);
1985
2209
  border-radius: 4px;
1986
2210
  transition: all .3s ease; }
1987
2211
  .e-removeButton__inner label {
@@ -1989,12 +2213,12 @@
1989
2213
  flex-basis: 100%;
1990
2214
  align-items: center;
1991
2215
  position: relative;
1992
- border: 1px solid #D63737;
2216
+ border: 1px solid var(--error-main);
1993
2217
  border-radius: 4px;
1994
2218
  cursor: pointer;
1995
2219
  padding: .75rem 1rem; }
1996
2220
  .e-removeButton__inner:hover {
1997
- background-color: #FFECEF; }
2221
+ background-color: var(--error-error-3); }
1998
2222
  .e-removeButton input {
1999
2223
  position: absolute;
2000
2224
  left: -9999px; }
@@ -2076,28 +2300,28 @@
2076
2300
  position: relative;
2077
2301
  border-radius: 4px;
2078
2302
  transition: box-shadow 0.3s ease;
2079
- box-shadow: 0 0 0 1px #B5BABD;
2080
- background-color: #F3F7FA; }
2303
+ box-shadow: 0 0 0 1px var(--neutral-neutral-3);
2304
+ background-color: var(--neutral-neutral-5); }
2081
2305
  .e-searchselect .legal-selector .css-1hwfws3 {
2082
2306
  height: 40px; }
2083
2307
  .e-searchselect .legal-selector .css-yk16xz-control {
2084
- background-color: #F8F9FA;
2308
+ background-color: var(--neutral-neutral-6);
2085
2309
  border: none; }
2086
2310
  .e-searchselect .legal-selector .css-1pahdxg-control {
2087
2311
  outline: none;
2088
2312
  border: none;
2089
- background-color: #F8F9FA;
2090
- box-shadow: 0 0 0 2px #05646E; }
2313
+ background-color: var(--neutral-neutral-6);
2314
+ box-shadow: 0 0 0 2px var(--primary-main); }
2091
2315
  .e-searchselect .legal-selector .css-1wa3eu0-placeholder {
2092
2316
  font-size: 0.875rem;
2093
- color: #6D7275; }
2317
+ color: var(--neutral-neutral-2); }
2094
2318
  .e-searchselect .legal-selector .css-26l3qy-menu {
2095
2319
  border-radius: 4px;
2096
2320
  box-shadow: 0 2px 6px 0 rgba(2, 55, 74, 0.25);
2097
2321
  font-size: 0.875rem; }
2098
2322
  .e-searchselect .legal-selector .css-9gakcf-option {
2099
- background-color: #F8F9FA;
2100
- color: #3D4042; }
2323
+ background-color: var(--neutral-neutral-6);
2324
+ color: var(--neutral-neutral-1); }
2101
2325
  .e-searchselect .legal-selector .css-1uccc91-singleValue {
2102
2326
  font-size: 0.875rem;
2103
2327
  transition: all 0.3s ease; }
@@ -2106,32 +2330,32 @@
2106
2330
  .e-searchselect .legal-selector .css-1n7v3ny-option {
2107
2331
  background-color: transparent; }
2108
2332
  .e-searchselect .legal-selector .css-1n7v3ny-option:hover {
2109
- background-color: #DBE1E5; }
2333
+ background-color: var(--neutral-neutral-4); }
2110
2334
  .e-searchselect .legal-selector:hover {
2111
- box-shadow: 0 0 0 1px #6D7275; }
2335
+ box-shadow: 0 0 0 1px var(--neutral-neutral-2); }
2112
2336
  .e-searchselect .legal-selector:active, .e-searchselect .legal-selector:focus {
2113
2337
  outline: none; }
2114
2338
  .e-searchselect.--group-invalid .legal-selector {
2115
- box-shadow: 0 0 0 1px #D63737; }
2339
+ box-shadow: 0 0 0 1px var(--error-main); }
2116
2340
  .e-searchselect.--group-invalid .css-yk16xz-control {
2117
- background-color: #FFECEF; }
2341
+ background-color: var(--error-error-3); }
2118
2342
  .e-searchselect.--is-invalid .e-searchselect--error {
2119
2343
  display: flex;
2120
2344
  align-content: center;
2121
2345
  position: absolute;
2122
2346
  bottom: 0;
2123
2347
  margin-top: 0.5rem;
2124
- color: #D63737; }
2348
+ color: var(--error-main); }
2125
2349
  .e-searchselect.--is-invalid .e-searchselect--error img {
2126
2350
  max-width: 20px;
2127
2351
  margin-right: 0.25rem; }
2128
2352
  .e-searchselect.--is-invalid .legal-selector {
2129
- box-shadow: 0 0 0 1px #D63737; }
2353
+ box-shadow: 0 0 0 1px var(--error-main); }
2130
2354
  .e-searchselect.--is-invalid .css-yk16xz-control {
2131
- background-color: #FFECEF; }
2355
+ background-color: var(--error-error-3); }
2132
2356
 
2133
2357
  .searchselect__label {
2134
- color: #3D4042; }
2358
+ color: var(--neutral-neutral-1); }
2135
2359
 
2136
2360
  .searchselect--fullwidth {
2137
2361
  max-width: 100%; }
@@ -2162,7 +2386,7 @@
2162
2386
 
2163
2387
  .tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}
2164
2388
  .tippy-box {
2165
- background-color: #FFFFFF;
2389
+ background-color: var(--others-white);
2166
2390
  border-radius: 4px;
2167
2391
  font-size: 16px;
2168
2392
  line-height: 1.4;
@@ -2174,7 +2398,7 @@
2174
2398
  color: inherit;
2175
2399
  cursor: pointer; }
2176
2400
  .tippy-box--inverted {
2177
- background-color: #3D4042;
2401
+ background-color: var(--neutral-neutral-1);
2178
2402
  color: white;
2179
2403
  border-radius: 0.3rem;
2180
2404
  font-size: 12px;
@@ -2183,7 +2407,7 @@
2183
2407
  padding: .75rem;
2184
2408
  white-space: pre-line; }
2185
2409
  .tippy-box--inverted .tippy-arrow {
2186
- color: #3D4042; }
2410
+ color: var(--neutral-neutral-1); }
2187
2411
  .tippy-box .tooltip__button {
2188
2412
  align-items: center;
2189
2413
  display: inline-flex;
@@ -2196,17 +2420,17 @@
2196
2420
  width: 1.5rem;
2197
2421
  margin-right: 0.5rem; }
2198
2422
  .tippy-box .tooltip__button > svg g g {
2199
- fill: #3D4042; }
2423
+ fill: var(--neutral-neutral-1); }
2200
2424
 
2201
2425
  .tippy-content {
2202
2426
  padding: 0.5rem; }
2203
2427
 
2204
2428
  .tippy-arrow {
2205
- color: #FFFFFF; }
2429
+ color: var(--others-white); }
2206
2430
 
2207
2431
  .sidemenu-tab {
2208
2432
  padding: 1rem 0.8rem;
2209
- color: #B5BABD;
2433
+ color: var(--neutral-neutral-3);
2210
2434
  background-color: transparent;
2211
2435
  border: none;
2212
2436
  outline: none;
@@ -2216,15 +2440,15 @@
2216
2440
  .sidemenu-tab svg {
2217
2441
  margin-right: 1rem; }
2218
2442
  .sidemenu-tab svg g g {
2219
- fill: #B5BABD; }
2443
+ fill: var(--neutral-neutral-3); }
2220
2444
  .sidemenu-tab--active {
2221
- border-left: 2px solid #5DD8C3;
2222
- color: #5DD8C3;
2223
- background-color: #02374A; }
2445
+ border-left: 2px solid var(--primary-main-light-3);
2446
+ color: var(--primary-main-light-3);
2447
+ background-color: var(--primary-main-dark-1); }
2224
2448
  .sidemenu-tab--active p {
2225
2449
  font-weight: bold; }
2226
2450
  .sidemenu-tab--active svg g g {
2227
- fill: #5DD8C3; }
2451
+ fill: var(--primary-main-light-3); }
2228
2452
  .sidemenu-tab__inner {
2229
2453
  display: flex;
2230
2454
  flex-direction: row;
@@ -2241,14 +2465,14 @@
2241
2465
  .sidemenu-tab--mobile:hover {
2242
2466
  cursor: pointer; }
2243
2467
  .sidemenu-tab--mobile.sidemenu-tab--active {
2244
- color: #078080;
2245
- background-color: #E4F8F3; }
2468
+ color: var(--primary-main-light-1);
2469
+ background-color: var(--primary-main-light-5); }
2246
2470
  .sidemenu-tab--mobile.sidemenu-tab--active .sidemenu-tab__inner p {
2247
2471
  font-weight: bold; }
2248
2472
  .sidemenu-tab--mobile.sidemenu-tab--active .sidemenu-tab__inner svg g g {
2249
- fill: #078080; }
2473
+ fill: var(--primary-main-light-1); }
2250
2474
  .sidemenu-tab--mobile.sidemenu-tab--active .sidemenu-tab__inner svg g g use {
2251
- fill: #078080; }
2475
+ fill: var(--primary-main-light-1); }
2252
2476
  .sidemenu-tab--mobile .sidemenu-tab__inner {
2253
2477
  display: flex;
2254
2478
  flex-direction: column;
@@ -2257,7 +2481,7 @@
2257
2481
  margin-right: 0;
2258
2482
  width: 16px; }
2259
2483
  .sidemenu-tab--mobile svg g g use {
2260
- fill: #6D7275; }
2484
+ fill: var(--neutral-neutral-2); }
2261
2485
 
2262
2486
  .e-spinner {
2263
2487
  animation: rotate 2s linear infinite;
@@ -2275,14 +2499,14 @@
2275
2499
  height: 70px; }
2276
2500
 
2277
2501
  .spinner--primary .path {
2278
- stroke: #05646E; }
2502
+ stroke: var(--primary-main); }
2279
2503
 
2280
2504
  .e-textarea {
2281
2505
  display: flex;
2282
2506
  flex-direction: column-reverse; }
2283
2507
  .e-textarea textarea {
2284
2508
  color: #3D4042;
2285
- background-color: #F8F9FA;
2509
+ background-color: var(--neutral-neutral-6);
2286
2510
  border-radius: 4px;
2287
2511
  padding: .75rem 0 .75rem .75rem;
2288
2512
  font-size: .875rem;
@@ -2295,39 +2519,39 @@
2295
2519
  outline: none;
2296
2520
  resize: vertical; }
2297
2521
  .e-textarea textarea::placeholder {
2298
- color: #6D7275; }
2522
+ color: var(--neutral-neutral-2); }
2299
2523
  .e-textarea textarea:-ms-input-placeholder {
2300
- color: #6D7275; }
2524
+ color: var(--neutral-neutral-2); }
2301
2525
  .e-textarea textarea::-ms-input-placeholder {
2302
- color: #6D7275; }
2526
+ color: var(--neutral-neutral-2); }
2303
2527
  .e-textarea textarea:hover {
2304
- box-shadow: 0 0 0 1px #6D7275; }
2528
+ box-shadow: 0 0 0 1px var(--neutral-neutral-2); }
2305
2529
  .e-textarea textarea:active, .e-textarea textarea:focus {
2306
- box-shadow: 0 0 0 2px #05646E;
2530
+ box-shadow: 0 0 0 2px var(--primary-main);
2307
2531
  outline: none; }
2308
2532
  .e-textarea.--group-invalid input {
2309
- box-shadow: 0 0 0 2px #D63737;
2310
- background-color: #FFECEF; }
2533
+ box-shadow: 0 0 0 2px var(--error-main);
2534
+ background-color: var(--error-error-3); }
2311
2535
  .e-textarea.--group-invalid input:active, .e-textarea.--group-invalid input:focus {
2312
- box-shadow: 0 0 0 2px #05646E;
2536
+ box-shadow: 0 0 0 2px var(--primary-main);
2313
2537
  outline: none;
2314
- background-color: #F8F9FA; }
2538
+ background-color: var(--neutral-neutral-6); }
2315
2539
  .e-textarea.--is-invalid .e-text--error {
2316
2540
  display: flex;
2317
2541
  align-content: center;
2318
2542
  bottom: -1.5rem;
2319
2543
  margin-top: .5rem;
2320
- color: #D63737; }
2544
+ color: var(--error-main); }
2321
2545
  .e-textarea.--is-invalid .e-text--error img {
2322
2546
  max-width: 20px;
2323
2547
  margin-right: .25rem; }
2324
2548
  .e-textarea.--is-invalid textarea {
2325
- box-shadow: 0 0 0 2px #D63737;
2326
- background-color: #FFECEF; }
2549
+ box-shadow: 0 0 0 2px var(--error-main);
2550
+ background-color: var(--error-error-3); }
2327
2551
  .e-textarea.--is-invalid textarea:active, .e-textarea.--is-invalid textarea:focus {
2328
- box-shadow: 0 0 0 2px #05646E;
2552
+ box-shadow: 0 0 0 2px var(--primary-main);
2329
2553
  outline: none;
2330
- background-color: #F8F9FA; }
2554
+ background-color: var(--neutral-neutral-6); }
2331
2555
  .e-textarea .input-icon {
2332
2556
  position: absolute;
2333
2557
  transform: translate(-15%, -65%);
@@ -2341,7 +2565,7 @@
2341
2565
  .e-toggle {
2342
2566
  display: flex;
2343
2567
  align-items: center;
2344
- color: #000000; }
2568
+ color: var(--others-black); }
2345
2569
  .e-toggle .switch {
2346
2570
  position: relative;
2347
2571
  display: inline-block;
@@ -2370,7 +2594,7 @@
2370
2594
  width: 26px;
2371
2595
  left: 4px;
2372
2596
  bottom: 4px;
2373
- background-color: #FFFFFF;
2597
+ background-color: var(--others-white);
2374
2598
  transition: 0.4s;
2375
2599
  border-radius: 50%; }
2376
2600
  .e-toggle input:checked + .slider {
@@ -2395,14 +2619,14 @@
2395
2619
  display: block; } }
2396
2620
  .top-bar-wrapper .top-bar {
2397
2621
  display: flex;
2398
- background-color: #F8F9FA;
2622
+ background-color: var(--neutral-neutral-6);
2399
2623
  font-size: 0.9rem;
2400
2624
  letter-spacing: -0.3px;
2401
2625
  width: 100%;
2402
2626
  height: 100%;
2403
2627
  justify-content: center;
2404
2628
  align-items: flex-end;
2405
- border: 1px solid #DBE1E5; }
2629
+ border: 1px solid var(--neutral-neutral-4); }
2406
2630
  @media (max-width: 575px) {
2407
2631
  .top-bar-wrapper .top-bar {
2408
2632
  align-items: center; } }
@@ -2423,8 +2647,8 @@
2423
2647
  align-items: center;
2424
2648
  width: 100%;
2425
2649
  padding: 1.5rem;
2426
- background-color: #FFFFFF;
2427
- box-shadow: 0 2px 6px 0 #02374A;
2650
+ background-color: var(--others-white);
2651
+ box-shadow: 0 2px 6px 0 var(--primary-main-dark-1);
2428
2652
  color: black; }
2429
2653
  .bottom-overlay-menu .e-button {
2430
2654
  width: 100%; }
@@ -2439,7 +2663,7 @@
2439
2663
  margin-bottom: 0; }
2440
2664
 
2441
2665
  .top-bar-mobile {
2442
- background-color: #F3F7FA;
2666
+ background-color: var(--neutral-neutral-5);
2443
2667
  display: flex;
2444
2668
  padding: 8px 16px;
2445
2669
  justify-content: space-between;
@@ -2471,9 +2695,12 @@
2471
2695
  margin-right: 8px; }
2472
2696
 
2473
2697
  .wide-info-bar {
2474
- background-color: #F8F9FA;
2698
+ background-color: var(--neutral-neutral-6);
2475
2699
  font-family: "Inter", sans-serif;
2476
- color: #02374A; }
2700
+ color: var(--neutral-neutral-1); }
2701
+ .wide-info-bar.green {
2702
+ background-color: var(--primary-main-light-6);
2703
+ color: var(--primary-main-dark-1); }
2477
2704
  .wide-info-bar__wrapper {
2478
2705
  display: flex;
2479
2706
  flex-flow: column nowrap;
@@ -2562,7 +2789,7 @@
2562
2789
  justify-content: center;
2563
2790
  width: 100%;
2564
2791
  background-color: black;
2565
- color: #FFFFFF; }
2792
+ color: var(--others-white); }
2566
2793
  @media (min-width: 575px) {
2567
2794
  .bottom-fixed-bar {
2568
2795
  flex-direction: row;
@@ -2581,7 +2808,7 @@
2581
2808
  margin-right: 2.5rem; } }
2582
2809
  .bottom-fixed-bar__text a {
2583
2810
  text-decoration: underline;
2584
- color: #FFFFFF; }
2811
+ color: var(--others-white); }
2585
2812
  .bottom-fixed-bar__text p {
2586
2813
  margin-bottom: 0; }
2587
2814
  .bottom-fixed-bar__button-container > .e-button {
@@ -2602,7 +2829,7 @@
2602
2829
  .bottom-overlay.show .bottom-overlay__nav {
2603
2830
  transform: translateY(0); }
2604
2831
  .bottom-overlay__background {
2605
- background-color: #032A38;
2832
+ background-color: var(--primary-main-dark-2);
2606
2833
  position: absolute;
2607
2834
  width: 100%;
2608
2835
  height: 100%;
@@ -2612,7 +2839,7 @@
2612
2839
  opacity: 0;
2613
2840
  transition: opacity ease-out 0.3s; }
2614
2841
  .bottom-overlay__nav {
2615
- background: #FFFFFF;
2842
+ background: var(--others-white);
2616
2843
  border-top-left-radius: 4px;
2617
2844
  border-top-right-radius: 4px;
2618
2845
  bottom: 0;
@@ -2629,7 +2856,7 @@
2629
2856
  padding: 0.5rem 0 1.5rem; }
2630
2857
  .bottom-overlay__nav .overlay__delimiter:after {
2631
2858
  content: '';
2632
- background: #B5BABD;
2859
+ background: var(--neutral-neutral-3);
2633
2860
  border-radius: 4px;
2634
2861
  display: block;
2635
2862
  height: 0.25rem;
@@ -2652,13 +2879,13 @@
2652
2879
  padding-right: 1.5rem;
2653
2880
  width: 100%; }
2654
2881
  .bottom-overlay__nav .overlay__footer {
2655
- border-top: solid 1px #DBE1E5;
2882
+ border-top: solid 1px var(--neutral-neutral-4);
2656
2883
  padding: 1.5rem 1.5rem 2rem; }
2657
2884
 
2658
2885
  .box--form {
2659
- background: #FFFFFF;
2886
+ background: var(--others-white);
2660
2887
  border-radius: 4px;
2661
- box-shadow: 0 2px 6px 0 rgba(2, 55, 74, 0.25);
2888
+ box-shadow: 0 2px 6px 0 rgba(var(--primary-main-dark-1), 0.25);
2662
2889
  padding-left: 1.5rem;
2663
2890
  padding-right: 1.5rem; }
2664
2891
  @media (min-width: 1200px) {
@@ -2666,7 +2893,7 @@
2666
2893
  padding-left: 2rem;
2667
2894
  padding-right: 2rem; } }
2668
2895
  .box--form .box--form__title {
2669
- color: #3D4042;
2896
+ color: var(--neutral-neutral-1);
2670
2897
  font-family: "Inter", sans-serif;
2671
2898
  font-weight: bold;
2672
2899
  width: 95%; }
@@ -2676,7 +2903,7 @@
2676
2903
  .box--form .box--form__close {
2677
2904
  display: flex;
2678
2905
  line-height: 1rem;
2679
- color: #3D4042;
2906
+ color: var(--neutral-neutral-1);
2680
2907
  font-size: 35px;
2681
2908
  font-weight: lighter;
2682
2909
  justify-content: flex-end; }
@@ -2687,7 +2914,7 @@
2687
2914
 
2688
2915
  .box--form__header {
2689
2916
  display: flex;
2690
- border-bottom: solid 1px #DBE1E5;
2917
+ border-bottom: solid 1px var(--neutral-neutral-4);
2691
2918
  padding: 1.5rem 0 1rem; }
2692
2919
 
2693
2920
  .box--form__main {
@@ -2709,11 +2936,11 @@
2709
2936
  margin-bottom: 1rem; }
2710
2937
 
2711
2938
  .box--form__button-annotation {
2712
- color: #3D4042; }
2939
+ color: var(--neutral-neutral-1); }
2713
2940
 
2714
2941
  .box--form__footer {
2715
2942
  align-items: center;
2716
- border-top: solid 1px #DBE1E5;
2943
+ border-top: solid 1px var(--neutral-neutral-4);
2717
2944
  display: flex;
2718
2945
  justify-content: space-between;
2719
2946
  padding: 1.5rem 0 1rem 0; }
@@ -2732,7 +2959,7 @@
2732
2959
  white-space: nowrap; } }
2733
2960
 
2734
2961
  .box--form__link {
2735
- color: #05646E; }
2962
+ color: var(--primary-main); }
2736
2963
 
2737
2964
  .body-container {
2738
2965
  display: flex;
@@ -2755,7 +2982,7 @@
2755
2982
  flex-flow: column;
2756
2983
  width: 100%; }
2757
2984
  .contact-box__phone {
2758
- color: #05646E;
2985
+ color: var(--primary-main);
2759
2986
  font-size: 0.9rem;
2760
2987
  font-weight: bold; }
2761
2988
  .contact-box__schedule {
@@ -2764,17 +2991,17 @@
2764
2991
  margin: 0;
2765
2992
  max-width: 12rem; }
2766
2993
  .contact-box--mobile .contact-box__schedule {
2767
- color: #6D7275;
2994
+ color: var(--neutral-neutral-2);
2768
2995
  font-size: 1rem;
2769
2996
  text-align: center;
2770
2997
  margin: 0.5rem 0;
2771
2998
  max-width: none; }
2772
2999
  .contact-box--dark-mode .contact-box__phone {
2773
- color: #EFF7F5; }
3000
+ color: var(--primary-main-light-6); }
2774
3001
  .contact-box--dark-mode .contact-box__schedule {
2775
- color: #B5BABD; }
3002
+ color: var(--neutral-neutral-3); }
2776
3003
  .contact-box--dark-mode .contact-box--mobile.contact-box__schedule {
2777
- color: #B5BABD; }
3004
+ color: var(--neutral-neutral-3); }
2778
3005
  .contact-box .e-button {
2779
3006
  display: flex;
2780
3007
  justify-content: center; }
@@ -2812,13 +3039,13 @@
2812
3039
  justify-content: center;
2813
3040
  align-items: center; }
2814
3041
  .feedback--error .feedback__icon {
2815
- background: #FFECEF; }
3042
+ background: var(--error-error-3); }
2816
3043
  .feedback--error .feedback__title {
2817
- color: #D63737; }
3044
+ color: var(--error-main); }
2818
3045
  .feedback--success .feedback__icon {
2819
- background: #E4F8F3; }
3046
+ background: var(--primary-main-light-5); }
2820
3047
  .feedback--success .feedback__title {
2821
- color: #02374A;
3048
+ color: var(--primary-main-dark-1);
2822
3049
  font-weight: bold; }
2823
3050
  .feedback__icon {
2824
3051
  align-items: center;
@@ -2845,13 +3072,13 @@
2845
3072
  font-weight: bold;
2846
3073
  margin-bottom: 0.5rem; }
2847
3074
  .feedback__text--grey {
2848
- color: #6D7275; }
3075
+ color: var(--neutral-neutral-2); }
2849
3076
  .feedback__buttons {
2850
3077
  display: flex;
2851
3078
  flex-direction: column; }
2852
3079
  .feedback__cancel__a {
2853
3080
  margin-top: 0.5rem;
2854
- color: #05646E;
3081
+ color: var(--primary-main);
2855
3082
  text-decoration: underline; }
2856
3083
  .feedback__cancel__a:hover {
2857
3084
  cursor: pointer; }
@@ -2863,7 +3090,7 @@
2863
3090
  .menu-items-section {
2864
3091
  max-width: 250px; } }
2865
3092
  .menu-items-section__title-wrapper {
2866
- background-color: #F3F7FA;
3093
+ background-color: var(--neutral-neutral-5);
2867
3094
  display: flex;
2868
3095
  flex-direction: row;
2869
3096
  justify-content: center;
@@ -2912,7 +3139,7 @@
2912
3139
  display: flex; }
2913
3140
  .pagination__control svg {
2914
3141
  cursor: pointer;
2915
- fill: #6D7275;
3142
+ fill: var(--neutral-neutral-2);
2916
3143
  width: 1rem; }
2917
3144
  .pagination__control svg path {
2918
3145
  pointer-events: none; }
@@ -2927,11 +3154,11 @@
2927
3154
  margin: 0 1rem; }
2928
3155
  .pagination__page {
2929
3156
  align-items: center;
2930
- background: #F8F9FA;
2931
- border: 2px solid #B5BABD;
3157
+ background: var(--neutral-neutral-6);
3158
+ border: 2px solid var(--neutral-neutral-3);
2932
3159
  border-radius: 4px;
2933
3160
  box-sizing: border-box;
2934
- color: #6D7275;
3161
+ color: var(--neutral-neutral-2);
2935
3162
  cursor: pointer;
2936
3163
  display: flex;
2937
3164
  justify-content: center;
@@ -2940,9 +3167,9 @@
2940
3167
  min-width: 2.125rem;
2941
3168
  padding: 0.3rem; }
2942
3169
  .pagination__page--active {
2943
- background: #DBE1E5;
2944
- border: 2px solid #6D7275;
2945
- color: #3D4042; }
3170
+ background: var(--neutral-neutral-4);
3171
+ border: 2px solid var(--neutral-neutral-2);
3172
+ color: var(--neutral-neutral-1); }
2946
3173
  .pagination__page--ellipsis {
2947
3174
  cursor: default; }
2948
3175
 
@@ -2954,13 +3181,13 @@
2954
3181
  .pricing-card.--selectable .pricing-card__radio-label {
2955
3182
  cursor: pointer; }
2956
3183
  .pricing-card.--selectable:not(.--selected):hover .pricing-card__wrapper {
2957
- border-color: #B5BABD; }
3184
+ border-color: var(--neutral-neutral-3); }
2958
3185
  .pricing-card.--selected .pricing-card__wrapper {
2959
- border-color: #5DD8C3; }
3186
+ border-color: var(--primary-main-light-3); }
2960
3187
  .pricing-card__radio-label .radio-input {
2961
3188
  display: none; }
2962
3189
  .pricing-card__radio-label .radio-input + .radio-checkbox {
2963
- background-color: #FFFFFF;
3190
+ background-color: var(--others-white);
2964
3191
  position: absolute;
2965
3192
  top: 1rem;
2966
3193
  left: 1rem;
@@ -2969,10 +3196,10 @@
2969
3196
  border-radius: 50%;
2970
3197
  border: 1px solid; }
2971
3198
  .pricing-card__radio-label .radio-input:checked + .radio-checkbox {
2972
- border: 5px solid #078080; }
3199
+ border: 5px solid var(--primary-main-light-1); }
2973
3200
  .pricing-card__wrapper {
2974
- background-color: #FFFFFF;
2975
- box-shadow: 0 2px 6px 0 rgba(2, 55, 74, 0.25);
3201
+ background-color: var(--others-white);
3202
+ box-shadow: 0 2px 6px 0 rgba(var(--primary-main-dark-1), 0.25);
2976
3203
  border-radius: 4px;
2977
3204
  border: solid 1px transparent; }
2978
3205
  .pricing-card__wrapper ul {
@@ -2993,12 +3220,12 @@
2993
3220
  .pricing-card__header {
2994
3221
  padding: 1rem;
2995
3222
  text-align: center;
2996
- background: #F8F9FA; }
3223
+ background: var(--neutral-neutral-6); }
2997
3224
  .pricing-card__header__text {
2998
- color: #6D7275;
3225
+ color: var(--neutral-neutral-2);
2999
3226
  margin: 0 1rem; }
3000
3227
  .pricing-card__body {
3001
- color: #3D4042;
3228
+ color: var(--neutral-neutral-1);
3002
3229
  display: flex;
3003
3230
  flex-flow: column nowrap;
3004
3231
  padding: 1.5rem 1rem;
@@ -3019,7 +3246,7 @@
3019
3246
  margin-left: 0.2rem; }
3020
3247
  .pricing-card__body__text {
3021
3248
  font-size: 0.85rem;
3022
- color: #6D7275;
3249
+ color: var(--neutral-neutral-2);
3023
3250
  order: 4; }
3024
3251
  .pricing-card__body__features-list {
3025
3252
  display: none;
@@ -3031,11 +3258,11 @@
3031
3258
  display: block; }
3032
3259
  .pricing-card__body__features-list hr {
3033
3260
  width: 100%;
3034
- border-top: 1px solid #DBE1E5;
3261
+ border-top: 1px solid var(--neutral-neutral-4);
3035
3262
  margin-bottom: 1.5rem; }
3036
3263
  .pricing-card__body__features-list__item::before {
3037
3264
  content: '\2022';
3038
- color: #05646E;
3265
+ color: var(--primary-main);
3039
3266
  font-weight: bold;
3040
3267
  display: inline-block;
3041
3268
  margin-right: 1rem; }
@@ -3049,7 +3276,7 @@
3049
3276
  .pricing-card__body .e-button.see-more-button {
3050
3277
  display: none; } }
3051
3278
  .pricing-card__disclaimer {
3052
- color: #6D7275;
3279
+ color: var(--neutral-neutral-2);
3053
3280
  font-size: 0.75rem;
3054
3281
  text-align: center;
3055
3282
  width: 100%;
@@ -3064,7 +3291,7 @@
3064
3291
  width: 100%; }
3065
3292
 
3066
3293
  .snackbar {
3067
- color: #1E2021;
3294
+ color: var(--neutral-main);
3068
3295
  line-height: 1.5;
3069
3296
  margin-bottom: 1em;
3070
3297
  padding: 0.5em 0 0.5em 0;
@@ -3109,27 +3336,27 @@
3109
3336
  .snackbar-close-icon {
3110
3337
  line-height: 2; } }
3111
3338
  .snackbar--welcome {
3112
- background-color: #1E2021;
3113
- color: #FFFFFF;
3114
- border: 1px solid #6D7275; }
3339
+ background-color: var(--neutral-main);
3340
+ color: var(--others-white);
3341
+ border: 1px solid var(--neutral-neutral-2); }
3115
3342
  .snackbar--welcome:before {
3116
3343
  background: url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E %3Cdefs%3E %3Cpath id%3D%22prefix__a%22 d%3D%22M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12zM7 9h2v2H7V9zm4 0h2v2h-2V9zm4 0h2v2h-2V9z%22%2F%3E %3C%2Fdefs%3E %3Cg fill%3D%22none%22 fill-rule%3D%22evenodd%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22%2F%3E %3Cmask id%3D%22prefix__b%22 fill%3D%22%23fff%22%3E %3Cuse xlink%3Ahref%3D%22%23prefix__a%22%2F%3E %3C%2Fmask%3E %3Cg fill%3D%22%235DD8C3%22 mask%3D%22url(%23prefix__b)%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22%2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E") no-repeat; }
3117
3344
  .snackbar--success {
3118
- background-color: #5DD8C3;
3119
- color: #02374A;
3120
- border: 1px solid #34B2A7; }
3345
+ background-color: var(--primary-main-light-3);
3346
+ color: var(--primary-main-dark-1);
3347
+ border: 1px solid var(--primary-main-light-2); }
3121
3348
  .snackbar--success:before {
3122
3349
  background: url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E %3Cdefs%3E %3Cpath id%3D%22prefix__a%22 d%3D%22M8.8 15.9L4.6 11.7 3.2 13.1 8.8 18.7 20.8 6.7 19.4 5.3z%22%2F%3E %3C%2Fdefs%3E %3Cg fill%3D%22none%22 fill-rule%3D%22evenodd%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22%2F%3E %3Cmask id%3D%22prefix__b%22 fill%3D%22%23fff%22%3E %3Cuse xlink%3Ahref%3D%22%23prefix__a%22%2F%3E %3C%2Fmask%3E %3Cg fill%3D%22%2302374A%22 mask%3D%22url(%23prefix__b)%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22%2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E") no-repeat; }
3123
3350
  .snackbar--error {
3124
- background-color: #D63737;
3125
- color: #FFFFFF;
3126
- border: 1px solid #F09D9E; }
3351
+ background-color: var(--error-main);
3352
+ color: var(--others-white);
3353
+ border: 1px solid var(--error-error-2); }
3127
3354
  .snackbar--error:before {
3128
3355
  background: url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E %3Cdefs%3E %3Cpath id%3D%22prefix__a%22 d%3D%22M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-9h2v6h-2v-6zm0-4h2v2h-2V7z%22 %2F%3E %3C%2Fdefs%3E %3Cg fill%3D%22none%22 fill-rule%3D%22evenodd%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22 %2F%3E %3Cmask id%3D%22prefix__b%22 fill%3D%22%23fff%22%3E %3Cuse xlink%3Ahref%3D%22%23prefix__a%22 %2F%3E %3C%2Fmask%3E %3Cuse fill%3D%22%23000%22 fill-rule%3D%22nonzero%22 xlink%3Ahref%3D%22%23prefix__a%22 %2F%3E %3Cg fill%3D%22%23FFF%22 mask%3D%22url(%23prefix__b)%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22 %2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E") no-repeat; }
3129
3356
  .snackbar--reminder {
3130
- background-color: #F2BD6A;
3131
- color: #1E2021;
3132
- border: 1px solid #CD9A4C; }
3357
+ background-color: var(--secondary-main);
3358
+ color: var(--neutral-main);
3359
+ border: 1px solid var(--secondary-main-dark-1); }
3133
3360
  .snackbar--reminder:before {
3134
3361
  background: url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E %3Cdefs%3E %3Cpath id%3D%22prefix__a%22 d%3D%22M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12zM7 9h2v2H7V9zm4 0h2v2h-2V9zm4 0h2v2h-2V9z%22%2F%3E %3C%2Fdefs%3E %3Cg fill%3D%22none%22 fill-rule%3D%22evenodd%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22%2F%3E %3Cmask id%3D%22prefix__b%22 fill%3D%22%23fff%22%3E %3Cuse xlink%3Ahref%3D%22%23prefix__a%22%2F%3E %3C%2Fmask%3E %3Cg fill%3D%22%23936C2F%22 mask%3D%22url(%23prefix__b)%22%3E %3Cpath d%3D%22M0 0H24V24H0z%22%2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E") no-repeat; }
3135
3362
  .snackbar-content {
@@ -3154,7 +3381,7 @@
3154
3381
  .snackbar .e-button.remove-yellow {
3155
3382
  border-color: transparent; }
3156
3383
  .snackbar .e-button.remove-yellow:hover {
3157
- background-color: #FFFFFF; }
3384
+ background-color: var(--others-white); }
3158
3385
 
3159
3386
  .homeStepsItem {
3160
3387
  border-radius: 4px;
@@ -3166,7 +3393,7 @@
3166
3393
  width: 100%;
3167
3394
  align-items: flex-start;
3168
3395
  text-align: center;
3169
- background: #FFFFFF;
3396
+ background: var(--others-white);
3170
3397
  box-shadow: 0 0.25rem 0.5rem 0 rgba(2, 55, 74, 0.2);
3171
3398
  border: 4px;
3172
3399
  margin-right: 0.5rem;
@@ -3231,7 +3458,7 @@
3231
3458
  .homeStepsItem p {
3232
3459
  margin-bottom: 1.5rem; } }
3233
3460
  .homeStepsItem small {
3234
- color: #6D7275; }
3461
+ color: var(--neutral-neutral-2); }
3235
3462
  .homeStepsItem:not(:first-child) .gatsby-image-wrapper {
3236
3463
  width: 100%; }
3237
3464
 
@@ -3247,8 +3474,8 @@
3247
3474
  -webkit-appearance: none;
3248
3475
  -moz-appearance: none;
3249
3476
  appearance: none;
3250
- color: #3D4042;
3251
- background-color: #F8F9FA;
3477
+ color: var(--neutral-neutral-1);
3478
+ background-color: var(--neutral-neutral-6);
3252
3479
  border-radius: 4px;
3253
3480
  padding: 0.75rem 0 0.75rem 0.75rem;
3254
3481
  font-size: 0.875rem;
@@ -3256,25 +3483,25 @@
3256
3483
  border: none;
3257
3484
  text-overflow: ellipsis;
3258
3485
  transition: box-shadow 0.3s ease;
3259
- box-shadow: 0 0 0 1px #B5BABD;
3486
+ box-shadow: 0 0 0 1px var(--neutral-neutral-3);
3260
3487
  margin: 0.0005em;
3261
3488
  outline: none; }
3262
3489
  .e-text input::placeholder {
3263
- color: #6D7275; }
3490
+ color: var(--neutral-neutral-2); }
3264
3491
  .e-text input:-ms-input-placeholder {
3265
- color: #6D7275; }
3492
+ color: var(--neutral-neutral-2); }
3266
3493
  .e-text input::-ms-input-placeholder {
3267
- color: #6D7275; }
3494
+ color: var(--neutral-neutral-2); }
3268
3495
  .e-text input:hover {
3269
- box-shadow: 0 0 0 1px #6D7275; }
3496
+ box-shadow: 0 0 0 1px var(--neutral-neutral-2); }
3270
3497
  .e-text input:active, .e-text input:focus {
3271
- box-shadow: 0 0 0 2px #05646E;
3498
+ box-shadow: 0 0 0 2px var(--primary-main);
3272
3499
  outline: none; }
3273
3500
  .e-text .form-group__label {
3274
- color: #3D4042;
3501
+ color: var(--neutral-neutral-1);
3275
3502
  font-weight: bold; }
3276
3503
  .e-text .form-group__label-icon {
3277
- color: #3D4042;
3504
+ color: var(--neutral-neutral-1);
3278
3505
  font-weight: bold;
3279
3506
  display: flex;
3280
3507
  align-items: center; }
@@ -3292,12 +3519,12 @@
3292
3519
  .e-text__children {
3293
3520
  margin-top: 0.5rem; }
3294
3521
  .e-text--group-invalid input {
3295
- box-shadow: 0 0 0 2px #D63737;
3296
- background-color: #FFECEF; }
3522
+ box-shadow: 0 0 0 2px var(--error-main);
3523
+ background-color: var(--error-error-3); }
3297
3524
  .e-text--group-invalid input:active, .e-text--group-invalid input:focus {
3298
- box-shadow: 0 0 0 2px #05646E;
3525
+ box-shadow: 0 0 0 2px var(--primary-main);
3299
3526
  outline: none;
3300
- background-color: #F8F9FA; }
3527
+ background-color: var(--neutral-neutral-6); }
3301
3528
  .e-text--is-invalid {
3302
3529
  margin-bottom: 4rem; }
3303
3530
  .e-text--is-invalid .e-text__error {
@@ -3306,7 +3533,7 @@
3306
3533
  position: absolute;
3307
3534
  bottom: -5.5rem;
3308
3535
  margin-top: 0.5rem;
3309
- color: #D63737;
3536
+ color: var(--error-main);
3310
3537
  height: 5rem; }
3311
3538
  .e-text--is-invalid .e-text__error-icon {
3312
3539
  display: flex; }
@@ -3328,12 +3555,12 @@
3328
3555
  .e-text--is-invalid .e-text__error img {
3329
3556
  height: 20px; } }
3330
3557
  .e-text--is-invalid input {
3331
- box-shadow: 0 0 0 2px #D63737;
3332
- background-color: #FFECEF; }
3558
+ box-shadow: 0 0 0 2px var(--error-main);
3559
+ background-color: var(--error-error-3); }
3333
3560
  .e-text--is-invalid input:active, .e-text--is-invalid input:focus {
3334
- box-shadow: 0 0 0 2px #05646E;
3561
+ box-shadow: 0 0 0 2px var(--primary-main);
3335
3562
  outline: none;
3336
- background-color: #F8F9FA; }
3563
+ background-color: var(--neutral-neutral-6); }
3337
3564
  .e-text .input-icon {
3338
3565
  position: absolute;
3339
3566
  transform: translate(-15%, -65%);
@@ -3355,7 +3582,7 @@
3355
3582
 
3356
3583
  .tooltip-menu__item {
3357
3584
  border-radius: 4px;
3358
- border: 1px solid #DBE1E5;
3585
+ border: 1px solid var(--neutral-neutral-4);
3359
3586
  display: flex;
3360
3587
  padding: 0.1875rem;
3361
3588
  margin-right: .5rem;
@@ -3364,7 +3591,7 @@
3364
3591
  cursor: pointer; }
3365
3592
  .tooltip-menu__item span {
3366
3593
  position: absolute;
3367
- color: #6D7275;
3594
+ color: var(--neutral-neutral-2);
3368
3595
  bottom: -1.25rem;
3369
3596
  left: -.25rem;
3370
3597
  right: 0;
@@ -3374,9 +3601,9 @@
3374
3601
  transform: translateY(1rem);
3375
3602
  transition: all .3s ease; }
3376
3603
  .tooltip-menu__item.--is-open {
3377
- background-color: #E4F8F3; }
3604
+ background-color: var(--primary-main-light-5); }
3378
3605
  .tooltip-menu__item:hover {
3379
- background-color: #E4F8F3; }
3606
+ background-color: var(--primary-main-light-5); }
3380
3607
  .tooltip-menu__item:hover span {
3381
3608
  transform: translate(0);
3382
3609
  visibility: visible;
@@ -3425,7 +3652,7 @@
3425
3652
  padding: 0; } }
3426
3653
 
3427
3654
  .mobile-bottom-bar {
3428
- background: #FFFFFF;
3655
+ background: var(--others-white);
3429
3656
  position: fixed;
3430
3657
  display: flex;
3431
3658
  flex-direction: row;
@@ -3473,7 +3700,7 @@
3473
3700
  margin-top: 0;
3474
3701
  margin-bottom: 3rem; } }
3475
3702
  .about-us-content__body .m-richText a {
3476
- color: #05646E; }
3703
+ color: var(--primary-main); }
3477
3704
  .about-us-content__body__button {
3478
3705
  margin-top: 2rem;
3479
3706
  font-family: "Inter", sans-serif; }
@@ -3501,10 +3728,10 @@
3501
3728
  justify-content: center;
3502
3729
  text-align: center; }
3503
3730
  .as-see-in-content__text #articles, .as-see-in-content__text #legal-documents {
3504
- color: #078080;
3731
+ color: var(--primary-main-light-1);
3505
3732
  font-weight: 400; }
3506
3733
  .as-see-in-content__text a {
3507
- color: #078080;
3734
+ color: var(--primary-main-light-1);
3508
3735
  font-weight: 400 !important; }
3509
3736
 
3510
3737
  .guidelines-section__texts {
@@ -3514,7 +3741,7 @@
3514
3741
  justify-content: center;
3515
3742
  margin-bottom: 1rem;
3516
3743
  margin-right: 0;
3517
- color: #3D4042;
3744
+ color: var(--neutral-neutral-1);
3518
3745
  font-style: normal;
3519
3746
  font-weight: 400;
3520
3747
  letter-spacing: -0.3px; }
@@ -3540,7 +3767,7 @@
3540
3767
  font-size: 16px;
3541
3768
  line-height: 22px; }
3542
3769
  .guidelines-section__texts__body a {
3543
- color: #078080;
3770
+ color: var(--primary-main-light-1);
3544
3771
  font-weight: 400 !important; }
3545
3772
 
3546
3773
  .guidelines-section__image {
@@ -3564,7 +3791,7 @@
3564
3791
  justify-content: center;
3565
3792
  margin-bottom: 1rem;
3566
3793
  margin-right: 0;
3567
- color: #3D4042;
3794
+ color: var(--neutral-neutral-1);
3568
3795
  font-style: normal;
3569
3796
  font-weight: 400;
3570
3797
  letter-spacing: -0.3px; }
@@ -3586,7 +3813,7 @@
3586
3813
  font-size: 16px;
3587
3814
  line-height: 22px; }
3588
3815
  .try-our-free-legal-blogs-section__texts__body a {
3589
- color: #078080;
3816
+ color: var(--primary-main-light-1);
3590
3817
  font-weight: 400 !important; }
3591
3818
 
3592
3819
  .try-our-free-legal-blogs-section__image {
@@ -3604,7 +3831,7 @@
3604
3831
  .blog {
3605
3832
  max-width: 1200px; } }
3606
3833
  .blog .blog__title {
3607
- color: #02374A; }
3834
+ color: var(--primary-main-dark-1); }
3608
3835
  @media (min-width: 960px) {
3609
3836
  .blog .blog__title {
3610
3837
  margin-bottom: 3rem; } }
@@ -3617,7 +3844,7 @@
3617
3844
  width: auto; } }
3618
3845
 
3619
3846
  .how-it-works-wrapper {
3620
- background-color: #F8F9FA; }
3847
+ background-color: var(--neutral-neutral-6); }
3621
3848
  @media (min-width: 960px) {
3622
3849
  .how-it-works-wrapper {
3623
3850
  background-repeat: no-repeat;
@@ -3644,7 +3871,7 @@
3644
3871
 
3645
3872
  .about-us-section {
3646
3873
  padding-top: 1.125rem;
3647
- background: #EFF7F5;
3874
+ background: var(--primary-main-light-6);
3648
3875
  margin-bottom: 3rem; }
3649
3876
  @media (min-width: 960px) {
3650
3877
  .about-us-section {
@@ -3658,9 +3885,9 @@
3658
3885
  line-height: 1.2;
3659
3886
  font-weight: 700;
3660
3887
  font-family: "Inter", sans-serif;
3661
- color: #6D7275;
3888
+ color: var(--neutral-neutral-2);
3662
3889
  padding-bottom: 0.5rem;
3663
- border-bottom: 1px solid #B5BABD; }
3890
+ border-bottom: 1px solid var(--neutral-neutral-3); }
3664
3891
  .about-us-section__sub-title {
3665
3892
  margin-bottom: 1.5rem;
3666
3893
  text-align: center;
@@ -3669,7 +3896,7 @@
3669
3896
  letter-spacing: -0.4px;
3670
3897
  font-weight: 400;
3671
3898
  font-family: "Lora", serif;
3672
- color: #3D4042; }
3899
+ color: var(--neutral-neutral-1); }
3673
3900
  @media (min-width: 720px) {
3674
3901
  .about-us-section__sub-title {
3675
3902
  font-size: 2.3rem;