najm-kit 0.0.7 → 0.0.8

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;
@@ -659,6 +1330,9 @@ video {
659
1330
  top: 0px;
660
1331
  bottom: 0px;
661
1332
  }
1333
+ .-top-7 {
1334
+ top: -1.75rem;
1335
+ }
662
1336
  .bottom-0 {
663
1337
  bottom: 0px;
664
1338
  }
@@ -668,12 +1342,18 @@ video {
668
1342
  .bottom-6 {
669
1343
  bottom: 1.5rem;
670
1344
  }
1345
+ .end-0 {
1346
+ inset-inline-end: 0px;
1347
+ }
671
1348
  .left-0 {
672
1349
  left: 0px;
673
1350
  }
674
1351
  .left-1 {
675
1352
  left: 0.25rem;
676
1353
  }
1354
+ .left-1\/2 {
1355
+ left: 50%;
1356
+ }
677
1357
  .left-2 {
678
1358
  left: 0.5rem;
679
1359
  }
@@ -701,6 +1381,12 @@ video {
701
1381
  .right-4 {
702
1382
  right: 1rem;
703
1383
  }
1384
+ .start-0 {
1385
+ inset-inline-start: 0px;
1386
+ }
1387
+ .start-1\/2 {
1388
+ inset-inline-start: 50%;
1389
+ }
704
1390
  .top-0 {
705
1391
  top: 0px;
706
1392
  }
@@ -773,6 +1459,9 @@ video {
773
1459
  .mb-4 {
774
1460
  margin-bottom: 1rem;
775
1461
  }
1462
+ .mb-6 {
1463
+ margin-bottom: 1.5rem;
1464
+ }
776
1465
  .ml-0\.5 {
777
1466
  margin-left: 0.125rem;
778
1467
  }
@@ -809,6 +1498,9 @@ video {
809
1498
  .mt-4 {
810
1499
  margin-top: 1rem;
811
1500
  }
1501
+ .mt-6 {
1502
+ margin-top: 1.5rem;
1503
+ }
812
1504
  .mt-auto {
813
1505
  margin-top: auto;
814
1506
  }
@@ -1050,6 +1742,9 @@ video {
1050
1742
  .min-h-32 {
1051
1743
  min-height: 8rem;
1052
1744
  }
1745
+ .min-h-64 {
1746
+ min-height: 16rem;
1747
+ }
1053
1748
  .min-h-8 {
1054
1749
  min-height: 2rem;
1055
1750
  }
@@ -1059,6 +1754,9 @@ video {
1059
1754
  .min-h-\[400px\] {
1060
1755
  min-height: 400px;
1061
1756
  }
1757
+ .w-1 {
1758
+ width: 0.25rem;
1759
+ }
1062
1760
  .w-1\.5 {
1063
1761
  width: 0.375rem;
1064
1762
  }
@@ -1068,6 +1766,9 @@ video {
1068
1766
  .w-10 {
1069
1767
  width: 2.5rem;
1070
1768
  }
1769
+ .w-11 {
1770
+ width: 2.75rem;
1771
+ }
1071
1772
  .w-12 {
1072
1773
  width: 3rem;
1073
1774
  }
@@ -1128,9 +1829,6 @@ video {
1128
1829
  .w-6 {
1129
1830
  width: 1.5rem;
1130
1831
  }
1131
- .w-60 {
1132
- width: 15rem;
1133
- }
1134
1832
  .w-7 {
1135
1833
  width: 1.75rem;
1136
1834
  }
@@ -1149,8 +1847,8 @@ video {
1149
1847
  .w-\[380px\] {
1150
1848
  width: 380px;
1151
1849
  }
1152
- .w-\[70px\] {
1153
- width: 70px;
1850
+ .w-\[80px\] {
1851
+ width: 80px;
1154
1852
  }
1155
1853
  .w-\[var\(--radix-popover-trigger-width\)\] {
1156
1854
  width: var(--radix-popover-trigger-width);
@@ -1186,8 +1884,8 @@ video {
1186
1884
  .min-w-9 {
1187
1885
  min-width: 2.25rem;
1188
1886
  }
1189
- .min-w-\[110px\] {
1190
- min-width: 110px;
1887
+ .min-w-\[160px\] {
1888
+ min-width: 160px;
1191
1889
  }
1192
1890
  .min-w-\[50px\] {
1193
1891
  min-width: 50px;
@@ -1201,6 +1899,9 @@ video {
1201
1899
  .max-w-\[280px\] {
1202
1900
  max-width: 280px;
1203
1901
  }
1902
+ .max-w-\[380px\] {
1903
+ max-width: 380px;
1904
+ }
1204
1905
  .max-w-\[95vw\] {
1205
1906
  max-width: 95vw;
1206
1907
  }
@@ -1231,6 +1932,10 @@ video {
1231
1932
  .border-collapse {
1232
1933
  border-collapse: collapse;
1233
1934
  }
1935
+ .-translate-x-1\/2 {
1936
+ --tw-translate-x: -50%;
1937
+ 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));
1938
+ }
1234
1939
  .-translate-x-full {
1235
1940
  --tw-translate-x: -100%;
1236
1941
  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 +1948,18 @@ video {
1243
1948
  --tw-translate-x: 0px;
1244
1949
  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
1950
  }
1951
+ .translate-x-1\/2 {
1952
+ --tw-translate-x: 50%;
1953
+ 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));
1954
+ }
1246
1955
  .translate-x-\[-50\%\] {
1247
1956
  --tw-translate-x: -50%;
1248
1957
  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
1958
  }
1959
+ .translate-y-1\/2 {
1960
+ --tw-translate-y: 50%;
1961
+ 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));
1962
+ }
1250
1963
  .translate-y-\[-50\%\] {
1251
1964
  --tw-translate-y: -50%;
1252
1965
  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 +2066,9 @@ video {
1353
2066
  .grid-cols-1 {
1354
2067
  grid-template-columns: repeat(1, minmax(0, 1fr));
1355
2068
  }
2069
+ .grid-cols-2 {
2070
+ grid-template-columns: repeat(2, minmax(0, 1fr));
2071
+ }
1356
2072
  .grid-cols-7 {
1357
2073
  grid-template-columns: repeat(7, minmax(0, 1fr));
1358
2074
  }
@@ -1455,11 +2171,6 @@ video {
1455
2171
  margin-right: calc(0.25rem * var(--tw-space-x-reverse));
1456
2172
  margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
1457
2173
  }
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
2174
  .space-y-0 > :not([hidden]) ~ :not([hidden]) {
1464
2175
  --tw-space-y-reverse: 0;
1465
2176
  margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
@@ -1485,6 +2196,11 @@ video {
1485
2196
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
1486
2197
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
1487
2198
  }
2199
+ .space-y-3 > :not([hidden]) ~ :not([hidden]) {
2200
+ --tw-space-y-reverse: 0;
2201
+ margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
2202
+ margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
2203
+ }
1488
2204
  .space-y-4 > :not([hidden]) ~ :not([hidden]) {
1489
2205
  --tw-space-y-reverse: 0;
1490
2206
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
@@ -1504,21 +2220,12 @@ video {
1504
2220
  .justify-self-end {
1505
2221
  justify-self: end;
1506
2222
  }
1507
- .overflow-auto {
1508
- overflow: auto;
1509
- }
1510
2223
  .overflow-hidden {
1511
2224
  overflow: hidden;
1512
2225
  }
1513
2226
  .overflow-visible {
1514
2227
  overflow: visible;
1515
2228
  }
1516
- .overflow-x-auto {
1517
- overflow-x: auto;
1518
- }
1519
- .overflow-y-auto {
1520
- overflow-y: auto;
1521
- }
1522
2229
  .overflow-x-hidden {
1523
2230
  overflow-x: hidden;
1524
2231
  }
@@ -1542,6 +2249,12 @@ video {
1542
2249
  .rounded-\[10px\] {
1543
2250
  border-radius: 10px;
1544
2251
  }
2252
+ .rounded-\[18px\] {
2253
+ border-radius: 18px;
2254
+ }
2255
+ .rounded-\[20px\] {
2256
+ border-radius: 20px;
2257
+ }
1545
2258
  .rounded-\[4px\] {
1546
2259
  border-radius: 4px;
1547
2260
  }
@@ -1609,9 +2322,6 @@ video {
1609
2322
  .border-dashed {
1610
2323
  border-style: dashed;
1611
2324
  }
1612
- .border-none {
1613
- border-style: none;
1614
- }
1615
2325
  .\!border-amber-500\/40 {
1616
2326
  border-color: rgb(245 158 11 / 0.4) !important;
1617
2327
  }
@@ -1624,6 +2334,13 @@ video {
1624
2334
  .\!border-red-500\/40 {
1625
2335
  border-color: rgb(239 68 68 / 0.4) !important;
1626
2336
  }
2337
+ .\!border-red-600 {
2338
+ --tw-border-opacity: 1 !important;
2339
+ border-color: rgb(220 38 38 / var(--tw-border-opacity, 1)) !important;
2340
+ }
2341
+ .border-accent {
2342
+ border-color: hsl(var(--najm-accent));
2343
+ }
1627
2344
  .border-amber-400\/20 {
1628
2345
  border-color: rgb(251 191 36 / 0.2);
1629
2346
  }
@@ -1633,9 +2350,17 @@ video {
1633
2350
  .border-amber-400\/60 {
1634
2351
  border-color: rgb(251 191 36 / 0.6);
1635
2352
  }
2353
+ .border-amber-500 {
2354
+ --tw-border-opacity: 1;
2355
+ border-color: rgb(245 158 11 / var(--tw-border-opacity, 1));
2356
+ }
1636
2357
  .border-amber-500\/30 {
1637
2358
  border-color: rgb(245 158 11 / 0.3);
1638
2359
  }
2360
+ .border-amber-600 {
2361
+ --tw-border-opacity: 1;
2362
+ border-color: rgb(217 119 6 / var(--tw-border-opacity, 1));
2363
+ }
1639
2364
  .border-border {
1640
2365
  border-color: hsl(var(--najm-border));
1641
2366
  }
@@ -1651,12 +2376,19 @@ video {
1651
2376
  .border-border\/70 {
1652
2377
  border-color: hsl(var(--najm-border) / 0.7);
1653
2378
  }
2379
+ .border-destructive {
2380
+ border-color: hsl(var(--najm-destructive));
2381
+ }
1654
2382
  .border-destructive\/30 {
1655
2383
  border-color: hsl(var(--najm-destructive) / 0.3);
1656
2384
  }
1657
2385
  .border-destructive\/40 {
1658
2386
  border-color: hsl(var(--najm-destructive) / 0.4);
1659
2387
  }
2388
+ .border-emerald-500 {
2389
+ --tw-border-opacity: 1;
2390
+ border-color: rgb(16 185 129 / var(--tw-border-opacity, 1));
2391
+ }
1660
2392
  .border-emerald-500\/20 {
1661
2393
  border-color: rgb(16 185 129 / 0.2);
1662
2394
  }
@@ -1672,6 +2404,10 @@ video {
1672
2404
  .border-green-500\/30 {
1673
2405
  border-color: rgb(34 197 94 / 0.3);
1674
2406
  }
2407
+ .border-green-600 {
2408
+ --tw-border-opacity: 1;
2409
+ border-color: rgb(22 163 74 / var(--tw-border-opacity, 1));
2410
+ }
1675
2411
  .border-indigo-500\/20 {
1676
2412
  border-color: rgb(99 102 241 / 0.2);
1677
2413
  }
@@ -1681,8 +2417,8 @@ video {
1681
2417
  .border-input {
1682
2418
  border-color: hsl(var(--najm-input));
1683
2419
  }
1684
- .border-muted-foreground\/20 {
1685
- border-color: hsl(var(--najm-muted-foreground) / 0.2);
2420
+ .border-muted-foreground {
2421
+ border-color: hsl(var(--najm-muted-foreground));
1686
2422
  }
1687
2423
  .border-muted-foreground\/60 {
1688
2424
  border-color: hsl(var(--najm-muted-foreground) / 0.6);
@@ -1705,10 +2441,6 @@ video {
1705
2441
  .border-primary\/30 {
1706
2442
  border-color: hsl(var(--najm-primary) / 0.3);
1707
2443
  }
1708
- .border-red-500 {
1709
- --tw-border-opacity: 1;
1710
- border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));
1711
- }
1712
2444
  .border-red-500\/20 {
1713
2445
  border-color: rgb(239 68 68 / 0.2);
1714
2446
  }
@@ -1721,9 +2453,20 @@ video {
1721
2453
  .border-red-500\/60 {
1722
2454
  border-color: rgb(239 68 68 / 0.6);
1723
2455
  }
2456
+ .border-red-600 {
2457
+ --tw-border-opacity: 1;
2458
+ border-color: rgb(220 38 38 / var(--tw-border-opacity, 1));
2459
+ }
2460
+ .border-secondary {
2461
+ border-color: hsl(var(--najm-secondary));
2462
+ }
1724
2463
  .border-secondary\/60 {
1725
2464
  border-color: hsl(var(--najm-secondary) / 0.6);
1726
2465
  }
2466
+ .border-sky-500 {
2467
+ --tw-border-opacity: 1;
2468
+ border-color: rgb(14 165 233 / var(--tw-border-opacity, 1));
2469
+ }
1727
2470
  .border-sky-500\/20 {
1728
2471
  border-color: rgb(14 165 233 / 0.2);
1729
2472
  }
@@ -1811,6 +2554,9 @@ video {
1811
2554
  .bg-black\/50 {
1812
2555
  background-color: rgb(0 0 0 / 0.5);
1813
2556
  }
2557
+ .bg-blue-600\/20 {
2558
+ background-color: rgb(37 99 235 / 0.2);
2559
+ }
1814
2560
  .bg-border {
1815
2561
  background-color: hsl(var(--najm-border));
1816
2562
  }
@@ -1843,6 +2589,9 @@ video {
1843
2589
  --tw-bg-opacity: 1;
1844
2590
  background-color: rgb(5 150 105 / var(--tw-bg-opacity, 1));
1845
2591
  }
2592
+ .bg-emerald-600\/20 {
2593
+ background-color: rgb(5 150 105 / 0.2);
2594
+ }
1846
2595
  .bg-foreground {
1847
2596
  background-color: hsl(var(--najm-foreground));
1848
2597
  }
@@ -1865,15 +2614,15 @@ video {
1865
2614
  .bg-muted-foreground {
1866
2615
  background-color: hsl(var(--najm-muted-foreground));
1867
2616
  }
2617
+ .bg-muted-foreground\/30 {
2618
+ background-color: hsl(var(--najm-muted-foreground) / 0.3);
2619
+ }
1868
2620
  .bg-muted\/30 {
1869
2621
  background-color: hsl(var(--najm-muted) / 0.3);
1870
2622
  }
1871
2623
  .bg-muted\/40 {
1872
2624
  background-color: hsl(var(--najm-muted) / 0.4);
1873
2625
  }
1874
- .bg-muted\/80 {
1875
- background-color: hsl(var(--najm-muted) / 0.8);
1876
- }
1877
2626
  .bg-orange-500 {
1878
2627
  --tw-bg-opacity: 1;
1879
2628
  background-color: rgb(249 115 22 / var(--tw-bg-opacity, 1));
@@ -1897,6 +2646,9 @@ video {
1897
2646
  .bg-primary\/10 {
1898
2647
  background-color: hsl(var(--najm-primary) / 0.1);
1899
2648
  }
2649
+ .bg-primary\/15 {
2650
+ background-color: hsl(var(--najm-primary) / 0.15);
2651
+ }
1900
2652
  .bg-primary\/20 {
1901
2653
  background-color: hsl(var(--najm-primary) / 0.2);
1902
2654
  }
@@ -1906,10 +2658,6 @@ video {
1906
2658
  .bg-primary\/50 {
1907
2659
  background-color: hsl(var(--najm-primary) / 0.5);
1908
2660
  }
1909
- .bg-red-100 {
1910
- --tw-bg-opacity: 1;
1911
- background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));
1912
- }
1913
2661
  .bg-red-500 {
1914
2662
  --tw-bg-opacity: 1;
1915
2663
  background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));
@@ -1921,6 +2669,9 @@ video {
1921
2669
  --tw-bg-opacity: 1;
1922
2670
  background-color: rgb(244 63 94 / var(--tw-bg-opacity, 1));
1923
2671
  }
2672
+ .bg-rose-600\/20 {
2673
+ background-color: rgb(225 29 72 / 0.2);
2674
+ }
1924
2675
  .bg-secondary {
1925
2676
  background-color: hsl(var(--najm-secondary));
1926
2677
  }
@@ -1955,12 +2706,18 @@ video {
1955
2706
  .bg-slate-500\/10 {
1956
2707
  background-color: rgb(100 116 139 / 0.1);
1957
2708
  }
2709
+ .bg-slate-700\/60 {
2710
+ background-color: rgb(51 65 85 / 0.6);
2711
+ }
1958
2712
  .bg-tertiary {
1959
2713
  background-color: hsl(var(--najm-tertiary));
1960
2714
  }
1961
2715
  .bg-transparent {
1962
2716
  background-color: transparent;
1963
2717
  }
2718
+ .bg-violet-600\/20 {
2719
+ background-color: rgb(124 58 237 / 0.2);
2720
+ }
1964
2721
  .bg-white\/5 {
1965
2722
  background-color: rgb(255 255 255 / 0.05);
1966
2723
  }
@@ -1970,9 +2727,6 @@ video {
1970
2727
  .\!bg-none {
1971
2728
  background-image: none !important;
1972
2729
  }
1973
- .bg-none {
1974
- background-image: none;
1975
- }
1976
2730
  .fill-\[\#d6d6d6\] {
1977
2731
  fill: #d6d6d6;
1978
2732
  }
@@ -2177,6 +2931,9 @@ video {
2177
2931
  .pt-3 {
2178
2932
  padding-top: 0.75rem;
2179
2933
  }
2934
+ .pt-8 {
2935
+ padding-top: 2rem;
2936
+ }
2180
2937
  .text-left {
2181
2938
  text-align: left;
2182
2939
  }
@@ -2328,6 +3085,9 @@ video {
2328
3085
  .text-destructive {
2329
3086
  color: hsl(var(--najm-destructive));
2330
3087
  }
3088
+ .text-destructive-foreground {
3089
+ color: hsl(var(--najm-destructive-foreground));
3090
+ }
2331
3091
  .text-emerald-400 {
2332
3092
  --tw-text-opacity: 1;
2333
3093
  color: rgb(52 211 153 / var(--tw-text-opacity, 1));
@@ -2491,6 +3251,16 @@ video {
2491
3251
  .opacity-85 {
2492
3252
  opacity: 0.85;
2493
3253
  }
3254
+ .shadow {
3255
+ --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
3256
+ --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
3257
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3258
+ }
3259
+ .shadow-2xl {
3260
+ --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
3261
+ --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
3262
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3263
+ }
2494
3264
  .shadow-lg {
2495
3265
  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
2496
3266
  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
@@ -2678,6 +3448,54 @@ video {
2678
3448
  .ease-out {
2679
3449
  animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
2680
3450
  }
3451
+ /* Scrollable, but the scrollbar reserves no layout space (hidden in all
3452
+ browsers). `overflow: overlay` was removed from Chrome (~v121) and now
3453
+ behaves like `auto`, so hiding the bar is the only pure-CSS way to avoid
3454
+ the reserved gutter. Scroll via wheel / trackpad / keyboard. */
3455
+ .najm-overlay-scroll {
3456
+ overflow: auto;
3457
+ scrollbar-width: none; /* Firefox */
3458
+ }
3459
+ .najm-overlay-scroll::-webkit-scrollbar {
3460
+ display: none; /* Chromium / Safari */
3461
+ }
3462
+ .najm-overlay-scroll-y {
3463
+ overflow-y: auto;
3464
+ scrollbar-width: none;
3465
+ }
3466
+ .najm-overlay-scroll-y::-webkit-scrollbar {
3467
+ display: none;
3468
+ }
3469
+ .najm-overlay-scroll-x {
3470
+ overflow-x: auto;
3471
+ scrollbar-width: none;
3472
+ }
3473
+ .najm-overlay-scroll-x::-webkit-scrollbar {
3474
+ display: none;
3475
+ }
3476
+
3477
+ /* OverlayScrollbars theme used by the <NajmScroll> component — a thin,
3478
+ translucent slate bar that floats over content with no reserved space. */
3479
+ .os-theme-najm {
3480
+ --os-size: 10px;
3481
+ --os-padding-perpendicular: 2px;
3482
+ --os-padding-axis: 2px;
3483
+ --os-track-border-radius: 9999px;
3484
+ --os-handle-border-radius: 9999px;
3485
+ --os-handle-bg: rgba(148, 163, 184, 0.3);
3486
+ --os-handle-bg-hover: rgba(148, 163, 184, 0.45);
3487
+ --os-handle-bg-active: rgba(148, 163, 184, 0.6);
3488
+ --os-handle-min-size: 33px;
3489
+ --os-handle-perpendicular-size: 60%;
3490
+ --os-handle-perpendicular-size-hover: 90%;
3491
+ }
3492
+
3493
+ /* Darker, more subtle handle in dark mode */
3494
+ .dark .os-theme-najm {
3495
+ --os-handle-bg: rgba(82, 82, 91, 0.45);
3496
+ --os-handle-bg-hover: rgba(113, 113, 122, 0.6);
3497
+ --os-handle-bg-active: rgba(113, 113, 122, 0.75);
3498
+ }
2681
3499
  .selection\:bg-primary *::-moz-selection {
2682
3500
  background-color: hsl(var(--najm-primary));
2683
3501
  }
@@ -2736,6 +3554,12 @@ video {
2736
3554
  .focus-within\:z-20:focus-within {
2737
3555
  z-index: 20;
2738
3556
  }
3557
+ .focus-within\:border-primary:focus-within {
3558
+ border-color: hsl(var(--najm-primary));
3559
+ }
3560
+ .focus-within\:opacity-100:focus-within {
3561
+ opacity: 1;
3562
+ }
2739
3563
  .hover\:scale-105:hover {
2740
3564
  --tw-scale-x: 1.05;
2741
3565
  --tw-scale-y: 1.05;
@@ -2774,6 +3598,12 @@ video {
2774
3598
  --tw-bg-opacity: 1;
2775
3599
  background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));
2776
3600
  }
3601
+ .hover\:bg-amber-500\/5:hover {
3602
+ background-color: rgb(245 158 11 / 0.05);
3603
+ }
3604
+ .hover\:bg-blue-500\/5:hover {
3605
+ background-color: rgb(59 130 246 / 0.05);
3606
+ }
2777
3607
  .hover\:bg-card:hover {
2778
3608
  background-color: hsl(var(--najm-card));
2779
3609
  }
@@ -2783,6 +3613,9 @@ video {
2783
3613
  .hover\:bg-destructive\/90:hover {
2784
3614
  background-color: hsl(var(--najm-destructive) / 0.9);
2785
3615
  }
3616
+ .hover\:bg-emerald-500\/5:hover {
3617
+ background-color: rgb(16 185 129 / 0.05);
3618
+ }
2786
3619
  .hover\:bg-emerald-700:hover {
2787
3620
  --tw-bg-opacity: 1;
2788
3621
  background-color: rgb(4 120 87 / var(--tw-bg-opacity, 1));
@@ -2820,6 +3653,9 @@ video {
2820
3653
  .hover\:bg-red-500\/10:hover {
2821
3654
  background-color: rgb(239 68 68 / 0.1);
2822
3655
  }
3656
+ .hover\:bg-rose-500\/5:hover {
3657
+ background-color: rgb(244 63 94 / 0.05);
3658
+ }
2823
3659
  .hover\:bg-secondary\/80:hover {
2824
3660
  background-color: hsl(var(--najm-secondary) / 0.8);
2825
3661
  }
@@ -2827,12 +3663,18 @@ video {
2827
3663
  --tw-bg-opacity: 1;
2828
3664
  background-color: rgb(3 105 161 / var(--tw-bg-opacity, 1));
2829
3665
  }
3666
+ .hover\:bg-slate-500\/5:hover {
3667
+ background-color: rgb(100 116 139 / 0.05);
3668
+ }
2830
3669
  .hover\:bg-tertiary\/80:hover {
2831
3670
  background-color: hsl(var(--najm-tertiary) / 0.8);
2832
3671
  }
2833
3672
  .hover\:bg-transparent:hover {
2834
3673
  background-color: transparent;
2835
3674
  }
3675
+ .hover\:bg-violet-500\/5:hover {
3676
+ background-color: rgb(139 92 246 / 0.05);
3677
+ }
2836
3678
  .hover\:text-accent-foreground:hover {
2837
3679
  color: hsl(var(--najm-accent-foreground));
2838
3680
  }
@@ -2852,6 +3694,9 @@ video {
2852
3694
  --tw-text-opacity: 1;
2853
3695
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
2854
3696
  }
3697
+ .hover\:text-secondary-foreground:hover {
3698
+ color: hsl(var(--najm-secondary-foreground));
3699
+ }
2855
3700
  .hover\:underline:hover {
2856
3701
  text-decoration-line: underline;
2857
3702
  }
@@ -2861,10 +3706,8 @@ video {
2861
3706
  .hover\:opacity-80:hover {
2862
3707
  opacity: 0.8;
2863
3708
  }
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);
3709
+ .hover\:opacity-90:hover {
3710
+ opacity: 0.9;
2868
3711
  }
2869
3712
  .hover\:ring-1:hover {
2870
3713
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
@@ -2889,6 +3732,9 @@ video {
2889
3732
  .focus\:text-primary-foreground:focus {
2890
3733
  color: hsl(var(--najm-primary-foreground));
2891
3734
  }
3735
+ .focus\:opacity-100:focus {
3736
+ opacity: 1;
3737
+ }
2892
3738
  .focus\:outline-none:focus {
2893
3739
  outline: 2px solid transparent;
2894
3740
  outline-offset: 2px;
@@ -2918,6 +3764,9 @@ video {
2918
3764
  .focus-visible\:border-transparent:focus-visible {
2919
3765
  border-color: transparent;
2920
3766
  }
3767
+ .focus-visible\:opacity-100:focus-visible {
3768
+ opacity: 1;
3769
+ }
2921
3770
  .focus-visible\:outline-none:focus-visible {
2922
3771
  outline: 2px solid transparent;
2923
3772
  outline-offset: 2px;
@@ -2940,6 +3789,9 @@ video {
2940
3789
  .focus-visible\:ring-destructive\/20:focus-visible {
2941
3790
  --tw-ring-color: hsl(var(--najm-destructive) / 0.2);
2942
3791
  }
3792
+ .focus-visible\:ring-destructive\/40:focus-visible {
3793
+ --tw-ring-color: hsl(var(--najm-destructive) / 0.4);
3794
+ }
2943
3795
  .focus-visible\:ring-ring:focus-visible {
2944
3796
  --tw-ring-color: hsl(var(--najm-ring));
2945
3797
  }
@@ -3304,6 +4156,25 @@ video {
3304
4156
  .group[data-disabled="true"] .group-data-\[disabled\=true\]\:opacity-50 {
3305
4157
  opacity: 0.5;
3306
4158
  }
4159
+ .dark\:border-0:is(.dark *) {
4160
+ border-width: 0px;
4161
+ }
4162
+ .dark\:bg-\[\#222b38\]:is(.dark *) {
4163
+ --tw-bg-opacity: 1;
4164
+ background-color: rgb(34 43 56 / var(--tw-bg-opacity, 1));
4165
+ }
4166
+ .dark\:bg-\[\#3e4a5d\]:is(.dark *) {
4167
+ --tw-bg-opacity: 1;
4168
+ background-color: rgb(62 74 93 / var(--tw-bg-opacity, 1));
4169
+ }
4170
+ .dark\:bg-\[\#5a1822\]:is(.dark *) {
4171
+ --tw-bg-opacity: 1;
4172
+ background-color: rgb(90 24 34 / var(--tw-bg-opacity, 1));
4173
+ }
4174
+ .dark\:bg-\[\#dc4d61\]:is(.dark *) {
4175
+ --tw-bg-opacity: 1;
4176
+ background-color: rgb(220 77 97 / var(--tw-bg-opacity, 1));
4177
+ }
3307
4178
  .dark\:bg-destructive\/15:is(.dark *) {
3308
4179
  background-color: hsl(var(--najm-destructive) / 0.15);
3309
4180
  }
@@ -3316,15 +4187,16 @@ video {
3316
4187
  .dark\:bg-input\/30:is(.dark *) {
3317
4188
  background-color: hsl(var(--najm-input) / 0.3);
3318
4189
  }
3319
- .dark\:bg-red-900\/30:is(.dark *) {
3320
- background-color: rgb(127 29 29 / 0.3);
3321
- }
3322
4190
  .dark\:bg-transparent:is(.dark *) {
3323
4191
  background-color: transparent;
3324
4192
  }
3325
4193
  .dark\:bg-yellow-500\/10:is(.dark *) {
3326
4194
  background-color: rgb(234 179 8 / 0.1);
3327
4195
  }
4196
+ .dark\:text-\[\#aab4c2\]:is(.dark *) {
4197
+ --tw-text-opacity: 1;
4198
+ color: rgb(170 180 194 / var(--tw-text-opacity, 1));
4199
+ }
3328
4200
  .dark\:text-amber-300:is(.dark *) {
3329
4201
  --tw-text-opacity: 1;
3330
4202
  color: rgb(252 211 77 / var(--tw-text-opacity, 1));
@@ -3345,22 +4217,41 @@ video {
3345
4217
  --tw-text-opacity: 1;
3346
4218
  color: rgb(125 211 252 / var(--tw-text-opacity, 1));
3347
4219
  }
4220
+ .dark\:text-white:is(.dark *) {
4221
+ --tw-text-opacity: 1;
4222
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
4223
+ }
3348
4224
  .dark\:text-yellow-300:is(.dark *) {
3349
4225
  --tw-text-opacity: 1;
3350
4226
  color: rgb(253 224 71 / var(--tw-text-opacity, 1));
3351
4227
  }
4228
+ .dark\:hover\:bg-\[\#4b586c\]:hover:is(.dark *) {
4229
+ --tw-bg-opacity: 1;
4230
+ background-color: rgb(75 88 108 / var(--tw-bg-opacity, 1));
4231
+ }
4232
+ .dark\:hover\:bg-\[\#e15f70\]:hover:is(.dark *) {
4233
+ --tw-bg-opacity: 1;
4234
+ background-color: rgb(225 95 112 / var(--tw-bg-opacity, 1));
4235
+ }
3352
4236
  .dark\:hover\:bg-accent\/50:hover:is(.dark *) {
3353
4237
  background-color: hsl(var(--najm-accent) / 0.5);
3354
4238
  }
3355
4239
  .dark\:hover\:bg-input\/50:hover:is(.dark *) {
3356
4240
  background-color: hsl(var(--najm-input) / 0.5);
3357
4241
  }
3358
- .dark\:hover\:bg-transparent:hover:is(.dark *) {
3359
- background-color: transparent;
4242
+ .dark\:hover\:text-white:hover:is(.dark *) {
4243
+ --tw-text-opacity: 1;
4244
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
4245
+ }
4246
+ .dark\:focus-visible\:ring-\[\#dc4d61\]\/40:focus-visible:is(.dark *) {
4247
+ --tw-ring-color: rgb(220 77 97 / 0.4);
3360
4248
  }
3361
4249
  .dark\:focus-visible\:ring-destructive\/40:focus-visible:is(.dark *) {
3362
4250
  --tw-ring-color: hsl(var(--najm-destructive) / 0.4);
3363
4251
  }
4252
+ .dark\:data-\[state\=active\]\:bg-card[data-state="active"]:is(.dark *) {
4253
+ background-color: hsl(var(--najm-card));
4254
+ }
3364
4255
  .dark\:data-\[state\=checked\]\:bg-primary[data-state="checked"]:is(.dark *) {
3365
4256
  background-color: hsl(var(--najm-primary));
3366
4257
  }
@@ -3372,6 +4263,30 @@ video {
3372
4263
  }
3373
4264
  @media (min-width: 640px) {
3374
4265
 
4266
+ .sm\:bottom-0 {
4267
+ bottom: 0px;
4268
+ }
4269
+
4270
+ .sm\:end-0 {
4271
+ inset-inline-end: 0px;
4272
+ }
4273
+
4274
+ .sm\:start-0 {
4275
+ inset-inline-start: 0px;
4276
+ }
4277
+
4278
+ .sm\:start-1\/2 {
4279
+ inset-inline-start: 50%;
4280
+ }
4281
+
4282
+ .sm\:top-0 {
4283
+ top: 0px;
4284
+ }
4285
+
4286
+ .sm\:top-1\/2 {
4287
+ top: 50%;
4288
+ }
4289
+
3375
4290
  .sm\:inline {
3376
4291
  display: inline;
3377
4292
  }
@@ -3384,8 +4299,8 @@ video {
3384
4299
  display: none;
3385
4300
  }
3386
4301
 
3387
- .sm\:w-\[calc\(50\%-12px\)\] {
3388
- width: calc(50% - 12px);
4302
+ .sm\:w-40 {
4303
+ width: 10rem;
3389
4304
  }
3390
4305
 
3391
4306
  .sm\:max-w-sm {
@@ -3396,6 +4311,26 @@ video {
3396
4311
  flex: 1 1 0%;
3397
4312
  }
3398
4313
 
4314
+ .sm\:-translate-x-1\/2 {
4315
+ --tw-translate-x: -50%;
4316
+ 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));
4317
+ }
4318
+
4319
+ .sm\:-translate-y-1\/2 {
4320
+ --tw-translate-y: -50%;
4321
+ 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));
4322
+ }
4323
+
4324
+ .sm\:translate-x-1\/2 {
4325
+ --tw-translate-x: 50%;
4326
+ 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));
4327
+ }
4328
+
4329
+ .sm\:translate-y-1\/2 {
4330
+ --tw-translate-y: 50%;
4331
+ 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));
4332
+ }
4333
+
3399
4334
  .sm\:grid-cols-2 {
3400
4335
  grid-template-columns: repeat(2, minmax(0, 1fr));
3401
4336
  }
@@ -3467,6 +4402,30 @@ video {
3467
4402
  }
3468
4403
  @media (min-width: 768px) {
3469
4404
 
4405
+ .md\:bottom-0 {
4406
+ bottom: 0px;
4407
+ }
4408
+
4409
+ .md\:end-0 {
4410
+ inset-inline-end: 0px;
4411
+ }
4412
+
4413
+ .md\:start-0 {
4414
+ inset-inline-start: 0px;
4415
+ }
4416
+
4417
+ .md\:start-1\/2 {
4418
+ inset-inline-start: 50%;
4419
+ }
4420
+
4421
+ .md\:top-0 {
4422
+ top: 0px;
4423
+ }
4424
+
4425
+ .md\:top-1\/2 {
4426
+ top: 50%;
4427
+ }
4428
+
3470
4429
  .md\:flex {
3471
4430
  display: flex;
3472
4431
  }
@@ -3475,6 +4434,26 @@ video {
3475
4434
  display: none;
3476
4435
  }
3477
4436
 
4437
+ .md\:-translate-x-1\/2 {
4438
+ --tw-translate-x: -50%;
4439
+ 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));
4440
+ }
4441
+
4442
+ .md\:-translate-y-1\/2 {
4443
+ --tw-translate-y: -50%;
4444
+ 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));
4445
+ }
4446
+
4447
+ .md\:translate-x-1\/2 {
4448
+ --tw-translate-x: 50%;
4449
+ 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));
4450
+ }
4451
+
4452
+ .md\:translate-y-1\/2 {
4453
+ --tw-translate-y: 50%;
4454
+ 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));
4455
+ }
4456
+
3478
4457
  .md\:pl-5 {
3479
4458
  padding-left: 1.25rem;
3480
4459
  }
@@ -3486,6 +4465,30 @@ video {
3486
4465
  }
3487
4466
  @media (min-width: 1024px) {
3488
4467
 
4468
+ .lg\:bottom-0 {
4469
+ bottom: 0px;
4470
+ }
4471
+
4472
+ .lg\:end-0 {
4473
+ inset-inline-end: 0px;
4474
+ }
4475
+
4476
+ .lg\:start-0 {
4477
+ inset-inline-start: 0px;
4478
+ }
4479
+
4480
+ .lg\:start-1\/2 {
4481
+ inset-inline-start: 50%;
4482
+ }
4483
+
4484
+ .lg\:top-0 {
4485
+ top: 0px;
4486
+ }
4487
+
4488
+ .lg\:top-1\/2 {
4489
+ top: 50%;
4490
+ }
4491
+
3489
4492
  .lg\:flex {
3490
4493
  display: flex;
3491
4494
  }
@@ -3522,10 +4525,6 @@ video {
3522
4525
  max-height: 95vh;
3523
4526
  }
3524
4527
 
3525
- .lg\:w-\[calc\(33\%-16px\)\] {
3526
- width: calc(33% - 16px);
3527
- }
3528
-
3529
4528
  .lg\:w-auto {
3530
4529
  width: auto;
3531
4530
  }
@@ -3570,6 +4569,26 @@ video {
3570
4569
  max-width: 36rem;
3571
4570
  }
3572
4571
 
4572
+ .lg\:-translate-x-1\/2 {
4573
+ --tw-translate-x: -50%;
4574
+ 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));
4575
+ }
4576
+
4577
+ .lg\:-translate-y-1\/2 {
4578
+ --tw-translate-y: -50%;
4579
+ 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));
4580
+ }
4581
+
4582
+ .lg\:translate-x-1\/2 {
4583
+ --tw-translate-x: 50%;
4584
+ 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));
4585
+ }
4586
+
4587
+ .lg\:translate-y-1\/2 {
4588
+ --tw-translate-y: 50%;
4589
+ 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));
4590
+ }
4591
+
3573
4592
  .lg\:grid-cols-3 {
3574
4593
  grid-template-columns: repeat(3, minmax(0, 1fr));
3575
4594
  }
@@ -3584,14 +4603,172 @@ video {
3584
4603
  }
3585
4604
  @media (min-width: 1280px) {
3586
4605
 
3587
- .xl\:w-\[calc\(25\%-18px\)\] {
3588
- width: calc(25% - 18px);
4606
+ .xl\:bottom-0 {
4607
+ bottom: 0px;
4608
+ }
4609
+
4610
+ .xl\:end-0 {
4611
+ inset-inline-end: 0px;
4612
+ }
4613
+
4614
+ .xl\:start-0 {
4615
+ inset-inline-start: 0px;
4616
+ }
4617
+
4618
+ .xl\:start-1\/2 {
4619
+ inset-inline-start: 50%;
4620
+ }
4621
+
4622
+ .xl\:top-0 {
4623
+ top: 0px;
4624
+ }
4625
+
4626
+ .xl\:top-1\/2 {
4627
+ top: 50%;
4628
+ }
4629
+
4630
+ .xl\:-translate-x-1\/2 {
4631
+ --tw-translate-x: -50%;
4632
+ 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));
4633
+ }
4634
+
4635
+ .xl\:-translate-y-1\/2 {
4636
+ --tw-translate-y: -50%;
4637
+ 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));
4638
+ }
4639
+
4640
+ .xl\:translate-x-1\/2 {
4641
+ --tw-translate-x: 50%;
4642
+ 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));
4643
+ }
4644
+
4645
+ .xl\:translate-y-1\/2 {
4646
+ --tw-translate-y: 50%;
4647
+ 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));
4648
+ }
4649
+
4650
+ .xl\:grid-cols-4 {
4651
+ grid-template-columns: repeat(4, minmax(0, 1fr));
3589
4652
  }
3590
4653
 
3591
4654
  .xl\:grid-cols-5 {
3592
4655
  grid-template-columns: repeat(5, minmax(0, 1fr));
3593
4656
  }
3594
4657
  }
4658
+ @media (min-width: 1536px) {
4659
+
4660
+ .\32xl\:bottom-0 {
4661
+ bottom: 0px;
4662
+ }
4663
+
4664
+ .\32xl\:end-0 {
4665
+ inset-inline-end: 0px;
4666
+ }
4667
+
4668
+ .\32xl\:start-0 {
4669
+ inset-inline-start: 0px;
4670
+ }
4671
+
4672
+ .\32xl\:start-1\/2 {
4673
+ inset-inline-start: 50%;
4674
+ }
4675
+
4676
+ .\32xl\:top-0 {
4677
+ top: 0px;
4678
+ }
4679
+
4680
+ .\32xl\:top-1\/2 {
4681
+ top: 50%;
4682
+ }
4683
+
4684
+ .\32xl\:-translate-x-1\/2 {
4685
+ --tw-translate-x: -50%;
4686
+ 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));
4687
+ }
4688
+
4689
+ .\32xl\:-translate-y-1\/2 {
4690
+ --tw-translate-y: -50%;
4691
+ 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));
4692
+ }
4693
+
4694
+ .\32xl\:translate-x-1\/2 {
4695
+ --tw-translate-x: 50%;
4696
+ 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));
4697
+ }
4698
+
4699
+ .\32xl\:translate-y-1\/2 {
4700
+ --tw-translate-y: 50%;
4701
+ 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));
4702
+ }
4703
+ }
4704
+ .rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4705
+ --tw-translate-x: -50%;
4706
+ 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));
4707
+ }
4708
+ .rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4709
+ --tw-translate-x: 50%;
4710
+ 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));
4711
+ }
4712
+ @media (min-width: 640px) {
4713
+
4714
+ .sm\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4715
+ --tw-translate-x: -50%;
4716
+ 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));
4717
+ }
4718
+
4719
+ .sm\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4720
+ --tw-translate-x: 50%;
4721
+ 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));
4722
+ }
4723
+ }
4724
+ @media (min-width: 768px) {
4725
+
4726
+ .md\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4727
+ --tw-translate-x: -50%;
4728
+ 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));
4729
+ }
4730
+
4731
+ .md\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4732
+ --tw-translate-x: 50%;
4733
+ 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));
4734
+ }
4735
+ }
4736
+ @media (min-width: 1024px) {
4737
+
4738
+ .lg\:rtl\:-translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4739
+ --tw-translate-x: -50%;
4740
+ 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));
4741
+ }
4742
+
4743
+ .lg\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4744
+ --tw-translate-x: 50%;
4745
+ 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));
4746
+ }
4747
+ }
4748
+ @media (min-width: 1280px) {
4749
+
4750
+ .xl\: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
+ .xl\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4756
+ --tw-translate-x: 50%;
4757
+ 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));
4758
+ }
4759
+ }
4760
+ @media (min-width: 1536px) {
4761
+
4762
+ .\32xl\: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
+ .\32xl\:rtl\:translate-x-1\/2:where([dir="rtl"], [dir="rtl"] *) {
4768
+ --tw-translate-x: 50%;
4769
+ 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));
4770
+ }
4771
+ }
3595
4772
  .\[\&\:has\(\[aria-selected\]\)\]\:bg-accent:has([aria-selected]) {
3596
4773
  background-color: hsl(var(--najm-accent));
3597
4774
  }
