@tedi-design-system/core 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/README.md +14 -0
  2. package/_base.scss +93 -0
  3. package/_fonts.scss +253 -0
  4. package/_helpers.scss +43 -0
  5. package/_icons.scss +51 -0
  6. package/_mixins.scss +108 -0
  7. package/_print.scss +35 -0
  8. package/_typography.scss +220 -0
  9. package/bootstrap-utility/_breakpoints.scss +136 -0
  10. package/bootstrap-utility/_grid.scss +167 -0
  11. package/bootstrap-utility/_mixin-utilities.scss +95 -0
  12. package/bootstrap-utility/_utilities-api.scss +23 -0
  13. package/bootstrap-utility/_utilities.scss +104 -0
  14. package/fonts/README.md +34 -0
  15. package/fonts/material-symbols-outlined.woff2 +0 -0
  16. package/fonts/material-symbols-rounded.woff2 +0 -0
  17. package/fonts/material-symbols-sharp.woff2 +0 -0
  18. package/fonts/roboto-v30-cyrillic-300-italic.woff2 +0 -0
  19. package/fonts/roboto-v30-cyrillic-300.woff2 +0 -0
  20. package/fonts/roboto-v30-cyrillic-400-italic.woff2 +0 -0
  21. package/fonts/roboto-v30-cyrillic-400.woff2 +0 -0
  22. package/fonts/roboto-v30-cyrillic-700-italic.woff2 +0 -0
  23. package/fonts/roboto-v30-cyrillic-700.woff2 +0 -0
  24. package/fonts/roboto-v30-cyrillic-ext-300-italic.woff2 +0 -0
  25. package/fonts/roboto-v30-cyrillic-ext-300.woff2 +0 -0
  26. package/fonts/roboto-v30-cyrillic-ext-400-italic.woff2 +0 -0
  27. package/fonts/roboto-v30-cyrillic-ext-400.woff2 +0 -0
  28. package/fonts/roboto-v30-cyrillic-ext-700-italic.woff2 +0 -0
  29. package/fonts/roboto-v30-cyrillic-ext-700.woff2 +0 -0
  30. package/fonts/roboto-v30-latin-300-italic.woff2 +0 -0
  31. package/fonts/roboto-v30-latin-300.woff2 +0 -0
  32. package/fonts/roboto-v30-latin-400-italic.woff2 +0 -0
  33. package/fonts/roboto-v30-latin-400.woff2 +0 -0
  34. package/fonts/roboto-v30-latin-700-italic.woff2 +0 -0
  35. package/fonts/roboto-v30-latin-700.woff2 +0 -0
  36. package/fonts/roboto-v30-latin-ext-300-italic.woff2 +0 -0
  37. package/fonts/roboto-v30-latin-ext-300.woff2 +0 -0
  38. package/fonts/roboto-v30-latin-ext-400-italic.woff2 +0 -0
  39. package/fonts/roboto-v30-latin-ext-400.woff2 +0 -0
  40. package/fonts/roboto-v30-latin-ext-700-italic.woff2 +0 -0
  41. package/fonts/roboto-v30-latin-ext-700.woff2 +0 -0
  42. package/index.css +1 -0
  43. package/index.scss +17 -0
  44. package/package.json +63 -0
  45. package/tedi-storybook-styles.scss +172 -0
  46. package/variables/_base-variables.scss +168 -0
  47. package/variables/_bootstrap-variables.scss +30 -0
  48. package/variables/_color-variables.scss +1113 -0
  49. package/variables/_dimensional-variables.scss +1236 -0
  50. package/variables/_font-variables.scss +77 -0
  51. package/variables/_utility-variables.scss +11 -0
@@ -0,0 +1,1236 @@
1
+ :root {
2
+ --icon-05-desktop: var(--dimensions-13);
3
+ --icon-05-tablet: var(--dimensions-13);
4
+ --icon-05-mobile: var(--dimensions-13);
5
+ --icon-06-desktop: var(--dimensions-15);
6
+ --icon-06-tablet: var(--dimensions-15);
7
+ --icon-06-mobile: var(--dimensions-15);
8
+ --icon-07-desktop: var(--dimensions-18);
9
+ --icon-07-tablet: var(--dimensions-18);
10
+ --icon-07-mobile: var(--dimensions-18);
11
+ --button-radius-default-desktop: var(--radius-08);
12
+ --button-radius-default-tablet: var(--radius-08);
13
+ --button-radius-default-mobile: var(--radius-08);
14
+ --button-md-padding-x-desktop: var(--dimensions-11);
15
+ --button-md-padding-x-tablet: var(--dimensions-11);
16
+ --button-md-padding-x-mobile: var(--dimensions-11);
17
+ --button-md-padding-y-desktop: var(--dimensions-05);
18
+ --button-md-padding-y-tablet: var(--dimensions-05);
19
+ --button-md-padding-y-mobile: var(--dimensions-06);
20
+ --button-md-icon-padding-desktop: var(--dimensions-03);
21
+ --button-md-icon-padding-tablet: var(--dimensions-03);
22
+ --button-md-icon-padding-mobile: var(--dimensions-03);
23
+ --button-sm-padding-x-desktop: var(--dimensions-09);
24
+ --button-sm-padding-x-tablet: var(--dimensions-09);
25
+ --button-sm-padding-x-mobile: var(--dimensions-11);
26
+ --button-sm-padding-y-desktop: var(--dimensions-03);
27
+ --button-sm-padding-y-tablet: var(--dimensions-03);
28
+ --button-sm-padding-y-mobile: var(--dimensions-06);
29
+ --button-sm-icon-padding-desktop: var(--dimensions-00);
30
+ --button-sm-icon-padding-tablet: var(--dimensions-00);
31
+ --button-sm-icon-padding-mobile: var(--dimensions-00);
32
+ --button-md-inner-spacing-desktop: var(--dimensions-04);
33
+ --button-md-inner-spacing-tablet: var(--dimensions-04);
34
+ --button-md-inner-spacing-mobile: var(--dimensions-04);
35
+ --button-sm-inner-spacing-desktop: var(--dimensions-03);
36
+ --button-sm-inner-spacing-tablet: var(--dimensions-03);
37
+ --button-sm-inner-spacing-mobile: var(--dimensions-04);
38
+ --button-md-icon-size-desktop: var(--dimensions-16);
39
+ --button-md-icon-size-tablet: var(--dimensions-16);
40
+ --button-md-icon-size-mobile: var(--dimensions-17);
41
+ --button-sm-icon-size-desktop: var(--dimensions-14);
42
+ --button-sm-icon-size-tablet: var(--dimensions-14);
43
+ --button-sm-icon-size-mobile: var(--dimensions-17);
44
+ --button-md-neutral-padding-x-desktop: var(--dimensions-00);
45
+ --button-md-neutral-padding-x-tablet: var(--dimensions-00);
46
+ --button-md-neutral-padding-x-mobile: var(--dimensions-00);
47
+ --button-md-neutral-padding-y-desktop: var(--dimensions-05);
48
+ --button-md-neutral-padding-y-tablet: var(--dimensions-05);
49
+ --button-md-neutral-padding-y-mobile: var(--dimensions-06);
50
+ --button-sm-neutral-padding-x-desktop: var(--dimensions-00);
51
+ --button-sm-neutral-padding-x-tablet: var(--dimensions-00);
52
+ --button-sm-neutral-padding-x-mobile: var(--dimensions-00);
53
+ --button-sm-neutral-padding-y-desktop: var(--dimensions-03);
54
+ --button-sm-neutral-padding-y-tablet: var(--dimensions-03);
55
+ --button-sm-neutral-padding-y-mobile: var(--dimensions-06);
56
+ --button-gutter-x-desktop: var(--dimensions-10);
57
+ --button-gutter-x-tablet: var(--dimensions-10);
58
+ --button-gutter-x-mobile: var(--dimensions-10);
59
+ --button-gutter-y-desktop: var(--dimensions-10);
60
+ --button-gutter-y-tablet: var(--dimensions-10);
61
+ --button-gutter-y-mobile: var(--dimensions-10);
62
+ --list-icon-padding-y-desktop: var(--dimensions-05);
63
+ --list-icon-padding-y-tablet: var(--dimensions-05);
64
+ --list-icon-padding-y-mobile: var(--dimensions-05);
65
+ --list-icon-size-desktop: var(--icon-00-desktop);
66
+ --list-icon-size-tablet: var(--icon-00-tablet);
67
+ --list-icon-size-mobile: var(--icon-00-mobile);
68
+ --icon-02-desktop: var(--dimensions-10);
69
+ --icon-02-tablet: var(--dimensions-10);
70
+ --icon-02-mobile: var(--dimensions-10);
71
+ --list-inner-spacing-x-desktop: var(--dimensions-05);
72
+ --list-inner-spacing-x-tablet: var(--dimensions-05);
73
+ --list-inner-spacing-x-mobile: var(--dimensions-05);
74
+ --list-padding-left-level-2-desktop: var(--dimensions-14);
75
+ --list-padding-left-level-2-tablet: var(--dimensions-14);
76
+ --list-padding-left-level-2-mobile: var(--dimensions-13);
77
+ --list-padding-left-level-3-desktop: var(--dimensions-18);
78
+ --list-padding-left-level-3-tablet: var(--dimensions-18);
79
+ --list-padding-left-level-3-mobile: var(--dimensions-16);
80
+ --link-inner-spacing-x-desktop: var(--dimensions-03);
81
+ --link-inner-spacing-x-tablet: var(--dimensions-03);
82
+ --link-inner-spacing-x-mobile: var(--dimensions-03);
83
+ --card-padding-md-default-desktop: var(--dimensions-10);
84
+ --card-padding-md-default-tablet: var(--dimensions-10);
85
+ --card-padding-md-default-mobile: var(--dimensions-10);
86
+ --card-padding-lg-desktop: var(--dimensions-13);
87
+ --card-padding-lg-tablet: var(--dimensions-10);
88
+ --card-padding-lg-mobile: var(--dimensions-05);
89
+ --card-radius-rounded-desktop: var(--radius-02-default);
90
+ --card-radius-rounded-tablet: var(--radius-02-default);
91
+ --card-radius-rounded-mobile: var(--radius-02-default);
92
+ --separator-spacing-y-02-desktop: var(--dimensions-05);
93
+ --separator-spacing-y-02-tablet: var(--dimensions-05);
94
+ --separator-spacing-y-02-mobile: var(--dimensions-05);
95
+ --separator-spacing-y-03-desktop: var(--dimensions-10);
96
+ --separator-spacing-y-03-tablet: var(--dimensions-10);
97
+ --separator-spacing-y-03-mobile: var(--dimensions-10);
98
+ --separator-spacing-y-04-desktop: var(--dimensions-13);
99
+ --separator-spacing-y-04-tablet: var(--dimensions-13);
100
+ --separator-spacing-y-04-mobile: var(--dimensions-13);
101
+ --content-heading-inner-spacing-x-desktop: var(--dimensions-05);
102
+ --content-heading-inner-spacing-x-tablet: var(--dimensions-05);
103
+ --content-heading-inner-spacing-x-mobile: var(--dimensions-05);
104
+ --content-label-inner-spacing-x-desktop: var(--dimensions-02);
105
+ --content-label-inner-spacing-x-tablet: var(--dimensions-02);
106
+ --content-label-inner-spacing-x-mobile: var(--dimensions-02);
107
+ --separator-spacing-x-01-desktop: var(--dimensions-04);
108
+ --separator-spacing-x-01-tablet: var(--dimensions-04);
109
+ --separator-spacing-x-01-mobile: var(--dimensions-04);
110
+ --separator-spacing-y-01-desktop: var(--dimensions-03);
111
+ --separator-spacing-y-01-tablet: var(--dimensions-03);
112
+ --separator-spacing-y-01-mobile: var(--dimensions-03);
113
+ --button-width-max-desktop: var(--dimensions-25);
114
+ --button-width-max-tablet: var(--dimensions-25);
115
+ --button-width-max-mobile: var(--dimensions-25);
116
+ --separator-dotted-dot-lg-desktop: 15px;
117
+ --separator-dotted-dot-lg-rem-desktop: 0.9375rem;
118
+ --separator-dotted-dot-lg-tablet: 15px;
119
+ --separator-dotted-dot-lg-rem-tablet: 0.9375rem;
120
+ --separator-dotted-dot-lg-mobile: 15px;
121
+ --separator-dotted-dot-lg-rem-mobile: 0.9375rem;
122
+ --separator-dotted-line-width-desktop: var(--dimensions-01);
123
+ --separator-dotted-line-width-tablet: var(--dimensions-01);
124
+ --separator-dotted-line-width-mobile: var(--dimensions-01);
125
+ --separator-dotted-dot-md-desktop: 9px;
126
+ --separator-dotted-dot-md-rem-desktop: 0.5625rem;
127
+ --separator-dotted-dot-md-tablet: 9px;
128
+ --separator-dotted-dot-md-rem-tablet: 0.5625rem;
129
+ --separator-dotted-dot-md-mobile: 9px;
130
+ --separator-dotted-dot-md-rem-mobile: 0.5625rem;
131
+ --card-radius-sharp-desktop: var(--radius-00);
132
+ --card-radius-sharp-tablet: var(--radius-00);
133
+ --card-radius-sharp-mobile: var(--radius-00);
134
+ --icon-background-padding-lg-desktop: var(--dimensions-07);
135
+ --icon-background-padding-lg-tablet: var(--dimensions-07);
136
+ --icon-background-padding-lg-mobile: var(--dimensions-07);
137
+ --icon-background-radius-desktop: var(--radius-08);
138
+ --icon-background-radius-tablet: var(--radius-08);
139
+ --icon-background-radius-mobile: var(--radius-08);
140
+ --loader-spinner-sizing-sm-desktop: var(--dimensions-06);
141
+ --loader-spinner-sizing-sm-tablet: var(--dimensions-06);
142
+ --loader-spinner-sizing-sm-mobile: var(--dimensions-06);
143
+ --loader-spinner-sizing-md-desktop: var(--dimensions-10);
144
+ --loader-spinner-sizing-md-tablet: var(--dimensions-10);
145
+ --loader-spinner-sizing-md-mobile: var(--dimensions-10);
146
+ --loader-spinner-sizing-lg-desktop: var(--dimensions-18);
147
+ --loader-spinner-sizing-lg-tablet: var(--dimensions-18);
148
+ --loader-spinner-sizing-lg-mobile: var(--dimensions-18);
149
+ --loader-spinner-page-spacing-top-desktop: var(--dimensions-22);
150
+ --loader-spinner-page-spacing-top-tablet: var(--dimensions-22);
151
+ --loader-spinner-page-spacing-top-mobile: var(--dimensions-22);
152
+ --icon-background-padding-sm-desktop: var(--dimensions-05);
153
+ --icon-background-padding-sm-tablet: var(--dimensions-05);
154
+ --icon-background-padding-sm-mobile: var(--dimensions-05);
155
+ --icon-00-desktop: var(--dimensions-05);
156
+ --icon-00-tablet: var(--dimensions-05);
157
+ --icon-00-mobile: var(--dimensions-05);
158
+ --loader-skeleton-height-100-desktop: 24px;
159
+ --loader-skeleton-height-100-rem-desktop: 1.5rem;
160
+ --loader-skeleton-height-100-tablet: 24px;
161
+ --loader-skeleton-height-100-rem-tablet: 1.5rem;
162
+ --loader-skeleton-height-100-mobile: 24px;
163
+ --loader-skeleton-height-100-rem-mobile: 1.5rem;
164
+ --loader-skeleton-height-200-desktop: 32px;
165
+ --loader-skeleton-height-200-rem-desktop: 2rem;
166
+ --loader-skeleton-height-200-tablet: 32px;
167
+ --loader-skeleton-height-200-rem-tablet: 2rem;
168
+ --loader-skeleton-height-200-mobile: 32px;
169
+ --loader-skeleton-height-200-rem-mobile: 2rem;
170
+ --loader-skeleton-height-300-desktop: 36px;
171
+ --loader-skeleton-height-300-rem-desktop: 2.25rem;
172
+ --loader-skeleton-height-300-tablet: 36px;
173
+ --loader-skeleton-height-300-rem-tablet: 2.25rem;
174
+ --loader-skeleton-height-300-mobile: 36px;
175
+ --loader-skeleton-height-300-rem-mobile: 2.25rem;
176
+ --loader-skeleton-height-400-desktop: 46px;
177
+ --loader-skeleton-height-400-rem-desktop: 2.875rem;
178
+ --loader-skeleton-height-400-tablet: 46px;
179
+ --loader-skeleton-height-400-rem-tablet: 2.875rem;
180
+ --loader-skeleton-height-400-mobile: 46px;
181
+ --loader-skeleton-height-400-rem-mobile: 2.875rem;
182
+ --loader-skeleton-height-500-desktop: 100;
183
+ --loader-skeleton-height-500-tablet: 100;
184
+ --loader-skeleton-height-500-mobile: 100;
185
+ --loader-skeleton-radius-desktop: var(--radius-02-default);
186
+ --loader-skeleton-radius-tablet: var(--radius-02-default);
187
+ --loader-skeleton-radius-mobile: var(--radius-02-default);
188
+ --loader-skeleton-inner-spacing-y-desktop: var(--dimensions-10);
189
+ --loader-skeleton-inner-spacing-y-tablet: var(--dimensions-10);
190
+ --loader-skeleton-inner-spacing-y-mobile: var(--dimensions-10);
191
+ --button-width-min-desktop: var(--dimensions-23);
192
+ --button-width-min-tablet: var(--dimensions-23);
193
+ --button-width-min-mobile: var(--dimensions-23);
194
+ --button-width-min-sm-desktop: var(--dimensions-21);
195
+ --button-width-min-sm-tablet: var(--dimensions-21);
196
+ --button-width-min-sm-mobile: var(--dimensions-21);
197
+ --card-padding-xs-desktop: var(--dimensions-05);
198
+ --card-padding-xs-tablet: var(--dimensions-05);
199
+ --card-padding-xs-mobile: var(--dimensions-05);
200
+ --icon-03-desktop: var(--dimensions-11);
201
+ --icon-03-tablet: var(--dimensions-11);
202
+ --icon-03-mobile: var(--dimensions-11);
203
+ --icon-01-desktop: var(--dimensions-07);
204
+ --icon-01-tablet: var(--dimensions-07);
205
+ --icon-01-mobile: var(--dimensions-07);
206
+ --tag-default-padding-x-desktop: var(--dimensions-03);
207
+ --tag-default-padding-x-tablet: var(--dimensions-03);
208
+ --tag-default-padding-x-mobile: var(--dimensions-03);
209
+ --tag-default-padding-y-desktop: var(--dimensions-02);
210
+ --tag-default-padding-y-tablet: var(--dimensions-02);
211
+ --tag-default-padding-y-mobile: var(--dimensions-02);
212
+ --tag-default-radius-desktop: var(--radius-02-default);
213
+ --tag-default-radius-tablet: var(--radius-02-default);
214
+ --tag-default-radius-mobile: var(--radius-02-default);
215
+ --tag-status-icon-padding-y-desktop: var(--dimensions-03);
216
+ --tag-status-icon-padding-y-tablet: var(--dimensions-03);
217
+ --tag-status-icon-padding-y-mobile: var(--dimensions-03);
218
+ --tag-status-icon-padding-x-desktop: var(--dimensions-03);
219
+ --tag-status-icon-padding-x-tablet: var(--dimensions-03);
220
+ --tag-status-icon-padding-x-mobile: var(--dimensions-03);
221
+ --button-xxs-icon-size-desktop: var(--dimensions-10);
222
+ --button-xxs-icon-size-tablet: var(--dimensions-10);
223
+ --button-xxs-icon-size-mobile: var(--dimensions-10);
224
+ --avatar-size-md-desktop: var(--dimensions-14);
225
+ --avatar-size-md-tablet: var(--dimensions-14);
226
+ --avatar-size-md-mobile: var(--dimensions-14);
227
+ --avatar-size-sm-desktop: var(--dimensions-13);
228
+ --avatar-size-sm-tablet: var(--dimensions-13);
229
+ --avatar-size-sm-mobile: var(--dimensions-13);
230
+ --avatar-size-lg-desktop: var(--dimensions-16);
231
+ --avatar-size-lg-tablet: var(--dimensions-16);
232
+ --avatar-size-lg-mobile: var(--dimensions-16);
233
+ --status-indicator-sm-desktop: var(--dimensions-05);
234
+ --status-indicator-sm-tablet: var(--dimensions-05);
235
+ --status-indicator-sm-mobile: var(--dimensions-05);
236
+ --status-indicator-lg-desktop: var(--dimensions-07);
237
+ --status-indicator-lg-tablet: var(--dimensions-07);
238
+ --status-indicator-lg-mobile: var(--dimensions-07);
239
+ --breadcrumb-inner-spacing-desktop: var(--dimensions-03);
240
+ --breadcrumb-inner-spacing-tablet: var(--dimensions-03);
241
+ --breadcrumb-inner-spacing-mobile: var(--dimensions-03);
242
+ --empty-state-padding-desktop: var(--dimensions-13);
243
+ --empty-state-padding-tablet: var(--dimensions-13);
244
+ --empty-state-padding-mobile: var(--dimensions-10);
245
+ --empty-state-radius-desktop: var(--radius-02-default);
246
+ --empty-state-radius-tablet: var(--radius-02-default);
247
+ --empty-state-radius-mobile: var(--radius-02-default);
248
+ --empty-state-inner-spacing-y-lg-desktop: var(--dimensions-10);
249
+ --empty-state-inner-spacing-y-lg-tablet: var(--dimensions-10);
250
+ --empty-state-inner-spacing-y-lg-mobile: var(--dimensions-05);
251
+ --link-icon-padding-y-desktop: var(--dimensions-03);
252
+ --link-icon-padding-y-tablet: var(--dimensions-03);
253
+ --link-icon-padding-y-mobile: var(--dimensions-03);
254
+ --link-icon-padding-top-desktop: var(--dimensions-02);
255
+ --link-icon-padding-top-tablet: var(--dimensions-02);
256
+ --link-icon-padding-top-mobile: var(--dimensions-02);
257
+ --form-checkbox-radio-card-radius-desktop: var(--radius-02-default);
258
+ --form-checkbox-radio-card-radius-tablet: var(--radius-02-default);
259
+ --form-checkbox-radio-card-radius-mobile: var(--radius-02-default);
260
+ --form-checkbox-radio-card-checkbox-padding-x-desktop: var(--form-checkbox-radio-card-checkbox-padding-y-desktop);
261
+ --form-checkbox-radio-card-checkbox-padding-x-tablet: var(--form-checkbox-radio-card-checkbox-padding-y-tablet);
262
+ --form-checkbox-radio-card-checkbox-padding-x-mobile: var(--form-checkbox-radio-card-checkbox-padding-y-mobile);
263
+ --form-checkbox-radio-card-checkbox-padding-y-desktop: var(--dimensions-05);
264
+ --form-checkbox-radio-card-checkbox-padding-y-tablet: var(--dimensions-05);
265
+ --form-checkbox-radio-card-checkbox-padding-y-mobile: var(--dimensions-05);
266
+ --form-checkbox-radio-card-inner-spacing-desktop: var(--button-md-inner-spacing-desktop);
267
+ --form-checkbox-radio-card-inner-spacing-tablet: var(--button-md-inner-spacing-tablet);
268
+ --form-checkbox-radio-card-inner-spacing-mobile: var(--button-md-inner-spacing-mobile);
269
+ --form-checkbox-radio-size-responsive-desktop: var(--dimensions-11);
270
+ --form-checkbox-radio-size-responsive-tablet: var(--dimensions-11);
271
+ --form-checkbox-radio-size-responsive-mobile: var(--dimensions-13);
272
+ --form-checkbox-radio-inner-spacing-desktop: var(--dimensions-05);
273
+ --form-checkbox-radio-inner-spacing-tablet: var(--dimensions-05);
274
+ --form-checkbox-radio-inner-spacing-mobile: var(--dimensions-05);
275
+ --form-checkbox-radio-indicator-radius-checkbox-desktop: var(--dimensions-02);
276
+ --form-checkbox-radio-indicator-radius-checkbox-tablet: var(--dimensions-02);
277
+ --form-checkbox-radio-indicator-radius-checkbox-mobile: var(--dimensions-02);
278
+ --form-checkbox-radio-card-checkbox-indicator-padding-y-desktop: var(--dimensions-07);
279
+ --form-checkbox-radio-card-checkbox-indicator-padding-y-tablet: var(--dimensions-07);
280
+ --form-checkbox-radio-card-checkbox-indicator-padding-y-mobile: var(--dimensions-07);
281
+ --tag-status-large-padding-y-desktop: var(--dimensions-05);
282
+ --tag-status-large-padding-y-tablet: var(--dimensions-05);
283
+ --tag-status-large-padding-y-mobile: var(--dimensions-05);
284
+ --tag-status-large-padding-x-desktop: var(--dimensions-05);
285
+ --tag-status-large-padding-x-tablet: var(--dimensions-05);
286
+ --tag-status-large-padding-x-mobile: var(--dimensions-05);
287
+ --status-indicator-inner-spacing-desktop: var(--dimensions-05);
288
+ --status-indicator-inner-spacing-tablet: var(--dimensions-05);
289
+ --status-indicator-inner-spacing-mobile: var(--dimensions-05);
290
+ --text-group-value-inner-spacing-desktop: var(--dimensions-04);
291
+ --text-group-value-inner-spacing-tablet: var(--dimensions-04);
292
+ --text-group-value-inner-spacing-mobile: var(--dimensions-04);
293
+ --text-group-value-icon-padding-top-desktop: var(--dimensions-03);
294
+ --text-group-value-icon-padding-top-tablet: var(--dimensions-03);
295
+ --text-group-value-icon-padding-top-mobile: var(--dimensions-03);
296
+ --list-list-item-margin-y-desktop: var(--dimensions-05);
297
+ --list-list-item-margin-y-tablet: var(--dimensions-05);
298
+ --list-list-item-margin-y-mobile: var(--dimensions-05);
299
+ --tag-status-large-min-width-desktop: var(--dimensions-21);
300
+ --tag-status-large-min-width-tablet: var(--dimensions-21);
301
+ --tag-status-large-min-width-mobile: var(--dimensions-21);
302
+ --text-group-label-width-sm-desktop: 132px;
303
+ --text-group-label-width-sm-rem-desktop: 8.25rem;
304
+ --text-group-label-width-sm-tablet: 132px;
305
+ --text-group-label-width-sm-rem-tablet: 8.25rem;
306
+ --text-group-label-width-sm-mobile: 132px;
307
+ --text-group-label-width-sm-rem-mobile: 8.25rem;
308
+ --text-group-label-width-md-desktop: 164px;
309
+ --text-group-label-width-md-rem-desktop: 10.25rem;
310
+ --text-group-label-width-md-tablet: 164px;
311
+ --text-group-label-width-md-rem-tablet: 10.25rem;
312
+ --text-group-label-width-md-mobile: 164px;
313
+ --text-group-label-width-md-rem-mobile: 10.25rem;
314
+ --text-group-label-width-lg-desktop: 196px;
315
+ --text-group-label-width-lg-rem-desktop: 12.25rem;
316
+ --text-group-label-width-lg-tablet: 196px;
317
+ --text-group-label-width-lg-rem-tablet: 12.25rem;
318
+ --text-group-label-width-lg-mobile: 196px;
319
+ --text-group-label-width-lg-rem-mobile: 12.25rem;
320
+ --layout-page-spacing-top-desktop: var(--dimensions-13);
321
+ --layout-page-spacing-top-tablet: var(--dimensions-13);
322
+ --layout-page-spacing-top-mobile: var(--dimensions-13);
323
+ --layout-page-spacing-x-desktop: 40px;
324
+ --layout-page-spacing-x-rem-desktop: 2.5rem;
325
+ --layout-page-spacing-x-tablet: 24px;
326
+ --layout-page-spacing-x-rem-tablet: 1.5rem;
327
+ --layout-page-spacing-x-mobile: 8px;
328
+ --layout-page-spacing-x-rem-mobile: 0.5rem;
329
+ --breadcrumb-spacing-bottom-desktop: var(--dimensions-13);
330
+ --breadcrumb-spacing-bottom-tablet: var(--dimensions-13);
331
+ --breadcrumb-spacing-bottom-mobile: var(--dimensions-10);
332
+ --layout-header-padding-y-sm-desktop: var(--dimensions-07);
333
+ --layout-header-padding-y-sm-tablet: var(--dimensions-07);
334
+ --layout-header-padding-y-sm-mobile: 0rem;
335
+ --layout-header-padding-y-desktop: var(--dimensions-10);
336
+ --layout-header-padding-y-tablet: 0rem;
337
+ --layout-header-padding-y-mobile: 0rem;
338
+ --layout-header-padding-left-desktop: var(--dimensions-13);
339
+ --layout-header-padding-left-tablet: var(--dimensions-13);
340
+ --layout-header-padding-left-mobile: var(--dimensions-06);
341
+ --layout-header-padding-right-desktop: var(--dimensions-13);
342
+ --layout-header-padding-right-tablet: var(--dimensions-13);
343
+ --layout-header-padding-right-mobile: 0rem;
344
+ --layout-header-profile-icon-desktop: var(--icon-06);
345
+ --layout-header-profile-icon-tablet: var(--icon-06);
346
+ --layout-header-profile-icon-mobile: var(--icon-05);
347
+ --layout-header-mobile-button-size-desktop: var(--dimensions-19);
348
+ --layout-header-mobile-button-size-tablet: var(--dimensions-19);
349
+ --layout-header-mobile-button-size-mobile: var(--dimensions-19);
350
+ --layout-header-min-height-desktop: 5.25rem;
351
+ --layout-header-min-height-tablet: 3.5rem;
352
+ --layout-header-min-height-mobile: 3.5rem;
353
+ --layout-header-items-right-gutter-x-desktop: var(--dimensions-13);
354
+ --layout-header-items-right-gutter-x-tablet: var(--dimensions-10);
355
+ --layout-header-items-center-gutter-x-mobile: var(--dimensions-07);
356
+ --layout-header-items-center-gutter-x-desktop: var(--dimensions-18);
357
+ --layout-header-items-center-gutter-x-tablet: var(--dimensions-13);
358
+ --layout-header-items-right-gutter-x-mobile: var(--dimensions-07);
359
+ --layout-header-modal-item-padding-desktop: var(--dimensions-10);
360
+ --layout-header-modal-item-padding-tablet: var(--dimensions-10);
361
+ --layout-header-modal-item-padding-mobile: var(--dimensions-10);
362
+ --button-gutter-x-sm-desktop: var(--dimensions-05);
363
+ --button-gutter-x-sm-tablet: var(--dimensions-05);
364
+ --button-gutter-x-sm-mobile: var(--dimensions-05);
365
+ --button-radius-sm-desktop: var(--radius-02-default);
366
+ --button-radius-sm-tablet: var(--radius-02-default);
367
+ --button-radius-sm-mobile: var(--radius-02-default);
368
+ --form-checkbox-radio-card-gutter-desktop: var(--button-gutter-x-sm-desktop);
369
+ --form-checkbox-radio-card-gutter-tablet: var(--button-gutter-x-sm-tablet);
370
+ --form-checkbox-radio-card-gutter-mobile: var(--button-gutter-x-sm-mobile);
371
+ --form-checkbox-radio-card-checkbox-icon-padding-y-desktop: var(--dimensions-04);
372
+ --form-checkbox-radio-card-checkbox-icon-padding-y-tablet: var(--dimensions-04);
373
+ --form-checkbox-radio-card-checkbox-icon-padding-y-mobile: var(--dimensions-04);
374
+ --content-label-info-icon-padding-y-desktop: var(--dimensions-03);
375
+ --content-label-info-icon-padding-y-tablet: var(--dimensions-03);
376
+ --content-label-info-icon-padding-y-mobile: var(--dimensions-03);
377
+ --tooltip-padding-x-desktop: var(--card-padding-xs-desktop);
378
+ --tooltip-padding-x-tablet: var(--card-padding-xs-tablet);
379
+ --tooltip-padding-x-mobile: var(--card-padding-xs-mobile);
380
+ --tooltip-padding-y-desktop: var(--tooltip-padding-x-desktop);
381
+ --tooltip-padding-y-tablet: var(--tooltip-padding-x-tablet);
382
+ --tooltip-padding-y-mobile: var(--tooltip-padding-x-mobile);
383
+ --tooltip-radius-desktop: var(--card-radius-rounded-desktop);
384
+ --tooltip-radius-tablet: var(--card-radius-rounded-tablet);
385
+ --tooltip-radius-mobile: var(--card-radius-rounded-mobile);
386
+ --tooltip-max-width-desktop: var(--containers-02);
387
+ --tooltip-max-width-tablet: var(--containers-02);
388
+ --tooltip-max-width-mobile: var(--containers-02);
389
+ --popover-padding-xs-desktop: var(--card-padding-xs-desktop);
390
+ --popover-padding-xs-tablet: var(--card-padding-xs-tablet);
391
+ --popover-padding-xs-mobile: var(--card-padding-xs-mobile);
392
+ --popover-padding-sm-desktop: var(--card-padding-md-default-desktop);
393
+ --popover-padding-sm-tablet: var(--card-padding-md-default-tablet);
394
+ --popover-padding-sm-mobile: var(--card-padding-md-default-mobile);
395
+ --popover-padding-md-desktop: var(--card-padding-lg-desktop);
396
+ --popover-padding-md-tablet: var(--card-padding-lg-tablet);
397
+ --popover-padding-md-mobile: var(--card-padding-lg-mobile);
398
+ --popover-radius-rounded-desktop: var(--card-radius-rounded-desktop);
399
+ --popover-radius-rounded-tablet: var(--card-radius-rounded-tablet);
400
+ --popover-radius-rounded-mobile: var(--card-radius-rounded-mobile);
401
+ --popover-width-01-desktop: var(--containers-02);
402
+ --popover-width-01-tablet: var(--containers-02);
403
+ --popover-width-01-mobile: var(--containers-02);
404
+ --popover-width-02-desktop: var(--containers-06);
405
+ --popover-width-02-tablet: var(--containers-06);
406
+ --popover-width-02-mobile: var(--containers-06);
407
+ --popover-width-03-desktop: var(--containers-10);
408
+ --popover-width-03-tablet: var(--containers-10);
409
+ --popover-width-03-mobile: var(--containers-10);
410
+ --content-heading-icon-padding-top-desktop: var(--dimensions-02);
411
+ --content-heading-icon-padding-top-tablet: var(--dimensions-02);
412
+ --content-heading-icon-padding-top-mobile: var(--dimensions-02);
413
+ --empty-state-inner-spacing-y-sm-desktop: var(--dimensions-03);
414
+ --empty-state-inner-spacing-y-sm-tablet: var(--dimensions-03);
415
+ --empty-state-inner-spacing-y-sm-mobile: var(--dimensions-03);
416
+ --form-checkbox-radio-card-radio-padding-y-desktop: var(--dimensions-05);
417
+ --form-checkbox-radio-card-radio-padding-y-tablet: var(--dimensions-05);
418
+ --form-checkbox-radio-card-radio-padding-y-mobile: var(--dimensions-05);
419
+ --form-checkbox-radio-card-radio-padding-x-desktop: var(--form-checkbox-radio-card-checkbox-padding-y-desktop);
420
+ --form-checkbox-radio-card-radio-padding-x-tablet: var(--form-checkbox-radio-card-checkbox-padding-y-tablet);
421
+ --form-checkbox-radio-card-radio-padding-x-mobile: var(--form-checkbox-radio-card-checkbox-padding-y-mobile);
422
+ --form-checkbox-radio-card-radio-indicator-padding-y-desktop: var(--dimensions-06);
423
+ --form-checkbox-radio-card-radio-indicator-padding-y-tablet: var(--dimensions-06);
424
+ --form-checkbox-radio-card-radio-indicator-padding-y-mobile: var(--dimensions-06);
425
+ --form-checkbox-radio-card-radio-icon-padding-y-desktop: var(--dimensions-04);
426
+ --form-checkbox-radio-card-radio-icon-padding-y-tablet: var(--dimensions-04);
427
+ --form-checkbox-radio-card-radio-icon-padding-y-mobile: var(--dimensions-04);
428
+ --button-icon-inner-size-desktop: var(--dimensions-11);
429
+ --button-icon-inner-size-tablet: var(--dimensions-11);
430
+ --button-icon-inner-size-mobile: var(--dimensions-11);
431
+ --button-icon-inner-icon-only-size-desktop: var(--dimensions-11);
432
+ --button-icon-inner-icon-only-size-tablet: var(--dimensions-11);
433
+ --button-icon-inner-icon-only-size-mobile: var(--dimensions-11);
434
+ --empty-state-padding-sm-desktop: var(--dimensions-10);
435
+ --empty-state-padding-sm-tablet: var(--dimensions-10);
436
+ --empty-state-padding-sm-mobile: var(--dimensions-10);
437
+ --button-xs-icon-size-desktop: var(--dimensions-13);
438
+ --button-xs-icon-size-tablet: var(--dimensions-13);
439
+ --button-xs-icon-size-mobile: var(--dimensions-13);
440
+ --form-checkbox-radio-gutter-y-desktop: var(--dimensions-03);
441
+ --form-checkbox-radio-gutter-y-tablet: var(--dimensions-03);
442
+ --form-checkbox-radio-gutter-y-mobile: var(--dimensions-05);
443
+ --form-checkbox-radio-gutter-x-desktop: var(--dimensions-07);
444
+ --form-checkbox-radio-gutter-x-tablet: var(--dimensions-07);
445
+ --form-checkbox-radio-gutter-x-mobile: var(--dimensions-07);
446
+ --layout-grid-gutters-04-desktop: var(--dimensions-03);
447
+ --layout-grid-gutters-04-tablet: var(--dimensions-03);
448
+ --layout-grid-gutters-04-mobile: var(--dimensions-03);
449
+ --layout-grid-gutters-08-desktop: var(--dimensions-05);
450
+ --layout-grid-gutters-08-tablet: var(--dimensions-05);
451
+ --layout-grid-gutters-08-mobile: var(--dimensions-05);
452
+ --layout-grid-gutters-12-desktop: var(--dimensions-07);
453
+ --layout-grid-gutters-12-tablet: var(--dimensions-07);
454
+ --layout-grid-gutters-12-mobile: var(--dimensions-07);
455
+ --layout-grid-gutters-16-desktop: var(--dimensions-10);
456
+ --layout-grid-gutters-16-tablet: var(--dimensions-10);
457
+ --layout-grid-gutters-16-mobile: var(--dimensions-10);
458
+ --form-checkbox-radio-subitem-padding-left-desktop: var(--dimensions-14);
459
+ --form-checkbox-radio-subitem-padding-left-tablet: var(--dimensions-14);
460
+ --form-checkbox-radio-subitem-padding-left-mobile: var(--dimensions-14);
461
+ --separator-spacing-x-02-desktop: var(--dimensions-07);
462
+ --separator-spacing-x-02-tablet: var(--dimensions-07);
463
+ --separator-spacing-x-02-mobile: var(--dimensions-07);
464
+ --separator-spacing-x-03-desktop: var(--dimensions-13);
465
+ --separator-spacing-x-03-tablet: var(--dimensions-13);
466
+ --separator-spacing-x-03-mobile: var(--dimensions-13);
467
+ --separator-dotted-dot-sm-desktop: var(--dimensions-03);
468
+ --separator-dotted-dot-sm-tablet: var(--dimensions-03);
469
+ --separator-dotted-dot-sm-mobile: var(--dimensions-03);
470
+ --tab-spacing-x-desktop: var(--dimensions-10);
471
+ --tab-spacing-x-tablet: var(--dimensions-10);
472
+ --tab-spacing-x-mobile: var(--dimensions-10);
473
+ --tab-spacing-y-desktop: var(--tab-spacing-x-desktop);
474
+ --tab-spacing-y-tablet: var(--tab-spacing-x-tablet);
475
+ --tab-spacing-y-mobile: var(--dimensions-07);
476
+ --tab-top-radius-desktop: var(--card-radius-rounded-desktop);
477
+ --tab-top-radius-tablet: var(--card-radius-rounded-tablet);
478
+ --tab-top-radius-mobile: var(--card-radius-rounded-mobile);
479
+ --tab-icon-desktop: 18px;
480
+ --tab-icon-rem-desktop: 1.125rem;
481
+ --tab-icon-tablet: 18px;
482
+ --tab-icon-rem-tablet: 1.125rem;
483
+ --tab-icon-mobile: 18px;
484
+ --tab-icon-rem-mobile: 1.125rem;
485
+ --tab-inner-spacing-desktop: var(--dimensions-05);
486
+ --tab-inner-spacing-tablet: var(--dimensions-05);
487
+ --tab-inner-spacing-mobile: var(--dimensions-05);
488
+ --alert-default-padding-x-desktop: 20px;
489
+ --alert-default-padding-x-rem-desktop: 1.25rem;
490
+ --alert-default-padding-x-tablet: 20px;
491
+ --alert-default-padding-x-rem-tablet: 1.25rem;
492
+ --alert-default-padding-x-mobile: var(--dimensions-10);
493
+ --alert-default-padding-y-desktop: var(--dimensions-10);
494
+ --alert-default-padding-y-tablet: var(--dimensions-10);
495
+ --alert-default-padding-y-mobile: var(--dimensions-10);
496
+ --alert-radius-desktop: var(--card-radius-rounded-desktop);
497
+ --alert-radius-tablet: var(--card-radius-rounded-tablet);
498
+ --alert-radius-mobile: var(--card-radius-rounded-mobile);
499
+ --alert-default-inner-spacing-y-desktop: var(--dimensions-03);
500
+ --alert-default-inner-spacing-y-tablet: var(--dimensions-03);
501
+ --alert-default-inner-spacing-y-mobile: var(--dimensions-03);
502
+ --alert-default-inner-spacing-x-desktop: var(--dimensions-05);
503
+ --alert-default-inner-spacing-x-tablet: var(--dimensions-05);
504
+ --alert-default-inner-spacing-x-mobile: var(--dimensions-05);
505
+ --alert-default-icon-top-padding-desktop: var(--dimensions-02);
506
+ --alert-default-icon-top-padding-tablet: var(--dimensions-02);
507
+ --alert-default-icon-top-padding-mobile: var(--dimensions-02);
508
+ --alert-default-icon-size-desktop: var(--button-icon-inner-size-desktop);
509
+ --alert-default-icon-size-tablet: var(--button-icon-inner-size-tablet);
510
+ --alert-default-icon-size-mobile: var(--button-icon-inner-size-mobile);
511
+ --alert-illustrative-inner-spacing-x-desktop: var(--dimensions-10);
512
+ --alert-illustrative-inner-spacing-x-tablet: var(--dimensions-10);
513
+ --alert-illustrative-inner-spacing-x-mobile: var(--dimensions-10);
514
+ --alert-illustrative-padding-y-desktop: var(--dimensions-07);
515
+ --alert-illustrative-padding-y-tablet: var(--dimensions-07);
516
+ --alert-illustrative-padding-y-mobile: var(--dimensions-07);
517
+ --alert-illustrative-padding-x-desktop: var(--alert-default-padding-x-desktop);
518
+ --alert-illustrative-padding-x-tablet: var(--alert-default-padding-x-tablet);
519
+ --alert-illustrative-padding-x-mobile: var(--alert-default-padding-x-mobile);
520
+ --alert-illustrative-min-width-desktop: 380px;
521
+ --alert-illustrative-min-width-rem-desktop: 23.75rem;
522
+ --alert-illustrative-min-width-tablet: 380px;
523
+ --alert-illustrative-min-width-rem-tablet: 23.75rem;
524
+ --alert-illustrative-min-width-mobile: 380px;
525
+ --alert-illustrative-min-width-rem-mobile: 23.75rem;
526
+ --alert-illustrative-text-max-width-desktop: 748px;
527
+ --alert-illustrative-text-max-width-rem-desktop: 46.75rem;
528
+ --alert-illustrative-text-max-width-tablet: 748px;
529
+ --alert-illustrative-text-max-width-rem-tablet: 46.75rem;
530
+ --alert-illustrative-text-max-width-mobile: 748px;
531
+ --alert-illustrative-text-max-width-rem-mobile: 46.75rem;
532
+ --form-select-item-padding-y-desktop: var(--dimensions-05);
533
+ --form-select-item-padding-y-tablet: var(--dimensions-05);
534
+ --form-select-item-padding-y-mobile: var(--dimensions-07);
535
+ --form-select-item-padding-x-desktop: var(--dimensions-07);
536
+ --form-select-item-padding-x-tablet: var(--dimensions-07);
537
+ --form-select-item-padding-x-mobile: var(--dimensions-07);
538
+ --form-select-item-radius-desktop: var(--radius-02-default);
539
+ --form-select-item-radius-tablet: var(--radius-02-default);
540
+ --form-select-item-radius-mobile: var(--radius-02-default);
541
+ --empty-state-inner-spacing-y-md-desktop: var(--dimensions-05);
542
+ --empty-state-inner-spacing-y-md-tablet: var(--dimensions-05);
543
+ --empty-state-inner-spacing-y-md-mobile: var(--dimensions-05);
544
+ --toast-width-desktop: var(--containers-03);
545
+ --toast-width-tablet: var(--containers-03);
546
+ --toast-width-mobile: var(--containers-03);
547
+ --toast-padding-y-desktop: var(--alert-default-padding-y-desktop);
548
+ --toast-padding-y-tablet: var(--alert-default-padding-y-tablet);
549
+ --toast-padding-y-mobile: var(--alert-default-padding-y-mobile);
550
+ --toast-padding-x-desktop: var(--alert-default-padding-x-desktop);
551
+ --toast-padding-x-tablet: var(--alert-default-padding-x-tablet);
552
+ --toast-padding-x-mobile: var(--alert-default-padding-x-mobile);
553
+ --toast-inner-spacing-y-desktop: var(--alert-default-inner-spacing-y-desktop);
554
+ --toast-inner-spacing-y-tablet: var(--alert-default-inner-spacing-y-tablet);
555
+ --toast-inner-spacing-y-mobile: var(--alert-default-inner-spacing-y-mobile);
556
+ --toast-outer-spacing-desktop: var(--dimensions-03);
557
+ --toast-outer-spacing-tablet: var(--dimensions-03);
558
+ --toast-outer-spacing-mobile: var(--dimensions-00);
559
+ --toast-margin-bottom-desktop: var(--dimensions-10);
560
+ --toast-margin-bottom-tablet: var(--dimensions-10);
561
+ --toast-margin-bottom-mobile: var(--dimensions-05);
562
+ --toast-margin-right-desktop: var(--dimensions-10);
563
+ --toast-margin-right-tablet: var(--dimensions-10);
564
+ --toast-margin-right-mobile: var(--dimensions-05);
565
+ --form-field-padding-x-md-default-desktop: var(--dimensions-05);
566
+ --form-field-padding-x-md-default-tablet: var(--dimensions-05);
567
+ --form-field-padding-x-md-default-mobile: var(--dimensions-05);
568
+ --form-field-padding-y-md-default-desktop: var(--dimensions-05);
569
+ --form-field-padding-y-md-default-tablet: var(--dimensions-05);
570
+ --form-field-padding-y-md-default-mobile: var(--dimensions-06);
571
+ --form-field-radius-desktop: var(--card-radius-rounded-desktop);
572
+ --form-field-radius-tablet: var(--card-radius-rounded-tablet);
573
+ --form-field-radius-mobile: var(--card-radius-rounded-mobile);
574
+ --form-field-inner-spacing-desktop: var(--dimensions-05);
575
+ --form-field-inner-spacing-tablet: var(--dimensions-05);
576
+ --form-field-inner-spacing-mobile: var(--dimensions-05);
577
+ --form-field-outer-spacing-desktop: var(--dimensions-03);
578
+ --form-field-outer-spacing-tablet: var(--dimensions-03);
579
+ --form-field-outer-spacing-mobile: var(--dimensions-03);
580
+ --form-field-inner-spacing-sm-desktop: var(--dimensions-03);
581
+ --form-field-inner-spacing-sm-tablet: var(--dimensions-03);
582
+ --form-field-inner-spacing-sm-mobile: var(--dimensions-03);
583
+ --form-field-height-sm-desktop: var(--dimensions-14);
584
+ --form-field-height-sm-tablet: var(--dimensions-14);
585
+ --form-field-height-sm-mobile: var(--dimensions-17);
586
+ --form-field-height-desktop: var(--dimensions-16);
587
+ --form-field-height-tablet: var(--dimensions-16);
588
+ --form-field-height-mobile: var(--dimensions-17);
589
+ --form-textarea-min-height-desktop: 136px;
590
+ --form-textarea-min-height-rem-desktop: 8.5rem;
591
+ --form-textarea-min-height-tablet: 136px;
592
+ --form-textarea-min-height-rem-tablet: 8.5rem;
593
+ --form-textarea-min-height-mobile: 136px;
594
+ --form-textarea-min-height-rem-mobile: 8.5rem;
595
+ --form-number-input-min-width-desktop: var(--dimensions-22);
596
+ --form-number-input-min-width-tablet: var(--dimensions-22);
597
+ --form-number-input-min-width-mobile: var(--dimensions-22);
598
+ --form-select-group-label-padding-x-desktop: var(--form-select-item-padding-x-desktop);
599
+ --form-select-group-label-padding-x-tablet: var(--form-select-item-padding-x-tablet);
600
+ --form-select-group-label-padding-x-mobile: var(--form-select-item-padding-x-mobile);
601
+ --form-select-group-label-padding-y-desktop: var(--form-select-item-padding-y-desktop);
602
+ --form-select-group-label-padding-y-tablet: var(--form-select-item-padding-y-tablet);
603
+ --form-select-group-label-padding-y-mobile: var(--form-select-item-padding-y-mobile);
604
+ --form-select-item-inner-spacing-desktop: var(--dimensions-05);
605
+ --form-select-item-inner-spacing-tablet: var(--dimensions-05);
606
+ --form-select-item-inner-spacing-mobile: var(--dimensions-05);
607
+ --form-checkbox-radio-indicator-radius-radio-desktop: var(--radius-08);
608
+ --form-checkbox-radio-indicator-radius-radio-tablet: var(--radius-08);
609
+ --form-checkbox-radio-indicator-radius-radio-mobile: var(--radius-08);
610
+ --filter-default-padding-y-desktop: var(--dimensions-03);
611
+ --filter-default-padding-y-tablet: var(--dimensions-03);
612
+ --filter-default-padding-y-mobile: var(--dimensions-03);
613
+ --filter-default-padding-x-desktop: var(--dimensions-04);
614
+ --filter-default-padding-x-tablet: var(--dimensions-04);
615
+ --filter-default-padding-x-mobile: var(--dimensions-04);
616
+ --filter-sm-padding-y-desktop: var(--dimensions-02);
617
+ --filter-sm-padding-y-tablet: var(--dimensions-02);
618
+ --filter-sm-padding-y-mobile: var(--dimensions-02);
619
+ --filter-sm-padding-x-desktop: var(--dimensions-03);
620
+ --filter-sm-padding-x-tablet: var(--dimensions-03);
621
+ --filter-sm-padding-x-mobile: var(--dimensions-03);
622
+ --modal-max-width-sm-desktop: var(--containers-08);
623
+ --modal-max-width-sm-tablet: var(--containers-08);
624
+ --modal-max-width-sm-mobile: var(--containers-05);
625
+ --modal-max-width-lg-desktop: var(--containers-11);
626
+ --modal-max-width-lg-tablet: var(--containers-11);
627
+ --modal-max-width-lg-mobile: var(--containers-05);
628
+ --modal-max-width-xl-desktop: var(--containers-13);
629
+ --modal-max-width-xl-tablet: var(--containers-13);
630
+ --modal-max-width-xl-mobile: var(--containers-05);
631
+ --modal-max-width-md-desktop: var(--containers-09);
632
+ --modal-max-width-md-tablet: var(--containers-09);
633
+ --modal-max-width-md-mobile: var(--containers-05);
634
+ --modal-body-padding-desktop: var(--dimensions-13);
635
+ --modal-body-padding-tablet: var(--dimensions-13);
636
+ --modal-body-padding-mobile: var(--dimensions-10);
637
+ --modal-radius-desktop: var(--card-radius-rounded-desktop);
638
+ --modal-radius-tablet: var(--card-radius-rounded-tablet);
639
+ --modal-radius-mobile: var(--card-radius-rounded-mobile);
640
+ --modal-max-width-xs-desktop: var(--containers-05);
641
+ --modal-max-width-xs-tablet: var(--containers-05);
642
+ --modal-max-width-xs-mobile: var(--containers-05);
643
+ --separator-dotted-dot-xs-desktop: var(--dimensions-02);
644
+ --separator-dotted-dot-xs-tablet: var(--dimensions-02);
645
+ --separator-dotted-dot-xs-mobile: var(--dimensions-02);
646
+ --form-field-padding-x-lg-desktop: var(--dimensions-10);
647
+ --form-field-padding-x-lg-tablet: var(--dimensions-10);
648
+ --form-field-padding-x-lg-mobile: var(--dimensions-10);
649
+ --form-field-padding-y-xxs-desktop: var(--dimensions-00);
650
+ --form-field-padding-y-xxs-tablet: var(--dimensions-00);
651
+ --form-field-padding-y-xxs-mobile: var(--dimensions-04);
652
+ --layout-grid-gutters-24-desktop: var(--dimensions-13);
653
+ --layout-grid-gutters-24-tablet: var(--dimensions-13);
654
+ --layout-grid-gutters-24-mobile: var(--dimensions-13);
655
+ --card-padding-sm-desktop: var(--dimensions-07);
656
+ --card-padding-sm-tablet: var(--dimensions-07);
657
+ --card-padding-sm-mobile: var(--dimensions-07);
658
+ --stepper-item-vertical-compact-inner-spacing-desktop: var(--dimensions-04);
659
+ --stepper-item-vertical-compact-inner-spacing-tablet: var(--dimensions-04);
660
+ --stepper-item-vertical-compact-inner-spacing-mobile: var(--dimensions-04);
661
+ --stepper-item-vertical-step-size-md-desktop: 16px;
662
+ --stepper-item-vertical-step-size-md-rem-desktop: 1rem;
663
+ --stepper-item-vertical-step-size-md-tablet: 16px;
664
+ --stepper-item-vertical-step-size-md-rem-tablet: 1rem;
665
+ --stepper-item-vertical-step-size-md-mobile: 16px;
666
+ --stepper-item-vertical-step-size-md-rem-mobile: 1rem;
667
+ --stepper-item-vertical-line-height-desktop: 6px;
668
+ --stepper-item-vertical-line-height-rem-desktop: 0.375rem;
669
+ --stepper-item-vertical-line-height-tablet: 6px;
670
+ --stepper-item-vertical-line-height-rem-tablet: 0.375rem;
671
+ --stepper-item-vertical-line-height-mobile: 6px;
672
+ --stepper-item-vertical-line-height-rem-mobile: 0.375rem;
673
+ --stepper-item-vertical-sub-line-bottom-desktop: 9px;
674
+ --stepper-item-vertical-sub-line-bottom-rem-desktop: 0.5625rem;
675
+ --stepper-item-vertical-sub-line-bottom-tablet: 9px;
676
+ --stepper-item-vertical-sub-line-bottom-rem-tablet: 0.5625rem;
677
+ --stepper-item-vertical-sub-line-bottom-mobile: 9px;
678
+ --stepper-item-vertical-sub-line-bottom-rem-mobile: 0.5625rem;
679
+ --stepper-item-vertical-lg-padding-top-desktop: 8px;
680
+ --stepper-item-vertical-lg-padding-top-rem-desktop: 0.5rem;
681
+ --stepper-item-vertical-lg-padding-top-tablet: 8px;
682
+ --stepper-item-vertical-lg-padding-top-rem-tablet: 0.5rem;
683
+ --stepper-item-vertical-lg-padding-top-mobile: 8px;
684
+ --stepper-item-vertical-lg-padding-top-rem-mobile: 0.5rem;
685
+ --modal-top-margin-desktop: 120px;
686
+ --modal-top-margin-rem-desktop: 7.5rem;
687
+ --modal-top-margin-tablet: var(--dimensions-16);
688
+ --modal-top-margin-mobile: var(--dimensions-10);
689
+ --button-lg-padding-x-desktop: var(--dimensions-11);
690
+ --button-lg-padding-x-tablet: var(--dimensions-11);
691
+ --button-lg-padding-x-mobile: var(--dimensions-11);
692
+ --button-lg-padding-y-desktop: var(--dimensions-06);
693
+ --button-lg-padding-y-tablet: var(--dimensions-06);
694
+ --button-lg-padding-y-mobile: var(--dimensions-06);
695
+ --button-lg-inner-spacing-desktop: var(--dimensions-04);
696
+ --button-lg-inner-spacing-tablet: var(--dimensions-04);
697
+ --button-lg-inner-spacing-mobile: var(--dimensions-04);
698
+ --button-lg-icon-padding-desktop: var(--dimensions-03);
699
+ --button-lg-icon-padding-tablet: var(--dimensions-03);
700
+ --button-lg-icon-padding-mobile: var(--dimensions-03);
701
+ --button-lg-icon-size-desktop: var(--dimensions-17);
702
+ --button-lg-icon-size-tablet: var(--dimensions-17);
703
+ --button-lg-icon-size-mobile: var(--dimensions-17);
704
+ --form-toggl-default-width-desktop: var(--dimensions-16);
705
+ --form-toggl-default-width-tablet: var(--dimensions-16);
706
+ --form-toggl-default-width-mobile: 56px;
707
+ --form-toggl-default-width-rem-mobile: 3.5rem;
708
+ --form-toggl-default-height-desktop: 20px;
709
+ --form-toggl-default-height-rem-desktop: 1.25rem;
710
+ --form-toggl-default-height-tablet: 20px;
711
+ --form-toggl-default-height-rem-tablet: 1.25rem;
712
+ --form-toggl-default-height-mobile: 28px;
713
+ --form-toggl-default-height-rem-mobile: 1.75rem;
714
+ --form-toggl-large-width-desktop: 56px;
715
+ --form-toggl-large-width-rem-desktop: 3.5rem;
716
+ --form-toggl-large-width-tablet: 56px;
717
+ --form-toggl-large-width-rem-tablet: 3.5rem;
718
+ --form-toggl-large-width-mobile: 56px;
719
+ --form-toggl-large-width-rem-mobile: 3.5rem;
720
+ --form-toggl-large-height-desktop: 28px;
721
+ --form-toggl-large-height-rem-desktop: 1.75rem;
722
+ --form-toggl-large-height-tablet: 28px;
723
+ --form-toggl-large-height-rem-tablet: 1.75rem;
724
+ --form-toggl-large-height-mobile: 28px;
725
+ --form-toggl-large-height-rem-mobile: 1.75rem;
726
+ --form-toggl-large-indicator-desktop: 24px;
727
+ --form-toggl-large-indicator-rem-desktop: 1.5rem;
728
+ --form-toggl-large-indicator-tablet: 24px;
729
+ --form-toggl-large-indicator-rem-tablet: 1.5rem;
730
+ --form-toggl-large-indicator-mobile: 24px;
731
+ --form-toggl-large-indicator-rem-mobile: 1.5rem;
732
+ --form-toggl-default-indicator-desktop: var(--dimensions-10);
733
+ --form-toggl-default-indicator-tablet: var(--dimensions-10);
734
+ --form-toggl-default-indicator-mobile: var(--dimensions-13);
735
+ --form-toggl-radius-desktop: var(--radius-04);
736
+ --form-toggl-radius-tablet: var(--radius-04);
737
+ --form-toggl-radius-mobile: var(--radius-04);
738
+ --form-calendar-date-width-desktop: 40px;
739
+ --form-calendar-date-width-rem-desktop: 2.5rem;
740
+ --form-calendar-date-width-tablet: 40px;
741
+ --form-calendar-date-width-rem-tablet: 2.5rem;
742
+ --form-calendar-date-width-mobile: 40px;
743
+ --form-calendar-date-width-rem-mobile: 2.5rem;
744
+ --form-field-padding-y-sm-desktop: var(--dimensions-03);
745
+ --form-field-padding-y-sm-tablet: var(--dimensions-03);
746
+ --form-field-padding-y-sm-mobile: var(--dimensions-06);
747
+ --form-field-padding-x-sm-desktop: var(--dimensions-03);
748
+ --form-field-padding-x-sm-tablet: var(--dimensions-03);
749
+ --form-field-padding-x-sm-mobile: var(--dimensions-03);
750
+ --form-field-padding-y-xs-desktop: var(--dimensions-02);
751
+ --form-field-padding-y-xs-tablet: var(--dimensions-02);
752
+ --form-field-padding-y-xs-mobile: var(--dimensions-02);
753
+ --layout-grid-gutters-02-desktop: var(--dimensions-02);
754
+ --layout-grid-gutters-02-tablet: var(--dimensions-02);
755
+ --layout-grid-gutters-02-mobile: var(--dimensions-02);
756
+ --table-header-padding-x-desktop: 14px;
757
+ --table-header-padding-x-rem-desktop: 0.875rem;
758
+ --table-header-padding-x-tablet: 14px;
759
+ --table-header-padding-x-rem-tablet: 0.875rem;
760
+ --table-header-padding-x-mobile: 14px;
761
+ --table-header-padding-x-rem-mobile: 0.875rem;
762
+ --table-header-padding-y-desktop: 12px;
763
+ --table-header-padding-y-rem-desktop: 0.75rem;
764
+ --table-header-padding-y-tablet: 12px;
765
+ --table-header-padding-y-rem-tablet: 0.75rem;
766
+ --table-header-padding-y-mobile: 12px;
767
+ --table-header-padding-y-rem-mobile: 0.75rem;
768
+ --table-data-padding-x-desktop: 14px;
769
+ --table-data-padding-x-rem-desktop: 0.875rem;
770
+ --table-data-padding-x-tablet: 14px;
771
+ --table-data-padding-x-rem-tablet: 0.875rem;
772
+ --table-data-padding-x-mobile: 14px;
773
+ --table-data-padding-x-rem-mobile: 0.875rem;
774
+ --table-data-padding-y-desktop: 12px;
775
+ --table-data-padding-y-rem-desktop: 0.75rem;
776
+ --table-data-padding-y-tablet: 12px;
777
+ --table-data-padding-y-rem-tablet: 0.75rem;
778
+ --table-data-padding-y-mobile: 12px;
779
+ --table-data-padding-y-rem-mobile: 0.75rem;
780
+ --table-header-padding-x-sm-desktop: 8px;
781
+ --table-header-padding-x-sm-rem-desktop: 0.5rem;
782
+ --table-header-padding-x-sm-tablet: 8px;
783
+ --table-header-padding-x-sm-rem-tablet: 0.5rem;
784
+ --table-header-padding-x-sm-mobile: 8px;
785
+ --table-header-padding-x-sm-rem-mobile: 0.5rem;
786
+ --table-header-padding-y-sm-desktop: 12px;
787
+ --table-header-padding-y-sm-rem-desktop: 0.75rem;
788
+ --table-header-padding-y-sm-tablet: 12px;
789
+ --table-header-padding-y-sm-rem-tablet: 0.75rem;
790
+ --table-header-padding-y-sm-mobile: 12px;
791
+ --table-header-padding-y-sm-rem-mobile: 0.75rem;
792
+ --table-data-padding-x-sm-desktop: 8px;
793
+ --table-data-padding-x-sm-rem-desktop: 0.5rem;
794
+ --table-data-padding-x-sm-tablet: 8px;
795
+ --table-data-padding-x-sm-rem-tablet: 0.5rem;
796
+ --table-data-padding-x-sm-mobile: 8px;
797
+ --table-data-padding-x-sm-rem-mobile: 0.5rem;
798
+ --table-data-padding-y-sm-desktop: 4px;
799
+ --table-data-padding-y-sm-rem-desktop: 0.25rem;
800
+ --table-data-padding-y-sm-tablet: 4px;
801
+ --table-data-padding-y-sm-rem-tablet: 0.25rem;
802
+ --table-data-padding-y-sm-mobile: 4px;
803
+ --table-data-padding-y-sm-rem-mobile: 0.25rem;
804
+ --pagination-padding-x-desktop: 14px;
805
+ --pagination-padding-x-rem-desktop: 0.875rem;
806
+ --pagination-padding-x-tablet: 14px;
807
+ --pagination-padding-x-rem-tablet: 0.875rem;
808
+ --pagination-padding-x-mobile: 14px;
809
+ --pagination-padding-x-rem-mobile: 0.875rem;
810
+ --pagination-padding-y-desktop: 12px;
811
+ --pagination-padding-y-rem-desktop: 0.75rem;
812
+ --pagination-padding-y-tablet: 12px;
813
+ --pagination-padding-y-rem-tablet: 0.75rem;
814
+ --pagination-padding-y-mobile: 12px;
815
+ --pagination-padding-y-rem-mobile: 0.75rem;
816
+ --button-xs-icon-inner-size-desktop: var(--dimensions-10);
817
+ --button-xs-icon-inner-size-tablet: var(--dimensions-10);
818
+ --button-xs-icon-inner-size-mobile: var(--dimensions-10);
819
+ --form-toggl-padding-desktop: var(--dimensions-02);
820
+ --form-toggl-padding-tablet: var(--dimensions-02);
821
+ --form-toggl-padding-mobile: var(--dimensions-02);
822
+ --form-field-padding-y-lg-desktop: var(--dimensions-10);
823
+ --form-field-padding-y-lg-tablet: var(--dimensions-10);
824
+ --form-field-padding-y-lg-mobile: var(--dimensions-10);
825
+ --table-radius-desktop: var(--radius-02-default);
826
+ --table-radius-tablet: var(--radius-02-default);
827
+ --table-radius-mobile: var(--radius-02-default);
828
+ --modal-heading-padding-y-desktop: var(--dimensions-10);
829
+ --modal-heading-padding-y-tablet: var(--dimensions-10);
830
+ --modal-heading-padding-y-mobile: var(--dimensions-10);
831
+ --modal-heading-padding-x-desktop: var(--dimensions-13);
832
+ --modal-heading-padding-x-tablet: var(--dimensions-13);
833
+ --modal-heading-padding-x-mobile: var(--dimensions-10);
834
+ --modal-footer-padding-y-desktop: var(--dimensions-10);
835
+ --modal-footer-padding-y-tablet: var(--dimensions-10);
836
+ --modal-footer-padding-y-mobile: var(--dimensions-10);
837
+ --modal-footer-padding-x-desktop: var(--dimensions-13);
838
+ --modal-footer-padding-x-tablet: var(--dimensions-13);
839
+ --modal-footer-padding-x-mobile: var(--dimensions-10);
840
+ --layout-grid-gutters-32-desktop: var(--dimensions-14);
841
+ --layout-grid-gutters-32-tablet: var(--dimensions-14);
842
+ --layout-grid-gutters-32-mobile: var(--dimensions-14);
843
+ --layout-grid-gutters-48-desktop: var(--dimensions-18);
844
+ --layout-grid-gutters-48-tablet: var(--dimensions-18);
845
+ --layout-grid-gutters-48-mobile: var(--dimensions-18);
846
+ --side-navigation-item-padding-right-desktop: var(--dimensions-10);
847
+ --side-navigation-item-padding-right-tablet: var(--dimensions-10);
848
+ --side-navigation-item-padding-right-mobile: var(--dimensions-10);
849
+ --side-navigation-item-padding-y-desktop: var(--dimensions-07);
850
+ --side-navigation-item-padding-y-tablet: var(--dimensions-10);
851
+ --side-navigation-item-padding-y-mobile: var(--dimensions-10);
852
+ --side-navigation-item-inner-spacing-desktop: var(--dimensions-10);
853
+ --side-navigation-item-inner-spacing-tablet: var(--dimensions-10);
854
+ --side-navigation-item-inner-spacing-mobile: var(--dimensions-10);
855
+ --side-navigation-item-min-height-desktop: var(--dimensions-21);
856
+ --side-navigation-item-min-height-tablet: var(--dimensions-21);
857
+ --side-navigation-item-min-height-mobile: 56px;
858
+ --side-navigation-item-min-height-rem-mobile: 3.5rem;
859
+ --side-navigation-item-width-default-desktop: 240px;
860
+ --side-navigation-item-width-default-tablet: 400px;
861
+ --side-navigation-item-width-default-mobile: 320px;
862
+ --side-navigation-text-size-desktop: var(--body-regular-size-desktop);
863
+ --side-navigation-text-size-tablet: var(--body-regular-size-tablet);
864
+ --side-navigation-text-size-mobile: var(--body-regular-size-mobile);
865
+ --side-navigation-item-padding-left-level-1-desktop: var(--dimensions-10);
866
+ --side-navigation-item-padding-left-level-1-tablet: var(--dimensions-10);
867
+ --side-navigation-item-padding-left-level-1-mobile: var(--dimensions-10);
868
+ --side-navigation-item-inner-spacing-sm-desktop: var(--dimensions-05);
869
+ --side-navigation-item-inner-spacing-sm-tablet: var(--dimensions-05);
870
+ --side-navigation-item-inner-spacing-sm-mobile: var(--dimensions-10);
871
+ --side-navigation-item-icon-desktop: var(--icon-05-desktop);
872
+ --side-navigation-item-icon-tablet: var(--icon-05-tablet);
873
+ --side-navigation-item-icon-mobile: var(--icon-05-mobile);
874
+ --side-navigation-item-icon-sm-desktop: var(--icon-03-desktop);
875
+ --side-navigation-item-icon-sm-tablet: var(--icon-05-tablet);
876
+ --side-navigation-item-icon-sm-mobile: var(--icon-05-mobile);
877
+ --side-navigation-item-padding-y-sm-desktop: var(--dimensions-05);
878
+ --side-navigation-item-padding-y-sm-tablet: var(--dimensions-10);
879
+ --side-navigation-item-padding-y-sm-mobile: var(--dimensions-10);
880
+ --side-navigation-item-padding-left-level-2-desktop: var(--dimensions-10);
881
+ --side-navigation-item-padding-left-level-2-tablet: var(--dimensions-10);
882
+ --side-navigation-item-padding-left-level-2-mobile: var(--dimensions-10);
883
+ --side-navigation-item-padding-y-md-desktop: var(--dimensions-10);
884
+ --side-navigation-item-padding-y-md-tablet: var(--dimensions-10);
885
+ --side-navigation-item-padding-y-md-mobile: var(--dimensions-10);
886
+ --side-navigation-text-size-sm-desktop: var(--body-small-regular-size-desktop);
887
+ --side-navigation-text-size-sm-tablet: var(--body-small-regular-size-tablet);
888
+ --side-navigation-text-size-sm-mobile: var(--body-regular-size-mobile);
889
+ --side-navigation-item-icon-md-desktop: var(--icon-04-desktop);
890
+ --side-navigation-item-icon-md-tablet: var(--icon-05-tablet);
891
+ --side-navigation-item-icon-md-mobile: var(--icon-05-mobile);
892
+ --side-navigation-item-width-collapsed-desktop: 96px;
893
+ --side-navigation-item-width-collapsed-tablet: 96px;
894
+ --side-navigation-item-width-collapsed-mobile: 96px;
895
+ --side-navigation-item-padding-x-sm-desktop: var(--dimensions-05);
896
+ --side-navigation-item-padding-x-sm-tablet: var(--dimensions-05);
897
+ --side-navigation-item-padding-x-sm-mobile: var(--dimensions-05);
898
+ --side-navigation-item-min-height-medium-desktop: var(--dimensions-19);
899
+ --side-navigation-item-min-height-medium-tablet: var(--dimensions-19);
900
+ --side-navigation-item-min-height-medium-mobile: var(--dimensions-19);
901
+ --side-navigation-item-min-height-small-desktop: var(--dimensions-16);
902
+ --side-navigation-item-min-height-small-tablet: var(--dimensions-16);
903
+ --side-navigation-item-min-height-small-mobile: var(--dimensions-19);
904
+ --form-checkbox-radio-label-gutter-y-desktop: var(--dimensions-00);
905
+ --form-checkbox-radio-label-gutter-y-tablet: var(--dimensions-00);
906
+ --form-checkbox-radio-label-gutter-y-mobile: var(--dimensions-03);
907
+ --header-items-right-gutter-x-desktop: var(--dimensions-13);
908
+ --header-items-right-gutter-x-tablet: var(--dimensions-07);
909
+ --header-items-right-gutter-x-mobile: var(--dimensions-07);
910
+ --header-items-center-gutter-x-desktop: var(--dimensions-18);
911
+ --header-items-center-gutter-x-tablet: var(--dimensions-07);
912
+ --header-items-center-gutter-x-mobile: var(--dimensions-07);
913
+ --header-padding-left-desktop: var(--dimensions-13);
914
+ --header-padding-left-tablet: var(--dimensions-13);
915
+ --header-padding-left-mobile: var(--dimensions-05);
916
+ --header-padding-y-desktop: var(--dimensions-10);
917
+ --header-padding-y-tablet: var(--dimensions-10);
918
+ --header-padding-y-mobile: 0px;
919
+ --header-padding-y-rem-mobile: 0rem;
920
+ --header-padding-right-desktop: var(--dimensions-13);
921
+ --header-padding-right-tablet: var(--dimensions-13);
922
+ --header-padding-right-mobile: var(--dimensions-10);
923
+ --header-min-height-desktop: 80px;
924
+ --header-min-height-rem-desktop: 5rem;
925
+ --header-min-height-tablet: 80px;
926
+ --header-min-height-rem-tablet: 5rem;
927
+ --header-min-height-mobile: 56px;
928
+ --header-min-height-rem-mobile: 3.5rem;
929
+ --header-modal-item-padding-desktop: var(--dimensions-10);
930
+ --header-modal-item-padding-tablet: var(--dimensions-10);
931
+ --header-modal-item-padding-mobile: var(--dimensions-10);
932
+ --form-checkbox-radio-size-fixed-desktop: var(--dimensions-11);
933
+ --form-checkbox-radio-size-fixed-tablet: var(--dimensions-11);
934
+ --form-checkbox-radio-size-fixed-mobile: var(--dimensions-11);
935
+ --form-select-area-max-height-desktop: 300;
936
+ --form-select-area-max-height-tablet: 300;
937
+ --form-select-area-max-height-mobile: 300;
938
+ --footer-padding-x-desktop: var(--dimensions-16);
939
+ --footer-padding-x-tablet: var(--dimensions-16);
940
+ --footer-padding-x-mobile: var(--dimensions-10);
941
+ --footer-padding-y-desktop: var(--dimensions-16);
942
+ --footer-padding-y-tablet: var(--dimensions-16);
943
+ --footer-padding-y-mobile: var(--dimensions-10);
944
+ --footer-col-padding-x-desktop: 12px;
945
+ --footer-col-padding-x-rem-desktop: 0.75rem;
946
+ --footer-col-padding-x-tablet: 12px;
947
+ --footer-col-padding-x-rem-tablet: 0.75rem;
948
+ --footer-col-padding-x-mobile: 12px;
949
+ --footer-col-padding-x-rem-mobile: 0.75rem;
950
+ --footer-item-vertical-spacing-desktop: var(--dimensions-05);
951
+ --footer-item-vertical-spacing-tablet: var(--dimensions-05);
952
+ --footer-item-vertical-spacing-mobile: var(--dimensions-05);
953
+ --footer-bottom-padding-x-desktop: var(--dimensions-16);
954
+ --footer-bottom-padding-x-tablet: var(--dimensions-16);
955
+ --footer-bottom-padding-x-mobile: var(--dimensions-10);
956
+ --footer-bottom-padding-y-desktop: var(--dimensions-05);
957
+ --footer-bottom-padding-y-tablet: var(--dimensions-05);
958
+ --footer-bottom-padding-y-mobile: var(--dimensions-05);
959
+ --button-group-icon-container-height-desktop: var(--dimensions-13);
960
+ --button-group-icon-container-height-tablet: var(--dimensions-13);
961
+ --button-group-icon-container-height-mobile: var(--dimensions-13);
962
+ --toast-margin-left-desktop: var(--dimensions-00);
963
+ --toast-margin-left-tablet: var(--dimensions-00);
964
+ --toast-margin-left-mobile: var(--dimensions-05);
965
+ --form-select-area-radius-desktop: var(--radius-02-default);
966
+ --form-select-area-radius-tablet: var(--radius-02-default);
967
+ --form-select-area-radius-mobile: var(--radius-02-default);
968
+ --list-padding-left-level-1-desktop: var(--dimensions-10);
969
+ --list-padding-left-level-1-tablet: var(--dimensions-10);
970
+ --list-padding-left-level-1-mobile: var(--dimensions-05);
971
+ --button-text-size-sm-desktop: var(--body-small-regular-size-desktop);
972
+ --button-text-size-sm-tablet: var(--body-small-regular-size-tablet);
973
+ --button-text-size-sm-mobile: var(--body-regular-size-mobile);
974
+ --button-text-size-default-desktop: var(--body-regular-size-desktop);
975
+ --button-text-size-default-tablet: var(--body-regular-size-tablet);
976
+ --button-text-size-default-mobile: var(--body-regular-size-mobile);
977
+ --button-xl-padding-x-desktop: var(--dimensions-11);
978
+ --button-xl-padding-x-tablet: var(--dimensions-11);
979
+ --button-xl-padding-x-mobile: var(--dimensions-11);
980
+ --button-xl-padding-y-desktop: var(--dimensions-07);
981
+ --button-xl-padding-y-tablet: var(--dimensions-07);
982
+ --button-xl-padding-y-mobile: var(--dimensions-07);
983
+ --button-xl-inner-spacing-desktop: var(--dimensions-04);
984
+ --button-xl-inner-spacing-tablet: var(--dimensions-04);
985
+ --button-xl-inner-spacing-mobile: var(--dimensions-04);
986
+ --button-xl-icon-padding-desktop: var(--dimensions-05);
987
+ --button-xl-icon-padding-tablet: var(--dimensions-05);
988
+ --button-xl-icon-padding-mobile: var(--dimensions-05);
989
+ --button-xl-icon-size-desktop: var(--dimensions-18);
990
+ --button-xl-icon-size-tablet: var(--dimensions-18);
991
+ --button-xl-icon-size-mobile: var(--dimensions-18);
992
+ --form-checkbox-radio-indicator-container-height-desktop: var(--dimensions-13);
993
+ --form-checkbox-radio-indicator-container-height-tablet: var(--dimensions-13);
994
+ --form-checkbox-radio-indicator-container-height-mobile: var(--dimensions-13);
995
+ --header-padding-y-sm-desktop: var(--dimensions-07);
996
+ --header-padding-y-sm-tablet: var(--dimensions-07);
997
+ --header-padding-y-sm-mobile: 0px;
998
+ --header-padding-y-sm-rem-mobile: 0rem;
999
+ --pagination-button-size-desktop: var(--button-xs-icon-size-desktop);
1000
+ --pagination-button-size-tablet: var(--button-xs-icon-size-tablet);
1001
+ --pagination-button-size-mobile: var(--dimensions-14);
1002
+ --filter-sm-inner-spacing-desktop: var(--dimensions-02);
1003
+ --filter-sm-inner-spacing-tablet: var(--dimensions-02);
1004
+ --filter-sm-inner-spacing-mobile: var(--dimensions-02);
1005
+ --filter-default-inner-spacing-desktop: var(--dimensions-02);
1006
+ --filter-default-inner-spacing-tablet: var(--dimensions-02);
1007
+ --filter-default-inner-spacing-mobile: var(--dimensions-02);
1008
+ --table-of-contents-width-desktop: var(--containers-04);
1009
+ --table-of-contents-width-tablet: var(--containers-04);
1010
+ --table-of-contents-width-mobile: var(--containers-04);
1011
+ --content-label-label-sm-height-desktop: var(--dimensions-13);
1012
+ --content-label-label-sm-height-tablet: var(--dimensions-13);
1013
+ --content-label-label-sm-height-mobile: var(--dimensions-13);
1014
+ --link-link-sm-height-desktop: var(--body-regular-line-height-desktop);
1015
+ --link-link-sm-height-tablet: var(--body-regular-line-height-tablet);
1016
+ --link-link-sm-height-mobile: var(--body-regular-line-height-mobile);
1017
+ --form-toggl-default-margin-y-desktop: var(--dimensions-02);
1018
+ --form-toggl-default-margin-y-tablet: var(--dimensions-02);
1019
+ --form-toggl-default-margin-y-mobile: var(--dimensions-00);
1020
+ --form-number-min-width-desktop: 163px;
1021
+ --form-number-min-width-rem-desktop: 10.1875rem;
1022
+ --form-number-min-width-tablet: 163px;
1023
+ --form-number-min-width-rem-tablet: 10.1875rem;
1024
+ --form-number-min-width-mobile: 168px;
1025
+ --form-number-min-width-rem-mobile: 10.5rem;
1026
+ --table-of-contents-padding-left-level-1-desktop: var(--dimensions-10);
1027
+ --table-of-contents-padding-left-level-1-tablet: var(--dimensions-10);
1028
+ --table-of-contents-padding-left-level-1-mobile: var(--dimensions-10);
1029
+ --table-of-contents-padding-left-level-2-desktop: var(--dimensions-14);
1030
+ --table-of-contents-padding-left-level-2-tablet: var(--dimensions-14);
1031
+ --table-of-contents-padding-left-level-2-mobile: var(--dimensions-14);
1032
+ --form-field-padding-y-sm-has-button-desktop: var(--dimensions-03);
1033
+ --form-field-padding-y-sm-has-button-tablet: var(--dimensions-03);
1034
+ --form-field-padding-y-sm-has-button-mobile: var(--dimensions-04);
1035
+ --form-field-padding-y-md-has-button-desktop: var(--dimensions-05);
1036
+ --form-field-padding-y-md-has-button-tablet: var(--dimensions-05);
1037
+ --form-field-padding-y-md-has-button-mobile: var(--dimensions-04);
1038
+ --icon-04-desktop: var(--dimensions-12);
1039
+ --icon-04-tablet: var(--dimensions-12);
1040
+ --icon-04-mobile: var(--dimensions-12);
1041
+ --layout-container-max-width-xxl-desktop: 1440px;
1042
+ --layout-container-max-width-xxl-rem-desktop: 90rem;
1043
+ --layout-container-max-width-xxl-tablet: 1440px;
1044
+ --layout-container-max-width-xxl-rem-tablet: 90rem;
1045
+ --layout-container-max-width-xxl-mobile: 1440px;
1046
+ --layout-container-max-width-xxl-rem-mobile: 90rem;
1047
+ --layout-container-max-width-xl-desktop: 1320px;
1048
+ --layout-container-max-width-xl-rem-desktop: 82.5rem;
1049
+ --layout-container-max-width-xl-tablet: 1320px;
1050
+ --layout-container-max-width-xl-rem-tablet: 82.5rem;
1051
+ --layout-container-max-width-xl-mobile: 1320px;
1052
+ --layout-container-max-width-xl-rem-mobile: 82.5rem;
1053
+ --layout-container-max-width-lg-desktop: 1140px;
1054
+ --layout-container-max-width-lg-rem-desktop: 71.25rem;
1055
+ --layout-container-max-width-lg-tablet: 1140px;
1056
+ --layout-container-max-width-lg-rem-tablet: 71.25rem;
1057
+ --layout-container-max-width-lg-mobile: 1140px;
1058
+ --layout-container-max-width-lg-rem-mobile: 71.25rem;
1059
+ --layout-container-max-width-md-desktop: 960px;
1060
+ --layout-container-max-width-md-rem-desktop: 60rem;
1061
+ --layout-container-max-width-md-tablet: 960px;
1062
+ --layout-container-max-width-md-rem-tablet: 60rem;
1063
+ --layout-container-max-width-md-mobile: 960px;
1064
+ --layout-container-max-width-md-rem-mobile: 60rem;
1065
+ --layout-container-max-width-sm-desktop: 720px;
1066
+ --layout-container-max-width-sm-rem-desktop: 45rem;
1067
+ --layout-container-max-width-sm-tablet: 720px;
1068
+ --layout-container-max-width-sm-rem-tablet: 45rem;
1069
+ --layout-container-max-width-sm-mobile: 720px;
1070
+ --layout-container-max-width-sm-rem-mobile: 45rem;
1071
+ --layout-container-max-width-xs-desktop: 540px;
1072
+ --layout-container-max-width-xs-rem-desktop: 33.75rem;
1073
+ --layout-container-max-width-xs-tablet: 540px;
1074
+ --layout-container-max-width-xs-rem-tablet: 33.75rem;
1075
+ --layout-container-max-width-xs-mobile: 540px;
1076
+ --layout-container-max-width-xs-rem-mobile: 33.75rem;
1077
+ --layout-grid-column-width-desktop: 464px;
1078
+ --layout-grid-column-width-rem-desktop: 29rem;
1079
+ --layout-grid-column-width-tablet: 224px;
1080
+ --layout-grid-column-width-rem-tablet: 14rem;
1081
+ --layout-grid-column-width-mobile: 0px;
1082
+ --layout-grid-column-width-rem-mobile: 0rem;
1083
+ --layout-grid-column-gutter-desktop: var(--dimensions-13);
1084
+ --layout-grid-column-gutter-tablet: var(--dimensions-13);
1085
+ --layout-grid-column-gutter-mobile: var(--dimensions-13);
1086
+ --layout-grid-column-offset-desktop: 40px;
1087
+ --layout-grid-column-offset-rem-desktop: 2.5rem;
1088
+ --layout-grid-column-offset-tablet: 24px;
1089
+ --layout-grid-column-offset-rem-tablet: 1.5rem;
1090
+ --layout-grid-column-offset-mobile: 8px;
1091
+ --layout-grid-column-offset-rem-mobile: 0.5rem;
1092
+ --layout-common-device-width-desktop: 1920px;
1093
+ --layout-common-device-width-rem-desktop: 120rem;
1094
+ --layout-common-device-width-tablet: 768px;
1095
+ --layout-common-device-width-rem-tablet: 48rem;
1096
+ --layout-common-device-width-mobile: 360px;
1097
+ --layout-common-device-width-rem-mobile: 22.5rem;
1098
+ --layout-common-device-height-desktop: 1080px;
1099
+ --layout-common-device-height-rem-desktop: 67.5rem;
1100
+ --layout-common-device-height-tablet: 1024px;
1101
+ --layout-common-device-height-rem-tablet: 64rem;
1102
+ --layout-common-device-height-mobile: 812px;
1103
+ --layout-common-device-height-rem-mobile: 50.75rem;
1104
+ --form-checkbox-radio-size-large-desktop: var(--dimensions-13);
1105
+ --form-checkbox-radio-size-large-tablet: var(--dimensions-13);
1106
+ --form-checkbox-radio-size-large-mobile: var(--dimensions-13);
1107
+ --stepper-item-vertical-compact-min-height-desktop: 32px;
1108
+ --stepper-item-vertical-compact-min-height-rem-desktop: 2rem;
1109
+ --stepper-item-vertical-compact-min-height-tablet: 32px;
1110
+ --stepper-item-vertical-compact-min-height-rem-tablet: 2rem;
1111
+ --stepper-item-vertical-compact-min-height-mobile: 40px;
1112
+ --stepper-item-vertical-compact-min-height-rem-mobile: 2.5rem;
1113
+ --stepper-item-vertical-lg-min-height-desktop: 40px;
1114
+ --stepper-item-vertical-lg-min-height-rem-desktop: 2.5rem;
1115
+ --stepper-item-vertical-lg-min-height-tablet: 40px;
1116
+ --stepper-item-vertical-lg-min-height-rem-tablet: 2.5rem;
1117
+ --stepper-item-vertical-lg-min-height-mobile: 44px;
1118
+ --stepper-item-vertical-lg-min-height-rem-mobile: 2.75rem;
1119
+ --stepper-item-vertical-lg-inner-spacing-desktop: var(--dimensions-05);
1120
+ --stepper-item-vertical-lg-inner-spacing-tablet: var(--dimensions-05);
1121
+ --stepper-item-vertical-lg-inner-spacing-mobile: var(--dimensions-05);
1122
+ --stepper-item-vertical-step-size-lg-desktop: 24px;
1123
+ --stepper-item-vertical-step-size-lg-rem-desktop: 1.5rem;
1124
+ --stepper-item-vertical-step-size-lg-tablet: 24px;
1125
+ --stepper-item-vertical-step-size-lg-rem-tablet: 1.5rem;
1126
+ --stepper-item-vertical-step-size-lg-mobile: 24px;
1127
+ --stepper-item-vertical-step-size-lg-rem-mobile: 1.5rem;
1128
+ --stepper-item-vertical-step-size-sm-desktop: var(--separator-dotted-dot-md-desktop);
1129
+ --stepper-item-vertical-step-size-sm-tablet: var(--separator-dotted-dot-md-tablet);
1130
+ --stepper-item-vertical-step-size-sm-mobile: var(--separator-dotted-dot-md-mobile);
1131
+ --stepper-item-vertical-compact-sub-item-indicator-width-desktop: var(--dimensions-10);
1132
+ --stepper-item-vertical-compact-sub-item-indicator-width-tablet: var(--dimensions-10);
1133
+ --stepper-item-vertical-compact-sub-item-indicator-width-mobile: var(--dimensions-10);
1134
+ --stepper-item-vertical-lg-sub-item-indicator-width-desktop: var(--dimensions-13);
1135
+ --stepper-item-vertical-lg-sub-item-indicator-width-tablet: var(--dimensions-13);
1136
+ --stepper-item-vertical-lg-sub-item-indicator-width-mobile: var(--dimensions-13);
1137
+ --stepper-item-vertical-sub-line-top-desktop: 9.5px;
1138
+ --stepper-item-vertical-sub-line-top-rem-desktop: 0.5938rem;
1139
+ --stepper-item-vertical-sub-line-top-tablet: 9.5px;
1140
+ --stepper-item-vertical-sub-line-top-rem-tablet: 0.5938rem;
1141
+ --stepper-item-vertical-sub-line-top-mobile: 9.5px;
1142
+ --stepper-item-vertical-sub-line-top-rem-mobile: 0.5938rem;
1143
+ --stepper-item-vertical-padding-y-sm-desktop: 2px;
1144
+ --stepper-item-vertical-padding-y-sm-rem-desktop: 0.125rem;
1145
+ --stepper-item-vertical-padding-y-sm-tablet: 2px;
1146
+ --stepper-item-vertical-padding-y-sm-rem-tablet: 0.125rem;
1147
+ --stepper-item-vertical-padding-y-sm-mobile: 2px;
1148
+ --stepper-item-vertical-padding-y-sm-rem-mobile: 0.125rem;
1149
+ --stepper-item-vertical-lg-min-height-first-item-desktop: 32px;
1150
+ --stepper-item-vertical-lg-min-height-first-item-rem-desktop: 2rem;
1151
+ --stepper-item-vertical-lg-min-height-first-item-tablet: 32px;
1152
+ --stepper-item-vertical-lg-min-height-first-item-rem-tablet: 2rem;
1153
+ --stepper-item-vertical-lg-min-height-first-item-mobile: 32px;
1154
+ --stepper-item-vertical-lg-min-height-first-item-rem-mobile: 2rem;
1155
+ --stepper-item-vertical-compact-padding-top-desktop: 3px;
1156
+ --stepper-item-vertical-compact-padding-top-rem-desktop: 0.1875rem;
1157
+ --stepper-item-vertical-compact-padding-top-tablet: 3px;
1158
+ --stepper-item-vertical-compact-padding-top-rem-tablet: 0.1875rem;
1159
+ --stepper-item-vertical-compact-padding-top-mobile: 3px;
1160
+ --stepper-item-vertical-compact-padding-top-rem-mobile: 0.1875rem;
1161
+ --stepper-item-vertical-compact-min-height-first-item-desktop: 29px;
1162
+ --stepper-item-vertical-compact-min-height-first-item-rem-desktop: 1.8125rem;
1163
+ --stepper-item-vertical-compact-min-height-first-item-tablet: 29px;
1164
+ --stepper-item-vertical-compact-min-height-first-item-rem-tablet: 1.8125rem;
1165
+ --stepper-item-vertical-compact-min-height-first-item-mobile: 32px;
1166
+ --stepper-item-vertical-compact-min-height-first-item-rem-mobile: 2rem;
1167
+ --stepper-item-horizontal-padding-y-desktop: var(--dimensions-05);
1168
+ --stepper-item-horizontal-padding-y-tablet: var(--dimensions-05);
1169
+ --stepper-item-horizontal-padding-y-mobile: var(--dimensions-05);
1170
+ --stepper-item-horizontal-padding-x-desktop: var(--dimensions-10);
1171
+ --stepper-item-horizontal-padding-x-tablet: var(--dimensions-10);
1172
+ --stepper-item-horizontal-padding-x-mobile: var(--dimensions-10);
1173
+ --stepper-item-horizontal-inner-spacing-desktop: var(--dimensions-05);
1174
+ --stepper-item-horizontal-inner-spacing-tablet: var(--dimensions-05);
1175
+ --stepper-item-horizontal-inner-spacing-mobile: var(--dimensions-05);
1176
+ --stepper-item-horizontal-min-height-desktop: var(--dimensions-16);
1177
+ --stepper-item-horizontal-min-height-tablet: var(--dimensions-16);
1178
+ --stepper-item-horizontal-min-height-mobile: var(--dimensions-17);
1179
+ --card-padding-xxs-desktop: var(--dimensions-03);
1180
+ --card-padding-xxs-tablet: var(--dimensions-03);
1181
+ --card-padding-xxs-mobile: var(--dimensions-03);
1182
+ --file-dropzone-padding-x-desktop: var(--dimensions-13);
1183
+ --file-dropzone-padding-x-tablet: var(--dimensions-13);
1184
+ --file-dropzone-padding-x-mobile: var(--dimensions-13);
1185
+ --file-dropzone-padding-y-desktop: var(--dimensions-13);
1186
+ --file-dropzone-padding-y-tablet: var(--dimensions-13);
1187
+ --file-dropzone-padding-y-mobile: var(--dimensions-13);
1188
+ --dropdown-item-padding-y-desktop: var(--dimensions-05);
1189
+ --dropdown-item-padding-y-tablet: var(--dimensions-05);
1190
+ --dropdown-item-padding-y-mobile: var(--dimensions-07);
1191
+ --dropdown-item-padding-x-desktop: var(--dimensions-07);
1192
+ --dropdown-item-padding-x-tablet: var(--dimensions-07);
1193
+ --dropdown-item-padding-x-mobile: var(--dimensions-07);
1194
+ --dropdown-item-radius-desktop: var(--radius-02-default);
1195
+ --dropdown-item-radius-tablet: var(--radius-02-default);
1196
+ --dropdown-item-radius-mobile: var(--radius-02-default);
1197
+ --dropdown-group-label-padding-x-desktop: var(--dropdown-item-padding-x-desktop);
1198
+ --dropdown-group-label-padding-x-tablet: var(--dropdown-item-padding-x-tablet);
1199
+ --dropdown-group-label-padding-x-mobile: var(--dropdown-item-padding-x-mobile);
1200
+ --dropdown-group-label-padding-y-desktop: var(--dropdown-item-padding-y-desktop);
1201
+ --dropdown-group-label-padding-y-tablet: var(--dropdown-item-padding-y-tablet);
1202
+ --dropdown-group-label-padding-y-mobile: var(--dropdown-item-padding-y-mobile);
1203
+ --dropdown-item-inner-spacing-desktop: var(--dimensions-05);
1204
+ --dropdown-item-inner-spacing-tablet: var(--dimensions-05);
1205
+ --dropdown-item-inner-spacing-mobile: var(--dimensions-05);
1206
+ --dropdown-body-padding-x-desktop: var(--dimensions-07);
1207
+ --dropdown-body-padding-x-tablet: var(--dimensions-07);
1208
+ --dropdown-body-padding-x-mobile: var(--dimensions-07);
1209
+ --dropdown-body-padding-y-desktop: var(--dimensions-05);
1210
+ --dropdown-body-padding-y-tablet: var(--dimensions-05);
1211
+ --dropdown-body-padding-y-mobile: var(--dimensions-07);
1212
+ --button-sm-height-desktop: var(--dimensions-14);
1213
+ --button-sm-height-tablet: var(--dimensions-14);
1214
+ --button-sm-height-mobile: var(--dimensions-16);
1215
+ --button-md-height-desktop: var(--dimensions-16);
1216
+ --button-md-height-tablet: var(--dimensions-16);
1217
+ --button-md-height-mobile: var(--dimensions-17);
1218
+ --layout-footer-padding-x-desktop: var(--dimensions-16);
1219
+ --layout-footer-padding-x-tablet: var(--dimensions-16);
1220
+ --layout-footer-padding-x-mobile: var(--dimensions-10);
1221
+ --layout-footer-padding-y-desktop: var(--dimensions-16);
1222
+ --layout-footer-padding-y-tablet: var(--dimensions-16);
1223
+ --layout-footer-padding-y-mobile: var(--dimensions-10);
1224
+ --layout-footer-bottom-padding-x-desktop: var(--layout-page-spacing-x-desktop);
1225
+ --layout-footer-bottom-padding-x-tablet: var(--layout-page-spacing-x-tablet);
1226
+ --layout-footer-bottom-padding-x-mobile: var(--layout-page-spacing-x-mobile);
1227
+ --layout-footer-bottom-padding-y-desktop: var(--dimensions-05);
1228
+ --layout-footer-bottom-padding-y-tablet: var(--dimensions-05);
1229
+ --layout-footer-bottom-padding-y-mobile: var(--dimensions-05);
1230
+ --layout-footer-item-vertical-spacing-desktop: var(--dimensions-05);
1231
+ --layout-footer-item-vertical-spacing-tablet: var(--dimensions-05);
1232
+ --layout-footer-item-vertical-spacing-mobile: var(--dimensions-05);
1233
+ --layout-footer-col-padding-x-desktop: var(--dimensions-07);
1234
+ --layout-footer-col-padding-x-tablet: var(--dimensions-07);
1235
+ --layout-footer-col-padding-x-mobile: 0rem;
1236
+ }