najm-kit 0.0.7 → 0.0.9

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/styles.css CHANGED
@@ -1,3 +1,674 @@
1
+ /* overlayscrollbars */
2
+ /*!
3
+ * OverlayScrollbars
4
+ * Version: 2.16.0
5
+ *
6
+ * Copyright (c) Rene Haas | KingSora.
7
+ * https://github.com/KingSora
8
+ *
9
+ * Released under the MIT license.
10
+ */
11
+ .os-size-observer,
12
+ .os-size-observer-listener {
13
+ scroll-behavior: auto !important;
14
+ direction: inherit;
15
+ pointer-events: none;
16
+ overflow: hidden;
17
+ visibility: hidden;
18
+ box-sizing: border-box;
19
+ }
20
+
21
+ .os-size-observer,
22
+ .os-size-observer-listener,
23
+ .os-size-observer-listener-item,
24
+ .os-size-observer-listener-item-final {
25
+ writing-mode: horizontal-tb;
26
+ position: absolute;
27
+ left: 0;
28
+ top: 0;
29
+ }
30
+
31
+ .os-size-observer {
32
+ z-index: -1;
33
+ contain: strict;
34
+ display: flex;
35
+ flex-direction: row;
36
+ flex-wrap: nowrap;
37
+ padding: inherit;
38
+ border: inherit;
39
+ box-sizing: inherit;
40
+ margin: -133px;
41
+ top: 0;
42
+ right: 0;
43
+ bottom: 0;
44
+ left: 0;
45
+ transform: scale(0.1);
46
+ }
47
+ .os-size-observer::before {
48
+ content: "";
49
+ flex: none;
50
+ box-sizing: inherit;
51
+ padding: 10px;
52
+ width: 10px;
53
+ height: 10px;
54
+ }
55
+
56
+ .os-size-observer-appear {
57
+ animation: os-size-observer-appear-animation 1ms forwards;
58
+ }
59
+
60
+ .os-size-observer-listener {
61
+ box-sizing: border-box;
62
+ position: relative;
63
+ flex: auto;
64
+ padding: inherit;
65
+ border: inherit;
66
+ margin: -133px;
67
+ transform: scale(calc(1 / 0.1));
68
+ }
69
+ .os-size-observer-listener.ltr {
70
+ margin-right: -266px;
71
+ margin-left: 0;
72
+ }
73
+ .os-size-observer-listener.rtl {
74
+ margin-left: -266px;
75
+ margin-right: 0;
76
+ }
77
+ .os-size-observer-listener:empty::before {
78
+ content: "";
79
+ width: 100%;
80
+ height: 100%;
81
+ }
82
+ .os-size-observer-listener:empty::before, .os-size-observer-listener > .os-size-observer-listener-item {
83
+ display: block;
84
+ position: relative;
85
+ padding: inherit;
86
+ border: inherit;
87
+ box-sizing: content-box;
88
+ flex: auto;
89
+ }
90
+
91
+ .os-size-observer-listener-scroll {
92
+ box-sizing: border-box;
93
+ display: flex;
94
+ }
95
+
96
+ .os-size-observer-listener-item {
97
+ right: 0;
98
+ bottom: 0;
99
+ overflow: hidden;
100
+ direction: ltr;
101
+ flex: none;
102
+ }
103
+
104
+ .os-size-observer-listener-item-final {
105
+ transition: none;
106
+ }
107
+
108
+ @keyframes os-size-observer-appear-animation {
109
+ from {
110
+ cursor: auto;
111
+ }
112
+ to {
113
+ cursor: none;
114
+ }
115
+ }
116
+ .os-trinsic-observer {
117
+ flex: none;
118
+ box-sizing: border-box;
119
+ position: relative;
120
+ max-width: 0px;
121
+ max-height: 1px;
122
+ padding: 0;
123
+ margin: 0;
124
+ border: none;
125
+ overflow: hidden;
126
+ z-index: -1;
127
+ height: 0;
128
+ top: calc(100% + 1px);
129
+ contain: strict;
130
+ }
131
+ .os-trinsic-observer:not(:empty) {
132
+ height: calc(100% + 1px);
133
+ top: -1px;
134
+ }
135
+ .os-trinsic-observer:not(:empty) > .os-size-observer {
136
+ width: 1000%;
137
+ height: 1000%;
138
+ min-height: 1px;
139
+ min-width: 1px;
140
+ }
141
+
142
+ /**
143
+ * hide native scrollbars
144
+ * changes to this styles need to be reflected in the environment styles to correctly detect scrollbar hiding
145
+ */
146
+ /**
147
+ * body element
148
+ */
149
+ html[data-overlayscrollbars-body] {
150
+ overflow: hidden;
151
+ }
152
+
153
+ html[data-overlayscrollbars-body],
154
+ html[data-overlayscrollbars-body] > body {
155
+ width: 100%;
156
+ height: 100%;
157
+ margin: 0;
158
+ }
159
+
160
+ html[data-overlayscrollbars-body] > body {
161
+ overflow: visible;
162
+ margin: 0;
163
+ }
164
+
165
+ /**
166
+ * structure setup
167
+ */
168
+ [data-overlayscrollbars] {
169
+ position: relative;
170
+ }
171
+
172
+ [data-overlayscrollbars~=host],
173
+ [data-overlayscrollbars-padding] {
174
+ display: flex;
175
+ align-items: stretch !important;
176
+ flex-direction: row !important;
177
+ flex-wrap: nowrap !important;
178
+ scroll-behavior: auto !important;
179
+ }
180
+
181
+ [data-overlayscrollbars-padding],
182
+ [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
183
+ box-sizing: inherit;
184
+ position: relative;
185
+ flex: auto;
186
+ height: auto;
187
+ width: 100%;
188
+ min-width: 0;
189
+ padding: 0;
190
+ margin: 0;
191
+ border: none;
192
+ z-index: 0;
193
+ }
194
+
195
+ [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
196
+ --os-vaw: 0;
197
+ --os-vah: 0;
198
+ outline: none;
199
+ }
200
+ [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]):focus {
201
+ outline: none;
202
+ }
203
+ [data-overlayscrollbars-viewport][data-overlayscrollbars-viewport~=arrange]::before {
204
+ content: "";
205
+ position: absolute;
206
+ pointer-events: none;
207
+ z-index: -1;
208
+ min-width: 1px;
209
+ min-height: 1px;
210
+ width: var(--os-vaw);
211
+ height: var(--os-vah);
212
+ }
213
+
214
+ /**
215
+ * wrapper elements overflow:
216
+ */
217
+ [data-overlayscrollbars~=host],
218
+ [data-overlayscrollbars-padding] {
219
+ overflow: hidden !important;
220
+ }
221
+
222
+ [data-overlayscrollbars~=host][data-overlayscrollbars~=noClipping],
223
+ [data-overlayscrollbars-padding~=noClipping] {
224
+ overflow: visible !important;
225
+ }
226
+
227
+ /**
228
+ * viewport overflow:
229
+ */
230
+ [data-overlayscrollbars-viewport] {
231
+ --os-viewport-overflow-x: hidden;
232
+ --os-viewport-overflow-y: hidden;
233
+ overflow-x: var(--os-viewport-overflow-x);
234
+ overflow-y: var(--os-viewport-overflow-y);
235
+ }
236
+
237
+ [data-overlayscrollbars-viewport~=overflowXVisible] {
238
+ --os-viewport-overflow-x: visible;
239
+ }
240
+
241
+ [data-overlayscrollbars-viewport~=overflowXHidden] {
242
+ --os-viewport-overflow-x: hidden;
243
+ }
244
+
245
+ [data-overlayscrollbars-viewport~=overflowXScroll] {
246
+ --os-viewport-overflow-x: scroll;
247
+ }
248
+
249
+ [data-overlayscrollbars-viewport~=overflowYVisible] {
250
+ --os-viewport-overflow-y: visible;
251
+ }
252
+
253
+ [data-overlayscrollbars-viewport~=overflowYHidden] {
254
+ --os-viewport-overflow-y: hidden;
255
+ }
256
+
257
+ [data-overlayscrollbars-viewport~=overflowYScroll] {
258
+ --os-viewport-overflow-y: scroll;
259
+ }
260
+
261
+ [data-overlayscrollbars-viewport~=overflowImportant] {
262
+ overflow-x: var(--os-viewport-overflow-x) !important;
263
+ overflow-y: var(--os-viewport-overflow-y) !important;
264
+ }
265
+
266
+ /**
267
+ * viewport state modifiers:
268
+ */
269
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) {
270
+ font-size: 0 !important;
271
+ line-height: 0 !important;
272
+ }
273
+
274
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::before,
275
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::after,
276
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) > *:not(#osFakeId) {
277
+ display: none !important;
278
+ position: absolute !important;
279
+ width: 1px !important;
280
+ height: 1px !important;
281
+ padding: 0 !important;
282
+ margin: -1px !important;
283
+ overflow: hidden !important;
284
+ clip: rect(0, 0, 0, 0) !important;
285
+ white-space: nowrap !important;
286
+ border-width: 0 !important;
287
+ }
288
+
289
+ [data-overlayscrollbars-viewport~=measuring],
290
+ [data-overlayscrollbars-viewport~=scrolling] {
291
+ scroll-behavior: auto !important;
292
+ scroll-snap-type: none !important;
293
+ }
294
+
295
+ [data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowXVisible] {
296
+ overflow-x: hidden !important;
297
+ }
298
+
299
+ [data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowYVisible] {
300
+ overflow-y: hidden !important;
301
+ }
302
+
303
+ /**
304
+ * content element:
305
+ */
306
+ [data-overlayscrollbars-content] {
307
+ box-sizing: inherit;
308
+ }
309
+
310
+ /**
311
+ * Display contents to bridge any flickering during deferred initialization.
312
+ */
313
+ [data-overlayscrollbars-contents]:not(#osFakeId):not([data-overlayscrollbars-padding]):not([data-overlayscrollbars-viewport]):not([data-overlayscrollbars-content]) {
314
+ display: contents;
315
+ }
316
+
317
+ /**
318
+ * optional & experimental grid mode
319
+ */
320
+ [data-overlayscrollbars-grid],
321
+ [data-overlayscrollbars-grid] [data-overlayscrollbars-padding] {
322
+ display: grid;
323
+ grid-template: 1fr/1fr;
324
+ }
325
+
326
+ [data-overlayscrollbars-grid] > [data-overlayscrollbars-padding],
327
+ [data-overlayscrollbars-grid] > [data-overlayscrollbars-viewport],
328
+ [data-overlayscrollbars-grid] > [data-overlayscrollbars-padding] > [data-overlayscrollbars-viewport] {
329
+ height: auto !important;
330
+ width: auto !important;
331
+ }
332
+
333
+ @property --os-scroll-percent {
334
+ syntax: "<number>";
335
+ inherits: true;
336
+ initial-value: 0;
337
+ }
338
+ @property --os-viewport-percent {
339
+ syntax: "<number>";
340
+ inherits: true;
341
+ initial-value: 0;
342
+ }
343
+ .os-scrollbar {
344
+ --os-viewport-percent: 0;
345
+ --os-scroll-percent: 0;
346
+ --os-scroll-direction: 0;
347
+ --os-scroll-percent-directional: calc(
348
+ var(--os-scroll-percent) - (var(--os-scroll-percent) + (1 - var(--os-scroll-percent)) * -1) *
349
+ var(--os-scroll-direction)
350
+ );
351
+ }
352
+
353
+ .os-scrollbar {
354
+ contain: size layout;
355
+ contain: size layout style;
356
+ transition: opacity 0.15s, visibility 0.15s, top 0.15s, right 0.15s, bottom 0.15s, left 0.15s;
357
+ pointer-events: none;
358
+ position: absolute;
359
+ opacity: 0;
360
+ visibility: hidden;
361
+ }
362
+
363
+ body > .os-scrollbar {
364
+ position: fixed;
365
+ z-index: 99999;
366
+ }
367
+
368
+ .os-scrollbar-transitionless {
369
+ transition: none !important;
370
+ }
371
+
372
+ .os-scrollbar-track {
373
+ position: relative;
374
+ padding: 0 !important;
375
+ border: none !important;
376
+ }
377
+
378
+ .os-scrollbar-handle {
379
+ position: absolute;
380
+ }
381
+
382
+ .os-scrollbar-track,
383
+ .os-scrollbar-handle {
384
+ pointer-events: none;
385
+ width: 100%;
386
+ height: 100%;
387
+ }
388
+
389
+ .os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track,
390
+ .os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle {
391
+ pointer-events: auto;
392
+ touch-action: none;
393
+ }
394
+
395
+ .os-scrollbar-horizontal {
396
+ bottom: 0;
397
+ left: 0;
398
+ }
399
+
400
+ .os-scrollbar-vertical {
401
+ top: 0;
402
+ right: 0;
403
+ }
404
+
405
+ .os-scrollbar-rtl.os-scrollbar-horizontal {
406
+ right: 0;
407
+ }
408
+
409
+ .os-scrollbar-rtl.os-scrollbar-vertical {
410
+ right: auto;
411
+ left: 0;
412
+ }
413
+
414
+ .os-scrollbar-visible {
415
+ opacity: 1;
416
+ visibility: visible;
417
+ }
418
+
419
+ .os-scrollbar-auto-hide.os-scrollbar-auto-hide-hidden {
420
+ opacity: 0;
421
+ visibility: hidden;
422
+ }
423
+
424
+ .os-scrollbar-interaction.os-scrollbar-visible {
425
+ opacity: 1;
426
+ visibility: visible;
427
+ }
428
+
429
+ .os-scrollbar-unusable,
430
+ .os-scrollbar-unusable *,
431
+ .os-scrollbar-wheel,
432
+ .os-scrollbar-wheel * {
433
+ pointer-events: none !important;
434
+ }
435
+
436
+ .os-scrollbar-unusable .os-scrollbar-handle {
437
+ opacity: 0 !important;
438
+ transition: none !important;
439
+ }
440
+
441
+ .os-scrollbar-horizontal .os-scrollbar-handle {
442
+ bottom: 0;
443
+ left: calc(var(--os-scroll-percent-directional) * 100%);
444
+ transform: translateX(calc(var(--os-scroll-percent-directional) * -100%));
445
+ width: calc(var(--os-viewport-percent) * 100%);
446
+ }
447
+
448
+ .os-scrollbar-vertical .os-scrollbar-handle {
449
+ right: 0;
450
+ top: calc(var(--os-scroll-percent-directional) * 100%);
451
+ transform: translateY(calc(var(--os-scroll-percent-directional) * -100%));
452
+ height: calc(var(--os-viewport-percent) * 100%);
453
+ }
454
+
455
+ @supports (container-type: size) {
456
+ .os-scrollbar-track {
457
+ container-type: size;
458
+ }
459
+ .os-scrollbar-horizontal .os-scrollbar-handle {
460
+ left: auto;
461
+ transform: translateX(calc(var(--os-scroll-percent-directional) * 100cqw + var(--os-scroll-percent-directional) * -100%));
462
+ }
463
+ .os-scrollbar-vertical .os-scrollbar-handle {
464
+ top: auto;
465
+ transform: translateY(calc(var(--os-scroll-percent-directional) * 100cqh + var(--os-scroll-percent-directional) * -100%));
466
+ }
467
+ .os-scrollbar-rtl.os-scrollbar-horizontal .os-scrollbar-handle {
468
+ right: auto;
469
+ left: 0;
470
+ }
471
+ }
472
+ .os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle {
473
+ right: auto;
474
+ left: 0;
475
+ }
476
+
477
+ .os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,
478
+ .os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl {
479
+ left: 0;
480
+ right: 0;
481
+ }
482
+
483
+ .os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,
484
+ .os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl {
485
+ top: 0;
486
+ bottom: 0;
487
+ }
488
+
489
+ @media print {
490
+ .os-scrollbar {
491
+ display: none;
492
+ }
493
+ }
494
+ .os-scrollbar {
495
+ --os-size: 0;
496
+ --os-padding-perpendicular: 0;
497
+ --os-padding-axis: 0;
498
+ --os-track-border-radius: 0;
499
+ --os-track-bg: none;
500
+ --os-track-bg-hover: none;
501
+ --os-track-bg-active: none;
502
+ --os-track-border: none;
503
+ --os-track-border-hover: none;
504
+ --os-track-border-active: none;
505
+ --os-handle-border-radius: 0;
506
+ --os-handle-bg: none;
507
+ --os-handle-bg-hover: none;
508
+ --os-handle-bg-active: none;
509
+ --os-handle-border: none;
510
+ --os-handle-border-hover: none;
511
+ --os-handle-border-active: none;
512
+ --os-handle-min-size: 33px;
513
+ --os-handle-max-size: none;
514
+ --os-handle-perpendicular-size: 100%;
515
+ --os-handle-perpendicular-size-hover: 100%;
516
+ --os-handle-perpendicular-size-active: 100%;
517
+ --os-handle-interactive-area-offset: 0;
518
+ }
519
+
520
+ .os-scrollbar-track {
521
+ border: var(--os-track-border);
522
+ border-radius: var(--os-track-border-radius);
523
+ background: var(--os-track-bg);
524
+ transition: opacity 0.15s, background-color 0.15s, border-color 0.15s;
525
+ }
526
+ .os-scrollbar-track:hover {
527
+ border: var(--os-track-border-hover);
528
+ background: var(--os-track-bg-hover);
529
+ }
530
+ .os-scrollbar-track:active {
531
+ border: var(--os-track-border-active);
532
+ background: var(--os-track-bg-active);
533
+ }
534
+
535
+ .os-scrollbar-handle {
536
+ border: var(--os-handle-border);
537
+ border-radius: var(--os-handle-border-radius);
538
+ background: var(--os-handle-bg);
539
+ }
540
+ .os-scrollbar-handle:hover {
541
+ border: var(--os-handle-border-hover);
542
+ background: var(--os-handle-bg-hover);
543
+ }
544
+ .os-scrollbar-handle:active {
545
+ border: var(--os-handle-border-active);
546
+ background: var(--os-handle-bg-active);
547
+ }
548
+
549
+ .os-scrollbar-track:before,
550
+ .os-scrollbar-handle:before {
551
+ content: "";
552
+ position: absolute;
553
+ left: 0;
554
+ right: 0;
555
+ top: 0;
556
+ bottom: 0;
557
+ display: block;
558
+ }
559
+
560
+ .os-scrollbar-horizontal {
561
+ padding: var(--os-padding-perpendicular) var(--os-padding-axis);
562
+ right: var(--os-size);
563
+ height: var(--os-size);
564
+ }
565
+ .os-scrollbar-horizontal.os-scrollbar-rtl {
566
+ left: var(--os-size);
567
+ right: 0;
568
+ }
569
+ .os-scrollbar-horizontal .os-scrollbar-track:before {
570
+ top: calc(var(--os-padding-perpendicular) * -1);
571
+ bottom: calc(var(--os-padding-perpendicular) * -1);
572
+ }
573
+ .os-scrollbar-horizontal .os-scrollbar-handle {
574
+ min-width: var(--os-handle-min-size);
575
+ max-width: var(--os-handle-max-size);
576
+ height: var(--os-handle-perpendicular-size);
577
+ transition: opacity 0.15s, background-color 0.15s, border-color 0.15s, height 0.15s;
578
+ }
579
+ .os-scrollbar-horizontal .os-scrollbar-handle:before {
580
+ top: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
581
+ bottom: calc(var(--os-padding-perpendicular) * -1);
582
+ }
583
+ .os-scrollbar-horizontal:hover .os-scrollbar-handle {
584
+ height: var(--os-handle-perpendicular-size-hover);
585
+ }
586
+ .os-scrollbar-horizontal:active .os-scrollbar-handle {
587
+ height: var(--os-handle-perpendicular-size-active);
588
+ }
589
+
590
+ .os-scrollbar-vertical {
591
+ padding: var(--os-padding-axis) var(--os-padding-perpendicular);
592
+ bottom: var(--os-size);
593
+ width: var(--os-size);
594
+ }
595
+ .os-scrollbar-vertical .os-scrollbar-track:before {
596
+ left: calc(var(--os-padding-perpendicular) * -1);
597
+ right: calc(var(--os-padding-perpendicular) * -1);
598
+ }
599
+ .os-scrollbar-vertical .os-scrollbar-handle {
600
+ min-height: var(--os-handle-min-size);
601
+ max-height: var(--os-handle-max-size);
602
+ width: var(--os-handle-perpendicular-size);
603
+ transition: opacity 0.15s, background-color 0.15s, border-color 0.15s, width 0.15s;
604
+ }
605
+ .os-scrollbar-vertical .os-scrollbar-handle:before {
606
+ left: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
607
+ right: calc(var(--os-padding-perpendicular) * -1);
608
+ }
609
+ .os-scrollbar-vertical.os-scrollbar-rtl .os-scrollbar-handle:before {
610
+ right: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
611
+ left: calc(var(--os-padding-perpendicular) * -1);
612
+ }
613
+ .os-scrollbar-vertical:hover .os-scrollbar-handle {
614
+ width: var(--os-handle-perpendicular-size-hover);
615
+ }
616
+ .os-scrollbar-vertical:active .os-scrollbar-handle {
617
+ width: var(--os-handle-perpendicular-size-active);
618
+ }
619
+
620
+ /* NONE THEME: */
621
+ [data-overlayscrollbars-viewport~=measuring] > .os-scrollbar,
622
+ .os-theme-none.os-scrollbar {
623
+ display: none !important;
624
+ }
625
+
626
+ /* DARK & LIGHT THEME: */
627
+ .os-theme-dark,
628
+ .os-theme-light {
629
+ box-sizing: border-box;
630
+ --os-size: 10px;
631
+ --os-padding-perpendicular: 2px;
632
+ --os-padding-axis: 2px;
633
+ --os-track-border-radius: 10px;
634
+ --os-handle-interactive-area-offset: 4px;
635
+ --os-handle-border-radius: 10px;
636
+ }
637
+
638
+ .os-theme-dark {
639
+ --os-handle-bg: rgba(0, 0, 0, 0.44);
640
+ --os-handle-bg-hover: rgba(0, 0, 0, 0.55);
641
+ --os-handle-bg-active: rgba(0, 0, 0, 0.66);
642
+ }
643
+
644
+ .os-theme-light {
645
+ --os-handle-bg: rgba(255, 255, 255, 0.44);
646
+ --os-handle-bg-hover: rgba(255, 255, 255, 0.55);
647
+ --os-handle-bg-active: rgba(255, 255, 255, 0.66);
648
+ }
649
+
650
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport]),
651
+ [data-overlayscrollbars-viewport~=scrollbarHidden],
652
+ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body {
653
+ scrollbar-width: none !important;
654
+ }
655
+
656
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar,
657
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar-corner,
658
+ [data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar,
659
+ [data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar-corner,
660
+ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar,
661
+ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar-corner {
662
+ -webkit-appearance: none !important;
663
+ appearance: none !important;
664
+ display: none !important;
665
+ width: 0 !important;
666
+ height: 0 !important;
667
+ }
668
+
669
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars]):not(html):not(body) {
670
+ overflow: auto;
671
+ }
1
672
  *, ::before, ::after {
2
673
  --tw-border-spacing-x: 0;
3
674
  --tw-border-spacing-y: 0;
@@ -519,6 +1190,8 @@ video {
519
1190
  --najm-destructive: 0 84.2% 60.2%;
520
1191
  --najm-destructive-foreground: 0 0% 98%;
521
1192
  --najm-border: 0 0% 89.8%;
1193
+ --najm-border-subtle: 0 0% 95%;
1194
+ --najm-border-strong: 0 0% 30%;
522
1195
  --najm-input: 0 0% 89.8%;
523
1196
  --najm-ring: 240 4% 11%;
524
1197
  --najm-radius: 0.5rem;
@@ -544,6 +1217,8 @@ video {
544
1217
  --najm-destructive: 0 84% 60%;
545
1218
  --najm-destructive-foreground: 0 0% 100%;
546
1219
  --najm-border: 240 6% 15%;
1220
+ --najm-border-subtle: 240 6% 11%;
1221
+ --najm-border-strong: 0 0% 78%;
547
1222
  --najm-input: 240 6% 15%;
548
1223
  --najm-ring: 240 4% 11%;
549
1224
  }
@@ -633,6 +1308,9 @@ video {
633
1308
  .invisible {
634
1309
  visibility: hidden;
635
1310
  }
1311
+ .collapse {
1312
+ visibility: collapse;
1313
+ }
636
1314
  .static {
637
1315
  position: static;
638
1316
  }
@@ -659,6 +1337,9 @@ video {
659
1337
  top: 0px;
660
1338
  bottom: 0px;
661
1339
  }
1340
+ .-top-7 {
1341
+ top: -1.75rem;
1342
+ }
662
1343
  .bottom-0 {
663
1344
  bottom: 0px;
664
1345
  }
@@ -668,12 +1349,18 @@ video {
668
1349
  .bottom-6 {
669
1350
  bottom: 1.5rem;
670
1351
  }
1352
+ .end-0 {
1353
+ inset-inline-end: 0px;
1354
+ }
671
1355
  .left-0 {
672
1356
  left: 0px;
673
1357
  }
674
1358
  .left-1 {
675
1359
  left: 0.25rem;
676
1360
  }
1361
+ .left-1\/2 {
1362
+ left: 50%;
1363
+ }
677
1364
  .left-2 {
678
1365
  left: 0.5rem;
679
1366
  }
@@ -701,6 +1388,12 @@ video {
701
1388
  .right-4 {
702
1389
  right: 1rem;
703
1390
  }
1391
+ .start-0 {
1392
+ inset-inline-start: 0px;
1393
+ }
1394
+ .start-1\/2 {
1395
+ inset-inline-start: 50%;
1396
+ }
704
1397
  .top-0 {
705
1398
  top: 0px;
706
1399
  }
@@ -716,6 +1409,9 @@ video {
716
1409
  .top-4 {
717
1410
  top: 1rem;
718
1411
  }
1412
+ .top-7 {
1413
+ top: 1.75rem;
1414
+ }
719
1415
  .top-\[50\%\] {
720
1416
  top: 50%;
721
1417
  }
@@ -734,6 +1430,9 @@ video {
734
1430
  .z-50 {
735
1431
  z-index: 50;
736
1432
  }
1433
+ .z-\[10000\] {
1434
+ z-index: 10000;
1435
+ }
737
1436
  .col-start-2 {
738
1437
  grid-column-start: 2;
739
1438
  }
@@ -773,6 +1472,9 @@ video {
773
1472
  .mb-4 {
774
1473
  margin-bottom: 1rem;
775
1474
  }
1475
+ .mb-6 {
1476
+ margin-bottom: 1.5rem;
1477
+ }
776
1478
  .ml-0\.5 {
777
1479
  margin-left: 0.125rem;
778
1480
  }
@@ -809,6 +1511,9 @@ video {
809
1511
  .mt-4 {
810
1512
  margin-top: 1rem;
811
1513
  }
1514
+ .mt-6 {
1515
+ margin-top: 1.5rem;
1516
+ }
812
1517
  .mt-auto {
813
1518
  margin-top: auto;
814
1519
  }
@@ -1050,6 +1755,9 @@ video {
1050
1755
  .min-h-32 {
1051
1756
  min-height: 8rem;
1052
1757
  }
1758
+ .min-h-64 {
1759
+ min-height: 16rem;
1760
+ }
1053
1761
  .min-h-8 {
1054
1762
  min-height: 2rem;
1055
1763
  }
@@ -1059,6 +1767,9 @@ video {
1059
1767
  .min-h-\[400px\] {
1060
1768
  min-height: 400px;
1061
1769
  }
1770
+ .w-1 {
1771
+ width: 0.25rem;
1772
+ }
1062
1773
  .w-1\.5 {
1063
1774
  width: 0.375rem;
1064
1775
  }
@@ -1068,6 +1779,9 @@ video {
1068
1779
  .w-10 {
1069
1780
  width: 2.5rem;
1070
1781
  }
1782
+ .w-11 {
1783
+ width: 2.75rem;
1784
+ }
1071
1785
  .w-12 {
1072
1786
  width: 3rem;
1073
1787
  }
@@ -1128,9 +1842,6 @@ video {
1128
1842
  .w-6 {
1129
1843
  width: 1.5rem;
1130
1844
  }
1131
- .w-60 {
1132
- width: 15rem;
1133
- }
1134
1845
  .w-7 {
1135
1846
  width: 1.75rem;
1136
1847
  }
@@ -1149,8 +1860,8 @@ video {
1149
1860
  .w-\[380px\] {
1150
1861
  width: 380px;
1151
1862
  }
1152
- .w-\[70px\] {
1153
- width: 70px;
1863
+ .w-\[80px\] {
1864
+ width: 80px;
1154
1865
  }
1155
1866
  .w-\[var\(--radix-popover-trigger-width\)\] {
1156
1867
  width: var(--radix-popover-trigger-width);
@@ -1186,8 +1897,8 @@ video {
1186
1897
  .min-w-9 {
1187
1898
  min-width: 2.25rem;
1188
1899
  }
1189
- .min-w-\[110px\] {
1190
- min-width: 110px;
1900
+ .min-w-\[160px\] {
1901
+ min-width: 160px;
1191
1902
  }
1192
1903
  .min-w-\[50px\] {
1193
1904
  min-width: 50px;
@@ -1201,6 +1912,9 @@ video {
1201
1912
  .max-w-\[280px\] {
1202
1913
  max-width: 280px;
1203
1914
  }
1915
+ .max-w-\[380px\] {
1916
+ max-width: 380px;
1917
+ }
1204
1918
  .max-w-\[95vw\] {
1205
1919
  max-width: 95vw;
1206
1920
  }
@@ -1231,6 +1945,10 @@ video {
1231
1945
  .border-collapse {
1232
1946
  border-collapse: collapse;
1233
1947
  }
1948
+ .-translate-x-1\/2 {
1949
+ --tw-translate-x: -50%;
1950
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1951
+ }
1234
1952
  .-translate-x-full {
1235
1953
  --tw-translate-x: -100%;
1236
1954
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1243,10 +1961,18 @@ video {
1243
1961
  --tw-translate-x: 0px;
1244
1962
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1245
1963
  }
1964
+ .translate-x-1\/2 {
1965
+ --tw-translate-x: 50%;
1966
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1967
+ }
1246
1968
  .translate-x-\[-50\%\] {
1247
1969
  --tw-translate-x: -50%;
1248
1970
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1249
1971
  }
1972
+ .translate-y-1\/2 {
1973
+ --tw-translate-y: 50%;
1974
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1975
+ }
1250
1976
  .translate-y-\[-50\%\] {
1251
1977
  --tw-translate-y: -50%;
1252
1978
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1353,6 +2079,9 @@ video {
1353
2079
  .grid-cols-1 {
1354
2080
  grid-template-columns: repeat(1, minmax(0, 1fr));
1355
2081
  }
2082
+ .grid-cols-2 {
2083
+ grid-template-columns: repeat(2, minmax(0, 1fr));
2084
+ }
1356
2085
  .grid-cols-7 {
1357
2086
  grid-template-columns: repeat(7, minmax(0, 1fr));
1358
2087
  }
@@ -1455,11 +2184,6 @@ video {
1455
2184
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
1456
2185
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
1457
2186
  }
1458
- .space-x-2 > :not([hidden]) ~ :not([hidden]) {
1459
- --tw-space-x-reverse: 0;
1460
- margin-right: calc(0.5rem * var(--tw-space-x-reverse));
1461
- margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
1462
- }
1463
2187
  .space-y-0 > :not([hidden]) ~ :not([hidden]) {
1464
2188
  --tw-space-y-reverse: 0;
1465
2189
  margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
@@ -1485,6 +2209,11 @@ video {
1485
2209
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
1486
2210
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
1487
2211
  }
2212
+ .space-y-3 > :not([hidden]) ~ :not([hidden]) {
2213
+ --tw-space-y-reverse: 0;
2214
+ margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
2215
+ margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
2216
+ }
1488
2217
  .space-y-4 > :not([hidden]) ~ :not([hidden]) {
1489
2218
  --tw-space-y-reverse: 0;
1490
2219
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
@@ -1504,21 +2233,12 @@ video {
1504
2233
  .justify-self-end {
1505
2234
  justify-self: end;
1506
2235
  }
1507
- .overflow-auto {
1508
- overflow: auto;
1509
- }
1510
2236
  .overflow-hidden {
1511
2237
  overflow: hidden;
1512
2238
  }
1513
2239
  .overflow-visible {
1514
2240
  overflow: visible;
1515
2241
  }
1516
- .overflow-x-auto {
1517
- overflow-x: auto;
1518
- }
1519
- .overflow-y-auto {
1520
- overflow-y: auto;
1521
- }
1522
2242
  .overflow-x-hidden {
1523
2243
  overflow-x: hidden;
1524
2244
  }
@@ -1542,6 +2262,12 @@ video {
1542
2262
  .rounded-\[10px\] {
1543
2263
  border-radius: 10px;
1544
2264
  }
2265
+ .rounded-\[18px\] {
2266
+ border-radius: 18px;
2267
+ }
2268
+ .rounded-\[20px\] {
2269
+ border-radius: 20px;
2270
+ }
1545
2271
  .rounded-\[4px\] {
1546
2272
  border-radius: 4px;
1547
2273
  }
@@ -1609,9 +2335,6 @@ video {
1609
2335
  .border-dashed {
1610
2336
  border-style: dashed;
1611
2337
  }
1612
- .border-none {
1613
- border-style: none;
1614
- }
1615
2338
  .\!border-amber-500\/40 {
1616
2339
  border-color: rgb(245 158 11 / 0.4) !important;
1617
2340
  }
@@ -1624,6 +2347,13 @@ video {
1624
2347
  .\!border-red-500\/40 {
1625
2348
  border-color: rgb(239 68 68 / 0.4) !important;
1626
2349
  }
2350
+ .\!border-red-600 {
2351
+ --tw-border-opacity: 1 !important;
2352
+ border-color: rgb(220 38 38 / var(--tw-border-opacity, 1)) !important;
2353
+ }
2354
+ .border-accent {
2355
+ border-color: hsl(var(--najm-accent));
2356
+ }
1627
2357
  .border-amber-400\/20 {
1628
2358
  border-color: rgb(251 191 36 / 0.2);
1629
2359
  }
@@ -1633,12 +2363,26 @@ video {
1633
2363
  .border-amber-400\/60 {
1634
2364
  border-color: rgb(251 191 36 / 0.6);
1635
2365
  }
2366
+ .border-amber-500 {
2367
+ --tw-border-opacity: 1;
2368
+ border-color: rgb(245 158 11 / var(--tw-border-opacity, 1));
2369
+ }
1636
2370
  .border-amber-500\/30 {
1637
2371
  border-color: rgb(245 158 11 / 0.3);
1638
2372
  }
2373
+ .border-amber-600 {
2374
+ --tw-border-opacity: 1;
2375
+ border-color: rgb(217 119 6 / var(--tw-border-opacity, 1));
2376
+ }
1639
2377
  .border-border {
1640
2378
  border-color: hsl(var(--najm-border));
1641
2379
  }
2380
+ .border-border-strong {
2381
+ border-color: hsl(var(--najm-border-strong));
2382
+ }
2383
+ .border-border-subtle {
2384
+ border-color: hsl(var(--najm-border-subtle));
2385
+ }
1642
2386
  .border-border\/30 {
1643
2387
  border-color: hsl(var(--najm-border) / 0.3);
1644
2388
  }
@@ -1651,12 +2395,19 @@ video {
1651
2395
  .border-border\/70 {
1652
2396
  border-color: hsl(var(--najm-border) / 0.7);
1653
2397
  }
2398
+ .border-destructive {
2399
+ border-color: hsl(var(--najm-destructive));
2400
+ }
1654
2401
  .border-destructive\/30 {
1655
2402
  border-color: hsl(var(--najm-destructive) / 0.3);
1656
2403
  }
1657
2404
  .border-destructive\/40 {
1658
2405
  border-color: hsl(var(--najm-destructive) / 0.4);
1659
2406
  }
2407
+ .border-emerald-500 {
2408
+ --tw-border-opacity: 1;
2409
+ border-color: rgb(16 185 129 / var(--tw-border-opacity, 1));
2410
+ }
1660
2411
  .border-emerald-500\/20 {
1661
2412
  border-color: rgb(16 185 129 / 0.2);
1662
2413
  }
@@ -1672,6 +2423,10 @@ video {
1672
2423
  .border-green-500\/30 {
1673
2424
  border-color: rgb(34 197 94 / 0.3);
1674
2425
  }
2426
+ .border-green-600 {
2427
+ --tw-border-opacity: 1;
2428
+ border-color: rgb(22 163 74 / var(--tw-border-opacity, 1));
2429
+ }
1675
2430
  .border-indigo-500\/20 {
1676
2431
  border-color: rgb(99 102 241 / 0.2);
1677
2432
  }
@@ -1681,8 +2436,8 @@ video {
1681
2436
  .border-input {
1682
2437
  border-color: hsl(var(--najm-input));
1683
2438
  }
1684
- .border-muted-foreground\/20 {
1685
- border-color: hsl(var(--najm-muted-foreground) / 0.2);
2439
+ .border-muted-foreground {
2440
+ border-color: hsl(var(--najm-muted-foreground));
1686
2441
  }
1687
2442
  .border-muted-foreground\/60 {
1688
2443
  border-color: hsl(var(--najm-muted-foreground) / 0.6);
@@ -1705,10 +2460,6 @@ video {
1705
2460
  .border-primary\/30 {
1706
2461
  border-color: hsl(var(--najm-primary) / 0.3);
1707
2462
  }
1708
- .border-red-500 {
1709
- --tw-border-opacity: 1;
1710
- border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));
1711
- }
1712
2463
  .border-red-500\/20 {
1713
2464
  border-color: rgb(239 68 68 / 0.2);
1714
2465
  }
@@ -1721,9 +2472,20 @@ video {
1721
2472
  .border-red-500\/60 {
1722
2473
  border-color: rgb(239 68 68 / 0.6);
1723
2474
  }
2475
+ .border-red-600 {
2476
+ --tw-border-opacity: 1;
2477
+ border-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
2478
+ }
2479
+ .border-secondary {
2480
+ border-color: hsl(var(--najm-secondary));
2481
+ }
1724
2482
  .border-secondary\/60 {
1725
2483
  border-color: hsl(var(--najm-secondary) / 0.6);
1726
2484
  }
2485
+ .border-sky-500 {
2486
+ --tw-border-opacity: 1;
2487
+ border-color: rgb(14 165 233 / var(--tw-border-opacity, 1));
2488
+ }
1727
2489
  .border-sky-500\/20 {
1728
2490
  border-color: rgb(14 165 233 / 0.2);
1729
2491
  }
@@ -1811,6 +2573,9 @@ video {
1811
2573
  .bg-black\/50 {
1812
2574
  background-color: rgb(0 0 0 / 0.5);
1813
2575
  }
2576
+ .bg-blue-600\/20 {
2577
+ background-color: rgb(37 99 235 / 0.2);
2578
+ }
1814
2579
  .bg-border {
1815
2580
  background-color: hsl(var(--najm-border));
1816
2581
  }
@@ -1843,6 +2608,9 @@ video {
1843
2608
  --tw-bg-opacity: 1;
1844
2609
  background-color: rgb(5 150 105 / var(--tw-bg-opacity, 1));
1845
2610
  }
2611
+ .bg-emerald-600\/20 {
2612
+ background-color: rgb(5 150 105 / 0.2);
2613
+ }
1846
2614
  .bg-foreground {
1847
2615
  background-color: hsl(var(--najm-foreground));
1848
2616
  }
@@ -1865,15 +2633,15 @@ video {
1865
2633
  .bg-muted-foreground {
1866
2634
  background-color: hsl(var(--najm-muted-foreground));
1867
2635
  }
2636
+ .bg-muted-foreground\/30 {
2637
+ background-color: hsl(var(--najm-muted-foreground) / 0.3);
2638
+ }
1868
2639
  .bg-muted\/30 {
1869
2640
  background-color: hsl(var(--najm-muted) / 0.3);
1870
2641
  }
1871
2642
  .bg-muted\/40 {
1872
2643
  background-color: hsl(var(--najm-muted) / 0.4);
1873
2644
  }
1874
- .bg-muted\/80 {
1875
- background-color: hsl(var(--najm-muted) / 0.8);
1876
- }
1877
2645
  .bg-orange-500 {
1878
2646
  --tw-bg-opacity: 1;
1879
2647
  background-color: rgb(249 115 22 / var(--tw-bg-opacity, 1));
@@ -1897,6 +2665,9 @@ video {
1897
2665
  .bg-primary\/10 {
1898
2666
  background-color: hsl(var(--najm-primary) / 0.1);
1899
2667
  }
2668
+ .bg-primary\/15 {
2669
+ background-color: hsl(var(--najm-primary) / 0.15);
2670
+ }
1900
2671
  .bg-primary\/20 {
1901
2672
  background-color: hsl(var(--najm-primary) / 0.2);
1902
2673
  }
@@ -1906,10 +2677,6 @@ video {
1906
2677
  .bg-primary\/50 {
1907
2678
  background-color: hsl(var(--najm-primary) / 0.5);
1908
2679
  }
1909
- .bg-red-100 {
1910
- --tw-bg-opacity: 1;
1911
- background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
1912
- }
1913
2680
  .bg-red-500 {
1914
2681
  --tw-bg-opacity: 1;
1915
2682
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
@@ -1921,6 +2688,9 @@ video {
1921
2688
  --tw-bg-opacity: 1;
1922
2689
  background-color: rgb(244 63 94 / var(--tw-bg-opacity, 1));
1923
2690
  }
2691
+ .bg-rose-600\/20 {
2692
+ background-color: rgb(225 29 72 / 0.2);
2693
+ }
1924
2694
  .bg-secondary {
1925
2695
  background-color: hsl(var(--najm-secondary));
1926
2696
  }
@@ -1955,12 +2725,18 @@ video {
1955
2725
  .bg-slate-500\/10 {
1956
2726
  background-color: rgb(100 116 139 / 0.1);
1957
2727
  }
2728
+ .bg-slate-700\/60 {
2729
+ background-color: rgb(51 65 85 / 0.6);
2730
+ }
1958
2731
  .bg-tertiary {
1959
2732
  background-color: hsl(var(--najm-tertiary));
1960
2733
  }
1961
2734
  .bg-transparent {
1962
2735
  background-color: transparent;
1963
2736
  }
2737
+ .bg-violet-600\/20 {
2738
+ background-color: rgb(124 58 237 / 0.2);
2739
+ }
1964
2740
  .bg-white\/5 {
1965
2741
  background-color: rgb(255 255 255 / 0.05);
1966
2742
  }
@@ -1970,9 +2746,6 @@ video {
1970
2746
  .\!bg-none {
1971
2747
  background-image: none !important;
1972
2748
  }
1973
- .bg-none {
1974
- background-image: none;
1975
- }
1976
2749
  .fill-\[\#d6d6d6\] {
1977
2750
  fill: #d6d6d6;
1978
2751
  }
@@ -2153,6 +2926,9 @@ video {
2153
2926
  .pl-9 {
2154
2927
  padding-left: 2.25rem;
2155
2928
  }
2929
+ .pl-\[calc\(var\(--rail\2c 4rem\)\/2_-_1\.5rem\)\] {
2930
+ padding-left: calc(var(--rail,4rem) / 2 - 1.5rem);
2931
+ }
2156
2932
  .pr-1\.5 {
2157
2933
  padding-right: 0.375rem;
2158
2934
  }
@@ -2177,6 +2953,9 @@ video {
2177
2953
  .pt-3 {
2178
2954
  padding-top: 0.75rem;
2179
2955
  }
2956
+ .pt-8 {
2957
+ padding-top: 2rem;
2958
+ }
2180
2959
  .text-left {
2181
2960
  text-align: left;
2182
2961
  }
@@ -2328,6 +3107,9 @@ video {
2328
3107
  .text-destructive {
2329
3108
  color: hsl(var(--najm-destructive));
2330
3109
  }
3110
+ .text-destructive-foreground {
3111
+ color: hsl(var(--najm-destructive-foreground));
3112
+ }
2331
3113
  .text-emerald-400 {
2332
3114
  --tw-text-opacity: 1;
2333
3115
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
@@ -2491,6 +3273,16 @@ video {
2491
3273
  .opacity-85 {
2492
3274
  opacity: 0.85;
2493
3275
  }
3276
+ .shadow {
3277
+ --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
3278
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
3279
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3280
+ }
3281
+ .shadow-2xl {
3282
+ --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
3283
+ --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
3284
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3285
+ }
2494
3286
  .shadow-lg {
2495
3287
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
2496
3288
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
@@ -2678,6 +3470,57 @@ video {
2678
3470
  .ease-out {
2679
3471
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
2680
3472
  }
3473
+ .border-border-strong {
3474
+ border-color: hsl(var(--najm-border-strong)) !important;
3475
+ }
3476
+ /* Scrollable, but the scrollbar reserves no layout space (hidden in all
3477
+ browsers). `overflow: overlay` was removed from Chrome (~v121) and now
3478
+ behaves like `auto`, so hiding the bar is the only pure-CSS way to avoid
3479
+ the reserved gutter. Scroll via wheel / trackpad / keyboard. */
3480
+ .najm-overlay-scroll {
3481
+ overflow: auto;
3482
+ scrollbar-width: none; /* Firefox */
3483
+ }
3484
+ .najm-overlay-scroll::-webkit-scrollbar {
3485
+ display: none; /* Chromium / Safari */
3486
+ }
3487
+ .najm-overlay-scroll-y {
3488
+ overflow-y: auto;
3489
+ scrollbar-width: none;
3490
+ }
3491
+ .najm-overlay-scroll-y::-webkit-scrollbar {
3492
+ display: none;
3493
+ }
3494
+ .najm-overlay-scroll-x {
3495
+ overflow-x: auto;
3496
+ scrollbar-width: none;
3497
+ }
3498
+ .najm-overlay-scroll-x::-webkit-scrollbar {
3499
+ display: none;
3500
+ }
3501
+
3502
+ /* OverlayScrollbars theme used by the <NajmScroll> component — a thin,
3503
+ translucent slate bar that floats over content with no reserved space. */
3504
+ .os-theme-najm {
3505
+ --os-size: 10px;
3506
+ --os-padding-perpendicular: 2px;
3507
+ --os-padding-axis: 2px;
3508
+ --os-track-border-radius: 9999px;
3509
+ --os-handle-border-radius: 9999px;
3510
+ --os-handle-bg: rgba(148, 163, 184, 0.3);
3511
+ --os-handle-bg-hover: rgba(148, 163, 184, 0.45);
3512
+ --os-handle-bg-active: rgba(148, 163, 184, 0.6);
3513
+ --os-handle-min-size: 33px;
3514
+ --os-handle-perpendicular-size: 60%;
3515
+ --os-handle-perpendicular-size-hover: 90%;
3516
+ }
3517
+
3518
+ /* Darker, more subtle handle in dark mode */
3519
+ .dark .os-theme-najm {
3520
+ --os-handle-bg: rgba(82, 82, 91, 0.45);
3521
+ --os-handle-bg-hover: rgba(113, 113, 122, 0.6);
3522
+ --os-handle-bg-active: rgba(113, 113, 122, 0.75);
3523
+ }
2681
3524
  .selection\:bg-primary *::-moz-selection {
2682
3525
  background-color: hsl(var(--najm-primary));
2683
3526
  }
@@ -2736,6 +3579,15 @@ video {
2736
3579
  .focus-within\:z-20:focus-within {
2737
3580
  z-index: 20;
2738
3581
  }
3582
+ .focus-within\:border-primary:focus-within {
3583
+ border-color: hsl(var(--najm-primary));
3584
+ }
3585
+ .focus-within\:border-primary\/70:focus-within {
3586
+ border-color: hsl(var(--najm-primary) / 0.7);
3587
+ }
3588
+ .focus-within\:opacity-100:focus-within {
3589
+ opacity: 1;
3590
+ }
2739
3591
  .hover\:scale-105:hover {
2740
3592
  --tw-scale-x: 1.05;
2741
3593
  --tw-scale-y: 1.05;
@@ -2749,6 +3601,9 @@ video {
2749
3601
  .hover\:border-border\/60:hover {
2750
3602
  border-color: hsl(var(--najm-border) / 0.6);
2751
3603
  }
3604
+ .hover\:border-input:hover {
3605
+ border-color: hsl(var(--najm-input));
3606
+ }
2752
3607
  .hover\:border-muted-foreground\/30:hover {
2753
3608
  border-color: hsl(var(--najm-muted-foreground) / 0.3);
2754
3609
  }
@@ -2774,6 +3629,12 @@ video {
2774
3629
  --tw-bg-opacity: 1;
2775
3630
  background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
2776
3631
  }
3632
+ .hover\:bg-amber-500\/5:hover {
3633
+ background-color: rgb(245 158 11 / 0.05);
3634
+ }
3635
+ .hover\:bg-blue-500\/5:hover {
3636
+ background-color: rgb(59 130 246 / 0.05);
3637
+ }
2777
3638
  .hover\:bg-card:hover {
2778
3639
  background-color: hsl(var(--najm-card));
2779
3640
  }
@@ -2783,6 +3644,9 @@ video {
2783
3644
  .hover\:bg-destructive\/90:hover {
2784
3645
  background-color: hsl(var(--najm-destructive) / 0.9);
2785
3646
  }
3647
+ .hover\:bg-emerald-500\/5:hover {
3648
+ background-color: rgb(16 185 129 / 0.05);
3649
+ }
2786
3650
  .hover\:bg-emerald-700:hover {
2787
3651
  --tw-bg-opacity: 1;
2788
3652
  background-color: rgb(4 120 87 / var(--tw-bg-opacity, 1));
@@ -2820,6 +3684,9 @@ video {
2820
3684
  .hover\:bg-red-500\/10:hover {
2821
3685
  background-color: rgb(239 68 68 / 0.1);
2822
3686
  }
3687
+ .hover\:bg-rose-500\/5:hover {
3688
+ background-color: rgb(244 63 94 / 0.05);
3689
+ }
2823
3690
  .hover\:bg-secondary\/80:hover {
2824
3691
  background-color: hsl(var(--najm-secondary) / 0.8);
2825
3692
  }
@@ -2827,12 +3694,18 @@ video {
2827
3694
  --tw-bg-opacity: 1;
2828
3695
  background-color: rgb(3 105 161 / var(--tw-bg-opacity, 1));
2829
3696
  }
3697
+ .hover\:bg-slate-500\/5:hover {
3698
+ background-color: rgb(100 116 139 / 0.05);
3699
+ }
2830
3700
  .hover\:bg-tertiary\/80:hover {
2831
3701
  background-color: hsl(var(--najm-tertiary) / 0.8);
2832
3702
  }
2833
3703
  .hover\:bg-transparent:hover {
2834
3704
  background-color: transparent;
2835
3705
  }
3706
+ .hover\:bg-violet-500\/5:hover {
3707
+ background-color: rgb(139 92 246 / 0.05);
3708
+ }
2836
3709
  .hover\:text-accent-foreground:hover {
2837
3710
  color: hsl(var(--najm-accent-foreground));
2838
3711
  }
@@ -2852,6 +3725,9 @@ video {
2852
3725
  --tw-text-opacity: 1;
2853
3726
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
2854
3727
  }
3728
+ .hover\:text-secondary-foreground:hover {
3729
+ color: hsl(var(--najm-secondary-foreground));
3730
+ }
2855
3731
  .hover\:underline:hover {
2856
3732
  text-decoration-line: underline;
2857
3733
  }
@@ -2861,10 +3737,8 @@ video {
2861
3737
  .hover\:opacity-80:hover {
2862
3738
  opacity: 0.8;
2863
3739
  }
2864
- .hover\:shadow-md:hover {
2865
- --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
2866
- --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
2867
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3740
+ .hover\:opacity-90:hover {
3741
+ opacity: 0.9;
2868
3742
  }
2869
3743
  .hover\:ring-1:hover {
2870
3744
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -2889,6 +3763,9 @@ video {
2889
3763
  .focus\:text-primary-foreground:focus {
2890
3764
  color: hsl(var(--najm-primary-foreground));
2891
3765
  }
3766
+ .focus\:opacity-100:focus {
3767
+ opacity: 1;
3768
+ }
2892
3769
  .focus\:outline-none:focus {
2893
3770
  outline: 2px solid transparent;
2894
3771
  outline-offset: 2px;
@@ -2918,6 +3795,9 @@ video {
2918
3795
  .focus-visible\:border-transparent:focus-visible {
2919
3796
  border-color: transparent;
2920
3797
  }
3798
+ .focus-visible\:opacity-100:focus-visible {
3799
+ opacity: 1;
3800
+ }
2921
3801
  .focus-visible\:outline-none:focus-visible {
2922
3802
  outline: 2px solid transparent;
2923
3803
  outline-offset: 2px;
@@ -2940,6 +3820,9 @@ video {
2940
3820
  .focus-visible\:ring-destructive\/20:focus-visible {
2941
3821
  --tw-ring-color: hsl(var(--najm-destructive) / 0.2);
2942
3822
  }
3823
+ .focus-visible\:ring-destructive\/40:focus-visible {
3824
+ --tw-ring-color: hsl(var(--najm-destructive) / 0.4);
3825
+ }
2943
3826
  .focus-visible\:ring-ring:focus-visible {
2944
3827
  --tw-ring-color: hsl(var(--najm-ring));
2945
3828
  }
@@ -3304,6 +4187,25 @@ video {
3304
4187
  .group[data-disabled="true"] .group-data-\[disabled\=true\]\:opacity-50 {
3305
4188
  opacity: 0.5;
3306
4189
  }
4190
+ .dark\:border-0:is(.dark *) {
4191
+ border-width: 0px;
4192
+ }
4193
+ .dark\:bg-\[\#222b38\]:is(.dark *) {
4194
+ --tw-bg-opacity: 1;
4195
+ background-color: rgb(34 43 56 / var(--tw-bg-opacity, 1));
4196
+ }
4197
+ .dark\:bg-\[\#3e4a5d\]:is(.dark *) {
4198
+ --tw-bg-opacity: 1;
4199
+ background-color: rgb(62 74 93 / var(--tw-bg-opacity, 1));
4200
+ }
4201
+ .dark\:bg-\[\#5a1822\]:is(.dark *) {
4202
+ --tw-bg-opacity: 1;
4203
+ background-color: rgb(90 24 34 / var(--tw-bg-opacity, 1));
4204
+ }
4205
+ .dark\:bg-\[\#dc4d61\]:is(.dark *) {
4206
+ --tw-bg-opacity: 1;
4207
+ background-color: rgb(220 77 97 / var(--tw-bg-opacity, 1));
4208
+ }
3307
4209
  .dark\:bg-destructive\/15:is(.dark *) {
3308
4210
  background-color: hsl(var(--najm-destructive) / 0.15);
3309
4211
  }
@@ -3316,15 +4218,16 @@ video {
3316
4218
  .dark\:bg-input\/30:is(.dark *) {
3317
4219
  background-color: hsl(var(--najm-input) / 0.3);
3318
4220
  }
3319
- .dark\:bg-red-900\/30:is(.dark *) {
3320
- background-color: rgb(127 29 29 / 0.3);
3321
- }
3322
4221
  .dark\:bg-transparent:is(.dark *) {
3323
4222
  background-color: transparent;
3324
4223
  }
3325
4224
  .dark\:bg-yellow-500\/10:is(.dark *) {
3326
4225
  background-color: rgb(234 179 8 / 0.1);
3327
4226
  }
4227
+ .dark\:text-\[\#aab4c2\]:is(.dark *) {
4228
+ --tw-text-opacity: 1;
4229
+ color: rgb(170 180 194 / var(--tw-text-opacity, 1));
4230
+ }
3328
4231
  .dark\:text-amber-300:is(.dark *) {
3329
4232
  --tw-text-opacity: 1;
3330
4233
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
@@ -3345,22 +4248,41 @@ video {
3345
4248
  --tw-text-opacity: 1;
3346
4249
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
3347
4250
  }
4251
+ .dark\:text-white:is(.dark *) {
4252
+ --tw-text-opacity: 1;
4253
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
4254
+ }
3348
4255
  .dark\:text-yellow-300:is(.dark *) {
3349
4256
  --tw-text-opacity: 1;
3350
4257
  color: rgb(253 224 71 / var(--tw-text-opacity, 1));
3351
4258
  }
4259
+ .dark\:hover\:bg-\[\#4b586c\]:hover:is(.dark *) {
4260
+ --tw-bg-opacity: 1;
4261
+ background-color: rgb(75 88 108 / var(--tw-bg-opacity, 1));
4262
+ }
4263
+ .dark\:hover\:bg-\[\#e15f70\]:hover:is(.dark *) {
4264
+ --tw-bg-opacity: 1;
4265
+ background-color: rgb(225 95 112 / var(--tw-bg-opacity, 1));
4266
+ }
3352
4267
  .dark\:hover\:bg-accent\/50:hover:is(.dark *) {
3353
4268
  background-color: hsl(var(--najm-accent) / 0.5);
3354
4269
  }
3355
4270
  .dark\:hover\:bg-input\/50:hover:is(.dark *) {
3356
4271
  background-color: hsl(var(--najm-input) / 0.5);
3357
4272
  }
3358
- .dark\:hover\:bg-transparent:hover:is(.dark *) {
3359
- background-color: transparent;
4273
+ .dark\:hover\:text-white:hover:is(.dark *) {
4274
+ --tw-text-opacity: 1;
4275
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
4276
+ }
4277
+ .dark\:focus-visible\:ring-\[\#dc4d61\]\/40:focus-visible:is(.dark *) {
4278
+ --tw-ring-color: rgb(220 77 97 / 0.4);
3360
4279
  }
3361
4280
  .dark\:focus-visible\:ring-destructive\/40:focus-visible:is(.dark *) {
3362
4281
  --tw-ring-color: hsl(var(--najm-destructive) / 0.4);
3363
4282
  }
4283
+ .dark\:data-\[state\=active\]\:bg-card[data-state="active"]:is(.dark *) {
4284
+ background-color: hsl(var(--najm-card));
4285
+ }
3364
4286
  .dark\:data-\[state\=checked\]\:bg-primary[data-state="checked"]:is(.dark *) {
3365
4287
  background-color: hsl(var(--najm-primary));
3366
4288
  }
@@ -3372,6 +4294,30 @@ video {
3372
4294
  }
3373
4295
  @media (min-width: 640px) {
3374
4296
 
4297
+ .sm\:bottom-0 {
4298
+ bottom: 0px;
4299
+ }
4300
+
4301
+ .sm\:end-0 {
4302
+ inset-inline-end: 0px;
4303
+ }
4304
+
4305
+ .sm\:start-0 {
4306
+ inset-inline-start: 0px;
4307
+ }
4308
+
4309
+ .sm\:start-1\/2 {
4310
+ inset-inline-start: 50%;
4311
+ }
4312
+
4313
+ .sm\:top-0 {
4314
+ top: 0px;
4315
+ }
4316
+
4317
+ .sm\:top-1\/2 {
4318
+ top: 50%;
4319
+ }
4320
+
3375
4321
  .sm\:inline {
3376
4322
  display: inline;
3377
4323
  }
@@ -3384,8 +4330,8 @@ video {
3384
4330
  display: none;
3385
4331
  }
3386
4332
 
3387
- .sm\:w-\[calc\(50\%-12px\)\] {
3388
- width: calc(50% - 12px);
4333
+ .sm\:w-40 {
4334
+ width: 10rem;
3389
4335
  }
3390
4336
 
3391
4337
  .sm\:max-w-sm {
@@ -3396,6 +4342,26 @@ video {
3396
4342
  flex: 1 1 0%;
3397
4343
  }
3398
4344
 
4345
+ .sm\:-translate-x-1\/2 {
4346
+ --tw-translate-x: -50%;
4347
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4348
+ }
4349
+
4350
+ .sm\:-translate-y-1\/2 {
4351
+ --tw-translate-y: -50%;
4352
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4353
+ }
4354
+
4355
+ .sm\:translate-x-1\/2 {
4356
+ --tw-translate-x: 50%;
4357
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4358
+ }
4359
+
4360
+ .sm\:translate-y-1\/2 {
4361
+ --tw-translate-y: 50%;
4362
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4363
+ }
4364
+
3399
4365
  .sm\:grid-cols-2 {
3400
4366
  grid-template-columns: repeat(2, minmax(0, 1fr));
3401
4367
  }
@@ -3467,6 +4433,30 @@ video {
3467
4433
  }
3468
4434
  @media (min-width: 768px) {
3469
4435
 
4436
+ .md\:bottom-0 {
4437
+ bottom: 0px;
4438
+ }
4439
+
4440
+ .md\:end-0 {
4441
+ inset-inline-end: 0px;
4442
+ }
4443
+
4444
+ .md\:start-0 {
4445
+ inset-inline-start: 0px;
4446
+ }
4447
+
4448
+ .md\:start-1\/2 {
4449
+ inset-inline-start: 50%;
4450
+ }
4451
+
4452
+ .md\:top-0 {
4453
+ top: 0px;
4454
+ }
4455
+
4456
+ .md\:top-1\/2 {
4457
+ top: 50%;
4458
+ }
4459
+
3470
4460
  .md\:flex {
3471
4461
  display: flex;
3472
4462
  }
@@ -3475,6 +4465,26 @@ video {
3475
4465
  display: none;
3476
4466
  }
3477
4467
 
4468
+ .md\:-translate-x-1\/2 {
4469
+ --tw-translate-x: -50%;
4470
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4471
+ }
4472
+
4473
+ .md\:-translate-y-1\/2 {
4474
+ --tw-translate-y: -50%;
4475
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4476
+ }
4477
+
4478
+ .md\:translate-x-1\/2 {
4479
+ --tw-translate-x: 50%;
4480
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4481
+ }
4482
+
4483
+ .md\:translate-y-1\/2 {
4484
+ --tw-translate-y: 50%;
4485
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4486
+ }
4487
+
3478
4488
  .md\:pl-5 {
3479
4489
  padding-left: 1.25rem;
3480
4490
  }
@@ -3486,6 +4496,30 @@ video {
3486
4496
  }
3487
4497
  @media (min-width: 1024px) {
3488
4498
 
4499
+ .lg\:bottom-0 {
4500
+ bottom: 0px;
4501
+ }
4502
+
4503
+ .lg\:end-0 {
4504
+ inset-inline-end: 0px;
4505
+ }
4506
+
4507
+ .lg\:start-0 {
4508
+ inset-inline-start: 0px;
4509
+ }
4510
+
4511
+ .lg\:start-1\/2 {
4512
+ inset-inline-start: 50%;
4513
+ }
4514
+
4515
+ .lg\:top-0 {
4516
+ top: 0px;
4517
+ }
4518
+
4519
+ .lg\:top-1\/2 {
4520
+ top: 50%;
4521
+ }
4522
+
3489
4523
  .lg\:flex {
3490
4524
  display: flex;
3491
4525
  }
@@ -3522,10 +4556,6 @@ video {
3522
4556
  max-height: 95vh;
3523
4557
  }
3524
4558
 
3525
- .lg\:w-\[calc\(33\%-16px\)\] {
3526
- width: calc(33% - 16px);
3527
- }
3528
-
3529
4559
  .lg\:w-auto {
3530
4560
  width: auto;
3531
4561
  }
@@ -3570,6 +4600,26 @@ video {
3570
4600
  max-width: 36rem;
3571
4601
  }
3572
4602
 
4603
+ .lg\:-translate-x-1\/2 {
4604
+ --tw-translate-x: -50%;
4605
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4606
+ }
4607
+
4608
+ .lg\:-translate-y-1\/2 {
4609
+ --tw-translate-y: -50%;
4610
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4611
+ }
4612
+
4613
+ .lg\:translate-x-1\/2 {
4614
+ --tw-translate-x: 50%;
4615
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4616
+ }
4617
+
4618
+ .lg\:translate-y-1\/2 {
4619
+ --tw-translate-y: 50%;
4620
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4621
+ }
4622
+
3573
4623
  .lg\:grid-cols-3 {
3574
4624
  grid-template-columns: repeat(3, minmax(0, 1fr));
3575
4625
  }
@@ -3584,14 +4634,172 @@ video {
3584
4634
  }
3585
4635
  @media (min-width: 1280px) {
3586
4636
 
3587
- .xl\:w-\[calc\(25\%-18px\)\] {
3588
- width: calc(25% - 18px);
4637
+ .xl\:bottom-0 {
4638
+ bottom: 0px;
4639
+ }
4640
+
4641
+ .xl\:end-0 {
4642
+ inset-inline-end: 0px;
4643
+ }
4644
+
4645
+ .xl\:start-0 {
4646
+ inset-inline-start: 0px;
4647
+ }
4648
+
4649
+ .xl\:start-1\/2 {
4650
+ inset-inline-start: 50%;
4651
+ }
4652
+
4653
+ .xl\:top-0 {
4654
+ top: 0px;
4655
+ }
4656
+
4657
+ .xl\:top-1\/2 {
4658
+ top: 50%;
4659
+ }
4660
+
4661
+ .xl\:-translate-x-1\/2 {
4662
+ --tw-translate-x: -50%;
4663
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4664
+ }
4665
+
4666
+ .xl\:-translate-y-1\/2 {
4667
+ --tw-translate-y: -50%;
4668
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4669
+ }
4670
+
4671
+ .xl\:translate-x-1\/2 {
4672
+ --tw-translate-x: 50%;
4673
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4674
+ }
4675
+
4676
+ .xl\:translate-y-1\/2 {
4677
+ --tw-translate-y: 50%;
4678
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4679
+ }
4680
+
4681
+ .xl\:grid-cols-4 {
4682
+ grid-template-columns: repeat(4, minmax(0, 1fr));
3589
4683
  }
3590
4684
 
3591
4685
  .xl\:grid-cols-5 {
3592
4686
  grid-template-columns: repeat(5, minmax(0, 1fr));
3593
4687
  }
3594
4688
  }
4689
+ @media (min-width: 1536px) {
4690
+
4691
+ .\32xl\:bottom-0 {
4692
+ bottom: 0px;
4693
+ }
4694
+
4695
+ .\32xl\:end-0 {
4696
+ inset-inline-end: 0px;
4697
+ }
4698
+
4699
+ .\32xl\:start-0 {
4700
+ inset-inline-start: 0px;
4701
+ }
4702
+
4703
+ .\32xl\:start-1\/2 {
4704
+ inset-inline-start: 50%;
4705
+ }
4706
+
4707
+ .\32xl\:top-0 {
4708
+ top: 0px;
4709
+ }
4710
+
4711
+ .\32xl\:top-1\/2 {
4712
+ top: 50%;
4713
+ }
4714
+
4715
+ .\32xl\:-translate-x-1\/2 {
4716
+ --tw-translate-x: -50%;
4717
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4718
+ }
4719
+
4720
+ .\32xl\:-translate-y-1\/2 {
4721
+ --tw-translate-y: -50%;
4722
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4723
+ }
4724
+
4725
+ .\32xl\:translate-x-1\/2 {
4726
+ --tw-translate-x: 50%;
4727
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4728
+ }
4729
+
4730
+ .\32xl\:translate-y-1\/2 {
4731
+ --tw-translate-y: 50%;
4732
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4733
+ }
4734
+ }
4735
+ .rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4736
+ --tw-translate-x: -50%;
4737
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4738
+ }
4739
+ .rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4740
+ --tw-translate-x: 50%;
4741
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4742
+ }
4743
+ @media (min-width: 640px) {
4744
+
4745
+ .sm\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4746
+ --tw-translate-x: -50%;
4747
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4748
+ }
4749
+
4750
+ .sm\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4751
+ --tw-translate-x: 50%;
4752
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4753
+ }
4754
+ }
4755
+ @media (min-width: 768px) {
4756
+
4757
+ .md\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4758
+ --tw-translate-x: -50%;
4759
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4760
+ }
4761
+
4762
+ .md\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4763
+ --tw-translate-x: 50%;
4764
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4765
+ }
4766
+ }
4767
+ @media (min-width: 1024px) {
4768
+
4769
+ .lg\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4770
+ --tw-translate-x: -50%;
4771
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4772
+ }
4773
+
4774
+ .lg\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4775
+ --tw-translate-x: 50%;
4776
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4777
+ }
4778
+ }
4779
+ @media (min-width: 1280px) {
4780
+
4781
+ .xl\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4782
+ --tw-translate-x: -50%;
4783
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4784
+ }
4785
+
4786
+ .xl\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4787
+ --tw-translate-x: 50%;
4788
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4789
+ }
4790
+ }
4791
+ @media (min-width: 1536px) {
4792
+
4793
+ .\32xl\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4794
+ --tw-translate-x: -50%;
4795
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4796
+ }
4797
+
4798
+ .\32xl\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4799
+ --tw-translate-x: 50%;
4800
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4801
+ }
4802
+ }
3595
4803
  .\[\&\:has\(\[aria-selected\]\)\]\:bg-accent:has([aria-selected]) {
3596
4804
  background-color: hsl(var(--najm-accent));
3597
4805
  }
@@ -3602,8 +4810,61 @@ video {
3602
4810
  --tw-translate-y: 2px;
3603
4811
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
3604
4812
  }
3605
- .\[\&\>svg\:last-child\]\:hidden>svg:last-child {
3606
- display: none;
4813
+ .\[\&\>button\]\:right-4>button {
4814
+ right: 1rem;
4815
+ }
4816
+ .\[\&\>button\]\:top-4>button {
4817
+ top: 1rem;
4818
+ }
4819
+ .\[\&\>button\]\:flex>button {
4820
+ display: flex;
4821
+ }
4822
+ .\[\&\>button\]\:size-6>button {
4823
+ width: 1.5rem;
4824
+ height: 1.5rem;
4825
+ }
4826
+ .\[\&\>button\]\:items-center>button {
4827
+ align-items: center;
4828
+ }
4829
+ .\[\&\>button\]\:justify-center>button {
4830
+ justify-content: center;
4831
+ }
4832
+ .\[\&\>button\]\:rounded-full>button {
4833
+ border-radius: 9999px;
4834
+ }
4835
+ .\[\&\>button\]\:bg-muted>button {
4836
+ background-color: hsl(var(--najm-muted));
4837
+ }
4838
+ .\[\&\>button\]\:text-muted-foreground>button {
4839
+ color: hsl(var(--najm-muted-foreground));
4840
+ }
4841
+ .\[\&\>button\]\:opacity-100>button {
4842
+ opacity: 1;
4843
+ }
4844
+ .\[\&\>button\]\:ring-offset-0>button {
4845
+ --tw-ring-offset-width: 0px;
4846
+ }
4847
+ .\[\&\>button\]\:hover\:bg-secondary:hover>button {
4848
+ background-color: hsl(var(--najm-secondary));
4849
+ }
4850
+ .\[\&\>button\]\:hover\:text-foreground:hover>button {
4851
+ color: hsl(var(--najm-foreground));
4852
+ }
4853
+ .dark\:\[\&\>button\]\:bg-\[\#4d5a6d\]>button:is(.dark *) {
4854
+ --tw-bg-opacity: 1;
4855
+ background-color: rgb(77 90 109 / var(--tw-bg-opacity, 1));
4856
+ }
4857
+ .dark\:\[\&\>button\]\:text-white>button:is(.dark *) {
4858
+ --tw-text-opacity: 1;
4859
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
4860
+ }
4861
+ .dark\:\[\&\>button\]\:hover\:bg-\[\#647186\]:hover>button:is(.dark *) {
4862
+ --tw-bg-opacity: 1;
4863
+ background-color: rgb(100 113 134 / var(--tw-bg-opacity, 1));
4864
+ }
4865
+ .dark\:\[\&\>button\]\:hover\:text-white:hover>button:is(.dark *) {
4866
+ --tw-text-opacity: 1;
4867
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
3607
4868
  }
3608
4869
  .\[\&\>svg\]\:pointer-events-none>svg {
3609
4870
  pointer-events: none;
@@ -3716,18 +4977,69 @@ video {
3716
4977
  .\[\&_svg\]\:shrink-0 svg {
3717
4978
  flex-shrink: 0;
3718
4979
  }
4980
+ .\[\&_th\]\:text-amber-700 th {
4981
+ --tw-text-opacity: 1;
4982
+ color: rgb(180 83 9 / var(--tw-text-opacity, 1));
4983
+ }
4984
+ .\[\&_th\]\:text-blue-700 th {
4985
+ --tw-text-opacity: 1;
4986
+ color: rgb(29 78 216 / var(--tw-text-opacity, 1));
4987
+ }
4988
+ .\[\&_th\]\:text-emerald-700 th {
4989
+ --tw-text-opacity: 1;
4990
+ color: rgb(4 120 87 / var(--tw-text-opacity, 1));
4991
+ }
4992
+ .\[\&_th\]\:text-primary th {
4993
+ color: hsl(var(--najm-primary));
4994
+ }
4995
+ .\[\&_th\]\:text-rose-700 th {
4996
+ --tw-text-opacity: 1;
4997
+ color: rgb(190 18 60 / var(--tw-text-opacity, 1));
4998
+ }
4999
+ .\[\&_th\]\:text-slate-100 th {
5000
+ --tw-text-opacity: 1;
5001
+ color: rgb(241 245 249 / var(--tw-text-opacity, 1));
5002
+ }
5003
+ .\[\&_th\]\:text-violet-700 th {
5004
+ --tw-text-opacity: 1;
5005
+ color: rgb(109 40 217 / var(--tw-text-opacity, 1));
5006
+ }
5007
+ .dark\:\[\&_th\]\:text-amber-300 th:is(.dark *) {
5008
+ --tw-text-opacity: 1;
5009
+ color: rgb(252 211 77 / var(--tw-text-opacity, 1));
5010
+ }
5011
+ .dark\:\[\&_th\]\:text-blue-300 th:is(.dark *) {
5012
+ --tw-text-opacity: 1;
5013
+ color: rgb(147 197 253 / var(--tw-text-opacity, 1));
5014
+ }
5015
+ .dark\:\[\&_th\]\:text-emerald-300 th:is(.dark *) {
5016
+ --tw-text-opacity: 1;
5017
+ color: rgb(110 231 183 / var(--tw-text-opacity, 1));
5018
+ }
5019
+ .dark\:\[\&_th\]\:text-rose-300 th:is(.dark *) {
5020
+ --tw-text-opacity: 1;
5021
+ color: rgb(253 164 175 / var(--tw-text-opacity, 1));
5022
+ }
5023
+ .dark\:\[\&_th\]\:text-slate-300 th:is(.dark *) {
5024
+ --tw-text-opacity: 1;
5025
+ color: rgb(203 213 225 / var(--tw-text-opacity, 1));
5026
+ }
5027
+ .dark\:\[\&_th\]\:text-violet-300 th:is(.dark *) {
5028
+ --tw-text-opacity: 1;
5029
+ color: rgb(196 181 253 / var(--tw-text-opacity, 1));
5030
+ }
3719
5031
  .\[\&_tr\:last-child\]\:border-0 tr:last-child {
3720
5032
  border-width: 0px;
3721
5033
  }
3722
5034
  .\[\&_tr\]\:border-b tr {
3723
5035
  border-bottom-width: 1px;
3724
5036
  }
5037
+ .\[\&_tr\]\:border-border tr {
5038
+ border-color: hsl(var(--najm-border));
5039
+ }
3725
5040
  .\[\&_tr\]\:border-border\/40 tr {
3726
5041
  border-color: hsl(var(--najm-border) / 0.4);
3727
5042
  }
3728
- .\[\&_tr\]\:hover\:bg-transparent:hover tr {
3729
- background-color: transparent;
3730
- }
3731
5043
  a.\[a\&\]\:hover\:bg-accent\/50:hover {
3732
5044
  background-color: hsl(var(--najm-accent) / 0.5);
3733
5045
  }