@@ -3602,8 +4779,61 @@ video {
3602
4779
  --tw-translate-y: 2px;
3603
4780
  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
4781
  }
3605
- .\[\&\>svg\:last-child\]\:hidden>svg:last-child {
3606
- display: none;
4782
+ .\[\&\>button\]\:right-4>button {
4783
+ right: 1rem;
4784
+ }
4785
+ .\[\&\>button\]\:top-4>button {
4786
+ top: 1rem;
4787
+ }
4788
+ .\[\&\>button\]\:flex>button {
4789
+ display: flex;
4790
+ }
4791
+ .\[\&\>button\]\:size-6>button {
4792
+ width: 1.5rem;
4793
+ height: 1.5rem;
4794
+ }
4795
+ .\[\&\>button\]\:items-center>button {
4796
+ align-items: center;
4797
+ }
4798
+ .\[\&\>button\]\:justify-center>button {
4799
+ justify-content: center;
4800
+ }
4801
+ .\[\&\>button\]\:rounded-full>button {
4802
+ border-radius: 9999px;
4803
+ }
4804
+ .\[\&\>button\]\:bg-muted>button {
4805
+ background-color: hsl(var(--najm-muted));
4806
+ }
4807
+ .\[\&\>button\]\:text-muted-foreground>button {
4808
+ color: hsl(var(--najm-muted-foreground));
4809
+ }
4810
+ .\[\&\>button\]\:opacity-100>button {
4811
+ opacity: 1;
4812
+ }
4813
+ .\[\&\>button\]\:ring-offset-0>button {
4814
+ --tw-ring-offset-width: 0px;
4815
+ }
4816
+ .\[\&\>button\]\:hover\:bg-secondary:hover>button {
4817
+ background-color: hsl(var(--najm-secondary));
4818
+ }
4819
+ .\[\&\>button\]\:hover\:text-foreground:hover>button {
4820
+ color: hsl(var(--najm-foreground));
4821
+ }
4822
+ .dark\:\[\&\>button\]\:bg-\[\#4d5a6d\]>button:is(.dark *) {
4823
+ --tw-bg-opacity: 1;
4824
+ background-color: rgb(77 90 109 / var(--tw-bg-opacity, 1));
4825
+ }
4826
+ .dark\:\[\&\>button\]\:text-white>button:is(.dark *) {
4827
+ --tw-text-opacity: 1;
4828
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
4829
+ }
4830
+ .dark\:\[\&\>button\]\:hover\:bg-\[\#647186\]:hover>button:is(.dark *) {
4831
+ --tw-bg-opacity: 1;
4832
+ background-color: rgb(100 113 134 / var(--tw-bg-opacity, 1));
4833
+ }
4834
+ .dark\:\[\&\>button\]\:hover\:text-white:hover>button:is(.dark *) {
4835
+ --tw-text-opacity: 1;
4836
+ color: rgb(255 255 255 / var(--tw-text-opacity, 1));
3607
4837
  }
3608
4838
  .\[\&\>svg\]\:pointer-events-none>svg {
3609
4839
  pointer-events: none;
@@ -3716,6 +4946,57 @@ video {
3716
4946
  .\[\&_svg\]\:shrink-0 svg {
3717
4947
  flex-shrink: 0;
3718
4948
  }
4949
+ .\[\&_th\]\:text-amber-700 th {
4950
+ --tw-text-opacity: 1;
4951
+ color: rgb(180 83 9 / var(--tw-text-opacity, 1));
4952
+ }
4953
+ .\[\&_th\]\:text-blue-700 th {
4954
+ --tw-text-opacity: 1;
4955
+ color: rgb(29 78 216 / var(--tw-text-opacity, 1));
4956
+ }
4957
+ .\[\&_th\]\:text-emerald-700 th {
4958
+ --tw-text-opacity: 1;
4959
+ color: rgb(4 120 87 / var(--tw-text-opacity, 1));
4960
+ }
4961
+ .\[\&_th\]\:text-primary th {
4962
+ color: hsl(var(--najm-primary));
4963
+ }
4964
+ .\[\&_th\]\:text-rose-700 th {
4965
+ --tw-text-opacity: 1;
4966
+ color: rgb(190 18 60 / var(--tw-text-opacity, 1));
4967
+ }
4968
+ .\[\&_th\]\:text-slate-100 th {
4969
+ --tw-text-opacity: 1;
4970
+ color: rgb(241 245 249 / var(--tw-text-opacity, 1));
4971
+ }
4972
+ .\[\&_th\]\:text-violet-700 th {
4973
+ --tw-text-opacity: 1;
4974
+ color: rgb(109 40 217 / var(--tw-text-opacity, 1));
4975
+ }
4976
+ .dark\:\[\&_th\]\:text-amber-300 th:is(.dark *) {
4977
+ --tw-text-opacity: 1;
4978
+ color: rgb(252 211 77 / var(--tw-text-opacity, 1));
4979
+ }
4980
+ .dark\:\[\&_th\]\:text-blue-300 th:is(.dark *) {
4981
+ --tw-text-opacity: 1;
4982
+ color: rgb(147 197 253 / var(--tw-text-opacity, 1));
4983
+ }
4984
+ .dark\:\[\&_th\]\:text-emerald-300 th:is(.dark *) {
4985
+ --tw-text-opacity: 1;
4986
+ color: rgb(110 231 183 / var(--tw-text-opacity, 1));
4987
+ }
4988
+ .dark\:\[\&_th\]\:text-rose-300 th:is(.dark *) {
4989
+ --tw-text-opacity: 1;
4990
+ color: rgb(253 164 175 / var(--tw-text-opacity, 1));
4991
+ }
4992
+ .dark\:\[\&_th\]\:text-slate-300 th:is(.dark *) {
4993
+ --tw-text-opacity: 1;
4994
+ color: rgb(203 213 225 / var(--tw-text-opacity, 1));
4995
+ }
4996
+ .dark\:\[\&_th\]\:text-violet-300 th:is(.dark *) {
4997
+ --tw-text-opacity: 1;
4998
+ color: rgb(196 181 253 / var(--tw-text-opacity, 1));
4999
+ }
3719
5000
  .\[\&_tr\:last-child\]\:border-0 tr:last-child {
3720
5001
  border-width: 0px;
3721
5002
  }
@@ -3725,8 +5006,8 @@ video {
3725
5006
  .\[\&_tr\]\:border-border\/40 tr {
3726
5007
  border-color: hsl(var(--najm-border) / 0.4);
3727
5008
  }
3728
- .\[\&_tr\]\:hover\:bg-transparent:hover tr {
3729
- background-color: transparent;
5009
+ .\[\&_tr\]\:border-muted-foreground tr {
5010
+ border-color: hsl(var(--najm-muted-foreground));
3730
5011
  }
3731
5012
  a.\[a\&\]\:hover\:bg-accent\/50:hover {
3732
5013
  background-color: hsl(var(--najm-accent) / 0.5);