@npm_leadtech/legal-lib-components 2.9.3 → 2.10.1

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 (7) hide show
  1. package/dist/cjs/index.js.map +1 -1
  2. package/dist/cjs/legal-lib-components.css +580 -356
  3. package/dist/cjs/src/components/atoms/AddButton/AddButton.d.ts +1 -0
  4. package/dist/esm/index.js.map +1 -1
  5. package/dist/esm/legal-lib-components.css +580 -356
  6. package/dist/esm/src/components/atoms/AddButton/AddButton.d.ts +1 -0
  7. package/package.json +3 -1
package/dist/cjs/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,8 +1522,8 @@
1298
1522
  align-self: center; } }
1299
1523
  .dialog-menu-icon__message {
1300
1524
  visibility: hidden;
1301
- background-color: #3D4042;
1302
- color: white;
1525
+ background-color: var(--neutral-neutral-1);
1526
+ color: var(--others-white);
1303
1527
  padding: 1rem 1rem;
1304
1528
  border-radius: 0.3rem;
1305
1529
  font-size: 12px;
@@ -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,16 +1698,16 @@
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
- background-color: white;
1710
+ background-color: var(--others-white);
1487
1711
  border-radius: 2px;
1488
1712
  font-family: Roboto, sans-serif;
1489
1713
  color: rgba(0, 0, 0, 0.54); }
@@ -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,20 +2386,20 @@
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;
2169
2393
  white-space: normal;
2170
2394
  outline: 0;
2171
2395
  transition: all 0.3s ease;
2172
- box-shadow: 0 0.25rem 0.5rem 0.25rem rgba(2, 55, 74, 0.2);
2396
+ box-shadow: 0 0.25rem 0.5rem 0.25rem rgba(var(--primary-main-dark-1), 0.2);
2173
2397
  z-index: 1000;
2174
2398
  color: inherit;
2175
2399
  cursor: pointer; }
2176
2400
  .tippy-box--inverted {
2177
- background-color: #3D4042;
2178
- color: white;
2401
+ background-color: var(--neutral-neutral-1);
2402
+ color: var(--others-white);
2179
2403
  border-radius: 0.3rem;
2180
2404
  font-size: 12px;
2181
2405
  box-shadow: none; }
@@ -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;
@@ -2265,7 +2489,7 @@
2265
2489
  width: 50px;
2266
2490
  height: 50px; }
2267
2491
  .e-spinner .path {
2268
- stroke: white;
2492
+ stroke: var(--others-white);
2269
2493
  stroke-linecap: round;
2270
2494
  stroke-dasharray: 15, 150;
2271
2495
  animation: dash 1.5s ease-in-out 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
- color: #3D4042;
2285
- background-color: #F8F9FA;
2508
+ color: var(--neutral-neutral-2);
2509
+ background-color: var(--neutral-neutral-6);
2286
2510
  border-radius: 4px;
2287
2511
  padding: .75rem 0 .75rem .75rem;
2288
2512
  font-size: .875rem;
@@ -2290,44 +2514,44 @@
2290
2514
  border: none;
2291
2515
  text-overflow: ellipsis;
2292
2516
  transition: box-shadow .3s ease;
2293
- box-shadow: 0 0 0 1px #B5BABD;
2517
+ box-shadow: 0 0 0 1px var(--neutral-neutral-3);
2294
2518
  margin: .0005em;
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,12 +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: #3D4042; }
2700
+ color: var(--neutral-neutral-1); }
2477
2701
  .wide-info-bar.green {
2478
- background-color: #EFF7F5;
2479
- color: #02374A; }
2702
+ background-color: var(--primary-main-light-6);
2703
+ color: var(--primary-main-dark-1); }
2480
2704
  .wide-info-bar__wrapper {
2481
2705
  display: flex;
2482
2706
  flex-flow: column nowrap;
@@ -2498,7 +2722,7 @@
2498
2722
  flex-flow: row wrap;
2499
2723
  flex: 1 1 0;
2500
2724
  border-radius: 4px;
2501
- box-shadow: 0 0.125rem 0.375rem 0 rgba(2, 55, 74, 0.25);
2725
+ box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--primary-main-dark-1), 0.25);
2502
2726
  max-width: 960px;
2503
2727
  margin: 1rem 0; }
