@nattstack/ui 0.0.84 → 0.0.86

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 (169) hide show
  1. package/dist/components/button/button-spinner.css +97 -0
  2. package/dist/components/button/button-spinner.js +14 -0
  3. package/dist/components/button/button-spinner.module.js +8 -0
  4. package/dist/components/button/button.css +191 -0
  5. package/dist/components/button/button.d.ts +25 -0
  6. package/dist/components/button/button.js +54 -0
  7. package/dist/components/button/button.module.js +21 -0
  8. package/dist/components/button-link/button-link.d.ts +18 -0
  9. package/dist/components/button-link/button-link.js +23 -0
  10. package/dist/components/checkbox/checkbox-icon.js +22 -0
  11. package/dist/components/checkbox/checkbox.css +55 -0
  12. package/dist/components/checkbox/checkbox.d.ts +8 -0
  13. package/dist/components/checkbox/checkbox.js +21 -0
  14. package/dist/components/checkbox/checkbox.module.js +9 -0
  15. package/dist/components/column/column.css +6 -0
  16. package/dist/components/column/column.d.ts +16 -0
  17. package/dist/components/column/column.js +23 -0
  18. package/dist/components/column/column.module.js +5 -0
  19. package/dist/components/dialog-responsive/dialog-responsive-backdrop.css +28 -0
  20. package/dist/components/dialog-responsive/dialog-responsive-backdrop.js +17 -0
  21. package/dist/components/dialog-responsive/dialog-responsive-backdrop.module.js +5 -0
  22. package/dist/components/dialog-responsive/dialog-responsive-bar.css +16 -0
  23. package/dist/components/dialog-responsive/dialog-responsive-bar.js +15 -0
  24. package/dist/components/dialog-responsive/dialog-responsive-bar.module.js +5 -0
  25. package/dist/components/dialog-responsive/dialog-responsive-popup.css +56 -0
  26. package/dist/components/dialog-responsive/dialog-responsive-popup.d.ts +8 -0
  27. package/dist/components/dialog-responsive/dialog-responsive-popup.js +22 -0
  28. package/dist/components/dialog-responsive/dialog-responsive-popup.module.js +5 -0
  29. package/dist/components/dialog-responsive/dialog-responsive-portal.css +7 -0
  30. package/dist/components/dialog-responsive/dialog-responsive-portal.js +17 -0
  31. package/dist/components/dialog-responsive/dialog-responsive-portal.module.js +5 -0
  32. package/dist/components/dialog-responsive/dialog-responsive-trigger.d.ts +7 -0
  33. package/dist/components/dialog-responsive/dialog-responsive-trigger.js +12 -0
  34. package/dist/components/dialog-responsive/dialog-responsive-viewport.css +18 -0
  35. package/dist/components/dialog-responsive/dialog-responsive-viewport.js +17 -0
  36. package/dist/components/dialog-responsive/dialog-responsive-viewport.module.js +5 -0
  37. package/dist/components/dialog-responsive/dialog-responsive.d.ts +10 -0
  38. package/dist/components/dialog-responsive/dialog-responsive.js +15 -0
  39. package/dist/components/icon-button/icon-button.css +25 -0
  40. package/dist/components/icon-button/icon-button.d.ts +12 -0
  41. package/dist/components/icon-button/icon-button.js +34 -0
  42. package/dist/components/icon-button/icon-button.module.js +12 -0
  43. package/dist/components/index.d.ts +46 -359
  44. package/dist/components/index.js +46 -1034
  45. package/dist/components/input/input.css +84 -0
  46. package/dist/components/input/input.d.ts +22 -0
  47. package/dist/components/input/input.js +44 -0
  48. package/dist/components/input/input.module.js +14 -0
  49. package/dist/components/label/label.css +7 -0
  50. package/dist/components/label/label.d.ts +7 -0
  51. package/dist/components/label/label.js +16 -0
  52. package/dist/components/label/label.module.js +5 -0
  53. package/dist/components/menu/menu-checkbox-item.d.ts +14 -0
  54. package/dist/components/menu/menu-checkbox-item.js +44 -0
  55. package/dist/components/menu/menu-class-names.d.ts +23 -0
  56. package/dist/components/menu/menu-class-names.js +24 -0
  57. package/dist/components/menu/menu-content.d.ts +11 -0
  58. package/dist/components/menu/menu-content.js +38 -0
  59. package/dist/components/menu/menu-group-label.d.ts +9 -0
  60. package/dist/components/menu/menu-group-label.js +16 -0
  61. package/dist/components/menu/menu-group.d.ts +9 -0
  62. package/dist/components/menu/menu-group.js +16 -0
  63. package/dist/components/menu/menu-item.d.ts +10 -0
  64. package/dist/components/menu/menu-item.js +18 -0
  65. package/dist/components/menu/menu-link-item.d.ts +7 -0
  66. package/dist/components/menu/menu-link-item.js +13 -0
  67. package/dist/components/menu/menu-radio-group.d.ts +10 -0
  68. package/dist/components/menu/menu-radio-group.js +17 -0
  69. package/dist/components/menu/menu-radio-item.d.ts +12 -0
  70. package/dist/components/menu/menu-radio-item.js +43 -0
  71. package/dist/components/menu/menu-separator.d.ts +9 -0
  72. package/dist/components/menu/menu-separator.js +16 -0
  73. package/dist/components/menu/menu-submenu-trigger.d.ts +7 -0
  74. package/dist/components/menu/menu-submenu-trigger.js +13 -0
  75. package/dist/components/menu/menu-submenu.d.ts +11 -0
  76. package/dist/components/menu/menu-submenu.js +15 -0
  77. package/dist/components/menu/menu-trigger.d.ts +7 -0
  78. package/dist/components/menu/menu-trigger.js +12 -0
  79. package/dist/components/menu/menu-viewport.d.ts +9 -0
  80. package/dist/components/menu/menu-viewport.js +16 -0
  81. package/dist/components/menu/menu.css +209 -0
  82. package/dist/components/menu/menu.d.ts +12 -0
  83. package/dist/components/menu/menu.js +16 -0
  84. package/dist/components/menu/menu.module.js +24 -0
  85. package/dist/components/otp-field/otp-field-input.css +33 -0
  86. package/dist/components/otp-field/otp-field-input.d.ts +8 -0
  87. package/dist/components/otp-field/otp-field-input.js +16 -0
  88. package/dist/components/otp-field/otp-field-input.module.js +5 -0
  89. package/dist/components/otp-field/otp-field.css +13 -0
  90. package/dist/components/otp-field/otp-field.d.ts +13 -0
  91. package/dist/components/otp-field/otp-field.js +27 -0
  92. package/dist/components/otp-field/otp-field.module.js +8 -0
  93. package/dist/components/row/row.css +6 -0
  94. package/dist/components/row/row.d.ts +16 -0
  95. package/dist/components/row/row.js +23 -0
  96. package/dist/components/row/row.module.js +5 -0
  97. package/dist/components/spacer/spacer.css +5 -0
  98. package/dist/components/spacer/spacer.d.ts +10 -0
  99. package/dist/components/spacer/spacer.js +19 -0
  100. package/dist/components/spacer/spacer.module.js +5 -0
  101. package/dist/components/switch/switch.css +54 -0
  102. package/dist/components/switch/switch.d.ts +19 -0
  103. package/dist/components/switch/switch.js +31 -0
  104. package/dist/components/switch/switch.module.js +10 -0
  105. package/dist/components/tabs/tabs-panel.css +14 -0
  106. package/dist/components/tabs/tabs-panel.d.ts +8 -0
  107. package/dist/components/tabs/tabs-panel.js +17 -0
  108. package/dist/components/tabs/tabs-panel.module.js +5 -0
  109. package/dist/components/tabs/tabs.css +6 -0
  110. package/dist/components/tabs/tabs.d.ts +8 -0
  111. package/dist/components/tabs/tabs.js +17 -0
  112. package/dist/components/tabs/tabs.module.js +5 -0
  113. package/dist/components/tabs-pill/tabs-pill-indicator.css +14 -0
  114. package/dist/components/tabs-pill/tabs-pill-indicator.js +18 -0
  115. package/dist/components/tabs-pill/tabs-pill-indicator.module.js +5 -0
  116. package/dist/components/tabs-pill/tabs-pill-list.css +9 -0
  117. package/dist/components/tabs-pill/tabs-pill-list.d.ts +8 -0
  118. package/dist/components/tabs-pill/tabs-pill-list.js +19 -0
  119. package/dist/components/tabs-pill/tabs-pill-list.module.js +5 -0
  120. package/dist/components/tabs-pill/tabs-pill-tab.css +66 -0
  121. package/dist/components/tabs-pill/tabs-pill-tab.d.ts +10 -0
  122. package/dist/components/tabs-pill/tabs-pill-tab.js +21 -0
  123. package/dist/components/tabs-pill/tabs-pill-tab.module.js +9 -0
  124. package/dist/components/tabs-segmented/tabs-segmented-indicator.css +14 -0
  125. package/dist/components/tabs-segmented/tabs-segmented-indicator.js +18 -0
  126. package/dist/components/tabs-segmented/tabs-segmented-indicator.module.js +5 -0
  127. package/dist/components/tabs-segmented/tabs-segmented-list.css +13 -0
  128. package/dist/components/tabs-segmented/tabs-segmented-list.d.ts +8 -0
  129. package/dist/components/tabs-segmented/tabs-segmented-list.js +19 -0
  130. package/dist/components/tabs-segmented/tabs-segmented-list.module.js +5 -0
  131. package/dist/components/tabs-segmented/tabs-segmented-tab.css +37 -0
  132. package/dist/components/tabs-segmented/tabs-segmented-tab.d.ts +10 -0
  133. package/dist/components/tabs-segmented/tabs-segmented-tab.js +18 -0
  134. package/dist/components/tabs-segmented/tabs-segmented-tab.module.js +5 -0
  135. package/dist/components/tabs-underline/tabs-underline-indicator.css +12 -0
  136. package/dist/components/tabs-underline/tabs-underline-indicator.js +18 -0
  137. package/dist/components/tabs-underline/tabs-underline-indicator.module.js +5 -0
  138. package/dist/components/tabs-underline/tabs-underline-list.css +10 -0
  139. package/dist/components/tabs-underline/tabs-underline-list.d.ts +8 -0
  140. package/dist/components/tabs-underline/tabs-underline-list.js +19 -0
  141. package/dist/components/tabs-underline/tabs-underline-list.module.js +5 -0
  142. package/dist/components/tabs-underline/tabs-underline-tab.css +36 -0
  143. package/dist/components/tabs-underline/tabs-underline-tab.d.ts +10 -0
  144. package/dist/components/tabs-underline/tabs-underline-tab.js +18 -0
  145. package/dist/components/tabs-underline/tabs-underline-tab.module.js +5 -0
  146. package/dist/components/textarea/textarea.css +9 -0
  147. package/dist/components/textarea/textarea.d.ts +17 -0
  148. package/dist/components/textarea/textarea.js +31 -0
  149. package/dist/components/textarea/textarea.module.js +5 -0
  150. package/dist/components/toggle-group/toggle-group-item.css +47 -0
  151. package/dist/components/toggle-group/toggle-group-item.d.ts +11 -0
  152. package/dist/components/toggle-group/toggle-group-item.js +18 -0
  153. package/dist/components/toggle-group/toggle-group-item.module.js +5 -0
  154. package/dist/components/toggle-group/toggle-group.css +7 -0
  155. package/dist/components/toggle-group/toggle-group.d.ts +12 -0
  156. package/dist/components/toggle-group/toggle-group.js +19 -0
  157. package/dist/components/toggle-group/toggle-group.module.js +5 -0
  158. package/dist/components/tooltip/tooltip-popup.css +32 -0
  159. package/dist/components/tooltip/tooltip-popup.d.ts +8 -0
  160. package/dist/components/tooltip/tooltip-popup.js +25 -0
  161. package/dist/components/tooltip/tooltip-popup.module.js +8 -0
  162. package/dist/components/tooltip/tooltip-provider.d.ts +7 -0
  163. package/dist/components/tooltip/tooltip-provider.js +12 -0
  164. package/dist/components/tooltip/tooltip-trigger.d.ts +7 -0
  165. package/dist/components/tooltip/tooltip-trigger.js +12 -0
  166. package/dist/components/tooltip/tooltip.d.ts +10 -0
  167. package/dist/components/tooltip/tooltip.js +14 -0
  168. package/package.json +6 -3
  169. package/dist/components/style.css +0 -1181
