@dmsi/wedgekit-react 0.0.230 → 0.0.232

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 (57) hide show
  1. package/dist/{chunk-2RUQFWER.js → chunk-2VRZB2A4.js} +1 -1
  2. package/dist/{chunk-A76MF7ZO.js → chunk-3M23BFB4.js} +2 -2
  3. package/dist/{chunk-7W4I2NK3.js → chunk-5JVMULVC.js} +12 -2
  4. package/dist/{chunk-2WRRRPEB.js → chunk-7BBXPM5C.js} +1 -1
  5. package/dist/{chunk-XOUEHNCC.js → chunk-Q7ETEWBW.js} +1 -1
  6. package/dist/chunk-SQJ7MWY7.js +493 -0
  7. package/dist/chunk-VZVPD3XK.js +1182 -0
  8. package/dist/components/CalendarRange.cjs +4066 -224
  9. package/dist/components/CalendarRange.css +4831 -0
  10. package/dist/components/CalendarRange.js +23 -1
  11. package/dist/components/DataGridCell.cjs +12 -2
  12. package/dist/components/DataGridCell.js +3 -3
  13. package/dist/components/DateInput.cjs +3682 -329
  14. package/dist/components/DateInput.css +4831 -0
  15. package/dist/components/DateInput.js +23 -5
  16. package/dist/components/DateRangeInput.cjs +3682 -329
  17. package/dist/components/DateRangeInput.css +4831 -0
  18. package/dist/components/DateRangeInput.js +23 -5
  19. package/dist/components/FilterGroup.cjs +12 -2
  20. package/dist/components/FilterGroup.js +7 -7
  21. package/dist/components/Input.cjs +12 -2
  22. package/dist/components/Input.js +1 -1
  23. package/dist/components/MobileDataGrid.js +3 -3
  24. package/dist/components/Modal.js +4 -4
  25. package/dist/components/ModalButtons.js +2 -2
  26. package/dist/components/ModalHeader.js +2 -2
  27. package/dist/components/NavigationTab.js +2 -2
  28. package/dist/components/NavigationTabs.js +2 -2
  29. package/dist/components/Notification.js +3 -3
  30. package/dist/components/OptionPill.js +2 -2
  31. package/dist/components/PDFViewer.js +6 -6
  32. package/dist/components/Password.cjs +12 -2
  33. package/dist/components/Password.js +1 -1
  34. package/dist/components/Search.cjs +12 -2
  35. package/dist/components/Search.js +2 -2
  36. package/dist/components/Select.cjs +12 -2
  37. package/dist/components/Select.js +2 -2
  38. package/dist/components/Stepper.cjs +12 -2
  39. package/dist/components/Stepper.js +4 -4
  40. package/dist/components/Time.cjs +12 -2
  41. package/dist/components/Time.js +1 -1
  42. package/dist/components/Toast.js +3 -3
  43. package/dist/components/Upload.js +3 -3
  44. package/dist/components/index.cjs +12 -2
  45. package/dist/components/index.css +3 -0
  46. package/dist/components/index.js +12 -1142
  47. package/dist/index.css +3 -0
  48. package/package.json +1 -1
  49. package/src/components/CalendarRange.tsx +316 -165
  50. package/src/components/DateInput.tsx +1 -0
  51. package/src/components/DateRangeInput.tsx +1 -0
  52. package/src/components/Input.tsx +19 -5
  53. package/dist/chunk-SE5DM2IJ.js +0 -350
  54. package/dist/{chunk-ED7FXZRX.js → chunk-BW2MWMVM.js} +3 -3
  55. package/dist/{chunk-FYW64H7N.js → chunk-JFPRYMID.js} +3 -3
  56. package/dist/{chunk-A5ROZWIH.js → chunk-R4H6D4SZ.js} +3 -3
  57. package/dist/{chunk-47KTDBGA.js → chunk-T7UCZWWK.js} +3 -3