2504
2728
  @media (min-width: 960px) {
@@ -2565,7 +2789,7 @@
2565
2789
  justify-content: center;
2566
2790
  width: 100%;
2567
2791
  background-color: black;
2568
- color: #FFFFFF; }
2792
+ color: var(--others-white); }
2569
2793
  @media (min-width: 575px) {
2570
2794
  .bottom-fixed-bar {
2571
2795
  flex-direction: row;
@@ -2584,7 +2808,7 @@
2584
2808
  margin-right: 2.5rem; } }
2585
2809
  .bottom-fixed-bar__text a {
2586
2810
  text-decoration: underline;
2587
- color: #FFFFFF; }
2811
+ color: var(--others-white); }
2588
2812
  .bottom-fixed-bar__text p {
2589
2813
  margin-bottom: 0; }
2590
2814
  .bottom-fixed-bar__button-container > .e-button {
@@ -2605,7 +2829,7 @@
2605
2829
  .bottom-overlay.show .bottom-overlay__nav {
2606
2830
  transform: translateY(0); }
2607
2831
  .bottom-overlay__background {
2608
- background-color: #032A38;
2832
+ background-color: var(--primary-main-dark-2);
2609
2833
  position: absolute;
2610
2834
  width: 100%;
2611
2835
  height: 100%;
@@ -2615,7 +2839,7 @@
2615
2839
  opacity: 0;
2616
2840
  transition: opacity ease-out 0.3s; }
2617
2841
  .bottom-overlay__nav {
2618
- background: #FFFFFF;
2842
+ background: var(--others-white);
2619
2843
  border-top-left-radius: 4px;
2620
2844
  border-top-right-radius: 4px;
2621
2845
  bottom: 0;
@@ -2632,14 +2856,14 @@
2632
2856
  padding: 0.5rem 0 1.5rem; }
2633
2857
  .bottom-overlay__nav .overlay__delimiter:after {
2634
2858
  content: '';
2635
- background: #B5BABD;
2859
+ background: var(--neutral-neutral-3);
2636
2860
  border-radius: 4px;
2637
2861
  display: block;
2638
2862
  height: 0.25rem;
2639
2863
  margin: 0 auto;
2640
2864
  width: 7.5rem; }
2641
2865
  .bottom-overlay__nav .overlay__delimiter.overlay__delimiter__scrolling {
2642
- box-shadow: 0 0.125rem 0.375rem 0 rgba(2, 55, 74, 0.25);
2866
+ box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--primary-main-dark-1), 0.25);
2643
2867
  position: relative;
2644
2868
  z-index: 1; }
2645
2869
  @media (min-width: 720px) {
@@ -2655,13 +2879,13 @@
2655
2879
  padding-right: 1.5rem;
2656
2880
  width: 100%; }
2657
2881
  .bottom-overlay__nav .overlay__footer {
2658
- border-top: solid 1px #DBE1E5;
2882
+ border-top: solid 1px var(--neutral-neutral-4);
2659
2883
  padding: 1.5rem 1.5rem 2rem; }
2660
2884
 
2661
2885
  .box--form {
2662
- background: #FFFFFF;
2886
+ background: var(--others-white);
2663
2887
  border-radius: 4px;
2664
- 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);
2665
2889
  padding-left: 1.5rem;
2666
2890
  padding-right: 1.5rem; }
2667
2891
  @media (min-width: 1200px) {
@@ -2669,7 +2893,7 @@
2669
2893
  padding-left: 2rem;
2670
2894
  padding-right: 2rem; } }
2671
2895
  .box--form .box--form__title {
2672
- color: #3D4042;
2896
+ color: var(--neutral-neutral-1);
2673
2897
  font-family: "Inter", sans-serif;
2674
2898
  font-weight: bold;
2675
2899
  width: 95%; }
@@ -2679,7 +2903,7 @@
2679
2903
  .box--form .box--form__close {
2680
2904
  display: flex;
2681
2905
  line-height: 1rem;
2682
- color: #3D4042;
2906
+ color: var(--neutral-neutral-1);
2683
2907
  font-size: 35px;
2684
2908
  font-weight: lighter;
2685
2909
  justify-content: flex-end; }
@@ -2690,7 +2914,7 @@
2690
2914
 
