@luxonis/depthai-viewer-common 3.5.0-rc.1 → 3.5.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.
package/dist/index.css CHANGED
@@ -1,3 +1,1689 @@
1
+ /*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
1
2
  @import url(./fonts/inter.css);
2
3
  @import url(./fonts/jetbrains-mono.css);
3
4
  @import url(./fonts/ubuntu-mono.css);
5
+ @import url("@luxonis/ui-components/styles.css");
6
+ @import url("@luxonis/depthai-pipeline-lib/styles");
7
+ @layer properties;
8
+ @layer theme, base, components, utilities;
9
+ @layer theme {
10
+ :root, :host {
11
+ --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
12
+ "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
13
+ --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
14
+ "Courier New", monospace;
15
+ --color-black: #000;
16
+ --color-white: #fff;
17
+ --spacing: 0.25rem;
18
+ --container-sm: 24rem;
19
+ --text-xs: 0.75rem;
20
+ --text-xs--line-height: calc(1 / 0.75);
21
+ --text-sm: 0.875rem;
22
+ --text-sm--line-height: calc(1.25 / 0.875);
23
+ --text-base: 1rem;
24
+ --text-base--line-height: calc(1.5 / 1);
25
+ --text-lg: 1.125rem;
26
+ --text-lg--line-height: calc(1.75 / 1.125);
27
+ --text-xl: 1.25rem;
28
+ --text-xl--line-height: calc(1.75 / 1.25);
29
+ --text-2xl: 1.5rem;
30
+ --text-2xl--line-height: calc(2 / 1.5);
31
+ --text-3xl: 1.875rem;
32
+ --text-3xl--line-height: calc(2.25 / 1.875);
33
+ --font-weight-light: 300;
34
+ --font-weight-normal: 400;
35
+ --font-weight-medium: 500;
36
+ --font-weight-semibold: 600;
37
+ --font-weight-bold: 700;
38
+ --tracking-tight: -0.025em;
39
+ --leading-tight: 1.25;
40
+ --radius-sm: 0.25rem;
41
+ --radius-md: 0.375rem;
42
+ --radius-lg: 0.5rem;
43
+ --ease-out: cubic-bezier(0, 0, 0.2, 1);
44
+ --animate-spin: spin 1s linear infinite;
45
+ --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
46
+ --blur-sm: 8px;
47
+ --default-transition-duration: 150ms;
48
+ --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
49
+ --default-font-family: var(--font-sans);
50
+ --default-mono-font-family: var(--font-mono);
51
+ }
52
+ }
53
+ @layer base {
54
+ *, ::after, ::before, ::backdrop, ::file-selector-button {
55
+ box-sizing: border-box;
56
+ margin: 0;
57
+ padding: 0;
58
+ border: 0 solid;
59
+ }
60
+ html, :host {
61
+ line-height: 1.5;
62
+ -webkit-text-size-adjust: 100%;
63
+ tab-size: 4;
64
+ font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
65
+ font-feature-settings: var(--default-font-feature-settings, normal);
66
+ font-variation-settings: var(--default-font-variation-settings, normal);
67
+ -webkit-tap-highlight-color: transparent;
68
+ }
69
+ hr {
70
+ height: 0;
71
+ color: inherit;
72
+ border-top-width: 1px;
73
+ }
74
+ abbr:where([title]) {
75
+ -webkit-text-decoration: underline dotted;
76
+ text-decoration: underline dotted;
77
+ }
78
+ h1, h2, h3, h4, h5, h6 {
79
+ font-size: inherit;
80
+ font-weight: inherit;
81
+ }
82
+ a {
83
+ color: inherit;
84
+ -webkit-text-decoration: inherit;
85
+ text-decoration: inherit;
86
+ }
87
+ b, strong {
88
+ font-weight: bolder;
89
+ }
90
+ code, kbd, samp, pre {
91
+ font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
92
+ font-feature-settings: var(--default-mono-font-feature-settings, normal);
93
+ font-variation-settings: var(--default-mono-font-variation-settings, normal);
94
+ font-size: 1em;
95
+ }
96
+ small {
97
+ font-size: 80%;
98
+ }
99
+ sub, sup {
100
+ font-size: 75%;
101
+ line-height: 0;
102
+ position: relative;
103
+ vertical-align: baseline;
104
+ }
105
+ sub {
106
+ bottom: -0.25em;
107
+ }
108
+ sup {
109
+ top: -0.5em;
110
+ }
111
+ table {
112
+ text-indent: 0;
113
+ border-color: inherit;
114
+ border-collapse: collapse;
115
+ }
116
+ :-moz-focusring {
117
+ outline: auto;
118
+ }
119
+ progress {
120
+ vertical-align: baseline;
121
+ }
122
+ summary {
123
+ display: list-item;
124
+ }
125
+ ol, ul, menu {
126
+ list-style: none;
127
+ }
128
+ img, svg, video, canvas, audio, iframe, embed, object {
129
+ display: block;
130
+ vertical-align: middle;
131
+ }
132
+ img, video {
133
+ max-width: 100%;
134
+ height: auto;
135
+ }
136
+ button, input, select, optgroup, textarea, ::file-selector-button {
137
+ font: inherit;
138
+ font-feature-settings: inherit;
139
+ font-variation-settings: inherit;
140
+ letter-spacing: inherit;
141
+ color: inherit;
142
+ border-radius: 0;
143
+ background-color: transparent;
144
+ opacity: 1;
145
+ }
146
+ :where(select:is([multiple], [size])) optgroup {
147
+ font-weight: bolder;
148
+ }
149
+ :where(select:is([multiple], [size])) optgroup option {
150
+ padding-inline-start: 20px;
151
+ }
152
+ ::file-selector-button {
153
+ margin-inline-end: 4px;
154
+ }
155
+ ::placeholder {
156
+ opacity: 1;
157
+ }
158
+ @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
159
+ ::placeholder {
160
+ color: currentcolor;
161
+ @supports (color: color-mix(in lab, red, red)) {
162
+ color: color-mix(in oklab, currentcolor 50%, transparent);
163
+ }
164
+ }
165
+ }
166
+ textarea {
167
+ resize: vertical;
168
+ }
169
+ ::-webkit-search-decoration {
170
+ -webkit-appearance: none;
171
+ }
172
+ ::-webkit-date-and-time-value {
173
+ min-height: 1lh;
174
+ text-align: inherit;
175
+ }
176
+ ::-webkit-datetime-edit {
177
+ display: inline-flex;
178
+ }
179
+ ::-webkit-datetime-edit-fields-wrapper {
180
+ padding: 0;
181
+ }
182
+ ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
183
+ padding-block: 0;
184
+ }
185
+ ::-webkit-calendar-picker-indicator {
186
+ line-height: 1;
187
+ }
188
+ :-moz-ui-invalid {
189
+ box-shadow: none;
190
+ }
191
+ button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
192
+ appearance: button;
193
+ }
194
+ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
195
+ height: auto;
196
+ }
197
+ [hidden]:where(:not([hidden="until-found"])) {
198
+ display: none !important;
199
+ }
200
+ }
201
+ @layer utilities {
202
+ .pointer-events-auto {
203
+ pointer-events: auto;
204
+ }
205
+ .pointer-events-none {
206
+ pointer-events: none;
207
+ }
208
+ .visible {
209
+ visibility: visible;
210
+ }
211
+ .absolute {
212
+ position: absolute;
213
+ }
214
+ .fixed {
215
+ position: fixed;
216
+ }
217
+ .relative {
218
+ position: relative;
219
+ }
220
+ .static {
221
+ position: static;
222
+ }
223
+ .sticky {
224
+ position: sticky;
225
+ }
226
+ .inset-0 {
227
+ inset: calc(var(--spacing) * 0);
228
+ }
229
+ .top-0 {
230
+ top: calc(var(--spacing) * 0);
231
+ }
232
+ .top-1\/2 {
233
+ top: calc(1 / 2 * 100%);
234
+ }
235
+ .top-2 {
236
+ top: calc(var(--spacing) * 2);
237
+ }
238
+ .top-auto {
239
+ top: auto;
240
+ }
241
+ .top-full {
242
+ top: 100%;
243
+ }
244
+ .right-0 {
245
+ right: calc(var(--spacing) * 0);
246
+ }
247
+ .right-2 {
248
+ right: calc(var(--spacing) * 2);
249
+ }
250
+ .bottom-0 {
251
+ bottom: calc(var(--spacing) * 0);
252
+ }
253
+ .bottom-auto {
254
+ bottom: auto;
255
+ }
256
+ .left-0 {
257
+ left: calc(var(--spacing) * 0);
258
+ }
259
+ .left-1\/2 {
260
+ left: calc(1 / 2 * 100%);
261
+ }
262
+ .left-2 {
263
+ left: calc(var(--spacing) * 2);
264
+ }
265
+ .z-\[5\] {
266
+ z-index: 5;
267
+ }
268
+ .z-\[700\] {
269
+ z-index: 700;
270
+ }
271
+ .z-\[1000\] {
272
+ z-index: 1000;
273
+ }
274
+ .col-span-1 {
275
+ grid-column: span 1 / span 1;
276
+ }
277
+ .col-span-2 {
278
+ grid-column: span 2 / span 2;
279
+ }
280
+ .col-span-3 {
281
+ grid-column: span 3 / span 3;
282
+ }
283
+ .col-span-4 {
284
+ grid-column: span 4 / span 4;
285
+ }
286
+ .col-span-5 {
287
+ grid-column: span 5 / span 5;
288
+ }
289
+ .col-span-6 {
290
+ grid-column: span 6 / span 6;
291
+ }
292
+ .col-span-7 {
293
+ grid-column: span 7 / span 7;
294
+ }
295
+ .col-span-8 {
296
+ grid-column: span 8 / span 8;
297
+ }
298
+ .col-span-9 {
299
+ grid-column: span 9 / span 9;
300
+ }
301
+ .col-span-10 {
302
+ grid-column: span 10 / span 10;
303
+ }
304
+ .col-span-11 {
305
+ grid-column: span 11 / span 11;
306
+ }
307
+ .col-span-12 {
308
+ grid-column: span 12 / span 12;
309
+ }
310
+ .container {
311
+ width: 100%;
312
+ @media (width >= 40rem) {
313
+ max-width: 40rem;
314
+ }
315
+ @media (width >= 48rem) {
316
+ max-width: 48rem;
317
+ }
318
+ @media (width >= 64rem) {
319
+ max-width: 64rem;
320
+ }
321
+ @media (width >= 80rem) {
322
+ max-width: 80rem;
323
+ }
324
+ @media (width >= 96rem) {
325
+ max-width: 96rem;
326
+ }
327
+ }
328
+ .-mx-1 {
329
+ margin-inline: calc(var(--spacing) * -1);
330
+ }
331
+ .mx-auto {
332
+ margin-inline: auto;
333
+ }
334
+ .my-1 {
335
+ margin-block: calc(var(--spacing) * 1);
336
+ }
337
+ .mt-1 {
338
+ margin-top: calc(var(--spacing) * 1);
339
+ }
340
+ .mt-2 {
341
+ margin-top: calc(var(--spacing) * 2);
342
+ }
343
+ .mb-2 {
344
+ margin-bottom: calc(var(--spacing) * 2);
345
+ }
346
+ .mb-6 {
347
+ margin-bottom: calc(var(--spacing) * 6);
348
+ }
349
+ .ml-2 {
350
+ margin-left: calc(var(--spacing) * 2);
351
+ }
352
+ .ml-auto {
353
+ margin-left: auto;
354
+ }
355
+ .block {
356
+ display: block;
357
+ }
358
+ .flex {
359
+ display: flex;
360
+ }
361
+ .grid {
362
+ display: grid;
363
+ }
364
+ .hidden {
365
+ display: none;
366
+ }
367
+ .inline-block {
368
+ display: inline-block;
369
+ }
370
+ .inline-flex {
371
+ display: inline-flex;
372
+ }
373
+ .h-2 {
374
+ height: calc(var(--spacing) * 2);
375
+ }
376
+ .h-3\.5 {
377
+ height: calc(var(--spacing) * 3.5);
378
+ }
379
+ .h-4 {
380
+ height: calc(var(--spacing) * 4);
381
+ }
382
+ .h-5 {
383
+ height: calc(var(--spacing) * 5);
384
+ }
385
+ .h-6 {
386
+ height: calc(var(--spacing) * 6);
387
+ }
388
+ .h-8 {
389
+ height: calc(var(--spacing) * 8);
390
+ }
391
+ .h-9 {
392
+ height: calc(var(--spacing) * 9);
393
+ }
394
+ .h-10 {
395
+ height: calc(var(--spacing) * 10);
396
+ }
397
+ .h-11 {
398
+ height: calc(var(--spacing) * 11);
399
+ }
400
+ .h-12 {
401
+ height: calc(var(--spacing) * 12);
402
+ }
403
+ .h-\[32px\] {
404
+ height: 32px;
405
+ }
406
+ .h-\[37\.5px\] {
407
+ height: 37.5px;
408
+ }
409
+ .h-\[64px\] {
410
+ height: 64px;
411
+ }
412
+ .h-\[128px\] {
413
+ height: 128px;
414
+ }
415
+ .h-\[256px\] {
416
+ height: 256px;
417
+ }
418
+ .h-\[512px\] {
419
+ height: 512px;
420
+ }
421
+ .h-full {
422
+ height: 100%;
423
+ }
424
+ .h-px {
425
+ height: 1px;
426
+ }
427
+ .max-h-64 {
428
+ max-height: calc(var(--spacing) * 64);
429
+ }
430
+ .max-h-screen {
431
+ max-height: 100vh;
432
+ }
433
+ .min-h-20 {
434
+ min-height: calc(var(--spacing) * 20);
435
+ }
436
+ .min-h-40 {
437
+ min-height: calc(var(--spacing) * 40);
438
+ }
439
+ .min-h-\[40px\] {
440
+ min-height: 40px;
441
+ }
442
+ .w-2 {
443
+ width: calc(var(--spacing) * 2);
444
+ }
445
+ .w-3\.5 {
446
+ width: calc(var(--spacing) * 3.5);
447
+ }
448
+ .w-4 {
449
+ width: calc(var(--spacing) * 4);
450
+ }
451
+ .w-5 {
452
+ width: calc(var(--spacing) * 5);
453
+ }
454
+ .w-6 {
455
+ width: calc(var(--spacing) * 6);
456
+ }
457
+ .w-8 {
458
+ width: calc(var(--spacing) * 8);
459
+ }
460
+ .w-10 {
461
+ width: calc(var(--spacing) * 10);
462
+ }
463
+ .w-11 {
464
+ width: calc(var(--spacing) * 11);
465
+ }
466
+ .w-12 {
467
+ width: calc(var(--spacing) * 12);
468
+ }
469
+ .w-\[125px\] {
470
+ width: 125px;
471
+ }
472
+ .w-\[var\(--radix-select-trigger-width\)\] {
473
+ width: var(--radix-select-trigger-width);
474
+ }
475
+ .w-auto {
476
+ width: auto;
477
+ }
478
+ .w-fit {
479
+ width: fit-content;
480
+ }
481
+ .w-full {
482
+ width: 100%;
483
+ }
484
+ .w-px {
485
+ width: 1px;
486
+ }
487
+ .max-w-\[240px\] {
488
+ max-width: 240px;
489
+ }
490
+ .max-w-\[300px\] {
491
+ max-width: 300px;
492
+ }
493
+ .max-w-\[800px\] {
494
+ max-width: 800px;
495
+ }
496
+ .max-w-full {
497
+ max-width: 100%;
498
+ }
499
+ .max-w-sm {
500
+ max-width: var(--container-sm);
501
+ }
502
+ .min-w-0 {
503
+ min-width: calc(var(--spacing) * 0);
504
+ }
505
+ .min-w-9 {
506
+ min-width: calc(var(--spacing) * 9);
507
+ }
508
+ .min-w-10 {
509
+ min-width: calc(var(--spacing) * 10);
510
+ }
511
+ .min-w-11 {
512
+ min-width: calc(var(--spacing) * 11);
513
+ }
514
+ .min-w-48 {
515
+ min-width: calc(var(--spacing) * 48);
516
+ }
517
+ .min-w-\[var\(--radix-select-trigger-width\)\] {
518
+ min-width: var(--radix-select-trigger-width);
519
+ }
520
+ .min-w-full {
521
+ min-width: 100%;
522
+ }
523
+ .flex-1 {
524
+ flex: 1;
525
+ }
526
+ .flex-none {
527
+ flex: none;
528
+ }
529
+ .shrink-0 {
530
+ flex-shrink: 0;
531
+ }
532
+ .grow {
533
+ flex-grow: 1;
534
+ }
535
+ .-translate-x-1\/2 {
536
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
537
+ translate: var(--tw-translate-x) var(--tw-translate-y);
538
+ }
539
+ .-translate-y-1\/2 {
540
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
541
+ translate: var(--tw-translate-x) var(--tw-translate-y);
542
+ }
543
+ .rotate-180 {
544
+ rotate: 180deg;
545
+ }
546
+ .transform {
547
+ transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
548
+ }
549
+ .animate-pulse {
550
+ animation: var(--animate-pulse);
551
+ }
552
+ .animate-spin {
553
+ animation: var(--animate-spin);
554
+ }
555
+ .cursor-auto {
556
+ cursor: auto;
557
+ }
558
+ .cursor-default {
559
+ cursor: default;
560
+ }
561
+ .cursor-help {
562
+ cursor: help;
563
+ }
564
+ .cursor-not-allowed {
565
+ cursor: not-allowed;
566
+ }
567
+ .cursor-pointer {
568
+ cursor: pointer;
569
+ }
570
+ .touch-none {
571
+ touch-action: none;
572
+ }
573
+ .resize {
574
+ resize: both;
575
+ }
576
+ .grid-flow-col {
577
+ grid-auto-flow: column;
578
+ }
579
+ .grid-flow-col-dense {
580
+ grid-auto-flow: column dense;
581
+ }
582
+ .grid-flow-dense {
583
+ grid-auto-flow: dense;
584
+ }
585
+ .grid-flow-row {
586
+ grid-auto-flow: row;
587
+ }
588
+ .grid-flow-row-dense {
589
+ grid-auto-flow: row dense;
590
+ }
591
+ .grid-cols-1 {
592
+ grid-template-columns: repeat(1, minmax(0, 1fr));
593
+ }
594
+ .grid-cols-2 {
595
+ grid-template-columns: repeat(2, minmax(0, 1fr));
596
+ }
597
+ .grid-cols-3 {
598
+ grid-template-columns: repeat(3, minmax(0, 1fr));
599
+ }
600
+ .grid-cols-4 {
601
+ grid-template-columns: repeat(4, minmax(0, 1fr));
602
+ }
603
+ .grid-cols-5 {
604
+ grid-template-columns: repeat(5, minmax(0, 1fr));
605
+ }
606
+ .grid-cols-6 {
607
+ grid-template-columns: repeat(6, minmax(0, 1fr));
608
+ }
609
+ .grid-cols-7 {
610
+ grid-template-columns: repeat(7, minmax(0, 1fr));
611
+ }
612
+ .grid-cols-8 {
613
+ grid-template-columns: repeat(8, minmax(0, 1fr));
614
+ }
615
+ .grid-cols-9 {
616
+ grid-template-columns: repeat(9, minmax(0, 1fr));
617
+ }
618
+ .grid-cols-10 {
619
+ grid-template-columns: repeat(10, minmax(0, 1fr));
620
+ }
621
+ .grid-cols-11 {
622
+ grid-template-columns: repeat(11, minmax(0, 1fr));
623
+ }
624
+ .grid-cols-12 {
625
+ grid-template-columns: repeat(12, minmax(0, 1fr));
626
+ }
627
+ .grid-rows-1 {
628
+ grid-template-rows: repeat(1, minmax(0, 1fr));
629
+ }
630
+ .grid-rows-2 {
631
+ grid-template-rows: repeat(2, minmax(0, 1fr));
632
+ }
633
+ .grid-rows-3 {
634
+ grid-template-rows: repeat(3, minmax(0, 1fr));
635
+ }
636
+ .grid-rows-4 {
637
+ grid-template-rows: repeat(4, minmax(0, 1fr));
638
+ }
639
+ .grid-rows-5 {
640
+ grid-template-rows: repeat(5, minmax(0, 1fr));
641
+ }
642
+ .grid-rows-6 {
643
+ grid-template-rows: repeat(6, minmax(0, 1fr));
644
+ }
645
+ .grid-rows-7 {
646
+ grid-template-rows: repeat(7, minmax(0, 1fr));
647
+ }
648
+ .grid-rows-8 {
649
+ grid-template-rows: repeat(8, minmax(0, 1fr));
650
+ }
651
+ .grid-rows-9 {
652
+ grid-template-rows: repeat(9, minmax(0, 1fr));
653
+ }
654
+ .grid-rows-10 {
655
+ grid-template-rows: repeat(10, minmax(0, 1fr));
656
+ }
657
+ .grid-rows-11 {
658
+ grid-template-rows: repeat(11, minmax(0, 1fr));
659
+ }
660
+ .grid-rows-12 {
661
+ grid-template-rows: repeat(12, minmax(0, 1fr));
662
+ }
663
+ .flex-col {
664
+ flex-direction: column;
665
+ }
666
+ .flex-col-reverse {
667
+ flex-direction: column-reverse;
668
+ }
669
+ .flex-row {
670
+ flex-direction: row;
671
+ }
672
+ .flex-row-reverse {
673
+ flex-direction: row-reverse;
674
+ }
675
+ .flex-nowrap {
676
+ flex-wrap: nowrap;
677
+ }
678
+ .flex-wrap {
679
+ flex-wrap: wrap;
680
+ }
681
+ .flex-wrap-reverse {
682
+ flex-wrap: wrap-reverse;
683
+ }
684
+ .content-around {
685
+ align-content: space-around;
686
+ }
687
+ .content-between {
688
+ align-content: space-between;
689
+ }
690
+ .content-center {
691
+ align-content: center;
692
+ }
693
+ .content-end {
694
+ align-content: flex-end;
695
+ }
696
+ .content-evenly {
697
+ align-content: space-evenly;
698
+ }
699
+ .content-start {
700
+ align-content: flex-start;
701
+ }
702
+ .content-stretch {
703
+ align-content: stretch;
704
+ }
705
+ .items-baseline {
706
+ align-items: baseline;
707
+ }
708
+ .items-center {
709
+ align-items: center;
710
+ }
711
+ .items-end {
712
+ align-items: flex-end;
713
+ }
714
+ .items-start {
715
+ align-items: flex-start;
716
+ }
717
+ .items-stretch {
718
+ align-items: stretch;
719
+ }
720
+ .justify-around {
721
+ justify-content: space-around;
722
+ }
723
+ .justify-between {
724
+ justify-content: space-between;
725
+ }
726
+ .justify-center {
727
+ justify-content: center;
728
+ }
729
+ .justify-end {
730
+ justify-content: flex-end;
731
+ }
732
+ .justify-evenly {
733
+ justify-content: space-evenly;
734
+ }
735
+ .justify-start {
736
+ justify-content: flex-start;
737
+ }
738
+ .justify-items-center {
739
+ justify-items: center;
740
+ }
741
+ .justify-items-end {
742
+ justify-items: end;
743
+ }
744
+ .justify-items-start {
745
+ justify-items: start;
746
+ }
747
+ .justify-items-stretch {
748
+ justify-items: stretch;
749
+ }
750
+ .gap-0 {
751
+ gap: calc(var(--spacing) * 0);
752
+ }
753
+ .gap-1 {
754
+ gap: calc(var(--spacing) * 1);
755
+ }
756
+ .gap-2 {
757
+ gap: calc(var(--spacing) * 2);
758
+ }
759
+ .gap-3 {
760
+ gap: calc(var(--spacing) * 3);
761
+ }
762
+ .gap-4 {
763
+ gap: calc(var(--spacing) * 4);
764
+ }
765
+ .gap-6 {
766
+ gap: calc(var(--spacing) * 6);
767
+ }
768
+ .gap-8 {
769
+ gap: calc(var(--spacing) * 8);
770
+ }
771
+ .gap-16 {
772
+ gap: calc(var(--spacing) * 16);
773
+ }
774
+ .space-y-1\.5 {
775
+ :where(& > :not(:last-child)) {
776
+ --tw-space-y-reverse: 0;
777
+ margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
778
+ margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
779
+ }
780
+ }
781
+ .space-y-2 {
782
+ :where(& > :not(:last-child)) {
783
+ --tw-space-y-reverse: 0;
784
+ margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
785
+ margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
786
+ }
787
+ }
788
+ .space-y-4 {
789
+ :where(& > :not(:last-child)) {
790
+ --tw-space-y-reverse: 0;
791
+ margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
792
+ margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
793
+ }
794
+ }
795
+ .self-auto {
796
+ align-self: auto;
797
+ }
798
+ .self-baseline {
799
+ align-self: baseline;
800
+ }
801
+ .self-center {
802
+ align-self: center;
803
+ }
804
+ .self-end {
805
+ align-self: flex-end;
806
+ }
807
+ .self-start {
808
+ align-self: flex-start;
809
+ }
810
+ .self-stretch {
811
+ align-self: stretch;
812
+ }
813
+ .justify-self-auto {
814
+ justify-self: auto;
815
+ }
816
+ .justify-self-center {
817
+ justify-self: center;
818
+ }
819
+ .justify-self-end {
820
+ justify-self: flex-end;
821
+ }
822
+ .justify-self-start {
823
+ justify-self: flex-start;
824
+ }
825
+ .justify-self-stretch {
826
+ justify-self: stretch;
827
+ }
828
+ .overflow-hidden {
829
+ overflow: hidden;
830
+ }
831
+ .overflow-y-auto {
832
+ overflow-y: auto;
833
+ }
834
+ .rounded {
835
+ border-radius: 0.25rem;
836
+ }
837
+ .rounded-\[2px\] {
838
+ border-radius: 2px;
839
+ }
840
+ .rounded-full {
841
+ border-radius: calc(infinity * 1px);
842
+ }
843
+ .rounded-lg {
844
+ border-radius: var(--radius-lg);
845
+ }
846
+ .rounded-md {
847
+ border-radius: var(--radius-md);
848
+ }
849
+ .rounded-none {
850
+ border-radius: 0;
851
+ }
852
+ .rounded-sm {
853
+ border-radius: var(--radius-sm);
854
+ }
855
+ .rounded-l-none {
856
+ border-top-left-radius: 0;
857
+ border-bottom-left-radius: 0;
858
+ }
859
+ .rounded-r-none {
860
+ border-top-right-radius: 0;
861
+ border-bottom-right-radius: 0;
862
+ }
863
+ .border {
864
+ border-style: var(--tw-border-style);
865
+ border-width: 1px;
866
+ }
867
+ .border-0 {
868
+ border-style: var(--tw-border-style);
869
+ border-width: 0px;
870
+ }
871
+ .border-b {
872
+ border-bottom-style: var(--tw-border-style);
873
+ border-bottom-width: 1px;
874
+ }
875
+ .border-\[var\(--lux-intent-active-text\)\]\/30 {
876
+ border-color: var(--lux-intent-active-text);
877
+ @supports (color: color-mix(in lab, red, red)) {
878
+ border-color: color-mix(in oklab, var(--lux-intent-active-text) 30%, transparent);
879
+ }
880
+ }
881
+ .border-\[var\(--lux-intent-error-border\)\] {
882
+ border-color: var(--lux-intent-error-border);
883
+ }
884
+ .border-\[var\(--lux-intent-success-border\)\] {
885
+ border-color: var(--lux-intent-success-border);
886
+ }
887
+ .border-\[var\(--lux-intent-warning-border\)\] {
888
+ border-color: var(--lux-intent-warning-border);
889
+ }
890
+ .border-\[var\(--ui-color-border\)\] {
891
+ border-color: var(--ui-color-border);
892
+ }
893
+ .border-black {
894
+ border-color: var(--color-black);
895
+ }
896
+ .border-transparent {
897
+ border-color: transparent;
898
+ }
899
+ .bg-\[\#808080\] {
900
+ background-color: #808080;
901
+ }
902
+ .bg-\[var\(--lux-intent-active-text\)\]\/10 {
903
+ background-color: var(--lux-intent-active-text);
904
+ @supports (color: color-mix(in lab, red, red)) {
905
+ background-color: color-mix(in oklab, var(--lux-intent-active-text) 10%, transparent);
906
+ }
907
+ }
908
+ .bg-\[var\(--lux-intent-error-border\)\]\/10 {
909
+ background-color: var(--lux-intent-error-border);
910
+ @supports (color: color-mix(in lab, red, red)) {
911
+ background-color: color-mix(in oklab, var(--lux-intent-error-border) 10%, transparent);
912
+ }
913
+ }
914
+ .bg-\[var\(--lux-intent-success-border\)\]\/10 {
915
+ background-color: var(--lux-intent-success-border);
916
+ @supports (color: color-mix(in lab, red, red)) {
917
+ background-color: color-mix(in oklab, var(--lux-intent-success-border) 10%, transparent);
918
+ }
919
+ }
920
+ .bg-\[var\(--lux-intent-warning-border\)\]\/10 {
921
+ background-color: var(--lux-intent-warning-border);
922
+ @supports (color: color-mix(in lab, red, red)) {
923
+ background-color: color-mix(in oklab, var(--lux-intent-warning-border) 10%, transparent);
924
+ }
925
+ }
926
+ .bg-\[var\(--ui-color-bg\)\] {
927
+ background-color: var(--ui-color-bg);
928
+ }
929
+ .bg-black {
930
+ background-color: var(--color-black);
931
+ }
932
+ .bg-black\/50 {
933
+ background-color: color-mix(in srgb, #000 50%, transparent);
934
+ @supports (color: color-mix(in lab, red, red)) {
935
+ background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
936
+ }
937
+ }
938
+ .bg-transparent {
939
+ background-color: transparent;
940
+ }
941
+ .bg-white {
942
+ background-color: var(--color-white);
943
+ }
944
+ .p-0 {
945
+ padding: calc(var(--spacing) * 0);
946
+ }
947
+ .p-1 {
948
+ padding: calc(var(--spacing) * 1);
949
+ }
950
+ .p-1\.5 {
951
+ padding: calc(var(--spacing) * 1.5);
952
+ }
953
+ .p-4 {
954
+ padding: calc(var(--spacing) * 4);
955
+ }
956
+ .p-6 {
957
+ padding: calc(var(--spacing) * 6);
958
+ }
959
+ .px-0 {
960
+ padding-inline: calc(var(--spacing) * 0);
961
+ }
962
+ .px-2 {
963
+ padding-inline: calc(var(--spacing) * 2);
964
+ }
965
+ .px-2\.5 {
966
+ padding-inline: calc(var(--spacing) * 2.5);
967
+ }
968
+ .px-3 {
969
+ padding-inline: calc(var(--spacing) * 3);
970
+ }
971
+ .px-4 {
972
+ padding-inline: calc(var(--spacing) * 4);
973
+ }
974
+ .px-6 {
975
+ padding-inline: calc(var(--spacing) * 6);
976
+ }
977
+ .px-\[6px\] {
978
+ padding-inline: 6px;
979
+ }
980
+ .\!py-0 {
981
+ padding-block: calc(var(--spacing) * 0) !important;
982
+ }
983
+ .py-0\.5 {
984
+ padding-block: calc(var(--spacing) * 0.5);
985
+ }
986
+ .py-1 {
987
+ padding-block: calc(var(--spacing) * 1);
988
+ }
989
+ .py-1\.5 {
990
+ padding-block: calc(var(--spacing) * 1.5);
991
+ }
992
+ .py-2 {
993
+ padding-block: calc(var(--spacing) * 2);
994
+ }
995
+ .py-4 {
996
+ padding-block: calc(var(--spacing) * 4);
997
+ }
998
+ .py-6 {
999
+ padding-block: calc(var(--spacing) * 6);
1000
+ }
1001
+ .pt-0 {
1002
+ padding-top: calc(var(--spacing) * 0);
1003
+ }
1004
+ .pt-2 {
1005
+ padding-top: calc(var(--spacing) * 2);
1006
+ }
1007
+ .\!pr-0 {
1008
+ padding-right: calc(var(--spacing) * 0) !important;
1009
+ }
1010
+ .pr-2 {
1011
+ padding-right: calc(var(--spacing) * 2);
1012
+ }
1013
+ .pr-8 {
1014
+ padding-right: calc(var(--spacing) * 8);
1015
+ }
1016
+ .pb-4 {
1017
+ padding-bottom: calc(var(--spacing) * 4);
1018
+ }
1019
+ .pl-8 {
1020
+ padding-left: calc(var(--spacing) * 8);
1021
+ }
1022
+ .text-center {
1023
+ text-align: center;
1024
+ }
1025
+ .text-left {
1026
+ text-align: left;
1027
+ }
1028
+ .text-right {
1029
+ text-align: right;
1030
+ }
1031
+ .font-mono {
1032
+ font-family: var(--font-mono);
1033
+ }
1034
+ .font-sans {
1035
+ font-family: var(--font-sans);
1036
+ }
1037
+ .text-2xl {
1038
+ font-size: var(--text-2xl);
1039
+ line-height: var(--tw-leading, var(--text-2xl--line-height));
1040
+ }
1041
+ .text-3xl {
1042
+ font-size: var(--text-3xl);
1043
+ line-height: var(--tw-leading, var(--text-3xl--line-height));
1044
+ }
1045
+ .text-base {
1046
+ font-size: var(--text-base);
1047
+ line-height: var(--tw-leading, var(--text-base--line-height));
1048
+ }
1049
+ .text-lg {
1050
+ font-size: var(--text-lg);
1051
+ line-height: var(--tw-leading, var(--text-lg--line-height));
1052
+ }
1053
+ .text-sm {
1054
+ font-size: var(--text-sm);
1055
+ line-height: var(--tw-leading, var(--text-sm--line-height));
1056
+ }
1057
+ .text-xl {
1058
+ font-size: var(--text-xl);
1059
+ line-height: var(--tw-leading, var(--text-xl--line-height));
1060
+ }
1061
+ .text-xs {
1062
+ font-size: var(--text-xs);
1063
+ line-height: var(--tw-leading, var(--text-xs--line-height));
1064
+ }
1065
+ .text-\[10px\] {
1066
+ font-size: 10px;
1067
+ }
1068
+ .text-\[18px\] {
1069
+ font-size: 18px;
1070
+ }
1071
+ .leading-4 {
1072
+ --tw-leading: calc(var(--spacing) * 4);
1073
+ line-height: calc(var(--spacing) * 4);
1074
+ }
1075
+ .leading-5 {
1076
+ --tw-leading: calc(var(--spacing) * 5);
1077
+ line-height: calc(var(--spacing) * 5);
1078
+ }
1079
+ .leading-6 {
1080
+ --tw-leading: calc(var(--spacing) * 6);
1081
+ line-height: calc(var(--spacing) * 6);
1082
+ }
1083
+ .leading-7 {
1084
+ --tw-leading: calc(var(--spacing) * 7);
1085
+ line-height: calc(var(--spacing) * 7);
1086
+ }
1087
+ .leading-none {
1088
+ --tw-leading: 1;
1089
+ line-height: 1;
1090
+ }
1091
+ .leading-tight {
1092
+ --tw-leading: var(--leading-tight);
1093
+ line-height: var(--leading-tight);
1094
+ }
1095
+ .font-bold {
1096
+ --tw-font-weight: var(--font-weight-bold);
1097
+ font-weight: var(--font-weight-bold);
1098
+ }
1099
+ .font-light {
1100
+ --tw-font-weight: var(--font-weight-light);
1101
+ font-weight: var(--font-weight-light);
1102
+ }
1103
+ .font-medium {
1104
+ --tw-font-weight: var(--font-weight-medium);
1105
+ font-weight: var(--font-weight-medium);
1106
+ }
1107
+ .font-normal {
1108
+ --tw-font-weight: var(--font-weight-normal);
1109
+ font-weight: var(--font-weight-normal);
1110
+ }
1111
+ .font-semibold {
1112
+ --tw-font-weight: var(--font-weight-semibold);
1113
+ font-weight: var(--font-weight-semibold);
1114
+ }
1115
+ .tracking-tight {
1116
+ --tw-tracking: var(--tracking-tight);
1117
+ letter-spacing: var(--tracking-tight);
1118
+ }
1119
+ .break-words {
1120
+ overflow-wrap: break-word;
1121
+ }
1122
+ .break-all {
1123
+ word-break: break-all;
1124
+ }
1125
+ .text-ellipsis {
1126
+ text-overflow: ellipsis;
1127
+ }
1128
+ .whitespace-nowrap {
1129
+ white-space: nowrap;
1130
+ }
1131
+ .whitespace-pre-wrap {
1132
+ white-space: pre-wrap;
1133
+ }
1134
+ .text-\[var\(--lux-intent-active-text\)\] {
1135
+ color: var(--lux-intent-active-text);
1136
+ }
1137
+ .text-\[var\(--lux-intent-error-border\)\] {
1138
+ color: var(--lux-intent-error-border);
1139
+ }
1140
+ .text-\[var\(--lux-intent-success-border\)\] {
1141
+ color: var(--lux-intent-success-border);
1142
+ }
1143
+ .text-\[var\(--lux-intent-warning-border\)\] {
1144
+ color: var(--lux-intent-warning-border);
1145
+ }
1146
+ .text-\[var\(--ui-color-text\)\] {
1147
+ color: var(--ui-color-text);
1148
+ }
1149
+ .text-black {
1150
+ color: var(--color-black);
1151
+ }
1152
+ .text-inherit {
1153
+ color: inherit;
1154
+ }
1155
+ .text-white {
1156
+ color: var(--color-white);
1157
+ }
1158
+ .italic {
1159
+ font-style: italic;
1160
+ }
1161
+ .underline {
1162
+ text-decoration-line: underline;
1163
+ }
1164
+ .opacity-0 {
1165
+ opacity: 0%;
1166
+ }
1167
+ .opacity-50 {
1168
+ opacity: 50%;
1169
+ }
1170
+ .opacity-60 {
1171
+ opacity: 60%;
1172
+ }
1173
+ .opacity-90 {
1174
+ opacity: 90%;
1175
+ }
1176
+ .shadow-\[0_1px_2px_rgba\(0\,0\,0\,0\.12\)\] {
1177
+ --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.12));
1178
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1179
+ }
1180
+ .shadow-lg {
1181
+ --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));
1182
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1183
+ }
1184
+ .shadow-md {
1185
+ --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1186
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1187
+ }
1188
+ .shadow-sm {
1189
+ --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));
1190
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1191
+ }
1192
+ .ring-0 {
1193
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1194
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1195
+ }
1196
+ .outline {
1197
+ outline-style: var(--tw-outline-style);
1198
+ outline-width: 1px;
1199
+ }
1200
+ .backdrop-blur-sm {
1201
+ --tw-backdrop-blur: blur(var(--blur-sm));
1202
+ -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,);
1203
+ 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,);
1204
+ }
1205
+ .transition-all {
1206
+ transition-property: all;
1207
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1208
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1209
+ }
1210
+ .transition-colors {
1211
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
1212
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1213
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1214
+ }
1215
+ .transition-opacity {
1216
+ transition-property: opacity;
1217
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1218
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1219
+ }
1220
+ .transition-shadow {
1221
+ transition-property: box-shadow;
1222
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1223
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1224
+ }
1225
+ .transition-transform {
1226
+ transition-property: transform, translate, scale, rotate;
1227
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1228
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
1229
+ }
1230
+ .duration-150 {
1231
+ --tw-duration: 150ms;
1232
+ transition-duration: 150ms;
1233
+ }
1234
+ .duration-200 {
1235
+ --tw-duration: 200ms;
1236
+ transition-duration: 200ms;
1237
+ }
1238
+ .duration-300 {
1239
+ --tw-duration: 300ms;
1240
+ transition-duration: 300ms;
1241
+ }
1242
+ .ease-out {
1243
+ --tw-ease: var(--ease-out);
1244
+ transition-timing-function: var(--ease-out);
1245
+ }
1246
+ .outline-none {
1247
+ --tw-outline-style: none;
1248
+ outline-style: none;
1249
+ }
1250
+ .select-none {
1251
+ -webkit-user-select: none;
1252
+ user-select: none;
1253
+ }
1254
+ .group-focus-within\:opacity-100 {
1255
+ &:is(:where(.group):focus-within *) {
1256
+ opacity: 100%;
1257
+ }
1258
+ }
1259
+ .group-hover\:opacity-100 {
1260
+ &:is(:where(.group):hover *) {
1261
+ @media (hover: hover) {
1262
+ opacity: 100%;
1263
+ }
1264
+ }
1265
+ }
1266
+ .hover\:border-\[var\(--ui-color-border-hover\)\] {
1267
+ &:hover {
1268
+ @media (hover: hover) {
1269
+ border-color: var(--ui-color-border-hover);
1270
+ }
1271
+ }
1272
+ }
1273
+ .hover\:bg-\[var\(--ui-color-bg-hover\)\] {
1274
+ &:hover {
1275
+ @media (hover: hover) {
1276
+ background-color: var(--ui-color-bg-hover);
1277
+ }
1278
+ }
1279
+ }
1280
+ .hover\:text-\[var\(--ui-color-text-hover\)\] {
1281
+ &:hover {
1282
+ @media (hover: hover) {
1283
+ color: var(--ui-color-text-hover);
1284
+ }
1285
+ }
1286
+ }
1287
+ .hover\:underline {
1288
+ &:hover {
1289
+ @media (hover: hover) {
1290
+ text-decoration-line: underline;
1291
+ }
1292
+ }
1293
+ }
1294
+ .hover\:opacity-100 {
1295
+ &:hover {
1296
+ @media (hover: hover) {
1297
+ opacity: 100%;
1298
+ }
1299
+ }
1300
+ }
1301
+ .hover\:shadow-\[0_10px_24px_rgba\(0\,0\,0\,0\.22\)\] {
1302
+ &:hover {
1303
+ @media (hover: hover) {
1304
+ --tw-shadow: 0 10px 24px var(--tw-shadow-color, rgba(0,0,0,0.22));
1305
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1306
+ }
1307
+ }
1308
+ }
1309
+ .hover\:ring-4 {
1310
+ &:hover {
1311
+ @media (hover: hover) {
1312
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1313
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1314
+ }
1315
+ }
1316
+ }
1317
+ .focus\:ring-2 {
1318
+ &:focus {
1319
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1320
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1321
+ }
1322
+ }
1323
+ .focus\:ring-offset-2 {
1324
+ &:focus {
1325
+ --tw-ring-offset-width: 2px;
1326
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1327
+ }
1328
+ }
1329
+ .focus\:outline-none {
1330
+ &:focus {
1331
+ --tw-outline-style: none;
1332
+ outline-style: none;
1333
+ }
1334
+ }
1335
+ .focus-visible\:\!ring-0 {
1336
+ &:focus-visible {
1337
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor) !important;
1338
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
1339
+ }
1340
+ }
1341
+ .focus-visible\:ring-2 {
1342
+ &:focus-visible {
1343
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1344
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1345
+ }
1346
+ }
1347
+ .focus-visible\:\!ring-offset-0 {
1348
+ &:focus-visible {
1349
+ --tw-ring-offset-width: 0px !important;
1350
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
1351
+ }
1352
+ }
1353
+ .focus-visible\:ring-offset-2 {
1354
+ &:focus-visible {
1355
+ --tw-ring-offset-width: 2px;
1356
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1357
+ }
1358
+ }
1359
+ .focus-visible\:outline-none {
1360
+ &:focus-visible {
1361
+ --tw-outline-style: none;
1362
+ outline-style: none;
1363
+ }
1364
+ }
1365
+ .disabled\:pointer-events-none {
1366
+ &:disabled {
1367
+ pointer-events: none;
1368
+ }
1369
+ }
1370
+ .disabled\:cursor-default {
1371
+ &:disabled {
1372
+ cursor: default;
1373
+ }
1374
+ }
1375
+ .disabled\:cursor-not-allowed {
1376
+ &:disabled {
1377
+ cursor: not-allowed;
1378
+ }
1379
+ }
1380
+ .disabled\:opacity-50 {
1381
+ &:disabled {
1382
+ opacity: 50%;
1383
+ }
1384
+ }
1385
+ .data-\[disabled\]\:pointer-events-none {
1386
+ &[data-disabled] {
1387
+ pointer-events: none;
1388
+ }
1389
+ }
1390
+ .data-\[disabled\]\:opacity-50 {
1391
+ &[data-disabled] {
1392
+ opacity: 50%;
1393
+ }
1394
+ }
1395
+ .data-\[state\=active\]\:shadow-sm {
1396
+ &[data-state="active"] {
1397
+ --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));
1398
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1399
+ }
1400
+ }
1401
+ .data-\[state\=checked\]\:translate-x-5 {
1402
+ &[data-state="checked"] {
1403
+ --tw-translate-x: calc(var(--spacing) * 5);
1404
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1405
+ }
1406
+ }
1407
+ .data-\[state\=inactive\]\:hidden {
1408
+ &[data-state="inactive"] {
1409
+ display: none;
1410
+ }
1411
+ }
1412
+ .data-\[state\=unchecked\]\:translate-x-0 {
1413
+ &[data-state="unchecked"] {
1414
+ --tw-translate-x: calc(var(--spacing) * 0);
1415
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1416
+ }
1417
+ }
1418
+ .sm\:max-w-\[420px\] {
1419
+ @media (width >= 40rem) {
1420
+ max-width: 420px;
1421
+ }
1422
+ }
1423
+ .sm\:flex-row {
1424
+ @media (width >= 40rem) {
1425
+ flex-direction: row;
1426
+ }
1427
+ }
1428
+ .sm\:justify-end {
1429
+ @media (width >= 40rem) {
1430
+ justify-content: flex-end;
1431
+ }
1432
+ }
1433
+ .\[\&\>svg\]\:absolute {
1434
+ &>svg {
1435
+ position: absolute;
1436
+ }
1437
+ }
1438
+ .\[\&\>svg\]\:top-4 {
1439
+ &>svg {
1440
+ top: calc(var(--spacing) * 4);
1441
+ }
1442
+ }
1443
+ .\[\&\>svg\]\:left-4 {
1444
+ &>svg {
1445
+ left: calc(var(--spacing) * 4);
1446
+ }
1447
+ }
1448
+ .\[\&\>svg\]\:text-current {
1449
+ &>svg {
1450
+ color: currentcolor;
1451
+ }
1452
+ }
1453
+ .\[\&\>svg\~\*\]\:pl-7 {
1454
+ &>svg~* {
1455
+ padding-left: calc(var(--spacing) * 7);
1456
+ }
1457
+ }
1458
+ .\[\&\[data-state\=open\]\>svg\]\:rotate-180 {
1459
+ &[data-state=open]>svg {
1460
+ rotate: 180deg;
1461
+ }
1462
+ }
1463
+ }
1464
+ @property --tw-translate-x {
1465
+ syntax: "*";
1466
+ inherits: false;
1467
+ initial-value: 0;
1468
+ }
1469
+ @property --tw-translate-y {
1470
+ syntax: "*";
1471
+ inherits: false;
1472
+ initial-value: 0;
1473
+ }
1474
+ @property --tw-translate-z {
1475
+ syntax: "*";
1476
+ inherits: false;
1477
+ initial-value: 0;
1478
+ }
1479
+ @property --tw-rotate-x {
1480
+ syntax: "*";
1481
+ inherits: false;
1482
+ }
1483
+ @property --tw-rotate-y {
1484
+ syntax: "*";
1485
+ inherits: false;
1486
+ }
1487
+ @property --tw-rotate-z {
1488
+ syntax: "*";
1489
+ inherits: false;
1490
+ }
1491
+ @property --tw-skew-x {
1492
+ syntax: "*";
1493
+ inherits: false;
1494
+ }
1495
+ @property --tw-skew-y {
1496
+ syntax: "*";
1497
+ inherits: false;
1498
+ }
1499
+ @property --tw-space-y-reverse {
1500
+ syntax: "*";
1501
+ inherits: false;
1502
+ initial-value: 0;
1503
+ }
1504
+ @property --tw-border-style {
1505
+ syntax: "*";
1506
+ inherits: false;
1507
+ initial-value: solid;
1508
+ }
1509
+ @property --tw-leading {
1510
+ syntax: "*";
1511
+ inherits: false;
1512
+ }
1513
+ @property --tw-font-weight {
1514
+ syntax: "*";
1515
+ inherits: false;
1516
+ }
1517
+ @property --tw-tracking {
1518
+ syntax: "*";
1519
+ inherits: false;
1520
+ }
1521
+ @property --tw-shadow {
1522
+ syntax: "*";
1523
+ inherits: false;
1524
+ initial-value: 0 0 #0000;
1525
+ }
1526
+ @property --tw-shadow-color {
1527
+ syntax: "*";
1528
+ inherits: false;
1529
+ }
1530
+ @property --tw-shadow-alpha {
1531
+ syntax: "<percentage>";
1532
+ inherits: false;
1533
+ initial-value: 100%;
1534
+ }
1535
+ @property --tw-inset-shadow {
1536
+ syntax: "*";
1537
+ inherits: false;
1538
+ initial-value: 0 0 #0000;
1539
+ }
1540
+ @property --tw-inset-shadow-color {
1541
+ syntax: "*";
1542
+ inherits: false;
1543
+ }
1544
+ @property --tw-inset-shadow-alpha {
1545
+ syntax: "<percentage>";
1546
+ inherits: false;
1547
+ initial-value: 100%;
1548
+ }
1549
+ @property --tw-ring-color {
1550
+ syntax: "*";
1551
+ inherits: false;
1552
+ }
1553
+ @property --tw-ring-shadow {
1554
+ syntax: "*";
1555
+ inherits: false;
1556
+ initial-value: 0 0 #0000;
1557
+ }
1558
+ @property --tw-inset-ring-color {
1559
+ syntax: "*";
1560
+ inherits: false;
1561
+ }
1562
+ @property --tw-inset-ring-shadow {
1563
+ syntax: "*";
1564
+ inherits: false;
1565
+ initial-value: 0 0 #0000;
1566
+ }
1567
+ @property --tw-ring-inset {
1568
+ syntax: "*";
1569
+ inherits: false;
1570
+ }
1571
+ @property --tw-ring-offset-width {
1572
+ syntax: "<length>";
1573
+ inherits: false;
1574
+ initial-value: 0px;
1575
+ }
1576
+ @property --tw-ring-offset-color {
1577
+ syntax: "*";
1578
+ inherits: false;
1579
+ initial-value: #fff;
1580
+ }
1581
+ @property --tw-ring-offset-shadow {
1582
+ syntax: "*";
1583
+ inherits: false;
1584
+ initial-value: 0 0 #0000;
1585
+ }
1586
+ @property --tw-outline-style {
1587
+ syntax: "*";
1588
+ inherits: false;
1589
+ initial-value: solid;
1590
+ }
1591
+ @property --tw-backdrop-blur {
1592
+ syntax: "*";
1593
+ inherits: false;
1594
+ }
1595
+ @property --tw-backdrop-brightness {
1596
+ syntax: "*";
1597
+ inherits: false;
1598
+ }
1599
+ @property --tw-backdrop-contrast {
1600
+ syntax: "*";
1601
+ inherits: false;
1602
+ }
1603
+ @property --tw-backdrop-grayscale {
1604
+ syntax: "*";
1605
+ inherits: false;
1606
+ }
1607
+ @property --tw-backdrop-hue-rotate {
1608
+ syntax: "*";
1609
+ inherits: false;
1610
+ }
1611
+ @property --tw-backdrop-invert {
1612
+ syntax: "*";
1613
+ inherits: false;
1614
+ }
1615
+ @property --tw-backdrop-opacity {
1616
+ syntax: "*";
1617
+ inherits: false;
1618
+ }
1619
+ @property --tw-backdrop-saturate {
1620
+ syntax: "*";
1621
+ inherits: false;
1622
+ }
1623
+ @property --tw-backdrop-sepia {
1624
+ syntax: "*";
1625
+ inherits: false;
1626
+ }
1627
+ @property --tw-duration {
1628
+ syntax: "*";
1629
+ inherits: false;
1630
+ }
1631
+ @property --tw-ease {
1632
+ syntax: "*";
1633
+ inherits: false;
1634
+ }
1635
+ @keyframes spin {
1636
+ to {
1637
+ transform: rotate(360deg);
1638
+ }
1639
+ }
1640
+ @keyframes pulse {
1641
+ 50% {
1642
+ opacity: 0.5;
1643
+ }
1644
+ }
1645
+ @layer properties {
1646
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
1647
+ *, ::before, ::after, ::backdrop {
1648
+ --tw-translate-x: 0;
1649
+ --tw-translate-y: 0;
1650
+ --tw-translate-z: 0;
1651
+ --tw-rotate-x: initial;
1652
+ --tw-rotate-y: initial;
1653
+ --tw-rotate-z: initial;
1654
+ --tw-skew-x: initial;
1655
+ --tw-skew-y: initial;
1656
+ --tw-space-y-reverse: 0;
1657
+ --tw-border-style: solid;
1658
+ --tw-leading: initial;
1659
+ --tw-font-weight: initial;
1660
+ --tw-tracking: initial;
1661
+ --tw-shadow: 0 0 #0000;
1662
+ --tw-shadow-color: initial;
1663
+ --tw-shadow-alpha: 100%;
1664
+ --tw-inset-shadow: 0 0 #0000;
1665
+ --tw-inset-shadow-color: initial;
1666
+ --tw-inset-shadow-alpha: 100%;
1667
+ --tw-ring-color: initial;
1668
+ --tw-ring-shadow: 0 0 #0000;
1669
+ --tw-inset-ring-color: initial;
1670
+ --tw-inset-ring-shadow: 0 0 #0000;
1671
+ --tw-ring-inset: initial;
1672
+ --tw-ring-offset-width: 0px;
1673
+ --tw-ring-offset-color: #fff;
1674
+ --tw-ring-offset-shadow: 0 0 #0000;
1675
+ --tw-outline-style: solid;
1676
+ --tw-backdrop-blur: initial;
1677
+ --tw-backdrop-brightness: initial;
1678
+ --tw-backdrop-contrast: initial;
1679
+ --tw-backdrop-grayscale: initial;
1680
+ --tw-backdrop-hue-rotate: initial;
1681
+ --tw-backdrop-invert: initial;
1682
+ --tw-backdrop-opacity: initial;
1683
+ --tw-backdrop-saturate: initial;
1684
+ --tw-backdrop-sepia: initial;
1685
+ --tw-duration: initial;
1686
+ --tw-ease: initial;
1687
+ }
1688
+ }
1689
+ }