@nswds/app 1.9.1 → 1.11.0

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