2691
2915
  .box--form__header {
2692
2916
  display: flex;
2693
- border-bottom: solid 1px #DBE1E5;
2917
+ border-bottom: solid 1px var(--neutral-neutral-4);
2694
2918
  padding: 1.5rem 0 1rem; }
2695
2919
 
2696
2920
  .box--form__main {
@@ -2712,11 +2936,11 @@
2712
2936
  margin-bottom: 1rem; }
2713
2937
 
2714
2938
  .box--form__button-annotation {
2715
- color: #3D4042; }
2939
+ color: var(--neutral-neutral-1); }
2716
2940
 
2717
2941
  .box--form__footer {
2718
2942
  align-items: center;
2719
- border-top: solid 1px #DBE1E5;
2943
+ border-top: solid 1px var(--neutral-neutral-4);
2720
2944
  display: flex;
2721
2945
  justify-content: space-between;
2722
2946
  padding: 1.5rem 0 1rem 0; }
@@ -2735,7 +2959,7 @@
2735
2959
  white-space: nowrap; } }
2736
2960
 
2737
2961
  .box--form__link {
2738
- color: #05646E; }
2962
+ color: var(--primary-main); }
2739
2963
 
2740
2964
  .body-container {
2741
2965
  display: flex;
@@ -2758,7 +2982,7 @@
2758
2982
  flex-flow: column;
2759
2983
  width: 100%; }
2760
2984
  .contact-box__phone {
2761
- color: #05646E;
2985
+ color: var(--primary-main);
2762
2986
  font-size: 0.9rem;
2763
2987
  font-weight: bold; }
2764
2988
  .contact-box__schedule {
@@ -2767,17 +2991,17 @@
2767
2991
  margin: 0;
2768
2992
  max-width: 12rem; }
2769
2993
  .contact-box--mobile .contact-box__schedule {
2770
- color: #6D7275;
2994
+ color: var(--neutral-neutral-2);
2771
2995
  font-size: 1rem;
2772
2996
  text-align: center;
2773
2997
  margin: 0.5rem 0;
2774
2998
  max-width: none; }
2775
2999
  .contact-box--dark-mode .contact-box__phone {
2776
- color: #EFF7F5; }
3000
+ color: var(--primary-main-light-6); }
2777
3001
  .contact-box--dark-mode .contact-box__schedule {
2778
- color: #B5BABD; }
3002
+ color: var(--neutral-neutral-3); }
2779
3003
  .contact-box--dark-mode .contact-box--mobile.contact-box__schedule {
2780
- color: #B5BABD; }
3004
+ color: var(--neutral-neutral-3); }
2781
3005
  .contact-box .e-button {
2782
3006
  display: flex;
2783
3007
  justify-content: center; }
@@ -2815,13 +3039,13 @@
2815
3039
  justify-content: center;
2816
3040
  align-items: center; }
2817
3041
  .feedback--error .feedback__icon {
2818
- background: #FFECEF; }
3042
+ background: var(--error-error-3); }
2819
3043
  .feedback--error .feedback__title {
2820
- color: #D63737; }
3044
+ color: var(--error-main); }
2821
3045
  .feedback--success .feedback__icon {
2822
- background: #E4F8F3; }
3046
+ background: var(--primary-main-light-5); }
2823
3047
  .feedback--success .feedback__title {
2824
- color: #02374A;
3048
+ color: var(--primary-main-dark-1);
2825
3049
  font-weight: bold; }
2826
3050
  .feedback__icon {
2827
3051
  align-items: center;
@@ -2848,13 +3072,13 @@
2848
3072
  font-weight: bold;
2849
3073
  margin-bottom: 0.5rem; }
2850
3074
  .feedback__text--grey {
2851
- color: #6D7275; }
3075
+ color: var(--neutral-neutral-2); }
2852
3076
  .feedback__buttons {
2853
3077
  display: flex;
2854
3078
  flex-direction: column; }
2855
3079
  .feedback__cancel__a {
2856
3080
  margin-top: 0.5rem;
2857
- color: #05646E;
3081
+ color: var(--primary-main);
2858
3082
  text-decoration: underline; }
2859
3083
  .feedback__cancel__a:hover {
2860
3084
  cursor: pointer; }
@@ -2866,7 +3090,7 @@
2866
3090
  .menu-items-section {
2867
3091
  max-width: 250px; } }