@@ -0,0 +1,4831 @@
1
+ /* src/fonts.css */
2
+ @font-face {
3
+ font-family: "Open Sans";
4
+ src: url("../open-sans-55T6A4JE.woff2") format("woff2");
5
+ font-weight: 100 900;
6
+ font-style: normal;
7
+ }
8
+ @font-face {
9
+ font-family: "Icons";
10
+ src: url("../icons-light[FILL]-PPZXOLWS.woff2") format("woff2");
11
+ font-weight: 300;
12
+ font-style: normal;
13
+ font-display: block;
14
+ }
15
+ @font-face {
16
+ font-family: "Icons";
17
+ src: url("../icons-normal[FILL]-PPZXOLWS.woff2") format("woff2");
18
+ font-weight: 400;
19
+ font-style: normal;
20
+ font-display: block;
21
+ }
22
+
23
+ /* src/index.css */
24
+ @layer properties;
25
+ @layer theme, base, components, utilities;
26
+ @layer theme {
27
+ :root,
28
+ :host {
29
+ --font-sans: var(--font-open-sans);
30
+ --font-mono:
31
+ ui-monospace,
32
+ SFMono-Regular,
33
+ Menlo,
34
+ Monaco,
35
+ Consolas,
36
+ "Liberation Mono",
37
+ "Courier New",
38
+ monospace;
39
+ --spacing: 0.25rem;
40
+ --breakpoint-sm: 320px;
41
+ --breakpoint-md: 768px;
42
+ --breakpoint-lg: 1024px;
43
+ --breakpoint-xl: 1280px;
44
+ --breakpoint-2xl: 1536px;
45
+ --container-xl: 36rem;
46
+ --font-weight-light: 300;
47
+ --font-weight-normal: 400;
48
+ --font-weight-medium: 500;
49
+ --font-weight-semibold: 600;
50
+ --font-weight-bold: 700;
51
+ --radius-xs: 0.125rem;
52
+ --radius-sm: 0.25rem;
53
+ --radius-md: 0.375rem;
54
+ --radius-xl: 0.75rem;
55
+ --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
56
+ --animate-spin: spin 1s linear infinite;
57
+ --default-transition-duration: 150ms;
58
+ --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
59
+ --default-font-family: var(--font-sans);
60
+ --default-mono-font-family: var(--font-mono);
61
+ --font-open-sans: "Open Sans", sans-serif;
62
+ --color-white: #ffffff;
63
+ --color-transparent: transparent;
64
+ --radius-px: 1px;
65
+ --color-brand-100: var(--color-brand-100-user-selected, #fcece6);
66
+ --color-brand-200: var(--color-brand-200-user-selected, #f0a98c);
67
+ --color-brand-300: var(--color-brand-300-user-selected, #e56937);
68
+ --color-brand-400: var(--color-brand-400-user-selected, #df4405);
69
+ --color-brand-500: var(--color-brand-500-user-selected, #9e3004);
70
+ --color-action-000: var(--color-action-000-user-selected, #ffffff);
71
+ --color-action-100: var(--color-action-100-user-selected, #e7f2f9);
72
+ --color-action-200: var(--color-action-200-user-selected, #d0e5f4);
73
+ --color-action-300: var(--color-action-300-user-selected, #459ad4);
74
+ --color-action-400: var(--color-action-400-user-selected, #0077c8);
75
+ --color-action-500: var(--color-action-500-user-selected, #00365a);
76
+ --color-link-000: var( --color-link-000-user-selected, var(--color-action-000) );
77
+ --color-link-100: var( --color-link-100-user-selected, var(--color-action-100) );
78
+ --color-link-200: var( --color-link-200-user-selected, var(--color-action-200) );
79
+ --color-link-300: var( --color-link-300-user-selected, var(--color-action-300) );
80
+ --color-link-400: var( --color-link-400-user-selected, var(--color-action-400) );
81
+ --color-link-500: var( --color-link-500-user-selected, var(--color-action-500) );
82
+ --color-neutral-000: #ffffff;
83
+ --color-neutral-100: #f7f7f7;
84
+ --color-neutral-200: #ebebeb;
85
+ --color-neutral-300: #c1c1c1;
86
+ --color-neutral-400: #6b6d6d;
87
+ --color-neutral-450: #3a3a3a;
88
+ --color-neutral-500: #1d1e1e;
89
+ --color-neutral-600: #000000;
90
+ --color-success-100: #eefbf6;
91
+ --color-success-200: #d7f7e9;
92
+ --color-success-300: #61e1aa;
93
+ --color-success-400: #27d68b;
94
+ --color-success-500: #126240;
95
+ --color-warning-100: #fcefd4;
96
+ --color-warning-200: #f9dfa9;
97
+ --color-warning-300: #f4c053;
98
+ --color-warning-400: #f0a913;
99
+ --color-warning-500: #91670c;
100
+ --color-critical-100: #fbedea;
101
+ --color-critical-200: #f0b7ad;
102
+ --color-critical-300: #dd5e48;
103
+ --color-critical-400: #cc391f;
104
+ --color-critical-500: #892615;
105
+ --color-teal-400: #40c1ac;
106
+ --color-purple-400: #8d267a;
107
+ --color-orange-400: #cc391f;
108
+ --color-chart-0: var(--color-action-400);
109
+ --color-chart-1: var(--color-brand-400);
110
+ --color-chart-2: var(--color-teal-400);
111
+ --color-chart-3: var(--color-warning-400);
112
+ --color-chart-4: var(--color-neutral-400);
113
+ --color-chart-5: var(--color-purple-400);
114
+ --color-chart-6: var(--color-orange-400);
115
+ --radius-base: 4px;
116
+ --shadow-2: 0px 0px 2px 0px rgba(0, 0, 0, 0.12), 0px 2px 2px 0px rgba(0, 0, 0, 0.12);
117
+ --shadow-4: 0px 0px 4px 0px rgba(0, 0, 0, 0.12), 0px 4px 4px 0px rgba(0, 0, 0, 0.12);
118
+ --shadow-16: 0px 0px 16px 0px rgba(0, 0, 0, 0.12), 0px 16px 16px 0px rgba(0, 0, 0, 0.12);
119
+ --shadow-nav-tab: 0px -4px 4px -4px rgba(0, 0, 0, 0.32) inset;
120
+ --color-decoration-underline: transparent;
121
+ --text-display-1-desktop: 32px;
122
+ --text-display-1-mobile: 32px;
123
+ --text-display-1-desktop-compact: 32px;
124
+ --leading-display-1-desktop: 1.125;
125
+ --leading-display-1-mobile: 1.125;
126
+ --text-display-2-desktop: 28px;
127
+ --text-display-2-mobile: 28px;
128
+ --text-display-2-desktop-compact: 28px;
129
+ --leading-display-2-desktop: 1.143;
130
+ --leading-display-2-mobile: 1.143;
131
+ --text-heading-1-desktop: 24px;
132
+ --text-heading-1-mobile: 24px;
133
+ --text-heading-1-desktop-compact: 24px;
134
+ --leading-heading-1-desktop: 1.167;
135
+ --leading-heading-1-mobile: 1.167;
136
+ --text-heading-2-desktop: 20px;
137
+ --text-heading-2-mobile: 20px;
138
+ --text-heading-2-desktop-compact: 20px;
139
+ --leading-heading-2-desktop: 1.2;
140
+ --leading-heading-2-mobile: 1.2;
141
+ --text-heading-3-desktop: 16px;
142
+ --text-heading-3-mobile: 18px;
143
+ --text-heading-3-desktop-compact: 16px;
144
+ --leading-heading-3-desktop: 1.25;
145
+ --leading-heading-3-mobile: 1.25;
146
+ --text-subheader-desktop: 14px;
147
+ --text-subheader-mobile: 16px;
148
+ --text-subheader-desktop-compact: 14px;
149
+ --leading-subheader-desktop: 1.286;
150
+ --leading-subheader-mobile: 1.286;
151
+ --text-link-desktop: 14px;
152
+ --text-link-mobile: 16px;
153
+ --text-link-desktop-compact: 14px;
154
+ --leading-link-desktop: 1.286;
155
+ --leading-link-mobile: 1.286;
156
+ --text-label-desktop: 14px;
157
+ --text-label-mobile: 16px;
158
+ --text-label-desktop-compact: 14px;
159
+ --leading-label-desktop: 1;
160
+ --leading-label-mobile: 1;
161
+ --text-paragraph-desktop: 14px;
162
+ --text-paragraph-mobile: 16px;
163
+ --text-paragraph-desktop-compact: 14px;
164
+ --leading-paragraph-desktop: 1.286;
165
+ --leading-paragraph-mobile: 1.286;
166
+ --text-caption-desktop: 12px;
167
+ --text-caption-mobile: 16px;
168
+ --text-caption-desktop-compact: 12px;
169
+ --leading-caption-desktop: 1.333;
170
+ --leading-caption-mobile: 1.333;
171
+ --spacing-desktop-container-gap: 16px;
172
+ --spacing-mobile-container-gap: 16px;
173
+ --spacing-desktop-compact-container-gap: 16px;
174
+ --spacing-desktop-container-padding: 24px;
175
+ --spacing-mobile-container-padding: 8px;
176
+ --spacing-desktop-compact-container-padding: 16px;
177
+ --spacing-desktop-layout-gap: 16px;
178
+ --spacing-mobile-layout-gap: 16px;
179
+ --spacing-desktop-compact-layout-gap: 12px;
180
+ --spacing-desktop-layout-group-gap: 8px;
181
+ --spacing-mobile-layout-group-gap: 8px;
182
+ --spacing-desktop-compact-layout-group-gap: 8px;
183
+ --spacing-desktop-layout-padding: 16px;
184
+ --spacing-mobile-layout-padding: 16px;
185
+ --spacing-desktop-compact-layout-padding: 12px;
186
+ --spacing-desktop-component-gap: 4px;
187
+ --spacing-mobile-component-gap: 4px;
188
+ --spacing-desktop-compact-component-gap: 2px;
189
+ --spacing-desktop-component-padding: 8px;
190
+ --spacing-mobile-component-padding: 12px;
191
+ --spacing-desktop-compact-component-padding: 4px;
192
+ --color-text-primary-normal: var(--color-neutral-500);
193
+ --color-text-primary-active: var(--color-neutral-400);
194
+ --color-text-primary-disabled: var(--color-neutral-300);
195
+ --color-text-primary-error: var(--color-critical-400);
196
+ --color-text-secondary-normal: var(--color-neutral-400);
197
+ --color-text-secondary-disabled: var(--color-neutral-300);
198
+ --color-text-secondary-error: var(--color-critical-400);
199
+ --color-text-success-normal: var(--color-success-500);
200
+ --color-text-success-disabled: var(--color-neutral-400);
201
+ --color-text-success-error: var(--color-critical-400);
202
+ --color-text-warning-normal: var(--color-warning-500);
203
+ --color-text-warning-disabled: var(--color-neutral-400);
204
+ --color-text-warning-error: var(--color-critical-400);
205
+ --color-text-brand-primary-normal: var(--color-neutral-000);
206
+ --color-text-link-normal: var(--color-link-400);
207
+ --color-text-link-hover: var(--color-link-500);
208
+ --color-text-link-active: var(--color-link-300);
209
+ --color-text-link-disabled: var(--color-neutral-400);
210
+ --color-border-primary-normal: var(--color-neutral-300);
211
+ --color-border-primary-focus: var(--color-action-400);
212
+ --color-border-primary-error: var(--color-critical-400);
213
+ --color-icon-primary-normal: var(--color-neutral-400);
214
+ --color-icon-primary-disabled: var(--color-neutral-300);
215
+ --color-icon-success-normal: var(--color-success-400);
216
+ --color-icon-success-disabled: var(--color-neutral-400);
217
+ --color-icon-warning-normal: var(--color-warning-400);
218
+ --color-icon-warning-disabled: var(--color-neutral-400);
219
+ --color-icon-critical-normal: var(--color-critical-400);
220
+ --color-icon-critical-disabled: var(--color-neutral-400);
221
+ --color-background-primary-normal: var(--color-neutral-000);
222
+ --color-background-grouped-primary-normal: var(--color-neutral-000);
223
+ --color-background-secondary-normal: var(--color-neutral-300);
224
+ --color-background-grouped-secondary-normal: var(--color-neutral-100);
225
+ --color-background-success-normal: var(--color-success-400);
226
+ --color-background-warning-normal: var(--color-warning-400);
227
+ --color-background-critical-normal: var(--color-critical-400);
228
+ --color-text-action-normal: var(--color-action-400);
229
+ --color-text-action-hover: var(--color-action-500);
230
+ --color-text-action-active: var(--color-action-300);
231
+ --color-text-action-disabled: var(--color-neutral-400);
232
+ --color-text-action-primary-normal: var(--color-action-400);
233
+ --color-text-action-primary-hover: var(--color-action-500);
234
+ --color-text-action-primary-active: var(--color-action-300);
235
+ --color-text-action-primary-disabled: var(--color-neutral-400);
236
+ --color-brand-text-action-primary-normal: var( --color-neutral-000 );
237
+ --color-brand-text-action-primary-hover: var( --color-brand-200 );
238
+ --color-brand-text-action-primary-active: var( --color-brand-200 );
239
+ --color-brand-text-on-action-primary-normal: var( --color-neutral-000 );
240
+ --color-brand-text-on-action-primary-hover: var( --color-brand-500 );
241
+ --color-brand-text-on-action-primary-active: var( --color-brand-300 );
242
+ --color-text-on-action-primary-normal: var(--color-neutral-000);
243
+ --color-text-on-action-primary-hover: var(--color-neutral-000);
244
+ --color-text-on-action-primary-active: var(--color-neutral-000);
245
+ --color-text-on-action-primary-disabled: var(--color-neutral-400);
246
+ --color-text-action-critical-normal: var(--color-critical-400);
247
+ --color-text-action-critical-hover: var(--color-critical-500);
248
+ --color-text-action-critical-active: var(--color-critical-300);
249
+ --color-text-action-critical-disabled: var(--color-neutral-400);
250
+ --color-border-action-normal: var(--color-action-400);
251
+ --color-border-action-hover: var(--color-action-500);
252
+ --color-border-action-active: var(--color-action-300);
253
+ --color-border-action-disabled: var(--color-neutral-200);
254
+ --color-text-critical-normal: var(--color-critical-400);
255
+ --color-text-critical-disabled: var(--color-neutral-400);
256
+ --color-text-critical-error: var(--color-critical-400);
257
+ --color-border-action-critical-normal: var(--color-critical-400);
258
+ --color-border-action-critical-hover: var(--color-critical-500);
259
+ --color-border-action-critical-active: var(--color-critical-300);
260
+ --color-border-action-critical-disabled: var(--color-neutral-200);
261
+ --color-background-action-normal: var(--color-action-400);
262
+ --color-background-action-hover: var(--color-action-500);
263
+ --color-background-action-active: var(--color-action-300);
264
+ --color-background-action-disabled: var(--color-neutral-200);
265
+ --color-background-action-critical-normal: var(--color-critical-400);
266
+ --color-background-action-critical-hover: var(--color-critical-500);
267
+ --color-background-action-critical-active: var(--color-critical-300);
268
+ --color-background-action-critical-disabled: var(--color-neutral-200);
269
+ --color-icon-action-primary-normal: var(--color-neutral-500);
270
+ --color-icon-action-primary-hover: var(--color-action-500);
271
+ --color-icon-action-primary-active: var(--color-action-300);
272
+ --color-icon-action-primary-disabled: var(--color-neutral-300);
273
+ --color-icon-action-secondary-normal: var(--color-action-400);
274
+ --color-icon-action-secondary-hover: var(--color-action-500);
275
+ --color-icon-action-secondary-active: var(--color-action-300);
276
+ --color-icon-action-secondary-disabled: var(--color-neutral-400);
277
+ --color-icon-on-action-primary-normal: var(--color-neutral-000);
278
+ --color-icon-on-action-primary-hover: var(--color-neutral-000);
279
+ --color-icon-on-action-primary-active: var(--color-neutral-000);
280
+ --color-icon-on-action-primary-disabled: var(--color-neutral-400);
281
+ --color-icon-on-action-secondary-normal: var(--color-action-400);
282
+ --color-icon-on-action-secondary-hover: var(--color-action-500);
283
+ --color-icon-on-action-secondary-active: var(--color-action-300);
284
+ --color-icon-on-action-secondary-disabled: var(--color-neutral-400);
285
+ --color-icon-action-critical-normal: var(--color-critical-400);
286
+ --color-icon-action-critical-hover: var(--color-critical-500);
287
+ --color-icon-action-critical-active: var(--color-critical-300);
288
+ --color-icon-action-critical-disabled: var(--color-neutral-400);
289
+ --color-icon-action-critical-secondary-normal: var(--color-critical-400);
290
+ --color-icon-action-critical-secondary-hover: var(--color-critical-500);
291
+ --color-icon-action-critical-secondary-active: var(--color-critical-300);
292
+ --color-icon-action-critical-secondary-disabled: var(--color-neutral-400);
293
+ --color-icon-brand-primary-normal: var(--color-brand-400);
294
+ --color-icon-brand-primary-hover: var(--color-brand-500);
295
+ --color-icon-brand-primary-active: var(--color-brand-300);
296
+ --color-icon-brand-primary-disabled: var(--color-neutral-300);
297
+ --color-background-action-primary-normal: var(--color-action-400);
298
+ --color-background-action-primary-hover: var(--color-action-500);
299
+ --color-background-action-primary-active: var(--color-action-300);
300
+ --color-background-action-primary-disabled: var(--color-neutral-200);
301
+ --color-background-action-secondary-normal: var(--color-neutral-000);
302
+ --color-background-action-secondary-hover: var(--color-action-100);
303
+ --color-background-action-secondary-active: var(--color-neutral-000);
304
+ --color-background-action-secondary-disabled: var(--color-neutral-200);
305
+ --color-background-brand-normal: var( --color-brand-400 );
306
+ --color-background-on-action-primary-normal: var( --color-neutral-000 );
307
+ --color-background-on-action-primary-hover: var( --color-neutral-000 );
308
+ --color-background-on-action-primary-active: var( --color-neutral-000 );
309
+ --color-background-on-action-primary-disabled: var( --color-neutral-200 );
310
+ --color-background-on-action-secondary-normal: var( --color-neutral-100 );
311
+ --color-background-on-action-secondary-hover: var( --color-brand-500 );
312
+ --color-background-on-action-secondary-active: var( --color-brand-400 );
313
+ --color-background-on-action-secondary-disabled: var( --color-neutral-200 );
314
+ --color-background-action-critical-primary-normal: var(--color-critical-400);
315
+ --color-background-action-critical-primary-hover: var(--color-critical-500);
316
+ --color-background-action-critical-primary-active: var(--color-critical-300);
317
+ --color-background-action-critical-primary-disabled: var(--color-neutral-200);
318
+ --color-background-action-critical-secondary-normal: var(--color-neutral-000);
319
+ --color-background-action-critical-secondary-hover: var(--color-critical-100);
320
+ --color-background-action-critical-secondary-active: var(--color-neutral-000);
321
+ --color-background-action-critical-secondary-disabled: var( --color-neutral-200 );
322
+ }
323
+ }
324
+ @layer base {
325
+ *,
326
+ ::after,
327
+ ::before,
328
+ ::backdrop,
329
+ ::file-selector-button {
330
+ box-sizing: border-box;
331
+ margin: 0;
332
+ padding: 0;
333
+ border: 0 solid;
334
+ }
335
+ html,
336
+ :host {
337
+ line-height: 1.5;
338
+ -webkit-text-size-adjust: 100%;
339
+ tab-size: 4;
340
+ font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
341
+ font-feature-settings: var(--default-font-feature-settings, normal);
342
+ font-variation-settings: var(--default-font-variation-settings, normal);
343
+ -webkit-tap-highlight-color: transparent;
344
+ }
345
+ hr {
346
+ height: 0;
347
+ color: inherit;
348
+ border-top-width: 1px;
349
+ }
350
+ abbr:where([title]) {
351
+ -webkit-text-decoration: underline dotted;
352
+ text-decoration: underline dotted;
353
+ }
354
+ h1,
355
+ h2,
356
+ h3,
357
+ h4,
358
+ h5,
359
+ h6 {
360
+ font-size: inherit;
361
+ font-weight: inherit;
362
+ }
363
+ a {
364
+ color: inherit;
365
+ -webkit-text-decoration: inherit;
366
+ text-decoration: inherit;
367
+ }
368
+ b,
369
+ strong {
370
+ font-weight: bolder;
371
+ }
372
+ code,
373
+ kbd,
374
+ samp,
375
+ pre {
376
+ font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
377
+ font-feature-settings: var(--default-mono-font-feature-settings, normal);
378
+ font-variation-settings: var(--default-mono-font-variation-settings, normal);
379
+ font-size: 1em;
380
+ }
381
+ small {
382
+ font-size: 80%;
383
+ }
384
+ sub,
385
+ sup {
386
+ font-size: 75%;
387
+ line-height: 0;
388
+ position: relative;
389
+ vertical-align: baseline;
390
+ }
391
+ sub {
392
+ bottom: -0.25em;
393
+ }
394
+ sup {
395
+ top: -0.5em;
396
+ }
397
+ table {
398
+ text-indent: 0;
399
+ border-color: inherit;
400
+ border-collapse: collapse;
401
+ }
402
+ :-moz-focusring {
403
+ outline: auto;
404
+ }
405
+ progress {
406
+ vertical-align: baseline;
407
+ }
408
+ summary {
409
+ display: list-item;
410
+ }
411
+ ol,
412
+ ul,
413
+ menu {
414
+ list-style: none;
415
+ }
416
+ img,
417
+ svg,
418
+ video,
419
+ canvas,
420
+ audio,
421
+ iframe,
422
+ embed,
423
+ object {
424
+ display: block;
425
+ vertical-align: middle;
426
+ }
427
+ img,
428
+ video {
429
+ max-width: 100%;
430
+ height: auto;
431
+ }
432
+ button,
433
+ input,
434
+ select,
435
+ optgroup,
436
+ textarea,
437
+ ::file-selector-button {
438
+ font: inherit;
439
+ font-feature-settings: inherit;
440
+ font-variation-settings: inherit;
441
+ letter-spacing: inherit;
442
+ color: inherit;
443
+ border-radius: 0;
444
+ background-color: transparent;
445
+ opacity: 1;
446
+ }
447
+ :where(select:is([multiple], [size])) optgroup {
448
+ font-weight: bolder;
449
+ }
450
+ :where(select:is([multiple], [size])) optgroup option {
451
+ padding-inline-start: 20px;
452
+ }
453
+ ::file-selector-button {
454
+ margin-inline-end: 4px;
455
+ }
456
+ ::placeholder {
457
+ opacity: 1;
458
+ }
459
+ @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
460
+ ::placeholder {
461
+ color: currentcolor;
462
+ @supports (color: color-mix(in lab, red, red)) {
463
+ color: color-mix(in oklab, currentcolor 50%, transparent);
464
+ }
465
+ }
466
+ }
467
+ textarea {
468
+ resize: vertical;
469
+ }
470
+ ::-webkit-search-decoration {
471
+ -webkit-appearance: none;
472
+ }
473
+ ::-webkit-date-and-time-value {
474
+ min-height: 1lh;
475
+ text-align: inherit;
476
+ }
477
+ ::-webkit-datetime-edit {
478
+ display: inline-flex;
479
+ }
480
+ ::-webkit-datetime-edit-fields-wrapper {
481
+ padding: 0;
482
+ }
483
+ ::-webkit-datetime-edit,
484
+ ::-webkit-datetime-edit-year-field,
485
+ ::-webkit-datetime-edit-month-field,
486
+ ::-webkit-datetime-edit-day-field,
487
+ ::-webkit-datetime-edit-hour-field,
488
+ ::-webkit-datetime-edit-minute-field,
489
+ ::-webkit-datetime-edit-second-field,
490
+ ::-webkit-datetime-edit-millisecond-field,
491
+ ::-webkit-datetime-edit-meridiem-field {
492
+ padding-block: 0;
493
+ }
494
+ ::-webkit-calendar-picker-indicator {
495
+ line-height: 1;
496
+ }
497
+ :-moz-ui-invalid {
498
+ box-shadow: none;
499
+ }
500
+ button,
501
+ input:where([type=button], [type=reset], [type=submit]),
502
+ ::file-selector-button {
503
+ appearance: button;
504
+ }
505
+ ::-webkit-inner-spin-button,
506
+ ::-webkit-outer-spin-button {
507
+ height: auto;
508
+ }
509
+ [hidden]:where(:not([hidden=until-found])) {
510
+ display: none !important;
511
+ }
512
+ }
513
+ @layer utilities {
514
+ .pointer-events-auto {
515
+ pointer-events: auto;
516
+ }
517
+ .pointer-events-none {
518
+ pointer-events: none;
519
+ }
520
+ .invisible {
521
+ visibility: hidden;
522
+ }
523
+ .visible {
524
+ visibility: visible;
525
+ }
526
+ .sr-only {
527
+ position: absolute;
528
+ width: 1px;
529
+ height: 1px;
530
+ padding: 0;
531
+ margin: -1px;
532
+ overflow: hidden;
533
+ clip: rect(0, 0, 0, 0);
534
+ white-space: nowrap;
535
+ border-width: 0;
536
+ }
537
+ .absolute {
538
+ position: absolute;
539
+ }
540
+ .fixed {
541
+ position: fixed;
542
+ }
543
+ .relative {
544
+ position: relative;
545
+ }
546
+ .static {
547
+ position: static;
548
+ }
549
+ .sticky {
550
+ position: sticky;
551
+ }
552
+ .inset-0 {
553
+ inset: calc(var(--spacing) * 0);
554
+ }
555
+ .inset-y-0 {
556
+ inset-block: calc(var(--spacing) * 0);
557
+ }
558
+ .top-0 {
559
+ top: calc(var(--spacing) * 0);
560
+ }
561
+ .top-2 {
562
+ top: calc(var(--spacing) * 2);
563
+ }
564
+ .right-0 {
565
+ right: calc(var(--spacing) * 0);
566
+ }
567
+ .right-2 {
568
+ right: calc(var(--spacing) * 2);
569
+ }
570
+ .right-6 {
571
+ right: calc(var(--spacing) * 6);
572
+ }
573
+ .bottom-0 {
574
+ bottom: calc(var(--spacing) * 0);
575
+ }
576
+ .bottom-2\/4 {
577
+ bottom: calc(2/4 * 100%);
578
+ }
579
+ .bottom-6 {
580
+ bottom: calc(var(--spacing) * 6);
581
+ }
582
+ .left-0 {
583
+ left: calc(var(--spacing) * 0);
584
+ }
585
+ .left-6 {
586
+ left: calc(var(--spacing) * 6);
587
+ }
588
+ .z-0 {
589
+ z-index: 0;
590
+ }
591
+ .z-10 {
592
+ z-index: 10;
593
+ }
594
+ .z-20 {
595
+ z-index: 20;
596
+ }
597
+ .z-40 {
598
+ z-index: 40;
599
+ }
600
+ .z-50 {
601
+ z-index: 50;
602
+ }
603
+ .container {
604
+ width: 100%;
605
+ @media (width >= 320px) {
606
+ max-width: 320px;
607
+ }
608
+ @media (width >= 768px) {
609
+ max-width: 768px;
610
+ }
611
+ @media (width >= 1024px) {
612
+ max-width: 1024px;
613
+ }
614
+ @media (width >= 1280px) {
615
+ max-width: 1280px;
616
+ }
617
+ @media (width >= 1536px) {
618
+ max-width: 1536px;
619
+ }
620
+ }
621
+ .m-4 {
622
+ margin: calc(var(--spacing) * 4);
623
+ }
624
+ .m-mobile-container-padding {
625
+ margin: var(--spacing-mobile-container-padding);
626
+ }
627
+ .mx-0 {
628
+ margin-inline: calc(var(--spacing) * 0);
629
+ }
630
+ .mx-auto {
631
+ margin-inline: auto;
632
+ }
633
+ .mx-mobile-container-padding {
634
+ margin-inline: var(--spacing-mobile-container-padding);
635
+ }
636
+ .my-4 {
637
+ margin-block: calc(var(--spacing) * 4);
638
+ }
639
+ .my-mobile-container-padding {
640
+ margin-block: var(--spacing-mobile-container-padding);
641
+ }
642
+ .mt-2 {
643
+ margin-top: calc(var(--spacing) * 2);
644
+ }
645
+ .mt-4 {
646
+ margin-top: calc(var(--spacing) * 4);
647
+ }
648
+ .mt-\[3px\] {
649
+ margin-top: 3px;
650
+ }
651
+ .mt-mobile-component-gap {
652
+ margin-top: var(--spacing-mobile-component-gap);
653
+ }
654
+ .mt-mobile-container-padding {
655
+ margin-top: var(--spacing-mobile-container-padding);
656
+ }
657
+ .\!mr-6 {
658
+ margin-right: calc(var(--spacing) * 6) !important;
659
+ }
660
+ .-mr-px {
661
+ margin-right: -1px;
662
+ }
663
+ .mr-1 {
664
+ margin-right: calc(var(--spacing) * 1);
665
+ }
666
+ .mr-auto {
667
+ margin-right: auto;
668
+ }
669
+ .mb-2 {
670
+ margin-bottom: calc(var(--spacing) * 2);
671
+ }
672
+ .mb-3 {
673
+ margin-bottom: calc(var(--spacing) * 3);
674
+ }
675
+ .mb-mobile-container-padding {
676
+ margin-bottom: var(--spacing-mobile-container-padding);
677
+ }
678
+ .-ml-px {
679
+ margin-left: -1px;
680
+ }
681
+ .ml-1 {
682
+ margin-left: calc(var(--spacing) * 1);
683
+ }
684
+ .ml-auto {
685
+ margin-left: auto;
686
+ }
687
+ .block {
688
+ display: block;
689
+ }
690
+ .contents {
691
+ display: contents;
692
+ }
693
+ .flex {
694
+ display: flex;
695
+ }
696
+ .grid {
697
+ display: grid;
698
+ }
699
+ .hidden {
700
+ display: none;
701
+ }
702
+ .inline {
703
+ display: inline;
704
+ }
705
+ .inline-block {
706
+ display: inline-block;
707
+ }
708
+ .inline-flex {
709
+ display: inline-flex;
710
+ }
711
+ .inline-grid {
712
+ display: inline-grid;
713
+ }
714
+ .table {
715
+ display: table;
716
+ }
717
+ .aspect-square {
718
+ aspect-ratio: 1 / 1;
719
+ }
720
+ .\!size-10 {
721
+ width: calc(var(--spacing) * 10) !important;
722
+ height: calc(var(--spacing) * 10) !important;
723
+ }
724
+ .size-2 {
725
+ width: calc(var(--spacing) * 2);
726
+ height: calc(var(--spacing) * 2);
727
+ }
728
+ .size-3 {
729
+ width: calc(var(--spacing) * 3);
730
+ height: calc(var(--spacing) * 3);
731
+ }
732
+ .size-6 {
733
+ width: calc(var(--spacing) * 6);
734
+ height: calc(var(--spacing) * 6);
735
+ }
736
+ .\!h-4\.5 {
737
+ height: calc(var(--spacing) * 4.5) !important;
738
+ }
739
+ .h-0\.5 {
740
+ height: calc(var(--spacing) * 0.5);
741
+ }
742
+ .h-1 {
743
+ height: calc(var(--spacing) * 1);
744
+ }
745
+ .h-3 {
746
+ height: calc(var(--spacing) * 3);
747
+ }
748
+ .h-4 {
749
+ height: calc(var(--spacing) * 4);
750
+ }
751
+ .h-6 {
752
+ height: calc(var(--spacing) * 6);
753
+ }
754
+ .h-8 {
755
+ height: calc(var(--spacing) * 8);
756
+ }
757
+ .h-10 {
758
+ height: calc(var(--spacing) * 10);
759
+ }
760
+ .h-14 {
761
+ height: calc(var(--spacing) * 14);
762
+ }
763
+ .h-18 {
764
+ height: calc(var(--spacing) * 18);
765
+ }
766
+ .h-30 {
767
+ height: calc(var(--spacing) * 30);
768
+ }
769
+ .h-60 {
770
+ height: calc(var(--spacing) * 60);
771
+ }
772
+ .h-\[166px\] {
773
+ height: 166px;
774
+ }
775
+ .h-\[185px\] {
776
+ height: 185px;
777
+ }
778
+ .h-auto {
779
+ height: auto;
780
+ }
781
+ .h-fit {
782
+ height: fit-content;
783
+ }
784
+ .h-full {
785
+ height: 100%;
786
+ }
787
+ .h-screen {
788
+ height: 100vh;
789
+ }
790
+ .max-h-10 {
791
+ max-height: calc(var(--spacing) * 10);
792
+ }
793
+ .max-h-full {
794
+ max-height: 100%;
795
+ }
796
+ .max-h-screen {
797
+ max-height: 100vh;
798
+ }
799
+ .min-h-6 {
800
+ min-height: calc(var(--spacing) * 6);
801
+ }
802
+ .min-h-10 {
803
+ min-height: calc(var(--spacing) * 10);
804
+ }
805
+ .min-h-19 {
806
+ min-height: calc(var(--spacing) * 19);
807
+ }
808
+ .min-h-\[34px\] {
809
+ min-height: 34px;
810
+ }
811
+ .min-h-\[120px\] {
812
+ min-height: 120px;
813
+ }
814
+ .min-h-min {
815
+ min-height: min-content;
816
+ }
817
+ .min-h-mobile-container-padding {
818
+ min-height: var(--spacing-mobile-container-padding);
819
+ }
820
+ .min-h-screen {
821
+ min-height: 100vh;
822
+ }
823
+ .\!w-6 {
824
+ width: calc(var(--spacing) * 6) !important;
825
+ }
826
+ .\!w-20 {
827
+ width: calc(var(--spacing) * 20) !important;
828
+ }
829
+ .w-3 {
830
+ width: calc(var(--spacing) * 3);
831
+ }
832
+ .w-4 {
833
+ width: calc(var(--spacing) * 4);
834
+ }
835
+ .w-6 {
836
+ width: calc(var(--spacing) * 6);
837
+ }
838
+ .w-7 {
839
+ width: calc(var(--spacing) * 7);
840
+ }
841
+ .w-8 {
842
+ width: calc(var(--spacing) * 8);
843
+ }
844
+ .w-10 {
845
+ width: calc(var(--spacing) * 10);
846
+ }
847
+ .w-12 {
848
+ width: calc(var(--spacing) * 12);
849
+ }
850
+ .w-16 {
851
+ width: calc(var(--spacing) * 16);
852
+ }
853
+ .w-25 {
854
+ width: calc(var(--spacing) * 25);
855
+ }
856
+ .w-68 {
857
+ width: calc(var(--spacing) * 68);
858
+ }
859
+ .w-fit {
860
+ width: fit-content;
861
+ }
862
+ .w-full {
863
+ width: 100%;
864
+ }
865
+ .w-max {
866
+ width: max-content;
867
+ }
868
+ .w-min {
869
+ width: min-content;
870
+ }
871
+ .w-px {
872
+ width: 1px;
873
+ }
874
+ .w-screen {
875
+ width: 100vw;
876
+ }
877
+ .\!max-w-fit {
878
+ max-width: fit-content !important;
879
+ }
880
+ .max-w-25 {
881
+ max-width: calc(var(--spacing) * 25);
882
+ }
883
+ .max-w-38 {
884
+ max-width: calc(var(--spacing) * 38);
885
+ }
886
+ .max-w-240 {
887
+ max-width: calc(var(--spacing) * 240);
888
+ }
889
+ .max-w-\[400px\] {
890
+ max-width: 400px;
891
+ }
892
+ .max-w-full {
893
+ max-width: 100%;
894
+ }
895
+ .max-w-screen {
896
+ max-width: 100vw;
897
+ }
898
+ .max-w-xl {
899
+ max-width: var(--container-xl);
900
+ }
901
+ .min-w-0 {
902
+ min-width: calc(var(--spacing) * 0);
903
+ }
904
+ .min-w-20 {
905
+ min-width: calc(var(--spacing) * 20);
906
+ }
907
+ .min-w-36 {
908
+ min-width: calc(var(--spacing) * 36);
909
+ }
910
+ .min-w-full {
911
+ min-width: 100%;
912
+ }
913
+ .min-w-screen {
914
+ min-width: 100vw;
915
+ }
916
+ .flex-1 {
917
+ flex: 1;
918
+ }
919
+ .shrink {
920
+ flex-shrink: 1;
921
+ }
922
+ .shrink-0 {
923
+ flex-shrink: 0;
924
+ }
925
+ .flex-grow {
926
+ flex-grow: 1;
927
+ }
928
+ .grow {
929
+ flex-grow: 1;
930
+ }
931
+ .translate-x-0 {
932
+ --tw-translate-x: calc(var(--spacing) * 0);
933
+ translate: var(--tw-translate-x) var(--tw-translate-y);
934
+ }
935
+ .translate-y-2\/4 {
936
+ --tw-translate-y: calc(2/4 * 100%);
937
+ translate: var(--tw-translate-x) var(--tw-translate-y);
938
+ }
939
+ .rotate-0 {
940
+ rotate: 0deg;
941
+ }
942
+ .rotate-180 {
943
+ rotate: 180deg;
944
+ }
945
+ .transform {
946
+ transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
947
+ }
948
+ .animate-spin {
949
+ animation: var(--animate-spin);
950
+ }
951
+ .\!cursor-default {
952
+ cursor: default !important;
953
+ }
954
+ .\!cursor-grabbing {
955
+ cursor: grabbing !important;
956
+ }
957
+ .cursor-col-resize {
958
+ cursor: col-resize;
959
+ }
960
+ .cursor-default {
961
+ cursor: default;
962
+ }
963
+ .cursor-grab {
964
+ cursor: grab;
965
+ }
966
+ .cursor-pointer {
967
+ cursor: pointer;
968
+ }
969
+ .resize {
970
+ resize: both;
971
+ }
972
+ .list-inside {
973
+ list-style-position: inside;
974
+ }
975
+ .list-disc {
976
+ list-style-type: disc;
977
+ }
978
+ .\[appearance\:textfield\] {
979
+ appearance: textfield;
980
+ }
981
+ .grid-cols-1 {
982
+ grid-template-columns: repeat(1, minmax(0, 1fr));
983
+ }
984
+ .grid-cols-2 {
985
+ grid-template-columns: repeat(2, minmax(0, 1fr));
986
+ }
987
+ .grid-cols-7 {
988
+ grid-template-columns: repeat(7, minmax(0, 1fr));
989
+ }
990
+ .grid-cols-\[auto_1fr\] {
991
+ grid-template-columns: auto 1fr;
992
+ }
993
+ .grid-rows-\[0fr\] {
994
+ grid-template-rows: 0fr;
995
+ }
996
+ .grid-rows-\[1fr\] {
997
+ grid-template-rows: 1fr;
998
+ }
999
+ .flex-col {
1000
+ flex-direction: column;
1001
+ }
1002
+ .flex-row {
1003
+ flex-direction: row;
1004
+ }
1005
+ .place-content-center {
1006
+ place-content: center;
1007
+ }
1008
+ .\!items-start {
1009
+ align-items: flex-start !important;
1010
+ }
1011
+ .items-center {
1012
+ align-items: center;
1013
+ }
1014
+ .items-end {
1015
+ align-items: flex-end;
1016
+ }
1017
+ .items-start {
1018
+ align-items: flex-start;
1019
+ }
1020
+ .justify-around {
1021
+ justify-content: space-around;
1022
+ }
1023
+ .justify-between {
1024
+ justify-content: space-between;
1025
+ }
1026
+ .justify-center {
1027
+ justify-content: center;
1028
+ }
1029
+ .justify-end {
1030
+ justify-content: flex-end;
1031
+ }
1032
+ .justify-start {
1033
+ justify-content: flex-start;
1034
+ }
1035
+ .gap-0\.5 {
1036
+ gap: calc(var(--spacing) * 0.5);
1037
+ }
1038
+ .gap-1 {
1039
+ gap: calc(var(--spacing) * 1);
1040
+ }
1041
+ .gap-2 {
1042
+ gap: calc(var(--spacing) * 2);
1043
+ }
1044
+ .gap-3 {
1045
+ gap: calc(var(--spacing) * 3);
1046
+ }
1047
+ .gap-4 {
1048
+ gap: calc(var(--spacing) * 4);
1049
+ }
1050
+ .gap-6 {
1051
+ gap: calc(var(--spacing) * 6);
1052
+ }
1053
+ .gap-desktop-compact-component-padding {
1054
+ gap: var(--spacing-desktop-compact-component-padding);
1055
+ }
1056
+ .gap-desktop-component-gap {
1057
+ gap: var(--spacing-desktop-component-gap);
1058
+ }
1059
+ .gap-desktop-layout-gap {
1060
+ gap: var(--spacing-desktop-layout-gap);
1061
+ }
1062
+ .gap-desktop-layout-padding {
1063
+ gap: var(--spacing-desktop-layout-padding);
1064
+ }
1065
+ .gap-mobile-component-gap {
1066
+ gap: var(--spacing-mobile-component-gap);
1067
+ }
1068
+ .gap-mobile-container-gap {
1069
+ gap: var(--spacing-mobile-container-gap);
1070
+ }
1071
+ .gap-mobile-container-padding {
1072
+ gap: var(--spacing-mobile-container-padding);
1073
+ }
1074
+ .gap-mobile-layout-gap {
1075
+ gap: var(--spacing-mobile-layout-gap);
1076
+ }
1077
+ .gap-mobile-layout-group-gap {
1078
+ gap: var(--spacing-mobile-layout-group-gap);
1079
+ }
1080
+ .space-y-4 {
1081
+ :where(& > :not(:last-child)) {
1082
+ --tw-space-y-reverse: 0;
1083
+ margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
1084
+ margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
1085
+ }
1086
+ }
1087
+ .space-x-1 {
1088
+ :where(& > :not(:last-child)) {
1089
+ --tw-space-x-reverse: 0;
1090
+ margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));
1091
+ margin-inline-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse)));
1092
+ }
1093
+ }
1094
+ .space-x-2 {
1095
+ :where(& > :not(:last-child)) {
1096
+ --tw-space-x-reverse: 0;
1097
+ margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
1098
+ margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
1099
+ }
1100
+ }
1101
+ .divide-x {
1102
+ :where(& > :not(:last-child)) {
1103
+ --tw-divide-x-reverse: 0;
1104
+ border-inline-style: var(--tw-border-style);
1105
+ border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
1106
+ border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
1107
+ }
1108
+ }
1109
+ .divide-y {
1110
+ :where(& > :not(:last-child)) {
1111
+ --tw-divide-y-reverse: 0;
1112
+ border-bottom-style: var(--tw-border-style);
1113
+ border-top-style: var(--tw-border-style);
1114
+ border-top-width: calc(1px * var(--tw-divide-y-reverse));
1115
+ border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
1116
+ }
1117
+ }
1118
+ .divide-border-primary-normal {
1119
+ :where(& > :not(:last-child)) {
1120
+ border-color: var(--color-border-primary-normal);
1121
+ }
1122
+ }
1123
+ .divide-neutral-200 {
1124
+ :where(& > :not(:last-child)) {
1125
+ border-color: var(--color-neutral-200);
1126
+ }
1127
+ }
1128
+ .divide-neutral-500 {
1129
+ :where(& > :not(:last-child)) {
1130
+ border-color: var(--color-neutral-500);
1131
+ }
1132
+ }
1133
+ .self-center {
1134
+ align-self: center;
1135
+ }
1136
+ .self-stretch {
1137
+ align-self: stretch;
1138
+ }
1139
+ .justify-self-center {
1140
+ justify-self: center;
1141
+ }
1142
+ .truncate {
1143
+ overflow: hidden;
1144
+ text-overflow: ellipsis;
1145
+ white-space: nowrap;
1146
+ }
1147
+ .overflow-auto {
1148
+ overflow: auto;
1149
+ }
1150
+ .overflow-clip {
1151
+ overflow: clip;
1152
+ }
1153
+ .overflow-hidden {
1154
+ overflow: hidden;
1155
+ }
1156
+ .overflow-x-auto {
1157
+ overflow-x: auto;
1158
+ }
1159
+ .overflow-x-hidden {
1160
+ overflow-x: hidden;
1161
+ }
1162
+ .overflow-x-scroll {
1163
+ overflow-x: scroll;
1164
+ }
1165
+ .overflow-y-auto {
1166
+ overflow-y: auto;
1167
+ }
1168
+ .overflow-y-hidden {
1169
+ overflow-y: hidden;
1170
+ }
1171
+ .overflow-y-scroll {
1172
+ overflow-y: scroll;
1173
+ }
1174
+ .\!rounded-none {
1175
+ border-radius: 0 !important;
1176
+ }
1177
+ .rounded {
1178
+ border-radius: 0.25rem;
1179
+ }
1180
+ .rounded-base {
1181
+ border-radius: var(--radius-base);
1182
+ }
1183
+ .rounded-full {
1184
+ border-radius: calc(infinity * 1px);
1185
+ }
1186
+ .rounded-md {
1187
+ border-radius: var(--radius-md);
1188
+ }
1189
+ .rounded-px {
1190
+ border-radius: var(--radius-px);
1191
+ }
1192
+ .rounded-sm {
1193
+ border-radius: var(--radius-sm);
1194
+ }
1195
+ .rounded-xl {
1196
+ border-radius: var(--radius-xl);
1197
+ }
1198
+ .rounded-xs {
1199
+ border-radius: var(--radius-xs);
1200
+ }
1201
+ .rounded-l {
1202
+ border-top-left-radius: 0.25rem;
1203
+ border-bottom-left-radius: 0.25rem;
1204
+ }
1205
+ .rounded-l-none {
1206
+ border-top-left-radius: 0;
1207
+ border-bottom-left-radius: 0;
1208
+ }
1209
+ .rounded-r {
1210
+ border-top-right-radius: 0.25rem;
1211
+ border-bottom-right-radius: 0.25rem;
1212
+ }
1213
+ .rounded-r-none {
1214
+ border-top-right-radius: 0;
1215
+ border-bottom-right-radius: 0;
1216
+ }
1217
+ .\!rounded-b-none {
1218
+ border-bottom-right-radius: 0 !important;
1219
+ border-bottom-left-radius: 0 !important;
1220
+ }
1221
+ .\!border-0 {
1222
+ border-style: var(--tw-border-style) !important;
1223
+ border-width: 0px !important;
1224
+ }
1225
+ .border {
1226
+ border-style: var(--tw-border-style);
1227
+ border-width: 1px;
1228
+ }
1229
+ .border-2 {
1230
+ border-style: var(--tw-border-style);
1231
+ border-width: 2px;
1232
+ }
1233
+ .border-x {
1234
+ border-inline-style: var(--tw-border-style);
1235
+ border-inline-width: 1px;
1236
+ }
1237
+ .border-x-0 {
1238
+ border-inline-style: var(--tw-border-style);
1239
+ border-inline-width: 0px;
1240
+ }
1241
+ .border-y {
1242
+ border-block-style: var(--tw-border-style);
1243
+ border-block-width: 1px;
1244
+ }
1245
+ .border-t {
1246
+ border-top-style: var(--tw-border-style);
1247
+ border-top-width: 1px;
1248
+ }
1249
+ .border-r {
1250
+ border-right-style: var(--tw-border-style);
1251
+ border-right-width: 1px;
1252
+ }
1253
+ .border-r-0 {
1254
+ border-right-style: var(--tw-border-style);
1255
+ border-right-width: 0px;
1256
+ }
1257
+ .border-b {
1258
+ border-bottom-style: var(--tw-border-style);
1259
+ border-bottom-width: 1px;
1260
+ }
1261
+ .border-l {
1262
+ border-left-style: var(--tw-border-style);
1263
+ border-left-width: 1px;
1264
+ }
1265
+ .border-dashed {
1266
+ --tw-border-style: dashed;
1267
+ border-style: dashed;
1268
+ }
1269
+ .border-solid {
1270
+ --tw-border-style: solid;
1271
+ border-style: solid;
1272
+ }
1273
+ .border-action-400 {
1274
+ border-color: var(--color-action-400);
1275
+ }
1276
+ .border-background-action-critical-primary-normal {
1277
+ border-color: var(--color-background-action-critical-primary-normal);
1278
+ }
1279
+ .border-background-action-primary-normal {
1280
+ border-color: var(--color-background-action-primary-normal);
1281
+ }
1282
+ .border-background-warning-normal {
1283
+ border-color: var(--color-background-warning-normal);
1284
+ }
1285
+ .border-border-action-critical-normal {
1286
+ border-color: var(--color-border-action-critical-normal);
1287
+ }
1288
+ .border-border-action-disabled {
1289
+ border-color: var(--color-border-action-disabled);
1290
+ }
1291
+ .border-border-action-normal {
1292
+ border-color: var(--color-border-action-normal);
1293
+ }
1294
+ .border-border-primary-error {
1295
+ border-color: var(--color-border-primary-error);
1296
+ }
1297
+ .border-border-primary-focus {
1298
+ border-color: var(--color-border-primary-focus);
1299
+ }
1300
+ .border-border-primary-normal {
1301
+ border-color: var(--color-border-primary-normal);
1302
+ }
1303
+ .border-brand-200 {
1304
+ border-color: var(--color-brand-200);
1305
+ }
1306
+ .border-critical-400 {
1307
+ border-color: var(--color-critical-400);
1308
+ }
1309
+ .border-neutral-300 {
1310
+ border-color: var(--color-neutral-300);
1311
+ }
1312
+ .border-neutral-400 {
1313
+ border-color: var(--color-neutral-400);
1314
+ }
1315
+ .border-success-400 {
1316
+ border-color: var(--color-success-400);
1317
+ }
1318
+ .border-transparent {
1319
+ border-color: transparent;
1320
+ }
1321
+ .border-warning-400 {
1322
+ border-color: var(--color-warning-400);
1323
+ }
1324
+ .border-y-action-400 {
1325
+ border-block-color: var(--color-action-400);
1326
+ }
1327
+ .\!bg-background-action-critical-secondary-hover {
1328
+ background-color: var(--color-background-action-critical-secondary-hover) !important;
1329
+ }
1330
+ .\!bg-background-action-secondary-hover {
1331
+ background-color: var(--color-background-action-secondary-hover) !important;
1332
+ }
1333
+ .\!bg-brand-200 {
1334
+ background-color: var(--color-brand-200) !important;
1335
+ }
1336
+ .\!bg-neutral-000 {
1337
+ background-color: var(--color-neutral-000) !important;
1338
+ }
1339
+ .bg-action-100 {
1340
+ background-color: var(--color-action-100);
1341
+ }
1342
+ .bg-action-200 {
1343
+ background-color: var(--color-action-200);
1344
+ }
1345
+ .bg-action-300 {
1346
+ background-color: var(--color-action-300);
1347
+ }
1348
+ .bg-action-400 {
1349
+ background-color: var(--color-action-400);
1350
+ }
1351
+ .bg-action-500 {
1352
+ background-color: var(--color-action-500);
1353
+ }
1354
+ .bg-background-action-critical-primary-active {
1355
+ background-color: var(--color-background-action-critical-primary-active);
1356
+ }
1357
+ .bg-background-action-critical-primary-disabled {
1358
+ background-color: var(--color-background-action-critical-primary-disabled);
1359
+ }
1360
+ .bg-background-action-critical-primary-hover {
1361
+ background-color: var(--color-background-action-critical-primary-hover);
1362
+ }
1363
+ .bg-background-action-critical-primary-normal {
1364
+ background-color: var(--color-background-action-critical-primary-normal);
1365
+ }
1366
+ .bg-background-action-critical-secondary-active {
1367
+ background-color: var(--color-background-action-critical-secondary-active);
1368
+ }
1369
+ .bg-background-action-critical-secondary-disabled {
1370
+ background-color: var(--color-background-action-critical-secondary-disabled);
1371
+ }
1372
+ .bg-background-action-critical-secondary-hover {
1373
+ background-color: var(--color-background-action-critical-secondary-hover);
1374
+ }
1375
+ .bg-background-action-critical-secondary-normal {
1376
+ background-color: var(--color-background-action-critical-secondary-normal);
1377
+ }
1378
+ .bg-background-action-primary-active {
1379
+ background-color: var(--color-background-action-primary-active);
1380
+ }
1381
+ .bg-background-action-primary-disabled {
1382
+ background-color: var(--color-background-action-primary-disabled);
1383
+ }
1384
+ .bg-background-action-primary-hover {
1385
+ background-color: var(--color-background-action-primary-hover);
1386
+ }
1387
+ .bg-background-action-primary-normal {
1388
+ background-color: var(--color-background-action-primary-normal);
1389
+ }
1390
+ .bg-background-action-secondary-active {
1391
+ background-color: var(--color-background-action-secondary-active);
1392
+ }
1393
+ .bg-background-action-secondary-disabled {
1394
+ background-color: var(--color-background-action-secondary-disabled);
1395
+ }
1396
+ .bg-background-action-secondary-hover {
1397
+ background-color: var(--color-background-action-secondary-hover);
1398
+ }
1399
+ .bg-background-action-secondary-normal {
1400
+ background-color: var(--color-background-action-secondary-normal);
1401
+ }
1402
+ .bg-background-brand-normal {
1403
+ background-color: var(--color-background-brand-normal);
1404
+ }
1405
+ .bg-background-critical-normal {
1406
+ background-color: var(--color-background-critical-normal);
1407
+ }
1408
+ .bg-background-grouped-primary-normal {
1409
+ background-color: var(--color-background-grouped-primary-normal);
1410
+ }
1411
+ .bg-background-grouped-secondary-normal {
1412
+ background-color: var(--color-background-grouped-secondary-normal);
1413
+ }
1414
+ .bg-background-on-action-primary-normal {
1415
+ background-color: var(--color-background-on-action-primary-normal);
1416
+ }
1417
+ .bg-background-primary-normal {
1418
+ background-color: var(--color-background-primary-normal);
1419
+ }
1420
+ .bg-background-secondary-normal {
1421
+ background-color: var(--color-background-secondary-normal);
1422
+ }
1423
+ .bg-background-success-normal {
1424
+ background-color: var(--color-background-success-normal);
1425
+ }
1426
+ .bg-background-warning-normal {
1427
+ background-color: var(--color-background-warning-normal);
1428
+ }
1429
+ .bg-border-action-active {
1430
+ background-color: var(--color-border-action-active);
1431
+ }
1432
+ .bg-border-action-critical-active {
1433
+ background-color: var(--color-border-action-critical-active);
1434
+ }
1435
+ .bg-border-action-critical-disabled {
1436
+ background-color: var(--color-border-action-critical-disabled);
1437
+ }
1438
+ .bg-border-action-critical-hover {
1439
+ background-color: var(--color-border-action-critical-hover);
1440
+ }
1441
+ .bg-border-action-critical-normal {
1442
+ background-color: var(--color-border-action-critical-normal);
1443
+ }
1444
+ .bg-border-action-disabled {
1445
+ background-color: var(--color-border-action-disabled);
1446
+ }
1447
+ .bg-border-action-hover {
1448
+ background-color: var(--color-border-action-hover);
1449
+ }
1450
+ .bg-border-action-normal {
1451
+ background-color: var(--color-border-action-normal);
1452
+ }
1453
+ .bg-border-primary-error {
1454
+ background-color: var(--color-border-primary-error);
1455
+ }
1456
+ .bg-border-primary-focus {
1457
+ background-color: var(--color-border-primary-focus);
1458
+ }
1459
+ .bg-border-primary-normal {
1460
+ background-color: var(--color-border-primary-normal);
1461
+ }
1462
+ .bg-brand-100 {
1463
+ background-color: var(--color-brand-100);
1464
+ }
1465
+ .bg-brand-200 {
1466
+ background-color: var(--color-brand-200);
1467
+ }
1468
+ .bg-brand-300 {
1469
+ background-color: var(--color-brand-300);
1470
+ }
1471
+ .bg-brand-400 {
1472
+ background-color: var(--color-brand-400);
1473
+ }
1474
+ .bg-brand-500 {
1475
+ background-color: var(--color-brand-500);
1476
+ }
1477
+ .bg-chart-0 {
1478
+ background-color: var(--color-chart-0);
1479
+ }
1480
+ .bg-chart-1 {
1481
+ background-color: var(--color-chart-1);
1482
+ }
1483
+ .bg-chart-2 {
1484
+ background-color: var(--color-chart-2);
1485
+ }
1486
+ .bg-chart-3 {
1487
+ background-color: var(--color-chart-3);
1488
+ }
1489
+ .bg-chart-4 {
1490
+ background-color: var(--color-chart-4);
1491
+ }
1492
+ .bg-chart-5 {
1493
+ background-color: var(--color-chart-5);
1494
+ }
1495
+ .bg-chart-6 {
1496
+ background-color: var(--color-chart-6);
1497
+ }
1498
+ .bg-critical-100 {
1499
+ background-color: var(--color-critical-100);
1500
+ }
1501
+ .bg-critical-200 {
1502
+ background-color: var(--color-critical-200);
1503
+ }
1504
+ .bg-critical-300 {
1505
+ background-color: var(--color-critical-300);
1506
+ }
1507
+ .bg-critical-400 {
1508
+ background-color: var(--color-critical-400);
1509
+ }
1510
+ .bg-critical-500 {
1511
+ background-color: var(--color-critical-500);
1512
+ }
1513
+ .bg-icon-action-critical-active {
1514
+ background-color: var(--color-icon-action-critical-active);
1515
+ }
1516
+ .bg-icon-action-critical-disabled {
1517
+ background-color: var(--color-icon-action-critical-disabled);
1518
+ }
1519
+ .bg-icon-action-critical-hover {
1520
+ background-color: var(--color-icon-action-critical-hover);
1521
+ }
1522
+ .bg-icon-action-critical-normal {
1523
+ background-color: var(--color-icon-action-critical-normal);
1524
+ }
1525
+ .bg-icon-action-primary-active {
1526
+ background-color: var(--color-icon-action-primary-active);
1527
+ }
1528
+ .bg-icon-action-primary-disabled {
1529
+ background-color: var(--color-icon-action-primary-disabled);
1530
+ }
1531
+ .bg-icon-action-primary-hover {
1532
+ background-color: var(--color-icon-action-primary-hover);
1533
+ }
1534
+ .bg-icon-action-primary-normal {
1535
+ background-color: var(--color-icon-action-primary-normal);
1536
+ }
1537
+ .bg-icon-action-secondary-active {
1538
+ background-color: var(--color-icon-action-secondary-active);
1539
+ }
1540
+ .bg-icon-action-secondary-disabled {
1541
+ background-color: var(--color-icon-action-secondary-disabled);
1542
+ }
1543
+ .bg-icon-action-secondary-hover {
1544
+ background-color: var(--color-icon-action-secondary-hover);
1545
+ }
1546
+ .bg-icon-action-secondary-normal {
1547
+ background-color: var(--color-icon-action-secondary-normal);
1548
+ }
1549
+ .bg-icon-brand-primary-active {
1550
+ background-color: var(--color-icon-brand-primary-active);
1551
+ }
1552
+ .bg-icon-brand-primary-disabled {
1553
+ background-color: var(--color-icon-brand-primary-disabled);
1554
+ }
1555
+ .bg-icon-brand-primary-hover {
1556
+ background-color: var(--color-icon-brand-primary-hover);
1557
+ }
1558
+ .bg-icon-brand-primary-normal {
1559
+ background-color: var(--color-icon-brand-primary-normal);
1560
+ }
1561
+ .bg-icon-critical-disabled {
1562
+ background-color: var(--color-icon-critical-disabled);
1563
+ }
1564
+ .bg-icon-critical-normal {
1565
+ background-color: var(--color-icon-critical-normal);
1566
+ }
1567
+ .bg-icon-on-action-primary-active {
1568
+ background-color: var(--color-icon-on-action-primary-active);
1569
+ }
1570
+ .bg-icon-on-action-primary-disabled {
1571
+ background-color: var(--color-icon-on-action-primary-disabled);
1572
+ }
1573
+ .bg-icon-on-action-primary-hover {
1574
+ background-color: var(--color-icon-on-action-primary-hover);
1575
+ }
1576
+ .bg-icon-on-action-primary-normal {
1577
+ background-color: var(--color-icon-on-action-primary-normal);
1578
+ }
1579
+ .bg-icon-primary-disabled {
1580
+ background-color: var(--color-icon-primary-disabled);
1581
+ }
1582
+ .bg-icon-primary-normal {
1583
+ background-color: var(--color-icon-primary-normal);
1584
+ }
1585
+ .bg-icon-success-disabled {
1586
+ background-color: var(--color-icon-success-disabled);
1587
+ }
1588
+ .bg-icon-success-normal {
1589
+ background-color: var(--color-icon-success-normal);
1590
+ }
1591
+ .bg-icon-warning-disabled {
1592
+ background-color: var(--color-icon-warning-disabled);
1593
+ }
1594
+ .bg-icon-warning-normal {
1595
+ background-color: var(--color-icon-warning-normal);
1596
+ }
1597
+ .bg-link-100 {
1598
+ background-color: var(--color-link-100);
1599
+ }
1600
+ .bg-link-200 {
1601
+ background-color: var(--color-link-200);
1602
+ }
1603
+ .bg-link-300 {
1604
+ background-color: var(--color-link-300);
1605
+ }
1606
+ .bg-link-400 {
1607
+ background-color: var(--color-link-400);
1608
+ }
1609
+ .bg-link-500 {
1610
+ background-color: var(--color-link-500);
1611
+ }
1612
+ .bg-neutral-000 {
1613
+ background-color: var(--color-neutral-000);
1614
+ }
1615
+ .bg-neutral-100 {
1616
+ background-color: var(--color-neutral-100);
1617
+ }
1618
+ .bg-neutral-200 {
1619
+ background-color: var(--color-neutral-200);
1620
+ }
1621
+ .bg-neutral-300 {
1622
+ background-color: var(--color-neutral-300);
1623
+ }
1624
+ .bg-neutral-400 {
1625
+ background-color: var(--color-neutral-400);
1626
+ }
1627
+ .bg-neutral-450 {
1628
+ background-color: var(--color-neutral-450);
1629
+ }
1630
+ .bg-neutral-500 {
1631
+ background-color: var(--color-neutral-500);
1632
+ }
1633
+ .bg-neutral-600 {
1634
+ background-color: var(--color-neutral-600);
1635
+ }
1636
+ .bg-neutral-600\/30 {
1637
+ background-color: color-mix(in srgb, #000000 30%, transparent);
1638
+ @supports (color: color-mix(in lab, red, red)) {
1639
+ background-color: color-mix(in oklab, var(--color-neutral-600) 30%, transparent);
1640
+ }
1641
+ }
1642
+ .bg-neutral-600\/50 {
1643
+ background-color: color-mix(in srgb, #000000 50%, transparent);
1644
+ @supports (color: color-mix(in lab, red, red)) {
1645
+ background-color: color-mix(in oklab, var(--color-neutral-600) 50%, transparent);
1646
+ }
1647
+ }
1648
+ .bg-success-100 {
1649
+ background-color: var(--color-success-100);
1650
+ }
1651
+ .bg-success-200 {
1652
+ background-color: var(--color-success-200);
1653
+ }
1654
+ .bg-success-300 {
1655
+ background-color: var(--color-success-300);
1656
+ }
1657
+ .bg-success-400 {
1658
+ background-color: var(--color-success-400);
1659
+ }
1660
+ .bg-success-500 {
1661
+ background-color: var(--color-success-500);
1662
+ }
1663
+ .bg-text-action-critical-active {
1664
+ background-color: var(--color-text-action-critical-active);
1665
+ }
1666
+ .bg-text-action-critical-disabled {
1667
+ background-color: var(--color-text-action-critical-disabled);
1668
+ }
1669
+ .bg-text-action-critical-hover {
1670
+ background-color: var(--color-text-action-critical-hover);
1671
+ }
1672
+ .bg-text-action-critical-normal {
1673
+ background-color: var(--color-text-action-critical-normal);
1674
+ }
1675
+ .bg-text-action-primary-active {
1676
+ background-color: var(--color-text-action-primary-active);
1677
+ }
1678
+ .bg-text-action-primary-disabled {
1679
+ background-color: var(--color-text-action-primary-disabled);
1680
+ }
1681
+ .bg-text-action-primary-hover {
1682
+ background-color: var(--color-text-action-primary-hover);
1683
+ }
1684
+ .bg-text-action-primary-normal {
1685
+ background-color: var(--color-text-action-primary-normal);
1686
+ }
1687
+ .bg-text-critical-disabled {
1688
+ background-color: var(--color-text-critical-disabled);
1689
+ }
1690
+ .bg-text-critical-error {
1691
+ background-color: var(--color-text-critical-error);
1692
+ }
1693
+ .bg-text-critical-normal {
1694
+ background-color: var(--color-text-critical-normal);
1695
+ }
1696
+ .bg-text-link-active {
1697
+ background-color: var(--color-text-link-active);
1698
+ }
1699
+ .bg-text-link-disabled {
1700
+ background-color: var(--color-text-link-disabled);
1701
+ }
1702
+ .bg-text-link-hover {
1703
+ background-color: var(--color-text-link-hover);
1704
+ }
1705
+ .bg-text-link-normal {
1706
+ background-color: var(--color-text-link-normal);
1707
+ }
1708
+ .bg-text-on-action-primary-active {
1709
+ background-color: var(--color-text-on-action-primary-active);
1710
+ }
1711
+ .bg-text-on-action-primary-disabled {
1712
+ background-color: var(--color-text-on-action-primary-disabled);
1713
+ }
1714
+ .bg-text-on-action-primary-hover {
1715
+ background-color: var(--color-text-on-action-primary-hover);
1716
+ }
1717
+ .bg-text-on-action-primary-normal {
1718
+ background-color: var(--color-text-on-action-primary-normal);
1719
+ }
1720
+ .bg-text-primary-disabled {
1721
+ background-color: var(--color-text-primary-disabled);
1722
+ }
1723
+ .bg-text-primary-error {
1724
+ background-color: var(--color-text-primary-error);
1725
+ }
1726
+ .bg-text-primary-normal {
1727
+ background-color: var(--color-text-primary-normal);
1728
+ }
1729
+ .bg-text-secondary-disabled {
1730
+ background-color: var(--color-text-secondary-disabled);
1731
+ }
1732
+ .bg-text-secondary-error {
1733
+ background-color: var(--color-text-secondary-error);
1734
+ }
1735
+ .bg-text-secondary-normal {
1736
+ background-color: var(--color-text-secondary-normal);
1737
+ }
1738
+ .bg-text-success-disabled {
1739
+ background-color: var(--color-text-success-disabled);
1740
+ }
1741
+ .bg-text-success-error {
1742
+ background-color: var(--color-text-success-error);
1743
+ }
1744
+ .bg-text-success-normal {
1745
+ background-color: var(--color-text-success-normal);
1746
+ }
1747
+ .bg-text-warning-disabled {
1748
+ background-color: var(--color-text-warning-disabled);
1749
+ }
1750
+ .bg-text-warning-error {
1751
+ background-color: var(--color-text-warning-error);
1752
+ }
1753
+ .bg-text-warning-normal {
1754
+ background-color: var(--color-text-warning-normal);
1755
+ }
1756
+ .bg-transparent {
1757
+ background-color: transparent;
1758
+ }
1759
+ .bg-warning-100 {
1760
+ background-color: var(--color-warning-100);
1761
+ }
1762
+ .bg-warning-200 {
1763
+ background-color: var(--color-warning-200);
1764
+ }
1765
+ .bg-warning-300 {
1766
+ background-color: var(--color-warning-300);
1767
+ }
1768
+ .bg-warning-400 {
1769
+ background-color: var(--color-warning-400);
1770
+ }
1771
+ .bg-warning-500 {
1772
+ background-color: var(--color-warning-500);
1773
+ }
1774
+ .bg-white {
1775
+ background-color: var(--color-white);
1776
+ }
1777
+ .bg-linear-270 {
1778
+ --tw-gradient-position: 270deg;
1779
+ @supports (background-image: linear-gradient(in lab, red, red)) {
1780
+ --tw-gradient-position: 270deg in oklab;
1781
+ }
1782
+ background-image: linear-gradient(var(--tw-gradient-stops));
1783
+ }
1784
+ .bg-gradient-to-r {
1785
+ --tw-gradient-position: to right in oklab;
1786
+ background-image: linear-gradient(var(--tw-gradient-stops));
1787
+ }
1788
+ .from-neutral-300\/\[12\%\] {
1789
+ --tw-gradient-from: color-mix(in srgb, #c1c1c1 12%, transparent);
1790
+ @supports (color: color-mix(in lab, red, red)) {
1791
+ --tw-gradient-from: color-mix(in oklab, var(--color-neutral-300) 12%, transparent);
1792
+ }
1793
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1794
+ }
1795
+ .from-white {
1796
+ --tw-gradient-from: var(--color-white);
1797
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1798
+ }
1799
+ .to-neutral-300\/\[24\%\] {
1800
+ --tw-gradient-to: color-mix(in srgb, #c1c1c1 24%, transparent);
1801
+ @supports (color: color-mix(in lab, red, red)) {
1802
+ --tw-gradient-to: color-mix(in oklab, var(--color-neutral-300) 24%, transparent);
1803
+ }
1804
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1805
+ }
1806
+ .to-transparent {
1807
+ --tw-gradient-to: transparent;
1808
+ --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1809
+ }
1810
+ .object-contain {
1811
+ object-fit: contain;
1812
+ }
1813
+ .object-center {
1814
+ object-position: center;
1815
+ }
1816
+ .p-0\.5 {
1817
+ padding: calc(var(--spacing) * 0.5);
1818
+ }
1819
+ .p-1 {
1820
+ padding: calc(var(--spacing) * 1);
1821
+ }
1822
+ .p-2 {
1823
+ padding: calc(var(--spacing) * 2);
1824
+ }
1825
+ .p-3 {
1826
+ padding: calc(var(--spacing) * 3);
1827
+ }
1828
+ .p-4 {
1829
+ padding: calc(var(--spacing) * 4);
1830
+ }
1831
+ .p-6 {
1832
+ padding: calc(var(--spacing) * 6);
1833
+ }
1834
+ .p-\[calc\(var\(--spacing-mobile-component-padding\)_-_1px\)\] {
1835
+ padding: calc(var(--spacing-mobile-component-padding) - 1px);
1836
+ }
1837
+ .p-\[calc\(var\(--spacing-mobile-component-padding\)_-_2px\)\] {
1838
+ padding: calc(var(--spacing-mobile-component-padding) - 2px);
1839
+ }
1840
+ .p-desktop-layout-padding {
1841
+ padding: var(--spacing-desktop-layout-padding);
1842
+ }
1843
+ .p-mobile-component-gap {
1844
+ padding: var(--spacing-mobile-component-gap);
1845
+ }
1846
+ .p-mobile-component-padding {
1847
+ padding: var(--spacing-mobile-component-padding);
1848
+ }
1849
+ .p-mobile-container-padding {
1850
+ padding: var(--spacing-mobile-container-padding);
1851
+ }
1852
+ .p-mobile-layout-padding {
1853
+ padding: var(--spacing-mobile-layout-padding);
1854
+ }
1855
+ .\!px-0 {
1856
+ padding-inline: calc(var(--spacing) * 0) !important;
1857
+ }
1858
+ .px-1 {
1859
+ padding-inline: calc(var(--spacing) * 1);
1860
+ }
1861
+ .px-2 {
1862
+ padding-inline: calc(var(--spacing) * 2);
1863
+ }
1864
+ .px-3 {
1865
+ padding-inline: calc(var(--spacing) * 3);
1866
+ }
1867
+ .px-4 {
1868
+ padding-inline: calc(var(--spacing) * 4);
1869
+ }
1870
+ .px-mobile-component-gap {
1871
+ padding-inline: var(--spacing-mobile-component-gap);
1872
+ }
1873
+ .px-mobile-component-padding {
1874
+ padding-inline: var(--spacing-mobile-component-padding);
1875
+ }
1876
+ .px-mobile-container-padding {
1877
+ padding-inline: var(--spacing-mobile-container-padding);
1878
+ }
1879
+ .px-mobile-layout-group-gap {
1880
+ padding-inline: var(--spacing-mobile-layout-group-gap);
1881
+ }
1882
+ .px-mobile-layout-padding {
1883
+ padding-inline: var(--spacing-mobile-layout-padding);
1884
+ }
1885
+ .py-0\.5 {
1886
+ padding-block: calc(var(--spacing) * 0.5);
1887
+ }
1888
+ .py-1 {
1889
+ padding-block: calc(var(--spacing) * 1);
1890
+ }
1891
+ .py-1\.5 {
1892
+ padding-block: calc(var(--spacing) * 1.5);
1893
+ }
1894
+ .py-2 {
1895
+ padding-block: calc(var(--spacing) * 2);
1896
+ }
1897
+ .py-3 {
1898
+ padding-block: calc(var(--spacing) * 3);
1899
+ }
1900
+ .py-3\.5 {
1901
+ padding-block: calc(var(--spacing) * 3.5);
1902
+ }
1903
+ .py-4 {
1904
+ padding-block: calc(var(--spacing) * 4);
1905
+ }
1906
+ .py-\[2px\] {
1907
+ padding-block: 2px;
1908
+ }
1909
+ .py-\[15px\] {
1910
+ padding-block: 15px;
1911
+ }
1912
+ .py-\[calc\(var\(--spacing-mobile-component-padding\)_\+_3px\)\] {
1913
+ padding-block: calc(var(--spacing-mobile-component-padding) + 3px);
1914
+ }
1915
+ .py-mobile-component-gap {
1916
+ padding-block: var(--spacing-mobile-component-gap);
1917
+ }
1918
+ .py-mobile-component-padding {
1919
+ padding-block: var(--spacing-mobile-component-padding);
1920
+ }
1921
+ .py-mobile-container-padding {
1922
+ padding-block: var(--spacing-mobile-container-padding);
1923
+ }
1924
+ .py-mobile-layout-group-gap {
1925
+ padding-block: var(--spacing-mobile-layout-group-gap);
1926
+ }
1927
+ .py-mobile-layout-padding {
1928
+ padding-block: var(--spacing-mobile-layout-padding);
1929
+ }
1930
+ .pt-\[7px\] {
1931
+ padding-top: 7px;
1932
+ }
1933
+ .pb-2 {
1934
+ padding-bottom: calc(var(--spacing) * 2);
1935
+ }
1936
+ .pb-mobile-component-padding {
1937
+ padding-bottom: var(--spacing-mobile-component-padding);
1938
+ }
1939
+ .pb-mobile-layout-padding {
1940
+ padding-bottom: var(--spacing-mobile-layout-padding);
1941
+ }
1942
+ .pl-2 {
1943
+ padding-left: calc(var(--spacing) * 2);
1944
+ }
1945
+ .pl-6 {
1946
+ padding-left: calc(var(--spacing) * 6);
1947
+ }
1948
+ .pl-13 {
1949
+ padding-left: calc(var(--spacing) * 13);
1950
+ }
1951
+ .pl-20 {
1952
+ padding-left: calc(var(--spacing) * 20);
1953
+ }
1954
+ .pl-27 {
1955
+ padding-left: calc(var(--spacing) * 27);
1956
+ }
1957
+ .pl-mobile-component-padding {
1958
+ padding-left: var(--spacing-mobile-component-padding);
1959
+ }
1960
+ .text-center {
1961
+ text-align: center;
1962
+ }
1963
+ .text-left {
1964
+ text-align: left;
1965
+ }
1966
+ .text-right {
1967
+ text-align: right;
1968
+ }
1969
+ .font-sans {
1970
+ font-family: var(--font-sans);
1971
+ }
1972
+ .text-\[0\.6rem\] {
1973
+ font-size: 0.6rem;
1974
+ }
1975
+ .text-\[13px\] {
1976
+ font-size: 13px;
1977
+ }
1978
+ .text-\[14px\] {
1979
+ font-size: 14px;
1980
+ }
1981
+ .text-caption-mobile {
1982
+ font-size: var(--text-caption-mobile);
1983
+ }
1984
+ .text-display-1-mobile {
1985
+ font-size: var(--text-display-1-mobile);
1986
+ }
1987
+ .text-display-2-mobile {
1988
+ font-size: var(--text-display-2-mobile);
1989
+ }
1990
+ .text-heading-1-mobile {
1991
+ font-size: var(--text-heading-1-mobile);
1992
+ }
1993
+ .text-heading-2-mobile {
1994
+ font-size: var(--text-heading-2-mobile);
1995
+ }
1996
+ .text-heading-3-mobile {
1997
+ font-size: var(--text-heading-3-mobile);
1998
+ }
1999
+ .text-label-mobile {
2000
+ font-size: var(--text-label-mobile);
2001
+ }
2002
+ .text-link-mobile {
2003
+ font-size: var(--text-link-mobile);
2004
+ }
2005
+ .text-paragraph-mobile {
2006
+ font-size: var(--text-paragraph-mobile);
2007
+ }
2008
+ .text-subheader-mobile {
2009
+ font-size: var(--text-subheader-mobile);
2010
+ }
2011
+ .\!leading-6 {
2012
+ --tw-leading: calc(var(--spacing) * 6) !important;
2013
+ line-height: calc(var(--spacing) * 6) !important;
2014
+ }
2015
+ .leading-\[1\.38462\] {
2016
+ --tw-leading: 1.38462;
2017
+ line-height: 1.38462;
2018
+ }
2019
+ .leading-\[1\] {
2020
+ --tw-leading: 1;
2021
+ line-height: 1;
2022
+ }
2023
+ .leading-caption-mobile {
2024
+ --tw-leading: var(--leading-caption-mobile);
2025
+ line-height: var(--leading-caption-mobile);
2026
+ }
2027
+ .leading-display-1-mobile {
2028
+ --tw-leading: var(--leading-display-1-mobile);
2029
+ line-height: var(--leading-display-1-mobile);
2030
+ }
2031
+ .leading-display-2-mobile {
2032
+ --tw-leading: var(--leading-display-2-mobile);
2033
+ line-height: var(--leading-display-2-mobile);
2034
+ }
2035
+ .leading-heading-1-mobile {
2036
+ --tw-leading: var(--leading-heading-1-mobile);
2037
+ line-height: var(--leading-heading-1-mobile);
2038
+ }
2039
+ .leading-heading-2-mobile {
2040
+ --tw-leading: var(--leading-heading-2-mobile);
2041
+ line-height: var(--leading-heading-2-mobile);
2042
+ }
2043
+ .leading-heading-3-mobile {
2044
+ --tw-leading: var(--leading-heading-3-mobile);
2045
+ line-height: var(--leading-heading-3-mobile);
2046
+ }
2047
+ .leading-label-mobile {
2048
+ --tw-leading: var(--leading-label-mobile);
2049
+ line-height: var(--leading-label-mobile);
2050
+ }
2051
+ .leading-link-mobile {
2052
+ --tw-leading: var(--leading-link-mobile);
2053
+ line-height: var(--leading-link-mobile);
2054
+ }
2055
+ .leading-paragraph-mobile {
2056
+ --tw-leading: var(--leading-paragraph-mobile);
2057
+ line-height: var(--leading-paragraph-mobile);
2058
+ }
2059
+ .leading-subheader-mobile {
2060
+ --tw-leading: var(--leading-subheader-mobile);
2061
+ line-height: var(--leading-subheader-mobile);
2062
+ }
2063
+ .font-bold {
2064
+ --tw-font-weight: var(--font-weight-bold);
2065
+ font-weight: var(--font-weight-bold);
2066
+ }
2067
+ .font-light {
2068
+ --tw-font-weight: var(--font-weight-light);
2069
+ font-weight: var(--font-weight-light);
2070
+ }
2071
+ .font-medium {
2072
+ --tw-font-weight: var(--font-weight-medium);
2073
+ font-weight: var(--font-weight-medium);
2074
+ }
2075
+ .font-normal {
2076
+ --tw-font-weight: var(--font-weight-normal);
2077
+ font-weight: var(--font-weight-normal);
2078
+ }
2079
+ .font-semibold {
2080
+ --tw-font-weight: var(--font-weight-semibold);
2081
+ font-weight: var(--font-weight-semibold);
2082
+ }
2083
+ .text-nowrap {
2084
+ text-wrap: nowrap;
2085
+ }
2086
+ .text-ellipsis {
2087
+ text-overflow: ellipsis;
2088
+ }
2089
+ .whitespace-nowrap {
2090
+ white-space: nowrap;
2091
+ }
2092
+ .\!text-brand-text-on-action-primary-hover {
2093
+ color: var(--color-brand-text-on-action-primary-hover) !important;
2094
+ }
2095
+ .\!text-text-link-normal {
2096
+ color: var(--color-text-link-normal) !important;
2097
+ }
2098
+ .\!text-text-on-action-primary-hover {
2099
+ color: var(--color-text-on-action-primary-hover) !important;
2100
+ }
2101
+ .\!text-text-primary-disabled {
2102
+ color: var(--color-text-primary-disabled) !important;
2103
+ }
2104
+ .\!text-text-primary-error {
2105
+ color: var(--color-text-primary-error) !important;
2106
+ }
2107
+ .\!text-text-secondary-normal {
2108
+ color: var(--color-text-secondary-normal) !important;
2109
+ }
2110
+ .text-action-400 {
2111
+ color: var(--color-action-400);
2112
+ }
2113
+ .text-icon-action-critical-secondary-normal {
2114
+ color: var(--color-icon-action-critical-secondary-normal);
2115
+ }
2116
+ .text-icon-action-primary-disabled {
2117
+ color: var(--color-icon-action-primary-disabled);
2118
+ }
2119
+ .text-icon-action-primary-normal {
2120
+ color: var(--color-icon-action-primary-normal);
2121
+ }
2122
+ .text-icon-critical-normal {
2123
+ color: var(--color-icon-critical-normal);
2124
+ }
2125
+ .text-icon-on-action-primary-normal {
2126
+ color: var(--color-icon-on-action-primary-normal);
2127
+ }
2128
+ .text-icon-on-action-secondary-disabled {
2129
+ color: var(--color-icon-on-action-secondary-disabled);
2130
+ }
2131
+ .text-icon-on-action-secondary-normal {
2132
+ color: var(--color-icon-on-action-secondary-normal);
2133
+ }
2134
+ .text-icon-primary-normal {
2135
+ color: var(--color-icon-primary-normal);
2136
+ }
2137
+ .text-icon-success-normal {
2138
+ color: var(--color-icon-success-normal);
2139
+ }
2140
+ .text-icon-warning-normal {
2141
+ color: var(--color-icon-warning-normal);
2142
+ }
2143
+ .text-inherit {
2144
+ color: inherit;
2145
+ }
2146
+ .text-neutral-100 {
2147
+ color: var(--color-neutral-100);
2148
+ }
2149
+ .text-neutral-500 {
2150
+ color: var(--color-neutral-500);
2151
+ }
2152
+ .text-success-400 {
2153
+ color: var(--color-success-400);
2154
+ }
2155
+ .text-text-action-critical-disabled {
2156
+ color: var(--color-text-action-critical-disabled);
2157
+ }
2158
+ .text-text-action-critical-normal {
2159
+ color: var(--color-text-action-critical-normal);
2160
+ }
2161
+ .text-text-action-disabled {
2162
+ color: var(--color-text-action-disabled);
2163
+ }
2164
+ .text-text-action-primary-normal {
2165
+ color: var(--color-text-action-primary-normal);
2166
+ }
2167
+ .text-text-critical-normal {
2168
+ color: var(--color-text-critical-normal);
2169
+ }
2170
+ .text-text-link-disabled {
2171
+ color: var(--color-text-link-disabled);
2172
+ }
2173
+ .text-text-link-normal {
2174
+ color: var(--color-text-link-normal);
2175
+ }
2176
+ .text-text-on-action-primary-disabled {
2177
+ color: var(--color-text-on-action-primary-disabled);
2178
+ }
2179
+ .text-text-on-action-primary-normal {
2180
+ color: var(--color-text-on-action-primary-normal);
2181
+ }
2182
+ .text-text-primary-disabled {
2183
+ color: var(--color-text-primary-disabled);
2184
+ }
2185
+ .text-text-primary-normal {
2186
+ color: var(--color-text-primary-normal);
2187
+ }
2188
+ .text-text-secondary-normal {
2189
+ color: var(--color-text-secondary-normal);
2190
+ }
2191
+ .text-text-success-normal {
2192
+ color: var(--color-text-success-normal);
2193
+ }
2194
+ .text-text-warning-normal {
2195
+ color: var(--color-text-warning-normal);
2196
+ }
2197
+ .text-transparent {
2198
+ color: transparent;
2199
+ }
2200
+ .text-white {
2201
+ color: var(--color-white);
2202
+ }
2203
+ .uppercase {
2204
+ text-transform: uppercase;
2205
+ }
2206
+ .underline {
2207
+ text-decoration-line: underline;
2208
+ }
2209
+ .decoration-current {
2210
+ text-decoration-color: currentcolor;
2211
+ }
2212
+ .decoration-decoration-underline {
2213
+ text-decoration-color: var(--color-decoration-underline);
2214
+ }
2215
+ .decoration-\[10\%\] {
2216
+ text-decoration-thickness: 10%;
2217
+ }
2218
+ .underline-offset-\[32\%\] {
2219
+ text-underline-offset: 32%;
2220
+ }
2221
+ .\!caret-transparent {
2222
+ caret-color: transparent !important;
2223
+ }
2224
+ .caret-icon-on-action-secondary-normal {
2225
+ caret-color: var(--color-icon-on-action-secondary-normal);
2226
+ }
2227
+ .caret-text-action-normal {
2228
+ caret-color: var(--color-text-action-normal);
2229
+ }
2230
+ .opacity-0 {
2231
+ opacity: 0%;
2232
+ }
2233
+ .opacity-20 {
2234
+ opacity: 20%;
2235
+ }
2236
+ .opacity-40 {
2237
+ opacity: 40%;
2238
+ }
2239
+ .opacity-100 {
2240
+ opacity: 100%;
2241
+ }
2242
+ .shadow-2 {
2243
+ --tw-shadow: 0px 0px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.12)), 0px 2px 2px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.12));
2244
+ box-shadow:
2245
+ var(--tw-inset-shadow),
2246
+ var(--tw-inset-ring-shadow),
2247
+ var(--tw-ring-offset-shadow),
2248
+ var(--tw-ring-shadow),
2249
+ var(--tw-shadow);
2250
+ }
2251
+ .shadow-4 {
2252
+ --tw-shadow: 0px 0px 4px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.12)), 0px 4px 4px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.12));
2253
+ box-shadow:
2254
+ var(--tw-inset-shadow),
2255
+ var(--tw-inset-ring-shadow),
2256
+ var(--tw-ring-offset-shadow),
2257
+ var(--tw-ring-shadow),
2258
+ var(--tw-shadow);
2259
+ }
2260
+ .shadow-16 {
2261
+ --tw-shadow: 0px 0px 16px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.12)), 0px 16px 16px 0px var(--tw-shadow-color, rgba(0, 0, 0, 0.12));
2262
+ box-shadow:
2263
+ var(--tw-inset-shadow),
2264
+ var(--tw-inset-ring-shadow),
2265
+ var(--tw-ring-offset-shadow),
2266
+ var(--tw-ring-shadow),
2267
+ var(--tw-shadow);
2268
+ }
2269
+ .shadow-nav-tab {
2270
+ --tw-shadow: 0px -4px 4px -4px var(--tw-shadow-color, rgba(0, 0, 0, 0.32)) inset;
2271
+ box-shadow:
2272
+ var(--tw-inset-shadow),
2273
+ var(--tw-inset-ring-shadow),
2274
+ var(--tw-ring-offset-shadow),
2275
+ var(--tw-ring-shadow),
2276
+ var(--tw-shadow);
2277
+ }
2278
+ .shadow-none {
2279
+ --tw-shadow: 0 0 #0000;
2280
+ box-shadow:
2281
+ var(--tw-inset-shadow),
2282
+ var(--tw-inset-ring-shadow),
2283
+ var(--tw-ring-offset-shadow),
2284
+ var(--tw-ring-shadow),
2285
+ var(--tw-shadow);
2286
+ }
2287
+ .ring {
2288
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2289
+ box-shadow:
2290
+ var(--tw-inset-shadow),
2291
+ var(--tw-inset-ring-shadow),
2292
+ var(--tw-ring-offset-shadow),
2293
+ var(--tw-ring-shadow),
2294
+ var(--tw-shadow);
2295
+ }
2296
+ .ring-0 {
2297
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2298
+ box-shadow:
2299
+ var(--tw-inset-shadow),
2300
+ var(--tw-inset-ring-shadow),
2301
+ var(--tw-ring-offset-shadow),
2302
+ var(--tw-ring-shadow),
2303
+ var(--tw-shadow);
2304
+ }
2305
+ .outline {
2306
+ outline-style: var(--tw-outline-style);
2307
+ outline-width: 1px;
2308
+ }
2309
+ .outline-0 {
2310
+ outline-style: var(--tw-outline-style);
2311
+ outline-width: 0px;
2312
+ }
2313
+ .outline-1 {
2314
+ outline-style: var(--tw-outline-style);
2315
+ outline-width: 1px;
2316
+ }
2317
+ .outline-2 {
2318
+ outline-style: var(--tw-outline-style);
2319
+ outline-width: 2px;
2320
+ }
2321
+ .-outline-offset-1 {
2322
+ outline-offset: calc(1px * -1);
2323
+ }
2324
+ .-outline-offset-2 {
2325
+ outline-offset: calc(2px * -1);
2326
+ }
2327
+ .outline-transparent {
2328
+ outline-color: transparent;
2329
+ }
2330
+ .filter {
2331
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
2332
+ }
2333
+ .transition {
2334
+ transition-property:
2335
+ color,
2336
+ background-color,
2337
+ border-color,
2338
+ outline-color,
2339
+ text-decoration-color,
2340
+ fill,
2341
+ stroke,
2342
+ --tw-gradient-from,
2343
+ --tw-gradient-via,
2344
+ --tw-gradient-to,
2345
+ opacity,
2346
+ box-shadow,
2347
+ transform,
2348
+ translate,
2349
+ scale,
2350
+ rotate,
2351
+ filter,
2352
+ -webkit-backdrop-filter,
2353
+ backdrop-filter,
2354
+ display,
2355
+ visibility,
2356
+ content-visibility,
2357
+ overlay,
2358
+ pointer-events;
2359
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2360
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2361
+ }
2362
+ .transition-\[grid-template-rows\] {
2363
+ transition-property: grid-template-rows;
2364
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2365
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2366
+ }
2367
+ .transition-\[visibility\,opacity\,background\] {
2368
+ transition-property:
2369
+ visibility,
2370
+ opacity,
2371
+ background;
2372
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2373
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2374
+ }
2375
+ .transition-all {
2376
+ transition-property: all;
2377
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2378
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2379
+ }
2380
+ .transition-colors {
2381
+ transition-property:
2382
+ color,
2383
+ background-color,
2384
+ border-color,
2385
+ outline-color,
2386
+ text-decoration-color,
2387
+ fill,
2388
+ stroke,
2389
+ --tw-gradient-from,
2390
+ --tw-gradient-via,
2391
+ --tw-gradient-to;
2392
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2393
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2394
+ }
2395
+ .transition-opacity {
2396
+ transition-property: opacity;
2397
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2398
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2399
+ }
2400
+ .transition-transform {
2401
+ transition-property:
2402
+ transform,
2403
+ translate,
2404
+ scale,
2405
+ rotate;
2406
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
2407
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
2408
+ }
2409
+ .duration-100 {
2410
+ --tw-duration: 100ms;
2411
+ transition-duration: 100ms;
2412
+ }
2413
+ .duration-200 {
2414
+ --tw-duration: 200ms;
2415
+ transition-duration: 200ms;
2416
+ }
2417
+ .duration-300 {
2418
+ --tw-duration: 300ms;
2419
+ transition-duration: 300ms;
2420
+ }
2421
+ .ease-in-out {
2422
+ --tw-ease: var(--ease-in-out);
2423
+ transition-timing-function: var(--ease-in-out);
2424
+ }
2425
+ .will-change-transform {
2426
+ will-change: transform;
2427
+ }
2428
+ .contain-paint {
2429
+ --tw-contain-paint: paint;
2430
+ contain: var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,);
2431
+ }
2432
+ .outline-none {
2433
+ --tw-outline-style: none;
2434
+ outline-style: none;
2435
+ }
2436
+ .select-none {
2437
+ -webkit-user-select: none;
2438
+ user-select: none;
2439
+ }
2440
+ .scrollbar {
2441
+ scrollbar-color: var(--dmsi-scrollbar-thumb-color, var(--color-gray-400)) var(--dmsi-scrollbar-track-color, var(--color-gray-100));
2442
+ }
2443
+ .scrollbar-thin {
2444
+ scrollbar-width: thin;
2445
+ }
2446
+ .\*\:max-h-\[inherit\] {
2447
+ :is(& > *) {
2448
+ max-height: inherit;
2449
+ }
2450
+ }
2451
+ .\*\:py-mobile-component-padding {
2452
+ :is(& > *) {
2453
+ padding-block: var(--spacing-mobile-component-padding);
2454
+ }
2455
+ }
2456
+ .group-hover\:block {
2457
+ &:is(:where(.group):hover *) {
2458
+ @media (hover: hover) {
2459
+ display: block;
2460
+ }
2461
+ }
2462
+ }
2463
+ .group-data-\[checked\]\:translate-x-3 {
2464
+ &:is(:where(.group)[data-checked] *) {
2465
+ --tw-translate-x: calc(var(--spacing) * 3);
2466
+ translate: var(--tw-translate-x) var(--tw-translate-y);
2467
+ }
2468
+ }
2469
+ .peer-checked\:border-0 {
2470
+ &:is(:where(.peer):checked ~ *) {
2471
+ border-style: var(--tw-border-style);
2472
+ border-width: 0px;
2473
+ }
2474
+ }
2475
+ .peer-checked\:border-icon-on-action-primary-disabled {
2476
+ &:is(:where(.peer):checked ~ *) {
2477
+ border-color: var(--color-icon-on-action-primary-disabled);
2478
+ }
2479
+ }
2480
+ .peer-checked\:border-transparent {
2481
+ &:is(:where(.peer):checked ~ *) {
2482
+ border-color: transparent;
2483
+ }
2484
+ }
2485
+ .peer-checked\:bg-background-action-critical-secondary-hover {
2486
+ &:is(:where(.peer):checked ~ *) {
2487
+ background-color: var(--color-background-action-critical-secondary-hover);
2488
+ }
2489
+ }
2490
+ .peer-checked\:bg-background-action-secondary-hover {
2491
+ &:is(:where(.peer):checked ~ *) {
2492
+ background-color: var(--color-background-action-secondary-hover);
2493
+ }
2494
+ }
2495
+ .peer-checked\:bg-icon-on-action-primary-disabled {
2496
+ &:is(:where(.peer):checked ~ *) {
2497
+ background-color: var(--color-icon-on-action-primary-disabled);
2498
+ }
2499
+ }
2500
+ .peer-checked\:bg-transparent {
2501
+ &:is(:where(.peer):checked ~ *) {
2502
+ background-color: transparent;
2503
+ }
2504
+ }
2505
+ .peer-read-only\:border-border-primary-normal {
2506
+ &:is(:where(.peer):read-only ~ *) {
2507
+ border-color: var(--color-border-primary-normal);
2508
+ }
2509
+ }
2510
+ .peer-read-only\:bg-background-action-secondary-disabled {
2511
+ &:is(:where(.peer):read-only ~ *) {
2512
+ background-color: var(--color-background-action-secondary-disabled);
2513
+ }
2514
+ }
2515
+ .peer-hover\:border-background-action-critical-primary-hover {
2516
+ &:is(:where(.peer):hover ~ *) {
2517
+ @media (hover: hover) {
2518
+ border-color: var(--color-background-action-critical-primary-hover);
2519
+ }
2520
+ }
2521
+ }
2522
+ .peer-hover\:border-background-action-primary-hover {
2523
+ &:is(:where(.peer):hover ~ *) {
2524
+ @media (hover: hover) {
2525
+ border-color: var(--color-background-action-primary-hover);
2526
+ }
2527
+ }
2528
+ }
2529
+ .peer-hover\:border-border-action-critical-hover {
2530
+ &:is(:where(.peer):hover ~ *) {
2531
+ @media (hover: hover) {
2532
+ border-color: var(--color-border-action-critical-hover);
2533
+ }
2534
+ }
2535
+ }
2536
+ .peer-hover\:border-border-action-hover {
2537
+ &:is(:where(.peer):hover ~ *) {
2538
+ @media (hover: hover) {
2539
+ border-color: var(--color-border-action-hover);
2540
+ }
2541
+ }
2542
+ }
2543
+ .peer-hover\:bg-background-action-critical-primary-hover {
2544
+ &:is(:where(.peer):hover ~ *) {
2545
+ @media (hover: hover) {
2546
+ background-color: var(--color-background-action-critical-primary-hover);
2547
+ }
2548
+ }
2549
+ }
2550
+ .peer-hover\:bg-background-action-critical-secondary-hover {
2551
+ &:is(:where(.peer):hover ~ *) {
2552
+ @media (hover: hover) {
2553
+ background-color: var(--color-background-action-critical-secondary-hover);
2554
+ }
2555
+ }
2556
+ }
2557
+ .peer-hover\:bg-background-action-primary-hover {
2558
+ &:is(:where(.peer):hover ~ *) {
2559
+ @media (hover: hover) {
2560
+ background-color: var(--color-background-action-primary-hover);
2561
+ }
2562
+ }
2563
+ }
2564
+ .peer-hover\:bg-background-action-secondary-hover {
2565
+ &:is(:where(.peer):hover ~ *) {
2566
+ @media (hover: hover) {
2567
+ background-color: var(--color-background-action-secondary-hover);
2568
+ }
2569
+ }
2570
+ }
2571
+ .peer-hover\:bg-border-action-hover {
2572
+ &:is(:where(.peer):hover ~ *) {
2573
+ @media (hover: hover) {
2574
+ background-color: var(--color-border-action-hover);
2575
+ }
2576
+ }
2577
+ }
2578
+ .peer-hover\:text-icon-action-critical-secondary-hover {
2579
+ &:is(:where(.peer):hover ~ *) {
2580
+ @media (hover: hover) {
2581
+ color: var(--color-icon-action-critical-secondary-hover);
2582
+ }
2583
+ }
2584
+ }
2585
+ .peer-hover\:text-icon-on-action-secondary-hover {
2586
+ &:is(:where(.peer):hover ~ *) {
2587
+ @media (hover: hover) {
2588
+ color: var(--color-icon-on-action-secondary-hover);
2589
+ }
2590
+ }
2591
+ }
2592
+ .peer-focus\:border-border-action-critical-hover {
2593
+ &:is(:where(.peer):focus ~ *) {
2594
+ border-color: var(--color-border-action-critical-hover);
2595
+ }
2596
+ }
2597
+ .peer-focus\:border-border-action-hover {
2598
+ &:is(:where(.peer):focus ~ *) {
2599
+ border-color: var(--color-border-action-hover);
2600
+ }
2601
+ }
2602
+ .peer-focus\:bg-background-action-critical-secondary-hover {
2603
+ &:is(:where(.peer):focus ~ *) {
2604
+ background-color: var(--color-background-action-critical-secondary-hover);
2605
+ }
2606
+ }
2607
+ .peer-focus\:bg-background-action-secondary-hover {
2608
+ &:is(:where(.peer):focus ~ *) {
2609
+ background-color: var(--color-background-action-secondary-hover);
2610
+ }
2611
+ }
2612
+ .peer-focus\:text-icon-action-critical-secondary-hover {
2613
+ &:is(:where(.peer):focus ~ *) {
2614
+ color: var(--color-icon-action-critical-secondary-hover);
2615
+ }
2616
+ }
2617
+ .peer-focus\:text-icon-on-action-secondary-hover {
2618
+ &:is(:where(.peer):focus ~ *) {
2619
+ color: var(--color-icon-on-action-secondary-hover);
2620
+ }
2621
+ }
2622
+ .peer-active\:border-background-action-critical-primary-active {
2623
+ &:is(:where(.peer):active ~ *) {
2624
+ border-color: var(--color-background-action-critical-primary-active);
2625
+ }
2626
+ }
2627
+ .peer-active\:border-background-action-primary-active {
2628
+ &:is(:where(.peer):active ~ *) {
2629
+ border-color: var(--color-background-action-primary-active);
2630
+ }
2631
+ }
2632
+ .peer-active\:border-border-action-active {
2633
+ &:is(:where(.peer):active ~ *) {
2634
+ border-color: var(--color-border-action-active);
2635
+ }
2636
+ }
2637
+ .peer-active\:border-border-action-critical-active {
2638
+ &:is(:where(.peer):active ~ *) {
2639
+ border-color: var(--color-border-action-critical-active);
2640
+ }
2641
+ }
2642
+ .peer-active\:bg-background-action-critical-primary-active {
2643
+ &:is(:where(.peer):active ~ *) {
2644
+ background-color: var(--color-background-action-critical-primary-active);
2645
+ }
2646
+ }
2647
+ .peer-active\:bg-background-action-primary-active {
2648
+ &:is(:where(.peer):active ~ *) {
2649
+ background-color: var(--color-background-action-primary-active);
2650
+ }
2651
+ }
2652
+ .peer-active\:bg-background-action-secondary-active {
2653
+ &:is(:where(.peer):active ~ *) {
2654
+ background-color: var(--color-background-action-secondary-active);
2655
+ }
2656
+ }
2657
+ .peer-active\:bg-border-action-active {
2658
+ &:is(:where(.peer):active ~ *) {
2659
+ background-color: var(--color-border-action-active);
2660
+ }
2661
+ }
2662
+ .peer-active\:text-icon-action-critical-secondary-active {
2663
+ &:is(:where(.peer):active ~ *) {
2664
+ color: var(--color-icon-action-critical-secondary-active);
2665
+ }
2666
+ }
2667
+ .peer-active\:text-icon-on-action-secondary-active {
2668
+ &:is(:where(.peer):active ~ *) {
2669
+ color: var(--color-icon-on-action-secondary-active);
2670
+ }
2671
+ }
2672
+ .peer-disabled\:border-border-primary-normal {
2673
+ &:is(:where(.peer):disabled ~ *) {
2674
+ border-color: var(--color-border-primary-normal);
2675
+ }
2676
+ }
2677
+ .peer-disabled\:bg-background-action-secondary-disabled {
2678
+ &:is(:where(.peer):disabled ~ *) {
2679
+ background-color: var(--color-background-action-secondary-disabled);
2680
+ }
2681
+ }
2682
+ .placeholder\:text-text-secondary-normal {
2683
+ &::placeholder {
2684
+ color: var(--color-text-secondary-normal);
2685
+ }
2686
+ }
2687
+ .after\:absolute {
2688
+ &::after {
2689
+ content: var(--tw-content);
2690
+ position: absolute;
2691
+ }
2692
+ }
2693
+ .after\:bottom-0 {
2694
+ &::after {
2695
+ content: var(--tw-content);
2696
+ bottom: calc(var(--spacing) * 0);
2697
+ }
2698
+ }
2699
+ .after\:left-0 {
2700
+ &::after {
2701
+ content: var(--tw-content);
2702
+ left: calc(var(--spacing) * 0);
2703
+ }
2704
+ }
2705
+ .after\:h-0\.5 {
2706
+ &::after {
2707
+ content: var(--tw-content);
2708
+ height: calc(var(--spacing) * 0.5);
2709
+ }
2710
+ }
2711
+ .after\:w-full {
2712
+ &::after {
2713
+ content: var(--tw-content);
2714
+ width: 100%;
2715
+ }
2716
+ }
2717
+ .after\:bg-border-primary-normal {
2718
+ &::after {
2719
+ content: var(--tw-content);
2720
+ background-color: var(--color-border-primary-normal);
2721
+ }
2722
+ }
2723
+ .\*\:first\:flex-1 {
2724
+ :is(& > *) {
2725
+ &:first-child {
2726
+ flex: 1;
2727
+ }
2728
+ }
2729
+ }
2730
+ .\*\:first\:py-mobile-component-padding {
2731
+ :is(& > *) {
2732
+ &:first-child {
2733
+ padding-block: var(--spacing-mobile-component-padding);
2734
+ }
2735
+ }
2736
+ }
2737
+ .odd\:bg-background-grouped-primary-normal {
2738
+ &:nth-child(odd) {
2739
+ background-color: var(--color-background-grouped-primary-normal);
2740
+ }
2741
+ }
2742
+ .odd\:bg-background-grouped-secondary-normal {
2743
+ &:nth-child(odd) {
2744
+ background-color: var(--color-background-grouped-secondary-normal);
2745
+ }
2746
+ }
2747
+ .even\:bg-background-grouped-primary-normal {
2748
+ &:nth-child(even) {
2749
+ background-color: var(--color-background-grouped-primary-normal);
2750
+ }
2751
+ }
2752
+ .even\:bg-background-grouped-secondary-normal {
2753
+ &:nth-child(even) {
2754
+ background-color: var(--color-background-grouped-secondary-normal);
2755
+ }
2756
+ }
2757
+ .read-only\:resize-none {
2758
+ &:read-only {
2759
+ resize: none;
2760
+ }
2761
+ }
2762
+ .read-only\:appearance-none {
2763
+ &:read-only {
2764
+ appearance: none;
2765
+ }
2766
+ }
2767
+ .read-only\:border-transparent {
2768
+ &:read-only {
2769
+ border-color: transparent;
2770
+ }
2771
+ }
2772
+ .read-only\:bg-transparent {
2773
+ &:read-only {
2774
+ background-color: transparent;
2775
+ }
2776
+ }
2777
+ .read-only\:outline-none {
2778
+ &:read-only {
2779
+ --tw-outline-style: none;
2780
+ outline-style: none;
2781
+ }
2782
+ }
2783
+ .read-only\:not-disabled\:pl-0 {
2784
+ &:read-only {
2785
+ &:not(*:disabled) {
2786
+ padding-left: calc(var(--spacing) * 0);
2787
+ }
2788
+ }
2789
+ }
2790
+ .focus-within\:\!z-10 {
2791
+ &:focus-within {
2792
+ z-index: 10 !important;
2793
+ }
2794
+ }
2795
+ .focus-within\:border-transparent {
2796
+ &:focus-within {
2797
+ border-color: transparent;
2798
+ }
2799
+ }
2800
+ .focus-within\:outline-border-primary-focus {
2801
+ &:focus-within {
2802
+ outline-color: var(--color-border-primary-focus);
2803
+ }
2804
+ }
2805
+ .hover\:border-action-500 {
2806
+ &:hover {
2807
+ @media (hover: hover) {
2808
+ border-color: var(--color-action-500);
2809
+ }
2810
+ }
2811
+ }
2812
+ .hover\:border-background-action-critical-primary-hover {
2813
+ &:hover {
2814
+ @media (hover: hover) {
2815
+ border-color: var(--color-background-action-critical-primary-hover);
2816
+ }
2817
+ }
2818
+ }
2819
+ .hover\:border-background-action-critical-secondary-hover {
2820
+ &:hover {
2821
+ @media (hover: hover) {
2822
+ border-color: var(--color-background-action-critical-secondary-hover);
2823
+ }
2824
+ }
2825
+ }
2826
+ .hover\:border-background-action-primary-hover {
2827
+ &:hover {
2828
+ @media (hover: hover) {
2829
+ border-color: var(--color-background-action-primary-hover);
2830
+ }
2831
+ }
2832
+ }
2833
+ .hover\:border-background-action-secondary-hover {
2834
+ &:hover {
2835
+ @media (hover: hover) {
2836
+ border-color: var(--color-background-action-secondary-hover);
2837
+ }
2838
+ }
2839
+ }
2840
+ .hover\:border-border-action-critical-hover {
2841
+ &:hover {
2842
+ @media (hover: hover) {
2843
+ border-color: var(--color-border-action-critical-hover);
2844
+ }
2845
+ }
2846
+ }
2847
+ .hover\:border-border-action-hover {
2848
+ &:hover {
2849
+ @media (hover: hover) {
2850
+ border-color: var(--color-border-action-hover);
2851
+ }
2852
+ }
2853
+ }
2854
+ .hover\:\!bg-background-action-primary-normal {
2855
+ &:hover {
2856
+ @media (hover: hover) {
2857
+ background-color: var(--color-background-action-primary-normal) !important;
2858
+ }
2859
+ }
2860
+ }
2861
+ .hover\:\!bg-background-on-action-primary-normal {
2862
+ &:hover {
2863
+ @media (hover: hover) {
2864
+ background-color: var(--color-background-on-action-primary-normal) !important;
2865
+ }
2866
+ }
2867
+ }
2868
+ .hover\:bg-action-100 {
2869
+ &:hover {
2870
+ @media (hover: hover) {
2871
+ background-color: var(--color-action-100);
2872
+ }
2873
+ }
2874
+ }
2875
+ .hover\:bg-action-500 {
2876
+ &:hover {
2877
+ @media (hover: hover) {
2878
+ background-color: var(--color-action-500);
2879
+ }
2880
+ }
2881
+ }
2882
+ .hover\:bg-background-action-critical-primary-hover {
2883
+ &:hover {
2884
+ @media (hover: hover) {
2885
+ background-color: var(--color-background-action-critical-primary-hover);
2886
+ }
2887
+ }
2888
+ }
2889
+ .hover\:bg-background-action-critical-secondary-hover {
2890
+ &:hover {
2891
+ @media (hover: hover) {
2892
+ background-color: var(--color-background-action-critical-secondary-hover);
2893
+ }
2894
+ }
2895
+ }
2896
+ .hover\:bg-background-action-primary-hover {
2897
+ &:hover {
2898
+ @media (hover: hover) {
2899
+ background-color: var(--color-background-action-primary-hover);
2900
+ }
2901
+ }
2902
+ }
2903
+ .hover\:bg-background-action-secondary-hover {
2904
+ &:hover {
2905
+ @media (hover: hover) {
2906
+ background-color: var(--color-background-action-secondary-hover);
2907
+ }
2908
+ }
2909
+ }
2910
+ .hover\:\!text-brand-text-on-action-primary-hover {
2911
+ &:hover {
2912
+ @media (hover: hover) {
2913
+ color: var(--color-brand-text-on-action-primary-hover) !important;
2914
+ }
2915
+ }
2916
+ }
2917
+ .hover\:\!text-text-action-primary-hover {
2918
+ &:hover {
2919
+ @media (hover: hover) {
2920
+ color: var(--color-text-action-primary-hover) !important;
2921
+ }
2922
+ }
2923
+ }
2924
+ .hover\:\!text-text-on-action-primary-hover {
2925
+ &:hover {
2926
+ @media (hover: hover) {
2927
+ color: var(--color-text-on-action-primary-hover) !important;
2928
+ }
2929
+ }
2930
+ }
2931
+ .hover\:text-action-500 {
2932
+ &:hover {
2933
+ @media (hover: hover) {
2934
+ color: var(--color-action-500);
2935
+ }
2936
+ }
2937
+ }
2938
+ .hover\:text-icon-action-critical-secondary-hover {
2939
+ &:hover {
2940
+ @media (hover: hover) {
2941
+ color: var(--color-icon-action-critical-secondary-hover);
2942
+ }
2943
+ }
2944
+ }
2945
+ .hover\:text-icon-on-action-secondary-hover {
2946
+ &:hover {
2947
+ @media (hover: hover) {
2948
+ color: var(--color-icon-on-action-secondary-hover);
2949
+ }
2950
+ }
2951
+ }
2952
+ .hover\:text-text-action-critical-hover {
2953
+ &:hover {
2954
+ @media (hover: hover) {
2955
+ color: var(--color-text-action-critical-hover);
2956
+ }
2957
+ }
2958
+ }
2959
+ .hover\:text-text-action-hover {
2960
+ &:hover {
2961
+ @media (hover: hover) {
2962
+ color: var(--color-text-action-hover);
2963
+ }
2964
+ }
2965
+ }
2966
+ .hover\:text-text-action-primary-hover {
2967
+ &:hover {
2968
+ @media (hover: hover) {
2969
+ color: var(--color-text-action-primary-hover);
2970
+ }
2971
+ }
2972
+ }
2973
+ .hover\:text-text-action-primary-normal {
2974
+ &:hover {
2975
+ @media (hover: hover) {
2976
+ color: var(--color-text-action-primary-normal);
2977
+ }
2978
+ }
2979
+ }
2980
+ .hover\:text-text-link-hover {
2981
+ &:hover {
2982
+ @media (hover: hover) {
2983
+ color: var(--color-text-link-hover);
2984
+ }
2985
+ }
2986
+ }
2987
+ .hover\:text-white {
2988
+ &:hover {
2989
+ @media (hover: hover) {
2990
+ color: var(--color-white);
2991
+ }
2992
+ }
2993
+ }
2994
+ .hover\:decoration-current {
2995
+ &:hover {
2996
+ @media (hover: hover) {
2997
+ text-decoration-color: currentcolor;
2998
+ }
2999
+ }
3000
+ }
3001
+ .focus\:border-background-action-critical-primary-hover {
3002
+ &:focus {
3003
+ border-color: var(--color-background-action-critical-primary-hover);
3004
+ }
3005
+ }
3006
+ .focus\:border-background-action-critical-secondary-hover {
3007
+ &:focus {
3008
+ border-color: var(--color-background-action-critical-secondary-hover);
3009
+ }
3010
+ }
3011
+ .focus\:border-background-action-primary-hover {
3012
+ &:focus {
3013
+ border-color: var(--color-background-action-primary-hover);
3014
+ }
3015
+ }
3016
+ .focus\:border-background-action-secondary-hover {
3017
+ &:focus {
3018
+ border-color: var(--color-background-action-secondary-hover);
3019
+ }
3020
+ }
3021
+ .focus\:border-border-action-critical-hover {
3022
+ &:focus {
3023
+ border-color: var(--color-border-action-critical-hover);
3024
+ }
3025
+ }
3026
+ .focus\:border-border-action-hover {
3027
+ &:focus {
3028
+ border-color: var(--color-border-action-hover);
3029
+ }
3030
+ }
3031
+ .focus\:border-transparent {
3032
+ &:focus {
3033
+ border-color: transparent;
3034
+ }
3035
+ }
3036
+ .focus\:bg-background-action-critical-primary-hover {
3037
+ &:focus {
3038
+ background-color: var(--color-background-action-critical-primary-hover);
3039
+ }
3040
+ }
3041
+ .focus\:bg-background-action-critical-secondary-hover {
3042
+ &:focus {
3043
+ background-color: var(--color-background-action-critical-secondary-hover);
3044
+ }
3045
+ }
3046
+ .focus\:bg-background-action-primary-hover {
3047
+ &:focus {
3048
+ background-color: var(--color-background-action-primary-hover);
3049
+ }
3050
+ }
3051
+ .focus\:bg-background-action-secondary-hover {
3052
+ &:focus {
3053
+ background-color: var(--color-background-action-secondary-hover);
3054
+ }
3055
+ }
3056
+ .focus\:text-text-action-critical-hover {
3057
+ &:focus {
3058
+ color: var(--color-text-action-critical-hover);
3059
+ }
3060
+ }
3061
+ .focus\:text-text-action-hover {
3062
+ &:focus {
3063
+ color: var(--color-text-action-hover);
3064
+ }
3065
+ }
3066
+ .focus\:text-text-action-primary-hover {
3067
+ &:focus {
3068
+ color: var(--color-text-action-primary-hover);
3069
+ }
3070
+ }
3071
+ .focus\:outline-0 {
3072
+ &:focus {
3073
+ outline-style: var(--tw-outline-style);
3074
+ outline-width: 0px;
3075
+ }
3076
+ }
3077
+ .focus\:outline-2 {
3078
+ &:focus {
3079
+ outline-style: var(--tw-outline-style);
3080
+ outline-width: 2px;
3081
+ }
3082
+ }
3083
+ .focus\:-outline-offset-2 {
3084
+ &:focus {
3085
+ outline-offset: calc(2px * -1);
3086
+ }
3087
+ }
3088
+ .focus\:outline-border-primary-focus {
3089
+ &:focus {
3090
+ outline-color: var(--color-border-primary-focus);
3091
+ }
3092
+ }
3093
+ .focus\:outline-neutral-300 {
3094
+ &:focus {
3095
+ outline-color: var(--color-neutral-300);
3096
+ }
3097
+ }
3098
+ .focus\:outline-neutral-400 {
3099
+ &:focus {
3100
+ outline-color: var(--color-neutral-400);
3101
+ }
3102
+ }
3103
+ .focus\:outline-none {
3104
+ &:focus {
3105
+ --tw-outline-style: none;
3106
+ outline-style: none;
3107
+ }
3108
+ }
3109
+ .focus-visible\:ring-2 {
3110
+ &:focus-visible {
3111
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
3112
+ box-shadow:
3113
+ var(--tw-inset-shadow),
3114
+ var(--tw-inset-ring-shadow),
3115
+ var(--tw-ring-offset-shadow),
3116
+ var(--tw-ring-shadow),
3117
+ var(--tw-shadow);
3118
+ }
3119
+ }
3120
+ .focus-visible\:ring-action-400 {
3121
+ &:focus-visible {
3122
+ --tw-ring-color: var(--color-action-400);
3123
+ }
3124
+ }
3125
+ .focus-visible\:outline-none {
3126
+ &:focus-visible {
3127
+ --tw-outline-style: none;
3128
+ outline-style: none;
3129
+ }
3130
+ }
3131
+ .active\:border-background-action-critical-primary-active {
3132
+ &:active {
3133
+ border-color: var(--color-background-action-critical-primary-active);
3134
+ }
3135
+ }
3136
+ .active\:border-background-action-critical-secondary-active {
3137
+ &:active {
3138
+ border-color: var(--color-background-action-critical-secondary-active);
3139
+ }
3140
+ }
3141
+ .active\:border-background-action-primary-active {
3142
+ &:active {
3143
+ border-color: var(--color-background-action-primary-active);
3144
+ }
3145
+ }
3146
+ .active\:border-border-action-active {
3147
+ &:active {
3148
+ border-color: var(--color-border-action-active);
3149
+ }
3150
+ }
3151
+ .active\:border-border-action-critical-active {
3152
+ &:active {
3153
+ border-color: var(--color-border-action-critical-active);
3154
+ }
3155
+ }
3156
+ .active\:border-transparent {
3157
+ &:active {
3158
+ border-color: transparent;
3159
+ }
3160
+ }
3161
+ .active\:\!bg-background-action-primary-active {
3162
+ &:active {
3163
+ background-color: var(--color-background-action-primary-active) !important;
3164
+ }
3165
+ }
3166
+ .active\:\!bg-background-on-action-primary-active {
3167
+ &:active {
3168
+ background-color: var(--color-background-on-action-primary-active) !important;
3169
+ }
3170
+ }
3171
+ .active\:bg-action-300 {
3172
+ &:active {
3173
+ background-color: var(--color-action-300);
3174
+ }
3175
+ }
3176
+ .active\:bg-background-action-critical-primary-active {
3177
+ &:active {
3178
+ background-color: var(--color-background-action-critical-primary-active);
3179
+ }
3180
+ }
3181
+ .active\:bg-background-action-critical-secondary-active {
3182
+ &:active {
3183
+ background-color: var(--color-background-action-critical-secondary-active);
3184
+ }
3185
+ }
3186
+ .active\:bg-background-action-primary-active {
3187
+ &:active {
3188
+ background-color: var(--color-background-action-primary-active);
3189
+ }
3190
+ }
3191
+ .active\:bg-background-action-secondary-active {
3192
+ &:active {
3193
+ background-color: var(--color-background-action-secondary-active);
3194
+ }
3195
+ }
3196
+ .active\:\!text-brand-text-on-action-primary-active {
3197
+ &:active {
3198
+ color: var(--color-brand-text-on-action-primary-active) !important;
3199
+ }
3200
+ }
3201
+ .active\:\!text-text-action-primary-active {
3202
+ &:active {
3203
+ color: var(--color-text-action-primary-active) !important;
3204
+ }
3205
+ }
3206
+ .active\:\!text-text-on-action-primary-active {
3207
+ &:active {
3208
+ color: var(--color-text-on-action-primary-active) !important;
3209
+ }
3210
+ }
3211
+ .active\:text-action-300 {
3212
+ &:active {
3213
+ color: var(--color-action-300);
3214
+ }
3215
+ }
3216
+ .active\:text-icon-action-critical-secondary-active {
3217
+ &:active {
3218
+ color: var(--color-icon-action-critical-secondary-active);
3219
+ }
3220
+ }
3221
+ .active\:text-icon-on-action-secondary-active {
3222
+ &:active {
3223
+ color: var(--color-icon-on-action-secondary-active);
3224
+ }
3225
+ }
3226
+ .active\:text-text-action-active {
3227
+ &:active {
3228
+ color: var(--color-text-action-active);
3229
+ }
3230
+ }
3231
+ .active\:text-text-action-critical-active {
3232
+ &:active {
3233
+ color: var(--color-text-action-critical-active);
3234
+ }
3235
+ }
3236
+ .active\:text-text-action-primary-active {
3237
+ &:active {
3238
+ color: var(--color-text-action-primary-active);
3239
+ }
3240
+ }
3241
+ .active\:text-text-link-active {
3242
+ &:active {
3243
+ color: var(--color-text-link-active);
3244
+ }
3245
+ }
3246
+ .active\:text-white {
3247
+ &:active {
3248
+ color: var(--color-white);
3249
+ }
3250
+ }
3251
+ .active\:decoration-decoration-underline {
3252
+ &:active {
3253
+ text-decoration-color: var(--color-decoration-underline);
3254
+ }
3255
+ }
3256
+ .disabled\:pointer-events-none {
3257
+ &:disabled {
3258
+ pointer-events: none;
3259
+ }
3260
+ }
3261
+ .disabled\:\!border-border-primary-normal {
3262
+ &:disabled {
3263
+ border-color: var(--color-border-primary-normal) !important;
3264
+ }
3265
+ }
3266
+ .disabled\:border-background-action-critical-primary-disabled {
3267
+ &:disabled {
3268
+ border-color: var(--color-background-action-critical-primary-disabled);
3269
+ }
3270
+ }
3271
+ .disabled\:border-background-action-primary-disabled {
3272
+ &:disabled {
3273
+ border-color: var(--color-background-action-primary-disabled);
3274
+ }
3275
+ }
3276
+ .disabled\:border-border-action-critical-disabled {
3277
+ &:disabled {
3278
+ border-color: var(--color-border-action-critical-disabled);
3279
+ }
3280
+ }
3281
+ .disabled\:border-border-action-disabled {
3282
+ &:disabled {
3283
+ border-color: var(--color-border-action-disabled);
3284
+ }
3285
+ }
3286
+ .disabled\:border-border-primary-normal {
3287
+ &:disabled {
3288
+ border-color: var(--color-border-primary-normal);
3289
+ }
3290
+ }
3291
+ .disabled\:border-transparent {
3292
+ &:disabled {
3293
+ border-color: transparent;
3294
+ }
3295
+ }
3296
+ .disabled\:\!bg-background-action-secondary-disabled {
3297
+ &:disabled {
3298
+ background-color: var(--color-background-action-secondary-disabled) !important;
3299
+ }
3300
+ }
3301
+ .disabled\:\!bg-background-on-action-primary-disabled {
3302
+ &:disabled {
3303
+ background-color: var(--color-background-on-action-primary-disabled) !important;
3304
+ }
3305
+ }
3306
+ .disabled\:bg-background-action-critical-disabled {
3307
+ &:disabled {
3308
+ background-color: var(--color-background-action-critical-disabled);
3309
+ }
3310
+ }
3311
+ .disabled\:bg-background-action-critical-primary-disabled {
3312
+ &:disabled {
3313
+ background-color: var(--color-background-action-critical-primary-disabled);
3314
+ }
3315
+ }
3316
+ .disabled\:bg-background-action-primary-disabled {
3317
+ &:disabled {
3318
+ background-color: var(--color-background-action-primary-disabled);
3319
+ }
3320
+ }
3321
+ .disabled\:bg-background-action-secondary-disabled {
3322
+ &:disabled {
3323
+ background-color: var(--color-background-action-secondary-disabled);
3324
+ }
3325
+ }
3326
+ .disabled\:bg-neutral-200 {
3327
+ &:disabled {
3328
+ background-color: var(--color-neutral-200);
3329
+ }
3330
+ }
3331
+ .disabled\:bg-transparent {
3332
+ &:disabled {
3333
+ background-color: transparent;
3334
+ }
3335
+ }
3336
+ .disabled\:\!text-text-on-action-primary-disabled {
3337
+ &:disabled {
3338
+ color: var(--color-text-on-action-primary-disabled) !important;
3339
+ }
3340
+ }
3341
+ .disabled\:text-neutral-300 {
3342
+ &:disabled {
3343
+ color: var(--color-neutral-300);
3344
+ }
3345
+ }
3346
+ .disabled\:text-neutral-400 {
3347
+ &:disabled {
3348
+ color: var(--color-neutral-400);
3349
+ }
3350
+ }
3351
+ .disabled\:text-text-action-critical-disabled {
3352
+ &:disabled {
3353
+ color: var(--color-text-action-critical-disabled);
3354
+ }
3355
+ }
3356
+ .disabled\:text-text-action-primary-disabled {
3357
+ &:disabled {
3358
+ color: var(--color-text-action-primary-disabled);
3359
+ }
3360
+ }
3361
+ .disabled\:text-text-on-action-primary-disabled {
3362
+ &:disabled {
3363
+ color: var(--color-text-on-action-primary-disabled);
3364
+ }
3365
+ }
3366
+ .disabled\:text-text-primary-disabled {
3367
+ &:disabled {
3368
+ color: var(--color-text-primary-disabled);
3369
+ }
3370
+ }
3371
+ .disabled\:text-text-secondary-disabled {
3372
+ &:disabled {
3373
+ color: var(--color-text-secondary-disabled);
3374
+ }
3375
+ }
3376
+ .has-disabled\:bg-background-action-secondary-disabled {
3377
+ &:has(*:disabled) {
3378
+ background-color: var(--color-background-action-secondary-disabled);
3379
+ }
3380
+ }
3381
+ .has-disabled\:text-text-primary-disabled {
3382
+ &:has(*:disabled) {
3383
+ color: var(--color-text-primary-disabled);
3384
+ }
3385
+ }
3386
+ .has-\[\[data-error\]\]\:border-transparent {
3387
+ &:has(*:is([data-error])) {
3388
+ border-color: transparent;
3389
+ }
3390
+ }
3391
+ .has-\[\[data-error\]\]\:text-text-primary-error {
3392
+ &:has(*:is([data-error])) {
3393
+ color: var(--color-text-primary-error);
3394
+ }
3395
+ }
3396
+ .has-\[\[data-error\]\]\:not-focus-within\:outline-1 {
3397
+ &:has(*:is([data-error])) {
3398
+ &:not(*:focus-within) {
3399
+ outline-style: var(--tw-outline-style);
3400
+ outline-width: 1px;
3401
+ }
3402
+ }
3403
+ }
3404
+ .has-\[\[data-error\]\]\:not-focus-within\:outline-border-primary-error {
3405
+ &:has(*:is([data-error])) {
3406
+ &:not(*:focus-within) {
3407
+ outline-color: var(--color-border-primary-error);
3408
+ }
3409
+ }
3410
+ }
3411
+ .has-\[\[data-focus\]\]\:border-transparent {
3412
+ &:has(*:is([data-focus])) {
3413
+ border-color: transparent;
3414
+ }
3415
+ }
3416
+ .has-\[\[data-focus\]\]\:outline-border-primary-focus {
3417
+ &:has(*:is([data-focus])) {
3418
+ outline-color: var(--color-border-primary-focus);
3419
+ }
3420
+ }
3421
+ .has-\[input\:not\(\:disabled\)\:read-only\]\:border-transparent {
3422
+ &:has(*:is(input:not(:disabled):read-only)) {
3423
+ border-color: transparent;
3424
+ }
3425
+ }
3426
+ .has-\[input\:not\(\:disabled\)\:read-only\]\:bg-transparent {
3427
+ &:has(*:is(input:not(:disabled):read-only)) {
3428
+ background-color: transparent;
3429
+ }
3430
+ }
3431
+ .has-\[input\:not\(\:disabled\)\:read-only\]\:pl-0 {
3432
+ &:has(*:is(input:not(:disabled):read-only)) {
3433
+ padding-left: calc(var(--spacing) * 0);
3434
+ }
3435
+ }
3436
+ .has-\[input\:not\(\:disabled\)\:read-only\]\:outline-none {
3437
+ &:has(*:is(input:not(:disabled):read-only)) {
3438
+ --tw-outline-style: none;
3439
+ outline-style: none;
3440
+ }
3441
+ }
3442
+ .data-disabled\:cursor-default {
3443
+ &[data-disabled] {
3444
+ cursor: default;
3445
+ }
3446
+ }
3447
+ .data-disabled\:border-border-primary-normal {
3448
+ &[data-disabled] {
3449
+ border-color: var(--color-border-primary-normal);
3450
+ }
3451
+ }
3452
+ .data-error\:not-focus\:outline-1 {
3453
+ &[data-error] {
3454
+ &:not(*:focus) {
3455
+ outline-style: var(--tw-outline-style);
3456
+ outline-width: 1px;
3457
+ }
3458
+ }
3459
+ }
3460
+ .data-error\:not-focus\:outline-border-primary-error {
3461
+ &[data-error] {
3462
+ &:not(*:focus) {
3463
+ outline-color: var(--color-border-primary-error);
3464
+ }
3465
+ }
3466
+ }
3467
+ .data-error\:not-disabled\:border-transparent {
3468
+ &[data-error] {
3469
+ &:not(*:disabled) {
3470
+ border-color: transparent;
3471
+ }
3472
+ }
3473
+ }
3474
+ .data-selected\:border-transparent {
3475
+ &[data-selected] {
3476
+ border-color: transparent;
3477
+ }
3478
+ }
3479
+ .data-selected\:bg-background-action-secondary-active {
3480
+ &[data-selected] {
3481
+ background-color: var(--color-background-action-secondary-active);
3482
+ }
3483
+ }
3484
+ .data-selected\:bg-background-action-secondary-hover {
3485
+ &[data-selected] {
3486
+ background-color: var(--color-background-action-secondary-hover);
3487
+ }
3488
+ }
3489
+ .data-selected\:text-text-action-active {
3490
+ &[data-selected] {
3491
+ color: var(--color-text-action-active);
3492
+ }
3493
+ }
3494
+ .data-selected\:outline-border-action-normal {
3495
+ &[data-selected] {
3496
+ outline-color: var(--color-border-action-normal);
3497
+ }
3498
+ }
3499
+ .data-selected\:hover\:outline-border-action-hover {
3500
+ &[data-selected] {
3501
+ &:hover {
3502
+ @media (hover: hover) {
3503
+ outline-color: var(--color-border-action-hover);
3504
+ }
3505
+ }
3506
+ }
3507
+ }
3508
+ .data-selected\:active\:outline-border-action-active {
3509
+ &[data-selected] {
3510
+ &:active {
3511
+ outline-color: var(--color-border-action-active);
3512
+ }
3513
+ }
3514
+ }
3515
+ .data-selected\:data-disabled\:border-border-action-disabled {
3516
+ &[data-selected] {
3517
+ &[data-disabled] {
3518
+ border-color: var(--color-border-action-disabled);
3519
+ }
3520
+ }
3521
+ }
3522
+ .data-selected\:data-disabled\:bg-background-action-secondary-disabled {
3523
+ &[data-selected] {
3524
+ &[data-disabled] {
3525
+ background-color: var(--color-background-action-secondary-disabled);
3526
+ }
3527
+ }
3528
+ }
3529
+ .data-selected\:data-disabled\:outline-transparent {
3530
+ &[data-selected] {
3531
+ &[data-disabled] {
3532
+ outline-color: transparent;
3533
+ }
3534
+ }
3535
+ }
3536
+ .data-\[focus\]\:outline-1 {
3537
+ &[data-focus] {
3538
+ outline-style: var(--tw-outline-style);
3539
+ outline-width: 1px;
3540
+ }
3541
+ }
3542
+ .data-\[focus\]\:outline-white {
3543
+ &[data-focus] {
3544
+ outline-color: var(--color-white);
3545
+ }
3546
+ }
3547
+ .max-sm\:w-full {
3548
+ @media (width < 320px) {
3549
+ width: 100%;
3550
+ }
3551
+ }
3552
+ .sm\:grid-cols-2 {
3553
+ @media (width >= 320px) {
3554
+ grid-template-columns: repeat(2, minmax(0, 1fr));
3555
+ }
3556
+ }
3557
+ .md\:table-cell {
3558
+ @media (width >= 768px) {
3559
+ display: table-cell;
3560
+ }
3561
+ }
3562
+ .md\:grid-cols-3 {
3563
+ @media (width >= 768px) {
3564
+ grid-template-columns: repeat(3, minmax(0, 1fr));
3565
+ }
3566
+ }
3567
+ .md\:flex-row {
3568
+ @media (width >= 768px) {
3569
+ flex-direction: row;
3570
+ }
3571
+ }
3572
+ .md\:gap-2 {
3573
+ @media (width >= 768px) {
3574
+ gap: calc(var(--spacing) * 2);
3575
+ }
3576
+ }
3577
+ .lg\:grid-cols-4 {
3578
+ @media (width >= 1024px) {
3579
+ grid-template-columns: repeat(4, minmax(0, 1fr));
3580
+ }
3581
+ }
3582
+ .xl\:grid-cols-4 {
3583
+ @media (width >= 1280px) {
3584
+ grid-template-columns: repeat(4, minmax(0, 1fr));
3585
+ }
3586
+ }
3587
+ .xl\:grid-cols-5 {
3588
+ @media (width >= 1280px) {
3589
+ grid-template-columns: repeat(5, minmax(0, 1fr));
3590
+ }
3591
+ }
3592
+ .xl\:grid-cols-6 {
3593
+ @media (width >= 1280px) {
3594
+ grid-template-columns: repeat(6, minmax(0, 1fr));
3595
+ }
3596
+ }
3597
+ .xl\:grid-cols-8 {
3598
+ @media (width >= 1280px) {
3599
+ grid-template-columns: repeat(8, minmax(0, 1fr));
3600
+ }
3601
+ }
3602
+ .\32xl\:grid-cols-6 {
3603
+ @media (width >= 1536px) {
3604
+ grid-template-columns: repeat(6, minmax(0, 1fr));
3605
+ }
3606
+ }
3607
+ .\32xl\:grid-cols-7 {
3608
+ @media (width >= 1536px) {
3609
+ grid-template-columns: repeat(7, minmax(0, 1fr));
3610
+ }
3611
+ }
3612
+ .\32xl\:grid-cols-8 {
3613
+ @media (width >= 1536px) {
3614
+ grid-template-columns: repeat(8, minmax(0, 1fr));
3615
+ }
3616
+ }
3617
+ .\32xl\:grid-cols-9 {
3618
+ @media (width >= 1536px) {
3619
+ grid-template-columns: repeat(9, minmax(0, 1fr));
3620
+ }
3621
+ }
3622
+ .\32xl\:grid-cols-10 {
3623
+ @media (width >= 1536px) {
3624
+ grid-template-columns: repeat(10, minmax(0, 1fr));
3625
+ }
3626
+ }
3627
+ .\32xl\:grid-cols-11 {
3628
+ @media (width >= 1536px) {
3629
+ grid-template-columns: repeat(11, minmax(0, 1fr));
3630
+ }
3631
+ }
3632
+ .\32xl\:grid-cols-12 {
3633
+ @media (width >= 1536px) {
3634
+ grid-template-columns: repeat(12, minmax(0, 1fr));
3635
+ }
3636
+ }
3637
+ .compact\:mt-desktop-compact-component-gap {
3638
+ &:where([data-compact]) {
3639
+ margin-top: var(--spacing-desktop-compact-component-gap);
3640
+ }
3641
+ }
3642
+ .compact\:gap-desktop-compact-component-gap {
3643
+ &:where([data-compact]) {
3644
+ gap: var(--spacing-desktop-compact-component-gap);
3645
+ }
3646
+ }
3647
+ .compact\:gap-desktop-compact-container-padding {
3648
+ &:where([data-compact]) {
3649
+ gap: var(--spacing-desktop-compact-container-padding);
3650
+ }
3651
+ }
3652
+ .compact\:gap-desktop-compact-layout-gap {
3653
+ &:where([data-compact]) {
3654
+ gap: var(--spacing-desktop-compact-layout-gap);
3655
+ }
3656
+ }
3657
+ .compact\:gap-desktop-compact-layout-group-gap {
3658
+ &:where([data-compact]) {
3659
+ gap: var(--spacing-desktop-compact-layout-group-gap);
3660
+ }
3661
+ }
3662
+ .compact\:p-\[calc\(var\(--spacing-desktop-compact-component-padding\)_-_1px\)\] {
3663
+ &:where([data-compact]) {
3664
+ padding: calc(var(--spacing-desktop-compact-component-padding) - 1px);
3665
+ }
3666
+ }
3667
+ .compact\:p-\[calc\(var\(--spacing-desktop-compact-component-padding\)_-_2px\)\] {
3668
+ &:where([data-compact]) {
3669
+ padding: calc(var(--spacing-desktop-compact-component-padding) - 2px);
3670
+ }
3671
+ }
3672
+ .compact\:p-desktop-compact-component-gap {
3673
+ &:where([data-compact]) {
3674
+ padding: var(--spacing-desktop-compact-component-gap);
3675
+ }
3676
+ }
3677
+ .compact\:p-desktop-compact-component-padding {
3678
+ &:where([data-compact]) {
3679
+ padding: var(--spacing-desktop-compact-component-padding);
3680
+ }
3681
+ }
3682
+ .compact\:p-desktop-compact-container-padding {
3683
+ &:where([data-compact]) {
3684
+ padding: var(--spacing-desktop-compact-container-padding);
3685
+ }
3686
+ }
3687
+ .compact\:p-desktop-compact-layout-padding {
3688
+ &:where([data-compact]) {
3689
+ padding: var(--spacing-desktop-compact-layout-padding);
3690
+ }
3691
+ }
3692
+ .compact\:px-desktop-compact-component-gap {
3693
+ &:where([data-compact]) {
3694
+ padding-inline: var(--spacing-desktop-compact-component-gap);
3695
+ }
3696
+ }
3697
+ .compact\:px-desktop-compact-component-padding {
3698
+ &:where([data-compact]) {
3699
+ padding-inline: var(--spacing-desktop-compact-component-padding);
3700
+ }
3701
+ }
3702
+ .compact\:px-desktop-compact-container-padding {
3703
+ &:where([data-compact]) {
3704
+ padding-inline: var(--spacing-desktop-compact-container-padding);
3705
+ }
3706
+ }
3707
+ .compact\:px-desktop-compact-layout-group-gap {
3708
+ &:where([data-compact]) {
3709
+ padding-inline: var(--spacing-desktop-compact-layout-group-gap);
3710
+ }
3711
+ }
3712
+ .compact\:px-desktop-compact-layout-padding {
3713
+ &:where([data-compact]) {
3714
+ padding-inline: var(--spacing-desktop-compact-layout-padding);
3715
+ }
3716
+ }
3717
+ .compact\:py-\[calc\(var\(--spacing-desktop-compact-component-padding\)_\+_3px\)\] {
3718
+ &:where([data-compact]) {
3719
+ padding-block: calc(var(--spacing-desktop-compact-component-padding) + 3px);
3720
+ }
3721
+ }
3722
+ .compact\:py-desktop-compact-component-gap {
3723
+ &:where([data-compact]) {
3724
+ padding-block: var(--spacing-desktop-compact-component-gap);
3725
+ }
3726
+ }
3727
+ .compact\:py-desktop-compact-component-padding {
3728
+ &:where([data-compact]) {
3729
+ padding-block: var(--spacing-desktop-compact-component-padding);
3730
+ }
3731
+ }
3732
+ .compact\:py-desktop-compact-container-padding {
3733
+ &:where([data-compact]) {
3734
+ padding-block: var(--spacing-desktop-compact-container-padding);
3735
+ }
3736
+ }
3737
+ .compact\:py-desktop-compact-layout-group-gap {
3738
+ &:where([data-compact]) {
3739
+ padding-block: var(--spacing-desktop-compact-layout-group-gap);
3740
+ }
3741
+ }
3742
+ .compact\:py-desktop-compact-layout-padding {
3743
+ &:where([data-compact]) {
3744
+ padding-block: var(--spacing-desktop-compact-layout-padding);
3745
+ }
3746
+ }
3747
+ .compact\:pb-desktop-compact-component-padding {
3748
+ &:where([data-compact]) {
3749
+ padding-bottom: var(--spacing-desktop-compact-component-padding);
3750
+ }
3751
+ }
3752
+ .compact\:pb-desktop-compact-layout-padding {
3753
+ &:where([data-compact]) {
3754
+ padding-bottom: var(--spacing-desktop-compact-layout-padding);
3755
+ }
3756
+ }
3757
+ .compact\:pl-desktop-compact-component-padding {
3758
+ &:where([data-compact]) {
3759
+ padding-left: var(--spacing-desktop-compact-component-padding);
3760
+ }
3761
+ }
3762
+ .compact\:text-caption-desktop-compact {
3763
+ &:where([data-compact]) {
3764
+ font-size: var(--text-caption-desktop-compact);
3765
+ }
3766
+ }
3767
+ .compact\:text-display-1-desktop-compact {
3768
+ &:where([data-compact]) {
3769
+ font-size: var(--text-display-1-desktop-compact);
3770
+ }
3771
+ }
3772
+ .compact\:text-display-2-desktop-compact {
3773
+ &:where([data-compact]) {
3774
+ font-size: var(--text-display-2-desktop-compact);
3775
+ }
3776
+ }
3777
+ .compact\:text-heading-1-desktop-compact {
3778
+ &:where([data-compact]) {
3779
+ font-size: var(--text-heading-1-desktop-compact);
3780
+ }
3781
+ }
3782
+ .compact\:text-heading-2-desktop-compact {
3783
+ &:where([data-compact]) {
3784
+ font-size: var(--text-heading-2-desktop-compact);
3785
+ }
3786
+ }
3787
+ .compact\:text-heading-3-desktop-compact {
3788
+ &:where([data-compact]) {
3789
+ font-size: var(--text-heading-3-desktop-compact);
3790
+ }
3791
+ }
3792
+ .compact\:text-label-desktop-compact {
3793
+ &:where([data-compact]) {
3794
+ font-size: var(--text-label-desktop-compact);
3795
+ }
3796
+ }
3797
+ .compact\:text-link-desktop-compact {
3798
+ &:where([data-compact]) {
3799
+ font-size: var(--text-link-desktop-compact);
3800
+ }
3801
+ }
3802
+ .compact\:text-paragraph-desktop-compact {
3803
+ &:where([data-compact]) {
3804
+ font-size: var(--text-paragraph-desktop-compact);
3805
+ }
3806
+ }
3807
+ .compact\:text-subheader-desktop-compact {
3808
+ &:where([data-compact]) {
3809
+ font-size: var(--text-subheader-desktop-compact);
3810
+ }
3811
+ }
3812
+ .compact\:\*\:py-desktop-compact-component-padding {
3813
+ &:where([data-compact]) {
3814
+ :is(& > *) {
3815
+ padding-block: var(--spacing-desktop-compact-component-padding);
3816
+ }
3817
+ }
3818
+ }
3819
+ .\*\:first\:compact\:py-desktop-compact-component-padding {
3820
+ :is(& > *) {
3821
+ &:first-child {
3822
+ &:where([data-compact]) {
3823
+ padding-block: var(--spacing-desktop-compact-component-padding);
3824
+ }
3825
+ }
3826
+ }
3827
+ }
3828
+ .desktop\:m-desktop-container-padding {
3829
+ @container root (width >= 48rem) {
3830
+ margin: var(--spacing-desktop-container-padding);
3831
+ }
3832
+ }
3833
+ .desktop\:mx-desktop-container-padding {
3834
+ @container root (width >= 48rem) {
3835
+ margin-inline: var(--spacing-desktop-container-padding);
3836
+ }
3837
+ }
3838
+ .desktop\:my-desktop-container-padding {
3839
+ @container root (width >= 48rem) {
3840
+ margin-block: var(--spacing-desktop-container-padding);
3841
+ }
3842
+ }
3843
+ .desktop\:mt-0 {
3844
+ @container root (width >= 48rem) {
3845
+ margin-top: calc(var(--spacing) * 0);
3846
+ }
3847
+ }
3848
+ .desktop\:mt-desktop-component-gap {
3849
+ @container root (width >= 48rem) {
3850
+ margin-top: var(--spacing-desktop-component-gap);
3851
+ }
3852
+ }
3853
+ .desktop\:mt-desktop-container-padding {
3854
+ @container root (width >= 48rem) {
3855
+ margin-top: var(--spacing-desktop-container-padding);
3856
+ }
3857
+ }
3858
+ .desktop\:mb-desktop-container-padding {
3859
+ @container root (width >= 48rem) {
3860
+ margin-bottom: var(--spacing-desktop-container-padding);
3861
+ }
3862
+ }
3863
+ .desktop\:block {
3864
+ @container root (width >= 48rem) {
3865
+ display: block;
3866
+ }
3867
+ }
3868
+ .desktop\:flex {
3869
+ @container root (width >= 48rem) {
3870
+ display: flex;
3871
+ }
3872
+ }
3873
+ .desktop\:hidden {
3874
+ @container root (width >= 48rem) {
3875
+ display: none;
3876
+ }
3877
+ }
3878
+ .desktop\:h-\[190px\] {
3879
+ @container root (width >= 48rem) {
3880
+ height: 190px;
3881
+ }
3882
+ }
3883
+ .desktop\:h-auto {
3884
+ @container root (width >= 48rem) {
3885
+ height: auto;
3886
+ }
3887
+ }
3888
+ .desktop\:h-fit {
3889
+ @container root (width >= 48rem) {
3890
+ height: fit-content;
3891
+ }
3892
+ }
3893
+ .desktop\:max-h-\[calc\(100vh-32px\)\] {
3894
+ @container root (width >= 48rem) {
3895
+ max-height: calc(100vh - 32px);
3896
+ }
3897
+ }
3898
+ .desktop\:w-\[340px\] {
3899
+ @container root (width >= 48rem) {
3900
+ width: 340px;
3901
+ }
3902
+ }
3903
+ .desktop\:w-full {
3904
+ @container root (width >= 48rem) {
3905
+ width: 100%;
3906
+ }
3907
+ }
3908
+ .desktop\:max-w-120 {
3909
+ @container root (width >= 48rem) {
3910
+ max-width: calc(var(--spacing) * 120);
3911
+ }
3912
+ }
3913
+ .desktop\:max-w-180 {
3914
+ @container root (width >= 48rem) {
3915
+ max-width: calc(var(--spacing) * 180);
3916
+ }
3917
+ }
3918
+ .desktop\:max-w-240 {
3919
+ @container root (width >= 48rem) {
3920
+ max-width: calc(var(--spacing) * 240);
3921
+ }
3922
+ }
3923
+ .desktop\:max-w-300 {
3924
+ @container root (width >= 48rem) {
3925
+ max-width: calc(var(--spacing) * 300);
3926
+ }
3927
+ }
3928
+ .desktop\:flex-grow-0 {
3929
+ @container root (width >= 48rem) {
3930
+ flex-grow: 0;
3931
+ }
3932
+ }
3933
+ .desktop\:flex-col {
3934
+ @container root (width >= 48rem) {
3935
+ flex-direction: column;
3936
+ }
3937
+ }
3938
+ .desktop\:flex-row {
3939
+ @container root (width >= 48rem) {
3940
+ flex-direction: row;
3941
+ }
3942
+ }
3943
+ .desktop\:items-center {
3944
+ @container root (width >= 48rem) {
3945
+ align-items: center;
3946
+ }
3947
+ }
3948
+ .desktop\:gap-desktop-component-gap {
3949
+ @container root (width >= 48rem) {
3950
+ gap: var(--spacing-desktop-component-gap);
3951
+ }
3952
+ }
3953
+ .desktop\:gap-desktop-container-gap {
3954
+ @container root (width >= 48rem) {
3955
+ gap: var(--spacing-desktop-container-gap);
3956
+ }
3957
+ }
3958
+ .desktop\:gap-desktop-container-padding {
3959
+ @container root (width >= 48rem) {
3960
+ gap: var(--spacing-desktop-container-padding);
3961
+ }
3962
+ }
3963
+ .desktop\:gap-desktop-layout-gap {
3964
+ @container root (width >= 48rem) {
3965
+ gap: var(--spacing-desktop-layout-gap);
3966
+ }
3967
+ }
3968
+ .desktop\:gap-desktop-layout-group-gap {
3969
+ @container root (width >= 48rem) {
3970
+ gap: var(--spacing-desktop-layout-group-gap);
3971
+ }
3972
+ }
3973
+ .desktop\:p-4 {
3974
+ @container root (width >= 48rem) {
3975
+ padding: calc(var(--spacing) * 4);
3976
+ }
3977
+ }
3978
+ .desktop\:p-\[calc\(var\(--spacing-desktop-component-padding\)_-_1px\)\] {
3979
+ @container root (width >= 48rem) {
3980
+ padding: calc(var(--spacing-desktop-component-padding) - 1px);
3981
+ }
3982
+ }
3983
+ .desktop\:p-\[calc\(var\(--spacing-desktop-component-padding\)_-_2px\)\] {
3984
+ @container root (width >= 48rem) {
3985
+ padding: calc(var(--spacing-desktop-component-padding) - 2px);
3986
+ }
3987
+ }
3988
+ .desktop\:p-desktop-component-gap {
3989
+ @container root (width >= 48rem) {
3990
+ padding: var(--spacing-desktop-component-gap);
3991
+ }
3992
+ }
3993
+ .desktop\:p-desktop-component-padding {
3994
+ @container root (width >= 48rem) {
3995
+ padding: var(--spacing-desktop-component-padding);
3996
+ }
3997
+ }
3998
+ .desktop\:p-desktop-container-padding {
3999
+ @container root (width >= 48rem) {
4000
+ padding: var(--spacing-desktop-container-padding);
4001
+ }
4002
+ }
4003
+ .desktop\:p-desktop-layout-padding {
4004
+ @container root (width >= 48rem) {
4005
+ padding: var(--spacing-desktop-layout-padding);
4006
+ }
4007
+ }
4008
+ .desktop\:px-desktop-component-gap {
4009
+ @container root (width >= 48rem) {
4010
+ padding-inline: var(--spacing-desktop-component-gap);
4011
+ }
4012
+ }
4013
+ .desktop\:px-desktop-component-padding {
4014
+ @container root (width >= 48rem) {
4015
+ padding-inline: var(--spacing-desktop-component-padding);
4016
+ }
4017
+ }
4018
+ .desktop\:px-desktop-container-padding {
4019
+ @container root (width >= 48rem) {
4020
+ padding-inline: var(--spacing-desktop-container-padding);
4021
+ }
4022
+ }
4023
+ .desktop\:px-desktop-layout-group-gap {
4024
+ @container root (width >= 48rem) {
4025
+ padding-inline: var(--spacing-desktop-layout-group-gap);
4026
+ }
4027
+ }
4028
+ .desktop\:px-desktop-layout-padding {
4029
+ @container root (width >= 48rem) {
4030
+ padding-inline: var(--spacing-desktop-layout-padding);
4031
+ }
4032
+ }
4033
+ .desktop\:py-\[calc\(var\(--spacing-desktop-component-padding\)_\+_3px\)\] {
4034
+ @container root (width >= 48rem) {
4035
+ padding-block: calc(var(--spacing-desktop-component-padding) + 3px);
4036
+ }
4037
+ }
4038
+ .desktop\:py-desktop-component-gap {
4039
+ @container root (width >= 48rem) {
4040
+ padding-block: var(--spacing-desktop-component-gap);
4041
+ }
4042
+ }
4043
+ .desktop\:py-desktop-component-padding {
4044
+ @container root (width >= 48rem) {
4045
+ padding-block: var(--spacing-desktop-component-padding);
4046
+ }
4047
+ }
4048
+ .desktop\:py-desktop-container-padding {
4049
+ @container root (width >= 48rem) {
4050
+ padding-block: var(--spacing-desktop-container-padding);
4051
+ }
4052
+ }
4053
+ .desktop\:py-desktop-layout-group-gap {
4054
+ @container root (width >= 48rem) {
4055
+ padding-block: var(--spacing-desktop-layout-group-gap);
4056
+ }
4057
+ }
4058
+ .desktop\:py-desktop-layout-padding {
4059
+ @container root (width >= 48rem) {
4060
+ padding-block: var(--spacing-desktop-layout-padding);
4061
+ }
4062
+ }
4063
+ .desktop\:pt-desktop-layout-gap {
4064
+ @container root (width >= 48rem) {
4065
+ padding-top: var(--spacing-desktop-layout-gap);
4066
+ }
4067
+ }
4068
+ .desktop\:pb-desktop-component-padding {
4069
+ @container root (width >= 48rem) {
4070
+ padding-bottom: var(--spacing-desktop-component-padding);
4071
+ }
4072
+ }
4073
+ .desktop\:pb-desktop-layout-padding {
4074
+ @container root (width >= 48rem) {
4075
+ padding-bottom: var(--spacing-desktop-layout-padding);
4076
+ }
4077
+ }
4078
+ .desktop\:pl-desktop-component-padding {
4079
+ @container root (width >= 48rem) {
4080
+ padding-left: var(--spacing-desktop-component-padding);
4081
+ }
4082
+ }
4083
+ .desktop\:text-caption-desktop {
4084
+ @container root (width >= 48rem) {
4085
+ font-size: var(--text-caption-desktop);
4086
+ }
4087
+ }
4088
+ .desktop\:text-display-1-desktop {
4089
+ @container root (width >= 48rem) {
4090
+ font-size: var(--text-display-1-desktop);
4091
+ }
4092
+ }
4093
+ .desktop\:text-display-2-desktop {
4094
+ @container root (width >= 48rem) {
4095
+ font-size: var(--text-display-2-desktop);
4096
+ }
4097
+ }
4098
+ .desktop\:text-heading-1-desktop {
4099
+ @container root (width >= 48rem) {
4100
+ font-size: var(--text-heading-1-desktop);
4101
+ }
4102
+ }
4103
+ .desktop\:text-heading-2-desktop {
4104
+ @container root (width >= 48rem) {
4105
+ font-size: var(--text-heading-2-desktop);
4106
+ }
4107
+ }
4108
+ .desktop\:text-heading-3-desktop {
4109
+ @container root (width >= 48rem) {
4110
+ font-size: var(--text-heading-3-desktop);
4111
+ }
4112
+ }
4113
+ .desktop\:text-label-desktop {
4114
+ @container root (width >= 48rem) {
4115
+ font-size: var(--text-label-desktop);
4116
+ }
4117
+ }
4118
+ .desktop\:text-link-desktop {
4119
+ @container root (width >= 48rem) {
4120
+ font-size: var(--text-link-desktop);
4121
+ }
4122
+ }
4123
+ .desktop\:text-paragraph-desktop {
4124
+ @container root (width >= 48rem) {
4125
+ font-size: var(--text-paragraph-desktop);
4126
+ }
4127
+ }
4128
+ .desktop\:text-subheader-desktop {
4129
+ @container root (width >= 48rem) {
4130
+ font-size: var(--text-subheader-desktop);
4131
+ }
4132
+ }
4133
+ .desktop\:leading-caption-desktop {
4134
+ @container root (width >= 48rem) {
4135
+ --tw-leading: var(--leading-caption-desktop);
4136
+ line-height: var(--leading-caption-desktop);
4137
+ }
4138
+ }
4139
+ .desktop\:leading-display-1-desktop {
4140
+ @container root (width >= 48rem) {
4141
+ --tw-leading: var(--leading-display-1-desktop);
4142
+ line-height: var(--leading-display-1-desktop);
4143
+ }
4144
+ }
4145
+ .desktop\:leading-display-2-desktop {
4146
+ @container root (width >= 48rem) {
4147
+ --tw-leading: var(--leading-display-2-desktop);
4148
+ line-height: var(--leading-display-2-desktop);
4149
+ }
4150
+ }
4151
+ .desktop\:leading-heading-1-desktop {
4152
+ @container root (width >= 48rem) {
4153
+ --tw-leading: var(--leading-heading-1-desktop);
4154
+ line-height: var(--leading-heading-1-desktop);
4155
+ }
4156
+ }
4157
+ .desktop\:leading-heading-2-desktop {
4158
+ @container root (width >= 48rem) {
4159
+ --tw-leading: var(--leading-heading-2-desktop);
4160
+ line-height: var(--leading-heading-2-desktop);
4161
+ }
4162
+ }
4163
+ .desktop\:leading-heading-3-desktop {
4164
+ @container root (width >= 48rem) {
4165
+ --tw-leading: var(--leading-heading-3-desktop);
4166
+ line-height: var(--leading-heading-3-desktop);
4167
+ }
4168
+ }
4169
+ .desktop\:leading-label-desktop {
4170
+ @container root (width >= 48rem) {
4171
+ --tw-leading: var(--leading-label-desktop);
4172
+ line-height: var(--leading-label-desktop);
4173
+ }
4174
+ }
4175
+ .desktop\:leading-link-desktop {
4176
+ @container root (width >= 48rem) {
4177
+ --tw-leading: var(--leading-link-desktop);
4178
+ line-height: var(--leading-link-desktop);
4179
+ }
4180
+ }
4181
+ .desktop\:leading-paragraph-desktop {
4182
+ @container root (width >= 48rem) {
4183
+ --tw-leading: var(--leading-paragraph-desktop);
4184
+ line-height: var(--leading-paragraph-desktop);
4185
+ }
4186
+ }
4187
+ .desktop\:leading-subheader-desktop {
4188
+ @container root (width >= 48rem) {
4189
+ --tw-leading: var(--leading-subheader-desktop);
4190
+ line-height: var(--leading-subheader-desktop);
4191
+ }
4192
+ }
4193
+ .desktop\:\*\:py-desktop-component-padding {
4194
+ @container root (width >= 48rem) {
4195
+ :is(& > *) {
4196
+ padding-block: var(--spacing-desktop-component-padding);
4197
+ }
4198
+ }
4199
+ }
4200
+ .\*\:first\:desktop\:py-desktop-component-padding {
4201
+ :is(& > *) {
4202
+ &:first-child {
4203
+ @container root (width >= 48rem) {
4204
+ padding-block: var(--spacing-desktop-component-padding);
4205
+ }
4206
+ }
4207
+ }
4208
+ }
4209
+ .\[\&\:\:-webkit-inner-spin-button\]\:appearance-none {
4210
+ &::-webkit-inner-spin-button {
4211
+ appearance: none;
4212
+ }
4213
+ }
4214
+ .\[\&\:\:-webkit-outer-spin-button\]\:appearance-none {
4215
+ &::-webkit-outer-spin-button {
4216
+ appearance: none;
4217
+ }
4218
+ }
4219
+ .\[\&\>a\]\:leading-6 {
4220
+ & > a {
4221
+ --tw-leading: calc(var(--spacing) * 6);
4222
+ line-height: calc(var(--spacing) * 6);
4223
+ }
4224
+ }
4225
+ .\[\&\>svg\]\:shrink-0 {
4226
+ & > svg {
4227
+ flex-shrink: 0;
4228
+ }
4229
+ }
4230
+ .\[\&\>svg\]\:fill-icon-action-primary-normal {
4231
+ & > svg {
4232
+ fill: var(--color-icon-action-primary-normal);
4233
+ }
4234
+ }
4235
+ }
4236
+ [data-theme=light] {
4237
+ --color-text-primary-normal: var(--color-neutral-500);
4238
+ --color-text-primary-active: var(--color-neutral-400);
4239
+ --color-text-primary-disabled: var(--color-neutral-300);
4240
+ --color-text-primary-error: var(--color-critical-400);
4241
+ --color-text-secondary-normal: var(--color-neutral-400);
4242
+ --color-text-secondary-disabled: var(--color-neutral-300);
4243
+ --color-text-secondary-error: var(--color-critical-400);
4244
+ --color-text-success-normal: var(--color-success-500);
4245
+ --color-text-success-disabled: var(--color-neutral-400);
4246
+ --color-text-success-error: var(--color-critical-400);
4247
+ --color-text-warning-normal: var(--color-warning-500);
4248
+ --color-text-warning-disabled: var(--color-neutral-400);
4249
+ --color-text-warning-error: var(--color-critical-400);
4250
+ --color-text-brand-primary-normal: var(--color-neutral-000);
4251
+ --color-text-link-normal: var(--color-link-400);
4252
+ --color-text-link-hover: var(--color-link-500);
4253
+ --color-text-link-active: var(--color-link-300);
4254
+ --color-text-link-disabled: var(--color-neutral-400);
4255
+ --color-border-primary-normal: var(--color-neutral-300);
4256
+ --color-border-primary-focus: var(--color-action-400);
4257
+ --color-border-primary-error: var(--color-critical-400);
4258
+ --color-border-primary-normal: var(--color-neutral-300);
4259
+ --color-icon-primary-normal: var(--color-neutral-400);
4260
+ --color-icon-primary-disabled: var(--color-neutral-300);
4261
+ --color-icon-success-normal: var(--color-success-400);
4262
+ --color-icon-success-disabled: var(--color-neutral-400);
4263
+ --color-icon-warning-normal: var(--color-warning-400);
4264
+ --color-icon-warning-disabled: var(--color-neutral-400);
4265
+ --color-icon-critical-normal: var(--color-critical-400);
4266
+ --color-icon-critical-disabled: var(--color-neutral-400);
4267
+ --color-background-primary-normal: var(--color-neutral-000);
4268
+ --color-background-grouped-primary-normal: var(--color-neutral-000);
4269
+ --color-background-secondary-normal: var(--color-neutral-300);
4270
+ --color-background-grouped-secondary-normal: var(--color-neutral-100);
4271
+ --color-background-success-normal: var(--color-success-400);
4272
+ --color-background-warning-normal: var(--color-warning-400);
4273
+ --color-background-critical-normal: var(--color-critical-400);
4274
+ --color-text-action-normal: var(--color-action-400);
4275
+ --color-text-action-hover: var(--color-action-500);
4276
+ --color-text-action-active: var(--color-action-300);
4277
+ --color-text-action-disabled: var(--color-neutral-400);
4278
+ --color-text-action-primary-normal: var(--color-action-400);
4279
+ --color-text-action-primary-hover: var(--color-action-500);
4280
+ --color-text-action-primary-active: var(--color-action-300);
4281
+ --color-text-action-primary-disabled: var(--color-neutral-400);
4282
+ --color-brand-text-action-primary-normal: var( --color-neutral-000 );
4283
+ --color-brand-text-action-primary-hover: var( --color-brand-200 );
4284
+ --color-brand-text-action-primary-active: var( --color-brand-200 );
4285
+ --color-brand-text-on-action-primary-normal: var( --color-neutral-000 );
4286
+ --color-brand-text-on-action-primary-hover: var( --color-brand-500 );
4287
+ --color-brand-text-on-action-primary-active: var( --color-brand-300 );
4288
+ --color-text-on-action-primary-normal: var(--color-neutral-000);
4289
+ --color-text-on-action-primary-hover: var(--color-neutral-000);
4290
+ --color-text-on-action-primary-active: var(--color-neutral-000);
4291
+ --color-text-on-action-primary-disabled: var(--color-neutral-400);
4292
+ --color-text-action-critical-normal: var(--color-critical-400);
4293
+ --color-text-action-critical-hover: var(--color-critical-500);
4294
+ --color-text-action-critical-active: var(--color-critical-300);
4295
+ --color-text-action-critical-disabled: var(--color-neutral-400);
4296
+ --color-border-action-normal: var(--color-action-400);
4297
+ --color-border-action-hover: var(--color-action-500);
4298
+ --color-border-action-active: var(--color-action-300);
4299
+ --color-border-action-disabled: var(--color-neutral-200);
4300
+ --color-text-critical-normal: var(--color-critical-400);
4301
+ --color-text-critical-disabled: var(--color-neutral-400);
4302
+ --color-text-critical-error: var(--color-critical-400);
4303
+ --color-border-action-critical-normal: var(--color-critical-400);
4304
+ --color-border-action-critical-hover: var(--color-critical-500);
4305
+ --color-border-action-critical-active: var(--color-critical-300);
4306
+ --color-border-action-critical-disabled: var(--color-neutral-200);
4307
+ --color-background-action-normal: var(--color-action-400);
4308
+ --color-background-action-hover: var(--color-action-500);
4309
+ --color-background-action-active: var(--color-action-300);
4310
+ --color-background-action-disabled: var(--color-neutral-200);
4311
+ --color-background-action-critical-normal: var(--color-critical-400);
4312
+ --color-background-action-critical-hover: var(--color-critical-500);
4313
+ --color-background-action-critical-active: var(--color-critical-300);
4314
+ --color-background-action-critical-disabled: var(--color-neutral-200);
4315
+ --color-icon-action-primary-normal: var(--color-neutral-500);
4316
+ --color-icon-action-primary-hover: var(--color-action-500);
4317
+ --color-icon-action-primary-active: var(--color-action-300);
4318
+ --color-icon-action-primary-disabled: var(--color-neutral-300);
4319
+ --color-icon-action-secondary-normal: var(--color-action-400);
4320
+ --color-icon-action-secondary-hover: var(--color-action-500);
4321
+ --color-icon-action-secondary-active: var(--color-action-300);
4322
+ --color-icon-action-secondary-disabled: var(--color-neutral-400);
4323
+ --color-icon-on-action-primary-normal: var(--color-neutral-000);
4324
+ --color-icon-on-action-primary-hover: var(--color-neutral-000);
4325
+ --color-icon-on-action-primary-active: var(--color-neutral-000);
4326
+ --color-icon-on-action-primary-disabled: var(--color-neutral-400);
4327
+ --color-icon-on-action-secondary-normal: var(--color-action-400);
4328
+ --color-icon-on-action-secondary-hover: var(--color-action-500);
4329
+ --color-icon-on-action-secondary-active: var(--color-action-300);
4330
+ --color-icon-on-action-secondary-disabled: var(--color-neutral-400);
4331
+ --color-icon-action-critical-normal: var(--color-critical-400);
4332
+ --color-icon-action-critical-hover: var(--color-critical-500);
4333
+ --color-icon-action-critical-active: var(--color-critical-300);
4334
+ --color-icon-action-critical-disabled: var(--color-neutral-400);
4335
+ --color-icon-action-critical-secondary-normal: var(--color-critical-400);
4336
+ --color-icon-action-critical-secondary-hover: var(--color-critical-500);
4337
+ --color-icon-action-critical-secondary-active: var(--color-critical-300);
4338
+ --color-icon-action-critical-secondary-disabled: var(--color-neutral-400);
4339
+ --color-icon-brand-primary-normal: var(--color-brand-400);
4340
+ --color-icon-brand-primary-hover: var(--color-brand-500);
4341
+ --color-icon-brand-primary-active: var(--color-brand-300);
4342
+ --color-icon-brand-primary-disabled: var(--color-neutral-300);
4343
+ --color-background-action-primary-normal: var(--color-action-400);
4344
+ --color-background-action-primary-hover: var(--color-action-500);
4345
+ --color-background-action-primary-active: var(--color-action-300);
4346
+ --color-background-action-primary-disabled: var(--color-neutral-200);
4347
+ --color-background-action-secondary-normal: var(--color-neutral-000);
4348
+ --color-background-action-secondary-hover: var(--color-action-100);
4349
+ --color-background-action-secondary-active: var(--color-neutral-000);
4350
+ --color-background-action-secondary-disabled: var(--color-neutral-200);
4351
+ --color-background-brand-normal: var(--color-brand-400);
4352
+ --color-background-on-action-primary-normal: var( --color-neutral-000 );
4353
+ --color-background-on-action-primary-hover: var( --color-neutral-000 );
4354
+ --color-background-on-action-primary-active: var( --color-neutral-000 );
4355
+ --color-background-on-action-primary-disabled: var( --color-neutral-200 );
4356
+ --color-background-on-action-secondary-normal: var( --color-neutral-100 );
4357
+ --color-background-on-action-secondary-hover: var( --color-brand-500 );
4358
+ --color-background-on-action-secondary-active: var( --color-brand-400 );
4359
+ --color-background-on-action-secondary-disabled: var( --color-neutral-200 );
4360
+ --color-background-action-critical-primary-normal: var(--color-critical-400);
4361
+ --color-background-action-critical-primary-hover: var(--color-critical-500);
4362
+ --color-background-action-critical-primary-active: var(--color-critical-300);
4363
+ --color-background-action-critical-primary-disabled: var(--color-neutral-200);
4364
+ --color-background-action-critical-secondary-normal: var(--color-neutral-000);
4365
+ --color-background-action-critical-secondary-hover: var(--color-critical-100);
4366
+ --color-background-action-critical-secondary-active: var(--color-neutral-000);
4367
+ --color-background-action-critical-secondary-disabled: var( --color-neutral-200 );
4368
+ --color-background-brand-normal: var( --color-brand-400 );
4369
+ }
4370
+ @media (prefers-color-scheme: dark) {
4371
+ :root {
4372
+ --color-text-primary-normal: var(--color-neutral-000);
4373
+ --color-text-primary-disabled: var(--color-neutral-400);
4374
+ --color-text-primary-error: var(--color-critical-300);
4375
+ --color-text-secondary-normal: var(--color-neutral-300);
4376
+ --color-text-secondary-disabled: var(--color-neutral-400);
4377
+ --color-text-secondary-error: var(--color-critical-300);
4378
+ --color-text-success-normal: var(--color-success-200);
4379
+ --color-text-success-disabled: var(--color-neutral-300);
4380
+ --color-text-success-error: var(--color-critical-300);
4381
+ --color-text-warning-normal: var(--color-warning-200);
4382
+ --color-text-warning-disabled: var(--color-neutral-300);
4383
+ --color-text-warning-error: var(--color-critical-300);
4384
+ --color-text-link-normal: var(--color-link-300);
4385
+ --color-text-link-hover: var(--color-link-400);
4386
+ --color-text-link-active: var(--color-link-200);
4387
+ --color-text-link-disabled: var(--color-neutral-400);
4388
+ --color-border-primary-normal: var(--color-neutral-400);
4389
+ --color-border-primary-focus: var(--color-action-300);
4390
+ --color-border-primary-error: var(--color-critical-300);
4391
+ --color-icon-primary-normal: var(--color-neutral-300);
4392
+ --color-icon-primary-disabled: var(--color-neutral-400);
4393
+ --color-icon-success-normal: var(--color-success-300);
4394
+ --color-icon-success-disabled: var(--color-neutral-400);
4395
+ --color-icon-warning-normal: var(--color-warning-300);
4396
+ --color-icon-warning-disabled: var(--color-neutral-400);
4397
+ --color-icon-critical-normal: var(--color-critical-300);
4398
+ --color-icon-critical-disabled: var(--color-neutral-400);
4399
+ --color-background-primary-normal: var(--color-neutral-600);
4400
+ --color-background-grouped-primary-normal: var(--color-neutral-500);
4401
+ --color-background-secondary-normal: var(--color-neutral-500);
4402
+ --color-background-grouped-secondary-normal: var(--color-neutral-600);
4403
+ --color-background-success-normal: var(--color-success-300);
4404
+ --color-background-warning-normal: var(--color-warning-300);
4405
+ --color-background-critical-normal: var(--color-critical-300);
4406
+ --color-text-action-primary-normal: var(--color-action-300);
4407
+ --color-text-action-primary-hover: var(--color-action-400);
4408
+ --color-text-action-primary-active: var(--color-action-200);
4409
+ --color-text-action-primary-disabled: var(--color-neutral-400);
4410
+ --color-text-on-action-primary-normal: var(--color-neutral-600);
4411
+ --color-text-on-action-primary-hover: var(--color-neutral-500);
4412
+ --color-text-on-action-primary-active: var(--color-neutral-600);
4413
+ --color-text-on-action-primary-disabled: var(--color-neutral-400);
4414
+ --color-text-action-critical-normal: var(--color-critical-300);
4415
+ --color-text-action-critical-hover: var(--color-critical-400);
4416
+ --color-text-action-critical-active: var(--color-critical-200);
4417
+ --color-text-action-critical-disabled: var(--color-neutral-400);
4418
+ --color-border-action-normal: var(--color-action-300);
4419
+ --color-border-action-hover: var(--color-action-400);
4420
+ --color-border-action-active: var(--color-action-200);
4421
+ --color-border-action-disabled: var(--color-neutral-450);
4422
+ --color-text-critical-normal: var(--color-critical-300);
4423
+ --color-text-critical-disabled: var(--color-neutral-300);
4424
+ --color-text-critical-error: var(--color-critical-300);
4425
+ --color-border-action-critical-normal: var(--color-critical-300);
4426
+ --color-border-action-critical-hover: var(--color-critical-400);
4427
+ --color-border-action-critical-active: var(--color-critical-200);
4428
+ --color-border-action-critical-disabled: var(--color-neutral-450);
4429
+ --color-icon-action-primary-normal: var(--color-neutral-000);
4430
+ --color-icon-action-primary-hover: var(--color-action-300);
4431
+ --color-icon-action-primary-active: var(--color-action-200);
4432
+ --color-icon-action-primary-disabled: var(--color-neutral-400);
4433
+ --color-icon-action-secondary-normal: var(--color-action-300);
4434
+ --color-icon-action-secondary-hover: var(--color-action-400);
4435
+ --color-icon-action-secondary-active: var(--color-action-200);
4436
+ --color-icon-action-secondary-disabled: var(--color-neutral-400);
4437
+ --color-icon-on-action-primary-normal: var(--color-neutral-600);
4438
+ --color-icon-on-action-primary-hover: var(--color-neutral-500);
4439
+ --color-icon-on-action-primary-active: var(--color-neutral-600);
4440
+ --color-icon-on-action-primary-disabled: var(--color-neutral-400);
4441
+ --color-icon-action-critical-normal: var(--color-critical-300);
4442
+ --color-icon-action-critical-hover: var(--color-critical-400);
4443
+ --color-icon-action-critical-active: var(--color-critical-200);
4444
+ --color-icon-action-critical-disabled: var(--color-neutral-400);
4445
+ --color-icon-brand-primary-normal: var(--color-brand-300);
4446
+ --color-icon-brand-primary-hover: var(--color-brand-400);
4447
+ --color-icon-brand-primary-active: var(--color-brand-200);
4448
+ --color-icon-brand-primary-disabled: var(--color-neutral-400);
4449
+ --color-background-action-primary-normal: var(--color-action-300);
4450
+ --color-background-action-primary-hover: var(--color-action-400);
4451
+ --color-background-action-primary-active: var(--color-action-200);
4452
+ --color-background-action-primary-disabled: var(--color-neutral-450);
4453
+ --color-background-action-secondary-normal: var(--color-neutral-600);
4454
+ --color-background-action-secondary-hover: var(--color-action-500);
4455
+ --color-background-action-secondary-active: var(--color-neutral-600);
4456
+ --color-background-action-secondary-disabled: var(--color-neutral-450);
4457
+ --color-background-brand-normal: var(--color-brand-400);
4458
+ --color-background-action-critical-primary-normal: var( --color-critical-300 );
4459
+ --color-background-action-critical-primary-hover: var(--color-critical-400);
4460
+ --color-background-action-critical-primary-active: var( --color-critical-200 );
4461
+ --color-background-action-critical-primary-disabled: var( --color-neutral-450 );
4462
+ --color-background-action-critical-secondary-normal: var( --color-neutral-600 );
4463
+ --color-background-action-critical-secondary-hover: var( --color-critical-500 );
4464
+ --color-background-action-critical-secondary-active: var( --color-neutral-600 );
4465
+ --color-background-action-critical-secondary-disabled: var( --color-neutral-450 );
4466
+ }
4467
+ }
4468
+ [data-theme=dark] {
4469
+ --color-text-primary-normal: var(--color-neutral-000);
4470
+ --color-text-primary-disabled: var(--color-neutral-400);
4471
+ --color-text-primary-error: var(--color-critical-300);
4472
+ --color-text-secondary-normal: var(--color-neutral-300);
4473
+ --color-text-secondary-disabled: var(--color-neutral-400);
4474
+ --color-text-secondary-error: var(--color-critical-300);
4475
+ --color-text-success-normal: var(--color-success-200);
4476
+ --color-text-success-disabled: var(--color-neutral-300);
4477
+ --color-text-success-error: var(--color-critical-300);
4478
+ --color-text-warning-normal: var(--color-warning-200);
4479
+ --color-text-warning-disabled: var(--color-neutral-300);
4480
+ --color-text-warning-error: var(--color-critical-300);
4481
+ --color-text-link-normal: var(--color-link-300);
4482
+ --color-text-link-hover: var(--color-link-400);
4483
+ --color-text-link-active: var(--color-link-200);
4484
+ --color-text-link-disabled: var(--color-neutral-400);
4485
+ --color-border-primary-normal: var(--color-neutral-400);
4486
+ --color-border-primary-focus: var(--color-action-300);
4487
+ --color-border-primary-error: var(--color-critical-300);
4488
+ --color-icon-primary-normal: var(--color-neutral-300);
4489
+ --color-icon-primary-disabled: var(--color-neutral-400);
4490
+ --color-icon-success-normal: var(--color-success-300);
4491
+ --color-icon-success-disabled: var(--color-neutral-400);
4492
+ --color-icon-warning-normal: var(--color-warning-300);
4493
+ --color-icon-warning-disabled: var(--color-neutral-400);
4494
+ --color-icon-critical-normal: var(--color-critical-300);
4495
+ --color-icon-critical-disabled: var(--color-neutral-400);
4496
+ --color-background-primary-normal: var(--color-neutral-600);
4497
+ --color-background-grouped-primary-normal: var(--color-neutral-500);
4498
+ --color-background-secondary-normal: var(--color-neutral-500);
4499
+ --color-background-grouped-secondary-normal: var(--color-neutral-600);
4500
+ --color-background-success-normal: var(--color-success-300);
4501
+ --color-background-warning-normal: var(--color-warning-300);
4502
+ --color-background-critical-normal: var(--color-critical-300);
4503
+ --color-text-action-primary-normal: var(--color-action-300);
4504
+ --color-text-action-primary-hover: var(--color-action-400);
4505
+ --color-text-action-primary-active: var(--color-action-200);
4506
+ --color-text-action-primary-disabled: var(--color-neutral-400);
4507
+ --color-text-on-action-primary-normal: var(--color-neutral-600);
4508
+ --color-text-on-action-primary-hover: var(--color-neutral-500);
4509
+ --color-text-on-action-primary-active: var(--color-neutral-600);
4510
+ --color-text-on-action-primary-disabled: var(--color-neutral-400);
4511
+ --color-text-action-critical-normal: var(--color-critical-300);
4512
+ --color-text-action-critical-hover: var(--color-critical-400);
4513
+ --color-text-action-critical-active: var(--color-critical-200);
4514
+ --color-text-action-critical-disabled: var(--color-neutral-400);
4515
+ --color-border-action-normal: var(--color-action-300);
4516
+ --color-border-action-hover: var(--color-action-400);
4517
+ --color-border-action-active: var(--color-action-200);
4518
+ --color-border-action-disabled: var(--color-neutral-450);
4519
+ --color-text-critical-normal: var(--color-critical-300);
4520
+ --color-text-critical-disabled: var(--color-neutral-300);
4521
+ --color-text-critical-error: var(--color-critical-300);
4522
+ --color-border-action-critical-normal: var(--color-critical-300);
4523
+ --color-border-action-critical-hover: var(--color-critical-400);
4524
+ --color-border-action-critical-active: var(--color-critical-200);
4525
+ --color-border-action-critical-disabled: var(--color-neutral-450);
4526
+ --color-icon-action-primary-normal: var(--color-neutral-000);
4527
+ --color-icon-action-primary-hover: var(--color-action-300);
4528
+ --color-icon-action-primary-active: var(--color-action-200);
4529
+ --color-icon-action-primary-disabled: var(--color-neutral-400);
4530
+ --color-icon-action-secondary-normal: var(--color-action-300);
4531
+ --color-icon-action-secondary-hover: var(--color-action-400);
4532
+ --color-icon-action-secondary-active: var(--color-action-200);
4533
+ --color-icon-action-secondary-disabled: var(--color-neutral-400);
4534
+ --color-icon-on-action-primary-normal: var(--color-neutral-600);
4535
+ --color-icon-on-action-primary-hover: var(--color-neutral-500);
4536
+ --color-icon-on-action-primary-active: var(--color-neutral-600);
4537
+ --color-icon-on-action-primary-disabled: var(--color-neutral-400);
4538
+ --color-icon-action-critical-normal: var(--color-critical-300);
4539
+ --color-icon-action-critical-hover: var(--color-critical-400);
4540
+ --color-icon-action-critical-active: var(--color-critical-200);
4541
+ --color-icon-action-critical-disabled: var(--color-neutral-400);
4542
+ --color-icon-brand-primary-normal: var(--color-brand-300);
4543
+ --color-icon-brand-primary-hover: var(--color-brand-400);
4544
+ --color-icon-brand-primary-active: var(--color-brand-200);
4545
+ --color-icon-brand-primary-disabled: var(--color-neutral-400);
4546
+ --color-background-action-primary-normal: var(--color-action-300);
4547
+ --color-background-action-primary-hover: var(--color-action-400);
4548
+ --color-background-action-primary-active: var(--color-action-200);
4549
+ --color-background-action-primary-disabled: var(--color-neutral-450);
4550
+ --color-background-action-secondary-normal: var(--color-neutral-600);
4551
+ --color-background-action-secondary-hover: var(--color-action-500);
4552
+ --color-background-action-secondary-active: var(--color-neutral-600);
4553
+ --color-background-action-secondary-disabled: var(--color-neutral-450);
4554
+ --color-background-brand-normal: var(--color-brand-400);
4555
+ --color-background-action-critical-primary-normal: var( --color-critical-300 );
4556
+ --color-background-action-critical-primary-hover: var(--color-critical-400);
4557
+ --color-background-action-critical-primary-active: var( --color-critical-200 );
4558
+ --color-background-action-critical-primary-disabled: var( --color-neutral-450 );
4559
+ --color-background-action-critical-secondary-normal: var( --color-neutral-600 );
4560
+ --color-background-action-critical-secondary-hover: var( --color-critical-500 );
4561
+ --color-background-action-critical-secondary-active: var( --color-neutral-600 );
4562
+ --color-background-action-critical-secondary-disabled: var( --color-neutral-450 );
4563
+ }
4564
+ [data-theme=brand] {
4565
+ --color-text-primary-normal: var(--color-neutral-000);
4566
+ --color-text-primary-disabled: var(--color-neutral-400);
4567
+ --color-text-primary-error: var(--color-critical-200);
4568
+ --color-text-secondary-normal: var(--color-neutral-200);
4569
+ --color-text-secondary-disabled: var(--color-neutral-400);
4570
+ --color-text-secondary-error: var(--color-critical-200);
4571
+ --color-text-success-normal: var(--color-success-200);
4572
+ --color-text-success-disabled: var(--color-neutral-300);
4573
+ --color-text-success-error: var(--color-critical-200);
4574
+ --color-text-warning-normal: var(--color-warning-200);
4575
+ --color-text-warning-disabled: var(--color-neutral-300);
4576
+ --color-text-warning-error: var(--color-critical-200);
4577
+ --color-text-link-normal: var(--color-link-000);
4578
+ --color-text-link-hover: var(--color-brand-200);
4579
+ --color-text-link-active: var(--color-brand-200);
4580
+ --color-text-link-disabled: var(--color-neutral-400);
4581
+ --color-border-primary-normal: var(--color-brand-200);
4582
+ --color-border-primary-focus: var(--color-neutral-000);
4583
+ --color-border-primary-error: var(--color-critical-300);
4584
+ --color-icon-primary-normal: var(--color-brand-200);
4585
+ --color-icon-primary-disabled: var(--color-neutral-400);
4586
+ --color-icon-success-normal: var(--color-success-400);
4587
+ --color-icon-success-disabled: var(--color-neutral-400);
4588
+ --color-icon-warning-normal: var(--color-warning-400);
4589
+ --color-icon-warning-disabled: var(--color-neutral-400);
4590
+ --color-icon-critical-normal: var(--color-critical-400);
4591
+ --color-icon-critical-disabled: var(--color-neutral-400);
4592
+ --color-background-primary-normal: var(--color-brand-400);
4593
+ --color-background-grouped-primary-normal: var(--color-brand-400);
4594
+ --color-background-secondary-normal: var(--color-brand-500);
4595
+ --color-background-grouped-secondary-normal: var(--color-brand-500);
4596
+ --color-background-success-normal: var(--color-success-400);
4597
+ --color-background-warning-normal: var(--color-warning-400);
4598
+ --color-background-critical-normal: var(--color-critical-400);
4599
+ --color-text-action-primary-normal: var(--color-action-000);
4600
+ --color-text-action-primary-hover: var(--color-brand-200);
4601
+ --color-text-action-primary-active: var(--color-brand-200);
4602
+ --color-text-action-primary-disabled: var(--color-neutral-400);
4603
+ --color-text-on-action-primary-normal: var(--color-brand-400);
4604
+ --color-text-on-action-primary-hover: var(--color-brand-200);
4605
+ --color-text-on-action-primary-active: var(--color-brand-200);
4606
+ --color-text-on-action-primary-disabled: var(--color-neutral-400);
4607
+ --color-text-action-critical-normal: var(--color-critical-200);
4608
+ --color-text-action-critical-hover: var(--color-critical-300);
4609
+ --color-text-action-critical-active: var(--color-critical-200);
4610
+ --color-text-action-critical-disabled: var(--color-neutral-400);
4611
+ --color-border-action-normal: var(--color-neutral-000);
4612
+ --color-border-action-hover: var(--color-brand-200);
4613
+ --color-border-action-active: var(--color-brand-200);
4614
+ --color-border-action-disabled: var(--color-neutral-200);
4615
+ --color-text-critical-normal: var(--color-critical-200);
4616
+ --color-text-critical-disabled: var(--color-neutral-300);
4617
+ --color-text-critical-error: var(--color-critical-200);
4618
+ --color-border-action-critical-normal: var(--color-critical-200);
4619
+ --color-border-action-critical-hover: var(--color-critical-300);
4620
+ --color-border-action-critical-active: var(--color-critical-200);
4621
+ --color-border-action-critical-disabled: var(--color-neutral-200);
4622
+ --color-icon-action-primary-normal: var(--color-neutral-000);
4623
+ --color-icon-action-primary-hover: var(--color-brand-200);
4624
+ --color-icon-action-primary-active: var(--color-brand-100);
4625
+ --color-icon-action-primary-disabled: var(--color-neutral-300);
4626
+ --color-icon-action-secondary-normal: var(--color-neutral-000);
4627
+ --color-icon-action-secondary-hover: var(--color-brand-200);
4628
+ --color-icon-action-secondary-active: var(--color-brand-200);
4629
+ --color-icon-action-secondary-disabled: var(--color-neutral-400);
4630
+ --color-icon-on-action-primary-normal: var(--color-brand-400);
4631
+ --color-icon-on-action-primary-hover: var(--color-brand-500);
4632
+ --color-icon-on-action-primary-active: var(--color-brand-300);
4633
+ --color-icon-on-action-primary-disabled: var(--color-neutral-400);
4634
+ --color-icon-action-critical-normal: var(--color-critical-200);
4635
+ --color-icon-action-critical-hover: var(--color-critical-300);
4636
+ --color-icon-action-critical-active: var(--color-critical-200);
4637
+ --color-icon-action-critical-disabled: var(--color-neutral-400);
4638
+ --color-icon-brand-primary-normal: var(--color-neutral-000);
4639
+ --color-icon-brand-primary-hover: var(--color-brand-200);
4640
+ --color-icon-brand-primary-active: var(--color-neutral-000);
4641
+ --color-icon-brand-primary-disabled: var(--color-neutral-300);
4642
+ --color-background-action-primary-normal: var(--color-action-000);
4643
+ --color-background-action-primary-hover: var(--color-brand-200);
4644
+ --color-background-action-primary-active: var(--color-neutral-000);
4645
+ --color-background-action-primary-disabled: var(--color-neutral-200);
4646
+ --color-background-action-secondary-normal: var(--color-brand-400);
4647
+ --color-background-action-secondary-hover: var(--color-brand-500);
4648
+ --color-background-action-secondary-active: var(--color-brand-400);
4649
+ --color-background-action-secondary-disabled: var(--color-neutral-200);
4650
+ --color-background-brand-normal: var(--color-brand-400);
4651
+ --color-background-action-critical-primary-normal: var(--color-critical-400);
4652
+ --color-background-action-critical-primary-hover: var(--color-critical-500);
4653
+ --color-background-action-critical-primary-active: var(--color-critical-300);
4654
+ --color-background-action-critical-primary-disabled: var(--color-neutral-200);
4655
+ --color-background-action-critical-secondary-normal: var(--color-brand-400);
4656
+ --color-background-action-critical-secondary-hover: var(--color-brand-500);
4657
+ --color-background-action-critical-secondary-active: var(--color-brand-400);
4658
+ --color-background-action-critical-secondary-disabled: var( --color-neutral-200 );
4659
+ }
4660
+ body {
4661
+ background-color: var(--color-background-primary-normal);
4662
+ color: var(--color-text-primary-normal);
4663
+ }
4664
+ :root {
4665
+ container-type: inline-size;
4666
+ container-name: root;
4667
+ }
4668
+ @layer components {
4669
+ .icon {
4670
+ font-family: "Icons";
4671
+ font-weight: normal;
4672
+ font-style: normal;
4673
+ font-size: 24px;
4674
+ display: inline-block;
4675
+ line-height: 1;
4676
+ text-transform: none;
4677
+ letter-spacing: normal;
4678
+ word-wrap: normal;
4679
+ white-space: nowrap;
4680
+ direction: ltr;
4681
+ }
4682
+ .icon-24 {
4683
+ font-size: 24px;
4684
+ }
4685
+ .icon-16 {
4686
+ font-size: 16px;
4687
+ }
4688
+ .icon-32 {
4689
+ font-size: 32px;
4690
+ }
4691
+ .no-scrollbar {
4692
+ -ms-overflow-style: none;
4693
+ scrollbar-width: none;
4694
+ }
4695
+ .no-scrollbar::-webkit-scrollbar {
4696
+ display: none;
4697
+ }
4698
+ }
4699
+ @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
4700
+ @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
4701
+ @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
4702
+ @property --tw-rotate-x { syntax: "*"; inherits: false; }
4703
+ @property --tw-rotate-y { syntax: "*"; inherits: false; }
4704
+ @property --tw-rotate-z { syntax: "*"; inherits: false; }
4705
+ @property --tw-skew-x { syntax: "*"; inherits: false; }
4706
+ @property --tw-skew-y { syntax: "*"; inherits: false; }
4707
+ @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
4708
+ @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; }
4709
+ @property --tw-divide-x-reverse { syntax: "*"; inherits: false; initial-value: 0; }
4710
+ @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
4711
+ @property --tw-divide-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }
4712
+ @property --tw-gradient-position { syntax: "*"; inherits: false; }
4713
+ @property --tw-gradient-from { syntax: "<color>"; inherits: false; initial-value: #0000; }
4714
+ @property --tw-gradient-via { syntax: "<color>"; inherits: false; initial-value: #0000; }
4715
+ @property --tw-gradient-to { syntax: "<color>"; inherits: false; initial-value: #0000; }
4716
+ @property --tw-gradient-stops { syntax: "*"; inherits: false; }
4717
+ @property --tw-gradient-via-stops { syntax: "*"; inherits: false; }
4718
+ @property --tw-gradient-from-position { syntax: "<length-percentage>"; inherits: false; initial-value: 0%; }
4719
+ @property --tw-gradient-via-position { syntax: "<length-percentage>"; inherits: false; initial-value: 50%; }
4720
+ @property --tw-gradient-to-position { syntax: "<length-percentage>"; inherits: false; initial-value: 100%; }
4721
+ @property --tw-leading { syntax: "*"; inherits: false; }
4722
+ @property --tw-font-weight { syntax: "*"; inherits: false; }
4723
+ @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
4724
+ @property --tw-shadow-color { syntax: "*"; inherits: false; }
4725
+ @property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
4726
+ @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
4727
+ @property --tw-inset-shadow-color { syntax: "*"; inherits: false; }
4728
+ @property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
4729
+ @property --tw-ring-color { syntax: "*"; inherits: false; }
4730
+ @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
4731
+ @property --tw-inset-ring-color { syntax: "*"; inherits: false; }
4732
+ @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
4733
+ @property --tw-ring-inset { syntax: "*"; inherits: false; }
4734
+ @property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }
4735
+ @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
4736
+ @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
4737
+ @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; }
4738
+ @property --tw-blur { syntax: "*"; inherits: false; }
4739
+ @property --tw-brightness { syntax: "*"; inherits: false; }
4740
+ @property --tw-contrast { syntax: "*"; inherits: false; }
4741
+ @property --tw-grayscale { syntax: "*"; inherits: false; }
4742
+ @property --tw-hue-rotate { syntax: "*"; inherits: false; }
4743
+ @property --tw-invert { syntax: "*"; inherits: false; }
4744
+ @property --tw-opacity { syntax: "*"; inherits: false; }
4745
+ @property --tw-saturate { syntax: "*"; inherits: false; }
4746
+ @property --tw-sepia { syntax: "*"; inherits: false; }
4747
+ @property --tw-drop-shadow { syntax: "*"; inherits: false; }
4748
+ @property --tw-drop-shadow-color { syntax: "*"; inherits: false; }
4749
+ @property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
4750
+ @property --tw-drop-shadow-size { syntax: "*"; inherits: false; }
4751
+ @property --tw-duration { syntax: "*"; inherits: false; }
4752
+ @property --tw-ease { syntax: "*"; inherits: false; }
4753
+ @property --tw-contain-size { syntax: "*"; inherits: false; }
4754
+ @property --tw-contain-layout { syntax: "*"; inherits: false; }
4755
+ @property --tw-contain-paint { syntax: "*"; inherits: false; }
4756
+ @property --tw-contain-style { syntax: "*"; inherits: false; }
4757
+ @property --tw-content { syntax: "*"; initial-value: ""; inherits: false; }
4758
+ @keyframes spin {
4759
+ to {
4760
+ transform: rotate(360deg);
4761
+ }
4762
+ }
4763
+ @layer properties {
4764
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
4765
+ *,
4766
+ ::before,
4767
+ ::after,
4768
+ ::backdrop {
4769
+ --tw-translate-x: 0;
4770
+ --tw-translate-y: 0;
4771
+ --tw-translate-z: 0;
4772
+ --tw-rotate-x: initial;
4773
+ --tw-rotate-y: initial;
4774
+ --tw-rotate-z: initial;
4775
+ --tw-skew-x: initial;
4776
+ --tw-skew-y: initial;
4777
+ --tw-space-y-reverse: 0;
4778
+ --tw-space-x-reverse: 0;
4779
+ --tw-divide-x-reverse: 0;
4780
+ --tw-border-style: solid;
4781
+ --tw-divide-y-reverse: 0;
4782
+ --tw-gradient-position: initial;
4783
+ --tw-gradient-from: #0000;
4784
+ --tw-gradient-via: #0000;
4785
+ --tw-gradient-to: #0000;
4786
+ --tw-gradient-stops: initial;
4787
+ --tw-gradient-via-stops: initial;
4788
+ --tw-gradient-from-position: 0%;
4789
+ --tw-gradient-via-position: 50%;
4790
+ --tw-gradient-to-position: 100%;
4791
+ --tw-leading: initial;
4792
+ --tw-font-weight: initial;
4793
+ --tw-shadow: 0 0 #0000;
4794
+ --tw-shadow-color: initial;
4795
+ --tw-shadow-alpha: 100%;
4796
+ --tw-inset-shadow: 0 0 #0000;
4797
+ --tw-inset-shadow-color: initial;
4798
+ --tw-inset-shadow-alpha: 100%;
4799
+ --tw-ring-color: initial;
4800
+ --tw-ring-shadow: 0 0 #0000;
4801
+ --tw-inset-ring-color: initial;
4802
+ --tw-inset-ring-shadow: 0 0 #0000;
4803
+ --tw-ring-inset: initial;
4804
+ --tw-ring-offset-width: 0px;
4805
+ --tw-ring-offset-color: #fff;
4806
+ --tw-ring-offset-shadow: 0 0 #0000;
4807
+ --tw-outline-style: solid;
4808
+ --tw-blur: initial;
4809
+ --tw-brightness: initial;
4810
+ --tw-contrast: initial;
4811
+ --tw-grayscale: initial;
4812
+ --tw-hue-rotate: initial;
4813
+ --tw-invert: initial;
4814
+ --tw-opacity: initial;
4815
+ --tw-saturate: initial;
4816
+ --tw-sepia: initial;
4817
+ --tw-drop-shadow: initial;
4818
+ --tw-drop-shadow-color: initial;
4819
+ --tw-drop-shadow-alpha: 100%;
4820
+ --tw-drop-shadow-size: initial;
4821
+ --tw-duration: initial;
4822
+ --tw-ease: initial;
4823
+ --tw-contain-size: initial;
4824
+ --tw-contain-layout: initial;
4825
+ --tw-contain-paint: initial;
4826
+ --tw-contain-style: initial;
4827
+ --tw-content: "";
4828
+ }
4829
+ }
4830
+ }
4831
+ /*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */