adminita 0.1.5__py3-none-any.whl → 0.1.7__py3-none-any.whl

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. adminita/context_processors.py +20 -0
  2. adminita/static/adminita/adminita-tailwind.css +1 -1
  3. adminita/static/css/output.css +424 -205
  4. adminita/static/src/input.css +49 -1
  5. adminita/templates/admin/base.html +69 -66
  6. adminita/templates/admin/change_form.html +105 -131
  7. adminita/templates/admin/change_list.html +11 -2
  8. adminita/templates/admin/delete_confirmation.html +5 -4
  9. adminita/templates/admin/delete_selected_confirmation.html +3 -3
  10. adminita/templates/admin/edit_inline/stacked.html +149 -0
  11. adminita/templates/admin/edit_inline/tabular.html +176 -0
  12. adminita/templates/admin/popup_response.html +25 -0
  13. adminita/templates/admin/submit_line.html +22 -0
  14. {adminita-0.1.5.dist-info → adminita-0.1.7.dist-info}/METADATA +3 -3
  15. adminita-0.1.7.dist-info/RECORD +29 -0
  16. adminita-0.1.5.dist-info/RECORD +0 -24
  17. {adminita-0.1.5.dist-info → adminita-0.1.7.dist-info}/WHEEL +0 -0
  18. {adminita-0.1.5.dist-info → adminita-0.1.7.dist-info}/licenses/LICENSE +0 -0
  19. {adminita-0.1.5.dist-info → adminita-0.1.7.dist-info}/top_level.txt +0 -0
adminita/static/css/output.css CHANGED
@@ -10,7 +10,9 @@
10
10
  --color-red-50: oklch(97.1% 0.013 17.38);
11
11
  --color-red-100: oklch(93.6% 0.032 17.717);
12
12
  --color-red-200: oklch(88.5% 0.062 18.334);
13
+ --color-red-300: oklch(80.8% 0.114 19.571);
13
14
  --color-red-400: oklch(70.4% 0.191 22.216);
15
+ --color-red-500: oklch(63.7% 0.237 25.331);
14
16
  --color-red-600: oklch(57.7% 0.245 27.325);
15
17
  --color-red-700: oklch(50.5% 0.213 27.518);
16
18
  --color-red-800: oklch(44.4% 0.177 26.899);
@@ -18,13 +20,16 @@
18
20
  --color-yellow-50: oklch(98.7% 0.026 102.212);
19
21
  --color-yellow-100: oklch(97.3% 0.071 103.193);
20
22
  --color-yellow-200: oklch(94.5% 0.129 101.54);
23
+ --color-yellow-300: oklch(90.5% 0.182 98.111);
21
24
  --color-yellow-400: oklch(85.2% 0.199 91.936);
22
25
  --color-yellow-600: oklch(68.1% 0.162 75.834);
26
+ --color-yellow-700: oklch(55.4% 0.135 66.442);
23
27
  --color-yellow-800: oklch(47.6% 0.114 61.907);
24
28
  --color-yellow-900: oklch(42.1% 0.095 57.708);
25
29
  --color-green-50: oklch(98.2% 0.018 155.826);
26
30
  --color-green-100: oklch(96.2% 0.044 156.743);
27
31
  --color-green-200: oklch(92.5% 0.084 155.995);
32
+ --color-green-300: oklch(87.1% 0.15 154.449);
28
33
  --color-green-400: oklch(79.2% 0.209 151.711);
29
34
  --color-green-600: oklch(62.7% 0.194 149.214);
30
35
  --color-green-800: oklch(44.8% 0.119 151.328);
@@ -56,7 +61,9 @@
56
61
  --container-xs: 20rem;
57
62
  --container-md: 28rem;
58
63
  --container-lg: 32rem;
64
+ --container-2xl: 42rem;
59
65
  --container-3xl: 48rem;
66
+ --container-4xl: 56rem;
60
67
  --container-7xl: 80rem;
61
68
  --text-xs: 0.75rem;
62
69
  --text-xs--line-height: calc(1 / 0.75);
@@ -73,6 +80,7 @@
73
80
  --font-weight-semibold: 600;
74
81
  --font-weight-bold: 700;
75
82
  --tracking-wider: 0.05em;
83
+ --radius-md: 0.375rem;
76
84
  --radius-lg: 0.5rem;
77
85
  --radius-xl: 0.75rem;
78
86
  --radius-2xl: 1rem;
@@ -243,6 +251,20 @@
243
251
  }
244
252
  }
245
253
  @layer utilities {
254
+ .collapse {
255
+ visibility: collapse;
256
+ }
257
+ .sr-only {
258
+ position: absolute;
259
+ width: 1px;
260
+ height: 1px;
261
+ padding: 0;
262
+ margin: -1px;
263
+ overflow: hidden;
264
+ clip-path: inset(50%);
265
+ white-space: nowrap;
266
+ border-width: 0;
267
+ }
246
268
  .absolute {
247
269
  position: absolute;
248
270
  }
@@ -267,6 +289,9 @@
267
289
  .top-1\/2 {
268
290
  top: calc(1/2 * 100%);
269
291
  }
292
+ .top-20 {
293
+ top: calc(var(--spacing) * 20);
294
+ }
270
295
  .left-3 {
271
296
  left: calc(var(--spacing) * 3);
272
297
  }
@@ -303,15 +328,27 @@
303
328
  .mt-12 {
304
329
  margin-top: calc(var(--spacing) * 12);
305
330
  }
331
+ .mr-1 {
332
+ margin-right: calc(var(--spacing) * 1);
333
+ }
334
+ .mr-1\.5 {
335
+ margin-right: calc(var(--spacing) * 1.5);
336
+ }
306
337
  .mr-2 {
307
338
  margin-right: calc(var(--spacing) * 2);
308
339
  }
309
340
  .mr-3 {
310
341
  margin-right: calc(var(--spacing) * 3);
311
342
  }
343
+ .mb-1 {
344
+ margin-bottom: calc(var(--spacing) * 1);
345
+ }
312
346
  .mb-2 {
313
347
  margin-bottom: calc(var(--spacing) * 2);
314
348
  }
349
+ .mb-3 {
350
+ margin-bottom: calc(var(--spacing) * 3);
351
+ }
315
352
  .mb-4 {
316
353
  margin-bottom: calc(var(--spacing) * 4);
317
354
  }
@@ -321,6 +358,9 @@
321
358
  .mb-8 {
322
359
  margin-bottom: calc(var(--spacing) * 8);
323
360
  }
361
+ .ml-2 {
362
+ margin-left: calc(var(--spacing) * 2);
363
+ }
324
364
  .ml-3 {
325
365
  margin-left: calc(var(--spacing) * 3);
326
366
  }
@@ -345,6 +385,9 @@
345
385
  .h-3 {
346
386
  height: calc(var(--spacing) * 3);
347
387
  }
388
+ .h-4 {
389
+ height: calc(var(--spacing) * 4);
390
+ }
348
391
  .h-5 {
349
392
  height: calc(var(--spacing) * 5);
350
393
  }
@@ -366,6 +409,12 @@
366
409
  .h-full {
367
410
  height: 100%;
368
411
  }
412
+ .max-h-96 {
413
+ max-height: calc(var(--spacing) * 96);
414
+ }
415
+ .min-h-\[8rem\] {
416
+ min-height: 8rem;
417
+ }
369
418
  .min-h-full {
370
419
  min-height: 100%;
371
420
  }
@@ -375,6 +424,9 @@
375
424
  .w-3 {
376
425
  width: calc(var(--spacing) * 3);
377
426
  }
427
+ .w-4 {
428
+ width: calc(var(--spacing) * 4);
429
+ }
378
430
  .w-5 {
379
431
  width: calc(var(--spacing) * 5);
380
432
  }
@@ -390,21 +442,36 @@
390
442
  .w-16 {
391
443
  width: calc(var(--spacing) * 16);
392
444
  }
445
+ .w-20 {
446
+ width: calc(var(--spacing) * 20);
447
+ }
393
448
  .w-64 {
394
449
  width: calc(var(--spacing) * 64);
395
450
  }
396
451
  .w-full {
397
452
  width: 100%;
398
453
  }
454
+ .max-w-2xl {
455
+ max-width: var(--container-2xl);
456
+ }
457
+ .max-w-4xl {
458
+ max-width: var(--container-4xl);
459
+ }
399
460
  .max-w-7xl {
400
461
  max-width: var(--container-7xl);
401
462
  }
463
+ .max-w-lg {
464
+ max-width: var(--container-lg);
465
+ }
402
466
  .max-w-md {
403
467
  max-width: var(--container-md);
404
468
  }
405
469
  .min-w-\[300px\] {
406
470
  min-width: 300px;
407
471
  }
472
+ .min-w-full {
473
+ min-width: 100%;
474
+ }
408
475
  .flex-1 {
409
476
  flex: 1;
410
477
  }
@@ -419,6 +486,9 @@
419
486
  --tw-translate-y: calc(calc(1/2 * 100%) * -1);
420
487
  translate: var(--tw-translate-x) var(--tw-translate-y);
421
488
  }