2868
3092
  .menu-items-section__title-wrapper {
2869
- background-color: #F3F7FA;
3093
+ background-color: var(--neutral-neutral-5);
2870
3094
  display: flex;
2871
3095
  flex-direction: row;
2872
3096
  justify-content: center;
@@ -2888,7 +3112,7 @@
2888
3112
  right: 0;
2889
3113
  z-index: 2; }
2890
3114
  .navbar-drop-down__container__menu_items {
2891
- background: white;
3115
+ background: var(--others-white);
2892
3116
  padding: 1.5rem;
2893
3117
  box-shadow: 0px 2px 6px 0px rgba(2, 55, 74, 0.25); }
2894
3118
  .navbar-drop-down__container__menu_items ul li {
@@ -2898,7 +3122,7 @@
2898
3122
  margin-bottom: 0; }
2899
3123
  .navbar-drop-down__container__shadow {
2900
3124
  position: absolute;
2901
- background: #B5BABD;
3125
+ background: var(--neutral-neutral-3);
2902
3126
  opacity: 0.4;
2903
3127
  width: 100%;
2904
3128
  height: 100vh; }
@@ -2915,7 +3139,7 @@
2915
3139
  display: flex; }
2916
3140
  .pagination__control svg {
2917
3141
  cursor: pointer;
2918
- fill: #6D7275;
3142
+ fill: var(--neutral-neutral-2);
2919
3143
  width: 1rem; }
2920
3144
  .pagination__control svg path {
2921
3145
  pointer-events: none; }
@@ -2930,11 +3154,11 @@
2930
3154
  margin: 0 1rem; }
2931
3155
  .pagination__page {
2932
3156
  align-items: center;
2933
- background: #F8F9FA;
2934
- border: 2px solid #B5BABD;
3157
+ background: var(--neutral-neutral-6);
3158
+ border: 2px solid var(--neutral-neutral-3);
2935
3159
  border-radius: 4px;
2936
3160
  box-sizing: border-box;
2937
- color: #6D7275;
3161
+ color: var(--neutral-neutral-2);
2938
3162
  cursor: pointer;
2939
3163
  display: flex;
2940
3164
  justify-content: center;
@@ -2943,9 +3167,9 @@
2943
3167
  min-width: 2.125rem;
2944
3168
  padding: 0.3rem; }
2945
3169
  .pagination__page--active {
2946
- background: #DBE1E5;
2947
- border: 2px solid #6D7275;
2948
- color: #3D4042; }
3170
+ background: var(--neutral-neutral-4);
3171
+ border: 2px solid var(--neutral-neutral-2);
3172
+ color: var(--neutral-neutral-1); }
2949
3173
  .pagination__page--ellipsis {
2950
3174
  cursor: default; }
2951
3175
 
@@ -2957,13 +3181,13 @@
2957
3181
  .pricing-card.--selectable .pricing-card__radio-label {
2958
3182
  cursor: pointer; }
2959
3183
  .pricing-card.--selectable:not(.--selected):hover .pricing-card__wrapper {
2960
- border-color: #B5BABD; }
3184
+ border-color: var(--neutral-neutral-3); }
2961
3185
  .pricing-card.--selected .pricing-card__wrapper {
2962
- border-color: #5DD8C3; }
3186
+ border-color: var(--primary-main-light-3); }
2963
3187
  .pricing-card__radio-label .radio-input {
2964
3188
  display: none; }
2965
3189
  .pricing-card__radio-label .radio-input + .radio-checkbox {
2966
- background-color: #FFFFFF;
3190
+ background-color: var(--others-white);
2967
3191
  position: absolute;
2968
3192
  top: 1rem;
2969
3193
  left: 1rem;
@@ -2972,10 +3196,10 @@
2972
3196
  border-radius: 50%;
2973
3197
  border: 1px solid; }
2974
3198
  .pricing-card__radio-label .radio-input:checked + .radio-checkbox {
2975
- border: 5px solid #078080; }
3199
+ border: 5px solid var(--primary-main-light-1); }
2976
3200
  .pricing-card__wrapper {
2977
- background-color: #FFFFFF;
2978
- 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);
2979
3203
  border-radius: 4px;
2980
3204
  border: solid 1px transparent; }
