@vkzstudio/muza-ui 1.0.3 → 1.0.5

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 (80) hide show
  1. package/CLAUDE_CONSUMER.md +1 -1
  2. package/README.md +5 -2
  3. package/dist/Muza_BP_logo.svg +26 -0
  4. package/dist/components/Accordion/Accordion.stories.d.ts.map +1 -1
  5. package/dist/components/Alert/Alert.stories.d.ts.map +1 -1
  6. package/dist/components/Avatar/Avatar.stories.d.ts.map +1 -1
  7. package/dist/components/Breadcrumb/Breadcrumb.stories.d.ts.map +1 -1
  8. package/dist/components/Button/Button.stories.d.ts.map +1 -1
  9. package/dist/components/Calendar/CalendarBase.stories.d.ts.map +1 -1
  10. package/dist/components/Checkbox/Checkbox.stories.d.ts.map +1 -1
  11. package/dist/components/DatePicker/DatePicker.d.ts.map +1 -1
  12. package/dist/components/DatePicker/DatePicker.js +53 -53
  13. package/dist/components/DatePicker/DatePicker.stories.d.ts.map +1 -1
  14. package/dist/components/Dialog/Dialog.stories.d.ts.map +1 -1
  15. package/dist/components/DropdownMenu/DropdownMenu.d.ts +1 -1
  16. package/dist/components/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  17. package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts +47 -18
  18. package/dist/components/DropdownMenu/DropdownMenu.stories.d.ts.map +1 -1
  19. package/dist/components/EdgeButton/EdgeButton.stories.d.ts.map +1 -1
  20. package/dist/components/EmptyState/EmptyState.stories.d.ts.map +1 -1
  21. package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts +19 -0
  22. package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts.map +1 -1
  23. package/dist/components/FileUpload/FileItem.d.ts.map +1 -1
  24. package/dist/components/FileUpload/FileItem.js +80 -66
  25. package/dist/components/FileUpload/FileUpload.stories.d.ts.map +1 -1
  26. package/dist/components/Flex/Flex.stories.d.ts.map +1 -1
  27. package/dist/components/Icons/Icons.stories.d.ts.map +1 -1
  28. package/dist/components/Input/Input.stories.d.ts.map +1 -1
  29. package/dist/components/LanguageSwitcher/LanguageSwitcher.stories.d.ts.map +1 -1
  30. package/dist/components/Lightbox/Lightbox.stories.d.ts.map +1 -1
  31. package/dist/components/Loader/Loader.stories.d.ts.map +1 -1
  32. package/dist/components/LoginScreen/LoginScreen.stories.d.ts.map +1 -1
  33. package/dist/components/MultiSelect/MultiSelect.stories.d.ts.map +1 -1
  34. package/dist/components/PasswordInput/PasswordInput.stories.d.ts.map +1 -1
  35. package/dist/components/PinIndicator/PinIndicator.stories.d.ts.map +1 -1
  36. package/dist/components/Popover/Popover.stories.d.ts.map +1 -1
  37. package/dist/components/Radio/Radio.stories.d.ts.map +1 -1
  38. package/dist/components/Searchbar/Searchbar.stories.d.ts.map +1 -1
  39. package/dist/components/SegmentedControl/SegmentedControl.stories.d.ts.map +1 -1
  40. package/dist/components/SegmentedIconControl/SegmentedIconControl.stories.d.ts.map +1 -1
  41. package/dist/components/Select/Select.stories.d.ts.map +1 -1
  42. package/dist/components/Skeleton/Skeleton.stories.d.ts.map +1 -1
  43. package/dist/components/SliderIndicators/SliderIndicators.stories.d.ts.map +1 -1
  44. package/dist/components/Stepper/Stepper.stories.d.ts.map +1 -1
  45. package/dist/components/SwipeButton/SwipeButton.stories.d.ts +76 -18
  46. package/dist/components/SwipeButton/SwipeButton.stories.d.ts.map +1 -1
  47. package/dist/components/Switch/Switch.stories.d.ts.map +1 -1
  48. package/dist/components/Tag/Tag.stories.d.ts.map +1 -1
  49. package/dist/components/Textarea/Textarea.stories.d.ts.map +1 -1
  50. package/dist/components/TimePicker/TimePicker.stories.d.ts.map +1 -1
  51. package/dist/components/Toast/Toast.d.ts.map +1 -0
  52. package/dist/components/{Snackbar/Snackbar.stories.d.ts → Toast/Toast.stories.d.ts} +1 -1
  53. package/dist/components/Toast/Toast.stories.d.ts.map +1 -0
  54. package/dist/components/Toast/ToastContainer.d.ts +4 -0
  55. package/dist/components/Toast/ToastContainer.d.ts.map +1 -0
  56. package/dist/components/Toast/ToastContainer.js +6 -0
  57. package/dist/components/Toast/index.d.ts +3 -0
  58. package/dist/components/Toast/index.d.ts.map +1 -0
  59. package/dist/components/Toggle/Toggle.stories.d.ts.map +1 -1
  60. package/dist/components/ToggleGroup/ToggleGroup.stories.d.ts.map +1 -1
  61. package/dist/components/Tooltip/Tooltip.stories.d.ts.map +1 -1
  62. package/dist/components/Typography/Typography.stories.d.ts.map +1 -1
  63. package/dist/components/index.d.ts +1 -1
  64. package/dist/components/index.d.ts.map +1 -1
  65. package/dist/favicon.ico +0 -0
  66. package/dist/index.js +25 -25
  67. package/dist/muza-ui.css +1 -1
  68. package/dist/styles/token-colors.css +1199 -1201
  69. package/dist/styles/token-sizes.css +680 -676
  70. package/dist/styles/typography.css +84 -84
  71. package/package.json +1 -1
  72. package/dist/components/Snackbar/Snackbar.d.ts +0 -4
  73. package/dist/components/Snackbar/Snackbar.d.ts.map +0 -1
  74. package/dist/components/Snackbar/Snackbar.js +0 -6
  75. package/dist/components/Snackbar/Snackbar.stories.d.ts.map +0 -1
  76. package/dist/components/Snackbar/Toast.d.ts.map +0 -1
  77. package/dist/components/Snackbar/index.d.ts +0 -3
  78. package/dist/components/Snackbar/index.d.ts.map +0 -1
  79. /package/dist/components/{Snackbar → Toast}/Toast.d.ts +0 -0
  80. /package/dist/components/{Snackbar → Toast}/Toast.js +0 -0