489
+ .rotate-180 {
490
+ rotate: 180deg;
491
+ }
422
492
  .transform {
423
493
  transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
424
494
  }
@@ -446,6 +516,15 @@
446
516
  .justify-center {
447
517
  justify-content: center;
448
518
  }
519
+ .justify-end {
520
+ justify-content: flex-end;
521
+ }
522
+ .gap-2 {
523
+ gap: calc(var(--spacing) * 2);
524
+ }
525
+ .gap-3 {
526
+ gap: calc(var(--spacing) * 3);
527
+ }
449
528
  .gap-4 {
450
529
  gap: calc(var(--spacing) * 4);
451
530
  }
@@ -473,6 +552,13 @@
473
552
  margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
474
553
  }
475
554
  }
555
+ .space-y-4 {
556
+ :where(& > :not(:last-child)) {
557
+ --tw-space-y-reverse: 0;
558
+ margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
559
+ margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
560
+ }
561
+ }
476
562
  .space-y-6 {
477
563
  :where(& > :not(:last-child)) {
478
564
  --tw-space-y-reverse: 0;
@@ -508,6 +594,20 @@
508
594
  margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)));
509
595
  }
510
596
  }
597
+ .divide-y {
598
+ :where(& > :not(:last-child)) {
599
+ --tw-divide-y-reverse: 0;
600
+ border-bottom-style: var(--tw-border-style);
601
+ border-top-style: var(--tw-border-style);
602
+ border-top-width: calc(1px * var(--tw-divide-y-reverse));
603
+ border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
604
+ }
605
+ }
606
+ .divide-gray-200 {
607
+ :where(& > :not(:last-child)) {
608
+ border-color: var(--color-gray-200);
609
+ }
610
+ }
511
611
  .overflow-hidden {
512
612
  overflow: hidden;
513
613
  }
@@ -529,9 +629,16 @@
529
629
  .rounded-lg {
530
630
  border-radius: var(--radius-lg);
531
631
  }
632
+ .rounded-md {
633
+ border-radius: var(--radius-md);
634
+ }
532
635
  .rounded-xl {
533
636
  border-radius: var(--radius-xl);
534
637
  }
638
+ .rounded-t-lg {
639
+ border-top-left-radius: var(--radius-lg);
640
+ border-top-right-radius: var(--radius-lg);
641
+ }
535
642
  .border {
536
643
  border-style: var(--tw-border-style);
537
644
  border-width: 1px;
@@ -555,6 +662,9 @@
555
662
  .border-blue-200 {
556
663
  border-color: var(--color-blue-200);
557
664
  }
665
+ .border-gray-100 {
666
+ border-color: var(--color-gray-100);
667
+ }
558
668
  .border-gray-200 {
559
669
  border-color: var(--color-gray-200);
560
670
  }
@@ -591,8 +701,8 @@
591
701
  .bg-gray-100 {
592
702
  background-color: var(--color-gray-100);
593
703
  }
594
- .bg-gray-600 {
595
- background-color: var(--color-gray-600);
704
+ .bg-gray-200 {
705
+ background-color: var(--color-gray-200);
596
706
  }
597
707
  .bg-green-50 {
598
708
  background-color: var(--color-green-50);
@@ -600,6 +710,9 @@
600
710
  .bg-green-100 {
601
711
  background-color: var(--color-green-100);
602
712
  }
713
+ .bg-primary-100 {
714
+ background-color: var(--color-primary-100);
715
+ }
603
716
  .bg-red-50 {
604
717
  background-color: var(--color-red-50);
605
718
  }
@@ -656,6 +769,9 @@
656
769
  .p-8 {
657
770
  padding: calc(var(--spacing) * 8);
658
771
  }
772
+ .px-2\.5 {
773
+ padding-inline: calc(var(--spacing) * 2.5);
774
+ }
659
775
  .px-3 {
660
776
  padding-inline: calc(var(--spacing) * 3);
661
777
  }
@@ -668,9 +784,15 @@
668
784
  .px-8 {
669
785
  padding-inline: calc(var(--spacing) * 8);
670
786
  }
787
+ .py-0\.5 {
788
+ padding-block: calc(var(--spacing) * 0.5);
789
+ }
671
790
  .py-1 {
672
791
  padding-block: calc(var(--spacing) * 1);
673
792
  }
793
+ .py-1\.5 {
794
+ padding-block: calc(var(--spacing) * 1.5);
795
+ }
674
796
  .py-2 {
675
797
  padding-block: calc(var(--spacing) * 2);
676
798
  }
@@ -692,9 +814,15 @@
692
814
  .py-12 {
693
815
  padding-block: calc(var(--spacing) * 12);
694
816
  }
817
+ .pt-16 {
818
+ padding-top: calc(var(--spacing) * 16);
819
+ }
695
820
  .pr-4 {
696
821
  padding-right: calc(var(--spacing) * 4);
697
822
  }
823
+ .pb-2 {
824
+ padding-bottom: calc(var(--spacing) * 2);
825
+ }
698
826
  .pb-6 {
699
827
  padding-bottom: calc(var(--spacing) * 6);
700
828
  }
@@ -704,6 +832,9 @@
704
832
  .text-center {
705
833
  text-align: center;
706
834
  }
835
+ .text-left {
836
+ text-align: left;
837
+ }
707
838
  .text-3xl {
708
839
  font-size: var(--text-3xl);
709
840
  line-height: var(--tw-leading, var(--text-3xl--line-height));
@@ -732,10 +863,6 @@
732
863
  --tw-font-weight: var(--font-weight-medium);
733
864
  font-weight: var(--font-weight-medium);
734
865
  }
735
- .font-normal {
736
- --tw-font-weight: var(--font-weight-normal);
737
- font-weight: var(--font-weight-normal);
738
- }
739
866
  .font-semibold {
740
867
  --tw-font-weight: var(--font-weight-semibold);
741
868
  font-weight: var(--font-weight-semibold);
@@ -744,6 +871,9 @@
744
871
  --tw-tracking: var(--tracking-wider);
745
872
  letter-spacing: var(--tracking-wider);
746
873
  }
874
+ .whitespace-nowrap {
875
+ white-space: nowrap;
876
+ }
747
877
  .text-blue-600 {
748
878
  color: var(--color-blue-600);
749
879
  }
@@ -783,9 +913,15 @@
783
913
  .text-primary-600 {
784
914
  color: var(--color-primary-600);
785
915
  }
916
+ .text-red-500 {
917
+ color: var(--color-red-500);
918
+ }
786
919
  .text-red-600 {
787
920
  color: var(--color-red-600);
788
921
  }
922
+ .text-red-700 {
923
+ color: var(--color-red-700);
924
+ }
789
925
  .text-red-800 {
790
926
  color: var(--color-red-800);
791
927
  }
@@ -795,6 +931,9 @@
795
931
  .text-yellow-600 {
796
932
  color: var(--color-yellow-600);
797
933
  }
934
+ .text-yellow-700 {
935
+ color: var(--color-yellow-700);
936
+ }
798
937
  .text-yellow-800 {
799
938
  color: var(--color-yellow-800);
800
939
  }
@@ -817,9 +956,6 @@
817
956
  --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
818
957
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
819
958
  }
820
- .filter {
821
- filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
822
- }
823
959
  .transition-all {
824
960
  transition-property: all;
825
961
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -840,6 +976,10 @@
840
976
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
841
977
  transition-duration: var(--tw-duration, var(--default-transition-duration));
842
978
  }
979
+ .duration-200 {
980
+ --tw-duration: 200ms;
981
+ transition-duration: 200ms;
982
+ }
843
983
  .duration-300 {
844
984
  --tw-duration: 300ms;
845
985
  transition-duration: 300ms;
@@ -892,13 +1032,6 @@
892
1032
  }
893
1033
  }
894
1034
  }
895
- .hover\:bg-gray-700 {
896
- &:hover {
897
- @media (hover: hover) {
898
- background-color: var(--color-gray-700);
899
- }
900
- }
901
- }
902
1035
  .hover\:bg-red-700 {
903
1036
  &:hover {
904
1037
  @media (hover: hover) {
@@ -927,6 +1060,20 @@
927
1060
  }
928
1061
  }
929
1062
  }
1063
+ .hover\:text-primary-700 {
1064
+ &:hover {
1065
+ @media (hover: hover) {
1066
+ color: var(--color-primary-700);
1067
+ }
1068
+ }
1069
+ }
1070
+ .hover\:text-red-700 {
1071
+ &:hover {
1072
+ @media (hover: hover) {
1073
+ color: var(--color-red-700);
1074
+ }
1075
+ }
1076
+ }
930
1077
  .hover\:underline {
931
1078
  &:hover {
932
1079
  @media (hover: hover) {
@@ -958,6 +1105,11 @@
958
1105
  --tw-ring-color: var(--color-blue-500);
959
1106
  }
960
1107
  }
1108
+ .focus\:ring-red-500 {
1109
+ &:focus {
1110
+ --tw-ring-color: var(--color-red-500);
1111
+ }
1112
+ }
961
1113
  .focus\:ring-offset-0 {
962
1114
  &:focus {
963
1115
  --tw-ring-offset-width: 0px;
@@ -1029,80 +1181,92 @@
1029
1181
  }
1030
1182
  }
1031
1183
  .dark\:block {
1032
- @media (prefers-color-scheme: dark) {
1184
+ &:where(.dark, .dark *) {
1033
1185
  display: block;
1034
1186
  }
1035
1187
  }
1036
1188
  .dark\:hidden {
1037
- @media (prefers-color-scheme: dark) {
1189
+ &:where(.dark, .dark *) {
1038
1190
  display: none;
1039
1191
  }
1040
1192
  }
1041
1193
  .dark\:inline {
1042
- @media (prefers-color-scheme: dark) {
1194
+ &:where(.dark, .dark *) {
1043
1195
  display: inline;
1044
1196
  }
1045
1197
  }
1198
+ .dark\:divide-gray-700 {
1199
+ &:where(.dark, .dark *) {
1200
+ :where(& > :not(:last-child)) {
1201
+ border-color: var(--color-gray-700);
1202
+ }
1203
+ }
1204
+ }
1046
1205
  .dark\:border-blue-800 {
1047
- @media (prefers-color-scheme: dark) {
1206
+ &:where(.dark, .dark *) {
1048
1207
  border-color: var(--color-blue-800);
1049
1208
  }
1050
1209
  }
1051
1210
  .dark\:border-gray-600 {
1052
- @media (prefers-color-scheme: dark) {
1211
+ &:where(.dark, .dark *) {
1053
1212
  border-color: var(--color-gray-600);
1054
1213
  }
1055
1214
  }
1056
1215
  .dark\:border-gray-700 {
1057
- @media (prefers-color-scheme: dark) {
1216
+ &:where(.dark, .dark *) {
1058
1217
  border-color: var(--color-gray-700);
1059
1218
  }
1060
1219
  }
1061
1220
  .dark\:border-green-800 {
1062
- @media (prefers-color-scheme: dark) {
1221
+ &:where(.dark, .dark *) {
1063
1222
  border-color: var(--color-green-800);
1064
1223
  }
1065
1224
  }
1066
1225
  .dark\:border-red-800 {
1067
- @media (prefers-color-scheme: dark) {
1226
+ &:where(.dark, .dark *) {
1068
1227
  border-color: var(--color-red-800);
1069
1228
  }
1070
1229
  }
1071
1230
  .dark\:border-yellow-800 {
1072
- @media (prefers-color-scheme: dark) {
1231
+ &:where(.dark, .dark *) {
1073
1232
  border-color: var(--color-yellow-800);
1074
1233
  }
1075
1234
  }
1076
1235
  .dark\:bg-blue-900\/20 {
1077
- @media (prefers-color-scheme: dark) {
1236
+ &:where(.dark, .dark *) {
1078
1237
  background-color: color-mix(in srgb, oklch(37.9% 0.146 265.522) 20%, transparent);
1079
1238
  @supports (color: color-mix(in lab, red, red)) {
1080
1239
  background-color: color-mix(in oklab, var(--color-blue-900) 20%, transparent);
1081
1240
  }
1082
1241
  }
1083
1242
  }
1243
+ .dark\:bg-gray-600 {
1244
+ &:where(.dark, .dark *) {
1245
+ background-color: var(--color-gray-600);
1246
+ }
1247
+ }
1084
1248
  .dark\:bg-gray-700 {
1085
- @media (prefers-color-scheme: dark) {
1249
+ &:where(.dark, .dark *) {
1086
1250
  background-color: var(--color-gray-700);
1087
1251
  }
1088
1252
  }
1089
1253
  .dark\:bg-gray-750 {
1090
- @media (prefers-color-scheme: dark) {
1254
+ &:where(.dark, .dark *) {
1091
1255
  background-color: var(--color-gray-750);
1092
1256
  }
1093
1257
  }
1094
1258
  .dark\:bg-gray-800 {
1095
- @media (prefers-color-scheme: dark) {
1259
+ &:where(.dark, .dark *) {
1096
1260
  background-color: var(--color-gray-800);
1097
1261
  }
1098
1262
  }
1099
1263
  .dark\:bg-gray-900 {
1100
- @media (prefers-color-scheme: dark) {
1264
+ &:where(.dark, .dark *) {
1101
1265
  background-color: var(--color-gray-900);
1102
1266
  }
1103
1267
  }
1104
1268
  .dark\:bg-green-900\/20 {
1105
- @media (prefers-color-scheme: dark) {
1269
+ &:where(.dark, .dark *) {
1106
1270
  background-color: color-mix(in srgb, oklch(39.3% 0.095 152.535) 20%, transparent);
1107
1271
  @supports (color: color-mix(in lab, red, red)) {
1108
1272
  background-color: color-mix(in oklab, var(--color-green-900) 20%, transparent);
@@ -1110,15 +1274,20 @@
1110
1274
  }
1111
1275
  }
1112
1276
  .dark\:bg-green-900\/30 {
1113
- @media (prefers-color-scheme: dark) {
1277
+ &:where(.dark, .dark *) {
1114
1278
  background-color: color-mix(in srgb, oklch(39.3% 0.095 152.535) 30%, transparent);
1115
1279
  @supports (color: color-mix(in lab, red, red)) {
1116
1280
  background-color: color-mix(in oklab, var(--color-green-900) 30%, transparent);
1117
1281
  }
1118
1282
  }
1119
1283
  }
1284
+ .dark\:bg-primary-900 {
1285
+ &:where(.dark, .dark *) {
1286
+ background-color: var(--color-primary-900);
1287
+ }
1288
+ }
1120
1289
  .dark\:bg-red-900\/20 {
1121
- @media (prefers-color-scheme: dark) {
1290
+ &:where(.dark, .dark *) {
1122
1291
  background-color: color-mix(in srgb, oklch(39.6% 0.141 25.723) 20%, transparent);
1123
1292
  @supports (color: color-mix(in lab, red, red)) {
1124
1293
  background-color: color-mix(in oklab, var(--color-red-900) 20%, transparent);
@@ -1126,7 +1295,7 @@
1126
1295
  }
1127
1296
  }
1128
1297
  .dark\:bg-red-900\/30 {
1129
- @media (prefers-color-scheme: dark) {
1298
+ &:where(.dark, .dark *) {
1130
1299
  background-color: color-mix(in srgb, oklch(39.6% 0.141 25.723) 30%, transparent);
1131
1300
  @supports (color: color-mix(in lab, red, red)) {
1132
1301
  background-color: color-mix(in oklab, var(--color-red-900) 30%, transparent);
@@ -1134,7 +1303,7 @@
1134
1303
  }
1135
1304
  }
1136
1305
  .dark\:bg-yellow-900\/20 {
1137
- @media (prefers-color-scheme: dark) {
1306
+ &:where(.dark, .dark *) {
1138
1307
  background-color: color-mix(in srgb, oklch(42.1% 0.095 57.708) 20%, transparent);
1139
1308
  @supports (color: color-mix(in lab, red, red)) {
1140
1309
  background-color: color-mix(in oklab, var(--color-yellow-900) 20%, transparent);
@@ -1142,7 +1311,7 @@
1142
1311
  }
1143
1312
  }
1144
1313
  .dark\:bg-yellow-900\/30 {
1145
- @media (prefers-color-scheme: dark) {
1314
+ &:where(.dark, .dark *) {
1146
1315
  background-color: color-mix(in srgb, oklch(42.1% 0.095 57.708) 30%, transparent);
1147
1316
  @supports (color: color-mix(in lab, red, red)) {
1148
1317
  background-color: color-mix(in oklab, var(--color-yellow-900) 30%, transparent);
@@ -1150,29 +1319,29 @@
1150
1319
  }
1151
1320
  }
1152
1321
  .dark\:from-gray-900 {
1153
- @media (prefers-color-scheme: dark) {
1322
+ &:where(.dark, .dark *) {
1154
1323
  --tw-gradient-from: var(--color-gray-900);
1155
1324
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1156
1325
  }
1157
1326
  }
1158
1327
  .dark\:to-gray-800 {
1159
- @media (prefers-color-scheme: dark) {
1328
+ &:where(.dark, .dark *) {
1160
1329
  --tw-gradient-to: var(--color-gray-800);
1161
1330
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1162
1331
  }
1163
1332
  }
1164
1333
  .dark\:text-blue-200 {
1165
- @media (prefers-color-scheme: dark) {
1334
+ &:where(.dark, .dark *) {
1166
1335
  color: var(--color-blue-200);
1167
1336
  }
1168
1337
  }
1169
1338
  .dark\:text-blue-300 {
1170
- @media (prefers-color-scheme: dark) {
1339
+ &:where(.dark, .dark *) {
1171
1340
  color: var(--color-blue-300);
1172
1341
  }
1173
1342
  }
1174
1343
  .dark\:text-blue-300\/70 {
1175
- @media (prefers-color-scheme: dark) {
1344
+ &:where(.dark, .dark *) {
1176
1345
  color: color-mix(in srgb, oklch(80.9% 0.105 251.813) 70%, transparent);
1177
1346
  @supports (color: color-mix(in lab, red, red)) {
1178
1347
  color: color-mix(in oklab, var(--color-blue-300) 70%, transparent);
@@ -1180,74 +1349,94 @@
1180
1349
  }
1181
1350
  }
1182
1351
  .dark\:text-blue-400 {
1183
- @media (prefers-color-scheme: dark) {
1352
+ &:where(.dark, .dark *) {
1184
1353
  color: var(--color-blue-400);
1185
1354
  }
1186
1355
  }
1187
1356
  .dark\:text-gray-100 {
1188
- @media (prefers-color-scheme: dark) {
1357
+ &:where(.dark, .dark *) {
1189
1358
  color: var(--color-gray-100);
1190
1359
  }
1191
1360
  }
1192
1361
  .dark\:text-gray-300 {
1193
- @media (prefers-color-scheme: dark) {
1362
+ &:where(.dark, .dark *) {
1194
1363
  color: var(--color-gray-300);
1195
1364
  }
1196
1365
  }
1197
1366
  .dark\:text-gray-400 {
1198
- @media (prefers-color-scheme: dark) {
1367
+ &:where(.dark, .dark *) {
1199
1368
  color: var(--color-gray-400);
1200
1369
  }
1201
1370
  }
1371
+ .dark\:text-gray-500 {
1372
+ &:where(.dark, .dark *) {
1373
+ color: var(--color-gray-500);
1374
+ }
1375
+ }
1202
1376
  .dark\:text-green-200 {
1203
- @media (prefers-color-scheme: dark) {
1377
+ &:where(.dark, .dark *) {
1204
1378
  color: var(--color-green-200);
1205
1379
  }
1206
1380
  }
1381
+ .dark\:text-green-300 {
1382
+ &:where(.dark, .dark *) {
1383
+ color: var(--color-green-300);
1384
+ }
1385
+ }
1207
1386
  .dark\:text-green-400 {
1208
- @media (prefers-color-scheme: dark) {
1387
+ &:where(.dark, .dark *) {
1209
1388
  color: var(--color-green-400);
1210
1389
  }
1211
1390
  }
1212
1391
  .dark\:text-primary-400 {
1213
- @media (prefers-color-scheme: dark) {
1392
+ &:where(.dark, .dark *) {
1214
1393
  color: var(--color-primary-400);
1215
1394
  }
1216
1395
  }
1217
1396
  .dark\:text-red-200 {
1218
- @media (prefers-color-scheme: dark) {
1397
+ &:where(.dark, .dark *) {
1219
1398
  color: var(--color-red-200);
1220
1399
  }
1221
1400
  }
1401
+ .dark\:text-red-300 {
1402
+ &:where(.dark, .dark *) {
1403
+ color: var(--color-red-300);
1404
+ }
1405
+ }
1222
1406
  .dark\:text-red-400 {
1223
- @media (prefers-color-scheme: dark) {
1407
+ &:where(.dark, .dark *) {
1224
1408
  color: var(--color-red-400);
1225
1409
  }
1226
1410
  }
1227
1411
  .dark\:text-white {
1228
- @media (prefers-color-scheme: dark) {
1412
+ &:where(.dark, .dark *) {
1229
1413
  color: var(--color-white);
1230
1414
  }
1231
1415
  }
1232
1416
  .dark\:text-yellow-200 {
1233
- @media (prefers-color-scheme: dark) {
1417
+ &:where(.dark, .dark *) {
1234
1418
  color: var(--color-yellow-200);
1235
1419
  }
1236
1420
  }
1421
+ .dark\:text-yellow-300 {
1422
+ &:where(.dark, .dark *) {
1423
+ color: var(--color-yellow-300);
1424
+ }
1425
+ }
1237
1426
  .dark\:text-yellow-400 {
1238
- @media (prefers-color-scheme: dark) {
1427
+ &:where(.dark, .dark *) {
1239
1428
  color: var(--color-yellow-400);
1240
1429
  }
1241
1430
  }
1242
1431
  .dark\:placeholder-gray-400 {
1243
- @media (prefers-color-scheme: dark) {
1432
+ &:where(.dark, .dark *) {
1244
1433
  &::placeholder {
1245
1434
  color: var(--color-gray-400);
1246
1435
  }
1247
1436
  }
1248
1437
  }
1249
1438
  .dark\:group-hover\:text-blue-400 {
1250
- @media (prefers-color-scheme: dark) {
1439
+ &:where(.dark, .dark *) {
1251
1440
  &:is(:where(.group):hover *) {
1252
1441
  @media (hover: hover) {
1253
1442
  color: var(--color-blue-400);
@@ -1256,7 +1445,7 @@
1256
1445
  }
1257
1446
  }
1258
1447
  .dark\:hover\:bg-gray-600 {
1259
- @media (prefers-color-scheme: dark) {
1448
+ &:where(.dark, .dark *) {
1260
1449
  &:hover {
1261
1450
  @media (hover: hover) {
1262
1451
  background-color: var(--color-gray-600);
@@ -1265,7 +1454,7 @@
1265
1454
  }
1266
1455
  }
1267
1456
  .dark\:hover\:bg-gray-700 {
1268
- @media (prefers-color-scheme: dark) {
1457
+ &:where(.dark, .dark *) {
1269
1458
  &:hover {
1270
1459
  @media (hover: hover) {
1271
1460
  background-color: var(--color-gray-700);
@@ -1273,8 +1462,17 @@
1273
1462
  }
1274
1463
  }
1275
1464
  }
1465
+ .dark\:hover\:bg-gray-750 {
1466
+ &:where(.dark, .dark *) {
1467
+ &:hover {
1468
+ @media (hover: hover) {
1469
+ background-color: var(--color-gray-750);
1470
+ }
1471
+ }
1472
+ }
1473
+ }
1276
1474
  .dark\:hover\:text-blue-400 {
1277
- @media (prefers-color-scheme: dark) {
1475
+ &:where(.dark, .dark *) {
1278
1476
  &:hover {
1279
1477
  @media (hover: hover) {
1280
1478
  color: var(--color-blue-400);
@@ -1283,7 +1481,7 @@
1283
1481
  }
1284
1482
  }
1285
1483
  .dark\:hover\:text-gray-200 {
1286
- @media (prefers-color-scheme: dark) {
1484
+ &:where(.dark, .dark *) {
1287
1485
  &:hover {
1288
1486
  @media (hover: hover) {
1289
1487
  color: var(--color-gray-200);
@@ -1291,8 +1489,17 @@
1291
1489
  }
1292
1490
  }
1293
1491
  }
1492
+ .dark\:hover\:text-primary-300 {
1493
+ &:where(.dark, .dark *) {
1494
+ &:hover {
1495
+ @media (hover: hover) {
1496
+ color: var(--color-primary-300);
1497
+ }
1498
+ }
1499
+ }
1500
+ }
1294
1501
  .dark\:hover\:text-primary-400 {
1295
- @media (prefers-color-scheme: dark) {
1502
+ &:where(.dark, .dark *) {
1296
1503
  &:hover {
1297
1504
  @media (hover: hover) {
1298
1505
  color: var(--color-primary-400);
@@ -1300,6 +1507,15 @@
1300
1507
  }
1301
1508
  }
1302
1509
  }
1510
+ .dark\:hover\:text-red-300 {
1511
+ &:where(.dark, .dark *) {
1512
+ &:hover {
1513
+ @media (hover: hover) {
1514
+ color: var(--color-red-300);
1515
+ }
1516
+ }
1517
+ }
1518
+ }
1303
1519
  }
1304
1520
  @layer components {
1305
1521
  .admin-input {
@@ -1328,16 +1544,16 @@
1328
1544
  &:focus {
1329
1545
  --tw-ring-color: var(--color-primary-500);
1330
1546
  }
1331
- @media (prefers-color-scheme: dark) {
1547
+ &:where(.dark, .dark *) {
1332
1548
  border-color: var(--color-gray-600);
1333
1549
  }
1334
- @media (prefers-color-scheme: dark) {
1550
+ &:where(.dark, .dark *) {
1335
1551
  background-color: var(--color-gray-700);
1336
1552
  }
1337
- @media (prefers-color-scheme: dark) {
1553
+ &:where(.dark, .dark *) {
1338
1554
  color: var(--color-gray-100);
1339
1555
  }
1340
- @media (prefers-color-scheme: dark) {
1556
+ &:where(.dark, .dark *) {
1341
1557
  &::placeholder {
1342
1558
  color: var(--color-gray-400);
1343
1559
  }
@@ -1370,16 +1586,16 @@
1370
1586
  &:focus {
1371
1587
  --tw-ring-color: var(--color-primary-500);
1372
1588
  }
1373
- @media (prefers-color-scheme: dark) {
1589
+ &:where(.dark, .dark *) {
1374
1590
  border-color: var(--color-gray-600);
1375
1591
  }
1376
- @media (prefers-color-scheme: dark) {
1592
+ &:where(.dark, .dark *) {
1377
1593
  background-color: var(--color-gray-700);
1378
1594
  }
1379
- @media (prefers-color-scheme: dark) {
1595
+ &:where(.dark, .dark *) {
1380
1596
  color: var(--color-gray-100);
1381
1597
  }
1382
- @media (prefers-color-scheme: dark) {
1598
+ &:where(.dark, .dark *) {
1383
1599
  &::placeholder {
1384
1600
  color: var(--color-gray-400);
1385
1601
  }
@@ -1408,13 +1624,13 @@
1408
1624
  &:focus {
1409
1625
  --tw-ring-color: var(--color-primary-500);
1410
1626
  }
1411
- @media (prefers-color-scheme: dark) {
1627
+ &:where(.dark, .dark *) {
1412
1628
  border-color: var(--color-gray-600);
1413
1629
  }
1414
- @media (prefers-color-scheme: dark) {
1630
+ &:where(.dark, .dark *) {
1415
1631
  background-color: var(--color-gray-700);
1416
1632
  }
1417
- @media (prefers-color-scheme: dark) {
1633
+ &:where(.dark, .dark *) {
1418
1634
  color: var(--color-gray-100);
1419
1635
  }
1420
1636
  }
@@ -1429,7 +1645,7 @@
1429
1645
  --tw-ring-offset-width: 0px;
1430
1646
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1431
1647
  }
1432
- @media (prefers-color-scheme: dark) {
1648
+ &:where(.dark, .dark *) {
1433
1649
  border-color: var(--color-gray-600);
1434
1650
  }
1435
1651
  }
@@ -1443,7 +1659,7 @@
1443
1659
  --tw-ring-offset-width: 0px;
1444
1660
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1445
1661
  }
1446
- @media (prefers-color-scheme: dark) {
1662
+ &:where(.dark, .dark *) {
1447
1663
  border-color: var(--color-gray-600);
1448
1664
  }
1449
1665
  }
@@ -1458,10 +1674,10 @@
1458
1674
  color: var(--color-primary-800);
1459
1675
  }
1460
1676
  }
1461
- @media (prefers-color-scheme: dark) {
1677
+ &:where(.dark, .dark *) {
1462
1678
  color: var(--color-primary-400);
1463
1679
  }
1464
- @media (prefers-color-scheme: dark) {
1680
+ &:where(.dark, .dark *) {
1465
1681
  &:hover {
1466
1682
  @media (hover: hover) {
1467
1683
  color: var(--color-primary-300);
@@ -1557,13 +1773,13 @@
1557
1773
  background-color: var(--color-gray-50);
1558
1774
  }
1559
1775
  }
1560
- @media (prefers-color-scheme: dark) {
1776
+ &:where(.dark, .dark *) {
1561
1777
  border-color: var(--color-gray-600);
1562
1778
  }
1563
- @media (prefers-color-scheme: dark) {
1779
+ &:where(.dark, .dark *) {
1564
1780
  color: var(--color-gray-300);
1565
1781
  }
1566
- @media (prefers-color-scheme: dark) {
1782
+ &:where(.dark, .dark *) {
1567
1783
  &:hover {
1568
1784
  @media (hover: hover) {
1569
1785
  background-color: var(--color-gray-700);
@@ -1579,10 +1795,10 @@
1579
1795
  background-color: var(--color-white);
1580
1796
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1581
1797
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1582
- @media (prefers-color-scheme: dark) {
1798
+ &:where(.dark, .dark *) {
1583
1799
  border-color: var(--color-gray-700);
1584
1800
  }
1585
- @media (prefers-color-scheme: dark) {
1801
+ &:where(.dark, .dark *) {
1586
1802
  background-color: var(--color-gray-800);
1587
1803
  }
1588
1804
  }
@@ -1591,7 +1807,7 @@
1591
1807
  font-size: var(--text-sm);
1592
1808
  line-height: var(--tw-leading, var(--text-sm--line-height));
1593
1809
  color: var(--color-red-600);
1594
- @media (prefers-color-scheme: dark) {
1810
+ &:where(.dark, .dark *) {
1595
1811
  color: var(--color-red-400);
1596
1812
  }
1597
1813
  }
@@ -1604,7 +1820,7 @@
1604
1820
  font-size: var(--text-sm);
1605
1821
  line-height: var(--tw-leading, var(--text-sm--line-height));
1606
1822
  color: var(--color-gray-600);
1607
- @media (prefers-color-scheme: dark) {
1823
+ &:where(.dark, .dark *) {
1608
1824
  color: var(--color-gray-400);
1609
1825
  }
1610
1826
  }
@@ -1634,16 +1850,16 @@
1634
1850
  &:focus {
1635
1851
  --tw-ring-color: var(--color-primary-500);
1636
1852
  }
1637
- @media (prefers-color-scheme: dark) {
1853
+ &:where(.dark, .dark *) {
1638
1854
  border-color: var(--color-gray-600);
1639
1855
  }
1640
- @media (prefers-color-scheme: dark) {
1856
+ &:where(.dark, .dark *) {
1641
1857
  background-color: var(--color-gray-700);
1642
1858
  }
1643
- @media (prefers-color-scheme: dark) {
1859
+ &:where(.dark, .dark *) {
1644
1860
  color: var(--color-gray-100);
1645
1861
  }
1646
- @media (prefers-color-scheme: dark) {
1862
+ &:where(.dark, .dark *) {
1647
1863
  &::placeholder {
1648
1864
  color: var(--color-gray-400);
1649
1865
  }
@@ -1676,16 +1892,16 @@
1676
1892
  &:focus {
1677
1893
  --tw-ring-color: var(--color-primary-500);
1678
1894
  }
1679
- @media (prefers-color-scheme: dark) {
1895
+ &:where(.dark, .dark *) {
1680
1896
  border-color: var(--color-gray-600);
1681
1897
  }
1682
- @media (prefers-color-scheme: dark) {
1898
+ &:where(.dark, .dark *) {
1683
1899
  background-color: var(--color-gray-700);
1684
1900
  }
1685
- @media (prefers-color-scheme: dark) {
1901
+ &:where(.dark, .dark *) {
1686
1902
  color: var(--color-gray-100);
1687
1903
  }
1688
- @media (prefers-color-scheme: dark) {
1904
+ &:where(.dark, .dark *) {
1689
1905
  &::placeholder {
1690
1906
  color: var(--color-gray-400);
1691
1907
  }
@@ -1714,13 +1930,13 @@
1714
1930
  &:focus {
1715
1931
  --tw-ring-color: var(--color-primary-500);
1716
1932
  }
1717
- @media (prefers-color-scheme: dark) {
1933
+ &:where(.dark, .dark *) {
1718
1934
  border-color: var(--color-gray-600);
1719
1935
  }
1720
- @media (prefers-color-scheme: dark) {
1936
+ &:where(.dark, .dark *) {
1721
1937
  background-color: var(--color-gray-700);
1722
1938
  }
1723
- @media (prefers-color-scheme: dark) {
1939
+ &:where(.dark, .dark *) {
1724
1940
  color: var(--color-gray-100);
1725
1941
  }
1726
1942
  }
@@ -1735,7 +1951,7 @@
1735
1951
  --tw-ring-offset-width: 0px;
1736
1952
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1737
1953
  }
1738
- @media (prefers-color-scheme: dark) {
1954
+ &:where(.dark, .dark *) {
1739
1955
  border-color: var(--color-gray-600);
1740
1956
  }
1741
1957
  }
@@ -1749,7 +1965,7 @@
1749
1965
  --tw-ring-offset-width: 0px;
1750
1966
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1751
1967
  }
1752
- @media (prefers-color-scheme: dark) {
1968
+ &:where(.dark, .dark *) {
1753
1969
  border-color: var(--color-gray-600);
1754
1970
  }
1755
1971
  }
@@ -1764,7 +1980,7 @@
1764
1980
  --tw-ring-offset-width: 0px;
1765
1981
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1766
1982
  }
1767
- @media (prefers-color-scheme: dark) {
1983
+ &:where(.dark, .dark *) {
1768
1984
  border-color: var(--color-gray-600);
1769
1985
  }
1770
1986
  }
@@ -1779,10 +1995,10 @@
1779
1995
  background-color: var(--color-gray-50);
1780
1996
  padding-inline: calc(var(--spacing) * 6);
1781
1997
  padding-block: calc(var(--spacing) * 4);
1782
- @media (prefers-color-scheme: dark) {
1998
+ &:where(.dark, .dark *) {
1783
1999
  border-color: var(--color-gray-700);
1784
2000
  }
1785
- @media (prefers-color-scheme: dark) {
2001
+ &:where(.dark, .dark *) {
1786
2002
  background-color: var(--color-gray-800);
1787
2003
  }
1788
2004
  }
@@ -1846,10 +2062,10 @@
1846
2062
  color: var(--color-primary-800);
1847
2063
  }
1848
2064
  }
1849
- @media (prefers-color-scheme: dark) {
2065
+ &:where(.dark, .dark *) {
1850
2066
  color: var(--color-primary-400);
1851
2067
  }
1852
- @media (prefers-color-scheme: dark) {
2068
+ &:where(.dark, .dark *) {
1853
2069
  &:hover {
1854
2070
  @media (hover: hover) {
1855
2071
  color: var(--color-primary-300);
@@ -1879,13 +2095,13 @@
1879
2095
  letter-spacing: var(--tracking-wider);
1880
2096
  color: var(--color-gray-700);
1881
2097
  text-transform: uppercase;
1882
- @media (prefers-color-scheme: dark) {
2098
+ &:where(.dark, .dark *) {
1883
2099
  border-color: var(--color-gray-700);
1884
2100
  }
1885
- @media (prefers-color-scheme: dark) {
2101
+ &:where(.dark, .dark *) {
1886
2102
  background-color: var(--color-gray-750);
1887
2103
  }
1888
- @media (prefers-color-scheme: dark) {
2104
+ &:where(.dark, .dark *) {
1889
2105
  color: var(--color-gray-300);
1890
2106
  }
1891
2107
  }
@@ -1897,10 +2113,10 @@
1897
2113
  color: var(--color-primary-600);
1898
2114
  }
1899
2115
  }
1900
- @media (prefers-color-scheme: dark) {
2116
+ &:where(.dark, .dark *) {
1901
2117
  color: var(--color-gray-300);
1902
2118
  }
1903
- @media (prefers-color-scheme: dark) {
2119
+ &:where(.dark, .dark *) {
1904
2120
  &:hover {
1905
2121
  @media (hover: hover) {
1906
2122
  color: var(--color-primary-400);
@@ -1920,10 +2136,10 @@
1920
2136
  background-color: var(--color-gray-50);
1921
2137
  }
1922
2138
  }
1923
- @media (prefers-color-scheme: dark) {
2139
+ &:where(.dark, .dark *) {
1924
2140
  border-color: var(--color-gray-700);
1925
2141
  }
1926
- @media (prefers-color-scheme: dark) {
2142
+ &:where(.dark, .dark *) {
1927
2143
  &:hover {
1928
2144
  @media (hover: hover) {
1929
2145
  background-color: var(--color-gray-750);
@@ -1937,7 +2153,7 @@
1937
2153
  font-size: var(--text-sm);
1938
2154
  line-height: var(--tw-leading, var(--text-sm--line-height));
1939
2155
  color: var(--color-gray-900);
1940
- @media (prefers-color-scheme: dark) {
2156
+ &:where(.dark, .dark *) {
1941
2157
  color: var(--color-gray-100);
1942
2158
  }
1943
2159
  text-align: left !important;
@@ -1950,10 +2166,10 @@
1950
2166
  color: var(--color-primary-800);
1951
2167
  }
1952
2168
  }
1953
- @media (prefers-color-scheme: dark) {
2169
+ &:where(.dark, .dark *) {
1954
2170
  color: var(--color-primary-400);
1955
2171
  }
1956
- @media (prefers-color-scheme: dark) {
2172
+ &:where(.dark, .dark *) {
1957
2173
  &:hover {
1958
2174
  @media (hover: hover) {
1959
2175
  color: var(--color-primary-300);
@@ -2007,10 +2223,10 @@
2007
2223
  color: var(--color-primary-600);
2008
2224
  }
2009
2225
  }
2010
- @media (prefers-color-scheme: dark) {
2226
+ &:where(.dark, .dark *) {
2011
2227
  color: var(--color-gray-400);
2012
2228
  }
2013
- @media (prefers-color-scheme: dark) {
2229
+ &:where(.dark, .dark *) {
2014
2230
  &:hover {
2015
2231
  @media (hover: hover) {
2016
2232
  color: var(--color-primary-400);
@@ -2035,10 +2251,10 @@
2035
2251
  color: var(--color-primary-800);
2036
2252
  }
2037
2253
  }
2038
- @media (prefers-color-scheme: dark) {
2254
+ &:where(.dark, .dark *) {
2039
2255
  color: var(--color-primary-400);
2040
2256
  }
2041
- @media (prefers-color-scheme: dark) {
2257
+ &:where(.dark, .dark *) {
2042
2258
  &:hover {
2043
2259
  @media (hover: hover) {
2044
2260
  color: var(--color-primary-300);
@@ -2102,20 +2318,20 @@
2102
2318
  }
2103
2319
  }
2104
2320
  }
2105
- @media (prefers-color-scheme: dark) {
2321
+ &:where(.dark, .dark *) {
2106
2322
  color: var(--color-gray-400);
2107
2323
  }
2108
- @media (prefers-color-scheme: dark) {
2324
+ &:where(.dark, .dark *) {
2109
2325
  &::file-selector-button {
2110
2326
  background-color: var(--color-gray-700);
2111
2327
  }
2112
2328
  }
2113
- @media (prefers-color-scheme: dark) {
2329
+ &:where(.dark, .dark *) {
2114
2330
  &::file-selector-button {
2115
2331
  color: var(--color-primary-400);
2116
2332
  }
2117
2333
  }
2118
- @media (prefers-color-scheme: dark) {
2334
+ &:where(.dark, .dark *) {
2119
2335
  &:hover {
2120
2336
  @media (hover: hover) {
2121
2337
  &::file-selector-button {
@@ -2146,16 +2362,16 @@
2146
2362
  background-color: var(--color-white);
2147
2363
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
2148
2364
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2149
- @media (prefers-color-scheme: dark) {
2365
+ &:where(.dark, .dark *) {
2150
2366
  border-color: var(--color-gray-600);
2151
2367
  }
2152
- @media (prefers-color-scheme: dark) {
2368
+ &:where(.dark, .dark *) {
2153
2369
  background-color: var(--color-gray-800);
2154
2370
  }
2155
2371
  }
2156
2372
  .calendar {
2157
2373
  background-color: var(--color-white);
2158
- @media (prefers-color-scheme: dark) {
2374
+ &:where(.dark, .dark *) {
2159
2375
  background-color: var(--color-gray-800);
2160
2376
  }
2161
2377
  }
@@ -2174,7 +2390,7 @@
2174
2390
  --tw-font-weight: var(--font-weight-medium);
2175
2391
  font-weight: var(--font-weight-medium);
2176
2392
  color: var(--color-gray-600);
2177
- @media (prefers-color-scheme: dark) {
2393
+ &:where(.dark, .dark *) {
2178
2394
  color: var(--color-gray-400);
2179
2395
  }
2180
2396
  }
@@ -2194,10 +2410,10 @@
2194
2410
  background-color: var(--color-primary-100);
2195
2411
  }
2196
2412
  }
2197
- @media (prefers-color-scheme: dark) {
2413
+ &:where(.dark, .dark *) {
2198
2414
  color: var(--color-gray-300);
2199
2415
  }
2200
- @media (prefers-color-scheme: dark) {
2416
+ &:where(.dark, .dark *) {
2201
2417
  &:hover {
2202
2418
  @media (hover: hover) {
2203
2419
  background-color: var(--color-primary-900);
@@ -2218,10 +2434,10 @@
2218
2434
  background-color: var(--color-gray-50);
2219
2435
  padding-inline: calc(var(--spacing) * 3);
2220
2436
  padding-block: calc(var(--spacing) * 2);
2221
- @media (prefers-color-scheme: dark) {
2437
+ &:where(.dark, .dark *) {
2222
2438
  border-color: var(--color-gray-700);
2223
2439
  }
2224
- @media (prefers-color-scheme: dark) {
2440
+ &:where(.dark, .dark *) {
2225
2441
  background-color: var(--color-gray-750);
2226
2442
  }
2227
2443
  }
@@ -2235,7 +2451,7 @@
2235
2451
  text-decoration-line: underline;
2236
2452
  }
2237
2453
  }
2238
- @media (prefers-color-scheme: dark) {
2454
+ &:where(.dark, .dark *) {
2239
2455
  color: var(--color-primary-400);
2240
2456
  }
2241
2457
  }
@@ -2247,10 +2463,10 @@
2247
2463
  padding-inline: calc(var(--spacing) * 3);
2248
2464
  padding-block: calc(var(--spacing) * 2);
2249
2465
  text-align: center;
2250
- @media (prefers-color-scheme: dark) {
2466
+ &:where(.dark, .dark *) {
2251
2467
  border-color: var(--color-gray-700);
2252
2468
  }
2253
- @media (prefers-color-scheme: dark) {
2469
+ &:where(.dark, .dark *) {
2254
2470
  background-color: var(--color-gray-750);
2255
2471
  }
2256
2472
  }
@@ -2263,7 +2479,7 @@
2263
2479
  color: var(--color-gray-900);
2264
2480
  }
2265
2481
  }
2266
- @media (prefers-color-scheme: dark) {
2482
+ &:where(.dark, .dark *) {
2267
2483
  color: var(--color-gray-400);
2268
2484
  }
2269
2485
  }
@@ -2290,10 +2506,10 @@
2290
2506
  background-color: var(--color-primary-100);
2291
2507
  }
2292
2508
  }
2293
- @media (prefers-color-scheme: dark) {
2509
+ &:where(.dark, .dark *) {
2294
2510
  color: var(--color-gray-300);
2295
2511
  }
2296
- @media (prefers-color-scheme: dark) {
2512
+ &:where(.dark, .dark *) {
2297
2513
  &:hover {
2298
2514
  @media (hover: hover) {
2299
2515
  background-color: var(--color-primary-900);
@@ -2303,7 +2519,7 @@
2303
2519
  }
2304
2520
  .datetimeshortcuts a {
2305
2521
  color: var(--color-primary-600);
2306
- @media (prefers-color-scheme: dark) {
2522
+ &:where(.dark, .dark *) {
2307
2523
  color: var(--color-primary-400);
2308
2524
  }
2309
2525
  }
@@ -2329,10 +2545,10 @@
2329
2545
  border-width: 1px;
2330
2546
  border-color: var(--color-gray-300);
2331
2547
  background-color: var(--color-white);
2332
- @media (prefers-color-scheme: dark) {
2548
+ &:where(.dark, .dark *) {
2333
2549
  border-color: var(--color-gray-600);
2334
2550
  }
2335
- @media (prefers-color-scheme: dark) {
2551
+ &:where(.dark, .dark *) {
2336
2552
  background-color: var(--color-gray-700);
2337
2553
  }
2338
2554
  }
@@ -2352,10 +2568,10 @@
2352
2568
  background-color: var(--color-gray-200);
2353
2569
  }
2354
2570
  }
2355
- @media (prefers-color-scheme: dark) {
2571
+ &:where(.dark, .dark *) {
2356
2572
  background-color: var(--color-gray-700);
2357
2573
  }
2358
- @media (prefers-color-scheme: dark) {
2574
+ &:where(.dark, .dark *) {
2359
2575
  &:hover {
2360
2576
  @media (hover: hover) {
2361
2577
  background-color: var(--color-gray-600);
@@ -2373,10 +2589,10 @@
2373
2589
  background-color: var(--color-gray-50);
2374
2590
  padding-inline: calc(var(--spacing) * 4);
2375
2591
  padding-block: calc(var(--spacing) * 3);
2376
- @media (prefers-color-scheme: dark) {
2592
+ &:where(.dark, .dark *) {
2377
2593
  border-color: var(--color-gray-700);
2378
2594
  }
2379
- @media (prefers-color-scheme: dark) {
2595
+ &:where(.dark, .dark *) {
2380
2596
  background-color: var(--color-gray-750);
2381
2597
  }
2382
2598
  }
@@ -2414,6 +2630,69 @@
2414
2630
  font-size: var(--text-xs);
2415
2631
  line-height: var(--tw-leading, var(--text-xs--line-height));
2416
2632
  }
2633
+ .inline-related input[type="text"], .inline-related input[type="number"], .inline-related input[type="url"], .inline-related input[type="email"], .inline-related select, .inline-related textarea {
2634
+ width: 100%;
2635
+ border-radius: var(--radius-md);
2636
+ border-style: var(--tw-border-style);
2637
+ border-width: 1px;
2638
+ border-color: var(--color-gray-300);
2639
+ background-color: var(--color-white);
2640
+ padding-inline: calc(var(--spacing) * 3);
2641
+ padding-block: calc(var(--spacing) * 2);
2642
+ font-size: var(--text-sm);
2643
+ line-height: var(--tw-leading, var(--text-sm--line-height));
2644
+ --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
2645
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2646
+ &:focus {
2647
+ border-color: var(--color-primary-500);
2648
+ }
2649
+ &:focus {
2650
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2651
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2652
+ }
2653
+ &:focus {
2654
+ --tw-ring-color: var(--color-primary-500);
2655
+ }
2656
+ &:where(.dark, .dark *) {
2657
+ border-color: var(--color-gray-600);
2658
+ }
2659
+ &:where(.dark, .dark *) {
2660
+ background-color: var(--color-gray-700);
2661
+ }
2662
+ &:where(.dark, .dark *) {
2663
+ color: var(--color-white);
2664
+ }
2665
+ }
2666
+ .inline-related input[type="checkbox"] {
2667
+ height: calc(var(--spacing) * 4);
2668
+ width: calc(var(--spacing) * 4);
2669
+ border-radius: 0.25rem;
2670
+ border-color: var(--color-gray-300);
2671
+ background-color: var(--color-white);
2672
+ color: var(--color-primary-600);
2673
+ &:focus {
2674
+ --tw-ring-color: var(--color-primary-500);
2675
+ }
2676
+ &:where(.dark, .dark *) {
2677
+ border-color: var(--color-gray-600);
2678
+ }
2679
+ &:where(.dark, .dark *) {
2680
+ background-color: var(--color-gray-700);
2681
+ }
2682
+ }
2683
+ .collapse-icon.rotate-180 {
2684
+ transform: rotate(180deg);
2685
+ }
2686
+ .empty-form {
2687
+ display: none;
2688
+ }
2689
+ .inline-related.marked-for-deletion {
2690
+ opacity: 0.5;
2691
+ background-color: rgb(254 242 242) !important;
2692
+ }
2693
+ .dark .inline-related.marked-for-deletion {
2694
+ background-color: rgb(127 29 29 / 0.3) !important;
2695
+ }
2417
2696
  }
2418
2697
  @property --tw-translate-x {
2419
2698
  syntax: "*";
@@ -2460,6 +2739,11 @@
2460
2739
  inherits: false;
2461
2740
  initial-value: 0;
2462
2741
  }
2742
+ @property --tw-divide-y-reverse {
2743
+ syntax: "*";
2744
+ inherits: false;
2745
+ initial-value: 0;
2746
+ }
2463
2747
  @property --tw-border-style {
2464
2748
  syntax: "*";
2465
2749
  inherits: false;
@@ -2580,59 +2864,6 @@
2580
2864
  inherits: false;
2581
2865
  initial-value: 0 0 #0000;
2582
2866
  }
2583
- @property --tw-blur {
2584
- syntax: "*";
2585
- inherits: false;
2586
- }
2587
- @property --tw-brightness {
2588
- syntax: "*";
2589
- inherits: false;
2590
- }
2591
- @property --tw-contrast {
2592
- syntax: "*";
2593
- inherits: false;
2594
- }
2595
- @property --tw-grayscale {
2596
- syntax: "*";
2597
- inherits: false;
2598
- }
2599
- @property --tw-hue-rotate {
2600
- syntax: "*";
2601
- inherits: false;
2602
- }
2603
- @property --tw-invert {
2604
- syntax: "*";
2605
- inherits: false;
2606
- }
2607
- @property --tw-opacity {
2608
- syntax: "*";
2609
- inherits: false;
2610
- }
2611
- @property --tw-saturate {
2612
- syntax: "*";
2613
- inherits: false;
2614
- }
2615
- @property --tw-sepia {
2616
- syntax: "*";
2617
- inherits: false;
2618
- }
2619
- @property --tw-drop-shadow {
2620
- syntax: "*";
2621
- inherits: false;
2622
- }
2623
- @property --tw-drop-shadow-color {
2624
- syntax: "*";
2625
- inherits: false;
2626
- }
2627
- @property --tw-drop-shadow-alpha {
2628
- syntax: "<percentage>";
2629
- inherits: false;
2630
- initial-value: 100%;
2631
- }
2632
- @property --tw-drop-shadow-size {
2633
- syntax: "*";
2634
- inherits: false;
2635
- }
2636
2867
  @property --tw-duration {
2637
2868
  syntax: "*";
2638
2869
  inherits: false;
@@ -2654,6 +2885,7 @@
2654
2885
  --tw-skew-y: initial;
2655
2886
  --tw-space-y-reverse: 0;
2656
2887
  --tw-space-x-reverse: 0;
2888
+ --tw-divide-y-reverse: 0;
2657
2889
  --tw-border-style: solid;
2658
2890
  --tw-gradient-position: initial;
2659
2891
  --tw-gradient-from: #0000;
@@ -2680,19 +2912,6 @@
2680
2912
  --tw-ring-offset-width: 0px;
2681
2913
  --tw-ring-offset-color: #fff;
2682
2914
  --tw-ring-offset-shadow: 0 0 #0000;
2683
- --tw-blur: initial;
2684
- --tw-brightness: initial;
2685
- --tw-contrast: initial;
2686
- --tw-grayscale: initial;
2687
- --tw-hue-rotate: initial;
2688
- --tw-invert: initial;
2689
- --tw-opacity: initial;
2690
- --tw-saturate: initial;
2691
- --tw-sepia: initial;
2692
- --tw-drop-shadow: initial;
2693
- --tw-drop-shadow-color: initial;
2694
- --tw-drop-shadow-alpha: 100%;
2695
- --tw-drop-shadow-size: initial;
2696
2915
  --tw-duration: initial;
2697
2916
  --tw-ease: initial;
2698
2917
  }