@@ -1,1181 +0,0 @@
1
- @layer components {
2
- .button-spinner-module_base_UApLZa {
3
- height: var(--size);
4
- width: var(--size);
5
- animation: 1s steps(12, end) infinite button-spinner-module_spinner_UApLZa;
6
- position: absolute;
7
- scale: -1 1;
8
- }
9
-
10
- @keyframes button-spinner-module_spinner_UApLZa {
11
- to {
12
- rotate: 1turn;
13
- }
14
- }
15
-
16
- .button-spinner-module_base_UApLZa > div {
17
- height: calc(var(--size) / 12);
18
- pointer-events: none;
19
- transform-origin: 0;
20
- width: calc(var(--size) / 2);
21
- transition: all .15s;
22
- position: absolute;
23
- top: 50%;
24
- right: 0;
25
- translate: 0 -50%;
26
- }
27
-
28
- .button-spinner-module_base_UApLZa > div:after {
29
- content: "";
30
- background-color: currentColor;
31
- border-radius: 9999px;
32
- width: 50%;
33
- height: 100%;
34
- position: absolute;
35
- right: 0;
36
- }
37
-
38
- .button-spinner-module_base_UApLZa > div:first-child {
39
- opacity: 1;
40
- rotate: 0deg;
41
- }
42
-
43
- .button-spinner-module_base_UApLZa > div:nth-child(2) {
44
- opacity: .925;
45
- rotate: 30deg;
46
- }
47
-
48
- .button-spinner-module_base_UApLZa > div:nth-child(3) {
49
- opacity: .85;
50
- rotate: 60deg;
51
- }
52
-
53
- .button-spinner-module_base_UApLZa > div:nth-child(4) {
54
- opacity: .775;
55
- rotate: 90deg;
56
- }
57
-
58
- .button-spinner-module_base_UApLZa > div:nth-child(5) {
59
- opacity: .7;
60
- rotate: 120deg;
61
- }
62
-
63
- .button-spinner-module_base_UApLZa > div:nth-child(6) {
64
- opacity: .625;
65
- rotate: 150deg;
66
- }
67
-
68
- .button-spinner-module_base_UApLZa > div:nth-child(7) {
69
- opacity: .55;
70
- rotate: 180deg;
71
- }
72
-
73
- .button-spinner-module_base_UApLZa > div:nth-child(8) {
74
- opacity: .475;
75
- rotate: 210deg;
76
- }
77
-
78
- .button-spinner-module_base_UApLZa > div:nth-child(9) {
79
- opacity: .4;
80
- rotate: 240deg;
81
- }
82
-
83
- .button-spinner-module_base_UApLZa > div:nth-child(10) {
84
- opacity: .325;
85
- rotate: 270deg;
86
- }
87
-
88
- .button-spinner-module_base_UApLZa > div:nth-child(11) {
89
- opacity: .25;
90
- rotate: 300deg;
91
- }
92
-
93
- .button-spinner-module_base_UApLZa > div:nth-child(12) {
94
- opacity: .15;
95
- rotate: 330deg;
96
- }
97
- }
98
- @layer components {
99
- .button-module_base_4nLWdW {
100
- cursor: pointer;
101
- outline-offset: 2px;
102
- user-select: none;
103
- outline: 2px solid #0000;
104
- justify-content: center;
105
- align-items: center;
106
- column-gap: 8px;
107
- font-size: 14px;
108
- font-weight: 500;
109
- transition-property: background-color, box-shadow, translate;
110
- transition-duration: .15s;
111
- display: inline-flex;
112
- position: relative;
113
- overflow: hidden;
114
- }
115
-
116
- .button-module_base_4nLWdW:active:not(:disabled) {
117
- translate: 0 1px;
118
- }
119
-
120
- .button-module_base_4nLWdW:focus-visible {
121
- outline-color: var(--color-outline);
122
- }
123
-
124
- .button-module_disabled_4nLWdW, .button-module_loading_4nLWdW {
125
- cursor: not-allowed;
126
- opacity: .5;
127
- }
128
-
129
- .button-module_loading_4nLWdW > :not([data-slot="button-spinner"]) {
130
- color: #0000;
131
- text-shadow: none;
132
- }
133
-
134
- .button-module_rounded_base_4nLWdW.button-module_size_32_4nLWdW {
135
- border-radius: 8px;
136
- padding: 0 12px;
137
- }
138
-
139
- .button-module_rounded_base_4nLWdW.button-module_size_36_4nLWdW {
140
- border-radius: 9px;
141
- padding: 0 14px;
142
- }
143
-
144
- .button-module_rounded_base_4nLWdW.button-module_size_40_4nLWdW {
145
- border-radius: 10px;
146
- padding: 0 16px;
147
- }
148
-
149
- .button-module_rounded_base_4nLWdW.button-module_size_44_4nLWdW {
150
- border-radius: 11px;
151
- padding: 0 18px;
152
- }
153
-
154
- .button-module_rounded_base_4nLWdW.button-module_size_48_4nLWdW {
155
- border-radius: 12px;
156
- padding: 0 20px;
157
- }
158
-
159
- .button-module_rounded_full_4nLWdW.button-module_size_32_4nLWdW {
160
- border-radius: 16px;
161
- padding: 0 12px;
162
- }
163
-
164
- .button-module_rounded_full_4nLWdW.button-module_size_36_4nLWdW {
165
- border-radius: 18px;
166
- padding: 0 17px;
167
- }
168
-
169
- .button-module_rounded_full_4nLWdW.button-module_size_40_4nLWdW {
170
- border-radius: 20px;
171
- padding: 0 20px;
172
- }
173
-
174
- .button-module_rounded_full_4nLWdW.button-module_size_44_4nLWdW {
175
- border-radius: 22px;
176
- padding: 0 23px;
177
- }
178
-
179
- .button-module_rounded_full_4nLWdW.button-module_size_48_4nLWdW {
180
- border-radius: 24px;
181
- padding: 0 28px;
182
- }
183
-
184
- .button-module_size_32_4nLWdW {
185
- height: 32px;
186
- }
187
-
188
- .button-module_size_36_4nLWdW {
189
- height: 36px;
190
- }
191
-
192
- .button-module_size_40_4nLWdW {
193
- height: 40px;
194
- }
195
-
196
- .button-module_size_44_4nLWdW {
197
- height: 44px;
198
- }
199
-
200
- .button-module_size_48_4nLWdW {
201
- height: 48px;
202
- }
203
-
204
- .button-module_variant_ghost_4nLWdW {
205
- color: #000;
206
- background-color: #0000;
207
- }
208
-
209
- .button-module_variant_ghost_4nLWdW:hover:not(:disabled) {
210
- background-color: var(--color-gray-4);
211
- }
212
-
213
- .dark .button-module_variant_ghost_4nLWdW {
214
- color: #fff;
215
- }
216
-
217
- .button-module_variant_primary_4nLWdW {
218
- background-color: var(--color-primary);
219
- box-shadow: inset 0 0 0 1px var(--color-primary),
220
- inset 0 1px 0 1px #ffffff40;
221
- color: #fff;
222
- isolation: isolate;
223
- }
224
-
225
- .button-module_variant_primary_4nLWdW:after {
226
- content: "";
227
- mix-blend-mode: overlay;
228
- pointer-events: none;
229
- transition-duration: inherit;
230
- background-image: radial-gradient(75% 100% at 50% -50%, #ffffff40, #0000);
231
- transition-property: opacity;
232
- position: absolute;
233
- inset: 0;
234
- }
235
-
236
- .button-module_variant_primary_4nLWdW:hover:not(:disabled):after {
237
- opacity: 0;
238
- }
239
-
240
- .dark .button-module_variant_primary_4nLWdW {
241
- box-shadow: inset 0 1px #ffffff40;
242
- }
243
-
244
- .button-module_variant_primary_4nLWdW:hover:not(:disabled) {
245
- --color-mixed: #000;
246
- background-color: color-mix(in oklab, var(--color-primary) 100%, var(--color-mixed) 10%);
247
- box-shadow: none;
248
- }
249
-
250
- .dark .button-module_variant_primary_4nLWdW:hover:not(:disabled) {
251
- --color-mixed: #fff;
252
- }
253
-
254
- .button-module_variant_primary_4nLWdW > * {
255
- filter: drop-shadow(0 1px 1px #00000040);
256
- transition-duration: inherit;
257
- transition-property: filter;
258
- }
259
-
260
- .button-module_variant_primary_4nLWdW:hover:not(:disabled) > * {
261
- filter: none;
262
- }
263
-
264
- .button-module_variant_secondary_4nLWdW {
265
- --color-text: #000;
266
- background-color: var(--color-bg-shell-outer);
267
- box-shadow: inset 0 0 0 1px var(--color-border);
268
- color: var(--color-text);
269
- }
270
-
271
- .dark .button-module_variant_secondary_4nLWdW {
272
- --color-text: #fff;
273
- }
274
-
275
- .button-module_variant_secondary_4nLWdW:hover:not(:disabled) {
276
- background-color: var(--color-gray-4);
277
- box-shadow: none;
278
- }
279
-
280
- .button-module_width_base_4nLWdW {
281
- width: fit-content;
282
- }
283
-
284
- .button-module_width_full_4nLWdW {
285
- width: stretch;
286
- }
287
- }
288
- @layer components {
289
- .checkbox-module_checkbox_tQ0i7W {
290
- --size: 16px;
291
- background-color: var(--color-bg-shell-inner);
292
- border: 1px solid var(--color-border);
293
- cursor: pointer;
294
- height: var(--size);
295
- outline-color: var(--color-primary);
296
- outline-offset: 2px;
297
- width: var(--size);
298
- border-radius: 4px;
299
- outline-width: 0;
300
- outline-style: solid;
301
- justify-content: center;
302
- align-items: center;
303
- transition-property: background-color, border-color;
304
- transition-duration: .15s;
305
- display: flex;
306
- }
307
-
308
- .checkbox-module_checkbox_tQ0i7W:focus-visible {
309
- outline-width: 2px;
310
- }
311
-
312
- .checkbox-module_checkbox_tQ0i7W:hover {
313
- background-color: var(--color-gray-3);
314
- border-color: var(--color-gray-6);
315
- }
316
-
317
- .checkbox-module_checkbox_tQ0i7W[data-checked] {
318
- background-color: var(--color-primary);
319
- border-color: #0000;
320
- }
321
-
322
- .checkbox-module_indicator_tQ0i7W {
323
- opacity: 0;
324
- transition-property: opacity;
325
- transition-duration: .15s;
326
- }
327
-
328
- .checkbox-module_indicator_tQ0i7W[data-checked] {
329
- opacity: 1;
330
- }
331
-
332
- .checkbox-module_icon_tQ0i7W {
333
- --size: 12px;
334
- height: var(--size);
335
- width: var(--size);
336
-
337
- & > path {
338
- stroke-width: 3px;
339
- stroke: #fff;
340
- }
341
- }
342
- }
343
- @layer components {
344
- .column-module_column_CgFaGG {
345
- flex-direction: column;
346
- display: flex;
347
- }
348
- }
349
- @layer components {
350
- .dialog-responsive-backdrop-module_dialog_responsive_backdrop_-X7FOq {
351
- --backdrop-opacity: .25;
352
- opacity: calc(var(--backdrop-opacity) * (1 - var(--drawer-swipe-progress)));
353
- outline-color: var(--color-primary-9);
354
- background-color: #000;
355
- transition-property: opacity;
356
- transition-duration: .15s;
357
- position: fixed;
358
- inset: 0;
359
- }
360
-
361
- .dialog-responsive-backdrop-module_dialog_responsive_backdrop_-X7FOq[data-ending-style], .dialog-responsive-backdrop-module_dialog_responsive_backdrop_-X7FOq[data-starting-style] {
362
- opacity: 0;
363
- }
364
-
365
- .dialog-responsive-backdrop-module_dialog_responsive_backdrop_-X7FOq[data-ending-style] {
366
- transition-duration: calc(var(--drawer-swipe-strength) * .4s);
367
- }
368
-
369
- .dialog-responsive-backdrop-module_dialog_responsive_backdrop_-X7FOq[data-swiping] {
370
- transition-duration: 0s;
371
- }
372
-
373
- .dark .dialog-responsive-backdrop-module_dialog_responsive_backdrop_-X7FOq {
374
- --backdrop-opacity: .75;
375
- }
376
- }
377
- @layer components {
378
- .dialog-responsive-bar-module_dialog_responsive_bar_iUwUCq {
379
- background-color: var(--color-gray-4);
380
- border-radius: 9999px;
381
- width: 48px;
382
- height: 4px;
383
- margin: 12px auto;
384
- display: none;
385
- }
386
-
387
- @media (width <= 640px) {
388
- .dialog-responsive-bar-module_dialog_responsive_bar_iUwUCq {
389
- display: block;
390
- }
391
- }
392
- }
393
- @layer components {
394
- .dialog-responsive-portal-module_dialog_responsive_portal_keH0Tq {
395
- isolation: isolate;
396
- z-index: 30;
397
- position: relative;
398
- }
399
- }
400
- @layer components {
401
- .dialog-responsive-viewport-module_dialog_responsive_viewport_b5ZINa {
402
- cursor: pointer;
403
- justify-content: safe center;
404
- align-items: safe center;
405
- padding: 24px;
406
- display: flex;
407
- position: fixed;
408
- inset: 0;
409
- }
410
-
411
- @media (width <= 640px) {
412
- .dialog-responsive-viewport-module_dialog_responsive_viewport_b5ZINa {
413
- align-items: safe flex-end;
414
- padding: 48px 0 0;
415
- }
416
- }
417
- }
418
- @layer components {
419
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq {
420
- background-color: var(--color-gray-1);
421
- cursor: auto;
422
- outline-color: var(--color-primary-9);
423
- outline-offset: -4px;
424
- will-change: opacity, transform;
425
- border-radius: 16px;
426
- outline-width: 0;
427
- outline-style: solid;
428
- flex-direction: column;
429
- width: 100%;
430
- max-width: 640px;
431
- padding: 16px;
432
- transition-property: opacity, transform;
433
- transition-duration: .15s;
434
- display: flex;
435
- }
436
-
437
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq:focus-visible {
438
- outline-width: 2px;
439
- }
440
-
441
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq[data-ending-style], .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq[data-starting-style] {
442
- opacity: 0;
443
- transform: scale(.975);
444
- }
445
-
446
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq[data-swiping] {
447
- user-select: none;
448
- }
449
-
450
- @media (width <= 640px) {
451
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq {
452
- --radius-mobile: 24px;
453
- border-bottom-right-radius: 0;
454
- border-bottom-left-radius: 0;
455
- border-top-left-radius: var(--radius-mobile);
456
- border-top-right-radius: var(--radius-mobile);
457
- transform: translateY(var(--drawer-swipe-movement-y));
458
- padding-top: 0;
459
- transition-property: transform;
460
- transition-duration: .45s;
461
- transition-timing-function: cubic-bezier(.32, .72, 0, 1);
462
- }
463
-
464
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq[data-ending-style], .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq[data-starting-style] {
465
- opacity: 1;
466
- transform: scale(1) translateY(100%);
467
- }
468
-
469
- .dialog-responsive-popup-module_dialog_responsive_popup_cgfWTq[data-ending-style] {
470
- transition-duration: calc(var(--drawer-swipe-strength) * .3s);
471
- }
472
- }
473
- }
474
- @layer components {
475
- .icon-button-module_base_gxECxa {
476
- padding: 0;
477
- }
478
-
479
- .icon-button-module_size_32_gxECxa {
480
- width: 32px;
481
- }
482
-
483
- .icon-button-module_size_36_gxECxa {
484
- width: 36px;
485
- }
486
-
487
- .icon-button-module_size_40_gxECxa {
488
- width: 40px;
489
- }
490
-
491
- .icon-button-module_size_44_gxECxa {
492
- width: 44px;
493
- }
494
-
495
- .icon-button-module_size_48_gxECxa {
496
- width: 48px;
497
- }
498
- }
499
- @layer components {
500
- .input-module_input_o34hyq {
501
- appearance: none;
502
- background-color: var(--color-bg-shell-inner);
503
- box-shadow: 0 0 0 1px var(--color-border) inset;
504
- color: var(--color-text-primary);
505
- cursor: text;
506
- font-family: var(--font-body);
507
- outline-offset: -2px;
508
- border-style: none;
509
- outline: 2px solid #0000;
510
- width: 100%;
511
- font-size: 14px;
512
- font-weight: 400;
513
- line-height: 1.5;
514
- text-decoration: none;
515
- transition-property: box-shadow, opacity;
516
- transition-duration: .15s;
517
- }
518
-
519
- .input-module_input_o34hyq::placeholder {
520
- color: var(--color-gray-9);
521
- user-select: none;
522
- }
523
-
524
- .input-module_input_o34hyq:disabled {
525
- cursor: not-allowed;
526
- opacity: .5;
527
- }
528
-
529
- .input-module_input_o34hyq:enabled:active, .input-module_input_o34hyq:enabled:focus, .input-module_input_o34hyq:enabled:hover, .input-module_input_o34hyq:enabled[data-is-active="true"] {
530
- box-shadow: 0 0 0 1px var(--color-gray-6) inset;
531
- }
532
-
533
- .input-module_input_o34hyq[data-is-valid="true"] {
534
- outline-color: #30a46c;
535
- }
536
-
537
- .input-module_input_o34hyq[data-is-invalid="true"] {
538
- outline-color: #e5484d;
539
- }
540
-
541
- .input-module_input_o34hyq:focus-visible {
542
- outline-color: var(--color-outline);
543
- }
544
-
545
- .input-module_input__rounded_base_o34hyq {
546
- border-radius: 12px;
547
- }
548
-
549
- .input-module_input_o34hyq.input-module_input__rounded_full_o34hyq {
550
- border-radius: 9999px;
551
- }
552
-
553
- .input-module_input__size_32_o34hyq {
554
- border-radius: 8px;
555
- min-height: 32px;
556
- padding: 0 8px;
557
- }
558
-
559
- .input-module_input__size_36_o34hyq {
560
- border-radius: 9px;
561
- min-height: 36px;
562
- padding: 0 10px;
563
- }
564
-
565
- .input-module_input__size_40_o34hyq {
566
- border-radius: 10px;
567
- min-height: 40px;
568
- padding: 0 12px;
569
- }
570
-
571
- .input-module_input__size_44_o34hyq {
572
- border-radius: 11px;
573
- min-height: 44px;
574
- padding: 0 14px;
575
- }
576
-
577
- .input-module_input__size_48_o34hyq {
578
- border-radius: 12px;
579
- min-height: 48px;
580
- padding: 0 16px;
581
- }
582
- }
583
- @layer components {
584
- .label-module_label_iQZ4sG {
585
- color: var(--color-text-secondary);
586
- width: fit-content;
587
- font-size: 14px;
588
- }
589
- }
590
- @layer components {
591
- .menu-module_menu_trigger_7pJHya {
592
- background-color: var(--color-gray-2);
593
- box-shadow: 0 0 0 1px var(--color-gray-4) inset;
594
- color: var(--color-text-primary);
595
- cursor: pointer;
596
- font-family: var(--font-body);
597
- outline-color: var(--color-primary-9);
598
- outline-offset: 2px;
599
- user-select: none;
600
- background-image: linear-gradient(oklab(0% none none / 0) 50%, oklab(0% none none / .0196078) 50%);
601
- border-style: none;
602
- border-radius: 10px;
603
- outline-width: 0;
604
- outline-style: solid;
605
- flex-shrink: 0;
606
- justify-content: safe center;
607
- align-items: safe center;
608
- column-gap: 8px;
609
- width: max-content;
610
- height: 40px;
611
- padding: 0 14px;
612
- font-size: 14px;
613
- font-weight: 500;
614
- line-height: 1.5;
615
- transition-property: background-color, opacity, translate;
616
- transition-duration: .15s;
617
- display: inline-flex;
618
- overflow: hidden;
619
- }
620
-
621
- .menu-module_menu_trigger_7pJHya:hover:not(:disabled), .menu-module_menu_trigger_7pJHya[data-popup-open] {
622
- background-color: var(--color-gray-3);
623
- }
624
-
625
- .menu-module_menu_trigger_7pJHya:active:not(:disabled), .menu-module_menu_trigger_7pJHya[data-pressed] {
626
- translate: 0 1px;
627
- }
628
-
629
- .menu-module_menu_trigger_7pJHya:disabled {
630
- cursor: not-allowed;
631
- opacity: .5;
632
- }
633
-
634
- .menu-module_menu_trigger_7pJHya:focus-visible {
635
- outline-width: 2px;
636
- }
637
-
638
- .menu-module_menu_trigger_7pJHya > svg {
639
- --size-icon: 16px;
640
- height: var(--size-icon);
641
- width: var(--size-icon);
642
- }
643
-
644
- .dark .menu-module_menu_trigger_7pJHya {
645
- background-image: linear-gradient(oklab(100% 0 5.96046e-8 / .00990099) 50%, oklab(0% 0 0 / 0) 50%);
646
- }
647
-
648
- .menu-module_menu_content_positioner_7pJHya {
649
- isolation: isolate;
650
- z-index: 50;
651
- }
652
-
653
- .menu-module_menu_content_7pJHya {
654
- background-color: var(--color-bg-shell-inner);
655
- box-shadow: 0 0 0 1px var(--color-border) inset,
656
- 0 16px 32px oklab(0% none none / .16);
657
- color: var(--color-text-primary);
658
- font-family: var(--font-body);
659
- max-height: min(var(--available-height), 480px);
660
- max-width: min(var(--available-width), 320px);
661
- outline-color: var(--color-primary-9);
662
- outline-offset: -2px;
663
- min-width: 180px;
664
- transform-origin: var(--transform-origin);
665
- will-change: opacity, transform;
666
- border-radius: 12px;
667
- outline-width: 0;
668
- outline-style: solid;
669
- flex-direction: column;
670
- padding: 4px;
671
- transition-property: opacity, transform;
672
- transition-duration: .15s;
673
- display: flex;
674
- overflow: auto;
675
- }
676
-
677
- .menu-module_menu_content_7pJHya:focus-visible {
678
- outline-width: 2px;
679
- }
680
-
681
- .menu-module_menu_content_7pJHya[data-ending-style], .menu-module_menu_content_7pJHya[data-starting-style] {
682
- opacity: 0;
683
- transform: scale(.975);
684
- }
685
-
686
- .menu-module_menu_content_7pJHya[data-side="top"][data-ending-style], .menu-module_menu_content_7pJHya[data-side="top"][data-starting-style] {
687
- transform: scale(.975) translateY(4px);
688
- }
689
-
690
- .menu-module_menu_content_7pJHya[data-side="bottom"][data-ending-style], .menu-module_menu_content_7pJHya[data-side="bottom"][data-starting-style] {
691
- transform: scale(.975) translateY(-4px);
692
- }
693
-
694
- .menu-module_menu_content_7pJHya[data-side="left"][data-ending-style], .menu-module_menu_content_7pJHya[data-side="left"][data-starting-style], .menu-module_menu_content_7pJHya[data-side="inline-start"][data-ending-style], .menu-module_menu_content_7pJHya[data-side="inline-start"][data-starting-style] {
695
- transform: scale(.975) translateX(4px);
696
- }
697
-
698
- .menu-module_menu_content_7pJHya[data-side="right"][data-ending-style], .menu-module_menu_content_7pJHya[data-side="right"][data-starting-style], .menu-module_menu_content_7pJHya[data-side="inline-end"][data-ending-style], .menu-module_menu_content_7pJHya[data-side="inline-end"][data-starting-style] {
699
- transform: scale(.975) translateX(-4px);
700
- }
701
-
702
- .menu-module_menu_content_arrow_7pJHya {
703
- color: var(--color-bg-primary);
704
- display: flex;
705
- }
706
-
707
- .menu-module_menu_content_arrow__icon_7pJHya {
708
- fill: currentColor;
709
- filter: drop-shadow(0 -1px 0 var(--color-border));
710
- display: block;
711
- }
712
-
713
- .menu-module_menu_content_arrow_7pJHya[data-side="top"] {
714
- rotate: 180deg;
715
- }
716
-
717
- .menu-module_menu_content_arrow_7pJHya[data-side="left"], .menu-module_menu_content_arrow_7pJHya[data-side="inline-start"] {
718
- rotate: 90deg;
719
- }
720
-
721
- .menu-module_menu_content_arrow_7pJHya[data-side="right"], .menu-module_menu_content_arrow_7pJHya[data-side="inline-end"] {
722
- rotate: -90deg;
723
- }
724
-
725
- .menu-module_menu_checkbox_item_7pJHya, .menu-module_menu_item_7pJHya, .menu-module_menu_link_item_7pJHya, .menu-module_menu_radio_item_7pJHya, .menu-module_menu_submenu_trigger_7pJHya {
726
- color: var(--color-text-primary);
727
- cursor: pointer;
728
- user-select: none;
729
- border-radius: 8px;
730
- outline: none;
731
- align-items: safe center;
732
- column-gap: 8px;
733
- min-height: 32px;
734
- padding: 0 8px;
735
- font-size: 14px;
736
- font-weight: 500;
737
- line-height: 1.5;
738
- text-decoration: none;
739
- display: flex;
740
- position: relative;
741
- }
742
-
743
- .menu-module_menu_checkbox_item_7pJHya[data-highlighted], .menu-module_menu_item_7pJHya[data-highlighted], .menu-module_menu_link_item_7pJHya[data-highlighted], .menu-module_menu_radio_item_7pJHya[data-highlighted], .menu-module_menu_submenu_trigger_7pJHya[data-highlighted], .menu-module_menu_submenu_trigger_7pJHya[data-popup-open] {
744
- background-color: var(--color-gray-3);
745
- }
746
-
747
- .menu-module_menu_checkbox_item_7pJHya[data-disabled], .menu-module_menu_item_7pJHya[data-disabled], .menu-module_menu_radio_item_7pJHya[data-disabled], .menu-module_menu_submenu_trigger_7pJHya[data-disabled] {
748
- cursor: not-allowed;
749
- opacity: .5;
750
- }
751
-
752
- .menu-module_menu_item__icon_7pJHya, .menu-module_menu_item__indicator_7pJHya {
753
- color: var(--color-text-secondary);
754
- flex-shrink: 0;
755
- justify-content: safe center;
756
- align-items: safe center;
757
- width: 16px;
758
- height: 16px;
759
- display: flex;
760
- }
761
-
762
- .menu-module_menu_item__indicator_7pJHya {
763
- color: var(--color-primary-9);
764
- }
765
-
766
- .menu-module_menu_item__icon_7pJHya > svg, .menu-module_menu_item__indicator_7pJHya > svg {
767
- width: 16px;
768
- height: 16px;
769
- }
770
-
771
- .menu-module_menu_item__label_7pJHya {
772
- text-overflow: ellipsis;
773
- white-space: nowrap;
774
- flex: auto;
775
- min-width: 0;
776
- overflow: hidden;
777
- }
778
-
779
- .menu-module_menu_group_7pJHya, .menu-module_menu_radio_group_7pJHya, .menu-module_menu_viewport_7pJHya {
780
- flex-direction: column;
781
- display: flex;
782
- }
783
-
784
- .menu-module_menu_group_label_7pJHya {
785
- color: var(--color-text-secondary);
786
- padding: 6px 8px 4px;
787
- font-size: 12px;
788
- font-weight: 600;
789
- line-height: 1.5;
790
- }
791
-
792
- .menu-module_menu_separator_7pJHya {
793
- background-color: var(--color-border);
794
- flex-shrink: 0;
795
- height: 1px;
796
- margin: 4px;
797
- }
798
- }
799
- @layer components {
800
- .otp-field-module_otp_field_6ylpka {
801
- flex-wrap: wrap;
802
- justify-content: center;
803
- gap: 8px;
804
- width: fit-content;
805
- display: flex;
806
- }
807
-
808
- .otp-field-module_otp_field__masked_6ylpka > input {
809
- font-family: var(--font-code);
810
- }
811
- }
812
- @layer components {
813
- .otp-field-input-module_otp_field_input_7VaNVa {
814
- background-color: var(--color-gray-3);
815
- box-shadow: 0 0 0 1px var(--color-border) inset;
816
- color: var(--color-text-primary);
817
- font-family: var(--font-body);
818
- outline-color: var(--color-outline);
819
- outline-offset: -2px;
820
- text-align: center;
821
- border-radius: 14px;
822
- outline-width: 0;
823
- outline-style: solid;
824
- width: 40px;
825
- height: 48px;
826
- font-size: 14px;
827
- font-weight: 500;
828
- transition-property: box-shadow;
829
- transition-duration: .15s;
830
- }
831
-
832
- .otp-field-input-module_otp_field_input_7VaNVa:enabled:hover {
833
- box-shadow: 0 0 0 1px var(--color-gray-6) inset;
834
- }
835
-
836
- .otp-field-input-module_otp_field_input_7VaNVa:disabled {
837
- cursor: not-allowed;
838
- opacity: .5;
839
- }
840
-
841
- .otp-field-input-module_otp_field_input_7VaNVa:focus-visible {
842
- outline-width: 2px;
843
- }
844
- }
845
- @layer components {
846
- .row-module_row_FQp50q {
847
- flex-direction: row;
848
- display: flex;
849
- }
850
- }
851
- @layer components {
852
- .spacer-module_spacer_liXYKW {
853
- flex-shrink: 0;
854
- }
855
- }
856
- @layer components {
857
- .switch-module_switch_K0d9Sa {
858
- background-color: var(--color-gray-6);
859
- cursor: pointer;
860
- outline-color: var(--color-primary-9);
861
- outline-offset: 2px;
862
- border-radius: 9999px;
863
- outline-width: 0;
864
- outline-style: solid;
865
- padding: 2px;
866
- transition-property: background-color;
867
- transition-duration: .15s;
868
- display: flex;
869
- overflow: hidden;
870
- }
871
-
872
- .switch-module_switch_K0d9Sa:focus-visible {
873
- outline-width: 2px;
874
- }
875
-
876
- .switch-module_switch_K0d9Sa[data-checked] {
877
- background-color: var(--color-primary-9);
878
- }
879
-
880
- .switch-module_switch_K0d9Sa[data-disabled] {
881
- cursor: not-allowed;
882
- opacity: .5;
883
- }
884
-
885
- .switch-module_switch__thumb_K0d9Sa {
886
- aspect-ratio: 1;
887
- background-color: #fff;
888
- border-radius: 9999px;
889
- height: 100%;
890
- transition-property: transform;
891
- transition-duration: .15s;
892
- }
893
-
894
- .switch-module_switch__thumb_K0d9Sa[data-checked] {
895
- transform: translateX(var(--translateX));
896
- }
897
-
898
- .switch-module_switch__size_18_K0d9Sa {
899
- --translateX: 12px;
900
- width: 30px;
901
- height: 18px;
902
- }
903
-
904
- .switch-module_switch__size_24_K0d9Sa {
905
- --translateX: 16px;
906
- width: 40px;
907
- height: 24px;
908
- }
909
- }
910
- @layer components {
911
- .tabs-pill-indicator-module_tabs_pill_indicator_PiFilW {
912
- background-color: var(--color-gray-12);
913
- height: var(--active-tab-height);
914
- left: var(--active-tab-left);
915
- top: var(--active-tab-top);
916
- width: var(--active-tab-width);
917
- z-index: -1;
918
- border-radius: 12px;
919
- transition-property: left, width;
920
- transition-duration: .15s;
921
- position: absolute;
922
- }
923
- }
924
- @layer components {
925
- .tabs-pill-list-module_tabs_pill_list_3ahKPW {
926
- isolation: isolate;
927
- column-gap: 8px;
928
- display: flex;
929
- position: relative;
930
- overflow-x: auto;
931
- }
932
- }
933
- @layer components {
934
- .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW {
935
- border-radius: var(--border-radius);
936
- color: #000;
937
- cursor: pointer;
938
- outline-color: var(--color-primary-9);
939
- outline-offset: -4px;
940
- white-space: nowrap;
941
- outline-width: 0;
942
- outline-style: solid;
943
- flex-shrink: 0;
944
- justify-content: center;
945
- align-items: center;
946
- column-gap: 8px;
947
- height: 40px;
948
- padding: 0 14px;
949
- font-size: 14px;
950
- font-weight: 500;
951
- transition-property: background-color, color;
952
- transition-duration: .15s;
953
- display: flex;
954
- }
955
-
956
- .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW:focus-visible {
957
- outline-width: 2px;
958
- }
959
-
960
- .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW:hover {
961
- background-color: var(--color-gray-4);
962
- }
963
-
964
- .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW[data-active] {
965
- color: #fff;
966
- background-color: #0000;
967
- }
968
-
969
- .dark .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW {
970
- color: #fff;
971
- }
972
-
973
- .dark .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW[data-active] {
974
- color: #000;
975
- }
976
-
977
- .tabs-pill-tab-module_tabs_pill_tab_nxQ-sW > svg {
978
- --size-icon: 16px;
979
- height: var(--size-icon);
980
- width: var(--size-icon);
981
- }
982
-
983
- .tabs-pill-tab-module_tabs_pill_tab_wrapper_nxQ-sW {
984
- --border-radius: 12px;
985
- border-radius: var(--border-radius);
986
- flex-shrink: 0;
987
- display: flex;
988
- position: relative;
989
- overflow: hidden;
990
- }
991
-
992
- .tabs-pill-tab-module_tabs_pill_tab_background_nxQ-sW {
993
- background-color: var(--color-gray-3);
994
- z-index: -2;
995
- position: absolute;
996
- inset: 0;
997
- }
998
- }
999
- @layer components {
1000
- .tabs-segmented-indicator-module_tabs_segmented_indicator_3DY8Ta {
1001
- background-color: var(--color-gray-1);
1002
- height: var(--active-tab-height);
1003
- left: var(--active-tab-left);
1004
- top: var(--active-tab-top);
1005
- width: var(--active-tab-width);
1006
- z-index: -1;
1007
- border-radius: 10px;
1008
- transition-property: left, width;
1009
- transition-duration: .15s;
1010
- position: absolute;
1011
- }
1012
- }
1013
- @layer components {
1014
- .tabs-segmented-list-module_tabs_segmented_list_wG8CPq {
1015
- background-color: var(--color-gray-3);
1016
- isolation: isolate;
1017
- border-radius: 12px;
1018
- width: fit-content;
1019
- height: 40px;
1020
- padding: 2px;
1021
- display: flex;
1022
- position: relative;
1023
- overflow-x: auto;
1024
- }
1025
- }
1026
- @layer components {
1027
- .tabs-segmented-tab-module_tabs_segmented_tab_du-IJG {
1028
- color: var(--color-gray-11);
1029
- cursor: pointer;
1030
- outline-color: var(--color-primary-9);
1031
- outline-offset: -4px;
1032
- white-space: nowrap;
1033
- border-radius: 10px;
1034
- outline-width: 0;
1035
- outline-style: solid;
1036
- flex-shrink: 0;
1037
- justify-content: center;
1038
- align-items: center;
1039
- column-gap: 8px;
1040
- height: 100%;
1041
- padding: 0 14px;
1042
- font-size: 14px;
1043
- font-weight: 500;
1044
- transition-property: color;
1045
- transition-duration: .15s;
1046
- display: flex;
1047
- }
1048
-
1049
- .tabs-segmented-tab-module_tabs_segmented_tab_du-IJG:focus-visible {
1050
- outline-width: 2px;
1051
- }
1052
-
1053
- .tabs-segmented-tab-module_tabs_segmented_tab_du-IJG:hover, .tabs-segmented-tab-module_tabs_segmented_tab_du-IJG[data-active] {
1054
- color: var(--color-gray-12);
1055
- }
1056
-
1057
- .tabs-segmented-tab-module_tabs_segmented_tab_du-IJG > svg {
1058
- --size-icon: 16px;
1059
- height: var(--size-icon);
1060
- width: var(--size-icon);
1061
- }
1062
- }
1063
- @layer components {
1064
- .tabs-underline-indicator-module_tabs_underline_indicator_Gl55Ba {
1065
- background-color: var(--color-primary-9);
1066
- height: 2px;
1067
- bottom: 0;
1068
- left: var(--active-tab-left);
1069
- width: var(--active-tab-width);
1070
- transition-property: left, width;
1071
- transition-duration: .15s;
1072
- position: absolute;
1073
- }
1074
- }
1075
- @layer components {
1076
- .tabs-underline-list-module_tabs_underline_list_3MpMpG {
1077
- border-bottom-color: var(--color-gray-4);
1078
- border-bottom-style: solid;
1079
- border-bottom-width: 1px;
1080
- display: flex;
1081
- position: relative;
1082
- overflow-x: auto;
1083
- }
1084
- }
1085
- @layer components {
1086
- .tabs-underline-tab-module_tabs_underline_tab_lcqfQW {
1087
- color: var(--color-gray-11);
1088
- cursor: pointer;
1089
- outline-color: var(--color-primary-9);
1090
- outline-offset: -2px;
1091
- white-space: nowrap;
1092
- border-radius: 8px;
1093
- outline-width: 0;
1094
- outline-style: solid;
1095
- flex-shrink: 0;
1096
- align-items: center;
1097
- column-gap: 8px;
1098
- margin-bottom: 6px;
1099
- padding: 6px 12px;
1100
- font-size: 14px;
1101
- font-weight: 500;
1102
- transition-property: color;
1103
- transition-duration: .15s;
1104
- display: flex;
1105
- }
1106
-
1107
- .tabs-underline-tab-module_tabs_underline_tab_lcqfQW:focus-visible {
1108
- outline-width: 2px;
1109
- }
1110
-
1111
- .tabs-underline-tab-module_tabs_underline_tab_lcqfQW:hover, .tabs-underline-tab-module_tabs_underline_tab_lcqfQW[data-active] {
1112
- color: var(--color-gray-12);
1113
- }
1114
-
1115
- .tabs-underline-tab-module_tabs_underline_tab_lcqfQW > svg {
1116
- --size-icon: 16px;
1117
- height: var(--size-icon);
1118
- width: var(--size-icon);
1119
- }
1120
- }
1121
- @layer components {
1122
- .tabs-module_tabs__1Jl1W {
1123
- flex-direction: column;
1124
- display: flex;
1125
- }
1126
- }
1127
- @layer components {
1128
- .tabs-panel-module_tabs_panel_AXj2FW {
1129
- outline-color: var(--color-primary-9);
1130
- outline-offset: -2px;
1131
- outline-width: 0;
1132
- outline-style: solid;
1133
- flex-direction: column;
1134
- display: flex;
1135
- }
1136
-
1137
- .tabs-panel-module_tabs_panel_AXj2FW:focus-visible {
1138
- outline-width: 2px;
1139
- }
1140
- }
1141
- @layer components {
1142
- .textarea-module_textarea_jT_oOq {
1143
- resize: vertical;
1144
- height: auto;
1145
- min-height: 66px;
1146
- max-height: none;
1147
- padding: 12px;
1148
- }
1149
- }
1150
- @layer components {
1151
- .tooltip-popup-module_tooltip_popup_SLo08q {
1152
- background-color: var(--color-gray-dark-1);
1153
- color: var(--color-gray-dark-12);
1154
- transform-origin: var(--transform-origin);
1155
- border-radius: 8px;
1156
- padding: 4px 8px;
1157
- font-size: 13px;
1158
- font-weight: 500;
1159
- transition-property: opacity, scale;
1160
- transition-duration: .15s;
1161
- box-shadow: 0 1px 3px #0000001a, 0 1px 2px -1px #0000001a;
1162
- }
1163
-
1164
- .tooltip-popup-module_tooltip_popup_SLo08q[data-ending-style], .tooltip-popup-module_tooltip_popup_SLo08q[data-starting-style] {
1165
- opacity: 0;
1166
- scale: .975;
1167
- }
1168
-
1169
- .tooltip-popup-module_tooltip_popup_SLo08q[data-instant] {
1170
- transition: none;
1171
- }
1172
-
1173
- .tooltip-popup-module_tooltip_popup_portal_SLo08q {
1174
- z-index: 50;
1175
- }
1176
-
1177
- .dark .tooltip-popup-module_tooltip_popup_SLo08q {
1178
- background-color: var(--color-gray-light-1);
1179
- color: var(--color-gray-light-12);
1180
- }
1181
- }