@txnlab/use-wallet-ui-react 0.3.1 → 0.4.1

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.
package/dist/style.css CHANGED
@@ -13,18 +13,10 @@
13
13
  --color-red-900: oklch(39.6% 0.141 25.723);
14
14
  --color-green-500: oklch(72.3% 0.219 149.579);
15
15
  --color-blue-500: oklch(62.3% 0.214 259.815);
16
- --color-gray-50: oklch(98.5% 0.002 247.839);
17
- --color-gray-100: oklch(96.7% 0.003 264.542);
18
16
  --color-gray-200: oklch(92.8% 0.006 264.531);
19
- --color-gray-300: oklch(87.2% 0.01 258.338);
20
17
  --color-gray-400: oklch(70.7% 0.022 261.325);
21
18
  --color-gray-500: oklch(55.1% 0.027 264.364);
22
- --color-gray-600: oklch(44.6% 0.03 256.802);
23
- --color-gray-700: oklch(37.3% 0.034 259.733);
24
- --color-gray-800: oklch(27.8% 0.033 256.848);
25
- --color-gray-900: oklch(21% 0.034 264.665);
26
19
  --color-black: #000;
27
- --color-white: #fff;
28
20
  --spacing: 0.25rem;
29
21
  --container-sm: 24rem;
30
22
  --text-sm: 0.875rem;
@@ -49,7 +41,7 @@
49
41
  --default-font-family: var(--font-sans);
50
42
  --default-mono-font-family: var(--font-mono);
51
43
  }
