@dmsi/wedgekit-react 0.0.231 → 0.0.233

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