2981
3205
  .pricing-card__wrapper ul {
@@ -2996,12 +3220,12 @@
2996
3220
  .pricing-card__header {
2997
3221
  padding: 1rem;
2998
3222
  text-align: center;
2999
- background: #F8F9FA; }
3223
+ background: var(--neutral-neutral-6); }
3000
3224
  .pricing-card__header__text {
3001
- color: #6D7275;
3225
+ color: var(--neutral-neutral-2);
3002
3226
  margin: 0 1rem; }
3003
3227
  .pricing-card__body {
3004
- color: #3D4042;
3228
+ color: var(--neutral-neutral-1);
3005
3229
  display: flex;
3006
3230
  flex-flow: column nowrap;
3007
3231
  padding: 1.5rem 1rem;
@@ -3022,7 +3246,7 @@
3022
3246
  margin-left: 0.2rem; }
3023
3247
  .pricing-card__body__text {
3024
3248
  font-size: 0.85rem;
3025
- color: #6D7275;
3249
+ color: var(--neutral-neutral-2);
3026
3250
  order: 4; }
3027
3251
  .pricing-card__body__features-list {
3028
3252
  display: none;
@@ -3034,11 +3258,11 @@
3034
3258
  display: block; }
3035
3259
  .pricing-card__body__features-list hr {
3036
3260
  width: 100%;
3037
- border-top: 1px solid #DBE1E5;
3261
+ border-top: 1px solid var(--neutral-neutral-4);
3038
3262
  margin-bottom: 1.5rem; }
3039
3263
  .pricing-card__body__features-list__item::before {
3040
3264
  content: '\2022';
3041
- color: #05646E;
3265
+ color: var(--primary-main);
3042
3266
  font-weight: bold;
3043
3267
  display: inline-block;
3044
3268
  margin-right: 1rem; }
@@ -3052,7 +3276,7 @@
3052
3276
  .pricing-card__body .e-button.see-more-button {
3053
3277
  display: none; } }
3054
3278
  .pricing-card__disclaimer {
3055
- color: #6D7275;
3279
+ color: var(--neutral-neutral-2);
3056
3280
  font-size: 0.75rem;
3057
3281
  text-align: center;
3058
3282
  width: 100%;
@@ -3067,7 +3291,7 @@
3067
3291
  width: 100%; }
3068
3292
 
3069
3293
  .snackbar {
3070
- color: #1E2021;
3294
+ color: var(--neutral-main);
3071
3295
  line-height: 1.5;
3072
3296
  margin-bottom: 1em;
3073
3297
  padding: 0.5em 0 0.5em 0;
@@ -3112,27 +3336,27 @@
3112
3336
  .snackbar-close-icon {
3113
3337
  line-height: 2; } }
3114
3338
  .snackbar--welcome {
3115
- background-color: #1E2021;
3116
- color: #FFFFFF;
3117
- border: 1px solid #6D7275; }
3339
+ background-color: var(--neutral-main);
3340
+ color: var(--others-white);
3341
+ border: 1px solid var(--neutral-neutral-2); }
3118
3342
  .snackbar--welcome:before {
3119
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; }
3120
3344
  .snackbar--success {
3121
- background-color: #5DD8C3;
3122
- color: #02374A;
3123
- 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); }
3124
3348
  .snackbar--success:before {
3125
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; }
3126
3350
  .snackbar--error {
3127
- background-color: #D63737;
3128
- color: #FFFFFF;
3129
- border: 1px solid #F09D9E; }
3351
+ background-color: var(--error-main);
3352
+ color: var(--others-white);
3353
+ border: 1px solid var(--error-error-2); }
3130
3354
  .snackbar--error:before {
3131
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; }
3132
3356
  .snackbar--reminder {
3133
- background-color: #F2BD6A;
3134
- color: #1E2021;
3135
- border: 1px solid #CD9A4C; }
3357
+ background-color: var(--secondary-main);
3358
+ color: var(--neutral-main);
3359
+ border: 1px solid var(--secondary-main-dark-1); }
3136
3360
  .snackbar--reminder:before {
3137
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; }
3138
3362
  .snackbar-content {
@@ -3157,7 +3381,7 @@
3157
3381
  .snackbar .e-button.remove-yellow {
3158
3382
  border-color: transparent; }
3159
3383
  .snackbar .e-button.remove-yellow:hover {
3160
- background-color: #FFFFFF; }
3384
+ background-color: var(--others-white); }
3161
3385
 
3162
3386
  .homeStepsItem {
3163
3387
  border-radius: 4px;
@@ -3169,8 +3393,8 @@
3169
3393
  width: 100%;
3170
3394
  align-items: flex-start;
3171
3395
  text-align: center;
3172
- background: #FFFFFF;
3173
- box-shadow: 0 0.25rem 0.5rem 0 rgba(2, 55, 74, 0.2);
3396
+ background: var(--others-white);
3397
+ box-shadow: 0 0.25rem 0.5rem 0 rgba(var(--primary-main-dark-1), 0.2);
3174
3398
  border: 4px;
3175
3399
  margin-right: 0.5rem;
3176
3400
  margin-bottom: 1rem; }
@@ -3234,7 +3458,7 @@
3234
3458
  .homeStepsItem p {
3235
3459
  margin-bottom: 1.5rem; } }
3236
3460
  .homeStepsItem small {
3237
- color: #6D7275; }
3461
+ color: var(--neutral-neutral-2); }
3238
3462
  .homeStepsItem:not(:first-child) .gatsby-image-wrapper {
3239
3463
  width: 100%; }
3240
3464
 
@@ -3250,8 +3474,8 @@
3250
3474
  -webkit-appearance: none;
3251
3475
  -moz-appearance: none;
3252
3476
  appearance: none;
3253
- color: #3D4042;
3254
- background-color: #F8F9FA;
3477
+ color: var(--neutral-neutral-1);
3478
+ background-color: var(--neutral-neutral-6);
3255
3479
  border-radius: 4px;
3256
3480
  padding: 0.75rem 0 0.75rem 0.75rem;
3257
3481
  font-size: 0.875rem;
@@ -3259,25 +3483,25 @@
3259
3483
  border: none;
3260
3484
  text-overflow: ellipsis;
3261
3485
  transition: box-shadow 0.3s ease;
3262
- box-shadow: 0 0 0 1px #B5BABD;
3486
+ box-shadow: 0 0 0 1px var(--neutral-neutral-3);
3263
3487
  margin: 0.0005em;
3264
3488
  outline: none; }
3265
3489
  .e-text input::placeholder {
3266
- color: #6D7275; }
3490
+ color: var(--neutral-neutral-2); }
3267
3491
  .e-text input:-ms-input-placeholder {
3268
- color: #6D7275; }
3492
+ color: var(--neutral-neutral-2); }
3269
3493
  .e-text input::-ms-input-placeholder {
3270
- color: #6D7275; }
3494
+ color: var(--neutral-neutral-2); }
3271
3495
  .e-text input:hover {
3272
- box-shadow: 0 0 0 1px #6D7275; }
3496
+ box-shadow: 0 0 0 1px var(--neutral-neutral-2); }
3273
3497
  .e-text input:active, .e-text input:focus {
3274
- box-shadow: 0 0 0 2px #05646E;
3498
+ box-shadow: 0 0 0 2px var(--primary-main);
3275
3499
  outline: none; }
3276
3500
  .e-text .form-group__label {
3277
- color: #3D4042;
3501
+ color: var(--neutral-neutral-1);
3278
3502
  font-weight: bold; }
3279
3503
  .e-text .form-group__label-icon {
3280
- color: #3D4042;
3504
+ color: var(--neutral-neutral-1);
3281
3505
  font-weight: bold;
3282
3506
  display: flex;
3283
3507
  align-items: center; }
@@ -3295,12 +3519,12 @@
3295
3519
  .e-text__children {
3296
3520
  margin-top: 0.5rem; }
3297
3521
  .e-text--group-invalid input {
3298
- box-shadow: 0 0 0 2px #D63737;
3299
- background-color: #FFECEF; }
3522
+ box-shadow: 0 0 0 2px var(--error-main);
3523
+ background-color: var(--error-error-3); }
3300
3524
  .e-text--group-invalid input:active, .e-text--group-invalid input:focus {
3301
- box-shadow: 0 0 0 2px #05646E;
3525
+ box-shadow: 0 0 0 2px var(--primary-main);
3302
3526
  outline: none;
3303
- background-color: #F8F9FA; }
3527
+ background-color: var(--neutral-neutral-6); }
3304
3528
  .e-text--is-invalid {
3305
3529
  margin-bottom: 4rem; }
3306
3530
  .e-text--is-invalid .e-text__error {
@@ -3309,7 +3533,7 @@
3309
3533
  position: absolute;
3310
3534
  bottom: -5.5rem;
3311
3535
  margin-top: 0.5rem;
3312
- color: #D63737;
3536
+ color: var(--error-main);
3313
3537
  height: 5rem; }
3314
3538
  .e-text--is-invalid .e-text__error-icon {
3315
3539
  display: flex; }
@@ -3331,12 +3555,12 @@
3331
3555
  .e-text--is-invalid .e-text__error img {
3332
3556
  height: 20px; } }
3333
3557
  .e-text--is-invalid input {
3334
- box-shadow: 0 0 0 2px #D63737;
3335
- background-color: #FFECEF; }
3558
+ box-shadow: 0 0 0 2px var(--error-main);
3559
+ background-color: var(--error-error-3); }
3336
3560
  .e-text--is-invalid input:active, .e-text--is-invalid input:focus {
3337
- box-shadow: 0 0 0 2px #05646E;
3561
+ box-shadow: 0 0 0 2px var(--primary-main);
3338
3562
  outline: none;
3339
- background-color: #F8F9FA; }
3563
+ background-color: var(--neutral-neutral-6); }
3340
3564
  .e-text .input-icon {
3341
3565
  position: absolute;
3342
3566
  transform: translate(-15%, -65%);
@@ -3358,7 +3582,7 @@
3358
3582
 
3359
3583
  .tooltip-menu__item {
3360
3584
  border-radius: 4px;
3361
- border: 1px solid #DBE1E5;
3585
+ border: 1px solid var(--neutral-neutral-4);
3362
3586
  display: flex;
3363
3587
  padding: 0.1875rem;
3364
3588
  margin-right: .5rem;
@@ -3367,7 +3591,7 @@
3367
3591
  cursor: pointer; }
3368
3592
  .tooltip-menu__item span {
3369
3593
  position: absolute;
3370
- color: #6D7275;
3594
+ color: var(--neutral-neutral-2);
3371
3595
  bottom: -1.25rem;
3372
3596
  left: -.25rem;
3373
3597
  right: 0;
@@ -3377,9 +3601,9 @@
3377
3601
  transform: translateY(1rem);
3378
3602
  transition: all .3s ease; }
3379
3603
  .tooltip-menu__item.--is-open {
3380
- background-color: #E4F8F3; }
3604
+ background-color: var(--primary-main-light-5); }
3381
3605
  .tooltip-menu__item:hover {
3382
- background-color: #E4F8F3; }
3606
+ background-color: var(--primary-main-light-5); }
3383
3607
  .tooltip-menu__item:hover span {
3384
3608
  transform: translate(0);
3385
3609
  visibility: visible;
@@ -3428,7 +3652,7 @@
3428
3652
  padding: 0; } }
3429
3653
 
3430
3654
  .mobile-bottom-bar {
3431
- background: #FFFFFF;
3655
+ background: var(--others-white);
3432
3656
  position: fixed;
3433
3657
  display: flex;
3434
3658
  flex-direction: row;
@@ -3476,7 +3700,7 @@
3476
3700
  margin-top: 0;
3477
3701
  margin-bottom: 3rem; } }
3478
3702
  .about-us-content__body .m-richText a {
3479
- color: #05646E; }
3703
+ color: var(--primary-main); }
3480
3704
  .about-us-content__body__button {
3481
3705
  margin-top: 2rem;
3482
3706
  font-family: "Inter", sans-serif; }
@@ -3504,10 +3728,10 @@
3504
3728
  justify-content: center;
3505
3729
  text-align: center; }
3506
3730
  .as-see-in-content__text #articles, .as-see-in-content__text #legal-documents {
3507
- color: #078080;
3731
+ color: var(--primary-main-light-1);
3508
3732
  font-weight: 400; }
3509
3733
  .as-see-in-content__text a {
3510
- color: #078080;
3734
+ color: var(--primary-main-light-1);
3511
3735
  font-weight: 400 !important; }
3512
3736
 
3513
3737
  .guidelines-section__texts {
@@ -3517,7 +3741,7 @@
3517
3741
  justify-content: center;
3518
3742
  margin-bottom: 1rem;
3519
3743
  margin-right: 0;
3520
- color: #3D4042;
3744
+ color: var(--neutral-neutral-1);
3521
3745
  font-style: normal;
3522
3746
  font-weight: 400;
3523
3747
  letter-spacing: -0.3px; }
@@ -3529,7 +3753,7 @@
3529
3753
  font-family: "Lora", serif;
3530
3754
  margin-bottom: 2rem;
3531
3755
  text-align: center;
3532
- color: #3D4042;
3756
+ color: var(--neutral-neutral-2);
3533
3757
  font-size: 32px;
3534
3758
  font-style: normal;
3535
3759
  font-weight: 400;
@@ -3543,7 +3767,7 @@
3543
3767
  font-size: 16px;
3544
3768
  line-height: 22px; }
3545
3769
  .guidelines-section__texts__body a {
3546
- color: #078080;
3770
+ color: var(--primary-main-light-1);
3547
3771
  font-weight: 400 !important; }
3548
3772
 
3549
3773
  .guidelines-section__image {
@@ -3567,7 +3791,7 @@
3567
3791
  justify-content: center;
3568
3792
  margin-bottom: 1rem;
3569
3793
  margin-right: 0;
3570
- color: #3D4042;
3794
+ color: var(--neutral-neutral-1);
3571
3795
  font-style: normal;
3572
3796
  font-weight: 400;
3573
3797
  letter-spacing: -0.3px; }
@@ -3589,7 +3813,7 @@
3589
3813
  font-size: 16px;
3590
3814
  line-height: 22px; }
3591
3815
  .try-our-free-legal-blogs-section__texts__body a {
3592
- color: #078080;
3816
+ color: var(--primary-main-light-1);
3593
3817
  font-weight: 400 !important; }
3594
3818
 
3595
3819
  .try-our-free-legal-blogs-section__image {
@@ -3607,7 +3831,7 @@
3607
3831
  .blog {
3608
3832
  max-width: 1200px; } }
3609
3833
  .blog .blog__title {
3610
- color: #02374A; }
3834
+ color: var(--primary-main-dark-1); }
3611
3835
  @media (min-width: 960px) {
3612
3836
  .blog .blog__title {
3613
3837
  margin-bottom: 3rem; } }
@@ -3620,7 +3844,7 @@
3620
3844
  width: auto; } }
3621
3845
 
3622
3846
  .how-it-works-wrapper {
3623
- background-color: #F8F9FA; }
3847
+ background-color: var(--neutral-neutral-6); }
3624
3848
  @media (min-width: 960px) {
3625
3849
  .how-it-works-wrapper {
3626
3850
  background-repeat: no-repeat;
@@ -3647,7 +3871,7 @@
3647
3871
 
3648
3872
  .about-us-section {
3649
3873
  padding-top: 1.125rem;
3650
- background: #EFF7F5;
3874
+ background: var(--primary-main-light-6);
3651
3875
  margin-bottom: 3rem; }
3652
3876
  @media (min-width: 960px) {
3653
3877
  .about-us-section {
@@ -3661,9 +3885,9 @@
3661
3885
  line-height: 1.2;
3662
3886
  font-weight: 700;
3663
3887
  font-family: "Inter", sans-serif;
3664
- color: #6D7275;
3888
+ color: var(--neutral-neutral-2);
3665
3889
  padding-bottom: 0.5rem;
3666
- border-bottom: 1px solid #B5BABD; }
3890
+ border-bottom: 1px solid var(--neutral-neutral-3); }
3667
3891
  .about-us-section__sub-title {
3668
3892
  margin-bottom: 1.5rem;
3669
3893
  text-align: center;
@@ -3672,7 +3896,7 @@
3672
3896
  letter-spacing: -0.4px;
3673
3897
  font-weight: 400;
3674
3898
  font-family: "Lora", serif;
3675
- color: #3D4042; }
3899
+ color: var(--neutral-neutral-1); }
3676
3900
  @media (min-width: 720px) {
3677
3901
  .about-us-section__sub-title {
3678
3902
  font-size: 2.3rem;
@@ -3696,7 +3920,7 @@
3696
3920
  display: flex;
3697
3921
  flex-direction: column; }
3698
3922
  .as-seen-in-section__title {
3699
- color: #3D4042;
3923
+ color: var(--neutral-neutral-2);
3700
3924
  text-align: center;
3701
3925
  font-size: 32px;
3702
3926
  font-family: Lora;