@sigx/zero-daisyui 0.7.0 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/dist/audit.json +3868 -2
  2. package/dist/components.d.ts +37 -1
  3. package/dist/components.js +4 -0
  4. package/dist/css/components/avatar-group.css +168 -0
  5. package/dist/css/components/breadcrumbs.css +30 -0
  6. package/dist/css/components/card.css +26 -0
  7. package/dist/css/components/chat-log.css +172 -0
  8. package/dist/css/components/divider.css +68 -3
  9. package/dist/css/components/hover-card.css +174 -0
  10. package/dist/css/components/menu.css +7 -0
  11. package/dist/css/components/menubar.css +75 -0
  12. package/dist/css/components/pagination.css +83 -0
  13. package/dist/css/components/steps.css +103 -0
  14. package/dist/css/components/timeline.css +14 -0
  15. package/dist/css/components/toast.css +65 -0
  16. package/dist/css/components/tree-view.css +118 -0
  17. package/dist/css/index.css +1165 -69
  18. package/dist/lynx/components/accordion.css +3 -1
  19. package/dist/lynx/components/avatar-group.css +97 -0
  20. package/dist/lynx/components/breadcrumbs.css +44 -0
  21. package/dist/lynx/components/button.css +71 -12
  22. package/dist/lynx/components/card.css +9 -0
  23. package/dist/lynx/components/chat-log.css +147 -0
  24. package/dist/lynx/components/dialog.css +9 -3
  25. package/dist/lynx/components/divider.css +12 -2
  26. package/dist/lynx/components/hover-card.css +211 -0
  27. package/dist/lynx/components/menu.css +7 -0
  28. package/dist/lynx/components/menubar.css +199 -0
  29. package/dist/lynx/components/pagination.css +107 -0
  30. package/dist/lynx/components/popover.css +7 -2
  31. package/dist/lynx/components/select.css +40 -3
  32. package/dist/lynx/components/slider.css +3 -2
  33. package/dist/lynx/components/steps.css +103 -0
  34. package/dist/lynx/components/switch.css +2 -1
  35. package/dist/lynx/components/tabs.css +7 -1
  36. package/dist/lynx/components/timeline.css +32 -0
  37. package/dist/lynx/components/toast.css +70 -2
  38. package/dist/lynx/components/tree-view.css +28 -0
  39. package/dist/lynx/index.css +1297 -114
  40. package/dist/lynx/manifest.json +112 -4
  41. package/dist/manifest.json +110 -2
  42. package/dist/recipes.d.ts +20 -1
  43. package/dist/recipes.d.ts.map +1 -1
  44. package/dist/recipes.js +853 -99
  45. package/dist/recipes.js.map +1 -1
  46. package/dist/register.d.ts +36 -0
  47. package/dist/report.json +1320 -213
  48. package/package.json +4 -4
  49. package/src/recipes.ts +877 -99
@@ -698,8 +698,9 @@
698
698
  }
699
699
 
700
700
  .zx-tabs__tab.zx-f-focus-visible {
701
- outline: 2px solid var(--color-base-content);
701
+ outline: none;
702
702
  outline-offset: 2px;
703
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
703
704
  }
704
705
 
705
706
  .zx-tabs__tab.zx-f-pressed {
@@ -1104,6 +1105,11 @@
1104
1105
  box-shadow: var(--shadow-sm);
1105
1106
  }
1106
1107
 
1108
+ .zx-tabs__tab.zx-a-variant-box.zx-f-focus-visible {
1109
+ outline: none;
1110
+ box-shadow: 0 0 0 2px var(--color-base-200), 0 0 0 4px var(--color-base-content);
1111
+ }
1112
+
1107
1113
  .zx-tabs__tab.zx-a-variant-box.zx-a-color-primary.zx-s-active {
1108
1114
  background: var(--color-primary);
1109
1115
  color: var(--color-primary-content);
@@ -1478,8 +1484,9 @@
1478
1484
  }
1479
1485
 
1480
1486
  .zx-switch__control.zx-f-focus-visible {
1481
- outline: 2px solid var(--switch-accent);
1487
+ outline: none;
1482
1488
  outline-offset: 2px;
1489
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--switch-accent), 0 1px var(--depth-shade) inset;
1483
1490
  }
1484
1491
 
1485
1492
  .zx-switch__thumb {
@@ -1587,6 +1594,9 @@
1587
1594
  transition: background var(--duration-normal) var(--ease-standard);
1588
1595
  padding-left: calc(var(--size-field) * 4);
1589
1596
  padding-right: calc(var(--size-field) * 4);
1597
+ width: max-content;
1598
+ flex-shrink: 0;
1599
+ flex-wrap: nowrap;
1590
1600
  }
1591
1601
 
1592
1602
  .zx-dialog__trigger.zx-f-disabled {
@@ -1595,8 +1605,9 @@
1595
1605
  }
1596
1606
 
1597
1607
  .zx-dialog__trigger.zx-f-focus-visible {
1598
- outline: 2px solid var(--color-base-content);
1608
+ outline: none;
1599
1609
  outline-offset: 2px;
1610
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
1600
1611
  }
1601
1612
 
1602
1613
  .zx-dialog__trigger.zx-f-pressed {
@@ -1694,8 +1705,9 @@
1694
1705
  }
1695
1706
 
1696
1707
  .zx-dialog__close.zx-f-focus-visible {
1697
- outline: 2px solid var(--color-base-content);
1708
+ outline: none;
1698
1709
  outline-offset: 2px;
1710
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
1699
1711
  }
1700
1712
 
1701
1713
  .zx-dialog__close.zx-f-pressed {
@@ -1729,8 +1741,9 @@
1729
1741
  }
1730
1742
 
1731
1743
  .zx-dialog__cancel.zx-f-focus-visible {
1732
- outline: 2px solid var(--color-base-content);
1744
+ outline: none;
1733
1745
  outline-offset: 2px;
1746
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
1734
1747
  }
1735
1748
 
1736
1749
  .zx-dialog__cancel.zx-f-pressed {
@@ -1876,6 +1889,9 @@
1876
1889
  transition: background var(--duration-normal) var(--ease-standard);
1877
1890
  padding-left: calc(var(--size-field) * 4);
1878
1891
  padding-right: calc(var(--size-field) * 4);
1892
+ width: max-content;
1893
+ flex-shrink: 0;
1894
+ flex-wrap: nowrap;
1879
1895
  }
1880
1896
 
1881
1897
  .zx-popover__trigger.zx-f-disabled {
@@ -1888,8 +1904,9 @@
1888
1904
  }
1889
1905
 
1890
1906
  .zx-popover__trigger.zx-f-focus-visible {
1891
- outline: 2px solid var(--color-base-content);
1907
+ outline: none;
1892
1908
  outline-offset: 2px;
1909
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
1893
1910
  }
1894
1911
 
1895
1912
  .zx-popover__trigger.zx-f-pressed {
@@ -1972,8 +1989,9 @@
1972
1989
  }
1973
1990
 
1974
1991
  .zx-popover__close.zx-f-focus-visible {
1975
- outline: 2px solid var(--color-base-content);
1992
+ outline: none;
1976
1993
  outline-offset: 2px;
1994
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
1977
1995
  }
1978
1996
 
1979
1997
  .zx-popover__close.zx-f-pressed {
@@ -2267,6 +2285,218 @@
2267
2285
  padding-right: calc(var(--size-field) * 6);
2268
2286
  }
2269
2287
 
2288
+ .zx-hover-card__trigger {
2289
+ color: inherit;
2290
+ text-decoration-line: underline;
2291
+ text-underline-offset: 2px;
2292
+ cursor: pointer;
2293
+ border-radius: var(--radius-selector);
2294
+ }
2295
+
2296
+ .zx-hover-card__trigger.zx-s-open {
2297
+ text-decoration-thickness: 2px;
2298
+ }
2299
+
2300
+ .zx-hover-card__trigger.zx-f-focus-visible {
2301
+ outline: 2px solid var(--color-base-content);
2302
+ outline-offset: 2px;
2303
+ }
2304
+
2305
+ .zx-hover-card__popup {
2306
+ opacity: 0;
2307
+ transform: translateY(-4px);
2308
+ transition: opacity var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard), display var(--duration-fast) allow-discrete, overlay var(--duration-fast) allow-discrete;
2309
+ background: var(--color-base-100);
2310
+ color: var(--color-base-content);
2311
+ border: var(--border) solid var(--color-base-300);
2312
+ border-radius: var(--radius-box);
2313
+ box-shadow: var(--shadow-lg);
2314
+ padding: var(--space-xl);
2315
+ max-width: 20rem;
2316
+ font-size: var(--text-sm);
2317
+ }
2318
+
2319
+ .zx-hover-card__popup.zx-s-open {
2320
+ opacity: 1;
2321
+ transform: none;
2322
+ }
2323
+
2324
+ .zx-root .zx-hover-card__trigger.zx-a-color-primary {
2325
+ color: #3f2bcb;
2326
+ }
2327
+
2328
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-primary {
2329
+ color: #6567ff;
2330
+ }
2331
+
2332
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-primary {
2333
+ color: #a0e791;
2334
+ }
2335
+
2336
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-primary {
2337
+ color: #5c7da6;
2338
+ }
2339
+
2340
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-primary {
2341
+ color: #fb8a62;
2342
+ }
2343
+
2344
+ .zx-root .zx-hover-card__trigger.zx-a-color-secondary {
2345
+ color: #ad316f;
2346
+ }
2347
+
2348
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-secondary {
2349
+ color: #fa7cb6;
2350
+ }
2351
+
2352
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-secondary {
2353
+ color: #ed9984;
2354
+ }
2355
+
2356
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-secondary {
2357
+ color: #677e98;
2358
+ }
2359
+
2360
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-secondary {
2361
+ color: #e68aac;
2362
+ }
2363
+
2364
+ .zx-root .zx-hover-card__trigger.zx-a-color-accent {
2365
+ color: #2b786d;
2366
+ }
2367
+
2368
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-accent {
2369
+ color: #93e5d9;
2370
+ }
2371
+
2372
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-accent {
2373
+ color: #bfade1;
2374
+ }
2375
+
2376
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-accent {
2377
+ color: #5e7d8c;
2378
+ }
2379
+
2380
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-accent {
2381
+ color: #ab9fe8;
2382
+ }
2383
+
2384
+ .zx-root .zx-hover-card__trigger.zx-a-color-neutral {
2385
+ color: #121214;
2386
+ }
2387
+
2388
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-neutral {
2389
+ color: #878e92;
2390
+ }
2391
+
2392
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-neutral {
2393
+ color: #71828c;
2394
+ }
2395
+
2396
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-neutral {
2397
+ color: #3a4150;
2398
+ }
2399
+
2400
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-neutral {
2401
+ color: #667a8a;
2402
+ }
2403
+
2404
+ .zx-root .zx-hover-card__trigger.zx-a-color-info {
2405
+ color: #2685b3;
2406
+ }
2407
+
2408
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-info {
2409
+ color: #70ceff;
2410
+ }
2411
+
2412
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-info {
2413
+ color: #6ce2f3;
2414
+ }
2415
+
2416
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-info {
2417
+ color: #89728a;
2418
+ }
2419
+
2420
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-info {
2421
+ color: #91d4e3;
2422
+ }
2423
+
2424
+ .zx-root .zx-hover-card__trigger.zx-a-color-success {
2425
+ color: #2a7858;
2426
+ }
2427
+
2428
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-success {
2429
+ color: #92e5c2;
2430
+ }
2431
+
2432
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-success {
2433
+ color: #8ee0c9;
2434
+ }
2435
+
2436
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-success {
2437
+ color: #6b7d6a;
2438
+ }
2439
+
2440
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-success {
2441
+ color: #a6cebe;
2442
+ }
2443
+
2444
+ .zx-root .zx-hover-card__trigger.zx-a-color-warning {
2445
+ color: #755a2b;
2446
+ }
2447
+
2448
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-warning {
2449
+ color: #f5ddac;
2450
+ }
2451
+
2452
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-warning {
2453
+ color: #cecfa6;
2454
+ }
2455
+
2456
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-warning {
2457
+ color: #7d7463;
2458
+ }
2459
+
2460
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-warning {
2461
+ color: #c5c1b7;
2462
+ }
2463
+
2464
+ .zx-root .zx-hover-card__trigger.zx-a-color-error {
2465
+ color: #d9576d;
2466
+ }
2467
+
2468
+ .zx-root.zx-theme-dark .zx-hover-card__trigger.zx-a-color-error {
2469
+ color: #ff7d90;
2470
+ }
2471
+
2472
+ .zx-root.zx-theme-dim .zx-hover-card__trigger.zx-a-color-error {
2473
+ color: #f5b3a4;
2474
+ }
2475
+
2476
+ .zx-root.zx-theme-nord .zx-hover-card__trigger.zx-a-color-error {
2477
+ color: #a85b64;
2478
+ }
2479
+
2480
+ .zx-root.zx-theme-sunset .zx-hover-card__trigger.zx-a-color-error {
2481
+ color: #f2bbc0;
2482
+ }
2483
+
2484
+ .zx-hover-card__trigger.zx-a-size-xs {
2485
+ font-size: var(--text-xs);
2486
+ }
2487
+
2488
+ .zx-hover-card__trigger.zx-a-size-sm {
2489
+ font-size: var(--text-sm);
2490
+ }
2491
+
2492
+ .zx-hover-card__trigger.zx-a-size-lg {
2493
+ font-size: var(--text-lg);
2494
+ }
2495
+
2496
+ .zx-hover-card__trigger.zx-a-size-xl {
2497
+ font-size: var(--text-xl);
2498
+ }
2499
+
2270
2500
  .zx-menu__trigger {
2271
2501
  appearance: none;
2272
2502
  display: flex;
@@ -2443,6 +2673,13 @@
2443
2673
  opacity: 0.6;
2444
2674
  }
2445
2675
 
2676
+ .zx-menu__shortcut {
2677
+ font-size: var(--text-xs);
2678
+ opacity: 0.75;
2679
+ margin-left: auto;
2680
+ padding-left: var(--space-lg);
2681
+ }
2682
+
2446
2683
  .zx-menu__separator {
2447
2684
  height: var(--border);
2448
2685
  margin: var(--space-sm) var(--space-md);
@@ -2565,128 +2802,328 @@
2565
2802
  padding-right: calc(var(--size-field) * 6);
2566
2803
  }
2567
2804
 
2568
- .zx-field__root {
2569
- --field-accent: var(--color-base-content);
2805
+ .zx-menubar__root {
2806
+ --menubar-surface: var(--color-base-200);
2570
2807
  }
2571
2808
 
2572
- .zx-field__root {
2809
+ .zx-menubar__root {
2573
2810
  display: flex;
2811
+ align-items: center;
2812
+ gap: var(--space-xs);
2813
+ padding: var(--space-xs);
2814
+ width: max-content;
2815
+ max-width: 100%;
2816
+ flex-wrap: wrap;
2817
+ background: var(--menubar-surface);
2818
+ border-radius: var(--radius-box);
2819
+ }
2820
+
2821
+ .zx-menubar__root.zx-o-vertical {
2574
2822
  flex-direction: column;
2575
- gap: var(--space-sm);
2823
+ align-items: stretch;
2576
2824
  }
2577
2825
 
2578
- .zx-field__label {
2579
- font-size: var(--text-sm);
2580
- font-weight: var(--weight-semibold);
2581
- color: var(--field-accent);
2826
+ .zx-root .zx-menubar__root.zx-a-color-primary {
2827
+ --menubar-surface: #dee2f7;
2582
2828
  }
2583
2829
 
2584
- .zx-field__label.zx-f-disabled {
2585
- opacity: var(--disabled-opacity);
2830
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-primary {
2831
+ --menubar-surface: #1a283b;
2586
2832
  }
2587
2833
 
2588
- .zx-field__description {
2589
- margin: 0;
2590
- font-size: var(--text-xs);
2591
- opacity: 0.6;
2834
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-primary {
2835
+ --menubar-surface: #2d3c4c;
2592
2836
  }
2593
2837
 
2594
- .zx-field__error {
2595
- margin: 0;
2596
- font-size: var(--text-xs);
2597
- font-weight: var(--weight-medium);
2838
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-primary {
2839
+ --menubar-surface: #d5dce8;
2598
2840
  }
2599
2841
 
2600
- .zx-root .zx-field__error {
2601
- color: #d9576d;
2842
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-primary {
2843
+ --menubar-surface: #1b2537;
2602
2844
  }
2603
2845
 
2604
- .zx-root.zx-theme-dark .zx-field__error {
2605
- color: #ff7d90;
2846
+ .zx-root .zx-menubar__root.zx-a-color-secondary {
2847
+ --menubar-surface: #fce4ec;
2606
2848
  }
2607
2849
 
2608
- .zx-root.zx-theme-dim .zx-field__error {
2609
- color: #f5b3a4;
2850
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-secondary {
2851
+ --menubar-surface: #20293e;
2610
2852
  }
2611
2853
 
2612
- .zx-root.zx-theme-nord .zx-field__error {
2613
- color: #a85b64;
2854
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-secondary {
2855
+ --menubar-surface: #33354a;
2614
2856
  }
2615
2857
 
2616
- .zx-root.zx-theme-sunset .zx-field__error {
2617
- color: #f2bbc0;
2858
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-secondary {
2859
+ --menubar-surface: #d9e0eb;
2618
2860
  }
2619
2861
 
2620
- .zx-root .zx-field__root.zx-a-color-primary {
2621
- --field-accent: #3f2bcb;
2862
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-secondary {
2863
+ --menubar-surface: #182537;
2622
2864
  }
2623
2865
 
2624
- .zx-root.zx-theme-dark .zx-field__root.zx-a-color-primary {
2625
- --field-accent: #6567ff;
2866
+ .zx-root .zx-menubar__root.zx-a-color-accent {
2867
+ --menubar-surface: #e5f4f1;
2626
2868
  }
2627
2869
 
2628
- .zx-root.zx-theme-dim .zx-field__root.zx-a-color-primary {
2629
- --field-accent: #a0e791;
2870
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-accent {
2871
+ --menubar-surface: #212f3b;
2630
2872
  }
2631
2873
 
2632
- .zx-root.zx-theme-nord .zx-field__root.zx-a-color-primary {
2633
- --field-accent: #5c7da6;
2874
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-accent {
2875
+ --menubar-surface: #303648;
2634
2876
  }
2635
2877
 
2636
- .zx-root.zx-theme-sunset .zx-field__root.zx-a-color-primary {
2637
- --field-accent: #fb8a62;
2878
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-accent {
2879
+ --menubar-surface: #dce3ee;
2638
2880
  }
2639
2881
 
2640
- .zx-root .zx-field__root.zx-a-color-secondary {
2641
- --field-accent: #ad316f;
2882
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-accent {
2883
+ --menubar-surface: #162636;
2642
2884
  }
2643
2885
 
2644
- .zx-root.zx-theme-dark .zx-field__root.zx-a-color-secondary {
2645
- --field-accent: #fa7cb6;
2886
+ .zx-root .zx-menubar__root.zx-a-color-neutral {
2887
+ --menubar-surface: #d7d7d7;
2646
2888
  }
2647
2889
 
2648
- .zx-root.zx-theme-dim .zx-field__root.zx-a-color-secondary {
2649
- --field-accent: #ed9984;
2890
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-neutral {
2891
+ --menubar-surface: #171b21;
2650
2892
  }
2651
2893
 
2652
- .zx-root.zx-theme-nord .zx-field__root.zx-a-color-secondary {
2653
- --field-accent: #677e98;
2894
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-neutral {
2895
+ --menubar-surface: #232832;
2654
2896
  }
2655
2897
 
2656
- .zx-root.zx-theme-sunset .zx-field__root.zx-a-color-secondary {
2657
- --field-accent: #e68aac;
2898
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-neutral {
2899
+ --menubar-surface: #d1d6df;
2658
2900
  }
2659
2901
 
2660
- .zx-root .zx-field__root.zx-a-color-accent {
2661
- --field-accent: #2b786d;
2902
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-neutral {
2903
+ --menubar-surface: #0f1920;
2662
2904
  }
2663
2905
 
2664
- .zx-root.zx-theme-dark .zx-field__root.zx-a-color-accent {
2665
- --field-accent: #93e5d9;
2906
+ .zx-root .zx-menubar__root.zx-a-color-info {
2907
+ --menubar-surface: #e3f1fa;
2666
2908
  }
2667
2909
 
2668
- .zx-root.zx-theme-dim .zx-field__root.zx-a-color-accent {
2669
- --field-accent: #bfade1;
2910
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-info {
2911
+ --menubar-surface: #212e3b;
2670
2912
  }
2671
2913
 
2672
- .zx-root.zx-theme-nord .zx-field__root.zx-a-color-accent {
2673
- --field-accent: #5e7d8c;
2914
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-info {
2915
+ --menubar-surface: #2f3b4d;
2674
2916
  }
2675
2917
 
2676
- .zx-root.zx-theme-sunset .zx-field__root.zx-a-color-accent {
2677
- --field-accent: #ab9fe8;
2918
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-info {
2919
+ --menubar-surface: #dbdfeb;
2678
2920
  }
2679
2921
 
2680
- .zx-root .zx-field__root.zx-a-color-neutral {
2681
- --field-accent: #121214;
2922
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-info {
2923
+ --menubar-surface: #1b2a34;
2682
2924
  }
2683
2925
 
2684
- .zx-root.zx-theme-dark .zx-field__root.zx-a-color-neutral {
2685
- --field-accent: #878e92;
2926
+ .zx-root .zx-menubar__root.zx-a-color-success {
2927
+ --menubar-surface: #e4f4eb;
2686
2928
  }
2687
2929
 
2688
- .zx-root.zx-theme-dim .zx-field__root.zx-a-color-neutral {
2689
- --field-accent: #71828c;
2930
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-success {
2931
+ --menubar-surface: #1e2f3c;
2932
+ }
2933
+
2934
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-success {
2935
+ --menubar-surface: #2e3c4c;
2936
+ }
2937
+
2938
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-success {
2939
+ --menubar-surface: #d9e4ee;
2940
+ }
2941
+
2942
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-success {
2943
+ --menubar-surface: #1a2b33;
2944
+ }
2945
+
2946
+ .zx-root .zx-menubar__root.zx-a-color-warning {
2947
+ --menubar-surface: #f9f1e3;
2948
+ }
2949
+
2950
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-warning {
2951
+ --menubar-surface: #1d323c;
2952
+ }
2953
+
2954
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-warning {
2955
+ --menubar-surface: #2b3d4b;
2956
+ }
2957
+
2958
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-warning {
2959
+ --menubar-surface: #dbe8f2;
2960
+ }
2961
+
2962
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-warning {
2963
+ --menubar-surface: #192c32;
2964
+ }
2965
+
2966
+ .zx-root .zx-menubar__root.zx-a-color-error {
2967
+ --menubar-surface: #fce7e9;
2968
+ }
2969
+
2970
+ .zx-root.zx-theme-dark .zx-menubar__root.zx-a-color-error {
2971
+ --menubar-surface: #232b3d;
2972
+ }
2973
+
2974
+ .zx-root.zx-theme-dim .zx-menubar__root.zx-a-color-error {
2975
+ --menubar-surface: #363849;
2976
+ }
2977
+
2978
+ .zx-root.zx-theme-nord .zx-menubar__root.zx-a-color-error {
2979
+ --menubar-surface: #d7dbec;
2980
+ }
2981
+
2982
+ .zx-root.zx-theme-sunset .zx-menubar__root.zx-a-color-error {
2983
+ --menubar-surface: #202936;
2984
+ }
2985
+
2986
+ .zx-menubar__root.zx-a-size-xs {
2987
+ gap: 0;
2988
+ padding: 0;
2989
+ }
2990
+
2991
+ .zx-menubar__root.zx-a-size-sm {
2992
+ padding: var(--space-2xs);
2993
+ }
2994
+
2995
+ .zx-menubar__root.zx-a-size-lg {
2996
+ gap: var(--space-sm);
2997
+ padding: var(--space-sm);
2998
+ }
2999
+
3000
+ .zx-menubar__root.zx-a-size-xl {
3001
+ gap: var(--space-md);
3002
+ padding: var(--space-sm);
3003
+ }
3004
+
3005
+ .zx-field__root {
3006
+ --field-accent: var(--color-base-content);
3007
+ }
3008
+
3009
+ .zx-field__root {
3010
+ display: flex;
3011
+ flex-direction: column;
3012
+ gap: var(--space-sm);
3013
+ }
3014
+
3015
+ .zx-field__label {
3016
+ font-size: var(--text-sm);
3017
+ font-weight: var(--weight-semibold);
3018
+ color: var(--field-accent);
3019
+ }
3020
+
3021
+ .zx-field__label.zx-f-disabled {
3022
+ opacity: var(--disabled-opacity);
3023
+ }
3024
+
3025
+ .zx-field__description {
3026
+ margin: 0;
3027
+ font-size: var(--text-xs);
3028
+ opacity: 0.6;
3029
+ }
3030
+
3031
+ .zx-field__error {
3032
+ margin: 0;
3033
+ font-size: var(--text-xs);
3034
+ font-weight: var(--weight-medium);
3035
+ }
3036
+
3037
+ .zx-root .zx-field__error {
3038
+ color: #d9576d;
3039
+ }
3040
+
3041
+ .zx-root.zx-theme-dark .zx-field__error {
3042
+ color: #ff7d90;
3043
+ }
3044
+
3045
+ .zx-root.zx-theme-dim .zx-field__error {
3046
+ color: #f5b3a4;
3047
+ }
3048
+
3049
+ .zx-root.zx-theme-nord .zx-field__error {
3050
+ color: #a85b64;
3051
+ }
3052
+
3053
+ .zx-root.zx-theme-sunset .zx-field__error {
3054
+ color: #f2bbc0;
3055
+ }
3056
+
3057
+ .zx-root .zx-field__root.zx-a-color-primary {
3058
+ --field-accent: #3f2bcb;
3059
+ }
3060
+
3061
+ .zx-root.zx-theme-dark .zx-field__root.zx-a-color-primary {
3062
+ --field-accent: #6567ff;
3063
+ }
3064
+
3065
+ .zx-root.zx-theme-dim .zx-field__root.zx-a-color-primary {
3066
+ --field-accent: #a0e791;
3067
+ }
3068
+
3069
+ .zx-root.zx-theme-nord .zx-field__root.zx-a-color-primary {
3070
+ --field-accent: #5c7da6;
3071
+ }
3072
+
3073
+ .zx-root.zx-theme-sunset .zx-field__root.zx-a-color-primary {
3074
+ --field-accent: #fb8a62;
3075
+ }
3076
+
3077
+ .zx-root .zx-field__root.zx-a-color-secondary {
3078
+ --field-accent: #ad316f;
3079
+ }
3080
+
3081
+ .zx-root.zx-theme-dark .zx-field__root.zx-a-color-secondary {
3082
+ --field-accent: #fa7cb6;
3083
+ }
3084
+
3085
+ .zx-root.zx-theme-dim .zx-field__root.zx-a-color-secondary {
3086
+ --field-accent: #ed9984;
3087
+ }
3088
+
3089
+ .zx-root.zx-theme-nord .zx-field__root.zx-a-color-secondary {
3090
+ --field-accent: #677e98;
3091
+ }
3092
+
3093
+ .zx-root.zx-theme-sunset .zx-field__root.zx-a-color-secondary {
3094
+ --field-accent: #e68aac;
3095
+ }
3096
+
3097
+ .zx-root .zx-field__root.zx-a-color-accent {
3098
+ --field-accent: #2b786d;
3099
+ }
3100
+
3101
+ .zx-root.zx-theme-dark .zx-field__root.zx-a-color-accent {
3102
+ --field-accent: #93e5d9;
3103
+ }
3104
+
3105
+ .zx-root.zx-theme-dim .zx-field__root.zx-a-color-accent {
3106
+ --field-accent: #bfade1;
3107
+ }
3108
+
3109
+ .zx-root.zx-theme-nord .zx-field__root.zx-a-color-accent {
3110
+ --field-accent: #5e7d8c;
3111
+ }
3112
+
3113
+ .zx-root.zx-theme-sunset .zx-field__root.zx-a-color-accent {
3114
+ --field-accent: #ab9fe8;
3115
+ }
3116
+
3117
+ .zx-root .zx-field__root.zx-a-color-neutral {
3118
+ --field-accent: #121214;
3119
+ }
3120
+
3121
+ .zx-root.zx-theme-dark .zx-field__root.zx-a-color-neutral {
3122
+ --field-accent: #878e92;
3123
+ }
3124
+
3125
+ .zx-root.zx-theme-dim .zx-field__root.zx-a-color-neutral {
3126
+ --field-accent: #71828c;
2690
3127
  }
2691
3128
 
2692
3129
  .zx-root.zx-theme-nord .zx-field__root.zx-a-color-neutral {
@@ -3932,7 +4369,7 @@
3932
4369
  }
3933
4370
 
3934
4371
  .zx-slider__control.zx-f-focus-visible {
3935
- outline: 2px solid var(--slider-accent);
4372
+ outline: none;
3936
4373
  outline-offset: 2px;
3937
4374
  }
3938
4375
 
@@ -4095,8 +4532,9 @@
4095
4532
  }
4096
4533
 
4097
4534
  .zx-slider__thumb.zx-f-focus-visible {
4098
- outline: 2px solid var(--slider-accent);
4535
+ outline: none;
4099
4536
  outline-offset: 2px;
4537
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--slider-accent), 0 -1px var(--depth-shade) inset, 0 8px 0 -4px var(--depth-sheen) inset, 0 1px var(--depth-shade);
4100
4538
  }
4101
4539
 
4102
4540
  .zx-slider__thumb.zx-f-readonly {
@@ -4421,8 +4859,10 @@
4421
4859
  }
4422
4860
 
4423
4861
  .zx-accordion__trigger.zx-f-focus-visible {
4424
- outline: 2px solid var(--color-base-content);
4862
+ outline: none;
4425
4863
  outline-offset: 2px;
4864
+ box-shadow: inset 0 0 0 2px var(--color-base-content);
4865
+ border-radius: calc(var(--radius-box) - var(--border));
4426
4866
  }
4427
4867
 
4428
4868
  .zx-accordion__trigger.zx-f-pressed {
@@ -4642,7 +5082,9 @@
4642
5082
  display: flex;
4643
5083
  flex-direction: column;
4644
5084
  position: relative;
5085
+ width: 20rem;
4645
5086
  max-width: 100%;
5087
+ min-width: 3rem;
4646
5088
  }
4647
5089
 
4648
5090
  .zx-select__trigger {
@@ -4665,7 +5107,7 @@
4665
5107
  min-width: 3rem;
4666
5108
  padding-left: calc(var(--size-field) * 4);
4667
5109
  padding-right: calc(var(--size-field) * 4);
4668
- width: 20rem;
5110
+ width: 100%;
4669
5111
  max-width: 100%;
4670
5112
  }
4671
5113
 
@@ -4687,8 +5129,9 @@
4687
5129
  }
4688
5130
 
4689
5131
  .zx-select__trigger.zx-f-focus-visible {
4690
- outline: 2px solid var(--color-base-content);
5132
+ outline: none;
4691
5133
  outline-offset: 2px;
5134
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
4692
5135
  }
4693
5136
 
4694
5137
  .zx-select__trigger.zx-f-pressed {
@@ -4767,8 +5210,9 @@
4767
5210
  }
4768
5211
 
4769
5212
  .zx-select__clear-trigger.zx-f-focus-visible {
4770
- outline: 2px solid var(--color-base-content);
5213
+ outline: none;
4771
5214
  outline-offset: 2px;
5215
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
4772
5216
  }
4773
5217
 
4774
5218
  .zx-select__popup {
@@ -4782,6 +5226,7 @@
4782
5226
  box-shadow: var(--shadow-lg);
4783
5227
  padding: var(--space-md);
4784
5228
  min-width: 13rem;
5229
+ --select-accent: var(--color-primary);
4785
5230
  }
4786
5231
 
4787
5232
  .zx-select__popup.zx-s-open {
@@ -4849,34 +5294,66 @@
4849
5294
  --select-accent: var(--color-primary);
4850
5295
  }
4851
5296
 
5297
+ .zx-select__popup.zx-a-color-primary {
5298
+ --select-accent: var(--color-primary);
5299
+ }
5300
+
4852
5301
  .zx-select__root.zx-a-color-secondary {
4853
5302
  --select-accent: var(--color-secondary);
4854
5303
  }
4855
5304
 
5305
+ .zx-select__popup.zx-a-color-secondary {
5306
+ --select-accent: var(--color-secondary);
5307
+ }
5308
+
4856
5309
  .zx-select__root.zx-a-color-accent {
4857
5310
  --select-accent: var(--color-accent);
4858
5311
  }
4859
5312
 
5313
+ .zx-select__popup.zx-a-color-accent {
5314
+ --select-accent: var(--color-accent);
5315
+ }
5316
+
4860
5317
  .zx-select__root.zx-a-color-neutral {
4861
5318
  --select-accent: var(--color-neutral);
4862
5319
  }
4863
5320
 
5321
+ .zx-select__popup.zx-a-color-neutral {
5322
+ --select-accent: var(--color-neutral);
5323
+ }
5324
+
4864
5325
  .zx-select__root.zx-a-color-info {
4865
5326
  --select-accent: var(--color-info);
4866
5327
  }
4867
5328
 
5329
+ .zx-select__popup.zx-a-color-info {
5330
+ --select-accent: var(--color-info);
5331
+ }
5332
+
4868
5333
  .zx-select__root.zx-a-color-success {
4869
5334
  --select-accent: var(--color-success);
4870
5335
  }
4871
5336
 
5337
+ .zx-select__popup.zx-a-color-success {
5338
+ --select-accent: var(--color-success);
5339
+ }
5340
+
4872
5341
  .zx-select__root.zx-a-color-warning {
4873
5342
  --select-accent: var(--color-warning);
4874
5343
  }
4875
5344
 
5345
+ .zx-select__popup.zx-a-color-warning {
5346
+ --select-accent: var(--color-warning);
5347
+ }
5348
+
4876
5349
  .zx-select__root.zx-a-color-error {
4877
5350
  --select-accent: var(--color-error);
4878
5351
  }
4879
5352
 
5353
+ .zx-select__popup.zx-a-color-error {
5354
+ --select-accent: var(--color-error);
5355
+ }
5356
+
4880
5357
  .zx-select__trigger.zx-a-size-xs {
4881
5358
  height: calc(var(--size-field) * 8);
4882
5359
  font-size: var(--text-xs);
@@ -4944,11 +5421,18 @@
4944
5421
  block-size: 1em;
4945
5422
  flex: none;
4946
5423
  border-radius: 9999px;
4947
- border: calc(var(--border) * 2) solid var(--btn-ink);
5424
+ border: 0 solid transparent;
4948
5425
  border-block-start-color: transparent;
4949
5426
  animation: zero-daisyui-btn-spin 0.7s linear infinite;
4950
5427
  width: 1em;
4951
5428
  height: 1em;
5429
+ border-top-width: calc(var(--border) * 2);
5430
+ border-right-width: calc(var(--border) * 2);
5431
+ border-bottom-width: calc(var(--border) * 2);
5432
+ border-left-width: calc(var(--border) * 2);
5433
+ border-right-color: var(--btn-ink);
5434
+ border-bottom-color: var(--btn-ink);
5435
+ border-left-color: var(--btn-ink);
4952
5436
  border-top-color: transparent;
4953
5437
  }
4954
5438
 
@@ -4959,7 +5443,7 @@
4959
5443
  align-items: center;
4960
5444
  justify-content: center;
4961
5445
  gap: 0.5em;
4962
- border: var(--border) solid transparent;
5446
+ border: 0 solid transparent;
4963
5447
  border-radius: var(--radius-field);
4964
5448
  box-shadow: var(--shadow-xs);
4965
5449
  font-family: inherit;
@@ -4967,6 +5451,13 @@
4967
5451
  line-height: var(--leading-none);
4968
5452
  cursor: pointer;
4969
5453
  transition: background var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard);
5454
+ width: max-content;
5455
+ flex-shrink: 0;
5456
+ flex-wrap: nowrap;
5457
+ border-top-width: var(--border);
5458
+ border-right-width: var(--border);
5459
+ border-bottom-width: var(--border);
5460
+ border-left-width: var(--border);
4970
5461
  }
4971
5462
 
4972
5463
  .zx-button__root.zx-s-loading {
@@ -5006,8 +5497,9 @@
5006
5497
  }
5007
5498
 
5008
5499
  .zx-button__root.zx-f-focus-visible {
5009
- outline: 2px solid var(--btn-ink);
5500
+ outline: none;
5010
5501
  outline-offset: 2px;
5502
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--btn-ink);
5011
5503
  }
5012
5504
 
5013
5505
  .zx-button__root.zx-f-pressed {
@@ -5229,14 +5721,19 @@
5229
5721
  }
5230
5722
 
5231
5723
  .zx-button__spinner.zx-a-variant-solid {
5232
- border-color: var(--btn-on-accent);
5233
- border-top-color: transparent;
5724
+ border-right-color: var(--btn-on-accent);
5725
+ border-bottom-color: var(--btn-on-accent);
5726
+ border-left-color: var(--btn-on-accent);
5234
5727
  }
5235
5728
 
5236
5729
  .zx-button__root.zx-a-variant-outline {
5237
5730
  background: transparent;
5238
5731
  color: var(--btn-ink);
5239
- border-color: var(--btn-ink);
5732
+ border-color: transparent;
5733
+ border-top-color: var(--btn-ink);
5734
+ border-right-color: var(--btn-ink);
5735
+ border-bottom-color: var(--btn-ink);
5736
+ border-left-color: var(--btn-ink);
5240
5737
  }
5241
5738
 
5242
5739
  .zx-button__root.zx-a-variant-outline.zx-f-disabled {
@@ -5260,8 +5757,12 @@
5260
5757
  .zx-button__root.zx-a-variant-dash {
5261
5758
  background: transparent;
5262
5759
  color: var(--btn-ink);
5263
- border-color: var(--btn-ink);
5760
+ border-color: transparent;
5264
5761
  border-style: dashed;
5762
+ border-top-color: var(--btn-ink);
5763
+ border-right-color: var(--btn-ink);
5764
+ border-bottom-color: var(--btn-ink);
5765
+ border-left-color: var(--btn-ink);
5265
5766
  }
5266
5767
 
5267
5768
  .zx-button__root.zx-a-variant-dash.zx-f-disabled {
@@ -5280,47 +5781,76 @@
5280
5781
  background: transparent;
5281
5782
  }
5282
5783
 
5784
+ .zx-button__root.zx-a-variant-link.zx-f-focus-visible {
5785
+ outline: none;
5786
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--btn-ink);
5787
+ }
5788
+
5283
5789
  .zx-button__root.zx-a-size-xs {
5284
5790
  height: calc(var(--size-field) * 6);
5285
- padding: var(--space-2xs) var(--space-xs);
5791
+ padding: 0;
5286
5792
  font-size: var(--text-xs);
5793
+ padding-top: var(--space-2xs);
5794
+ padding-bottom: var(--space-2xs);
5795
+ padding-right: var(--space-xs);
5796
+ padding-left: var(--space-xs);
5287
5797
  }
5288
5798
 
5289
5799
  .zx-button__root.zx-a-size-sm {
5290
5800
  height: calc(var(--size-field) * 8);
5291
- padding: var(--space-xs) var(--space-sm);
5801
+ padding: 0;
5292
5802
  font-size: var(--text-sm);
5803
+ padding-top: var(--space-xs);
5804
+ padding-bottom: var(--space-xs);
5805
+ padding-right: var(--space-sm);
5806
+ padding-left: var(--space-sm);
5293
5807
  }
5294
5808
 
5295
5809
  .zx-button__root.zx-a-size-md {
5296
5810
  height: calc(var(--size-field) * 10);
5297
- padding: var(--space-sm) var(--space-lg);
5811
+ padding: 0;
5298
5812
  font-size: var(--text-md);
5813
+ padding-top: var(--space-sm);
5814
+ padding-bottom: var(--space-sm);
5815
+ padding-right: var(--space-lg);
5816
+ padding-left: var(--space-lg);
5299
5817
  }
5300
5818
 
5301
5819
  .zx-button__root.zx-a-size-lg {
5302
5820
  height: calc(var(--size-field) * 12);
5303
- padding: var(--space-md) var(--space-xl);
5821
+ padding: 0;
5304
5822
  font-size: var(--text-lg);
5823
+ padding-top: var(--space-md);
5824
+ padding-bottom: var(--space-md);
5825
+ padding-right: var(--space-xl);
5826
+ padding-left: var(--space-xl);
5305
5827
  }
5306
5828
 
5307
5829
  .zx-button__root.zx-a-size-xl {
5308
5830
  height: calc(var(--size-field) * 14);
5309
- padding: var(--space-lg) var(--space-2xl);
5831
+ padding: 0;
5310
5832
  font-size: var(--text-xl);
5833
+ padding-top: var(--space-lg);
5834
+ padding-bottom: var(--space-lg);
5835
+ padding-right: var(--space-2xl);
5836
+ padding-left: var(--space-2xl);
5311
5837
  }
5312
5838
 
5313
5839
  .zx-button__root.zx-m-wide {
5314
5840
  inline-size: 100%;
5315
5841
  max-inline-size: 16rem;
5842
+ width: 100%;
5843
+ max-width: 16rem;
5316
5844
  }
5317
5845
 
5318
5846
  .zx-button__root.zx-m-block {
5319
5847
  inline-size: 100%;
5848
+ width: 100%;
5320
5849
  }
5321
5850
 
5322
5851
  .zx-button__root.zx-m-square {
5323
5852
  aspect-ratio: 1;
5853
+ width: auto;
5324
5854
  padding-left: 0;
5325
5855
  padding-right: 0;
5326
5856
  }
@@ -5328,6 +5858,7 @@
5328
5858
  .zx-button__root.zx-m-circle {
5329
5859
  aspect-ratio: 1;
5330
5860
  border-radius: 9999px;
5861
+ width: auto;
5331
5862
  padding-left: 0;
5332
5863
  padding-right: 0;
5333
5864
  }
@@ -5337,6 +5868,11 @@
5337
5868
  box-shadow: none;
5338
5869
  filter: brightness(0.92);
5339
5870
  }
5871
+
5872
+ .zx-button__root.zx-m-active.zx-f-focus-visible {
5873
+ outline: none;
5874
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--btn-ink);
5875
+ }
5340
5876
  @keyframes zero-daisyui-btn-spin {
5341
5877
  to { transform: rotate(360deg) }
5342
5878
  }
@@ -5457,32 +5993,131 @@
5457
5993
  --avatar-text: var(--text-lg);
5458
5994
  }
5459
5995
 
5460
- .zx-toast__root {
5461
- --toast-bg: var(--color-base-200);
5462
- --toast-ink: var(--color-base-content);
5463
- --toast-from: 8px;
5996
+ .zx-avatar-group__root {
5997
+ --avatar-group-text: var(--text-sm);
5998
+ --avatar-group-ring: var(--color-primary);
5464
5999
  }
5465
6000
 
5466
- .zx-toast__viewport {
5467
- position: fixed;
5468
- inset: auto;
5469
- margin: 0;
5470
- padding: var(--space-lg);
5471
- border: none;
5472
- background: transparent;
5473
- overflow: visible;
5474
- width: auto;
5475
- list-style: none;
5476
- flex-direction: column;
5477
- gap: var(--space-sm);
5478
- pointer-events: none;
6001
+ .zx-avatar-group__root {
5479
6002
  display: flex;
6003
+ align-items: center;
6004
+ vertical-align: middle;
6005
+ isolation: isolate;
5480
6006
  }
5481
6007
 
5482
- .zx-toast__viewport.zx-p-top-start {
5483
- top: 0;
5484
- left: 0;
5485
- align-items: flex-start;
6008
+ .zx-avatar-group__overflow {
6009
+ position: relative;
6010
+ display: inline-grid;
6011
+ place-items: center;
6012
+ box-sizing: border-box;
6013
+ min-width: calc(var(--size-selector) * 10);
6014
+ height: calc(var(--size-selector) * 10);
6015
+ border-radius: 9999px;
6016
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--avatar-group-ring);
6017
+ background: var(--color-neutral);
6018
+ color: var(--color-neutral-content);
6019
+ font-size: var(--avatar-group-text);
6020
+ font-weight: var(--weight-semibold);
6021
+ font-variant-numeric: tabular-nums;
6022
+ white-space: nowrap;
6023
+ user-select: none;
6024
+ }
6025
+
6026
+ .zx-avatar-group__overflow.zx-a-size-xs {
6027
+ min-width: calc(var(--size-selector) * 6);
6028
+ height: calc(var(--size-selector) * 6);
6029
+ }
6030
+
6031
+ .zx-avatar-group__overflow.zx-a-size-sm {
6032
+ min-width: calc(var(--size-selector) * 8);
6033
+ height: calc(var(--size-selector) * 8);
6034
+ }
6035
+
6036
+ .zx-avatar-group__overflow.zx-a-size-lg {
6037
+ min-width: calc(var(--size-selector) * 12);
6038
+ height: calc(var(--size-selector) * 12);
6039
+ }
6040
+
6041
+ .zx-avatar-group__overflow.zx-a-size-xl {
6042
+ min-width: calc(var(--size-selector) * 16);
6043
+ height: calc(var(--size-selector) * 16);
6044
+ }
6045
+
6046
+ .zx-avatar-group__root.zx-a-color-primary {
6047
+ --avatar-group-ring: var(--color-primary);
6048
+ }
6049
+
6050
+ .zx-avatar-group__root.zx-a-color-secondary {
6051
+ --avatar-group-ring: var(--color-secondary);
6052
+ }
6053
+
6054
+ .zx-avatar-group__root.zx-a-color-accent {
6055
+ --avatar-group-ring: var(--color-accent);
6056
+ }
6057
+
6058
+ .zx-avatar-group__root.zx-a-color-neutral {
6059
+ --avatar-group-ring: var(--color-neutral);
6060
+ }
6061
+
6062
+ .zx-avatar-group__root.zx-a-color-info {
6063
+ --avatar-group-ring: var(--color-info);
6064
+ }
6065
+
6066
+ .zx-avatar-group__root.zx-a-color-success {
6067
+ --avatar-group-ring: var(--color-success);
6068
+ }
6069
+
6070
+ .zx-avatar-group__root.zx-a-color-warning {
6071
+ --avatar-group-ring: var(--color-warning);
6072
+ }
6073
+
6074
+ .zx-avatar-group__root.zx-a-color-error {
6075
+ --avatar-group-ring: var(--color-error);
6076
+ }
6077
+
6078
+ .zx-avatar-group__root.zx-a-size-xs {
6079
+ --avatar-group-text: var(--text-xs);
6080
+ }
6081
+
6082
+ .zx-avatar-group__root.zx-a-size-sm {
6083
+ --avatar-group-text: var(--text-xs);
6084
+ }
6085
+
6086
+ .zx-avatar-group__root.zx-a-size-lg {
6087
+ --avatar-group-text: var(--text-md);
6088
+ }
6089
+
6090
+ .zx-avatar-group__root.zx-a-size-xl {
6091
+ --avatar-group-text: var(--text-lg);
6092
+ }
6093
+
6094
+ .zx-toast__root {
6095
+ --toast-bg: var(--color-base-200);
6096
+ --toast-ink: var(--color-base-content);
6097
+ --toast-from: 8px;
6098
+ --toast-mark: 1rem;
6099
+ }
6100
+
6101
+ .zx-toast__viewport {
6102
+ position: fixed;
6103
+ inset: auto;
6104
+ margin: 0;
6105
+ padding: var(--space-lg);
6106
+ border: none;
6107
+ background: transparent;
6108
+ overflow: visible;
6109
+ width: auto;
6110
+ list-style: none;
6111
+ flex-direction: column;
6112
+ gap: var(--space-sm);
6113
+ pointer-events: none;
6114
+ display: flex;
6115
+ }
6116
+
6117
+ .zx-toast__viewport.zx-p-top-start {
6118
+ top: 0;
6119
+ left: 0;
6120
+ align-items: flex-start;
5486
6121
  }
5487
6122
 
5488
6123
  .zx-toast__viewport.zx-p-top {
@@ -5561,6 +6196,68 @@
5561
6196
  --toast-from: -8px;
5562
6197
  }
5563
6198
 
6199
+ .zx-toast__indicator {
6200
+ grid-column: 1;
6201
+ grid-row: 1 / span 2;
6202
+ inline-size: var(--toast-mark);
6203
+ block-size: var(--toast-mark);
6204
+ box-sizing: border-box;
6205
+ }
6206
+
6207
+ .zx-toast__indicator.zx-s-loading {
6208
+ border-radius: 50%;
6209
+ border-block-start-color: var(--toast-ink);
6210
+ animation: zero-daisyui-toast-spin 0.75s linear infinite;
6211
+ }
6212
+
6213
+ .zx-toast__indicator.zx-s-complete {
6214
+ clip-path: polygon(15.1% 41.3%, 1% 55%, 37.6% 92.8%, 99% 19.8%, 83.9% 7.2%, 36.6% 63.5%);
6215
+ }
6216
+
6217
+ .zx-root .zx-toast__indicator.zx-s-complete {
6218
+ background: #2a7858;
6219
+ }
6220
+
6221
+ .zx-root.zx-theme-dark .zx-toast__indicator.zx-s-complete {
6222
+ background: #92e5c2;
6223
+ }
6224
+
6225
+ .zx-root.zx-theme-dim .zx-toast__indicator.zx-s-complete {
6226
+ background: #8ee0c9;
6227
+ }
6228
+
6229
+ .zx-root.zx-theme-nord .zx-toast__indicator.zx-s-complete {
6230
+ background: #6b7d6a;
6231
+ }
6232
+
6233
+ .zx-root.zx-theme-sunset .zx-toast__indicator.zx-s-complete {
6234
+ background: #a6cebe;
6235
+ }
6236
+
6237
+ .zx-toast__indicator.zx-s-error {
6238
+ clip-path: polygon(20% 8%, 50% 38%, 80% 8%, 92% 20%, 62% 50%, 92% 80%, 80% 92%, 50% 62%, 20% 92%, 8% 80%, 38% 50%, 8% 20%);
6239
+ }
6240
+
6241
+ .zx-root .zx-toast__indicator.zx-s-error {
6242
+ background: #8f424e;
6243
+ }
6244
+
6245
+ .zx-root.zx-theme-dark .zx-toast__indicator.zx-s-error {
6246
+ background: #ffabb6;
6247
+ }
6248
+
6249
+ .zx-root.zx-theme-dim .zx-toast__indicator.zx-s-error {
6250
+ background: #e0bdb6;
6251
+ }
6252
+
6253
+ .zx-root.zx-theme-nord .zx-toast__indicator.zx-s-error {
6254
+ background: #7c4e57;
6255
+ }
6256
+
6257
+ .zx-root.zx-theme-sunset .zx-toast__indicator.zx-s-error {
6258
+ background: #d6bbc6;
6259
+ }
6260
+
5564
6261
  .zx-toast__title {
5565
6262
  grid-column: 1;
5566
6263
  font-weight: var(--weight-semibold);
@@ -5595,8 +6292,9 @@
5595
6292
  }
5596
6293
 
5597
6294
  .zx-toast__action.zx-f-focus-visible {
5598
- outline: 2px solid var(--color-base-content);
6295
+ outline: none;
5599
6296
  outline-offset: 2px;
6297
+ box-shadow: 0 0 0 2px var(--toast-bg), 0 0 0 4px var(--color-base-content);
5600
6298
  }
5601
6299
 
5602
6300
  .zx-toast__close {
@@ -5620,8 +6318,9 @@
5620
6318
  }
5621
6319
 
5622
6320
  .zx-toast__close.zx-f-focus-visible {
5623
- outline: 2px solid var(--color-base-content);
6321
+ outline: none;
5624
6322
  outline-offset: 2px;
6323
+ box-shadow: 0 0 0 2px var(--toast-bg), 0 0 0 4px var(--color-base-content);
5625
6324
  }
5626
6325
 
5627
6326
  .zx-toast__root.zx-a-color-primary {
@@ -5691,6 +6390,9 @@
5691
6390
  .zx-toast__description.zx-a-size-xl {
5692
6391
  font-size: var(--text-md);
5693
6392
  }
6393
+ @keyframes zero-daisyui-toast-spin {
6394
+ to { transform: rotate(360deg); }
6395
+ }
5694
6396
 
5695
6397
  .zx-combobox__root {
5696
6398
  --combobox-accent: var(--color-primary);
@@ -6752,6 +7454,8 @@
6752
7454
  --tree-accent: var(--color-primary);
6753
7455
  --tree-text: var(--text-sm);
6754
7456
  --tree-on-accent: var(--color-primary-content);
7457
+ --tree-check: var(--tree-accent);
7458
+ --tree-on-check: var(--tree-on-accent);
6755
7459
  }
6756
7460
 
6757
7461
  .zx-tree-view__root {
@@ -6852,6 +7556,32 @@
6852
7556
  transform: rotate(45deg);
6853
7557
  }
6854
7558
 
7559
+ .zx-tree-view__node-checkbox {
7560
+ display: inline-block;
7561
+ position: relative;
7562
+ flex-shrink: 0;
7563
+ box-sizing: border-box;
7564
+ width: 1.25em;
7565
+ height: 1.25em;
7566
+ border: var(--border) solid var(--tree-check);
7567
+ border-radius: var(--radius-selector);
7568
+ box-shadow: 0 1px var(--depth-shade) inset;
7569
+ cursor: pointer;
7570
+ transition: background-color var(--duration-normal) var(--ease-standard);
7571
+ }
7572
+
7573
+ .zx-tree-view__node-checkbox.zx-s-checked {
7574
+ background-color: var(--tree-check);
7575
+ }
7576
+
7577
+ .zx-tree-view__node-checkbox.zx-s-indeterminate {
7578
+ background-color: var(--tree-check);
7579
+ }
7580
+
7581
+ .zx-tree-view__node-checkbox.zx-f-disabled {
7582
+ cursor: not-allowed;
7583
+ }
7584
+
6855
7585
  .zx-tree-view__branch-content {
6856
7586
  display: flex;
6857
7587
  flex-direction: column;
@@ -7386,6 +8116,15 @@
7386
8116
  overflow: hidden;
7387
8117
  }
7388
8118
 
8119
+ .zx-card__media {
8120
+ display: flex;
8121
+ align-items: center;
8122
+ justify-content: center;
8123
+ margin: 0;
8124
+ inline-size: 100%;
8125
+ object-fit: cover;
8126
+ }
8127
+
7389
8128
  .zx-card__header {
7390
8129
  display: flex;
7391
8130
  flex-direction: column;
@@ -8260,9 +8999,11 @@
8260
8999
  }
8261
9000
 
8262
9001
  .zx-divider__root {
9002
+ display: flex;
9003
+ align-items: center;
8263
9004
  border: none;
8264
- background: var(--divider-ink);
8265
9005
  align-self: stretch;
9006
+ background: var(--divider-ink);
8266
9007
  }
8267
9008
 
8268
9009
  .zx-divider__root.zx-o-horizontal {
@@ -8279,8 +9020,9 @@
8279
9020
  }
8280
9021
 
8281
9022
  .zx-divider__root.zx-o-vertical {
8282
- inline-size: var(--border);
9023
+ flex-direction: column;
8283
9024
  min-block-size: 1em;
9025
+ inline-size: var(--border);
8284
9026
  }
8285
9027
 
8286
9028
  .zx-divider__root.zx-o-vertical.zx-a-size-lg {
@@ -8291,6 +9033,13 @@
8291
9033
  inline-size: calc(var(--border) * 3);
8292
9034
  }
8293
9035
 
9036
+ .zx-divider__label {
9037
+ flex: none;
9038
+ font-size: var(--text-sm);
9039
+ white-space: nowrap;
9040
+ color: var(--color-base-content);
9041
+ }
9042
+
8294
9043
  .zx-divider__root.zx-a-color-primary {
8295
9044
  --divider-ink: var(--color-primary);
8296
9045
  }
@@ -9303,6 +10052,38 @@
9303
10052
  flex-basis: 100%;
9304
10053
  }
9305
10054
 
10055
+ .zx-timeline__title {
10056
+ display: block;
10057
+ margin: 0;
10058
+ font-weight: var(--weight-semibold);
10059
+ line-height: var(--leading-tight);
10060
+ }
10061
+
10062
+ .zx-timeline__description {
10063
+ display: block;
10064
+ margin: 0;
10065
+ }
10066
+
10067
+ .zx-root .zx-timeline__description {
10068
+ color: #18181bb3;
10069
+ }
10070
+
10071
+ .zx-root.zx-theme-dark .zx-timeline__description {
10072
+ color: #ecf9ffb3;
10073
+ }
10074
+
10075
+ .zx-root.zx-theme-dim .zx-timeline__description {
10076
+ color: #b2ccd6b3;
10077
+ }
10078
+
10079
+ .zx-root.zx-theme-nord .zx-timeline__description {
10080
+ color: #2e3440b3;
10081
+ }
10082
+
10083
+ .zx-root.zx-theme-sunset .zx-timeline__description {
10084
+ color: #9fb9d0b3;
10085
+ }
10086
+
9306
10087
  .zx-timeline__marker.zx-a-color-primary {
9307
10088
  --timeline-accent: var(--color-primary);
9308
10089
  --timeline-ring: var(--color-primary-content);
@@ -9506,6 +10287,154 @@
9506
10287
  padding: var(--space-md) var(--space-xl);
9507
10288
  }
9508
10289
 
10290
+ .zx-chat-log__root {
10291
+ --chat-log-fill: var(--color-primary);
10292
+ --chat-log-on-fill: var(--color-primary-content);
10293
+ }
10294
+
10295
+ .zx-chat-log__root {
10296
+ display: flex;
10297
+ flex-direction: column;
10298
+ overflow-y: auto;
10299
+ overscroll-behavior-y: contain;
10300
+ border-radius: var(--radius-box);
10301
+ background: var(--color-base-100);
10302
+ color: var(--color-base-content);
10303
+ border: var(--border) solid var(--color-base-300);
10304
+ padding: var(--space-sm) var(--space-md);
10305
+ }
10306
+
10307
+ .zx-chat-log__root.zx-f-focus-visible {
10308
+ outline: 2px solid var(--color-base-content);
10309
+ outline-offset: -2px;
10310
+ }
10311
+
10312
+ .zx-chat-log__content {
10313
+ flex: none;
10314
+ display: grid;
10315
+ row-gap: var(--space-xs);
10316
+ }
10317
+
10318
+ .zx-chat-log__jump-trigger {
10319
+ position: sticky;
10320
+ align-self: center;
10321
+ flex: none;
10322
+ block-size: calc(var(--size-field) * 8);
10323
+ appearance: none;
10324
+ display: flex;
10325
+ align-items: center;
10326
+ gap: var(--space-2xs);
10327
+ border: var(--border) solid transparent;
10328
+ border-radius: 9999px;
10329
+ background: var(--chat-log-fill);
10330
+ color: var(--chat-log-on-fill);
10331
+ box-shadow: var(--shadow-xs);
10332
+ font-family: inherit;
10333
+ font-size: var(--text-xs);
10334
+ font-weight: var(--weight-semibold);
10335
+ line-height: var(--leading-none);
10336
+ cursor: pointer;
10337
+ transition: background var(--duration-fast) var(--ease-standard);
10338
+ }
10339
+
10340
+ .zx-chat-log__jump-trigger.zx-a-size-xs {
10341
+ block-size: calc(var(--size-field) * 6);
10342
+ }
10343
+
10344
+ .zx-chat-log__jump-trigger.zx-a-size-sm {
10345
+ block-size: calc(var(--size-field) * 7);
10346
+ }
10347
+
10348
+ .zx-chat-log__jump-trigger.zx-a-size-lg {
10349
+ block-size: calc(var(--size-field) * 9);
10350
+ }
10351
+
10352
+ .zx-chat-log__jump-trigger.zx-a-size-xl {
10353
+ block-size: calc(var(--size-field) * 10);
10354
+ }
10355
+
10356
+ .zx-chat-log__jump-trigger.zx-f-focus-visible {
10357
+ outline: 2px solid var(--color-base-content);
10358
+ outline-offset: 2px;
10359
+ }
10360
+
10361
+ .zx-chat-log__jump-trigger.zx-f-pressed {
10362
+ transform: translateY(1px);
10363
+ box-shadow: none;
10364
+ }
10365
+
10366
+ .zx-chat-log__jump-trigger.zx-a-color-primary {
10367
+ --chat-log-fill: var(--color-primary);
10368
+ --chat-log-on-fill: var(--color-primary-content);
10369
+ }
10370
+
10371
+ .zx-chat-log__jump-trigger.zx-a-color-secondary {
10372
+ --chat-log-fill: var(--color-secondary);
10373
+ --chat-log-on-fill: var(--color-secondary-content);
10374
+ }
10375
+
10376
+ .zx-chat-log__jump-trigger.zx-a-color-accent {
10377
+ --chat-log-fill: var(--color-accent);
10378
+ --chat-log-on-fill: var(--color-accent-content);
10379
+ }
10380
+
10381
+ .zx-chat-log__jump-trigger.zx-a-color-neutral {
10382
+ --chat-log-fill: var(--color-neutral);
10383
+ --chat-log-on-fill: var(--color-neutral-content);
10384
+ }
10385
+
10386
+ .zx-chat-log__jump-trigger.zx-a-color-info {
10387
+ --chat-log-fill: var(--color-info);
10388
+ --chat-log-on-fill: var(--color-info-content);
10389
+ }
10390
+
10391
+ .zx-chat-log__jump-trigger.zx-a-color-success {
10392
+ --chat-log-fill: var(--color-success);
10393
+ --chat-log-on-fill: var(--color-success-content);
10394
+ }
10395
+
10396
+ .zx-chat-log__jump-trigger.zx-a-color-warning {
10397
+ --chat-log-fill: var(--color-warning);
10398
+ --chat-log-on-fill: var(--color-warning-content);
10399
+ }
10400
+
10401
+ .zx-chat-log__jump-trigger.zx-a-color-error {
10402
+ --chat-log-fill: var(--color-error);
10403
+ --chat-log-on-fill: var(--color-error-content);
10404
+ }
10405
+
10406
+ .zx-chat-log__content.zx-a-size-xs {
10407
+ row-gap: var(--space-2xs);
10408
+ }
10409
+
10410
+ .zx-chat-log__jump-trigger.zx-a-size-xs {
10411
+ font-size: var(--text-xs);
10412
+ }
10413
+
10414
+ .zx-chat-log__content.zx-a-size-sm {
10415
+ row-gap: var(--space-2xs);
10416
+ }
10417
+
10418
+ .zx-chat-log__jump-trigger.zx-a-size-sm {
10419
+ font-size: var(--text-xs);
10420
+ }
10421
+
10422
+ .zx-chat-log__content.zx-a-size-lg {
10423
+ row-gap: var(--space-sm);
10424
+ }
10425
+
10426
+ .zx-chat-log__jump-trigger.zx-a-size-lg {
10427
+ font-size: var(--text-sm);
10428
+ }
10429
+
10430
+ .zx-chat-log__content.zx-a-size-xl {
10431
+ row-gap: var(--space-md);
10432
+ }
10433
+
10434
+ .zx-chat-log__jump-trigger.zx-a-size-xl {
10435
+ font-size: var(--text-sm);
10436
+ }
10437
+
9509
10438
  .zx-radial-progress__root {
9510
10439
  --radial-ink: var(--color-primary);
9511
10440
  --radial-track: var(--color-base-200);
@@ -10168,6 +11097,50 @@
10168
11097
  color: #9fb9d066;
10169
11098
  }
10170
11099
 
11100
+ .zx-breadcrumbs__ellipsis {
11101
+ display: flex;
11102
+ align-items: center;
11103
+ gap: var(--space-xs);
11104
+ }
11105
+
11106
+ .zx-breadcrumbs__ellipsis-trigger {
11107
+ appearance: none;
11108
+ background: transparent;
11109
+ border: 0;
11110
+ padding: 0 var(--space-2xs);
11111
+ margin: 0;
11112
+ font: inherit;
11113
+ line-height: inherit;
11114
+ border-radius: var(--radius-selector);
11115
+ cursor: pointer;
11116
+ transition: color var(--duration-fast) var(--ease-standard);
11117
+ }
11118
+
11119
+ .zx-root .zx-breadcrumbs__ellipsis-trigger {
11120
+ color: #18181bbf;
11121
+ }
11122
+
11123
+ .zx-root.zx-theme-dark .zx-breadcrumbs__ellipsis-trigger {
11124
+ color: #ecf9ffbf;
11125
+ }
11126
+
11127
+ .zx-root.zx-theme-dim .zx-breadcrumbs__ellipsis-trigger {
11128
+ color: #b2ccd6bf;
11129
+ }
11130
+
11131
+ .zx-root.zx-theme-nord .zx-breadcrumbs__ellipsis-trigger {
11132
+ color: #2e3440bf;
11133
+ }
11134
+
11135
+ .zx-root.zx-theme-sunset .zx-breadcrumbs__ellipsis-trigger {
11136
+ color: #9fb9d0bf;
11137
+ }
11138
+
11139
+ .zx-breadcrumbs__ellipsis-trigger.zx-f-focus-visible {
11140
+ outline: 2px solid var(--color-primary);
11141
+ outline-offset: 2px;
11142
+ }
11143
+
10171
11144
  .zx-root .zx-breadcrumbs__root.zx-a-color-primary {
10172
11145
  --bc-accent: #3f2bcb;
10173
11146
  }
@@ -10374,6 +11347,7 @@
10374
11347
  font-weight: var(--weight-semibold);
10375
11348
  font-variant-numeric: tabular-nums;
10376
11349
  appearance: none;
11350
+ text-decoration: none;
10377
11351
  cursor: pointer;
10378
11352
  transition: background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
10379
11353
  padding-left: var(--space-2xs);
@@ -10469,6 +11443,58 @@
10469
11443
  color: #9fb9d0a6;
10470
11444
  }
10471
11445
 
11446
+ .zx-pagination__first-trigger {
11447
+ display: flex;
11448
+ align-items: center;
11449
+ justify-content: center;
11450
+ min-inline-size: calc(var(--size-field) * 10);
11451
+ block-size: calc(var(--size-field) * 10);
11452
+ background: var(--color-base-200);
11453
+ color: var(--color-base-content);
11454
+ border: none;
11455
+ border-radius: var(--radius-field);
11456
+ font-size: calc(var(--pg-font) * 1.2);
11457
+ line-height: var(--leading-none);
11458
+ appearance: none;
11459
+ text-decoration: none;
11460
+ cursor: pointer;
11461
+ transition: background var(--duration-fast) var(--ease-standard);
11462
+ }
11463
+
11464
+ .zx-pagination__first-trigger.zx-a-size-xs {
11465
+ min-inline-size: calc(var(--size-field) * 7);
11466
+ block-size: calc(var(--size-field) * 7);
11467
+ }
11468
+
11469
+ .zx-pagination__first-trigger.zx-a-size-sm {
11470
+ min-inline-size: calc(var(--size-field) * 9);
11471
+ block-size: calc(var(--size-field) * 9);
11472
+ }
11473
+
11474
+ .zx-pagination__first-trigger.zx-a-size-lg {
11475
+ min-inline-size: calc(var(--size-field) * 12);
11476
+ block-size: calc(var(--size-field) * 12);
11477
+ }
11478
+
11479
+ .zx-pagination__first-trigger.zx-a-size-xl {
11480
+ min-inline-size: calc(var(--size-field) * 14);
11481
+ block-size: calc(var(--size-field) * 14);
11482
+ }
11483
+
11484
+ .zx-pagination__first-trigger.zx-f-disabled {
11485
+ opacity: var(--disabled-opacity);
11486
+ cursor: not-allowed;
11487
+ }
11488
+
11489
+ .zx-pagination__first-trigger.zx-f-focus-visible {
11490
+ outline: 2px solid var(--color-base-content);
11491
+ outline-offset: 2px;
11492
+ }
11493
+
11494
+ .zx-pagination__first-trigger.zx-f-pressed {
11495
+ transform: translateY(1px);
11496
+ }
11497
+
10472
11498
  .zx-pagination__prev-trigger {
10473
11499
  display: flex;
10474
11500
  align-items: center;
@@ -10482,6 +11508,7 @@
10482
11508
  font-size: calc(var(--pg-font) * 1.2);
10483
11509
  line-height: var(--leading-none);
10484
11510
  appearance: none;
11511
+ text-decoration: none;
10485
11512
  cursor: pointer;
10486
11513
  transition: background var(--duration-fast) var(--ease-standard);
10487
11514
  }
@@ -10533,6 +11560,7 @@
10533
11560
  font-size: calc(var(--pg-font) * 1.2);
10534
11561
  line-height: var(--leading-none);
10535
11562
  appearance: none;
11563
+ text-decoration: none;
10536
11564
  cursor: pointer;
10537
11565
  transition: background var(--duration-fast) var(--ease-standard);
10538
11566
  }
@@ -10571,6 +11599,58 @@
10571
11599
  transform: translateY(1px);
10572
11600
  }
10573
11601
 
11602
+ .zx-pagination__last-trigger {
11603
+ display: flex;
11604
+ align-items: center;
11605
+ justify-content: center;
11606
+ min-inline-size: calc(var(--size-field) * 10);
11607
+ block-size: calc(var(--size-field) * 10);
11608
+ background: var(--color-base-200);
11609
+ color: var(--color-base-content);
11610
+ border: none;
11611
+ border-radius: var(--radius-field);
11612
+ font-size: calc(var(--pg-font) * 1.2);
11613
+ line-height: var(--leading-none);
11614
+ appearance: none;
11615
+ text-decoration: none;
11616
+ cursor: pointer;
11617
+ transition: background var(--duration-fast) var(--ease-standard);
11618
+ }
11619
+
11620
+ .zx-pagination__last-trigger.zx-a-size-xs {
11621
+ min-inline-size: calc(var(--size-field) * 7);
11622
+ block-size: calc(var(--size-field) * 7);
11623
+ }
11624
+
11625
+ .zx-pagination__last-trigger.zx-a-size-sm {
11626
+ min-inline-size: calc(var(--size-field) * 9);
11627
+ block-size: calc(var(--size-field) * 9);
11628
+ }
11629
+
11630
+ .zx-pagination__last-trigger.zx-a-size-lg {
11631
+ min-inline-size: calc(var(--size-field) * 12);
11632
+ block-size: calc(var(--size-field) * 12);
11633
+ }
11634
+
11635
+ .zx-pagination__last-trigger.zx-a-size-xl {
11636
+ min-inline-size: calc(var(--size-field) * 14);
11637
+ block-size: calc(var(--size-field) * 14);
11638
+ }
11639
+
11640
+ .zx-pagination__last-trigger.zx-f-disabled {
11641
+ opacity: var(--disabled-opacity);
11642
+ cursor: not-allowed;
11643
+ }
11644
+
11645
+ .zx-pagination__last-trigger.zx-f-focus-visible {
11646
+ outline: 2px solid var(--color-base-content);
11647
+ outline-offset: 2px;
11648
+ }
11649
+
11650
+ .zx-pagination__last-trigger.zx-f-pressed {
11651
+ transform: translateY(1px);
11652
+ }
11653
+
10574
11654
  .zx-pagination__root.zx-a-color-primary {
10575
11655
  --pg-accent: var(--color-primary);
10576
11656
  --pg-accent-content: var(--color-primary-content);
@@ -10698,6 +11778,26 @@
10698
11778
  color: #9fb9d0a6;
10699
11779
  }
10700
11780
 
11781
+ .zx-root .zx-steps__item.zx-f-invalid {
11782
+ color: #b34d5e;
11783
+ }
11784
+
11785
+ .zx-root.zx-theme-dark .zx-steps__item.zx-f-invalid {
11786
+ color: #ff95a3;
11787
+ }
11788
+
11789
+ .zx-root.zx-theme-dim .zx-steps__item.zx-f-invalid {
11790
+ color: #eab8ad;
11791
+ }
11792
+
11793
+ .zx-root.zx-theme-nord .zx-steps__item.zx-f-invalid {
11794
+ color: #92555e;
11795
+ }
11796
+
11797
+ .zx-root.zx-theme-sunset .zx-steps__item.zx-f-invalid {
11798
+ color: #e4bbc3;
11799
+ }
11800
+
10701
11801
  .zx-steps__item.zx-f-disabled {
10702
11802
  opacity: var(--disabled-opacity);
10703
11803
  cursor: not-allowed;
@@ -10779,6 +11879,11 @@
10779
11879
  color: var(--color-base-content);
10780
11880
  }
10781
11881
 
11882
+ .zx-steps__indicator.zx-f-invalid {
11883
+ background: var(--color-error);
11884
+ color: var(--color-error-content);
11885
+ }
11886
+
10782
11887
  .zx-steps__separator {
10783
11888
  position: absolute;
10784
11889
  pointer-events: none;
@@ -10793,6 +11898,10 @@
10793
11898
  background: var(--color-base-300);
10794
11899
  }
10795
11900
 
11901
+ .zx-steps__separator.zx-f-invalid {
11902
+ background: var(--color-error);
11903
+ }
11904
+
10796
11905
  .zx-steps__separator.zx-o-horizontal {
10797
11906
  inline-size: 100%;
10798
11907
  block-size: var(--border);
@@ -10872,6 +11981,80 @@
10872
11981
  color: #9fb9d0b3;
10873
11982
  }
10874
11983
 
11984
+ .zx-steps__content {
11985
+ flex: 1 0 100%;
11986
+ font-size: var(--text-md);
11987
+ color: var(--color-base-content);
11988
+ }
11989
+
11990
+ .zx-steps__prev-trigger {
11991
+ appearance: none;
11992
+ display: flex;
11993
+ align-items: center;
11994
+ justify-content: center;
11995
+ gap: 0.5em;
11996
+ height: calc(var(--size-field) * 12);
11997
+ font-size: var(--text-sm);
11998
+ font-weight: var(--weight-semibold);
11999
+ color: var(--color-base-content);
12000
+ background: var(--color-base-200);
12001
+ border: var(--border) solid var(--color-base-300);
12002
+ border-radius: var(--radius-field);
12003
+ box-shadow: var(--shadow-xs);
12004
+ cursor: pointer;
12005
+ transition: background var(--duration-normal) var(--ease-standard);
12006
+ flex: 0 0 auto;
12007
+ align-self: flex-start;
12008
+ }
12009
+
12010
+ .zx-steps__prev-trigger.zx-f-disabled {
12011
+ opacity: var(--disabled-opacity);
12012
+ cursor: not-allowed;
12013
+ }
12014
+
12015
+ .zx-steps__prev-trigger.zx-f-focus-visible {
12016
+ outline: 2px solid var(--color-base-content);
12017
+ outline-offset: 2px;
12018
+ }
12019
+
12020
+ .zx-steps__prev-trigger.zx-f-pressed {
12021
+ transform: translateY(1px);
12022
+ }
12023
+
12024
+ .zx-steps__next-trigger {
12025
+ appearance: none;
12026
+ display: flex;
12027
+ align-items: center;
12028
+ justify-content: center;
12029
+ gap: 0.5em;
12030
+ height: calc(var(--size-field) * 12);
12031
+ font-size: var(--text-sm);
12032
+ font-weight: var(--weight-semibold);
12033
+ color: var(--color-base-content);
12034
+ background: var(--color-base-200);
12035
+ border: var(--border) solid var(--color-base-300);
12036
+ border-radius: var(--radius-field);
12037
+ box-shadow: var(--shadow-xs);
12038
+ cursor: pointer;
12039
+ transition: background var(--duration-normal) var(--ease-standard);
12040
+ flex: 0 0 auto;
12041
+ align-self: flex-start;
12042
+ }
12043
+
12044
+ .zx-steps__next-trigger.zx-f-disabled {
12045
+ opacity: var(--disabled-opacity);
12046
+ cursor: not-allowed;
12047
+ }
12048
+
12049
+ .zx-steps__next-trigger.zx-f-focus-visible {
12050
+ outline: 2px solid var(--color-base-content);
12051
+ outline-offset: 2px;
12052
+ }
12053
+
12054
+ .zx-steps__next-trigger.zx-f-pressed {
12055
+ transform: translateY(1px);
12056
+ }
12057
+
10875
12058
  .zx-steps__item.zx-a-color-primary {
10876
12059
  --steps-accent: var(--color-primary);
10877
12060
  --steps-accent-content: var(--color-primary-content);