@@ -1,1201 +1,1199 @@
1
- @theme inline {
2
- /* color */
3
- --color-comp-accordeon-settings-stroke-def: var(
4
- --color-stroke-base-secondary
5
- );
6
- --color-comp-accordeon-settings-stroke-disabled: var(
7
- --color-stroke-base-secondary
8
- );
9
- --color-comp-accordeon-settings-stroke-focused: var(
10
- --color-surface-base-transparent
11
- );
12
- --color-comp-accordeon-settings-stroke-hover: var(
13
- --color-stroke-base-secondary
14
- );
15
- --color-comp-accordeon-settings-surface-primary-def: var(
16
- --color-surface-base-secondary
17
- );
18
- --color-comp-accordeon-settings-surface-primary-disabled: var(
19
- --color-surface-base-secondary
20
- );
21
- --color-comp-accordeon-settings-surface-primary-focused: var(
22
- --color-surface-base-secondary
23
- );
24
- --color-comp-accordeon-settings-surface-primary-hover: var(
25
- --color-surface-base-primary-hover
26
- );
27
- --color-comp-accordeon-settings-surface-secondary: var(
28
- --color-surface-base-primary
29
- );
30
- --color-comp-alert-bg-error: var(--color-surface-state-bg-error);
31
- --color-comp-alert-bg-info: var(--color-surface-state-bg-info);
32
- --color-comp-alert-bg-success: var(--color-surface-state-bg-success);
33
- --color-comp-alert-bg-warning: var(--color-surface-state-bg-warning);
34
- --color-comp-alert-text-error: var(--color-text-state-error-def);
35
- --color-comp-alert-text-info: var(--color-text-brand-def);
36
- --color-comp-alert-text-success: var(--color-text-state-success);
37
- --color-comp-alert-text-warning: var(--color-text-state-warning);
38
- --color-comp-benefit-card-bg-def: var(--color-surface-base-secondary);
39
- --color-comp-benefit-card-bg-disabled: var(--color-surface-base-secondary);
40
- --color-comp-benefit-card-bg-focused: var(--color-surface-base-secondary);
41
- --color-comp-benefit-card-bg-hover: var(--color-surface-base-secondary);
42
- --color-comp-benefit-card-icon-active: var(--color-icon-brand-def);
43
- --color-comp-benefit-card-icon-def: var(--color-icon-dark-secondary-def);
44
- --color-comp-benefit-card-icon-disabled: var(--color-icon-dark-tertiary);
45
- --color-comp-benefit-card-icon-focused: var(--color-icon-brand-focused);
46
- --color-comp-benefit-card-icon-hover: var(--color-icon-brand-hover);
47
- --color-comp-benefit-card-stroke-def: var(--color-stroke-base-secondary);
48
- --color-comp-benefit-card-stroke-disabled: var(--color-stroke-base-secondary);
49
- --color-comp-benefit-card-stroke-focused: var(--color-stroke-brand-focused);
50
- --color-comp-benefit-card-stroke-hover: var(--color-stroke-brand-hover);
51
- --color-comp-benefit-card-text-disabled: var(--color-text-dark-tertiary);
52
- --color-comp-benefit-card-text-focused: var(--color-text-dark-primary-def);
53
- --color-comp-benefit-card-text-hover: var(--color-text-dark-primary-def);
54
- --color-comp-benefit-card-text-primary: var(--color-text-dark-primary-def);
55
- --color-comp-benefit-card-text-secondary: var(--color-text-dark-secondary);
56
- --color-comp-button-danger-ghost-bg-def: var(--color-transparent-transparent);
57
- --color-comp-button-danger-ghost-bg-disabled: var(
58
- --color-transparent-transparent
59
- );
60
- --color-comp-button-danger-ghost-bg-focused: var(
61
- --color-surface-error-ghost-focused
62
- );
63
- --color-comp-button-danger-ghost-bg-hover: var(
64
- --color-surface-error-ghost-hover
65
- );
66
- --color-comp-button-danger-ghost-bg-pressed: var(
67
- --color-surface-error-ghost-focused
68
- );
69
- --color-comp-button-danger-ghost-stroke-def: var(--color-stroke-error-def);
70
- --color-comp-button-danger-ghost-stroke-disabled: var(
71
- --color-stroke-error-disabled
72
- );
73
- --color-comp-button-danger-ghost-stroke-focused: var(
74
- --color-stroke-error-focused
75
- );
76
- --color-comp-button-danger-ghost-stroke-hover: var(
77
- --color-stroke-error-hover
78
- );
79
- --color-comp-button-danger-ghost-stroke-pressed: var(
80
- --color-stroke-error-pressed
81
- );
82
- --color-comp-button-danger-ghost-text-def: var(--color-text-state-error-def);
83
- --color-comp-button-danger-ghost-text-disabled: var(
84
- --color-text-state-error-disabled
85
- );
86
- --color-comp-button-danger-ghost-text-focused: var(
87
- --color-text-state-error-focused
88
- );
89
- --color-comp-button-danger-ghost-text-hover: var(
90
- --color-text-state-error-hover
91
- );
92
- --color-comp-button-danger-ghost-text-pressed: var(
93
- --color-text-state-error-pressed
94
- );
95
- --color-comp-button-danger-bg-def: var(--color-surface-error-def);
96
- --color-comp-button-danger-bg-disabled: var(--color-surface-error-disabled);
97
- --color-comp-button-danger-bg-focused: var(--color-surface-error-focused);
98
- --color-comp-button-danger-bg-hover: var(--color-surface-error-hover);
99
- --color-comp-button-danger-bg-pressed: var(--color-surface-error-focused);
100
- --color-comp-button-danger-stroke-def: var(--color-stroke-error-def);
101
- --color-comp-button-danger-stroke-disabled: var(
102
- --color-stroke-error-disabled
103
- );
104
- --color-comp-button-danger-stroke-focused: var(--color-stroke-error-focused);
105
- --color-comp-button-danger-stroke-hover: var(--color-stroke-error-hover);
106
- --color-comp-button-danger-stroke-pressed: var(--color-stroke-error-pressed);
107
- --color-comp-button-danger-swipe-btn-def: var(--color-red-400);
108
- --color-comp-button-danger-swipe-btn-disabled: var(
109
- --color-surface-error-disabled
110
- );
111
- --color-comp-button-danger-swipe-btn-focused: var(--color-red-400);
112
- --color-comp-button-danger-swipe-btn-hover: var(--color-red-400);
113
- --color-comp-button-danger-swipe-progress-def: var(--color-red-900);
114
- --color-comp-button-danger-swipe-progress-disabled: var(
115
- --color-black-dramatic-200
116
- );
117
- --color-comp-button-danger-swipe-progress-focused: var(--color-red-400);
118
- --color-comp-button-danger-swipe-progress-hover: var(--color-red-400);
119
- --color-comp-button-danger-text-def: var(--color-text-invert-def);
120
- --color-comp-button-danger-text-disabled: var(
121
- --color-text-state-error-disabled
122
- );
123
- --color-comp-button-danger-text-focused: var(--color-text-invert-focused);
124
- --color-comp-button-danger-text-hover: var(--color-text-invert-hover);
125
- --color-comp-button-danger-text-pressed: var(--color-text-invert-pressed);
126
- --color-comp-button-dashed-danger-text-disabled: var(
127
- --color-text-dark-tertiary
128
- );
129
- --color-comp-button-dashed-danger-ghost-text-disabled: var(
130
- --color-text-dark-tertiary
131
- );
132
- --color-comp-button-dashed-danger-ghost-bg-def: var(
133
- --color-transparent-transparent
134
- );
135
- --color-comp-button-dashed-danger-ghost-bg-disabled: var(
136
- --color-transparent-transparent
137
- );
138
- --color-comp-button-dashed-danger-ghost-bg-focused: var(
139
- --color-surface-error-ghost-focused
140
- );
141
- --color-comp-button-dashed-danger-ghost-bg-hover: var(
142
- --color-surface-error-ghost-hover
143
- );
144
- --color-comp-button-dashed-danger-ghost-bg-pressed: var(
145
- --color-surface-error-ghost-focused
146
- );
147
- --color-comp-button-dashed-danger-ghost-stroke-def: var(
148
- --color-stroke-error-def
149
- );
150
- --color-comp-button-dashed-danger-ghost-stroke-disabled: var(
151
- --color-stroke-error-disabled
152
- );
153
- --color-comp-button-dashed-danger-ghost-stroke-focused: var(
154
- --color-stroke-error-focused
155
- );
156
- --color-comp-button-dashed-danger-ghost-stroke-hover: var(
157
- --color-stroke-error-hover
158
- );
159
- --color-comp-button-dashed-danger-ghost-stroke-pressed: var(
160
- --color-stroke-error-pressed
161
- );
162
- --color-comp-button-dashed-danger-ghost-text-def: var(
163
- --color-text-state-error-def
164
- );
165
- --color-comp-button-dashed-danger-ghost-text-disabled: var(
166
- --color-text-state-error-disabled
167
- );
168
- --color-comp-button-dashed-danger-ghost-text-focused: var(
169
- --color-text-state-error-focused
170
- );
171
- --color-comp-button-dashed-danger-ghost-text-hover: var(
172
- --color-text-state-error-hover
173
- );
174
- --color-comp-button-dashed-danger-ghost-text-pressed: var(
175
- --color-text-state-error-pressed
176
- );
177
- --color-comp-button-dashed-danger-bg-def: var(--color-surface-base-secondary);
178
- --color-comp-button-dashed-danger-bg-disabled: var(
179
- --color-surface-base-primary-disabled
180
- );
181
- --color-comp-button-dashed-danger-bg-focused: var(
182
- --color-surface-base-primary-focused-pressed
183
- );
184
- --color-comp-button-dashed-danger-bg-hover: var(
185
- --color-surface-base-primary-hover
186
- );
187
- --color-comp-button-dashed-danger-bg-pressed: var(
188
- --color-surface-base-primary-focused-pressed
189
- );
190
- --color-comp-button-dashed-danger-stroke-def: var(--color-stroke-error-def);
191
- --color-comp-button-dashed-danger-stroke-disabled: var(
192
- --color-stroke-error-disabled
193
- );
194
- --color-comp-button-dashed-danger-stroke-focused: var(
195
- --color-stroke-error-focused
196
- );
197
- --color-comp-button-dashed-danger-stroke-hover: var(
198
- --color-stroke-error-hover
199
- );
200
- --color-comp-button-dashed-danger-stroke-pressed: var(
201
- --color-stroke-error-pressed
202
- );
203
- --color-comp-button-dashed-danger-text-def: var(--color-text-state-error-def);
204
- --color-comp-button-dashed-danger-text-disabled: var(
205
- --color-text-state-error-disabled
206
- );
207
- --color-comp-button-dashed-danger-text-focused: var(
208
- --color-text-state-error-focused
209
- );
210
- --color-comp-button-dashed-danger-text-hover: var(
211
- --color-text-state-error-hover
212
- );
213
- --color-comp-button-dashed-danger-text-pressed: var(
214
- --color-text-state-error-pressed
215
- );
216
- --color-comp-button-dashed-ghost-bg-def: var(--color-transparent-transparent);
217
- --color-comp-button-dashed-ghost-bg-disabled: var(
218
- --color-transparent-transparent
219
- );
220
- --color-comp-button-dashed-ghost-bg-focused: var(
221
- --color-surface-dark-ghost-focused
222
- );
223
- --color-comp-button-dashed-ghost-bg-hover: var(
224
- --color-surface-dark-ghost-hover
225
- );
226
- --color-comp-button-dashed-ghost-bg-pressed: var(
227
- --color-surface-dark-ghost-focused
228
- );
229
- --color-comp-button-dashed-ghost-stroke-def: var(--color-stroke-dashed-def);
230
- --color-comp-button-dashed-ghost-stroke-disabled: var(
231
- --color-stroke-base-disabled
232
- );
233
- --color-comp-button-dashed-ghost-stroke-focused: var(
234
- --color-stroke-dashed-focused
235
- );
236
- --color-comp-button-dashed-ghost-stroke-hover: var(
237
- --color-stroke-dashed-hover
238
- );
239
- --color-comp-button-dashed-ghost-stroke-pressed: var(
240
- --color-stroke-dashed-pressed
241
- );
242
- --color-comp-button-dashed-ghost-text-def: var(--color-text-dark-primary-def);
243
- --color-comp-button-dashed-ghost-text-disabled: var(
244
- --color-text-dark-tertiary
245
- );
246
- --color-comp-button-dashed-ghost-text-focused: var(
247
- --color-text-dark-primary-focused
248
- );
249
- --color-comp-button-dashed-ghost-text-hover: var(
250
- --color-text-dark-primary-hover
251
- );
252
- --color-comp-button-dashed-ghost-text-pressed: var(
253
- --color-text-dark-primary-pressed
254
- );
255
- --color-comp-button-dashed-bg-def: var(--color-surface-base-secondary);
256
- --color-comp-button-dashed-bg-disabled: var(
257
- --color-surface-base-primary-disabled
258
- );
259
- --color-comp-button-dashed-bg-focused: var(
260
- --color-surface-base-primary-focused-pressed
261
- );
262
- --color-comp-button-dashed-bg-hover: var(--color-surface-base-primary-hover);
263
- --color-comp-button-dashed-bg-pressed: var(
264
- --color-surface-base-primary-focused-pressed
265
- );
266
- --color-comp-button-dashed-stroke-def: var(--color-stroke-dashed-def);
267
- --color-comp-button-dashed-stroke-disabled: var(--color-stroke-base-disabled);
268
- --color-comp-button-dashed-stroke-focused: var(--color-stroke-dashed-focused);
269
- --color-comp-button-dashed-stroke-hover: var(--color-stroke-dashed-hover);
270
- --color-comp-button-dashed-stroke-pressed: var(--color-stroke-dashed-pressed);
271
- --color-comp-button-dashed-text-def: var(--color-text-dark-primary-def);
272
- --color-comp-button-dashed-text-disabled: var(--color-text-dark-tertiary);
273
- --color-comp-button-dashed-text-focused: var(
274
- --color-text-dark-primary-focused
275
- );
276
- --color-comp-button-dashed-text-hover: var(--color-text-dark-primary-hover);
277
- --color-comp-button-dashed-text-pressed: var(
278
- --color-text-dark-primary-pressed
279
- );
280
- --color-comp-button-invert-danger-bg-def: var(--color-surface-base-tertiary);
281
- --color-comp-button-invert-danger-bg-disabled: var(
282
- --color-surface-base-primary-disabled
283
- );
284
- --color-comp-button-invert-danger-bg-focused: var(
285
- --color-surface-base-primary-focused-pressed
286
- );
287
- --color-comp-button-invert-danger-bg-hover: var(
288
- --color-surface-base-primary-hover
289
- );
290
- --color-comp-button-invert-danger-bg-pressed: var(
291
- --color-surface-base-primary-focused-pressed
292
- );
293
- --color-comp-button-invert-danger-stroke-def: var(
294
- --color-stroke-base-secondary
295
- );
296
- --color-comp-button-invert-danger-stroke-disabled: var(
297
- --color-stroke-base-disabled
298
- );
299
- --color-comp-button-invert-danger-stroke-focused: var(
300
- --color-stroke-base-primary-focused
301
- );
302
- --color-comp-button-invert-danger-stroke-hover: var(
303
- --color-stroke-base-primary-hover
304
- );
305
- --color-comp-button-invert-danger-stroke-pressed: var(
306
- --color-stroke-base-primary-pressed
307
- );
308
- --color-comp-button-invert-danger-swipe-btn-def: var(--color-red-100);
309
- --color-comp-button-invert-danger-swipe-btn-disabled: var(
310
- --color-surface-error-disabled
311
- );
312
- --color-comp-button-invert-danger-swipe-btn-focused: var(--color-red-100);
313
- --color-comp-button-invert-danger-swipe-btn-hover: var(--color-red-100);
314
- --color-comp-button-invert-danger-swipe-progress-def: var(--color-red-200);
315
- --color-comp-button-invert-danger-swipe-progress-disabled: var(
316
- --color-red-50
317
- );
318
- --color-comp-button-invert-danger-swipe-progress-focused: var(
319
- --color-red-100
320
- );
321
- --color-comp-button-invert-danger-swipe-progress-hover: var(--color-red-100);
322
- --color-comp-button-invert-danger-text-def: var(--color-text-state-error-def);
323
- --color-comp-button-invert-danger-text-disabled: var(
324
- --color-text-state-error-disabled
325
- );
326
- --color-comp-button-invert-danger-text-focused: var(
327
- --color-text-state-error-focused
328
- );
329
- --color-comp-button-invert-danger-text-hover: var(
330
- --color-text-state-error-hover
331
- );
332
- --color-comp-button-invert-danger-text-pressed: var(
333
- --color-text-state-error-pressed
334
- );
335
- --color-comp-button-invert-ghost-bg-def: var(--color-transparent-transparent);
336
- --color-comp-button-invert-ghost-bg-disabled: var(
337
- --color-transparent-transparent
338
- );
339
- --color-comp-button-invert-ghost-bg-focused: var(
340
- --color-surface-invert-ghost-focused
341
- );
342
- --color-comp-button-invert-ghost-bg-hover: var(
343
- --color-surface-invert-ghost-hover
344
- );
345
- --color-comp-button-invert-ghost-bg-pressed: var(
346
- --color-surface-invert-ghost-focused
347
- );
348
- --color-comp-button-invert-ghost-stroke-def: var(
349
- --color-stroke-base-secondary
350
- );
351
- --color-comp-button-invert-ghost-stroke-disabled: var(
352
- --color-stroke-base-disabled
353
- );
354
- --color-comp-button-invert-ghost-stroke-focused: var(
355
- --color-stroke-base-primary-focused
356
- );
357
- --color-comp-button-invert-ghost-stroke-hover: var(
358
- --color-stroke-base-primary-hover
359
- );
360
- --color-comp-button-invert-ghost-stroke-pressed: var(
361
- --color-stroke-base-primary-pressed
362
- );
363
- --color-comp-button-invert-ghost-text-def: var(--color-text-invert-def);
364
- --color-comp-button-invert-ghost-text-disabled: var(--color-gray-700);
365
- --color-comp-button-invert-ghost-text-focused: var(
366
- --color-text-invert-focused
367
- );
368
- --color-comp-button-invert-ghost-text-hover: var(--color-text-invert-hover);
369
- --color-comp-button-invert-ghost-text-pressed: var(
370
- --color-text-invert-pressed
371
- );
372
- --color-comp-button-invert-bg-def: var(--color-surface-base-tertiary);
373
- --color-comp-button-invert-bg-disabled: var(
374
- --color-surface-base-primary-disabled
375
- );
376
- --color-comp-button-invert-bg-focused: var(
377
- --color-surface-base-primary-focused-pressed
378
- );
379
- --color-comp-button-invert-bg-hover: var(--color-surface-base-primary-hover);
380
- --color-comp-button-invert-bg-pressed: var(
381
- --color-surface-base-primary-focused-pressed
382
- );
383
- --color-comp-button-invert-stroke-def: var(--color-stroke-base-secondary);
384
- --color-comp-button-invert-stroke-disabled: var(--color-stroke-base-disabled);
385
- --color-comp-button-invert-stroke-focused: var(
386
- --color-stroke-base-primary-focused
387
- );
388
- --color-comp-button-invert-stroke-hover: var(
389
- --color-stroke-base-primary-hover
390
- );
391
- --color-comp-button-invert-stroke-pressed: var(
392
- --color-stroke-base-primary-pressed
393
- );
394
- --color-comp-button-invert-swipe-btn-def: var(--color-black-dramatic-200);
395
- --color-comp-button-invert-swipe-btn-disabled: var(
396
- --color-black-dramatic-100
397
- );
398
- --color-comp-button-invert-swipe-btn-focused: var(--color-purple-200);
399
- --color-comp-button-invert-swipe-btn-hover: var(--color-black-dramatic-200);
400
- --color-comp-button-invert-swipe-progress-def: var(--color-gray-200);
401
- --color-comp-button-invert-swipe-progress-disabled: var(
402
- --color-black-dramatic-100
403
- );
404
- --color-comp-button-invert-swipe-progress-focused: var(
405
- --color-black-dramatic-200
406
- );
407
- --color-comp-button-invert-swipe-progress-hover: var(
408
- --color-black-dramatic-200
409
- );
410
- --color-comp-button-invert-text-def: var(--color-text-dark-primary-def);
411
- --color-comp-button-invert-text-disabled: var(--color-text-dark-tertiary);
412
- --color-comp-button-invert-text-focused: var(
413
- --color-text-dark-primary-focused
414
- );
415
- --color-comp-button-invert-text-hover: var(--color-text-dark-primary-hover);
416
- --color-comp-button-invert-text-pressed: var(
417
- --color-text-dark-primary-pressed
418
- );
419
- --color-comp-button-link-danger-bg-def: var(--color-transparent-transparent);
420
- --color-comp-button-link-danger-bg-disabled: var(
421
- --color-transparent-transparent
422
- );
423
- --color-comp-button-link-danger-bg-focused: var(
424
- --color-transparent-transparent
425
- );
426
- --color-comp-button-link-danger-bg-hover: var(
427
- --color-transparent-transparent
428
- );
429
- --color-comp-button-link-danger-bg-pressed: var(
430
- --color-transparent-transparent
431
- );
432
- --color-comp-button-link-danger-stroke-def: var(--color-stroke-dark-def);
433
- --color-comp-button-link-danger-stroke-disabled: var(
434
- --color-stroke-dark-disabled
435
- );
436
- --color-comp-button-link-danger-stroke-focused: var(
437
- --color-stroke-dark-focused
438
- );
439
- --color-comp-button-link-danger-stroke-hover: var(--color-stroke-dark-hover);
440
- --color-comp-button-link-danger-stroke-pressed: var(
441
- --color-stroke-dark-pressed
442
- );
443
- --color-comp-button-link-danger-text-def: var(--color-text-state-error-def);
444
- --color-comp-button-link-danger-text-disabled: var(
445
- --color-text-state-error-disabled
446
- );
447
- --color-comp-button-link-danger-text-focused: var(
448
- --color-text-state-error-focused
449
- );
450
- --color-comp-button-link-danger-text-hover: var(
451
- --color-text-state-error-hover
452
- );
453
- --color-comp-button-link-danger-text-pressed: var(
454
- --color-text-state-error-pressed
455
- );
456
- --color-comp-button-link-invert-bg-def: var(--color-transparent-transparent);
457
- --color-comp-button-link-invert-bg-disabled: var(
458
- --color-transparent-transparent
459
- );
460
- --color-comp-button-link-invert-bg-focused: var(
461
- --color-transparent-transparent
462
- );
463
- --color-comp-button-link-invert-bg-hover: var(
464
- --color-transparent-transparent
465
- );
466
- --color-comp-button-link-invert-bg-pressed: var(
467
- --color-transparent-transparent
468
- );
469
- --color-comp-button-link-invert-stroke-def: var(--color-stroke-brand-def);
470
- --color-comp-button-link-invert-stroke-disabled: var(--color-gray-400);
471
- --color-comp-button-link-invert-stroke-focused: var(
472
- --color-stroke-brand-focused
473
- );
474
- --color-comp-button-link-invert-stroke-hover: var(--color-stroke-brand-hover);
475
- --color-comp-button-link-invert-stroke-pressed: var(
476
- --color-stroke-brand-pressed
477
- );
478
- --color-comp-button-link-invert-text-def: var(--color-text-invert-def);
479
- --color-comp-button-link-invert-text-disabled: var(--color-gray-700);
480
- --color-comp-button-link-invert-text-focused: var(
481
- --color-text-invert-focused
482
- );
483
- --color-comp-button-link-invert-text-hover: var(--color-text-invert-hover);
484
- --color-comp-button-link-invert-text-pressed: var(
485
- --color-text-invert-pressed
486
- );
487
- --color-comp-button-link-bg-def: var(--color-transparent-transparent);
488
- --color-comp-button-link-bg-disabled: var(--color-transparent-transparent);
489
- --color-comp-button-link-bg-focused: var(--color-transparent-transparent);
490
- --color-comp-button-link-bg-hover: var(--color-transparent-transparent);
491
- --color-comp-button-link-bg-pressed: var(--color-transparent-transparent);
492
- --color-comp-button-link-stroke-def: var(--color-transparent-transparent);
493
- --color-comp-button-link-stroke-disabled: var(
494
- --color-transparent-transparent
495
- );
496
- --color-comp-button-link-stroke-focused: var(--color-transparent-transparent);
497
- --color-comp-button-link-stroke-hover: var(--color-transparent-transparent);
498
- --color-comp-button-link-stroke-pressed: var(--color-transparent-transparent);
499
- --color-comp-button-link-text-def: var(--color-text-brand-def);
500
- --color-comp-button-link-text-disabled: var(--color-text-dark-tertiary);
501
- --color-comp-button-link-text-focused: var(--color-text-brand-focused);
502
- --color-comp-button-link-text-hover: var(--color-text-brand-hover);
503
- --color-comp-button-link-text-pressed: var(--color-text-brand-pressed);
504
- --color-comp-button-primary-ghost-bg-def: var(
505
- --color-transparent-transparent
506
- );
507
- --color-comp-button-primary-ghost-bg-disabled: var(
508
- --color-transparent-transparent
509
- );
510
- --color-comp-button-primary-ghost-bg-focused: var(
511
- --color-surface-brand-ghost-focused
512
- );
513
- --color-comp-button-primary-ghost-bg-hover: var(
514
- --color-surface-brand-ghost-hover
515
- );
516
- --color-comp-button-primary-ghost-bg-pressed: var(
517
- --color-surface-brand-ghost-focused
518
- );
519
- --color-comp-button-primary-ghost-stroke-def: var(--color-stroke-brand-def);
520
- --color-comp-button-primary-ghost-stroke-disabled: var(--color-gray-400);
521
- --color-comp-button-primary-ghost-stroke-focused: var(
522
- --color-stroke-brand-focused
523
- );
524
- --color-comp-button-primary-ghost-stroke-hover: var(
525
- --color-stroke-brand-hover
526
- );
527
- --color-comp-button-primary-ghost-stroke-pressed: var(
528
- --color-stroke-brand-pressed
529
- );
530
- --color-comp-button-primary-ghost-text-def: var(--color-text-brand-def);
531
- --color-comp-button-primary-ghost-text-disabled: var(
532
- --color-text-dark-tertiary
533
- );
534
- --color-comp-button-primary-ghost-text-focused: var(
535
- --color-text-brand-focused
536
- );
537
- --color-comp-button-primary-ghost-text-hover: var(--color-text-brand-hover);
538
- --color-comp-button-primary-ghost-text-pressed: var(
539
- --color-text-brand-pressed
540
- );
541
- --color-comp-button-primary-bg-def: var(--color-surface-brand-primary);
542
- --color-comp-button-primary-bg-disabled: var(
543
- --color-surface-brand-primary-disabled
544
- );
545
- --color-comp-button-primary-bg-focused: var(
546
- --color-surface-brand-primary-focused-pressed
547
- );
548
- --color-comp-button-primary-bg-hover: var(
549
- --color-surface-brand-primary-hover
550
- );
551
- --color-comp-button-primary-bg-pressed: var(
552
- --color-surface-brand-primary-focused-pressed
553
- );
554
- --color-comp-button-primary-stroke-def: var(--color-stroke-brand-def);
555
- --color-comp-button-primary-stroke-disabled: var(
556
- --color-transparent-transparent
557
- );
558
- --color-comp-button-primary-stroke-focused: var(--color-stroke-brand-focused);
559
- --color-comp-button-primary-stroke-hover: var(--color-stroke-brand-hover);
560
- --color-comp-button-primary-stroke-pressed: var(--color-stroke-brand-pressed);
561
- --color-comp-button-primary-swipe-btn-def: var(--color-purple-400);
562
- --color-comp-button-primary-swipe-btn-disabled: var(--color-gray-300);
563
- --color-comp-button-primary-swipe-btn-focused: var(--color-purple-400);
564
- --color-comp-button-primary-swipe-btn-hover: var(--color-purple-400);
565
- --color-comp-button-primary-swipe-progress-def: var(--color-purple-500);
566
- --color-comp-button-primary-swipe-progress-disabled: var(--color-purple-400);
567
- --color-comp-button-primary-swipe-progress-focused: var(--color-purple-400);
568
- --color-comp-button-primary-swipe-progress-hover: var(--color-purple-400);
569
- --color-comp-button-primary-text-def: var(--color-text-invert-def);
570
- --color-comp-button-primary-text-disabled: var(--color-gray-700);
571
- --color-comp-button-primary-text-focused: var(--color-text-invert-focused);
572
- --color-comp-button-primary-text-hover: var(--color-text-invert-hover);
573
- --color-comp-button-primary-text-pressed: var(--color-text-invert-pressed);
574
- --color-comp-button-secondary-ghost-bg-def: var(
575
- --color-transparent-transparent
576
- );
577
- --color-comp-button-secondary-ghost-bg-disabled: var(
578
- --color-transparent-transparent
579
- );
580
- --color-comp-button-secondary-ghost-bg-focused: var(
581
- --color-surface-dark-ghost-focused
582
- );
583
- --color-comp-button-secondary-ghost-bg-hover: var(
584
- --color-surface-dark-ghost-hover
585
- );
586
- --color-comp-button-secondary-ghost-bg-pressed: var(
587
- --color-surface-dark-ghost-focused
588
- );
589
- --color-comp-button-secondary-ghost-stroke-def: var(--color-stroke-dark-def);
590
- --color-comp-button-secondary-ghost-stroke-disabled: var(
591
- --color-stroke-dark-disabled
592
- );
593
- --color-comp-button-secondary-ghost-stroke-focused: var(
594
- --color-stroke-dark-focused
595
- );
596
- --color-comp-button-secondary-ghost-stroke-hover: var(
597
- --color-stroke-dark-hover
598
- );
599
- --color-comp-button-secondary-ghost-stroke-pressed: var(
600
- --color-stroke-dark-pressed
601
- );
602
- --color-comp-button-secondary-ghost-text-def: var(
603
- --color-text-dark-primary-def
604
- );
605
- --color-comp-button-secondary-ghost-text-disabled: var(
606
- --color-text-dark-tertiary
607
- );
608
- --color-comp-button-secondary-ghost-text-focused: var(
609
- --color-text-dark-primary-focused
610
- );
611
- --color-comp-button-secondary-ghost-text-hover: var(
612
- --color-text-dark-primary-hover
613
- );
614
- --color-comp-button-secondary-ghost-text-pressed: var(
615
- --color-text-dark-primary-pressed
616
- );
617
- --color-comp-button-secondary-bg-def: var(--color-surface-dark-def);
618
- --color-comp-button-secondary-bg-disabled: var(
619
- --color-surface-dark-secondary-disabled
620
- );
621
- --color-comp-button-secondary-bg-focused: var(
622
- --color-surface-dark-focused-pressed
623
- );
624
- --color-comp-button-secondary-bg-hover: var(--color-surface-dark-hover);
625
- --color-comp-button-secondary-bg-pressed: var(
626
- --color-surface-dark-focused-pressed
627
- );
628
- --color-comp-button-secondary-stroke-def: var(--color-stroke-dark-def);
629
- --color-comp-button-secondary-stroke-disabled: var(
630
- --color-surface-dark-secondary-disabled
631
- );
632
- --color-comp-button-secondary-stroke-focused: var(
633
- --color-stroke-dark-focused
634
- );
635
- --color-comp-button-secondary-stroke-hover: var(--color-stroke-dark-hover);
636
- --color-comp-button-secondary-stroke-pressed: var(
637
- --color-stroke-dark-pressed
638
- );
639
- --color-comp-button-secondary-swipe-btn-def: var(--color-black-dramatic-800);
640
- --color-comp-button-secondary-swipe-btn-disabled: var(
641
- --color-black-dramatic-200
642
- );
643
- --color-comp-button-secondary-swipe-btn-focused: var(
644
- --color-black-dramatic-800
645
- );
646
- --color-comp-button-secondary-swipe-btn-hover: var(
647
- --color-black-dramatic-800
648
- );
649
- --color-comp-button-secondary-swipe-progress-def: var(
650
- --color-black-dramatic-900
651
- );
652
- --color-comp-button-secondary-swipe-progress-disabled: var(
653
- --color-black-dramatic-900
654
- );
655
- --color-comp-button-secondary-swipe-progress-focused: var(
656
- --color-black-dramatic-900
657
- );
658
- --color-comp-button-secondary-swipe-progress-hover: var(
659
- --color-black-dramatic-900
660
- );
661
- --color-comp-button-secondary-text-def: var(--color-text-invert-def);
662
- --color-comp-button-secondary-text-disabled: var(--color-gray-700);
663
- --color-comp-button-secondary-text-focused: var(--color-text-invert-focused);
664
- --color-comp-button-secondary-text-hover: var(--color-text-invert-hover);
665
- --color-comp-button-secondary-text-pressed: var(--color-text-invert-pressed);
666
- --color-comp-button-tertiary-ghost-bg-def: var(
667
- --color-transparent-transparent
668
- );
669
- --color-comp-button-tertiary-ghost-bg-disabled: var(
670
- --color-transparent-transparent
671
- );
672
- --color-comp-button-tertiary-ghost-bg-focused: var(
673
- --color-transparent-transparent
674
- );
675
- --color-comp-button-tertiary-ghost-bg-hover: var(
676
- --color-transparent-transparent
677
- );
678
- --color-comp-button-tertiary-ghost-bg-pressed: var(
679
- --color-transparent-transparent
680
- );
681
- --color-comp-button-tertiary-ghost-stroke-def: var(
682
- --color-stroke-base-primary
683
- );
684
- --color-comp-button-tertiary-ghost-stroke-disabled: var(
685
- --color-stroke-base-disabled
686
- );
687
- --color-comp-button-tertiary-ghost-stroke-focused: var(
688
- --color-stroke-brand-focused
689
- );
690
- --color-comp-button-tertiary-ghost-stroke-hover: var(
691
- --color-stroke-brand-hover
692
- );
693
- --color-comp-button-tertiary-ghost-stroke-pressed: var(
694
- --color-stroke-brand-pressed
695
- );
696
- --color-comp-button-tertiary-ghost-text-def: var(--color-text-brand-def);
697
- --color-comp-button-tertiary-ghost-text-disabled: var(
698
- --color-text-dark-tertiary
699
- );
700
- --color-comp-button-tertiary-ghost-text-focused: var(
701
- --color-text-brand-focused
702
- );
703
- --color-comp-button-tertiary-ghost-text-hover: var(--color-text-brand-hover);
704
- --color-comp-button-tertiary-ghost-text-pressed: var(
705
- --color-text-brand-pressed
706
- );
707
- --color-comp-button-tertiary-bg-def: var(--color-surface-base-secondary);
708
- --color-comp-button-tertiary-bg-disabled: var(
709
- --color-surface-base-primary-disabled
710
- );
711
- --color-comp-button-tertiary-bg-focused: var(
712
- --color-surface-base-primary-focused-pressed
713
- );
714
- --color-comp-button-tertiary-bg-hover: var(--color-surface-base-secondary);
715
- --color-comp-button-tertiary-bg-pressed: var(
716
- --color-surface-base-primary-focused-pressed
717
- );
718
- --color-comp-button-tertiary-stroke-def: var(--color-stroke-base-primary);
719
- --color-comp-button-tertiary-stroke-disabled: var(
720
- --color-stroke-base-disabled
721
- );
722
- --color-comp-button-tertiary-stroke-focused: var(
723
- --color-stroke-brand-focused
724
- );
725
- --color-comp-button-tertiary-stroke-hover: var(--color-stroke-brand-hover);
726
- --color-comp-button-tertiary-stroke-pressed: var(
727
- --color-stroke-brand-pressed
728
- );
729
- --color-comp-button-tertiary-swipe-btn-def: var(--color-purple-100);
730
- --color-comp-button-tertiary-swipe-btn-disabled: var(--color-purple-100);
731
- --color-comp-button-tertiary-swipe-btn-focused: var(--color-purple-100);
732
- --color-comp-button-tertiary-swipe-btn-hover: var(--color-purple-100);
733
- --color-comp-button-tertiary-swipe-progress-def: var(--color-purple-200);
734
- --color-comp-button-tertiary-swipe-progress-disabled: var(--color-purple-200);
735
- --color-comp-button-tertiary-swipe-progress-focused: var(--color-purple-200);
736
- --color-comp-button-tertiary-swipe-progress-hover: var(--color-purple-200);
737
- --color-comp-button-tertiary-text-def: var(--color-text-brand-def);
738
- --color-comp-button-tertiary-text-disabled: var(--color-text-dark-tertiary);
739
- --color-comp-button-tertiary-text-focused: var(--color-text-brand-focused);
740
- --color-comp-button-tertiary-text-hover: var(--color-text-brand-hover);
741
- --color-comp-button-tertiary-text-pressed: var(--color-text-brand-pressed);
742
- --color-comp-card-dashboard-dark-bg-def: var(--color-black-dramatic-900);
743
- --color-comp-card-dashboard-dark-bg-disabled: var(--color-black-dramatic-300);
744
- --color-comp-card-dashboard-dark-bg-focused: var(
745
- --color-text-dark-primary-def
746
- );
747
- --color-comp-card-dashboard-dark-bg-hover: var(--color-text-dark-primary-def);
748
- --color-comp-card-dashboard-light-bg-def: var(--color-surface-base-secondary);
749
- --color-comp-card-dashboard-light-bg-disabled: var(
750
- --color-surface-base-secondary
751
- );
752
- --color-comp-card-dashboard-light-bg-focused: var(
753
- --color-surface-brand-primary-focused-pressed
754
- );
755
- --color-comp-card-dashboard-light-bg-hover: var(
756
- --color-surface-brand-primary
757
- );
758
- --color-comp-card-dashboard-light-stroke-def: var(
759
- --color-stroke-base-secondary
760
- );
761
- --color-comp-card-dashboard-light-stroke-disabled: var(
762
- --color-stroke-base-secondary
763
- );
764
- --color-comp-card-dashboard-light-stroke-focused: var(
765
- --color-stroke-brand-focused
766
- );
767
- --color-comp-card-dashboard-light-stroke-hover: var(--color-stroke-brand-def);
768
- --color-comp-checkbox-bg-active: var(--color-surface-brand-primary);
769
- --color-comp-checkbox-bg-def: var(--color-surface-base-transparent);
770
- --color-comp-checkbox-bg-disabled: var(--color-surface-base-transparent);
771
- --color-comp-checkbox-bg-error: var(--color-surface-base-transparent);
772
- --color-comp-checkbox-bg-hover: var(--color-surface-brand-brand-tertiary);
773
- --color-comp-checkbox-stroke-def: var(--color-stroke-base-tertiary);
774
- --color-comp-checkbox-stroke-disabled: var(--color-stroke-base-disabled);
775
- --color-comp-checkbox-stroke-error: var(--color-text-state-error-def);
776
- --color-comp-checkbox-stroke-hover: var(--color-text-brand-hover);
777
- --color-comp-dialog-bg-android: var(--color-surface-base-secondary);
778
- --color-comp-dialog-text-def: var(--color-text-dark-primary-def);
779
- --color-comp-dropdown-menu-fill-base-def: var(
780
- --color-transparent-transparent
781
- );
782
- --color-comp-dropdown-menu-fill-base-disabled: var(
783
- --color-transparent-transparent
784
- );
785
- --color-comp-dropdown-menu-fill-base-focused: var(
786
- --color-surface-base-primary-focused-pressed
787
- );
788
- --color-comp-dropdown-menu-fill-base-hover: var(
789
- --color-surface-brand-brand-tertiary
790
- );
791
- --color-comp-dropdown-menu-fill-error-def: var(
792
- --color-transparent-transparent
793
- );
794
- --color-comp-dropdown-menu-fill-error-disabled: var(
795
- --color-transparent-transparent
796
- );
797
- --color-comp-dropdown-menu-fill-error-focused: var(
798
- --color-surface-error-ghost-focused
799
- );
800
- --color-comp-dropdown-menu-fill-error-hover: var(
801
- --color-surface-error-ghost-hover
802
- );
803
- --color-comp-dropdown-menu-icon-base-active: var(--color-icon-brand-def);
804
- --color-comp-dropdown-menu-icon-base-def: var(--color-text-dark-tertiary);
805
- --color-comp-dropdown-menu-icon-base-disabled: var(
806
- --color-icon-dark-tertiary
807
- );
808
- --color-comp-dropdown-menu-icon-base-focused: var(--color-icon-brand-focused);
809
- --color-comp-dropdown-menu-icon-base-hover: var(--color-icon-brand-hover);
810
- --color-comp-dropdown-menu-icon-error-def: var(--color-icon-error-def);
811
- --color-comp-dropdown-menu-icon-error-disabled: var(
812
- --color-icon-error-disabled
813
- );
814
- --color-comp-dropdown-menu-icon-error-focused: var(
815
- --color-icon-error-focused
816
- );
817
- --color-comp-dropdown-menu-icon-error-hover: var(--color-icon-error-hover);
818
- --color-comp-dropdown-menu-text-base-active: var(--color-text-brand-def);
819
- --color-comp-dropdown-menu-text-base-def: var(--color-text-dark-primary-def);
820
- --color-comp-dropdown-menu-text-base-disabled: var(
821
- --color-text-dark-disabled
822
- );
823
- --color-comp-dropdown-menu-text-base-focused: var(--color-text-brand-focused);
824
- --color-comp-dropdown-menu-text-base-hover: var(--color-text-brand-def);
825
- --color-comp-dropdown-menu-text-error-def: var(--color-text-state-error-def);
826
- --color-comp-dropdown-menu-text-error-disabled: var(
827
- --color-text-state-error-disabled
828
- );
829
- --color-comp-dropdown-menu-text-error-focused: var(
830
- --color-text-state-error-focused
831
- );
832
- --color-comp-dropdown-menu-text-error-hover: var(
833
- --color-text-state-error-hover
834
- );
835
- --color-comp-file-upload-fill-def: var(--color-surface-base-tertiary);
836
- --color-comp-file-upload-fill-disabled: var(
837
- --color-surface-dark-secondary-disabled
838
- );
839
- --color-comp-file-upload-fill-focused: var(
840
- --color-surface-base-primary-focused-pressed
841
- );
842
- --color-comp-file-upload-fill-ghost-hover: var(
843
- --color-surface-base-primary-disabled
844
- );
845
- --color-comp-file-upload-fill-hover: var(--color-surface-base-primary-hover);
846
- --color-comp-file-upload-icon-brand-def: var(--color-icon-brand-def);
847
- --color-comp-file-upload-icon-brand-disabled: var(--color-icon-dark-tertiary);
848
- --color-comp-file-upload-icon-brand-focused: var(--color-icon-brand-focused);
849
- --color-comp-file-upload-icon-brand-hover: var(--color-icon-brand-hover);
850
- --color-comp-file-upload-icon-def-disabled: var(--color-icon-dark-tertiary);
851
- --color-comp-file-upload-icon-def-hover: var(--color-icon-dark-primary-hover);
852
- --color-comp-file-upload-icon-def-primary: var(--color-icon-dark-primary-def);
853
- --color-comp-file-upload-icon-def-secondary: var(
854
- --color-icon-dark-secondary-def
855
- );
856
- --color-comp-file-upload-icon-error-def: var(--color-icon-error-def);
857
- --color-comp-file-upload-icon-error-disabled: var(
858
- --color-icon-error-disabled
859
- );
860
- --color-comp-file-upload-icon-error-focused-pressed: var(
861
- --color-icon-error-focused
862
- );
863
- --color-comp-file-upload-icon-error-hover: var(--color-icon-error-hover);
864
- --color-comp-file-upload-stroke-dashed-def: var(--color-stroke-dashed-def);
865
- --color-comp-file-upload-stroke-dashed-disabled: var(
866
- --color-stroke-base-disabled
867
- );
868
- --color-comp-file-upload-stroke-dashed-focused: var(
869
- --color-stroke-dashed-focused
870
- );
871
- --color-comp-file-upload-stroke-dashed-hover: var(
872
- --color-stroke-dashed-hover
873
- );
874
- --color-comp-file-upload-stroke-def-def: var(--color-stroke-base-primary);
875
- --color-comp-file-upload-stroke-def-disabled: var(
876
- --color-stroke-base-disabled
877
- );
878
- --color-comp-file-upload-stroke-def-focused: var(
879
- --color-stroke-brand-focused
880
- );
881
- --color-comp-file-upload-stroke-def-hover: var(--color-stroke-brand-hover);
882
- --color-comp-file-upload-stroke-error-def: var(--color-stroke-error-def);
883
- --color-comp-file-upload-stroke-error-focused: var(
884
- --color-stroke-error-focused
885
- );
886
- --color-comp-file-upload-stroke-error-hover: var(--color-stroke-error-hover);
887
- --color-comp-file-upload-text-brand-def: var(--color-text-brand-def);
888
- --color-comp-file-upload-text-brand-disabled: var(--color-text-dark-disabled);
889
- --color-comp-file-upload-text-brand-focused: var(--color-text-brand-focused);
890
- --color-comp-file-upload-text-brand-hover: var(--color-text-brand-hover);
891
- --color-comp-file-upload-text-dark-disabled: var(--color-text-dark-tertiary);
892
- --color-comp-file-upload-text-dark-focused: var(
893
- --color-text-dark-primary-focused
894
- );
895
- --color-comp-file-upload-text-dark-hover: var(
896
- --color-text-dark-primary-hover
897
- );
898
- --color-comp-file-upload-text-dark-primary: var(
899
- --color-text-dark-primary-def
900
- );
901
- --color-comp-file-upload-text-dark-secondary: var(
902
- --color-text-dark-secondary
903
- );
904
- --color-comp-file-upload-text-error-def: var(--color-text-state-error-def);
905
- --color-comp-file-upload-text-error-disabled: var(
906
- --color-text-state-error-disabled
907
- );
908
- --color-comp-file-upload-text-error-focused: var(
909
- --color-text-state-error-focused
910
- );
911
- --color-comp-file-upload-text-error-hover: var(
912
- --color-text-state-error-hover
913
- );
914
- --color-comp-header-icon-def: var(--color-icon-dark-primary-def);
915
- --color-comp-header-icon-invert: var(--color-icon-invert-def);
916
- --color-comp-header-text-def: var(--color-text-dark-primary-def);
917
- --color-comp-header-text-invert: var(--color-text-invert-def);
918
- --color-comp-info-ico-def: var(--color-icon-dark-secondary-def);
919
- --color-comp-info-ico-disabled: var(--color-icon-dark-tertiary);
920
- --color-comp-info-ico-focused: var(--color-icon-brand-focused);
921
- --color-comp-info-ico-hover: var(--color-icon-brand-def);
922
- --color-comp-input-fill-def: var(--color-surface-base-secondary);
923
- --color-comp-input-fill-disabled: var(
924
- --color-surface-dark-secondary-disabled
925
- );
926
- --color-comp-input-fill-focused: var(
927
- --color-surface-base-primary-focused-pressed
928
- );
929
- --color-comp-input-fill-hover: var(--color-surface-base-primary-hover);
930
- --color-comp-input-icon-brand-def: var(--color-icon-brand-def);
931
- --color-comp-input-icon-brand-focused: var(--color-icon-brand-focused);
932
- --color-comp-input-icon-brand-hover: var(--color-icon-brand-hover);
933
- --color-comp-input-icon-error-def: var(--color-icon-error-def);
934
- --color-comp-input-icon-error-focused: var(--color-icon-error-focused);
935
- --color-comp-input-icon-error-hover: var(--color-icon-error-hover);
936
- --color-comp-input-stroke-def: var(--color-stroke-base-primary);
937
- --color-comp-input-stroke-disabled: var(--color-stroke-base-disabled);
938
- --color-comp-input-stroke-error-def: var(--color-stroke-error-def);
939
- --color-comp-input-stroke-error-focused: var(--color-stroke-error-focused);
940
- --color-comp-input-stroke-error-hover: var(--color-stroke-error-hover);
941
- --color-comp-input-stroke-focused: var(--color-stroke-brand-focused);
942
- --color-comp-input-stroke-hover: var(--color-stroke-brand-hover);
943
- --color-comp-input-text-disabled: var(--color-text-dark-disabled);
944
- --color-comp-input-text-error: var(--color-text-state-error-def);
945
- --color-comp-input-text-placeholder: var(--color-text-dark-tertiary);
946
- --color-comp-input-text-primary: var(--color-text-dark-primary-def);
947
- --color-comp-input-text-secondary: var(--color-text-dark-secondary);
948
- --color-comp-market-category-books-primary: var(--color-other-blue);
949
- --color-comp-market-category-books-secondary: var(--color-other-blue-light);
950
- --color-comp-market-category-culture-primary: var(--color-other-pink);
951
- --color-comp-market-category-culture-secondary: var(--color-other-pink-light);
952
- --color-comp-market-category-edu-primary: var(--color-other-purple);
953
- --color-comp-market-category-edu-secondary: var(--color-other-purple-light);
954
- --color-comp-market-category-food-primary: var(--color-other-red);
955
- --color-comp-market-category-food-secondary: var(--color-other-red-light);
956
- --color-comp-market-category-health-primary: var(--color-other-green);
957
- --color-comp-market-category-health-secondary: var(--color-other-green-light);
958
- --color-comp-market-category-recreation-primary: var(--color-other-yellow);
959
- --color-comp-market-category-recreation-secondary: var(
960
- --color-other-yellow-light
961
- );
962
- --color-comp-market-category-sport-primary: var(--color-other-orange);
963
- --color-comp-market-category-sport-secondary: var(--color-other-orange-light);
964
- --color-comp-pagination-bg-def: var(--color-surface-base-transparent);
965
- --color-comp-pagination-bg-disabled: var(--color-surface-base-transparent);
966
- --color-comp-pagination-bg-error: var(--color-surface-base-transparent);
967
- --color-comp-pagination-bg-focused: var(--color-surface-brand-ghost-focused);
968
- --color-comp-pagination-bg-hover: var(--color-surface-brand-ghost-hover);
969
- --color-comp-pagination-text-def: var(--color-text-dark-secondary);
970
- --color-comp-pagination-text-disabled: var(--color-text-dark-disabled);
971
- --color-comp-pagination-text-error: var(--color-text-state-error-def);
972
- --color-comp-pagination-text-focused: var(--color-text-brand-def);
973
- --color-comp-pagination-text-hover: var(--color-text-dark-secondary);
974
- --color-comp-pin-bg-active: var(--color-surface-brand-primary);
975
- --color-comp-pin-bg-empty: var(--color-surface-base-transparent);
976
- --color-comp-pin-border-def: var(--color-stroke-dark-def);
977
- --color-comp-pin-border-none: #1c1a1f00;
978
- --color-comp-quantity-selector-bg-def: var(--color-surface-base-tertiary);
979
- --color-comp-quantity-selector-bg-disabled: var(--color-gray-50);
980
- --color-comp-quantity-selector-bg-focused: var(
981
- --color-surface-brand-brand-tertiary
982
- );
983
- --color-comp-quantity-selector-bg-hover: var(
984
- --color-surface-brand-brand-tertiary
985
- );
986
- --color-comp-quantity-selector-bg-selected: var(
987
- --color-surface-brand-brand-tertiary
988
- );
989
- --color-comp-select-fill-def: var(--color-surface-base-secondary);
990
- --color-comp-select-fill-disabled: var(
991
- --color-surface-dark-secondary-disabled
992
- );
993
- --color-comp-select-fill-focused: var(
994
- --color-surface-base-primary-focused-pressed
995
- );
996
- --color-comp-select-fill-hover: var(--color-surface-base-primary-hover);
997
- --color-comp-select-icon-brand-def: var(--color-icon-brand-def);
998
- --color-comp-select-icon-brand-focused: var(--color-icon-brand-focused);
999
- --color-comp-select-icon-brand-hover: var(--color-icon-brand-hover);
1000
- --color-comp-select-icon-disabled: var(--color-icon-dark-tertiary);
1001
- --color-comp-select-icon-error-def: var(--color-icon-error-def);
1002
- --color-comp-select-icon-error-focused: var(--color-icon-error-focused);
1003
- --color-comp-select-icon-error-hover: var(--color-icon-error-hover);
1004
- --color-comp-select-stroke-def: var(--color-stroke-base-primary);
1005
- --color-comp-select-stroke-disabled: var(--color-stroke-base-disabled);
1006
- --color-comp-select-stroke-error-def: var(--color-stroke-error-def);
1007
- --color-comp-select-stroke-error-focused: var(--color-stroke-error-focused);
1008
- --color-comp-select-stroke-error-hover: var(--color-stroke-error-hover);
1009
- --color-comp-select-stroke-focused: var(--color-stroke-brand-focused);
1010
- --color-comp-select-stroke-hover: var(--color-stroke-brand-hover);
1011
- --color-comp-select-text-brand: var(--color-text-brand-def);
1012
- --color-comp-select-text-disabled: var(--color-text-dark-disabled);
1013
- --color-comp-select-text-error: var(--color-text-state-error-def);
1014
- --color-comp-select-text-placeholder: var(--color-text-dark-tertiary);
1015
- --color-comp-select-text-primary: var(--color-text-dark-primary-def);
1016
- --color-comp-select-text-secondary: var(--color-text-dark-secondary);
1017
- --color-comp-sidebar-menu-item-def: var(--color-surface-base-transparent);
1018
- --color-comp-sidebar-menu-item-disabled: var(
1019
- --color-surface-base-transparent
1020
- );
1021
- --color-comp-sidebar-menu-item-focused: var(
1022
- --color-surface-invert-transparent-focused
1023
- );
1024
- --color-comp-sidebar-menu-item-hover: var(
1025
- --color-surface-invert-transparent-hover
1026
- );
1027
- --color-comp-slider-indicators-bg-active: var(--color-surface-brand-primary);
1028
- --color-comp-slider-indicators-bg-def: var(--color-surface-brand-secondary);
1029
- --color-comp-submenu-admin-bg-def: var(--color-surface-state-bg-info);
1030
- --color-comp-submenu-admin-bg-disabled: var(
1031
- --color-surface-brand-primary-disabled
1032
- );
1033
- --color-comp-submenu-admin-bg-focused: var(--color-surface-brand-primary);
1034
- --color-comp-submenu-admin-bg-hover: var(--color-text-brand-hover);
1035
- --color-comp-submenu-admin-ico-def: var(--color-icon-brand-def);
1036
- --color-comp-submenu-admin-ico-disabled: var(--color-icon-dark-tertiary);
1037
- --color-comp-submenu-admin-ico-focused: var(--color-icon-invert-def);
1038
- --color-comp-submenu-admin-ico-hover: var(--color-icon-invert-def);
1039
- --color-comp-submenu-admin-text-def: var(--color-text-dark-secondary);
1040
- --color-comp-submenu-admin-text-disabled: var(--color-text-dark-disabled);
1041
- --color-comp-submenu-admin-text-focused: var(--color-text-brand-def);
1042
- --color-comp-submenu-admin-text-hover: var(--color-text-brand-hover);
1043
- --color-comp-switch-bg-active-def: var(--color-surface-brand-primary);
1044
- --color-comp-switch-bg-active-disabled: var(--color-surface-brand-secondary);
1045
- --color-comp-switch-bg-inactive-def: var(
1046
- --color-surface-brand-brand-tertiary
1047
- );
1048
- --color-comp-switch-bg-inactive-disabled: var(
1049
- --color-surface-dark-secondary-disabled
1050
- );
1051
- --color-comp-switch-bg-item: var(--color-neutral-white);
1052
- --color-comp-tab-bar-bg-brand: var(--color-surface-brand-primary);
1053
- --color-comp-tab-bar-bg-def: var(--color-surface-base-secondary);
1054
- --color-comp-tab-bar-border-def: var(--color-stroke-base-secondary);
1055
- --color-comp-tab-bar-icon-active: var(--color-icon-brand-def);
1056
- --color-comp-tab-bar-icon-def: var(--color-icon-dark-secondary-def);
1057
- --color-comp-tab-bar-icon-invert: var(--color-icon-invert-def);
1058
- --color-comp-tab-bar-text-active: var(--color-text-brand-def);
1059
- --color-comp-tab-bar-text-def: var(--color-text-dark-secondary);
1060
- --color-comp-texteditor-bg-def: var(--color-surface-base-transparent);
1061
- --color-comp-texteditor-bg-disabled: var(--color-surface-base-transparent);
1062
- --color-comp-texteditor-bg-focused: var(--color-surface-brand-brand-tertiary);
1063
- --color-comp-texteditor-bg-hover: var(--color-surface-base-primary-hover);
1064
- --color-comp-texteditor-ico-def: var(--color-icon-brand-def);
1065
- --color-comp-texteditor-ico-disabled: var(--color-icon-dark-tertiary);
1066
- --color-comp-texteditor-ico-focused: var(--color-icon-brand-def);
1067
- --color-comp-texteditor-ico-hover: var(--color-icon-brand-hover);
1068
- --color-comp-texteditor-stroke-def: var(
1069
- --color-comp-accordeon-settings-stroke-def
1070
- );
1071
- --color-comp-texteditor-stroke-disabled: var(
1072
- --color-comp-accordeon-settings-stroke-disabled
1073
- );
1074
- --color-comp-texteditor-stroke-error: var(--color-stroke-error-def);
1075
- --color-comp-texteditor-stroke-focused: var(--color-stroke-brand-focused);
1076
- --color-comp-texteditor-stroke-hover: var(--color-stroke-brand-hover);
1077
- --color-comp-time-picker-active: var(--color-surface-brand-primary);
1078
- --color-comp-time-picker-def: var(--color-gray-400);
1079
- --color-comp-time-picker-disabled: var(--color-red-100);
1080
- --color-comp-time-picker-focused: var(
1081
- --color-surface-brand-primary-focused-pressed
1082
- );
1083
- --color-comp-time-picker-hover: var(--color-surface-brand-primary-hover);
1084
- --color-icon-brand-def: var(--brand-primary);
1085
- --color-icon-brand-focused: var(--brand-focused);
1086
- --color-icon-brand-hover: var(--brand-hover);
1087
- --color-icon-brand-pressed: var(--brand-focused);
1088
- --color-icon-dark-primary-def: var(--color-black-dramatic-950);
1089
- --color-icon-dark-primary-focused: var(--color-gray-1000);
1090
- --color-icon-dark-primary-hover: var(--color-gray-900);
1091
- --color-icon-dark-primary-pressed: var(--color-gray-1000);
1092
- --color-icon-dark-secondary-def: var(--color-gray-700);
1093
- --color-icon-dark-secondary-focused: var(--color-gray-900);
1094
- --color-icon-dark-secondary-hover: var(--color-gray-800);
1095
- --color-icon-dark-secondary-pressed: var(--color-gray-900);
1096
- --color-icon-dark-tertiary: var(--color-gray-500);
1097
- --color-icon-error-def: var(--color-red-500);
1098
- --color-icon-error-disabled: var(--color-transparent-red-35);
1099
- --color-icon-error-focused: var(--color-red-700);
1100
- --color-icon-error-hover: var(--color-red-600);
1101
- --color-icon-error-pressed: var(--color-red-700);
1102
- --color-icon-invert-def: var(--color-neutral-white);
1103
- --color-icon-invert-focused: var(--color-gray-400);
1104
- --color-icon-invert-hover: var(--color-gray-300);
1105
- --color-icon-invert-invert-disabled: var(--color-gray-700);
1106
- --color-icon-invert-pressed: var(--color-gray-400);
1107
- --color-stroke-base-disabled: var(--color-transparent-light-40);
1108
- --color-stroke-base-primary: var(--color-gray-300);
1109
- --color-stroke-base-primary-focused: var(--color-gray-500);
1110
- --color-stroke-base-primary-hover: var(--color-gray-300);
1111
- --color-stroke-base-primary-pressed: var(--color-gray-500);
1112
- --color-stroke-base-secondary: var(--color-gray-200);
1113
- --color-stroke-base-success: var(--color-green-500);
1114
- --color-stroke-base-tertiary: var(--color-gray-600);
1115
- --color-stroke-base-warning: var(--color-orange-500);
1116
- --color-stroke-brand-def: var(--brand-primary);
1117
- --color-stroke-brand-disabled: var(--brand-15);
1118
- --color-stroke-brand-focused: var(--brand-focused);
1119
- --color-stroke-brand-hover: var(--brand-hover);
1120
- --color-stroke-brand-pressed: var(--brand-focused);
1121
- --color-stroke-dark-def: var(--color-black-dramatic-950);
1122
- --color-stroke-dark-disabled: var(--color-gray-500);
1123
- --color-stroke-dark-focused: var(--color-black-dramatic-900);
1124
- --color-stroke-dark-hover: var(--color-black-dramatic-900);
1125
- --color-stroke-dark-pressed: var(--color-black-dramatic-900);
1126
- --color-stroke-dashed-def: var(--color-gray-500);
1127
- --color-stroke-dashed-disabled: var(--color-gray-400);
1128
- --color-stroke-dashed-focused: var(--color-gray-600);
1129
- --color-stroke-dashed-hover: var(--color-gray-600);
1130
- --color-stroke-dashed-pressed: var(--color-gray-600);
1131
- --color-stroke-error-def: var(--color-red-500);
1132
- --color-stroke-error-disabled: var(--color-transparent-red-35);
1133
- --color-stroke-error-focused: var(--color-red-700);
1134
- --color-stroke-error-hover: var(--color-red-600);
1135
- --color-stroke-error-pressed: var(--color-red-700);
1136
- --color-stroke-focus-outline-def: var(--brand-primary);
1137
- --color-stroke-invert-primary: var(--brand-white);
1138
- --color-stroke-invert-secondary: var(--color-transparent-light-25);
1139
- --color-surface-base-overlay: var(--color-transparent-dark-70);
1140
- --color-surface-base-primary: var(--color-gray-50);
1141
- --color-surface-base-primary-disabled: var(--color-transparent-light-15);
1142
- --color-surface-base-primary-focused-pressed: var(--color-gray-400);
1143
- --color-surface-base-primary-hover: var(--color-gray-300);
1144
- --color-surface-base-secondary: var(--color-neutral-white);
1145
- --color-surface-base-tertiary: var(--brand-white);
1146
- --color-surface-base-transparent: var(--color-transparent-transparent);
1147
- --color-surface-brand-brand-tertiary: var(--brand-tertiary);
1148
- --color-surface-brand-primary: var(--brand-primary);
1149
- --color-surface-brand-primary-disabled: var(--brand-8);
1150
- --color-surface-brand-primary-focused-pressed: var(--brand-focused);
1151
- --color-surface-brand-primary-hover: var(--brand-hover);
1152
- --color-surface-brand-secondary: var(--brand-disabled);
1153
- --color-surface-brand-ghost-focused: var(--brand-12);
1154
- --color-surface-brand-ghost-hover: var(--brand-8);
1155
- --color-surface-dark-def: var(--color-black-dramatic-950);
1156
- --color-surface-dark-focused-pressed: var(--color-black-dramatic-900);
1157
- --color-surface-dark-hover: var(--color-black-dramatic-900);
1158
- --color-surface-dark-secondary-disabled: var(--color-transparent-dark-10);
1159
- --color-surface-dark-ghost-focused: var(--color-transparent-dark-10);
1160
- --color-surface-dark-ghost-hover: var(--color-transparent-dark-8);
1161
- --color-surface-error-def: var(--color-red-500);
1162
- --color-surface-error-disabled: var(--color-transparent-red-10);
1163
- --color-surface-error-focused: var(--color-red-700);
1164
- --color-surface-error-hover: var(--color-red-600);
1165
- --color-surface-error-pressed: var(--color-red-700);
1166
- --color-surface-error-ghost-focused: var(--color-transparent-red-10);
1167
- --color-surface-error-ghost-hover: var(--color-transparent-red-8);
1168
- --color-surface-icon-bg-dark: var(--color-transparent-dark-10);
1169
- --color-surface-icon-bg-error: var(--color-transparent-red-20);
1170
- --color-surface-icon-bg-light: var(--color-transparent-white-15);
1171
- --color-surface-invert-ghost-focused: var(--color-transparent-light-25);
1172
- --color-surface-invert-ghost-hover: var(--color-transparent-light-15);
1173
- --color-surface-invert-transparent-focused: var(--color-transparent-light-15);
1174
- --color-surface-invert-transparent-hover: var(--color-transparent-light-25);
1175
- --color-surface-state-bg-error: var(--color-transparent-red-15);
1176
- --color-surface-state-bg-info: var(--brand-12);
1177
- --color-surface-state-bg-success: var(--color-transparent-green-15);
1178
- --color-surface-state-bg-warning: var(--color-transparent-orange-15);
1179
- --color-text-brand-def: var(--brand-primary);
1180
- --color-text-brand-focused: var(--brand-focused);
1181
- --color-text-brand-hover: var(--brand-hover);
1182
- --color-text-brand-pressed: var(--brand-focused);
1183
- --color-text-dark-disabled: var(--color-gray-500);
1184
- --color-text-dark-primary-def: var(--color-black-dramatic-950);
1185
- --color-text-dark-primary-focused: var(--color-gray-1000);
1186
- --color-text-dark-primary-hover: var(--color-gray-900);
1187
- --color-text-dark-primary-pressed: var(--color-gray-1000);
1188
- --color-text-dark-secondary: var(--color-gray-900);
1189
- --color-text-dark-tertiary: var(--color-gray-700);
1190
- --color-text-invert-def: var(--color-neutral-white);
1191
- --color-text-invert-focused: var(--color-gray-400);
1192
- --color-text-invert-hover: var(--color-gray-300);
1193
- --color-text-invert-pressed: var(--color-gray-400);
1194
- --color-text-state-error-def: var(--color-red-500);
1195
- --color-text-state-error-disabled: var(--color-transparent-red-35);
1196
- --color-text-state-error-focused: var(--color-red-700);
1197
- --color-text-state-error-hover: var(--color-red-600);
1198
- --color-text-state-error-pressed: var(--color-red-700);
1199
- --color-text-state-success: var(--color-green-500);
1200
- --color-text-state-warning: var(--color-orange-800);
1201
- }
1
+ @theme inline {
2
+ /* color */
3
+ --color-comp-accordeon-settings-bg-primary-def: var(
4
+ --color-surface-base-secondary
5
+ );
6
+ --color-comp-accordeon-settings-bg-primary-disabled: var(
7
+ --color-surface-base-secondary
8
+ );
9
+ --color-comp-accordeon-settings-bg-primary-focused: var(
10
+ --color-surface-base-secondary
11
+ );
12
+ --color-comp-accordeon-settings-bg-primary-hover: var(
13
+ --color-surface-base-secondary
14
+ );
15
+ --color-comp-accordeon-settings-bg-secondary: var(
16
+ --color-surface-base-primary
17
+ );
18
+ --color-comp-accordeon-settings-stroke-def: var(
19
+ --color-stroke-base-secondary
20
+ );
21
+ --color-comp-accordeon-settings-stroke-disabled: var(
22
+ --color-stroke-base-secondary
23
+ );
24
+ --color-comp-accordeon-settings-stroke-focused: var(
25
+ --color-surface-base-transparent
26
+ );
27
+ --color-comp-accordeon-settings-stroke-hover: var(--color-stroke-brand-hover);
28
+ --color-comp-alert-bg-error: var(--color-surface-state-bg-error);
29
+ --color-comp-alert-bg-info: var(--color-surface-state-bg-info);
30
+ --color-comp-alert-bg-success: var(--color-surface-state-bg-success);
31
+ --color-comp-alert-bg-warning: var(--color-surface-state-bg-warning);
32
+ --color-comp-alert-text-error: var(--color-text-state-error-def);
33
+ --color-comp-alert-text-info: var(--color-text-brand-def);
34
+ --color-comp-alert-text-success: var(--color-text-state-success);
35
+ --color-comp-alert-text-warning: var(--color-text-state-warning);
36
+ --color-comp-benefit-card-bg-def: var(--color-surface-base-secondary);
37
+ --color-comp-benefit-card-bg-disabled: var(--color-surface-base-secondary);
38
+ --color-comp-benefit-card-bg-focused: var(--color-surface-base-secondary);
39
+ --color-comp-benefit-card-bg-hover: var(--color-surface-base-secondary);
40
+ --color-comp-benefit-card-icon-active: var(--color-icon-brand-def);
41
+ --color-comp-benefit-card-icon-def: var(--color-icon-dark-secondary-def);
42
+ --color-comp-benefit-card-icon-disabled: var(--color-icon-dark-tertiary);
43
+ --color-comp-benefit-card-icon-focused: var(--color-icon-brand-focused);
44
+ --color-comp-benefit-card-icon-hover: var(--color-icon-brand-hover);
45
+ --color-comp-benefit-card-stroke-def: var(--color-stroke-base-secondary);
46
+ --color-comp-benefit-card-stroke-disabled: var(--color-stroke-base-secondary);
47
+ --color-comp-benefit-card-stroke-focused: var(--color-stroke-brand-focused);
48
+ --color-comp-benefit-card-stroke-hover: var(--color-stroke-brand-hover);
49
+ --color-comp-benefit-card-text-disabled: var(--color-text-dark-tertiary);
50
+ --color-comp-benefit-card-text-focused: var(--color-text-dark-primary-def);
51
+ --color-comp-benefit-card-text-hover: var(--color-text-dark-primary-def);
52
+ --color-comp-benefit-card-text-primary: var(--color-text-dark-primary-def);
53
+ --color-comp-benefit-card-text-secondary: var(--color-text-dark-secondary);
54
+ --color-comp-button-danger-ghost-bg-def: var(--color-transparent-transparent);
55
+ --color-comp-button-danger-ghost-bg-disabled: var(
56
+ --color-transparent-transparent
57
+ );
58
+ --color-comp-button-danger-ghost-bg-focused: var(
59
+ --color-surface-error-ghost-focused
60
+ );
61
+ --color-comp-button-danger-ghost-bg-hover: var(
62
+ --color-surface-error-ghost-hover
63
+ );
64
+ --color-comp-button-danger-ghost-bg-pressed: var(
65
+ --color-surface-error-ghost-focused
66
+ );
67
+ --color-comp-button-danger-ghost-stroke-def: var(--color-stroke-error-def);
68
+ --color-comp-button-danger-ghost-stroke-disabled: var(
69
+ --color-stroke-error-disabled
70
+ );
71
+ --color-comp-button-danger-ghost-stroke-focused: var(
72
+ --color-stroke-error-focused
73
+ );
74
+ --color-comp-button-danger-ghost-stroke-hover: var(
75
+ --color-stroke-error-hover
76
+ );
77
+ --color-comp-button-danger-ghost-stroke-pressed: var(
78
+ --color-stroke-error-pressed
79
+ );
80
+ --color-comp-button-danger-ghost-text-def: var(--color-text-state-error-def);
81
+ --color-comp-button-danger-ghost-text-disabled: var(
82
+ --color-text-state-error-disabled
83
+ );
84
+ --color-comp-button-danger-ghost-text-focused: var(
85
+ --color-text-state-error-focused
86
+ );
87
+ --color-comp-button-danger-ghost-text-hover: var(
88
+ --color-text-state-error-hover
89
+ );
90
+ --color-comp-button-danger-ghost-text-pressed: var(
91
+ --color-text-state-error-pressed
92
+ );
93
+ --color-comp-button-danger-bg-def: var(--color-surface-error-def);
94
+ --color-comp-button-danger-bg-disabled: var(--color-surface-error-disabled);
95
+ --color-comp-button-danger-bg-focused: var(--color-surface-error-focused);
96
+ --color-comp-button-danger-bg-hover: var(--color-surface-error-hover);
97
+ --color-comp-button-danger-bg-pressed: var(--color-surface-error-focused);
98
+ --color-comp-button-danger-stroke-def: var(--color-stroke-error-def);
99
+ --color-comp-button-danger-stroke-disabled: var(
100
+ --color-stroke-error-disabled
101
+ );
102
+ --color-comp-button-danger-stroke-focused: var(--color-stroke-error-focused);
103
+ --color-comp-button-danger-stroke-hover: var(--color-stroke-error-hover);
104
+ --color-comp-button-danger-stroke-pressed: var(--color-stroke-error-pressed);
105
+ --color-comp-button-danger-swipe-btn-def: var(--color-red-400);
106
+ --color-comp-button-danger-swipe-btn-disabled: var(
107
+ --color-surface-error-disabled
108
+ );
109
+ --color-comp-button-danger-swipe-btn-focused: var(--color-red-400);
110
+ --color-comp-button-danger-swipe-btn-hover: var(--color-red-400);
111
+ --color-comp-button-danger-swipe-progress-def: var(--color-red-900);
112
+ --color-comp-button-danger-swipe-progress-disabled: var(
113
+ --color-black-dramatic-200
114
+ );
115
+ --color-comp-button-danger-swipe-progress-focused: var(--color-red-400);
116
+ --color-comp-button-danger-swipe-progress-hover: var(--color-red-400);
117
+ --color-comp-button-danger-text-def: var(--color-text-invert-def);
118
+ --color-comp-button-danger-text-disabled: var(
119
+ --color-text-state-error-disabled
120
+ );
121
+ --color-comp-button-danger-text-focused: var(--color-text-invert-focused);
122
+ --color-comp-button-danger-text-hover: var(--color-text-invert-hover);
123
+ --color-comp-button-danger-text-pressed: var(--color-text-invert-pressed);
124
+ --color-comp-button-dashed-danger-text-disabled: var(
125
+ --color-text-dark-tertiary
126
+ );
127
+ --color-comp-button-dashed-danger-ghost-text-disabled: var(
128
+ --color-text-dark-tertiary
129
+ );
130
+ --color-comp-button-dashed-danger-ghost-bg-def: var(
131
+ --color-transparent-transparent
132
+ );
133
+ --color-comp-button-dashed-danger-ghost-bg-disabled: var(
134
+ --color-transparent-transparent
135
+ );
136
+ --color-comp-button-dashed-danger-ghost-bg-focused: var(
137
+ --color-surface-error-ghost-focused
138
+ );
139
+ --color-comp-button-dashed-danger-ghost-bg-hover: var(
140
+ --color-surface-error-ghost-hover
141
+ );
142
+ --color-comp-button-dashed-danger-ghost-bg-pressed: var(
143
+ --color-surface-error-ghost-focused
144
+ );
145
+ --color-comp-button-dashed-danger-ghost-stroke-def: var(
146
+ --color-stroke-error-def
147
+ );
148
+ --color-comp-button-dashed-danger-ghost-stroke-disabled: var(
149
+ --color-stroke-error-disabled
150
+ );
151
+ --color-comp-button-dashed-danger-ghost-stroke-focused: var(
152
+ --color-stroke-error-focused
153
+ );
154
+ --color-comp-button-dashed-danger-ghost-stroke-hover: var(
155
+ --color-stroke-error-hover
156
+ );
157
+ --color-comp-button-dashed-danger-ghost-stroke-pressed: var(
158
+ --color-stroke-error-pressed
159
+ );
160
+ --color-comp-button-dashed-danger-ghost-text-def: var(
161
+ --color-text-state-error-def
162
+ );
163
+ --color-comp-button-dashed-danger-ghost-text-disabled: var(
164
+ --color-text-state-error-disabled
165
+ );
166
+ --color-comp-button-dashed-danger-ghost-text-focused: var(
167
+ --color-text-state-error-focused
168
+ );
169
+ --color-comp-button-dashed-danger-ghost-text-hover: var(
170
+ --color-text-state-error-hover
171
+ );
172
+ --color-comp-button-dashed-danger-ghost-text-pressed: var(
173
+ --color-text-state-error-pressed
174
+ );
175
+ --color-comp-button-dashed-danger-bg-def: var(--color-surface-base-secondary);
176
+ --color-comp-button-dashed-danger-bg-disabled: var(
177
+ --color-surface-base-primary-disabled
178
+ );
179
+ --color-comp-button-dashed-danger-bg-focused: var(
180
+ --color-surface-base-primary-focused-pressed
181
+ );
182
+ --color-comp-button-dashed-danger-bg-hover: var(
183
+ --color-surface-base-primary-hover
184
+ );
185
+ --color-comp-button-dashed-danger-bg-pressed: var(
186
+ --color-surface-base-primary-focused-pressed
187
+ );
188
+ --color-comp-button-dashed-danger-stroke-def: var(--color-stroke-error-def);
189
+ --color-comp-button-dashed-danger-stroke-disabled: var(
190
+ --color-stroke-error-disabled
191
+ );
192
+ --color-comp-button-dashed-danger-stroke-focused: var(
193
+ --color-stroke-error-focused
194
+ );
195
+ --color-comp-button-dashed-danger-stroke-hover: var(
196
+ --color-stroke-error-hover
197
+ );
198
+ --color-comp-button-dashed-danger-stroke-pressed: var(
199
+ --color-stroke-error-pressed
200
+ );
201
+ --color-comp-button-dashed-danger-text-def: var(--color-text-state-error-def);
202
+ --color-comp-button-dashed-danger-text-disabled: var(
203
+ --color-text-state-error-disabled
204
+ );
205
+ --color-comp-button-dashed-danger-text-focused: var(
206
+ --color-text-state-error-focused
207
+ );
208
+ --color-comp-button-dashed-danger-text-hover: var(
209
+ --color-text-state-error-hover
210
+ );
211
+ --color-comp-button-dashed-danger-text-pressed: var(
212
+ --color-text-state-error-pressed
213
+ );
214
+ --color-comp-button-dashed-ghost-bg-def: var(--color-transparent-transparent);
215
+ --color-comp-button-dashed-ghost-bg-disabled: var(
216
+ --color-transparent-transparent
217
+ );
218
+ --color-comp-button-dashed-ghost-bg-focused: var(
219
+ --color-surface-dark-ghost-focused
220
+ );
221
+ --color-comp-button-dashed-ghost-bg-hover: var(
222
+ --color-surface-dark-ghost-hover
223
+ );
224
+ --color-comp-button-dashed-ghost-bg-pressed: var(
225
+ --color-surface-dark-ghost-focused
226
+ );
227
+ --color-comp-button-dashed-ghost-stroke-def: var(--color-stroke-dashed-def);
228
+ --color-comp-button-dashed-ghost-stroke-disabled: var(
229
+ --color-stroke-base-disabled
230
+ );
231
+ --color-comp-button-dashed-ghost-stroke-focused: var(
232
+ --color-stroke-dashed-focused
233
+ );
234
+ --color-comp-button-dashed-ghost-stroke-hover: var(
235
+ --color-stroke-dashed-hover
236
+ );
237
+ --color-comp-button-dashed-ghost-stroke-pressed: var(
238
+ --color-stroke-dashed-pressed
239
+ );
240
+ --color-comp-button-dashed-ghost-text-def: var(--color-text-dark-primary-def);
241
+ --color-comp-button-dashed-ghost-text-disabled: var(
242
+ --color-text-dark-tertiary
243
+ );
244
+ --color-comp-button-dashed-ghost-text-focused: var(
245
+ --color-text-dark-primary-focused
246
+ );
247
+ --color-comp-button-dashed-ghost-text-hover: var(
248
+ --color-text-dark-primary-hover
249
+ );
250
+ --color-comp-button-dashed-ghost-text-pressed: var(
251
+ --color-text-dark-primary-pressed
252
+ );
253
+ --color-comp-button-dashed-bg-def: var(--color-surface-base-secondary);
254
+ --color-comp-button-dashed-bg-disabled: var(
255
+ --color-surface-base-primary-disabled
256
+ );
257
+ --color-comp-button-dashed-bg-focused: var(
258
+ --color-surface-base-primary-focused-pressed
259
+ );
260
+ --color-comp-button-dashed-bg-hover: var(--color-surface-base-primary-hover);
261
+ --color-comp-button-dashed-bg-pressed: var(
262
+ --color-surface-base-primary-focused-pressed
263
+ );
264
+ --color-comp-button-dashed-stroke-def: var(--color-stroke-dashed-def);
265
+ --color-comp-button-dashed-stroke-disabled: var(--color-stroke-base-disabled);
266
+ --color-comp-button-dashed-stroke-focused: var(--color-stroke-dashed-focused);
267
+ --color-comp-button-dashed-stroke-hover: var(--color-stroke-dashed-hover);
268
+ --color-comp-button-dashed-stroke-pressed: var(--color-stroke-dashed-pressed);
269
+ --color-comp-button-dashed-text-def: var(--color-text-dark-primary-def);
270
+ --color-comp-button-dashed-text-disabled: var(--color-text-dark-tertiary);
271
+ --color-comp-button-dashed-text-focused: var(
272
+ --color-text-dark-primary-focused
273
+ );
274
+ --color-comp-button-dashed-text-hover: var(--color-text-dark-primary-hover);
275
+ --color-comp-button-dashed-text-pressed: var(
276
+ --color-text-dark-primary-pressed
277
+ );
278
+ --color-comp-button-invert-danger-bg-def: var(--color-surface-base-tertiary);
279
+ --color-comp-button-invert-danger-bg-disabled: var(
280
+ --color-surface-base-primary-disabled
281
+ );
282
+ --color-comp-button-invert-danger-bg-focused: var(
283
+ --color-surface-base-primary-focused-pressed
284
+ );
285
+ --color-comp-button-invert-danger-bg-hover: var(
286
+ --color-surface-base-primary-hover
287
+ );
288
+ --color-comp-button-invert-danger-bg-pressed: var(
289
+ --color-surface-base-primary-focused-pressed
290
+ );
291
+ --color-comp-button-invert-danger-stroke-def: var(
292
+ --color-stroke-base-secondary
293
+ );
294
+ --color-comp-button-invert-danger-stroke-disabled: var(
295
+ --color-stroke-base-disabled
296
+ );
297
+ --color-comp-button-invert-danger-stroke-focused: var(
298
+ --color-stroke-base-primary-focused
299
+ );
300
+ --color-comp-button-invert-danger-stroke-hover: var(
301
+ --color-stroke-base-primary-hover
302
+ );
303
+ --color-comp-button-invert-danger-stroke-pressed: var(
304
+ --color-stroke-base-primary-pressed
305
+ );
306
+ --color-comp-button-invert-danger-swipe-btn-def: var(--color-red-100);
307
+ --color-comp-button-invert-danger-swipe-btn-disabled: var(
308
+ --color-surface-error-disabled
309
+ );
310
+ --color-comp-button-invert-danger-swipe-btn-focused: var(--color-red-100);
311
+ --color-comp-button-invert-danger-swipe-btn-hover: var(--color-red-100);
312
+ --color-comp-button-invert-danger-swipe-progress-def: var(--color-red-200);
313
+ --color-comp-button-invert-danger-swipe-progress-disabled: var(
314
+ --color-red-50
315
+ );
316
+ --color-comp-button-invert-danger-swipe-progress-focused: var(
317
+ --color-red-100
318
+ );
319
+ --color-comp-button-invert-danger-swipe-progress-hover: var(--color-red-100);
320
+ --color-comp-button-invert-danger-text-def: var(--color-text-state-error-def);
321
+ --color-comp-button-invert-danger-text-disabled: var(
322
+ --color-text-state-error-disabled
323
+ );
324
+ --color-comp-button-invert-danger-text-focused: var(
325
+ --color-text-state-error-focused
326
+ );
327
+ --color-comp-button-invert-danger-text-hover: var(
328
+ --color-text-state-error-hover
329
+ );
330
+ --color-comp-button-invert-danger-text-pressed: var(
331
+ --color-text-state-error-pressed
332
+ );
333
+ --color-comp-button-invert-ghost-bg-def: var(--color-transparent-transparent);
334
+ --color-comp-button-invert-ghost-bg-disabled: var(
335
+ --color-transparent-transparent
336
+ );
337
+ --color-comp-button-invert-ghost-bg-focused: var(
338
+ --color-surface-invert-ghost-focused
339
+ );
340
+ --color-comp-button-invert-ghost-bg-hover: var(
341
+ --color-surface-invert-ghost-hover
342
+ );
343
+ --color-comp-button-invert-ghost-bg-pressed: var(
344
+ --color-surface-invert-ghost-focused
345
+ );
346
+ --color-comp-button-invert-ghost-stroke-def: var(
347
+ --color-stroke-base-secondary
348
+ );
349
+ --color-comp-button-invert-ghost-stroke-disabled: var(
350
+ --color-stroke-base-disabled
351
+ );
352
+ --color-comp-button-invert-ghost-stroke-focused: var(
353
+ --color-stroke-base-primary-focused
354
+ );
355
+ --color-comp-button-invert-ghost-stroke-hover: var(
356
+ --color-stroke-base-primary-hover
357
+ );
358
+ --color-comp-button-invert-ghost-stroke-pressed: var(
359
+ --color-stroke-base-primary-pressed
360
+ );
361
+ --color-comp-button-invert-ghost-text-def: var(--color-text-invert-def);
362
+ --color-comp-button-invert-ghost-text-disabled: var(--color-gray-700);
363
+ --color-comp-button-invert-ghost-text-focused: var(
364
+ --color-text-invert-focused
365
+ );
366
+ --color-comp-button-invert-ghost-text-hover: var(--color-text-invert-hover);
367
+ --color-comp-button-invert-ghost-text-pressed: var(
368
+ --color-text-invert-pressed
369
+ );
370
+ --color-comp-button-invert-bg-def: var(--color-surface-base-tertiary);
371
+ --color-comp-button-invert-bg-disabled: var(
372
+ --color-surface-base-primary-disabled
373
+ );
374
+ --color-comp-button-invert-bg-focused: var(
375
+ --color-surface-base-primary-focused-pressed
376
+ );
377
+ --color-comp-button-invert-bg-hover: var(--color-surface-base-primary-hover);
378
+ --color-comp-button-invert-bg-pressed: var(
379
+ --color-surface-base-primary-focused-pressed
380
+ );
381
+ --color-comp-button-invert-stroke-def: var(--color-stroke-base-secondary);
382
+ --color-comp-button-invert-stroke-disabled: var(--color-stroke-base-disabled);
383
+ --color-comp-button-invert-stroke-focused: var(
384
+ --color-stroke-base-primary-focused
385
+ );
386
+ --color-comp-button-invert-stroke-hover: var(
387
+ --color-stroke-base-primary-hover
388
+ );
389
+ --color-comp-button-invert-stroke-pressed: var(
390
+ --color-stroke-base-primary-pressed
391
+ );
392
+ --color-comp-button-invert-swipe-btn-def: var(--color-black-dramatic-200);
393
+ --color-comp-button-invert-swipe-btn-disabled: var(
394
+ --color-black-dramatic-100
395
+ );
396
+ --color-comp-button-invert-swipe-btn-focused: var(--color-purple-200);
397
+ --color-comp-button-invert-swipe-btn-hover: var(--color-black-dramatic-200);
398
+ --color-comp-button-invert-swipe-progress-def: var(--color-gray-200);
399
+ --color-comp-button-invert-swipe-progress-disabled: var(
400
+ --color-black-dramatic-100
401
+ );
402
+ --color-comp-button-invert-swipe-progress-focused: var(
403
+ --color-black-dramatic-200
404
+ );
405
+ --color-comp-button-invert-swipe-progress-hover: var(
406
+ --color-black-dramatic-200
407
+ );
408
+ --color-comp-button-invert-text-def: var(--color-text-dark-primary-def);
409
+ --color-comp-button-invert-text-disabled: var(--color-text-dark-tertiary);
410
+ --color-comp-button-invert-text-focused: var(
411
+ --color-text-dark-primary-focused
412
+ );
413
+ --color-comp-button-invert-text-hover: var(--color-text-dark-primary-hover);
414
+ --color-comp-button-invert-text-pressed: var(
415
+ --color-text-dark-primary-pressed
416
+ );
417
+ --color-comp-button-link-danger-bg-def: var(--color-transparent-transparent);
418
+ --color-comp-button-link-danger-bg-disabled: var(
419
+ --color-transparent-transparent
420
+ );
421
+ --color-comp-button-link-danger-bg-focused: var(
422
+ --color-transparent-transparent
423
+ );
424
+ --color-comp-button-link-danger-bg-hover: var(
425
+ --color-transparent-transparent
426
+ );
427
+ --color-comp-button-link-danger-bg-pressed: var(
428
+ --color-transparent-transparent
429
+ );
430
+ --color-comp-button-link-danger-stroke-def: var(--color-stroke-dark-def);
431
+ --color-comp-button-link-danger-stroke-disabled: var(
432
+ --color-stroke-dark-disabled
433
+ );
434
+ --color-comp-button-link-danger-stroke-focused: var(
435
+ --color-stroke-dark-focused
436
+ );
437
+ --color-comp-button-link-danger-stroke-hover: var(--color-stroke-dark-hover);
438
+ --color-comp-button-link-danger-stroke-pressed: var(
439
+ --color-stroke-dark-pressed
440
+ );
441
+ --color-comp-button-link-danger-text-def: var(--color-text-state-error-def);
442
+ --color-comp-button-link-danger-text-disabled: var(
443
+ --color-text-state-error-disabled
444
+ );
445
+ --color-comp-button-link-danger-text-focused: var(
446
+ --color-text-state-error-focused
447
+ );
448
+ --color-comp-button-link-danger-text-hover: var(
449
+ --color-text-state-error-hover
450
+ );
451
+ --color-comp-button-link-danger-text-pressed: var(
452
+ --color-text-state-error-pressed
453
+ );
454
+ --color-comp-button-link-invert-bg-def: var(--color-transparent-transparent);
455
+ --color-comp-button-link-invert-bg-disabled: var(
456
+ --color-transparent-transparent
457
+ );
458
+ --color-comp-button-link-invert-bg-focused: var(
459
+ --color-transparent-transparent
460
+ );
461
+ --color-comp-button-link-invert-bg-hover: var(
462
+ --color-transparent-transparent
463
+ );
464
+ --color-comp-button-link-invert-bg-pressed: var(
465
+ --color-transparent-transparent
466
+ );
467
+ --color-comp-button-link-invert-stroke-def: var(--color-stroke-brand-def);
468
+ --color-comp-button-link-invert-stroke-disabled: var(--color-gray-400);
469
+ --color-comp-button-link-invert-stroke-focused: var(
470
+ --color-stroke-brand-focused
471
+ );
472
+ --color-comp-button-link-invert-stroke-hover: var(--color-stroke-brand-hover);
473
+ --color-comp-button-link-invert-stroke-pressed: var(
474
+ --color-stroke-brand-pressed
475
+ );
476
+ --color-comp-button-link-invert-text-def: var(--color-text-invert-def);
477
+ --color-comp-button-link-invert-text-disabled: var(--color-gray-700);
478
+ --color-comp-button-link-invert-text-focused: var(
479
+ --color-text-invert-focused
480
+ );
481
+ --color-comp-button-link-invert-text-hover: var(--color-text-invert-hover);
482
+ --color-comp-button-link-invert-text-pressed: var(
483
+ --color-text-invert-pressed
484
+ );
485
+ --color-comp-button-link-bg-def: var(--color-transparent-transparent);
486
+ --color-comp-button-link-bg-disabled: var(--color-transparent-transparent);
487
+ --color-comp-button-link-bg-focused: var(--color-transparent-transparent);
488
+ --color-comp-button-link-bg-hover: var(--color-transparent-transparent);
489
+ --color-comp-button-link-bg-pressed: var(--color-transparent-transparent);
490
+ --color-comp-button-link-stroke-def: var(--color-transparent-transparent);
491
+ --color-comp-button-link-stroke-disabled: var(
492
+ --color-transparent-transparent
493
+ );
494
+ --color-comp-button-link-stroke-focused: var(--color-transparent-transparent);
495
+ --color-comp-button-link-stroke-hover: var(--color-transparent-transparent);
496
+ --color-comp-button-link-stroke-pressed: var(--color-transparent-transparent);
497
+ --color-comp-button-link-text-def: var(--color-text-brand-def);
498
+ --color-comp-button-link-text-disabled: var(--color-text-dark-tertiary);
499
+ --color-comp-button-link-text-focused: var(--color-text-brand-focused);
500
+ --color-comp-button-link-text-hover: var(--color-text-brand-hover);
501
+ --color-comp-button-link-text-pressed: var(--color-text-brand-pressed);
502
+ --color-comp-button-primary-ghost-bg-def: var(
503
+ --color-transparent-transparent
504
+ );
505
+ --color-comp-button-primary-ghost-bg-disabled: var(
506
+ --color-transparent-transparent
507
+ );
508
+ --color-comp-button-primary-ghost-bg-focused: var(
509
+ --color-surface-brand-ghost-focused
510
+ );
511
+ --color-comp-button-primary-ghost-bg-hover: var(
512
+ --color-surface-brand-ghost-hover
513
+ );
514
+ --color-comp-button-primary-ghost-bg-pressed: var(
515
+ --color-surface-brand-ghost-focused
516
+ );
517
+ --color-comp-button-primary-ghost-stroke-def: var(--color-stroke-brand-def);
518
+ --color-comp-button-primary-ghost-stroke-disabled: var(--color-gray-400);
519
+ --color-comp-button-primary-ghost-stroke-focused: var(
520
+ --color-stroke-brand-focused
521
+ );
522
+ --color-comp-button-primary-ghost-stroke-hover: var(
523
+ --color-stroke-brand-hover
524
+ );
525
+ --color-comp-button-primary-ghost-stroke-pressed: var(
526
+ --color-stroke-brand-pressed
527
+ );
528
+ --color-comp-button-primary-ghost-text-def: var(--color-text-brand-def);
529
+ --color-comp-button-primary-ghost-text-disabled: var(
530
+ --color-text-dark-tertiary
531
+ );
532
+ --color-comp-button-primary-ghost-text-focused: var(
533
+ --color-text-brand-focused
534
+ );
535
+ --color-comp-button-primary-ghost-text-hover: var(--color-text-brand-hover);
536
+ --color-comp-button-primary-ghost-text-pressed: var(
537
+ --color-text-brand-pressed
538
+ );
539
+ --color-comp-button-primary-bg-def: var(--color-surface-brand-primary);
540
+ --color-comp-button-primary-bg-disabled: var(
541
+ --color-surface-brand-primary-disabled
542
+ );
543
+ --color-comp-button-primary-bg-focused: var(
544
+ --color-surface-brand-primary-focused-pressed
545
+ );
546
+ --color-comp-button-primary-bg-hover: var(
547
+ --color-surface-brand-primary-hover
548
+ );
549
+ --color-comp-button-primary-bg-pressed: var(
550
+ --color-surface-brand-primary-focused-pressed
551
+ );
552
+ --color-comp-button-primary-stroke-def: var(--color-stroke-brand-def);
553
+ --color-comp-button-primary-stroke-disabled: var(
554
+ --color-transparent-transparent
555
+ );
556
+ --color-comp-button-primary-stroke-focused: var(--color-stroke-brand-focused);
557
+ --color-comp-button-primary-stroke-hover: var(--color-stroke-brand-hover);
558
+ --color-comp-button-primary-stroke-pressed: var(--color-stroke-brand-pressed);
559
+ --color-comp-button-primary-swipe-btn-def: var(--color-purple-400);
560
+ --color-comp-button-primary-swipe-btn-disabled: var(--color-gray-300);
561
+ --color-comp-button-primary-swipe-btn-focused: var(--color-purple-400);
562
+ --color-comp-button-primary-swipe-btn-hover: var(--color-purple-400);
563
+ --color-comp-button-primary-swipe-progress-def: var(--color-purple-500);
564
+ --color-comp-button-primary-swipe-progress-disabled: var(--color-purple-400);
565
+ --color-comp-button-primary-swipe-progress-focused: var(--color-purple-400);
566
+ --color-comp-button-primary-swipe-progress-hover: var(--color-purple-400);
567
+ --color-comp-button-primary-text-def: var(--color-text-invert-def);
568
+ --color-comp-button-primary-text-disabled: var(--color-gray-700);
569
+ --color-comp-button-primary-text-focused: var(--color-text-invert-focused);
570
+ --color-comp-button-primary-text-hover: var(--color-text-invert-hover);
571
+ --color-comp-button-primary-text-pressed: var(--color-text-invert-pressed);
572
+ --color-comp-button-secondary-ghost-bg-def: var(
573
+ --color-transparent-transparent
574
+ );
575
+ --color-comp-button-secondary-ghost-bg-disabled: var(
576
+ --color-transparent-transparent
577
+ );
578
+ --color-comp-button-secondary-ghost-bg-focused: var(
579
+ --color-surface-dark-ghost-focused
580
+ );
581
+ --color-comp-button-secondary-ghost-bg-hover: var(
582
+ --color-surface-dark-ghost-hover
583
+ );
584
+ --color-comp-button-secondary-ghost-bg-pressed: var(
585
+ --color-surface-dark-ghost-focused
586
+ );
587
+ --color-comp-button-secondary-ghost-stroke-def: var(--color-stroke-dark-def);
588
+ --color-comp-button-secondary-ghost-stroke-disabled: var(
589
+ --color-stroke-dark-disabled
590
+ );
591
+ --color-comp-button-secondary-ghost-stroke-focused: var(
592
+ --color-stroke-dark-focused
593
+ );
594
+ --color-comp-button-secondary-ghost-stroke-hover: var(
595
+ --color-stroke-dark-hover
596
+ );
597
+ --color-comp-button-secondary-ghost-stroke-pressed: var(
598
+ --color-stroke-dark-pressed
599
+ );
600
+ --color-comp-button-secondary-ghost-text-def: var(
601
+ --color-text-dark-primary-def
602
+ );
603
+ --color-comp-button-secondary-ghost-text-disabled: var(
604
+ --color-text-dark-tertiary
605
+ );
606
+ --color-comp-button-secondary-ghost-text-focused: var(
607
+ --color-text-dark-primary-focused
608
+ );
609
+ --color-comp-button-secondary-ghost-text-hover: var(
610
+ --color-text-dark-primary-hover
611
+ );
612
+ --color-comp-button-secondary-ghost-text-pressed: var(
613
+ --color-text-dark-primary-pressed
614
+ );
615
+ --color-comp-button-secondary-bg-def: var(--color-surface-dark-def);
616
+ --color-comp-button-secondary-bg-disabled: var(
617
+ --color-surface-dark-secondary-disabled
618
+ );
619
+ --color-comp-button-secondary-bg-focused: var(
620
+ --color-surface-dark-focused-pressed
621
+ );
622
+ --color-comp-button-secondary-bg-hover: var(--color-surface-dark-hover);
623
+ --color-comp-button-secondary-bg-pressed: var(
624
+ --color-surface-dark-focused-pressed
625
+ );
626
+ --color-comp-button-secondary-stroke-def: var(--color-stroke-dark-def);
627
+ --color-comp-button-secondary-stroke-disabled: var(
628
+ --color-surface-dark-secondary-disabled
629
+ );
630
+ --color-comp-button-secondary-stroke-focused: var(
631
+ --color-stroke-dark-focused
632
+ );
633
+ --color-comp-button-secondary-stroke-hover: var(--color-stroke-dark-hover);
634
+ --color-comp-button-secondary-stroke-pressed: var(
635
+ --color-stroke-dark-pressed
636
+ );
637
+ --color-comp-button-secondary-swipe-btn-def: var(--color-black-dramatic-800);
638
+ --color-comp-button-secondary-swipe-btn-disabled: var(
639
+ --color-black-dramatic-200
640
+ );
641
+ --color-comp-button-secondary-swipe-btn-focused: var(
642
+ --color-black-dramatic-800
643
+ );
644
+ --color-comp-button-secondary-swipe-btn-hover: var(
645
+ --color-black-dramatic-800
646
+ );
647
+ --color-comp-button-secondary-swipe-progress-def: var(
648
+ --color-black-dramatic-900
649
+ );
650
+ --color-comp-button-secondary-swipe-progress-disabled: var(
651
+ --color-black-dramatic-900
652
+ );
653
+ --color-comp-button-secondary-swipe-progress-focused: var(
654
+ --color-black-dramatic-900
655
+ );
656
+ --color-comp-button-secondary-swipe-progress-hover: var(
657
+ --color-black-dramatic-900
658
+ );
659
+ --color-comp-button-secondary-text-def: var(--color-text-invert-def);
660
+ --color-comp-button-secondary-text-disabled: var(--color-gray-700);
661
+ --color-comp-button-secondary-text-focused: var(--color-text-invert-focused);
662
+ --color-comp-button-secondary-text-hover: var(--color-text-invert-hover);
663
+ --color-comp-button-secondary-text-pressed: var(--color-text-invert-pressed);
664
+ --color-comp-button-tertiary-ghost-bg-def: var(
665
+ --color-transparent-transparent
666
+ );
667
+ --color-comp-button-tertiary-ghost-bg-disabled: var(
668
+ --color-transparent-transparent
669
+ );
670
+ --color-comp-button-tertiary-ghost-bg-focused: var(
671
+ --color-transparent-transparent
672
+ );
673
+ --color-comp-button-tertiary-ghost-bg-hover: var(
674
+ --color-transparent-transparent
675
+ );
676
+ --color-comp-button-tertiary-ghost-bg-pressed: var(
677
+ --color-transparent-transparent
678
+ );
679
+ --color-comp-button-tertiary-ghost-stroke-def: var(
680
+ --color-stroke-base-primary
681
+ );
682
+ --color-comp-button-tertiary-ghost-stroke-disabled: var(
683
+ --color-stroke-base-disabled
684
+ );
685
+ --color-comp-button-tertiary-ghost-stroke-focused: var(
686
+ --color-stroke-brand-focused
687
+ );
688
+ --color-comp-button-tertiary-ghost-stroke-hover: var(
689
+ --color-stroke-brand-hover
690
+ );
691
+ --color-comp-button-tertiary-ghost-stroke-pressed: var(
692
+ --color-stroke-brand-pressed
693
+ );
694
+ --color-comp-button-tertiary-ghost-text-def: var(--color-text-brand-def);
695
+ --color-comp-button-tertiary-ghost-text-disabled: var(
696
+ --color-text-dark-tertiary
697
+ );
698
+ --color-comp-button-tertiary-ghost-text-focused: var(
699
+ --color-text-brand-focused
700
+ );
701
+ --color-comp-button-tertiary-ghost-text-hover: var(--color-text-brand-hover);
702
+ --color-comp-button-tertiary-ghost-text-pressed: var(
703
+ --color-text-brand-pressed
704
+ );
705
+ --color-comp-button-tertiary-bg-def: var(--color-surface-base-secondary);
706
+ --color-comp-button-tertiary-bg-disabled: var(
707
+ --color-surface-base-primary-disabled
708
+ );
709
+ --color-comp-button-tertiary-bg-focused: var(
710
+ --color-surface-base-primary-focused-pressed
711
+ );
712
+ --color-comp-button-tertiary-bg-hover: var(--color-surface-base-secondary);
713
+ --color-comp-button-tertiary-bg-pressed: var(
714
+ --color-surface-base-primary-focused-pressed
715
+ );
716
+ --color-comp-button-tertiary-stroke-def: var(--color-stroke-base-primary);
717
+ --color-comp-button-tertiary-stroke-disabled: var(
718
+ --color-stroke-base-disabled
719
+ );
720
+ --color-comp-button-tertiary-stroke-focused: var(
721
+ --color-stroke-brand-focused
722
+ );
723
+ --color-comp-button-tertiary-stroke-hover: var(--color-stroke-brand-hover);
724
+ --color-comp-button-tertiary-stroke-pressed: var(
725
+ --color-stroke-brand-pressed
726
+ );
727
+ --color-comp-button-tertiary-swipe-btn-def: var(--color-purple-100);
728
+ --color-comp-button-tertiary-swipe-btn-disabled: var(--color-purple-100);
729
+ --color-comp-button-tertiary-swipe-btn-focused: var(--color-purple-100);
730
+ --color-comp-button-tertiary-swipe-btn-hover: var(--color-purple-100);
731
+ --color-comp-button-tertiary-swipe-progress-def: var(--color-purple-200);
732
+ --color-comp-button-tertiary-swipe-progress-disabled: var(--color-purple-200);
733
+ --color-comp-button-tertiary-swipe-progress-focused: var(--color-purple-200);
734
+ --color-comp-button-tertiary-swipe-progress-hover: var(--color-purple-200);
735
+ --color-comp-button-tertiary-text-def: var(--color-text-brand-def);
736
+ --color-comp-button-tertiary-text-disabled: var(--color-text-dark-tertiary);
737
+ --color-comp-button-tertiary-text-focused: var(--color-text-brand-focused);
738
+ --color-comp-button-tertiary-text-hover: var(--color-text-brand-hover);
739
+ --color-comp-button-tertiary-text-pressed: var(--color-text-brand-pressed);
740
+ --color-comp-card-dashboard-dark-bg-def: var(--color-black-dramatic-900);
741
+ --color-comp-card-dashboard-dark-bg-disabled: var(--color-black-dramatic-300);
742
+ --color-comp-card-dashboard-dark-bg-focused: var(
743
+ --color-text-dark-primary-def
744
+ );
745
+ --color-comp-card-dashboard-dark-bg-hover: var(--color-text-dark-primary-def);
746
+ --color-comp-card-dashboard-light-bg-def: var(--color-surface-base-secondary);
747
+ --color-comp-card-dashboard-light-bg-disabled: var(
748
+ --color-surface-base-secondary
749
+ );
750
+ --color-comp-card-dashboard-light-bg-focused: var(
751
+ --color-surface-brand-primary-focused-pressed
752
+ );
753
+ --color-comp-card-dashboard-light-bg-hover: var(
754
+ --color-surface-brand-primary
755
+ );
756
+ --color-comp-card-dashboard-light-stroke-def: var(
757
+ --color-stroke-base-secondary
758
+ );
759
+ --color-comp-card-dashboard-light-stroke-disabled: var(
760
+ --color-stroke-base-secondary
761
+ );
762
+ --color-comp-card-dashboard-light-stroke-focused: var(
763
+ --color-stroke-brand-focused
764
+ );
765
+ --color-comp-card-dashboard-light-stroke-hover: var(--color-stroke-brand-def);
766
+ --color-comp-checkbox-bg-active: var(--color-surface-brand-primary);
767
+ --color-comp-checkbox-bg-def: var(--color-surface-base-transparent);
768
+ --color-comp-checkbox-bg-disabled: var(--color-surface-base-transparent);
769
+ --color-comp-checkbox-bg-error: var(--color-surface-base-transparent);
770
+ --color-comp-checkbox-bg-hover: var(--color-surface-brand-brand-tertiary);
771
+ --color-comp-checkbox-stroke-def: var(--color-stroke-base-tertiary);
772
+ --color-comp-checkbox-stroke-disabled: var(--color-stroke-base-disabled);
773
+ --color-comp-checkbox-stroke-error: var(--color-text-state-error-def);
774
+ --color-comp-checkbox-stroke-hover: var(--color-text-brand-hover);
775
+ --color-comp-dialog-bg-android: var(--color-surface-base-secondary);
776
+ --color-comp-dialog-text-def: var(--color-text-dark-primary-def);
777
+ --color-comp-dropdown-menu-fill-base-def: var(
778
+ --color-transparent-transparent
779
+ );
780
+ --color-comp-dropdown-menu-fill-base-disabled: var(
781
+ --color-transparent-transparent
782
+ );
783
+ --color-comp-dropdown-menu-fill-base-focused: var(
784
+ --color-surface-base-primary-focused-pressed
785
+ );
786
+ --color-comp-dropdown-menu-fill-base-hover: var(
787
+ --color-surface-brand-brand-tertiary
788
+ );
789
+ --color-comp-dropdown-menu-fill-error-def: var(
790
+ --color-transparent-transparent
791
+ );
792
+ --color-comp-dropdown-menu-fill-error-disabled: var(
793
+ --color-transparent-transparent
794
+ );
795
+ --color-comp-dropdown-menu-fill-error-focused: var(
796
+ --color-surface-error-ghost-focused
797
+ );
798
+ --color-comp-dropdown-menu-fill-error-hover: var(
799
+ --color-surface-error-ghost-hover
800
+ );
801
+ --color-comp-dropdown-menu-icon-base-active: var(--color-icon-brand-def);
802
+ --color-comp-dropdown-menu-icon-base-def: var(--color-text-dark-tertiary);
803
+ --color-comp-dropdown-menu-icon-base-disabled: var(
804
+ --color-icon-dark-tertiary
805
+ );
806
+ --color-comp-dropdown-menu-icon-base-focused: var(--color-icon-brand-focused);
807
+ --color-comp-dropdown-menu-icon-base-hover: var(--color-icon-brand-hover);
808
+ --color-comp-dropdown-menu-icon-error-def: var(--color-icon-error-def);
809
+ --color-comp-dropdown-menu-icon-error-disabled: var(
810
+ --color-icon-error-disabled
811
+ );
812
+ --color-comp-dropdown-menu-icon-error-focused: var(
813
+ --color-icon-error-focused
814
+ );
815
+ --color-comp-dropdown-menu-icon-error-hover: var(--color-icon-error-hover);
816
+ --color-comp-dropdown-menu-text-base-active: var(--color-text-brand-def);
817
+ --color-comp-dropdown-menu-text-base-def: var(--color-text-dark-primary-def);
818
+ --color-comp-dropdown-menu-text-base-disabled: var(
819
+ --color-text-dark-disabled
820
+ );
821
+ --color-comp-dropdown-menu-text-base-focused: var(--color-text-brand-focused);
822
+ --color-comp-dropdown-menu-text-base-hover: var(--color-text-brand-def);
823
+ --color-comp-dropdown-menu-text-error-def: var(--color-text-state-error-def);
824
+ --color-comp-dropdown-menu-text-error-disabled: var(
825
+ --color-text-state-error-disabled
826
+ );
827
+ --color-comp-dropdown-menu-text-error-focused: var(
828
+ --color-text-state-error-focused
829
+ );
830
+ --color-comp-dropdown-menu-text-error-hover: var(
831
+ --color-text-state-error-hover
832
+ );
833
+ --color-comp-file-upload-fill-def: var(--color-surface-base-tertiary);
834
+ --color-comp-file-upload-fill-disabled: var(
835
+ --color-surface-dark-secondary-disabled
836
+ );
837
+ --color-comp-file-upload-fill-focused: var(
838
+ --color-surface-base-primary-focused-pressed
839
+ );
840
+ --color-comp-file-upload-fill-ghost-hover: var(
841
+ --color-surface-base-primary-disabled
842
+ );
843
+ --color-comp-file-upload-fill-hover: var(--color-surface-base-primary-hover);
844
+ --color-comp-file-upload-icon-brand-def: var(--color-icon-brand-def);
845
+ --color-comp-file-upload-icon-brand-disabled: var(--color-icon-dark-tertiary);
846
+ --color-comp-file-upload-icon-brand-focused: var(--color-icon-brand-focused);
847
+ --color-comp-file-upload-icon-brand-hover: var(--color-icon-brand-hover);
848
+ --color-comp-file-upload-icon-def-disabled: var(--color-icon-dark-tertiary);
849
+ --color-comp-file-upload-icon-def-hover: var(--color-icon-dark-primary-hover);
850
+ --color-comp-file-upload-icon-def-primary: var(--color-icon-dark-primary-def);
851
+ --color-comp-file-upload-icon-def-secondary: var(
852
+ --color-icon-dark-secondary-def
853
+ );
854
+ --color-comp-file-upload-icon-error-def: var(--color-icon-error-def);
855
+ --color-comp-file-upload-icon-error-disabled: var(
856
+ --color-icon-error-disabled
857
+ );
858
+ --color-comp-file-upload-icon-error-focused-pressed: var(
859
+ --color-icon-error-focused
860
+ );
861
+ --color-comp-file-upload-icon-error-hover: var(--color-icon-error-hover);
862
+ --color-comp-file-upload-stroke-dashed-def: var(--color-stroke-dashed-def);
863
+ --color-comp-file-upload-stroke-dashed-disabled: var(
864
+ --color-stroke-base-disabled
865
+ );
866
+ --color-comp-file-upload-stroke-dashed-focused: var(
867
+ --color-stroke-dashed-focused
868
+ );
869
+ --color-comp-file-upload-stroke-dashed-hover: var(
870
+ --color-stroke-dashed-hover
871
+ );
872
+ --color-comp-file-upload-stroke-def-def: var(--color-stroke-base-primary);
873
+ --color-comp-file-upload-stroke-def-disabled: var(
874
+ --color-stroke-base-disabled
875
+ );
876
+ --color-comp-file-upload-stroke-def-focused: var(
877
+ --color-stroke-brand-focused
878
+ );
879
+ --color-comp-file-upload-stroke-def-hover: var(--color-stroke-brand-hover);
880
+ --color-comp-file-upload-stroke-error-def: var(--color-stroke-error-def);
881
+ --color-comp-file-upload-stroke-error-focused: var(
882
+ --color-stroke-error-focused
883
+ );
884
+ --color-comp-file-upload-stroke-error-hover: var(--color-stroke-error-hover);
885
+ --color-comp-file-upload-text-brand-def: var(--color-text-brand-def);
886
+ --color-comp-file-upload-text-brand-disabled: var(--color-text-dark-disabled);
887
+ --color-comp-file-upload-text-brand-focused: var(--color-text-brand-focused);
888
+ --color-comp-file-upload-text-brand-hover: var(--color-text-brand-hover);
889
+ --color-comp-file-upload-text-dark-disabled: var(--color-text-dark-tertiary);
890
+ --color-comp-file-upload-text-dark-focused: var(
891
+ --color-text-dark-primary-focused
892
+ );
893
+ --color-comp-file-upload-text-dark-hover: var(
894
+ --color-text-dark-primary-hover
895
+ );
896
+ --color-comp-file-upload-text-dark-primary: var(
897
+ --color-text-dark-primary-def
898
+ );
899
+ --color-comp-file-upload-text-dark-secondary: var(
900
+ --color-text-dark-secondary
901
+ );
902
+ --color-comp-file-upload-text-error-def: var(--color-text-state-error-def);
903
+ --color-comp-file-upload-text-error-disabled: var(
904
+ --color-text-state-error-disabled
905
+ );
906
+ --color-comp-file-upload-text-error-focused: var(
907
+ --color-text-state-error-focused
908
+ );
909
+ --color-comp-file-upload-text-error-hover: var(
910
+ --color-text-state-error-hover
911
+ );
912
+ --color-comp-header-icon-def: var(--color-icon-dark-primary-def);
913
+ --color-comp-header-icon-invert: var(--color-icon-invert-def);
914
+ --color-comp-header-text-def: var(--color-text-dark-primary-def);
915
+ --color-comp-header-text-invert: var(--color-text-invert-def);
916
+ --color-comp-info-ico-def: var(--color-icon-dark-secondary-def);
917
+ --color-comp-info-ico-disabled: var(--color-icon-dark-tertiary);
918
+ --color-comp-info-ico-focused: var(--color-icon-brand-focused);
919
+ --color-comp-info-ico-hover: var(--color-icon-brand-def);
920
+ --color-comp-input-fill-def: var(--color-surface-base-secondary);
921
+ --color-comp-input-fill-disabled: var(
922
+ --color-surface-dark-secondary-disabled
923
+ );
924
+ --color-comp-input-fill-focused: var(
925
+ --color-surface-base-primary-focused-pressed
926
+ );
927
+ --color-comp-input-fill-hover: var(--color-surface-base-primary-hover);
928
+ --color-comp-input-icon-brand-def: var(--color-icon-brand-def);
929
+ --color-comp-input-icon-brand-focused: var(--color-icon-brand-focused);
930
+ --color-comp-input-icon-brand-hover: var(--color-icon-brand-hover);
931
+ --color-comp-input-icon-error-def: var(--color-icon-error-def);
932
+ --color-comp-input-icon-error-focused: var(--color-icon-error-focused);
933
+ --color-comp-input-icon-error-hover: var(--color-icon-error-hover);
934
+ --color-comp-input-stroke-def: var(--color-stroke-base-primary);
935
+ --color-comp-input-stroke-disabled: var(--color-stroke-base-disabled);
936
+ --color-comp-input-stroke-error-def: var(--color-stroke-error-def);
937
+ --color-comp-input-stroke-error-focused: var(--color-stroke-error-focused);
938
+ --color-comp-input-stroke-error-hover: var(--color-stroke-error-hover);
939
+ --color-comp-input-stroke-focused: var(--color-stroke-brand-focused);
940
+ --color-comp-input-stroke-hover: var(--color-stroke-brand-hover);
941
+ --color-comp-input-text-disabled: var(--color-text-dark-disabled);
942
+ --color-comp-input-text-error: var(--color-text-state-error-def);
943
+ --color-comp-input-text-placeholder: var(--color-text-dark-tertiary);
944
+ --color-comp-input-text-primary: var(--color-text-dark-primary-def);
945
+ --color-comp-input-text-secondary: var(--color-text-dark-secondary);
946
+ --color-comp-market-category-books-primary: var(--color-other-blue);
947
+ --color-comp-market-category-books-secondary: var(--color-other-blue-light);
948
+ --color-comp-market-category-culture-primary: var(--color-other-pink);
949
+ --color-comp-market-category-culture-secondary: var(--color-other-pink-light);
950
+ --color-comp-market-category-edu-primary: var(--color-other-purple);
951
+ --color-comp-market-category-edu-secondary: var(--color-other-purple-light);
952
+ --color-comp-market-category-food-primary: var(--color-other-red);
953
+ --color-comp-market-category-food-secondary: var(--color-other-red-light);
954
+ --color-comp-market-category-health-primary: var(--color-other-green);
955
+ --color-comp-market-category-health-secondary: var(--color-other-green-light);
956
+ --color-comp-market-category-recreation-primary: var(--color-other-yellow);
957
+ --color-comp-market-category-recreation-secondary: var(
958
+ --color-other-yellow-light
959
+ );
960
+ --color-comp-market-category-sport-primary: var(--color-other-orange);
961
+ --color-comp-market-category-sport-secondary: var(--color-other-orange-light);
962
+ --color-comp-pagination-bg-def: var(--color-surface-base-transparent);
963
+ --color-comp-pagination-bg-disabled: var(--color-surface-base-transparent);
964
+ --color-comp-pagination-bg-error: var(--color-surface-base-transparent);
965
+ --color-comp-pagination-bg-focused: var(--color-surface-brand-ghost-focused);
966
+ --color-comp-pagination-bg-hover: var(--color-surface-brand-ghost-hover);
967
+ --color-comp-pagination-text-def: var(--color-text-dark-secondary);
968
+ --color-comp-pagination-text-disabled: var(--color-text-dark-disabled);
969
+ --color-comp-pagination-text-error: var(--color-text-state-error-def);
970
+ --color-comp-pagination-text-focused: var(--color-text-brand-def);
971
+ --color-comp-pagination-text-hover: var(--color-text-dark-secondary);
972
+ --color-comp-pin-bg-active: var(--color-surface-brand-primary);
973
+ --color-comp-pin-bg-empty: var(--color-surface-base-transparent);
974
+ --color-comp-pin-border-def: var(--color-stroke-dark-def);
975
+ --color-comp-pin-border-none: #1c1a1f00;
976
+ --color-comp-quantity-selector-bg-def: var(--color-surface-base-tertiary);
977
+ --color-comp-quantity-selector-bg-disabled: var(--color-gray-50);
978
+ --color-comp-quantity-selector-bg-focused: var(
979
+ --color-surface-brand-brand-tertiary
980
+ );
981
+ --color-comp-quantity-selector-bg-hover: var(
982
+ --color-surface-brand-brand-tertiary
983
+ );
984
+ --color-comp-quantity-selector-bg-selected: var(
985
+ --color-surface-brand-brand-tertiary
986
+ );
987
+ --color-comp-select-fill-def: var(--color-surface-base-secondary);
988
+ --color-comp-select-fill-disabled: var(
989
+ --color-surface-dark-secondary-disabled
990
+ );
991
+ --color-comp-select-fill-focused: var(
992
+ --color-surface-base-primary-focused-pressed
993
+ );
994
+ --color-comp-select-fill-hover: var(--color-surface-base-primary-hover);
995
+ --color-comp-select-icon-brand-def: var(--color-icon-brand-def);
996
+ --color-comp-select-icon-brand-focused: var(--color-icon-brand-focused);
997
+ --color-comp-select-icon-brand-hover: var(--color-icon-brand-hover);
998
+ --color-comp-select-icon-disabled: var(--color-icon-dark-tertiary);
999
+ --color-comp-select-icon-error-def: var(--color-icon-error-def);
1000
+ --color-comp-select-icon-error-focused: var(--color-icon-error-focused);
1001
+ --color-comp-select-icon-error-hover: var(--color-icon-error-hover);
1002
+ --color-comp-select-stroke-def: var(--color-stroke-base-primary);
1003
+ --color-comp-select-stroke-disabled: var(--color-stroke-base-disabled);
1004
+ --color-comp-select-stroke-error-def: var(--color-stroke-error-def);
1005
+ --color-comp-select-stroke-error-focused: var(--color-stroke-error-focused);
1006
+ --color-comp-select-stroke-error-hover: var(--color-stroke-error-hover);
1007
+ --color-comp-select-stroke-focused: var(--color-stroke-brand-focused);
1008
+ --color-comp-select-stroke-hover: var(--color-stroke-brand-hover);
1009
+ --color-comp-select-text-brand: var(--color-text-brand-def);
1010
+ --color-comp-select-text-disabled: var(--color-text-dark-disabled);
1011
+ --color-comp-select-text-error: var(--color-text-state-error-def);
1012
+ --color-comp-select-text-placeholder: var(--color-text-dark-tertiary);
1013
+ --color-comp-select-text-primary: var(--color-text-dark-primary-def);
1014
+ --color-comp-select-text-secondary: var(--color-text-dark-secondary);
1015
+ --color-comp-sidebar-menu-item-def: var(--color-surface-base-transparent);
1016
+ --color-comp-sidebar-menu-item-disabled: var(
1017
+ --color-surface-base-transparent
1018
+ );
1019
+ --color-comp-sidebar-menu-item-focused: var(
1020
+ --color-surface-invert-transparent-focused
1021
+ );
1022
+ --color-comp-sidebar-menu-item-hover: var(
1023
+ --color-surface-invert-transparent-hover
1024
+ );
1025
+ --color-comp-slider-indicators-bg-active: var(--color-surface-brand-primary);
1026
+ --color-comp-slider-indicators-bg-def: var(--color-surface-brand-secondary);
1027
+ --color-comp-submenu-admin-bg-def: var(--color-surface-state-bg-info);
1028
+ --color-comp-submenu-admin-bg-disabled: var(
1029
+ --color-surface-brand-primary-disabled
1030
+ );
1031
+ --color-comp-submenu-admin-bg-focused: var(--color-surface-brand-primary);
1032
+ --color-comp-submenu-admin-bg-hover: var(--color-text-brand-hover);
1033
+ --color-comp-submenu-admin-ico-def: var(--color-icon-brand-def);
1034
+ --color-comp-submenu-admin-ico-disabled: var(--color-icon-dark-tertiary);
1035
+ --color-comp-submenu-admin-ico-focused: var(--color-icon-invert-def);
1036
+ --color-comp-submenu-admin-ico-hover: var(--color-icon-invert-def);
1037
+ --color-comp-submenu-admin-text-def: var(--color-text-dark-secondary);
1038
+ --color-comp-submenu-admin-text-disabled: var(--color-text-dark-disabled);
1039
+ --color-comp-submenu-admin-text-focused: var(--color-text-brand-def);
1040
+ --color-comp-submenu-admin-text-hover: var(--color-text-brand-hover);
1041
+ --color-comp-switch-bg-active-def: var(--color-surface-brand-primary);
1042
+ --color-comp-switch-bg-active-disabled: var(--color-surface-brand-secondary);
1043
+ --color-comp-switch-bg-inactive-def: var(
1044
+ --color-surface-brand-brand-tertiary
1045
+ );
1046
+ --color-comp-switch-bg-inactive-disabled: var(
1047
+ --color-surface-dark-secondary-disabled
1048
+ );
1049
+ --color-comp-switch-bg-item: var(--color-neutral-white);
1050
+ --color-comp-tab-bar-bg-brand: var(--color-surface-brand-primary);
1051
+ --color-comp-tab-bar-bg-def: var(--color-surface-base-secondary);
1052
+ --color-comp-tab-bar-border-def: var(--color-stroke-base-secondary);
1053
+ --color-comp-tab-bar-icon-active: var(--color-icon-brand-def);
1054
+ --color-comp-tab-bar-icon-def: var(--color-icon-dark-secondary-def);
1055
+ --color-comp-tab-bar-icon-invert: var(--color-icon-invert-def);
1056
+ --color-comp-tab-bar-text-active: var(--color-text-brand-def);
1057
+ --color-comp-tab-bar-text-def: var(--color-text-dark-secondary);
1058
+ --color-comp-texteditor-bg-def: var(--color-surface-base-transparent);
1059
+ --color-comp-texteditor-bg-disabled: var(--color-surface-base-transparent);
1060
+ --color-comp-texteditor-bg-focused: var(--color-surface-brand-brand-tertiary);
1061
+ --color-comp-texteditor-bg-hover: var(--color-surface-base-primary-hover);
1062
+ --color-comp-texteditor-ico-def: var(--color-icon-brand-def);
1063
+ --color-comp-texteditor-ico-disabled: var(--color-icon-dark-tertiary);
1064
+ --color-comp-texteditor-ico-focused: var(--color-icon-brand-def);
1065
+ --color-comp-texteditor-ico-hover: var(--color-icon-brand-hover);
1066
+ --color-comp-texteditor-stroke-def: var(
1067
+ --color-comp-accordeon-settings-stroke-def
1068
+ );
1069
+ --color-comp-texteditor-stroke-disabled: var(
1070
+ --color-comp-accordeon-settings-stroke-disabled
1071
+ );
1072
+ --color-comp-texteditor-stroke-error: var(--color-stroke-error-def);
1073
+ --color-comp-texteditor-stroke-focused: var(--color-stroke-brand-focused);
1074
+ --color-comp-texteditor-stroke-hover: var(--color-stroke-brand-hover);
1075
+ --color-comp-time-picker-active: var(--color-surface-brand-primary);
1076
+ --color-comp-time-picker-def: var(--color-gray-400);
1077
+ --color-comp-time-picker-disabled: var(--color-red-100);
1078
+ --color-comp-time-picker-focused: var(
1079
+ --color-surface-brand-primary-focused-pressed
1080
+ );
1081
+ --color-comp-time-picker-hover: var(--color-surface-brand-primary-hover);
1082
+ --color-icon-brand-def: var(--brand-primary);
1083
+ --color-icon-brand-focused: var(--brand-focused);
1084
+ --color-icon-brand-hover: var(--brand-hover);
1085
+ --color-icon-brand-pressed: var(--brand-focused);
1086
+ --color-icon-dark-primary-def: var(--color-black-dramatic-950);
1087
+ --color-icon-dark-primary-focused: var(--gray-1000);
1088
+ --color-icon-dark-primary-hover: var(--gray-900);
1089
+ --color-icon-dark-primary-pressed: var(--gray-1000);
1090
+ --color-icon-dark-secondary-def: var(--gray-700);
1091
+ --color-icon-dark-secondary-focused: var(--gray-900);
1092
+ --color-icon-dark-secondary-hover: var(--gray-800);
1093
+ --color-icon-dark-secondary-pressed: var(--gray-900);
1094
+ --color-icon-dark-tertiary: var(--gray-500);
1095
+ --color-icon-error-def: var(--color-red-500);
1096
+ --color-icon-error-disabled: var(--color-transparent-red-35);
1097
+ --color-icon-error-focused: var(--color-red-700);
1098
+ --color-icon-error-hover: var(--color-red-600);
1099
+ --color-icon-error-pressed: var(--color-red-700);
1100
+ --color-icon-invert-def: var(--color-neutral-white);
1101
+ --color-icon-invert-focused: var(--gray-400);
1102
+ --color-icon-invert-hover: var(--gray-300);
1103
+ --color-icon-invert-invert-disabled: var(--gray-700);
1104
+ --color-icon-invert-pressed: var(--gray-400);
1105
+ --color-stroke-base-disabled: var(--color-transparent-light-40);
1106
+ --color-stroke-base-primary: var(--gray-300);
1107
+ --color-stroke-base-primary-focused: var(--gray-500);
1108
+ --color-stroke-base-primary-hover: var(--gray-300);
1109
+ --color-stroke-base-primary-pressed: var(--gray-500);
1110
+ --color-stroke-base-secondary: var(--gray-200);
1111
+ --color-stroke-base-success: var(--color-green-500);
1112
+ --color-stroke-base-tertiary: var(--gray-600);
1113
+ --color-stroke-base-warning: var(--color-orange-500);
1114
+ --color-stroke-brand-def: var(--brand-primary);
1115
+ --color-stroke-brand-disabled: var(--brand-15);
1116
+ --color-stroke-brand-focused: var(--brand-focused);
1117
+ --color-stroke-brand-hover: var(--brand-hover);
1118
+ --color-stroke-brand-pressed: var(--brand-focused);
1119
+ --color-stroke-dark-def: var(--color-black-dramatic-950);
1120
+ --color-stroke-dark-disabled: var(--gray-500);
1121
+ --color-stroke-dark-focused: var(--color-black-dramatic-900);
1122
+ --color-stroke-dark-hover: var(--color-black-dramatic-900);
1123
+ --color-stroke-dark-pressed: var(--color-black-dramatic-900);
1124
+ --color-stroke-dashed-def: var(--gray-500);
1125
+ --color-stroke-dashed-disabled: var(--gray-400);
1126
+ --color-stroke-dashed-focused: var(--gray-600);
1127
+ --color-stroke-dashed-hover: var(--gray-600);
1128
+ --color-stroke-dashed-pressed: var(--gray-600);
1129
+ --color-stroke-error-def: var(--color-red-500);
1130
+ --color-stroke-error-disabled: var(--color-transparent-red-35);
1131
+ --color-stroke-error-focused: var(--color-red-700);
1132
+ --color-stroke-error-hover: var(--color-red-600);
1133
+ --color-stroke-error-pressed: var(--color-red-700);
1134
+ --color-stroke-focus-outline-def: var(--brand-primary);
1135
+ --color-stroke-invert-primary: var(--brand-white);
1136
+ --color-stroke-invert-secondary: var(--color-transparent-light-25);
1137
+ --color-surface-base-overlay: var(--color-transparent-dark-70);
1138
+ --color-surface-base-primary: var(--gray-50);
1139
+ --color-surface-base-primary-disabled: var(--color-transparent-light-15);
1140
+ --color-surface-base-primary-focused-pressed: var(--gray-400);
1141
+ --color-surface-base-primary-hover: var(--gray-300);
1142
+ --color-surface-base-secondary: var(--color-neutral-white);
1143
+ --color-surface-base-tertiary: var(--brand-white);
1144
+ --color-surface-base-transparent: var(--color-transparent-transparent);
1145
+ --color-surface-brand-brand-tertiary: var(--brand-tertiary);
1146
+ --color-surface-brand-primary: var(--brand-primary);
1147
+ --color-surface-brand-primary-disabled: var(--brand-8);
1148
+ --color-surface-brand-primary-focused-pressed: var(--brand-focused);
1149
+ --color-surface-brand-primary-hover: var(--brand-hover);
1150
+ --color-surface-brand-secondary: var(--brand-disabled);
1151
+ --color-surface-brand-ghost-focused: var(--brand-12);
1152
+ --color-surface-brand-ghost-hover: var(--brand-8);
1153
+ --color-surface-dark-def: var(--color-black-dramatic-950);
1154
+ --color-surface-dark-focused-pressed: var(--color-black-dramatic-900);
1155
+ --color-surface-dark-hover: var(--color-black-dramatic-900);
1156
+ --color-surface-dark-secondary-disabled: var(--color-transparent-dark-10);
1157
+ --color-surface-dark-ghost-focused: var(--color-transparent-dark-10);
1158
+ --color-surface-dark-ghost-hover: var(--color-transparent-dark-8);
1159
+ --color-surface-error-def: var(--color-red-500);
1160
+ --color-surface-error-disabled: var(--color-transparent-red-10);
1161
+ --color-surface-error-focused: var(--color-red-700);
1162
+ --color-surface-error-hover: var(--color-red-600);
1163
+ --color-surface-error-pressed: var(--color-red-700);
1164
+ --color-surface-error-ghost-focused: var(--color-transparent-red-10);
1165
+ --color-surface-error-ghost-hover: var(--color-transparent-red-8);
1166
+ --color-surface-icon-bg-dark: var(--color-transparent-dark-10);
1167
+ --color-surface-icon-bg-error: var(--color-transparent-red-20);
1168
+ --color-surface-icon-bg-light: var(--color-transparent-white-15);
1169
+ --color-surface-invert-ghost-focused: var(--color-transparent-light-25);
1170
+ --color-surface-invert-ghost-hover: var(--color-transparent-light-15);
1171
+ --color-surface-invert-transparent-focused: var(--color-transparent-light-15);
1172
+ --color-surface-invert-transparent-hover: var(--color-transparent-light-25);
1173
+ --color-surface-state-bg-error: var(--color-transparent-red-15);
1174
+ --color-surface-state-bg-info: var(--brand-12);
1175
+ --color-surface-state-bg-success: var(--color-transparent-green-15);
1176
+ --color-surface-state-bg-warning: var(--color-transparent-orange-15);
1177
+ --color-text-brand-def: var(--brand-primary);
1178
+ --color-text-brand-focused: var(--brand-focused);
1179
+ --color-text-brand-hover: var(--brand-hover);
1180
+ --color-text-brand-pressed: var(--brand-focused);
1181
+ --color-text-dark-disabled: var(--gray-500);
1182
+ --color-text-dark-primary-def: var(--color-black-dramatic-950);
1183
+ --color-text-dark-primary-focused: var(--gray-1000);
1184
+ --color-text-dark-primary-hover: var(--gray-900);
1185
+ --color-text-dark-primary-pressed: var(--gray-1000);
1186
+ --color-text-dark-secondary: var(--gray-900);
1187
+ --color-text-dark-tertiary: var(--gray-700);
1188
+ --color-text-invert-def: var(--color-neutral-white);
1189
+ --color-text-invert-focused: var(--gray-400);
1190
+ --color-text-invert-hover: var(--gray-300);
1191
+ --color-text-invert-pressed: var(--gray-400);
1192
+ --color-text-state-error-def: var(--color-red-500);
1193
+ --color-text-state-error-disabled: var(--color-transparent-red-35);
1194
+ --color-text-state-error-focused: var(--color-red-700);
1195
+ --color-text-state-error-hover: var(--color-red-600);
1196
+ --color-text-state-error-pressed: var(--color-red-700);
1197
+ --color-text-state-success: var(--color-green-500);
1198
+ --color-text-state-warning: var(--color-orange-800);
1199
+ }