52
- [data-wallet-ui] {
44
+ [data-wallet-ui-scope] {
53
45
  *, ::after, ::before, ::backdrop, ::file-selector-button {
54
46
  box-sizing: border-box;
55
47
  margin: 0;
@@ -194,39 +186,100 @@
194
186
  display: none !important;
195
187
  }
196
188
  }
197
- [data-wallet-ui-reset] {
198
- *, ::after, ::before, ::backdrop, ::file-selector-button {
199
- all: revert-layer;
200
- }
201
- }
202
- [data-wallet-ui] .absolute {
189
+ [data-wallet-ui] {
190
+ --wui-color-primary: #2d2df1;
191
+ --wui-color-primary-hover: #2929d9;
192
+ --wui-color-primary-text: #ffffff;
193
+ --wui-color-bg: #ffffff;
194
+ --wui-color-bg-secondary: #f9fafb;
195
+ --wui-color-bg-tertiary: #f3f4f6;
196
+ --wui-color-bg-hover: #e9e9fd;
197
+ --wui-color-text: #1f2937;
198
+ --wui-color-text-secondary: #6b7280;
199
+ --wui-color-text-tertiary: #9ca3af;
200
+ --wui-color-border: #e5e7eb;
201
+ --wui-color-link: rgba(45, 45, 241, 0.8);
202
+ --wui-color-link-hover: #2d2df1;
203
+ --wui-color-overlay: rgba(0, 0, 0, 0.3);
204
+ }
205
+ [data-wallet-ui][data-theme='dark'] {
206
+ --wui-color-primary: #bfbff9;
207
+ --wui-color-primary-hover: #d4d4fa;
208
+ --wui-color-primary-text: #001324;
209
+ --wui-color-bg: #001324;
210
+ --wui-color-bg-secondary: #101b29;
211
+ --wui-color-bg-tertiary: #192a39;
212
+ --wui-color-bg-hover: #192a39;
213
+ --wui-color-text: #e9e9fd;
214
+ --wui-color-text-secondary: #99a1a7;
215
+ --wui-color-text-tertiary: #6b7280;
216
+ --wui-color-border: #192a39;
217
+ --wui-color-link: #6c6cf1;
218
+ --wui-color-link-hover: #8080f3;
219
+ --wui-color-overlay: rgba(0, 0, 0, 0.5);
220
+ }
221
+ .dark [data-wallet-ui]:not([data-theme='light']) {
222
+ --wui-color-primary: #bfbff9;
223
+ --wui-color-primary-hover: #d4d4fa;
224
+ --wui-color-primary-text: #001324;
225
+ --wui-color-bg: #001324;
226
+ --wui-color-bg-secondary: #101b29;
227
+ --wui-color-bg-tertiary: #192a39;
228
+ --wui-color-bg-hover: #192a39;
229
+ --wui-color-text: #e9e9fd;
230
+ --wui-color-text-secondary: #99a1a7;
231
+ --wui-color-text-tertiary: #6b7280;
232
+ --wui-color-border: #192a39;
233
+ --wui-color-link: #6c6cf1;
234
+ --wui-color-link-hover: #8080f3;
235
+ --wui-color-overlay: rgba(0, 0, 0, 0.5);
236
+ }
237
+ @media (prefers-color-scheme: dark) {
238
+ [data-wallet-ui]:not([data-theme='light']):not([data-theme='dark']) {
239
+ --wui-color-primary: #bfbff9;
240
+ --wui-color-primary-hover: #d4d4fa;
241
+ --wui-color-primary-text: #001324;
242
+ --wui-color-bg: #001324;
243
+ --wui-color-bg-secondary: #101b29;
244
+ --wui-color-bg-tertiary: #192a39;
245
+ --wui-color-bg-hover: #192a39;
246
+ --wui-color-text: #e9e9fd;
247
+ --wui-color-text-secondary: #99a1a7;
248
+ --wui-color-text-tertiary: #6b7280;
249
+ --wui-color-border: #192a39;
250
+ --wui-color-link: #6c6cf1;
251
+ --wui-color-link-hover: #8080f3;
252
+ --wui-color-overlay: rgba(0, 0, 0, 0.5);
253
+ }
254
+ }
255
+ [data-wallet-ui-scope] .absolute {
203
256
  position: absolute;
204
257
  }
205
- [data-wallet-ui] .relative {
258
+ [data-wallet-ui-scope] .relative {
206
259
  position: relative;
207
260
  }
208
- [data-wallet-ui] .inset-y-0 {
261
+ [data-wallet-ui-scope] .inset-y-0 {
209
262
  inset-block: calc(var(--spacing) * 0);
210
263
  }
211
- [data-wallet-ui] .right-0 {
264
+ [data-wallet-ui-scope] .right-0 {
212
265
  right: calc(var(--spacing) * 0);
213
266
  }
214
- [data-wallet-ui] .right-4 {
267
+ [data-wallet-ui-scope] .right-4 {
215
268
  right: calc(var(--spacing) * 4);
216
269
  }
217
- [data-wallet-ui] .z-10 {
270
+ [data-wallet-ui-scope] .z-10 {
218
271
  z-index: 10;
219
272
  }
220
- [data-wallet-ui] .z-50 {
273
+ [data-wallet-ui-scope] .z-50 {
221
274
  z-index: 50;
222
275
  }
223
- [data-wallet-ui] .col-start-1 {
276
+ [data-wallet-ui-scope] .col-start-1 {
224
277
  grid-column-start: 1;
225
278
  }
226
- [data-wallet-ui] .row-start-1 {
279
+ [data-wallet-ui-scope] .row-start-1 {
227
280
  grid-row-start: 1;
228
281
  }
229
- [data-wallet-ui] .container {
282
+ [data-wallet-ui-scope] .container {
230
283
  width: 100%;
231
284
  @media (width >= 40rem) {
232
285
  max-width: 40rem;
@@ -244,575 +297,545 @@
244
297
  max-width: 96rem;
245
298
  }
246
299
  }
247
- [data-wallet-ui] .mt-0\.5 {
300
+ [data-wallet-ui-scope] .mt-0\.5 {
248
301
  margin-top: calc(var(--spacing) * 0.5);
249
302
  }
250
- [data-wallet-ui] .mt-1 {
303
+ [data-wallet-ui-scope] .mt-1 {
251
304
  margin-top: calc(var(--spacing) * 1);
252
305
  }
253
- [data-wallet-ui] .mt-2 {
306
+ [data-wallet-ui-scope] .mt-2 {
254
307
  margin-top: calc(var(--spacing) * 2);
255
308
  }
256
- [data-wallet-ui] .mr-1 {
309
+ [data-wallet-ui-scope] .mr-1 {
257
310
  margin-right: calc(var(--spacing) * 1);
258
311
  }
259
- [data-wallet-ui] .mr-1\.5 {
312
+ [data-wallet-ui-scope] .mr-1\.5 {
260
313
  margin-right: calc(var(--spacing) * 1.5);
261
314
  }
262
- [data-wallet-ui] .mb-1 {
315
+ [data-wallet-ui-scope] .mb-1 {
263
316
  margin-bottom: calc(var(--spacing) * 1);
264
317
  }
265
- [data-wallet-ui] .mb-2 {
318
+ [data-wallet-ui-scope] .mb-2 {
266
319
  margin-bottom: calc(var(--spacing) * 2);
267
320
  }
268
- [data-wallet-ui] .mb-3 {
321
+ [data-wallet-ui-scope] .mb-3 {
269
322
  margin-bottom: calc(var(--spacing) * 3);
270
323
  }
271
- [data-wallet-ui] .mb-4 {
324
+ [data-wallet-ui-scope] .mb-4 {
272
325
  margin-bottom: calc(var(--spacing) * 4);
273
326
  }
274
- [data-wallet-ui] .ml-0\.5 {
327
+ [data-wallet-ui-scope] .ml-0\.5 {
275
328
  margin-left: calc(var(--spacing) * 0.5);
276
329
  }
277
- [data-wallet-ui] .ml-1\.5 {
330
+ [data-wallet-ui-scope] .ml-1\.5 {
278
331
  margin-left: calc(var(--spacing) * 1.5);
279
332
  }
280
- [data-wallet-ui] .block {
333
+ [data-wallet-ui-scope] .block {
281
334
  display: block;
282
335
  }
283
- [data-wallet-ui] .flex {
336
+ [data-wallet-ui-scope] .flex {
284
337
  display: flex;
285
338
  }
286
- [data-wallet-ui] .grid {
339
+ [data-wallet-ui-scope] .grid {
287
340
  display: grid;
288
341
  }
289
- [data-wallet-ui] .hidden {
342
+ [data-wallet-ui-scope] .hidden {
290
343
  display: none;
291
344
  }
292
- [data-wallet-ui] .inline-block {
345
+ [data-wallet-ui-scope] .inline-block {
293
346
  display: inline-block;
294
347
  }
295
- [data-wallet-ui] .h-3 {
348
+ [data-wallet-ui-scope] .h-3 {
296
349
  height: calc(var(--spacing) * 3);
297
350
  }
298
- [data-wallet-ui] .h-4 {
351
+ [data-wallet-ui-scope] .h-4 {
299
352
  height: calc(var(--spacing) * 4);
300
353
  }
301
- [data-wallet-ui] .h-5 {
354
+ [data-wallet-ui-scope] .h-5 {
302
355
  height: calc(var(--spacing) * 5);
303
356
  }
304
- [data-wallet-ui] .h-6 {
357
+ [data-wallet-ui-scope] .h-6 {
305
358
  height: calc(var(--spacing) * 6);
306
359
  }
307
- [data-wallet-ui] .h-8 {
360
+ [data-wallet-ui-scope] .h-8 {
308
361
  height: calc(var(--spacing) * 8);
309
362
  }
310
- [data-wallet-ui] .h-12 {
363
+ [data-wallet-ui-scope] .h-12 {
311
364
  height: calc(var(--spacing) * 12);
312
365
  }
313
- [data-wallet-ui] .max-h-60 {
366
+ [data-wallet-ui-scope] .max-h-60 {
314
367
  max-height: calc(var(--spacing) * 60);
315
368
  }
316
- [data-wallet-ui] .max-h-full {
369
+ [data-wallet-ui-scope] .max-h-full {
317
370
  max-height: 100%;
318
371
  }
319
- [data-wallet-ui] .w-3 {
372
+ [data-wallet-ui-scope] .w-3 {
320
373
  width: calc(var(--spacing) * 3);
321
374
  }
322
- [data-wallet-ui] .w-4 {
375
+ [data-wallet-ui-scope] .w-4 {
323
376
  width: calc(var(--spacing) * 4);
324
377
  }
325
- [data-wallet-ui] .w-5 {
378
+ [data-wallet-ui-scope] .w-5 {
326
379
  width: calc(var(--spacing) * 5);
327
380
  }
328
- [data-wallet-ui] .w-6 {
381
+ [data-wallet-ui-scope] .w-6 {
329
382
  width: calc(var(--spacing) * 6);
330
383
  }
331
- [data-wallet-ui] .w-8 {
384
+ [data-wallet-ui-scope] .w-8 {
332
385
  width: calc(var(--spacing) * 8);
333
386
  }
334
- [data-wallet-ui] .w-12 {
387
+ [data-wallet-ui-scope] .w-12 {
335
388
  width: calc(var(--spacing) * 12);
336
389
  }
337
- [data-wallet-ui] .w-80 {
390
+ [data-wallet-ui-scope] .w-80 {
338
391
  width: calc(var(--spacing) * 80);
339
392
  }
340
- [data-wallet-ui] .w-full {
393
+ [data-wallet-ui-scope] .w-full {
341
394
  width: 100%;
342
395
  }
343
- [data-wallet-ui] .max-w-\[160px\] {
396
+ [data-wallet-ui-scope] .max-w-\[160px\] {
344
397
  max-width: 160px;
345
398
  }
346
- [data-wallet-ui] .max-w-\[220px\] {
399
+ [data-wallet-ui-scope] .max-w-\[220px\] {
347
400
  max-width: 220px;
348
401
  }
349
- [data-wallet-ui] .max-w-full {
402
+ [data-wallet-ui-scope] .max-w-full {
350
403
  max-width: 100%;
351
404
  }
352
- [data-wallet-ui] .max-w-sm {
405
+ [data-wallet-ui-scope] .max-w-sm {
353
406
  max-width: var(--container-sm);
354
407
  }
355
- [data-wallet-ui] .flex-1 {
408
+ [data-wallet-ui-scope] .flex-1 {
356
409
  flex: 1;
357
410
  }
358
- [data-wallet-ui] .flex-shrink-0 {
411
+ [data-wallet-ui-scope] .flex-shrink-0 {
359
412
  flex-shrink: 0;
360
413
  }
361
- [data-wallet-ui] .transform {
414
+ [data-wallet-ui-scope] .transform {
362
415
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
363
416
  }
364
- [data-wallet-ui] .cursor-default {
417
+ [data-wallet-ui-scope] .cursor-default {
365
418
  cursor: default;
366
419
  }
367
- [data-wallet-ui] .cursor-pointer {
420
+ [data-wallet-ui-scope] .cursor-pointer {
368
421
  cursor: pointer;
369
422
  }
370
- [data-wallet-ui] .grid-cols-1 {
423
+ [data-wallet-ui-scope] .grid-cols-1 {
371
424
  grid-template-columns: repeat(1, minmax(0, 1fr));
372
425
  }
373
- [data-wallet-ui] .place-items-center {
426
+ [data-wallet-ui-scope] .place-items-center {
374
427
  place-items: center;
375
428
  }
376
- [data-wallet-ui] .items-center {
429
+ [data-wallet-ui-scope] .items-center {
377
430
  align-items: center;
378
431
  }
379
- [data-wallet-ui] .justify-between {
432
+ [data-wallet-ui-scope] .justify-between {
380
433
  justify-content: space-between;
381
434
  }
382
- [data-wallet-ui] .justify-center {
435
+ [data-wallet-ui-scope] .justify-center {
383
436
  justify-content: center;
384
437
  }
385
- [data-wallet-ui] .gap-1 {
438
+ [data-wallet-ui-scope] .gap-1 {
386
439
  gap: calc(var(--spacing) * 1);
387
440
  }
388
- [data-wallet-ui] .gap-2 {
441
+ [data-wallet-ui-scope] .gap-2 {
389
442
  gap: calc(var(--spacing) * 2);
390
443
  }
391
- [data-wallet-ui] .gap-3 {
444
+ [data-wallet-ui-scope] .gap-3 {
392
445
  gap: calc(var(--spacing) * 3);
393
446
  }
394
- [data-wallet-ui] .space-y-1\.5 {
447
+ [data-wallet-ui-scope] .space-y-1\.5 {
395
448
  :where(& > :not(:last-child)) {
396
449
  --tw-space-y-reverse: 0;
397
450
  margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
398
451
  margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
399
452
  }
400
453
  }
401
- [data-wallet-ui] .self-center {
454
+ [data-wallet-ui-scope] .self-center {
402
455
  align-self: center;
403
456
  }
404
- [data-wallet-ui] .justify-self-end {
457
+ [data-wallet-ui-scope] .justify-self-end {
405
458
  justify-self: flex-end;
406
459
  }
407
- [data-wallet-ui] .truncate {
460
+ [data-wallet-ui-scope] .truncate {
408
461
  overflow: hidden;
409
462
  text-overflow: ellipsis;
410
463
  white-space: nowrap;
411
464
  }
412
- [data-wallet-ui] .overflow-auto {
465
+ [data-wallet-ui-scope] .overflow-auto {
413
466
  overflow: auto;
414
467
  }
415
- [data-wallet-ui] .overflow-hidden {
468
+ [data-wallet-ui-scope] .overflow-hidden {
416
469
  overflow: hidden;
417
470
  }
418
- [data-wallet-ui] .rounded {
471
+ [data-wallet-ui-scope] .rounded {
419
472
  border-radius: 0.25rem;
420
473
  }
421
- [data-wallet-ui] .rounded-3xl {
474
+ [data-wallet-ui-scope] .rounded-3xl {
422
475
  border-radius: var(--radius-3xl);
423
476
  }
424
- [data-wallet-ui] .rounded-full {
477
+ [data-wallet-ui-scope] .rounded-full {
425
478
  border-radius: calc(infinity * 1px);
426
479
  }
427
- [data-wallet-ui] .rounded-lg {
480
+ [data-wallet-ui-scope] .rounded-lg {
428
481
  border-radius: var(--radius-lg);
429
482
  }
430
- [data-wallet-ui] .rounded-md {
483
+ [data-wallet-ui-scope] .rounded-md {
431
484
  border-radius: var(--radius-md);
432
485
  }
433
- [data-wallet-ui] .rounded-xl {
486
+ [data-wallet-ui-scope] .rounded-xl {
434
487
  border-radius: var(--radius-xl);
435
488
  }
436
- [data-wallet-ui] .border {
489
+ [data-wallet-ui-scope] .border {
437
490
  border-style: var(--tw-border-style);
438
491
  border-width: 1px;
439
492
  }
440
- [data-wallet-ui] .border-2 {
493
+ [data-wallet-ui-scope] .border-2 {
441
494
  border-style: var(--tw-border-style);
442
495
  border-width: 2px;
443
496
  }
444
- [data-wallet-ui] .border-t {
497
+ [data-wallet-ui-scope] .border-t {
445
498
  border-top-style: var(--tw-border-style);
446
499
  border-top-width: 1px;
447
500
  }
448
- [data-wallet-ui] .border-gray-200 {
449
- border-color: var(--color-gray-200);
450
- }
451
- [data-wallet-ui] .border-gray-300 {
452
- border-color: var(--color-gray-300);
501
+ [data-wallet-ui-scope] .border-\[var\(--wui-color-border\)\] {
502
+ border-color: var(--wui-color-border);
453
503
  }
454
- [data-wallet-ui] .border-green-500 {
504
+ [data-wallet-ui-scope] .border-green-500 {
455
505
  border-color: var(--color-green-500);
456
506
  }
457
- [data-wallet-ui] .bg-\[\#2D2DF1\] {
458
- background-color: #2D2DF1;
507
+ [data-wallet-ui-scope] .bg-\[var\(--wui-color-bg\)\] {
508
+ background-color: var(--wui-color-bg);
459
509
  }
460
- [data-wallet-ui] .bg-black\/30 {
461
- background-color: color-mix(in srgb, #000 30%, transparent);
462
- @supports (color: color-mix(in lab, red, red)) {
463
- background-color: color-mix(in oklab, var(--color-black) 30%, transparent);
464
- }
510
+ [data-wallet-ui-scope] .bg-\[var\(--wui-color-bg-secondary\)\] {
511
+ background-color: var(--wui-color-bg-secondary);
465
512
  }
466
- [data-wallet-ui] .bg-blue-500 {
467
- background-color: var(--color-blue-500);
513
+ [data-wallet-ui-scope] .bg-\[var\(--wui-color-bg-tertiary\)\] {
514
+ background-color: var(--wui-color-bg-tertiary);
468
515
  }
469
- [data-wallet-ui] .bg-gray-50 {
470
- background-color: var(--color-gray-50);
516
+ [data-wallet-ui-scope] .bg-\[var\(--wui-color-overlay\)\] {
517
+ background-color: var(--wui-color-overlay);
471
518
  }
472
- [data-wallet-ui] .bg-gray-100 {
473
- background-color: var(--color-gray-100);
519
+ [data-wallet-ui-scope] .bg-\[var\(--wui-color-primary\)\] {
520
+ background-color: var(--wui-color-primary);
521
+ }
522
+ [data-wallet-ui-scope] .bg-blue-500 {
523
+ background-color: var(--color-blue-500);
474
524
  }
475
- [data-wallet-ui] .bg-gray-200 {
525
+ [data-wallet-ui-scope] .bg-gray-200 {
476
526
  background-color: var(--color-gray-200);
477
527
  }
478
- [data-wallet-ui] .bg-red-100 {
528
+ [data-wallet-ui-scope] .bg-red-100 {
479
529
  background-color: var(--color-red-100);
480
530
  }
481
- [data-wallet-ui] .bg-white {
482
- background-color: var(--color-white);
483
- }
484
- [data-wallet-ui] .object-contain {
531
+ [data-wallet-ui-scope] .object-contain {
485
532
  object-fit: contain;
486
533
  }
487
- [data-wallet-ui] .p-2 {
534
+ [data-wallet-ui-scope] .p-2 {
488
535
  padding: calc(var(--spacing) * 2);
489
536
  }
490
- [data-wallet-ui] .p-3 {
537
+ [data-wallet-ui-scope] .p-3 {
491
538
  padding: calc(var(--spacing) * 3);
492
539
  }
493
- [data-wallet-ui] .p-4 {
540
+ [data-wallet-ui-scope] .p-4 {
494
541
  padding: calc(var(--spacing) * 4);
495
542
  }
496
- [data-wallet-ui] .px-1 {
543
+ [data-wallet-ui-scope] .px-1 {
497
544
  padding-inline: calc(var(--spacing) * 1);
498
545
  }
499
- [data-wallet-ui] .px-1\.5 {
546
+ [data-wallet-ui-scope] .px-1\.5 {
500
547
  padding-inline: calc(var(--spacing) * 1.5);
501
548
  }
502
- [data-wallet-ui] .px-3 {
549
+ [data-wallet-ui-scope] .px-3 {
503
550
  padding-inline: calc(var(--spacing) * 3);
504
551
  }
505
- [data-wallet-ui] .px-4 {
552
+ [data-wallet-ui-scope] .px-4 {
506
553
  padding-inline: calc(var(--spacing) * 4);
507
554
  }
508
- [data-wallet-ui] .px-6 {
555
+ [data-wallet-ui-scope] .px-6 {
509
556
  padding-inline: calc(var(--spacing) * 6);
510
557
  }
511
- [data-wallet-ui] .py-0\.5 {
558
+ [data-wallet-ui-scope] .py-0\.5 {
512
559
  padding-block: calc(var(--spacing) * 0.5);
513
560
  }
514
- [data-wallet-ui] .py-1 {
561
+ [data-wallet-ui-scope] .py-1 {
515
562
  padding-block: calc(var(--spacing) * 1);
516
563
  }
517
- [data-wallet-ui] .py-1\.5 {
564
+ [data-wallet-ui-scope] .py-1\.5 {
518
565
  padding-block: calc(var(--spacing) * 1.5);
519
566
  }
520
- [data-wallet-ui] .py-2 {
567
+ [data-wallet-ui-scope] .py-2 {
521
568
  padding-block: calc(var(--spacing) * 2);
522
569
  }
523
- [data-wallet-ui] .py-2\.5 {
570
+ [data-wallet-ui-scope] .py-2\.5 {
524
571
  padding-block: calc(var(--spacing) * 2.5);
525
572
  }
526
- [data-wallet-ui] .py-5 {
573
+ [data-wallet-ui-scope] .py-5 {
527
574
  padding-block: calc(var(--spacing) * 5);
528
575
  }
529
- [data-wallet-ui] .pt-5 {
576
+ [data-wallet-ui-scope] .pt-5 {
530
577
  padding-top: calc(var(--spacing) * 5);
531
578
  }
532
- [data-wallet-ui] .pr-2 {
579
+ [data-wallet-ui-scope] .pr-2 {
533
580
  padding-right: calc(var(--spacing) * 2);
534
581
  }
535
- [data-wallet-ui] .pr-3 {
582
+ [data-wallet-ui-scope] .pr-3 {
536
583
  padding-right: calc(var(--spacing) * 3);
537
584
  }
538
- [data-wallet-ui] .pr-8 {
585
+ [data-wallet-ui-scope] .pr-8 {
539
586
  padding-right: calc(var(--spacing) * 8);
540
587
  }
541
- [data-wallet-ui] .pr-9 {
588
+ [data-wallet-ui-scope] .pr-9 {
542
589
  padding-right: calc(var(--spacing) * 9);
543
590
  }
544
- [data-wallet-ui] .pb-3 {
591
+ [data-wallet-ui-scope] .pb-3 {
545
592
  padding-bottom: calc(var(--spacing) * 3);
546
593
  }
547
- [data-wallet-ui] .pb-4 {
594
+ [data-wallet-ui-scope] .pb-4 {
548
595
  padding-bottom: calc(var(--spacing) * 4);
549
596
  }
550
- [data-wallet-ui] .pl-2\.5 {
597
+ [data-wallet-ui-scope] .pl-2\.5 {
551
598
  padding-left: calc(var(--spacing) * 2.5);
552
599
  }
553
- [data-wallet-ui] .pl-3 {
600
+ [data-wallet-ui-scope] .pl-3 {
554
601
  padding-left: calc(var(--spacing) * 3);
555
602
  }
556
- [data-wallet-ui] .text-center {
603
+ [data-wallet-ui-scope] .text-center {
557
604
  text-align: center;
558
605
  }
559
- [data-wallet-ui] .text-left {
606
+ [data-wallet-ui-scope] .text-left {
560
607
  text-align: left;
561
608
  }
562
- [data-wallet-ui] .align-baseline {
609
+ [data-wallet-ui-scope] .align-baseline {
563
610
  vertical-align: baseline;
564
611
  }
565
- [data-wallet-ui] .text-base {
612
+ [data-wallet-ui-scope] .text-base {
566
613
  font-size: var(--text-base);
567
614
  line-height: var(--tw-leading, var(--text-base--line-height));
568
615
  }
569
- [data-wallet-ui] .text-lg {
616
+ [data-wallet-ui-scope] .text-lg {
570
617
  font-size: var(--text-lg);
571
618
  line-height: var(--tw-leading, var(--text-lg--line-height));
572
619
  }
573
- [data-wallet-ui] .text-sm {
620
+ [data-wallet-ui-scope] .text-sm {
574
621
  font-size: var(--text-sm);
575
622
  line-height: var(--tw-leading, var(--text-sm--line-height));
576
623
  }
577
- [data-wallet-ui] .text-xl {
624
+ [data-wallet-ui-scope] .text-xl {
578
625
  font-size: var(--text-xl);
579
626
  line-height: var(--tw-leading, var(--text-xl--line-height));
580
627
  }
581
- [data-wallet-ui] .font-bold {
628
+ [data-wallet-ui-scope] .font-bold {
582
629
  --tw-font-weight: var(--font-weight-bold);
583
630
  font-weight: var(--font-weight-bold);
584
631
  }
585
- [data-wallet-ui] .font-medium {
632
+ [data-wallet-ui-scope] .font-medium {
586
633
  --tw-font-weight: var(--font-weight-medium);
587
634
  font-weight: var(--font-weight-medium);
588
635
  }
589
- [data-wallet-ui] .font-normal {
636
+ [data-wallet-ui-scope] .font-normal {
590
637
  --tw-font-weight: var(--font-weight-normal);
591
638
  font-weight: var(--font-weight-normal);
592
639
  }
593
- [data-wallet-ui] .text-\[\#2D2DF1\] {
594
- color: #2D2DF1;
595
- }
596
- [data-wallet-ui] .text-\[\#2D2DF1\]\/80 {
597
- color: color-mix(in oklab, #2D2DF1 80%, transparent);
640
+ [data-wallet-ui-scope] .text-\[var\(--wui-color-link\)\] {
641
+ color: var(--wui-color-link);
598
642
  }
599
- [data-wallet-ui] .text-blue-500 {
600
- color: var(--color-blue-500);
643
+ [data-wallet-ui-scope] .text-\[var\(--wui-color-primary\)\] {
644
+ color: var(--wui-color-primary);
601
645
  }
602
- [data-wallet-ui] .text-gray-400 {
603
- color: var(--color-gray-400);
646
+ [data-wallet-ui-scope] .text-\[var\(--wui-color-primary-text\)\] {
647
+ color: var(--wui-color-primary-text);
604
648
  }
605
- [data-wallet-ui] .text-gray-500 {
606
- color: var(--color-gray-500);
649
+ [data-wallet-ui-scope] .text-\[var\(--wui-color-text\)\] {
650
+ color: var(--wui-color-text);
607
651
  }
608
- [data-wallet-ui] .text-gray-600 {
609
- color: var(--color-gray-600);
652
+ [data-wallet-ui-scope] .text-\[var\(--wui-color-text-secondary\)\] {
653
+ color: var(--wui-color-text-secondary);
610
654
  }
611
- [data-wallet-ui] .text-gray-700 {
612
- color: var(--color-gray-700);
655
+ [data-wallet-ui-scope] .text-\[var\(--wui-color-text-tertiary\)\] {
656
+ color: var(--wui-color-text-tertiary);
613
657
  }
614
- [data-wallet-ui] .text-gray-800 {
615
- color: var(--color-gray-800);
658
+ [data-wallet-ui-scope] .text-blue-500 {
659
+ color: var(--color-blue-500);
616
660
  }
617
- [data-wallet-ui] .text-gray-900 {
618
- color: var(--color-gray-900);
661
+ [data-wallet-ui-scope] .text-gray-400 {
662
+ color: var(--color-gray-400);
619
663
  }
620
- [data-wallet-ui] .text-green-500 {
664
+ [data-wallet-ui-scope] .text-green-500 {
621
665
  color: var(--color-green-500);
622
666
  }
623
- [data-wallet-ui] .text-red-700 {
667
+ [data-wallet-ui-scope] .text-red-700 {
624
668
  color: var(--color-red-700);
625
669
  }
626
- [data-wallet-ui] .text-white {
627
- color: var(--color-white);
628
- }
629
- [data-wallet-ui] .opacity-80 {
670
+ [data-wallet-ui-scope] .opacity-80 {
630
671
  opacity: 80%;
631
672
  }
632
- [data-wallet-ui] .shadow-lg {
673
+ [data-wallet-ui-scope] .shadow-lg {
633
674
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
634
675
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
635
676
  }
636
- [data-wallet-ui] .shadow-sm {
677
+ [data-wallet-ui-scope] .shadow-sm {
637
678
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
638
679
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
639
680
  }
640
- [data-wallet-ui] .shadow-xl {
681
+ [data-wallet-ui-scope] .shadow-xl {
641
682
  --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
642
683
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
643
684
  }
644
- [data-wallet-ui] .ring-1 {
685
+ [data-wallet-ui-scope] .ring-1 {
645
686
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
646
687
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
647
688
  }
648
- [data-wallet-ui] .ring-black\/5 {
689
+ [data-wallet-ui-scope] .ring-black\/5 {
649
690
  --tw-ring-color: color-mix(in srgb, #000 5%, transparent);
650
691
  @supports (color: color-mix(in lab, red, red)) {
651
692
  --tw-ring-color: color-mix(in oklab, var(--color-black) 5%, transparent);
652
693
  }
653
694
  }
654
- [data-wallet-ui] .transition {
695
+ [data-wallet-ui-scope] .transition {
655
696
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
656
697
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
657
698
  transition-duration: var(--tw-duration, var(--default-transition-duration));
658
699
  }
659
- [data-wallet-ui] .transition-all {
700
+ [data-wallet-ui-scope] .transition-all {
660
701
  transition-property: all;
661
702
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
662
703
  transition-duration: var(--tw-duration, var(--default-transition-duration));
663
704
  }
664
- [data-wallet-ui] .transition-colors {
705
+ [data-wallet-ui-scope] .transition-colors {
665
706
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
666
707
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
667
708
  transition-duration: var(--tw-duration, var(--default-transition-duration));
668
709
  }
669
- [data-wallet-ui] .transition-opacity {
710
+ [data-wallet-ui-scope] .transition-opacity {
670
711
  transition-property: opacity;
671
712
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
672
713
  transition-duration: var(--tw-duration, var(--default-transition-duration));
673
714
  }
674
- [data-wallet-ui] .duration-150 {
715
+ [data-wallet-ui-scope] .duration-150 {
675
716
  --tw-duration: 150ms;
676
717
  transition-duration: 150ms;
677
718
  }
678
- [data-wallet-ui] .ease-in-out {
719
+ [data-wallet-ui-scope] .ease-in-out {
679
720
  --tw-ease: var(--ease-in-out);
680
721
  transition-timing-function: var(--ease-in-out);
681
722
  }
682
- [data-wallet-ui] .select-none {
723
+ [data-wallet-ui-scope] .select-none {
683
724
  -webkit-user-select: none;
684
725
  user-select: none;
685
726
  }
686
- [data-wallet-ui] .group-data-\[selected\]\:font-medium {
727
+ [data-wallet-ui-scope] .group-data-\[selected\]\:font-medium {
687
728
  &:is(:where(.group)[data-selected] *) {
688
729
  --tw-font-weight: var(--font-weight-medium);
689
730
  font-weight: var(--font-weight-medium);
690
731
  }
691
732
  }
692
- [data-wallet-ui] .group-\[\&\:not\(\[data-selected\]\)\]\:hidden {
733
+ [data-wallet-ui-scope] .group-\[\&\:not\(\[data-selected\]\)\]\:hidden {
693
734
  &:is(:where(.group):not([data-selected]) *) {
694
735
  display: none;
695
736
  }
696
737
  }
697
- [data-wallet-ui] .hover\:bg-\[\#2929D9\] {
738
+ [data-wallet-ui-scope] .hover\:bg-\[var\(--wui-color-bg-hover\)\] {
698
739
  &:hover {
699
740
  @media (hover: hover) {
700
- background-color: #2929D9;
741
+ background-color: var(--wui-color-bg-hover);
701
742
  }
702
743
  }
703
744
  }
704
- [data-wallet-ui] .hover\:bg-\[\#E9E9FD\] {
745
+ [data-wallet-ui-scope] .hover\:bg-\[var\(--wui-color-primary-hover\)\] {
705
746
  &:hover {
706
747
  @media (hover: hover) {
707
- background-color: #E9E9FD;
748
+ background-color: var(--wui-color-primary-hover);
708
749
  }
709
750
  }
710
751
  }
711
- [data-wallet-ui] .hover\:bg-gray-200 {
712
- &:hover {
713
- @media (hover: hover) {
714
- background-color: var(--color-gray-200);
715
- }
716
- }
717
- }
718
- [data-wallet-ui] .hover\:bg-gray-300 {
719
- &:hover {
720
- @media (hover: hover) {
721
- background-color: var(--color-gray-300);
722
- }
723
- }
724
- }
725
- [data-wallet-ui] .hover\:bg-red-200 {
752
+ [data-wallet-ui-scope] .hover\:bg-red-200 {
726
753
  &:hover {
727
754
  @media (hover: hover) {
728
755
  background-color: var(--color-red-200);
729
756
  }
730
757
  }
731
758
  }
732
- [data-wallet-ui] .hover\:text-\[\#2D2DF1\] {
759
+ [data-wallet-ui-scope] .hover\:text-\[var\(--wui-color-link-hover\)\] {
733
760
  &:hover {
734
761
  @media (hover: hover) {
735
- color: #2D2DF1;
762
+ color: var(--wui-color-link-hover);
736
763
  }
737
764
  }
738
765
  }
739
- [data-wallet-ui] .hover\:text-gray-700 {
766
+ [data-wallet-ui-scope] .hover\:brightness-90 {
740
767
  &:hover {
741
768
  @media (hover: hover) {
742
- color: var(--color-gray-700);
769
+ --tw-brightness: brightness(90%);
770
+ 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,);
743
771
  }
744
772
  }
745
773
  }
746
- [data-wallet-ui] .focus\:border-transparent {
774
+ [data-wallet-ui-scope] .focus\:border-transparent {
747
775
  &:focus {
748
776
  border-color: transparent;
749
777
  }
750
778
  }
751
- [data-wallet-ui] .focus\:ring-2 {
779
+ [data-wallet-ui-scope] .focus\:ring-2 {
752
780
  &:focus {
753
781
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
754
782
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
755
783
  }
756
784
  }
757
- [data-wallet-ui] .focus\:ring-\[\#2D2DF1\] {
785
+ [data-wallet-ui-scope] .focus\:ring-\[var\(--wui-color-primary\)\] {
758
786
  &:focus {
759
- --tw-ring-color: #2D2DF1;
787
+ --tw-ring-color: var(--wui-color-primary);
760
788
  }
761
789
  }
762
- [data-wallet-ui] .focus\:outline-none {
790
+ [data-wallet-ui-scope] .focus\:outline-none {
763
791
  &:focus {
764
792
  --tw-outline-style: none;
765
793
  outline-style: none;
766
794
  }
767
795
  }
768
- [data-wallet-ui] .disabled\:opacity-50 {
796
+ [data-wallet-ui-scope] .disabled\:opacity-50 {
769
797
  &:disabled {
770
798
  opacity: 50%;
771
799
  }
772
800
  }
773
- [data-wallet-ui] .data-\[focus\]\:bg-\[\#E9E9FD\] {
801
+ [data-wallet-ui-scope] .data-\[focus\]\:bg-\[var\(--wui-color-bg-hover\)\] {
774
802
  &[data-focus] {
775
- background-color: #E9E9FD;
803
+ background-color: var(--wui-color-bg-hover);
776
804
  }
777
805
  }
778
- [data-wallet-ui] .data-\[focus\]\:text-gray-900 {
779
- &[data-focus] {
780
- color: var(--color-gray-900);
781
- }
782
- }
783
- [data-wallet-ui] .data-\[focus\]\:outline-none {
806
+ [data-wallet-ui-scope] .data-\[focus\]\:outline-none {
784
807
  &[data-focus] {
785
808
  --tw-outline-style: none;
786
809
  outline-style: none;
787
810
  }
788
811
  }
789
- [data-wallet-ui] .data-\[leave\]\:transition {
812
+ [data-wallet-ui-scope] .data-\[leave\]\:transition {
790
813
  &[data-leave] {
791
814
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
792
815
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
793
816
  transition-duration: var(--tw-duration, var(--default-transition-duration));
794
817
  }
795
818
  }
796
- [data-wallet-ui] .data-\[leave\]\:duration-100 {
819
+ [data-wallet-ui-scope] .data-\[leave\]\:duration-100 {
797
820
  &[data-leave] {
798
821
  --tw-duration: 100ms;
799
822
  transition-duration: 100ms;
800
823
  }
801
824
  }
802
- [data-wallet-ui] .data-\[leave\]\:ease-in {
825
+ [data-wallet-ui-scope] .data-\[leave\]\:ease-in {
803
826
  &[data-leave] {
804
827
  --tw-ease: var(--ease-in);
805
828
  transition-timing-function: var(--ease-in);
806
829
  }
807
830
  }
808
- [data-wallet-ui] .data-\[closed\]\:data-\[leave\]\:opacity-0 {
831
+ [data-wallet-ui-scope] .data-\[closed\]\:data-\[leave\]\:opacity-0 {
809
832
  &[data-closed] {
810
833
  &[data-leave] {
811
834
  opacity: 0%;
812
835
  }
813
836
  }
814
837
  }
815
- [data-wallet-ui] .data-\[state\=entered\]\:scale-100 {
838
+ [data-wallet-ui-scope] .data-\[state\=entered\]\:scale-100 {
816
839
  &[data-state="entered"] {
817
840
  --tw-scale-x: 100%;
818
841
  --tw-scale-y: 100%;
@@ -820,12 +843,12 @@
820
843
  scale: var(--tw-scale-x) var(--tw-scale-y);
821
844
  }
822
845
  }
823
- [data-wallet-ui] .data-\[state\=entered\]\:opacity-100 {
846
+ [data-wallet-ui-scope] .data-\[state\=entered\]\:opacity-100 {
824
847
  &[data-state="entered"] {
825
848
  opacity: 100%;
826
849
  }
827
850
  }
828
- [data-wallet-ui] .data-\[state\=exiting\]\:scale-90 {
851
+ [data-wallet-ui-scope] .data-\[state\=exiting\]\:scale-90 {
829
852
  &[data-state="exiting"] {
830
853
  --tw-scale-x: 90%;
831
854
  --tw-scale-y: 90%;
@@ -833,12 +856,12 @@
833
856
  scale: var(--tw-scale-x) var(--tw-scale-y);
834
857
  }
835
858
  }
836
- [data-wallet-ui] .data-\[state\=exiting\]\:opacity-0 {
859
+ [data-wallet-ui-scope] .data-\[state\=exiting\]\:opacity-0 {
837
860
  &[data-state="exiting"] {
838
861
  opacity: 0%;
839
862
  }
840
863
  }
841
- [data-wallet-ui] .data-\[state\=starting\]\:scale-90 {
864
+ [data-wallet-ui-scope] .data-\[state\=starting\]\:scale-90 {
842
865
  &[data-state="starting"] {
843
866
  --tw-scale-x: 90%;
844
867
  --tw-scale-y: 90%;
@@ -846,70 +869,37 @@
846
869
  scale: var(--tw-scale-x) var(--tw-scale-y);
847
870
  }
848
871
  }
849
- [data-wallet-ui] .data-\[state\=starting\]\:opacity-0 {
872
+ [data-wallet-ui-scope] .data-\[state\=starting\]\:opacity-0 {
850
873
  &[data-state="starting"] {
851
874
  opacity: 0%;
852
875
  }
853
876
  }
854
- [data-wallet-ui] .md\:mr-2 {
877
+ [data-wallet-ui-scope] .md\:mr-2 {
855
878
  @media (width >= 48rem) {
856
879
  margin-right: calc(var(--spacing) * 2);
857
880
  }
858
881
  }
859
- [data-wallet-ui] .md\:block {
882
+ [data-wallet-ui-scope] .md\:block {
860
883
  @media (width >= 48rem) {
861
884
  display: block;
862
885
  }
863
886
  }
864
- [data-wallet-ui] .md\:pl-3\.5 {
887
+ [data-wallet-ui-scope] .md\:pl-3\.5 {
865
888
  @media (width >= 48rem) {
866
889
  padding-left: calc(var(--spacing) * 3.5);
867
890
  }
868
891
  }
869
- [data-wallet-ui] .dark\:border-\[\#192A39\] {
870
- @media (prefers-color-scheme: dark) {
871
- border-color: #192A39;
872
- }
873
- }
874
- [data-wallet-ui] .dark\:bg-\[\#101B29\] {
875
- @media (prefers-color-scheme: dark) {
876
- background-color: #101B29;
877
- }
878
- }
879
- [data-wallet-ui] .dark\:bg-\[\#192A39\] {
892
+ [data-wallet-ui-scope] .dark\:bg-\[\#192A39\] {
880
893
  @media (prefers-color-scheme: dark) {
881
894
  background-color: #192A39;
882
895
  }
883
896
  }
884
- [data-wallet-ui] .dark\:bg-\[\#192A39\]\/75 {
885
- @media (prefers-color-scheme: dark) {
886
- background-color: color-mix(in oklab, #192A39 75%, transparent);
887
- }
888
- }
889
- [data-wallet-ui] .dark\:bg-\[\#001324\] {
890
- @media (prefers-color-scheme: dark) {
891
- background-color: #001324;
892
- }
893
- }
894
- [data-wallet-ui] .dark\:bg-\[\#BFBFF9\] {
895
- @media (prefers-color-scheme: dark) {
896
- background-color: #BFBFF9;
897
- }
898
- }
899
- [data-wallet-ui] .dark\:bg-black\/50 {
900
- @media (prefers-color-scheme: dark) {
901
- background-color: color-mix(in srgb, #000 50%, transparent);
902
- @supports (color: color-mix(in lab, red, red)) {
903
- background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
904
- }
905
- }
906
- }
907
- [data-wallet-ui] .dark\:bg-gray-200 {
897
+ [data-wallet-ui-scope] .dark\:bg-gray-200 {
908
898
  @media (prefers-color-scheme: dark) {
909
899
  background-color: var(--color-gray-200);
910
900
  }
911
901
  }
912
- [data-wallet-ui] .dark\:bg-red-900\/40 {
902
+ [data-wallet-ui-scope] .dark\:bg-red-900\/40 {
913
903
  @media (prefers-color-scheme: dark) {
914
904
  background-color: color-mix(in srgb, oklch(39.6% 0.141 25.723) 40%, transparent);
915
905
  @supports (color: color-mix(in lab, red, red)) {
@@ -917,94 +907,17 @@
917
907
  }
918
908
  }
919
909
  }
920
- [data-wallet-ui] .dark\:bg-transparent {
921
- @media (prefers-color-scheme: dark) {
922
- background-color: transparent;
923
- }
924
- }
925
- [data-wallet-ui] .dark\:text-\[\#6C6CF1\] {
926
- @media (prefers-color-scheme: dark) {
927
- color: #6C6CF1;
928
- }
929
- }
930
- [data-wallet-ui] .dark\:text-\[\#99A1A7\] {
931
- @media (prefers-color-scheme: dark) {
932
- color: #99A1A7;
933
- }
934
- }
935
- [data-wallet-ui] .dark\:text-\[\#001324\] {
936
- @media (prefers-color-scheme: dark) {
937
- color: #001324;
938
- }
939
- }
940
- [data-wallet-ui] .dark\:text-\[\#BFBFF9\] {
941
- @media (prefers-color-scheme: dark) {
942
- color: #BFBFF9;
943
- }
944
- }
945
- [data-wallet-ui] .dark\:text-\[\#E9E9FD\] {
946
- @media (prefers-color-scheme: dark) {
947
- color: #E9E9FD;
948
- }
949
- }
950
- [data-wallet-ui] .dark\:text-gray-300 {
951
- @media (prefers-color-scheme: dark) {
952
- color: var(--color-gray-300);
953
- }
954
- }
955
- [data-wallet-ui] .dark\:text-gray-400 {
956
- @media (prefers-color-scheme: dark) {
957
- color: var(--color-gray-400);
958
- }
959
- }
960
- [data-wallet-ui] .dark\:text-gray-500 {
910
+ [data-wallet-ui-scope] .dark\:text-gray-500 {
961
911
  @media (prefers-color-scheme: dark) {
962
912
  color: var(--color-gray-500);
963
913
  }
964
914
  }
965
- [data-wallet-ui] .dark\:text-red-300 {
915
+ [data-wallet-ui-scope] .dark\:text-red-300 {
966
916
  @media (prefers-color-scheme: dark) {
967
917
  color: var(--color-red-300);
968
918
  }
969
919
  }
970
- [data-wallet-ui] .dark\:text-white {
971
- @media (prefers-color-scheme: dark) {
972
- color: var(--color-white);
973
- }
974
- }
975
- [data-wallet-ui] .dark\:ring-\[\#192A39\]\/50 {
976
- @media (prefers-color-scheme: dark) {
977
- --tw-ring-color: color-mix(in oklab, #192A39 50%, transparent);
978
- }
979
- }
980
- [data-wallet-ui] .dark\:hover\:bg-\[\#192A39\] {
981
- @media (prefers-color-scheme: dark) {
982
- &:hover {
983
- @media (hover: hover) {
984
- background-color: #192A39;
985
- }
986
- }
987
- }
988
- }
989
- [data-wallet-ui] .dark\:hover\:bg-\[\#263A4A\] {
990
- @media (prefers-color-scheme: dark) {
991
- &:hover {
992
- @media (hover: hover) {
993
- background-color: #263A4A;
994
- }
995
- }
996
- }
997
- }
998
- [data-wallet-ui] .dark\:hover\:bg-\[\#D4D4FA\] {
999
- @media (prefers-color-scheme: dark) {
1000
- &:hover {
1001
- @media (hover: hover) {
1002
- background-color: #D4D4FA;
1003
- }
1004
- }
1005
- }
1006
- }
1007
- [data-wallet-ui] .dark\:hover\:bg-red-800\/60 {
920
+ [data-wallet-ui-scope] .dark\:hover\:bg-red-800\/60 {
1008
921
  @media (prefers-color-scheme: dark) {
1009
922
  &:hover {
1010
923
  @media (hover: hover) {
@@ -1016,45 +929,6 @@
1016
929
  }
1017
930
  }
1018
931
  }
1019
- [data-wallet-ui] .dark\:hover\:text-\[\#8080F3\] {
1020
- @media (prefers-color-scheme: dark) {
1021
- &:hover {
1022
- @media (hover: hover) {
1023
- color: #8080F3;
1024
- }
1025
- }
1026
- }
1027
- }
1028
- [data-wallet-ui] .dark\:hover\:text-\[\#D4D4FA\] {
1029
- @media (prefers-color-scheme: dark) {
1030
- &:hover {
1031
- @media (hover: hover) {
1032
- color: #D4D4FA;
1033
- }
1034
- }
1035
- }
1036
- }
1037
- [data-wallet-ui] .dark\:focus\:ring-\[\#BFBFF9\] {
1038
- @media (prefers-color-scheme: dark) {
1039
- &:focus {
1040
- --tw-ring-color: #BFBFF9;
1041
- }
1042
- }
1043
- }
1044
- [data-wallet-ui] .dark\:data-\[focus\]\:bg-\[\#192A39\] {
1045
- @media (prefers-color-scheme: dark) {
1046
- &[data-focus] {
1047
- background-color: #192A39;
1048
- }
1049
- }
1050
- }
1051
- [data-wallet-ui] .dark\:data-\[focus\]\:text-\[\#E9E9FD\] {
1052
- @media (prefers-color-scheme: dark) {
1053
- &[data-focus] {
1054
- color: #E9E9FD;
1055
- }
1056
- }
1057
- }
1058
932
  @property --tw-rotate-x {
1059
933
  syntax: "*";
1060
934
  inherits: false;
@@ -1162,6 +1036,59 @@
1162
1036
  syntax: "*";
1163
1037
  inherits: false;
1164
1038
  }
1039
+ @property --tw-blur {
1040
+ syntax: "*";
1041
+ inherits: false;
1042
+ }
1043
+ @property --tw-brightness {
1044
+ syntax: "*";
1045
+ inherits: false;
1046
+ }
1047
+ @property --tw-contrast {
1048
+ syntax: "*";
1049
+ inherits: false;
1050
+ }
1051
+ @property --tw-grayscale {
1052
+ syntax: "*";
1053
+ inherits: false;
1054
+ }
1055
+ @property --tw-hue-rotate {
1056
+ syntax: "*";
1057
+ inherits: false;
1058
+ }
1059
+ @property --tw-invert {
1060
+ syntax: "*";
1061
+ inherits: false;
1062
+ }
1063
+ @property --tw-opacity {
1064
+ syntax: "*";
1065
+ inherits: false;
1066
+ }
1067
+ @property --tw-saturate {
1068
+ syntax: "*";
1069
+ inherits: false;
1070
+ }
1071
+ @property --tw-sepia {
1072
+ syntax: "*";
1073
+ inherits: false;
1074
+ }
1075
+ @property --tw-drop-shadow {
1076
+ syntax: "*";
1077
+ inherits: false;
1078
+ }
1079
+ @property --tw-drop-shadow-color {
1080
+ syntax: "*";
1081
+ inherits: false;
1082
+ }
1083
+ @property --tw-drop-shadow-alpha {
1084
+ syntax: "<percentage>";
1085
+ inherits: false;
1086
+ initial-value: 100%;
1087
+ }
1088
+ @property --tw-drop-shadow-size {
1089
+ syntax: "*";
1090
+ inherits: false;
1091
+ }
1165
1092
  @property --tw-scale-x {
1166
1093
  syntax: "*";
1167
1094
  inherits: false;
@@ -1204,6 +1131,19 @@
1204
1131
  --tw-ring-offset-shadow: 0 0 #0000;
1205
1132
  --tw-duration: initial;
1206
1133
  --tw-ease: initial;
1134
+ --tw-blur: initial;
1135
+ --tw-brightness: initial;
1136
+ --tw-contrast: initial;
1137
+ --tw-grayscale: initial;
1138
+ --tw-hue-rotate: initial;
1139
+ --tw-invert: initial;
1140
+ --tw-opacity: initial;
1141
+ --tw-saturate: initial;
1142
+ --tw-sepia: initial;
1143
+ --tw-drop-shadow: initial;
1144
+ --tw-drop-shadow-color: initial;
1145
+ --tw-drop-shadow-alpha: 100%;
1146
+ --tw-drop-shadow-size: initial;
1207
1147
  --tw-scale-x: 1;
1208
1148
  --tw-scale-y: 1;
1209
1149
  --tw-scale-z: 1;