@kushagradhawan/kookie-ui 0.1.20 → 0.1.21

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 (32) hide show
  1. package/components.css +1417 -0
  2. package/dist/cjs/components/index.d.ts +1 -0
  3. package/dist/cjs/components/index.d.ts.map +1 -1
  4. package/dist/cjs/components/index.js +1 -1
  5. package/dist/cjs/components/index.js.map +3 -3
  6. package/dist/cjs/components/sidebar.d.ts +157 -0
  7. package/dist/cjs/components/sidebar.d.ts.map +1 -0
  8. package/dist/cjs/components/sidebar.js +2 -0
  9. package/dist/cjs/components/sidebar.js.map +7 -0
  10. package/dist/cjs/components/sidebar.props.d.ts +60 -0
  11. package/dist/cjs/components/sidebar.props.d.ts.map +1 -0
  12. package/dist/cjs/components/sidebar.props.js +2 -0
  13. package/dist/cjs/components/sidebar.props.js.map +7 -0
  14. package/dist/esm/components/index.d.ts +1 -0
  15. package/dist/esm/components/index.d.ts.map +1 -1
  16. package/dist/esm/components/index.js +1 -1
  17. package/dist/esm/components/index.js.map +3 -3
  18. package/dist/esm/components/sidebar.d.ts +157 -0
  19. package/dist/esm/components/sidebar.d.ts.map +1 -0
  20. package/dist/esm/components/sidebar.js +2 -0
  21. package/dist/esm/components/sidebar.js.map +7 -0
  22. package/dist/esm/components/sidebar.props.d.ts +60 -0
  23. package/dist/esm/components/sidebar.props.d.ts.map +1 -0
  24. package/dist/esm/components/sidebar.props.js +2 -0
  25. package/dist/esm/components/sidebar.props.js.map +7 -0
  26. package/package.json +1 -1
  27. package/src/components/index.css +1 -0
  28. package/src/components/index.tsx +1 -1
  29. package/src/components/sidebar.css +1043 -0
  30. package/src/components/sidebar.props.tsx +54 -0
  31. package/src/components/sidebar.tsx +740 -0
  32. package/styles.css +1417 -0
package/components.css CHANGED
@@ -11395,6 +11395,1423 @@
11395
11395
  --separator-size: 100%;
11396
11396
  }
11397
11397
  }
11398
+ .rt-SidebarProvider:where([data-side="left"]) {
11399
+ order: -1;
11400
+ }
11401
+ .rt-SidebarProvider:where([data-side="right"]) {
11402
+ order: 999;
11403
+ }
11404
+ .rt-SidebarRoot {
11405
+ --sidebar-width: 16rem;
11406
+ --sidebar-base-border-radius: 0;
11407
+ width: var(--sidebar-width);
11408
+ height: 100%;
11409
+ flex-shrink: 0;
11410
+ display: flex;
11411
+ flex-direction: column;
11412
+ }
11413
+ .rt-SidebarRoot :where(.radix-themes) {
11414
+ display: flex;
11415
+ flex-direction: column;
11416
+ flex: 1;
11417
+ height: 100%;
11418
+ }
11419
+ .rt-SidebarRoot:where([data-type="floating"]) {
11420
+ border-radius: var(--sidebar-base-border-radius);
11421
+ margin: var(--space-2);
11422
+ height: calc(100% - var(--space-4));
11423
+ overflow: visible;
11424
+ position: relative;
11425
+ --sidebar-base-border-radius: var(--radius-5);
11426
+ }
11427
+ .rt-SidebarRoot:where([data-type="floating"]) :where(.radix-themes) {
11428
+ border-radius: inherit;
11429
+ }
11430
+ .rt-SidebarRoot:where([data-type="floating"]):where(.rt-r-size-1) {
11431
+ --sidebar-base-border-radius: var(--radius-5);
11432
+ }
11433
+ .rt-SidebarRoot:where([data-type="floating"]):where(.rt-r-size-2) {
11434
+ --sidebar-base-border-radius: var(--radius-6);
11435
+ }
11436
+ .rt-SidebarContainer {
11437
+ --sidebar-base-border-radius: 0;
11438
+ display: flex;
11439
+ flex-direction: column;
11440
+ height: 100%;
11441
+ width: 100%;
11442
+ background-color: var(--color-panel);
11443
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
11444
+ backdrop-filter: var(--backdrop-filter-panel);
11445
+ border-radius: inherit;
11446
+ flex: 1;
11447
+ }
11448
+ .rt-SidebarContainer:where(.rt-variant-surface) {
11449
+ background-color: var(--color-panel);
11450
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
11451
+ backdrop-filter: var(--backdrop-filter-panel);
11452
+ }
11453
+ .rt-SidebarContainer:where(.rt-variant-surface):where([data-panel-background='solid']) {
11454
+ --color-panel: var(--color-panel-solid);
11455
+ -webkit-backdrop-filter: none;
11456
+ backdrop-filter: none;
11457
+ --backdrop-filter-panel: none;
11458
+ --backdrop-filter-components: none;
11459
+ }
11460
+ .rt-SidebarContainer:where(.rt-variant-surface):where([data-panel-background='translucent']) {
11461
+ --color-panel: var(--color-panel-translucent);
11462
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
11463
+ backdrop-filter: var(--backdrop-filter-panel);
11464
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
11465
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
11466
+ }
11467
+ :where(.rt-SidebarRoot[data-type="floating"]) .rt-SidebarContainer:where(.rt-variant-surface) {
11468
+ box-shadow: inset 0 0 0 1px var(--gray-a6);
11469
+ }
11470
+ :where(.rt-SidebarRoot[data-type="sidebar"][data-side="left"]) .rt-SidebarContainer:where(.rt-variant-surface) {
11471
+ box-shadow: inset -1px 0 0 0 var(--gray-a6);
11472
+ }
11473
+ :where(.rt-SidebarRoot[data-type="sidebar"][data-side="right"]) .rt-SidebarContainer:where(.rt-variant-surface) {
11474
+ box-shadow: inset 1px 0 0 0 var(--gray-a6);
11475
+ }
11476
+ .rt-SidebarHeader {
11477
+ display: flex;
11478
+ flex-direction: column;
11479
+ flex-shrink: 0;
11480
+ border-radius: var(--sidebar-base-border-radius) var(--sidebar-base-border-radius) 0 0;
11481
+ }
11482
+ .rt-SidebarHeader :where(.rt-SidebarMenuButton) {
11483
+ display: flex;
11484
+ align-items: center;
11485
+ gap: var(--space-2);
11486
+ min-height: var(--sidebar-item-height);
11487
+ padding-top: var(--sidebar-item-padding-y);
11488
+ padding-bottom: var(--sidebar-item-padding-y);
11489
+ padding-left: var(--sidebar-item-padding-left);
11490
+ padding-right: var(--sidebar-item-padding-right);
11491
+ box-sizing: border-box;
11492
+ position: relative;
11493
+ outline: none;
11494
+ background: none;
11495
+ border: none;
11496
+ width: 100%;
11497
+ text-align: left;
11498
+ cursor: var(--cursor-menu-item);
11499
+ -webkit-user-select: none;
11500
+ user-select: none;
11501
+ justify-content: flex-start;
11502
+ border-radius: var(--sidebar-base-border-radius) var(--sidebar-base-border-radius) 0 0;
11503
+ transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
11504
+ }
11505
+ .rt-SidebarHeader :where(.rt-SidebarMenuButton):where(:focus-visible) {
11506
+ outline: 2px solid var(--focus-8);
11507
+ outline-offset: 2px;
11508
+ }
11509
+ @media (prefers-reduced-motion: reduce) {
11510
+ .rt-SidebarHeader :where(.rt-SidebarMenuButton) {
11511
+ transition: none;
11512
+ }
11513
+ }
11514
+ .rt-SidebarHeader:where(.rt-SidebarHeader--container) {
11515
+ display: flex;
11516
+ flex-direction: row;
11517
+ align-items: center;
11518
+ gap: var(--space-2);
11519
+ padding: var(--sidebar-content-padding);
11520
+ min-height: var(--sidebar-item-height);
11521
+ }
11522
+ .rt-SidebarHeader:where(.rt-SidebarHeader--container) :where(.rt-SidebarMenuButton) {
11523
+ flex: 1;
11524
+ }
11525
+ .rt-SidebarHeader:where(.rt-flex-row) {
11526
+ flex-direction: row;
11527
+ }
11528
+ .rt-SidebarHeader:where(.rt-flex-col) {
11529
+ flex-direction: column;
11530
+ }
11531
+ .rt-SidebarHeader:where(.rt-items-center) {
11532
+ align-items: center;
11533
+ }
11534
+ .rt-SidebarHeader:where(.rt-items-start) {
11535
+ align-items: flex-start;
11536
+ }
11537
+ .rt-SidebarHeader:where(.rt-items-end) {
11538
+ align-items: flex-end;
11539
+ }
11540
+ .rt-SidebarHeader:where(.rt-justify-between) {
11541
+ justify-content: space-between;
11542
+ }
11543
+ .rt-SidebarHeader:where(.rt-justify-center) {
11544
+ justify-content: center;
11545
+ }
11546
+ .rt-SidebarHeader:where(.rt-justify-start) {
11547
+ justify-content: flex-start;
11548
+ }
11549
+ .rt-SidebarHeader:where(.rt-justify-end) {
11550
+ justify-content: flex-end;
11551
+ }
11552
+ .rt-SidebarHeader:where(.rt-gap-1) {
11553
+ gap: var(--space-1);
11554
+ }
11555
+ .rt-SidebarHeader:where(.rt-gap-2) {
11556
+ gap: var(--space-2);
11557
+ }
11558
+ .rt-SidebarHeader:where(.rt-gap-3) {
11559
+ gap: var(--space-3);
11560
+ }
11561
+ .rt-SidebarHeader:where(.rt-gap-4) {
11562
+ gap: var(--space-4);
11563
+ }
11564
+ .rt-SidebarContent {
11565
+ --scrollarea-scrollbar-vertical-margin-top: var(--sidebar-content-padding);
11566
+ --scrollarea-scrollbar-vertical-margin-bottom: var(--sidebar-content-padding);
11567
+ --scrollarea-scrollbar-horizontal-margin-left: var(--sidebar-content-padding);
11568
+ --scrollarea-scrollbar-horizontal-margin-right: var(--sidebar-content-padding);
11569
+ display: flex;
11570
+ flex-direction: column;
11571
+ flex: 1;
11572
+ box-sizing: border-box;
11573
+ min-height: 0;
11574
+ }
11575
+ .rt-SidebarContent :where(.rt-ScrollAreaRoot) {
11576
+ flex: 1;
11577
+ display: flex;
11578
+ flex-direction: column;
11579
+ min-height: 0;
11580
+ }
11581
+ .rt-SidebarContent :where(.rt-ScrollAreaViewport) {
11582
+ flex: 1;
11583
+ display: flex;
11584
+ flex-direction: column;
11585
+ min-height: 0;
11586
+ }
11587
+ .rt-SidebarMenu {
11588
+ flex: 1;
11589
+ display: flex;
11590
+ flex-direction: column;
11591
+ gap: var(--space-2);
11592
+ padding: var(--sidebar-content-padding);
11593
+ box-sizing: border-box;
11594
+ list-style: none;
11595
+ margin: 0;
11596
+ min-height: 0;
11597
+ }
11598
+ :where(.rt-SidebarContent:has(.rt-ScrollAreaScrollbar[data-orientation='vertical'])) .rt-SidebarMenu {
11599
+ padding-right: var(--space-3);
11600
+ }
11601
+ .rt-SidebarMenuItem {
11602
+ list-style: none;
11603
+ }
11604
+ .rt-SidebarMenuButton {
11605
+ display: flex;
11606
+ align-items: center;
11607
+ gap: var(--space-2);
11608
+ min-height: var(--sidebar-item-height);
11609
+ padding-top: var(--sidebar-item-padding-y);
11610
+ padding-bottom: var(--sidebar-item-padding-y);
11611
+ padding-left: var(--sidebar-item-padding-left);
11612
+ padding-right: var(--sidebar-item-padding-right);
11613
+ box-sizing: border-box;
11614
+ position: relative;
11615
+ outline: none;
11616
+ scroll-margin: var(--sidebar-content-padding) 0;
11617
+ background: none;
11618
+ border: none;
11619
+ width: 100%;
11620
+ text-align: left;
11621
+ border-radius: var(--radius-2);
11622
+ transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
11623
+ -webkit-user-select: none;
11624
+ user-select: none;
11625
+ cursor: var(--cursor-menu-item);
11626
+ }
11627
+ .rt-SidebarMenuButton:where([data-disabled]) {
11628
+ cursor: default;
11629
+ color: var(--gray-a8);
11630
+ }
11631
+ .rt-SidebarMenuButton:where([data-active], .rt-active) {
11632
+ background-color: var(--accent-a3);
11633
+ color: var(--accent-a12);
11634
+ }
11635
+ .rt-SidebarMenuButton:where(:focus-visible) {
11636
+ outline: 2px solid var(--focus-8);
11637
+ outline-offset: 2px;
11638
+ }
11639
+ .rt-SidebarMenuButton:where([data-accent-color]) {
11640
+ color: var(--accent-a11);
11641
+ }
11642
+ .rt-SidebarMenuButton :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
11643
+ color: var(--gray-a10);
11644
+ }
11645
+ .rt-SidebarMenuButton:where([data-disabled], [data-highlighted], [data-active]) :where(.rt-SidebarMenuShortcut) {
11646
+ color: inherit;
11647
+ }
11648
+ @media (prefers-reduced-motion: reduce) {
11649
+ .rt-SidebarMenuButton {
11650
+ transition: none;
11651
+ }
11652
+ }
11653
+ .rt-SidebarMenuSubTrigger {
11654
+ justify-content: space-between;
11655
+ }
11656
+ .rt-SidebarMenuSubTrigger :where(.rt-SidebarMenuSubTriggerIcon) {
11657
+ transition: transform 0.2s ease;
11658
+ }
11659
+ .rt-SidebarMenuSubTrigger:where([data-state="open"]) :where(.rt-SidebarMenuSubTriggerIcon) {
11660
+ transform: rotate(90deg);
11661
+ }
11662
+ .rt-SidebarMenuSubContent {
11663
+ overflow: hidden;
11664
+ }
11665
+ .rt-SidebarMenuSubContent:where(:focus-within) {
11666
+ overflow: visible;
11667
+ }
11668
+ .rt-SidebarMenuSubContent:where([data-state="open"]) {
11669
+ animation: rt-sidebar-slide-down 200ms ease-out;
11670
+ }
11671
+ .rt-SidebarMenuSubContent:where([data-state="closed"]) {
11672
+ animation: rt-sidebar-slide-up 200ms ease-out;
11673
+ }
11674
+ @keyframes rt-sidebar-slide-down {
11675
+ from {
11676
+ height: 0;
11677
+ }
11678
+ to {
11679
+ height: var(--radix-accordion-content-height);
11680
+ }
11681
+ }
11682
+ @keyframes rt-sidebar-slide-up {
11683
+ from {
11684
+ height: var(--radix-accordion-content-height);
11685
+ }
11686
+ to {
11687
+ height: 0;
11688
+ }
11689
+ }
11690
+ .rt-SidebarMenuSubList {
11691
+ padding-left: var(--space-4);
11692
+ border-left: 1px solid var(--gray-a5);
11693
+ margin-left: var(--space-3);
11694
+ }
11695
+ :where(.rt-SidebarContent.rt-r-size-1) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton {
11696
+ padding-left: var(--space-3);
11697
+ padding-top: calc(var(--space-1) * 0.75);
11698
+ padding-bottom: calc(var(--space-1) * 0.75);
11699
+ min-height: var(--space-5);
11700
+ font-size: var(--font-size-1);
11701
+ }
11702
+ :where(.rt-SidebarContent.rt-r-size-2) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton {
11703
+ padding-left: var(--space-3);
11704
+ padding-top: var(--space-1);
11705
+ padding-bottom: var(--space-1);
11706
+ min-height: var(--space-6);
11707
+ font-size: var(--font-size-2);
11708
+ }
11709
+ .rt-SidebarFooter {
11710
+ display: flex;
11711
+ flex-direction: column;
11712
+ flex-shrink: 0;
11713
+ margin-top: auto;
11714
+ border-radius: 0 0 var(--sidebar-base-border-radius) var(--sidebar-base-border-radius);
11715
+ }
11716
+ .rt-SidebarFooter :where(.rt-SidebarMenuButton) {
11717
+ display: flex;
11718
+ align-items: center;
11719
+ gap: var(--space-2);
11720
+ min-height: var(--sidebar-item-height);
11721
+ padding-top: var(--sidebar-item-padding-y);
11722
+ padding-bottom: var(--sidebar-item-padding-y);
11723
+ padding-left: var(--sidebar-item-padding-left);
11724
+ padding-right: var(--sidebar-item-padding-right);
11725
+ box-sizing: border-box;
11726
+ position: relative;
11727
+ outline: none;
11728
+ background: none;
11729
+ border: none;
11730
+ width: 100%;
11731
+ text-align: left;
11732
+ cursor: var(--cursor-menu-item);
11733
+ -webkit-user-select: none;
11734
+ user-select: none;
11735
+ justify-content: flex-start;
11736
+ border-radius: 0 0 var(--sidebar-base-border-radius) var(--sidebar-base-border-radius);
11737
+ transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
11738
+ }
11739
+ .rt-SidebarFooter :where(.rt-SidebarMenuButton):where(:focus-visible) {
11740
+ outline: 2px solid var(--focus-8);
11741
+ outline-offset: 2px;
11742
+ }
11743
+ @media (prefers-reduced-motion: reduce) {
11744
+ .rt-SidebarFooter :where(.rt-SidebarMenuButton) {
11745
+ transition: none;
11746
+ }
11747
+ }
11748
+ .rt-SidebarFooter:where(.rt-SidebarFooter--container) {
11749
+ display: flex;
11750
+ flex-direction: row;
11751
+ align-items: center;
11752
+ gap: var(--space-2);
11753
+ padding: var(--sidebar-content-padding);
11754
+ min-height: var(--sidebar-item-height);
11755
+ }
11756
+ .rt-SidebarFooter:where(.rt-SidebarFooter--container) :where(.rt-SidebarMenuButton) {
11757
+ flex: 1;
11758
+ }
11759
+ .rt-SidebarFooter:where(.rt-flex-row) {
11760
+ flex-direction: row;
11761
+ }
11762
+ .rt-SidebarFooter:where(.rt-flex-col) {
11763
+ flex-direction: column;
11764
+ }
11765
+ .rt-SidebarFooter:where(.rt-items-center) {
11766
+ align-items: center;
11767
+ }
11768
+ .rt-SidebarFooter:where(.rt-items-start) {
11769
+ align-items: flex-start;
11770
+ }
11771
+ .rt-SidebarFooter:where(.rt-items-end) {
11772
+ align-items: flex-end;
11773
+ }
11774
+ .rt-SidebarFooter:where(.rt-justify-between) {
11775
+ justify-content: space-between;
11776
+ }
11777
+ .rt-SidebarFooter:where(.rt-justify-center) {
11778
+ justify-content: center;
11779
+ }
11780
+ .rt-SidebarFooter:where(.rt-justify-start) {
11781
+ justify-content: flex-start;
11782
+ }
11783
+ .rt-SidebarFooter:where(.rt-justify-end) {
11784
+ justify-content: flex-end;
11785
+ }
11786
+ .rt-SidebarFooter:where(.rt-gap-1) {
11787
+ gap: var(--space-1);
11788
+ }
11789
+ .rt-SidebarFooter:where(.rt-gap-2) {
11790
+ gap: var(--space-2);
11791
+ }
11792
+ .rt-SidebarFooter:where(.rt-gap-3) {
11793
+ gap: var(--space-3);
11794
+ }
11795
+ .rt-SidebarFooter:where(.rt-gap-4) {
11796
+ gap: var(--space-4);
11797
+ }
11798
+ .rt-SidebarSeparator {
11799
+ width: 100%;
11800
+ margin: var(--space-2) 0;
11801
+ }
11802
+ .rt-SidebarGroup {
11803
+ display: flex;
11804
+ flex-direction: column;
11805
+ flex-shrink: 0;
11806
+ }
11807
+ .rt-SidebarGroup:where(:not(:first-child)) {
11808
+ margin-top: var(--space-4);
11809
+ }
11810
+ .rt-SidebarGroupLabel {
11811
+ display: flex;
11812
+ align-items: center;
11813
+ min-height: var(--sidebar-item-height);
11814
+ padding-top: var(--sidebar-item-padding-y);
11815
+ padding-bottom: var(--sidebar-item-padding-y);
11816
+ padding-left: var(--sidebar-item-padding-left);
11817
+ padding-right: var(--sidebar-item-padding-right);
11818
+ box-sizing: border-box;
11819
+ color: var(--gray-a10);
11820
+ -webkit-user-select: none;
11821
+ user-select: none;
11822
+ cursor: default;
11823
+ flex-shrink: 0;
11824
+ }
11825
+ .rt-SidebarGroupContent {
11826
+ display: flex;
11827
+ flex-direction: column;
11828
+ flex-shrink: 0;
11829
+ }
11830
+ .rt-SidebarContainer:where(.rt-r-size-1) {
11831
+ --sidebar-base-padding: var(--space-3);
11832
+ --sidebar-content-padding: var(--space-1);
11833
+ --sidebar-item-padding-left: var(--space-2);
11834
+ --sidebar-item-padding-right: var(--space-2);
11835
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
11836
+ --sidebar-item-height: var(--space-5);
11837
+ }
11838
+ .rt-SidebarContainer:where(.rt-r-size-2) {
11839
+ --sidebar-base-padding: var(--space-4);
11840
+ --sidebar-content-padding: var(--space-2);
11841
+ --sidebar-item-padding-left: var(--space-3);
11842
+ --sidebar-item-padding-right: var(--space-3);
11843
+ --sidebar-item-padding-y: var(--space-1);
11844
+ --sidebar-item-height: var(--space-6);
11845
+ }
11846
+ .rt-SidebarContent:where(.rt-r-size-1) {
11847
+ --sidebar-content-padding: var(--space-1);
11848
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
11849
+ --sidebar-item-padding-right: var(--space-2);
11850
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
11851
+ --sidebar-item-height: var(--space-5);
11852
+ border-radius: var(--radius-3);
11853
+ }
11854
+ .rt-SidebarContent:where(.rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
11855
+ --sidebar-item-padding-left: var(--space-2);
11856
+ }
11857
+ .rt-SidebarContent:where(.rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
11858
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
11859
+ }
11860
+ .rt-SidebarContent:where(.rt-r-size-2) {
11861
+ --sidebar-content-padding: var(--space-2);
11862
+ --sidebar-item-padding-left: var(--space-3);
11863
+ --sidebar-item-padding-right: var(--space-3);
11864
+ --sidebar-item-padding-y: var(--space-1);
11865
+ --sidebar-item-height: var(--space-6);
11866
+ border-radius: var(--radius-4);
11867
+ }
11868
+ .rt-SidebarContent:where(.rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
11869
+ --sidebar-item-padding-left: var(--space-3);
11870
+ }
11871
+ .rt-SidebarContent:where(.rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
11872
+ --sidebar-item-padding-left: var(--space-5);
11873
+ }
11874
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) {
11875
+ font-size: var(--font-size-1);
11876
+ line-height: var(--line-height-1);
11877
+ letter-spacing: var(--letter-spacing-1);
11878
+ border-radius: var(--radius-1);
11879
+ }
11880
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
11881
+ width: var(--content-icon-size-1);
11882
+ height: var(--content-icon-size-1);
11883
+ flex-shrink: 0;
11884
+ }
11885
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
11886
+ width: var(--indicator-icon-size-1);
11887
+ height: var(--indicator-icon-size-1);
11888
+ flex-shrink: 0;
11889
+ margin-left: auto;
11890
+ }
11891
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarGroupLabel) {
11892
+ font-size: var(--font-size-1);
11893
+ line-height: var(--line-height-1);
11894
+ letter-spacing: var(--letter-spacing-1);
11895
+ }
11896
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
11897
+ font-size: var(--font-size-1);
11898
+ line-height: var(--line-height-1);
11899
+ letter-spacing: var(--letter-spacing-1);
11900
+ border-radius: var(--radius-1);
11901
+ }
11902
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
11903
+ width: var(--content-icon-size-1);
11904
+ height: var(--content-icon-size-1);
11905
+ flex-shrink: 0;
11906
+ }
11907
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
11908
+ font-size: var(--font-size-1);
11909
+ line-height: var(--line-height-1);
11910
+ letter-spacing: var(--letter-spacing-1);
11911
+ border-radius: var(--radius-1);
11912
+ }
11913
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
11914
+ width: var(--content-icon-size-1);
11915
+ height: var(--content-icon-size-1);
11916
+ flex-shrink: 0;
11917
+ }
11918
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) {
11919
+ font-size: var(--font-size-2);
11920
+ line-height: var(--line-height-2);
11921
+ letter-spacing: var(--letter-spacing-2);
11922
+ border-radius: var(--radius-3);
11923
+ }
11924
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
11925
+ width: var(--content-icon-size-2);
11926
+ height: var(--content-icon-size-2);
11927
+ flex-shrink: 0;
11928
+ }
11929
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
11930
+ width: var(--indicator-icon-size-2);
11931
+ height: var(--indicator-icon-size-2);
11932
+ flex-shrink: 0;
11933
+ margin-left: auto;
11934
+ }
11935
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarGroupLabel) {
11936
+ font-size: var(--font-size-2);
11937
+ line-height: var(--line-height-2);
11938
+ letter-spacing: var(--letter-spacing-2);
11939
+ }
11940
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
11941
+ font-size: var(--font-size-2);
11942
+ line-height: var(--line-height-2);
11943
+ letter-spacing: var(--letter-spacing-2);
11944
+ border-radius: var(--radius-3);
11945
+ }
11946
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
11947
+ width: var(--content-icon-size-2);
11948
+ height: var(--content-icon-size-2);
11949
+ flex-shrink: 0;
11950
+ }
11951
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
11952
+ font-size: var(--font-size-2);
11953
+ line-height: var(--line-height-2);
11954
+ letter-spacing: var(--letter-spacing-2);
11955
+ border-radius: var(--radius-3);
11956
+ }
11957
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
11958
+ width: var(--content-icon-size-2);
11959
+ height: var(--content-icon-size-2);
11960
+ flex-shrink: 0;
11961
+ }
11962
+ @media (min-width: 520px) {
11963
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) {
11964
+ --sidebar-base-padding: var(--space-3);
11965
+ --sidebar-content-padding: var(--space-1);
11966
+ --sidebar-item-padding-left: var(--space-2);
11967
+ --sidebar-item-padding-right: var(--space-2);
11968
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
11969
+ --sidebar-item-height: var(--space-5);
11970
+ }
11971
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) {
11972
+ --sidebar-base-padding: var(--space-4);
11973
+ --sidebar-content-padding: var(--space-2);
11974
+ --sidebar-item-padding-left: var(--space-3);
11975
+ --sidebar-item-padding-right: var(--space-3);
11976
+ --sidebar-item-padding-y: var(--space-1);
11977
+ --sidebar-item-height: var(--space-6);
11978
+ }
11979
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) {
11980
+ --sidebar-content-padding: var(--space-1);
11981
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
11982
+ --sidebar-item-padding-right: var(--space-2);
11983
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
11984
+ --sidebar-item-height: var(--space-5);
11985
+ border-radius: var(--radius-3);
11986
+ }
11987
+ .rt-SidebarContent:where(.xs\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
11988
+ --sidebar-item-padding-left: var(--space-2);
11989
+ }
11990
+ .rt-SidebarContent:where(.xs\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
11991
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
11992
+ }
11993
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) {
11994
+ --sidebar-content-padding: var(--space-2);
11995
+ --sidebar-item-padding-left: var(--space-3);
11996
+ --sidebar-item-padding-right: var(--space-3);
11997
+ --sidebar-item-padding-y: var(--space-1);
11998
+ --sidebar-item-height: var(--space-6);
11999
+ border-radius: var(--radius-4);
12000
+ }
12001
+ .rt-SidebarContent:where(.xs\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12002
+ --sidebar-item-padding-left: var(--space-3);
12003
+ }
12004
+ .rt-SidebarContent:where(.xs\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12005
+ --sidebar-item-padding-left: var(--space-5);
12006
+ }
12007
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
12008
+ font-size: var(--font-size-1);
12009
+ line-height: var(--line-height-1);
12010
+ letter-spacing: var(--letter-spacing-1);
12011
+ border-radius: var(--radius-1);
12012
+ }
12013
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
12014
+ width: var(--content-icon-size-1);
12015
+ height: var(--content-icon-size-1);
12016
+ flex-shrink: 0;
12017
+ }
12018
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
12019
+ width: var(--indicator-icon-size-1);
12020
+ height: var(--indicator-icon-size-1);
12021
+ flex-shrink: 0;
12022
+ margin-left: auto;
12023
+ }
12024
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
12025
+ font-size: var(--font-size-1);
12026
+ line-height: var(--line-height-1);
12027
+ letter-spacing: var(--letter-spacing-1);
12028
+ }
12029
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12030
+ font-size: var(--font-size-1);
12031
+ line-height: var(--line-height-1);
12032
+ letter-spacing: var(--letter-spacing-1);
12033
+ border-radius: var(--radius-1);
12034
+ }
12035
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12036
+ width: var(--content-icon-size-1);
12037
+ height: var(--content-icon-size-1);
12038
+ flex-shrink: 0;
12039
+ }
12040
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12041
+ font-size: var(--font-size-1);
12042
+ line-height: var(--line-height-1);
12043
+ letter-spacing: var(--letter-spacing-1);
12044
+ border-radius: var(--radius-1);
12045
+ }
12046
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12047
+ width: var(--content-icon-size-1);
12048
+ height: var(--content-icon-size-1);
12049
+ flex-shrink: 0;
12050
+ }
12051
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
12052
+ font-size: var(--font-size-2);
12053
+ line-height: var(--line-height-2);
12054
+ letter-spacing: var(--letter-spacing-2);
12055
+ border-radius: var(--radius-3);
12056
+ }
12057
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
12058
+ width: var(--content-icon-size-2);
12059
+ height: var(--content-icon-size-2);
12060
+ flex-shrink: 0;
12061
+ }
12062
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
12063
+ width: var(--indicator-icon-size-2);
12064
+ height: var(--indicator-icon-size-2);
12065
+ flex-shrink: 0;
12066
+ margin-left: auto;
12067
+ }
12068
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
12069
+ font-size: var(--font-size-2);
12070
+ line-height: var(--line-height-2);
12071
+ letter-spacing: var(--letter-spacing-2);
12072
+ }
12073
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12074
+ font-size: var(--font-size-2);
12075
+ line-height: var(--line-height-2);
12076
+ letter-spacing: var(--letter-spacing-2);
12077
+ border-radius: var(--radius-3);
12078
+ }
12079
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12080
+ width: var(--content-icon-size-2);
12081
+ height: var(--content-icon-size-2);
12082
+ flex-shrink: 0;
12083
+ }
12084
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12085
+ font-size: var(--font-size-2);
12086
+ line-height: var(--line-height-2);
12087
+ letter-spacing: var(--letter-spacing-2);
12088
+ border-radius: var(--radius-3);
12089
+ }
12090
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12091
+ width: var(--content-icon-size-2);
12092
+ height: var(--content-icon-size-2);
12093
+ flex-shrink: 0;
12094
+ }
12095
+ }
12096
+ @media (min-width: 768px) {
12097
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) {
12098
+ --sidebar-base-padding: var(--space-3);
12099
+ --sidebar-content-padding: var(--space-1);
12100
+ --sidebar-item-padding-left: var(--space-2);
12101
+ --sidebar-item-padding-right: var(--space-2);
12102
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12103
+ --sidebar-item-height: var(--space-5);
12104
+ }
12105
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) {
12106
+ --sidebar-base-padding: var(--space-4);
12107
+ --sidebar-content-padding: var(--space-2);
12108
+ --sidebar-item-padding-left: var(--space-3);
12109
+ --sidebar-item-padding-right: var(--space-3);
12110
+ --sidebar-item-padding-y: var(--space-1);
12111
+ --sidebar-item-height: var(--space-6);
12112
+ }
12113
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) {
12114
+ --sidebar-content-padding: var(--space-1);
12115
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12116
+ --sidebar-item-padding-right: var(--space-2);
12117
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12118
+ --sidebar-item-height: var(--space-5);
12119
+ border-radius: var(--radius-3);
12120
+ }
12121
+ .rt-SidebarContent:where(.sm\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12122
+ --sidebar-item-padding-left: var(--space-2);
12123
+ }
12124
+ .rt-SidebarContent:where(.sm\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12125
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12126
+ }
12127
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) {
12128
+ --sidebar-content-padding: var(--space-2);
12129
+ --sidebar-item-padding-left: var(--space-3);
12130
+ --sidebar-item-padding-right: var(--space-3);
12131
+ --sidebar-item-padding-y: var(--space-1);
12132
+ --sidebar-item-height: var(--space-6);
12133
+ border-radius: var(--radius-4);
12134
+ }
12135
+ .rt-SidebarContent:where(.sm\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12136
+ --sidebar-item-padding-left: var(--space-3);
12137
+ }
12138
+ .rt-SidebarContent:where(.sm\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12139
+ --sidebar-item-padding-left: var(--space-5);
12140
+ }
12141
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
12142
+ font-size: var(--font-size-1);
12143
+ line-height: var(--line-height-1);
12144
+ letter-spacing: var(--letter-spacing-1);
12145
+ border-radius: var(--radius-1);
12146
+ }
12147
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
12148
+ width: var(--content-icon-size-1);
12149
+ height: var(--content-icon-size-1);
12150
+ flex-shrink: 0;
12151
+ }
12152
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
12153
+ width: var(--indicator-icon-size-1);
12154
+ height: var(--indicator-icon-size-1);
12155
+ flex-shrink: 0;
12156
+ margin-left: auto;
12157
+ }
12158
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
12159
+ font-size: var(--font-size-1);
12160
+ line-height: var(--line-height-1);
12161
+ letter-spacing: var(--letter-spacing-1);
12162
+ }
12163
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12164
+ font-size: var(--font-size-1);
12165
+ line-height: var(--line-height-1);
12166
+ letter-spacing: var(--letter-spacing-1);
12167
+ border-radius: var(--radius-1);
12168
+ }
12169
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12170
+ width: var(--content-icon-size-1);
12171
+ height: var(--content-icon-size-1);
12172
+ flex-shrink: 0;
12173
+ }
12174
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12175
+ font-size: var(--font-size-1);
12176
+ line-height: var(--line-height-1);
12177
+ letter-spacing: var(--letter-spacing-1);
12178
+ border-radius: var(--radius-1);
12179
+ }
12180
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12181
+ width: var(--content-icon-size-1);
12182
+ height: var(--content-icon-size-1);
12183
+ flex-shrink: 0;
12184
+ }
12185
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
12186
+ font-size: var(--font-size-2);
12187
+ line-height: var(--line-height-2);
12188
+ letter-spacing: var(--letter-spacing-2);
12189
+ border-radius: var(--radius-3);
12190
+ }
12191
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
12192
+ width: var(--content-icon-size-2);
12193
+ height: var(--content-icon-size-2);
12194
+ flex-shrink: 0;
12195
+ }
12196
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
12197
+ width: var(--indicator-icon-size-2);
12198
+ height: var(--indicator-icon-size-2);
12199
+ flex-shrink: 0;
12200
+ margin-left: auto;
12201
+ }
12202
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
12203
+ font-size: var(--font-size-2);
12204
+ line-height: var(--line-height-2);
12205
+ letter-spacing: var(--letter-spacing-2);
12206
+ }
12207
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12208
+ font-size: var(--font-size-2);
12209
+ line-height: var(--line-height-2);
12210
+ letter-spacing: var(--letter-spacing-2);
12211
+ border-radius: var(--radius-3);
12212
+ }
12213
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12214
+ width: var(--content-icon-size-2);
12215
+ height: var(--content-icon-size-2);
12216
+ flex-shrink: 0;
12217
+ }
12218
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12219
+ font-size: var(--font-size-2);
12220
+ line-height: var(--line-height-2);
12221
+ letter-spacing: var(--letter-spacing-2);
12222
+ border-radius: var(--radius-3);
12223
+ }
12224
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12225
+ width: var(--content-icon-size-2);
12226
+ height: var(--content-icon-size-2);
12227
+ flex-shrink: 0;
12228
+ }
12229
+ }
12230
+ @media (min-width: 1024px) {
12231
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) {
12232
+ --sidebar-base-padding: var(--space-3);
12233
+ --sidebar-content-padding: var(--space-1);
12234
+ --sidebar-item-padding-left: var(--space-2);
12235
+ --sidebar-item-padding-right: var(--space-2);
12236
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12237
+ --sidebar-item-height: var(--space-5);
12238
+ }
12239
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) {
12240
+ --sidebar-base-padding: var(--space-4);
12241
+ --sidebar-content-padding: var(--space-2);
12242
+ --sidebar-item-padding-left: var(--space-3);
12243
+ --sidebar-item-padding-right: var(--space-3);
12244
+ --sidebar-item-padding-y: var(--space-1);
12245
+ --sidebar-item-height: var(--space-6);
12246
+ }
12247
+ .rt-SidebarContent:where(.md\:rt-r-size-1) {
12248
+ --sidebar-content-padding: var(--space-1);
12249
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12250
+ --sidebar-item-padding-right: var(--space-2);
12251
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12252
+ --sidebar-item-height: var(--space-5);
12253
+ border-radius: var(--radius-3);
12254
+ }
12255
+ .rt-SidebarContent:where(.md\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12256
+ --sidebar-item-padding-left: var(--space-2);
12257
+ }
12258
+ .rt-SidebarContent:where(.md\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12259
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12260
+ }
12261
+ .rt-SidebarContent:where(.md\:rt-r-size-2) {
12262
+ --sidebar-content-padding: var(--space-2);
12263
+ --sidebar-item-padding-left: var(--space-3);
12264
+ --sidebar-item-padding-right: var(--space-3);
12265
+ --sidebar-item-padding-y: var(--space-1);
12266
+ --sidebar-item-height: var(--space-6);
12267
+ border-radius: var(--radius-4);
12268
+ }
12269
+ .rt-SidebarContent:where(.md\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12270
+ --sidebar-item-padding-left: var(--space-3);
12271
+ }
12272
+ .rt-SidebarContent:where(.md\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12273
+ --sidebar-item-padding-left: var(--space-5);
12274
+ }
12275
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
12276
+ font-size: var(--font-size-1);
12277
+ line-height: var(--line-height-1);
12278
+ letter-spacing: var(--letter-spacing-1);
12279
+ border-radius: var(--radius-1);
12280
+ }
12281
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
12282
+ width: var(--content-icon-size-1);
12283
+ height: var(--content-icon-size-1);
12284
+ flex-shrink: 0;
12285
+ }
12286
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
12287
+ width: var(--indicator-icon-size-1);
12288
+ height: var(--indicator-icon-size-1);
12289
+ flex-shrink: 0;
12290
+ margin-left: auto;
12291
+ }
12292
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
12293
+ font-size: var(--font-size-1);
12294
+ line-height: var(--line-height-1);
12295
+ letter-spacing: var(--letter-spacing-1);
12296
+ }
12297
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12298
+ font-size: var(--font-size-1);
12299
+ line-height: var(--line-height-1);
12300
+ letter-spacing: var(--letter-spacing-1);
12301
+ border-radius: var(--radius-1);
12302
+ }
12303
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12304
+ width: var(--content-icon-size-1);
12305
+ height: var(--content-icon-size-1);
12306
+ flex-shrink: 0;
12307
+ }
12308
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12309
+ font-size: var(--font-size-1);
12310
+ line-height: var(--line-height-1);
12311
+ letter-spacing: var(--letter-spacing-1);
12312
+ border-radius: var(--radius-1);
12313
+ }
12314
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12315
+ width: var(--content-icon-size-1);
12316
+ height: var(--content-icon-size-1);
12317
+ flex-shrink: 0;
12318
+ }
12319
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
12320
+ font-size: var(--font-size-2);
12321
+ line-height: var(--line-height-2);
12322
+ letter-spacing: var(--letter-spacing-2);
12323
+ border-radius: var(--radius-3);
12324
+ }
12325
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
12326
+ width: var(--content-icon-size-2);
12327
+ height: var(--content-icon-size-2);
12328
+ flex-shrink: 0;
12329
+ }
12330
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
12331
+ width: var(--indicator-icon-size-2);
12332
+ height: var(--indicator-icon-size-2);
12333
+ flex-shrink: 0;
12334
+ margin-left: auto;
12335
+ }
12336
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
12337
+ font-size: var(--font-size-2);
12338
+ line-height: var(--line-height-2);
12339
+ letter-spacing: var(--letter-spacing-2);
12340
+ }
12341
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12342
+ font-size: var(--font-size-2);
12343
+ line-height: var(--line-height-2);
12344
+ letter-spacing: var(--letter-spacing-2);
12345
+ border-radius: var(--radius-3);
12346
+ }
12347
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12348
+ width: var(--content-icon-size-2);
12349
+ height: var(--content-icon-size-2);
12350
+ flex-shrink: 0;
12351
+ }
12352
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12353
+ font-size: var(--font-size-2);
12354
+ line-height: var(--line-height-2);
12355
+ letter-spacing: var(--letter-spacing-2);
12356
+ border-radius: var(--radius-3);
12357
+ }
12358
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12359
+ width: var(--content-icon-size-2);
12360
+ height: var(--content-icon-size-2);
12361
+ flex-shrink: 0;
12362
+ }
12363
+ }
12364
+ @media (min-width: 1280px) {
12365
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) {
12366
+ --sidebar-base-padding: var(--space-3);
12367
+ --sidebar-content-padding: var(--space-1);
12368
+ --sidebar-item-padding-left: var(--space-2);
12369
+ --sidebar-item-padding-right: var(--space-2);
12370
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12371
+ --sidebar-item-height: var(--space-5);
12372
+ }
12373
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) {
12374
+ --sidebar-base-padding: var(--space-4);
12375
+ --sidebar-content-padding: var(--space-2);
12376
+ --sidebar-item-padding-left: var(--space-3);
12377
+ --sidebar-item-padding-right: var(--space-3);
12378
+ --sidebar-item-padding-y: var(--space-1);
12379
+ --sidebar-item-height: var(--space-6);
12380
+ }
12381
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) {
12382
+ --sidebar-content-padding: var(--space-1);
12383
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12384
+ --sidebar-item-padding-right: var(--space-2);
12385
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12386
+ --sidebar-item-height: var(--space-5);
12387
+ border-radius: var(--radius-3);
12388
+ }
12389
+ .rt-SidebarContent:where(.lg\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12390
+ --sidebar-item-padding-left: var(--space-2);
12391
+ }
12392
+ .rt-SidebarContent:where(.lg\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12393
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12394
+ }
12395
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) {
12396
+ --sidebar-content-padding: var(--space-2);
12397
+ --sidebar-item-padding-left: var(--space-3);
12398
+ --sidebar-item-padding-right: var(--space-3);
12399
+ --sidebar-item-padding-y: var(--space-1);
12400
+ --sidebar-item-height: var(--space-6);
12401
+ border-radius: var(--radius-4);
12402
+ }
12403
+ .rt-SidebarContent:where(.lg\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12404
+ --sidebar-item-padding-left: var(--space-3);
12405
+ }
12406
+ .rt-SidebarContent:where(.lg\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12407
+ --sidebar-item-padding-left: var(--space-5);
12408
+ }
12409
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
12410
+ font-size: var(--font-size-1);
12411
+ line-height: var(--line-height-1);
12412
+ letter-spacing: var(--letter-spacing-1);
12413
+ border-radius: var(--radius-1);
12414
+ }
12415
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
12416
+ width: var(--content-icon-size-1);
12417
+ height: var(--content-icon-size-1);
12418
+ flex-shrink: 0;
12419
+ }
12420
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
12421
+ width: var(--indicator-icon-size-1);
12422
+ height: var(--indicator-icon-size-1);
12423
+ flex-shrink: 0;
12424
+ margin-left: auto;
12425
+ }
12426
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
12427
+ font-size: var(--font-size-1);
12428
+ line-height: var(--line-height-1);
12429
+ letter-spacing: var(--letter-spacing-1);
12430
+ }
12431
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12432
+ font-size: var(--font-size-1);
12433
+ line-height: var(--line-height-1);
12434
+ letter-spacing: var(--letter-spacing-1);
12435
+ border-radius: var(--radius-1);
12436
+ }
12437
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12438
+ width: var(--content-icon-size-1);
12439
+ height: var(--content-icon-size-1);
12440
+ flex-shrink: 0;
12441
+ }
12442
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12443
+ font-size: var(--font-size-1);
12444
+ line-height: var(--line-height-1);
12445
+ letter-spacing: var(--letter-spacing-1);
12446
+ border-radius: var(--radius-1);
12447
+ }
12448
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12449
+ width: var(--content-icon-size-1);
12450
+ height: var(--content-icon-size-1);
12451
+ flex-shrink: 0;
12452
+ }
12453
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
12454
+ font-size: var(--font-size-2);
12455
+ line-height: var(--line-height-2);
12456
+ letter-spacing: var(--letter-spacing-2);
12457
+ border-radius: var(--radius-3);
12458
+ }
12459
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
12460
+ width: var(--content-icon-size-2);
12461
+ height: var(--content-icon-size-2);
12462
+ flex-shrink: 0;
12463
+ }
12464
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
12465
+ width: var(--indicator-icon-size-2);
12466
+ height: var(--indicator-icon-size-2);
12467
+ flex-shrink: 0;
12468
+ margin-left: auto;
12469
+ }
12470
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
12471
+ font-size: var(--font-size-2);
12472
+ line-height: var(--line-height-2);
12473
+ letter-spacing: var(--letter-spacing-2);
12474
+ }
12475
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12476
+ font-size: var(--font-size-2);
12477
+ line-height: var(--line-height-2);
12478
+ letter-spacing: var(--letter-spacing-2);
12479
+ border-radius: var(--radius-3);
12480
+ }
12481
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12482
+ width: var(--content-icon-size-2);
12483
+ height: var(--content-icon-size-2);
12484
+ flex-shrink: 0;
12485
+ }
12486
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12487
+ font-size: var(--font-size-2);
12488
+ line-height: var(--line-height-2);
12489
+ letter-spacing: var(--letter-spacing-2);
12490
+ border-radius: var(--radius-3);
12491
+ }
12492
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12493
+ width: var(--content-icon-size-2);
12494
+ height: var(--content-icon-size-2);
12495
+ flex-shrink: 0;
12496
+ }
12497
+ }
12498
+ @media (min-width: 1640px) {
12499
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) {
12500
+ --sidebar-base-padding: var(--space-3);
12501
+ --sidebar-content-padding: var(--space-1);
12502
+ --sidebar-item-padding-left: var(--space-2);
12503
+ --sidebar-item-padding-right: var(--space-2);
12504
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12505
+ --sidebar-item-height: var(--space-5);
12506
+ }
12507
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) {
12508
+ --sidebar-base-padding: var(--space-4);
12509
+ --sidebar-content-padding: var(--space-2);
12510
+ --sidebar-item-padding-left: var(--space-3);
12511
+ --sidebar-item-padding-right: var(--space-3);
12512
+ --sidebar-item-padding-y: var(--space-1);
12513
+ --sidebar-item-height: var(--space-6);
12514
+ }
12515
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) {
12516
+ --sidebar-content-padding: var(--space-1);
12517
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12518
+ --sidebar-item-padding-right: var(--space-2);
12519
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
12520
+ --sidebar-item-height: var(--space-5);
12521
+ border-radius: var(--radius-3);
12522
+ }
12523
+ .rt-SidebarContent:where(.xl\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12524
+ --sidebar-item-padding-left: var(--space-2);
12525
+ }
12526
+ .rt-SidebarContent:where(.xl\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12527
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
12528
+ }
12529
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) {
12530
+ --sidebar-content-padding: var(--space-2);
12531
+ --sidebar-item-padding-left: var(--space-3);
12532
+ --sidebar-item-padding-right: var(--space-3);
12533
+ --sidebar-item-padding-y: var(--space-1);
12534
+ --sidebar-item-height: var(--space-6);
12535
+ border-radius: var(--radius-4);
12536
+ }
12537
+ .rt-SidebarContent:where(.xl\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
12538
+ --sidebar-item-padding-left: var(--space-3);
12539
+ }
12540
+ .rt-SidebarContent:where(.xl\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
12541
+ --sidebar-item-padding-left: var(--space-5);
12542
+ }
12543
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
12544
+ font-size: var(--font-size-1);
12545
+ line-height: var(--line-height-1);
12546
+ letter-spacing: var(--letter-spacing-1);
12547
+ border-radius: var(--radius-1);
12548
+ }
12549
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
12550
+ width: var(--content-icon-size-1);
12551
+ height: var(--content-icon-size-1);
12552
+ flex-shrink: 0;
12553
+ }
12554
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
12555
+ width: var(--indicator-icon-size-1);
12556
+ height: var(--indicator-icon-size-1);
12557
+ flex-shrink: 0;
12558
+ margin-left: auto;
12559
+ }
12560
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
12561
+ font-size: var(--font-size-1);
12562
+ line-height: var(--line-height-1);
12563
+ letter-spacing: var(--letter-spacing-1);
12564
+ }
12565
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12566
+ font-size: var(--font-size-1);
12567
+ line-height: var(--line-height-1);
12568
+ letter-spacing: var(--letter-spacing-1);
12569
+ border-radius: var(--radius-1);
12570
+ }
12571
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12572
+ width: var(--content-icon-size-1);
12573
+ height: var(--content-icon-size-1);
12574
+ flex-shrink: 0;
12575
+ }
12576
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12577
+ font-size: var(--font-size-1);
12578
+ line-height: var(--line-height-1);
12579
+ letter-spacing: var(--letter-spacing-1);
12580
+ border-radius: var(--radius-1);
12581
+ }
12582
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12583
+ width: var(--content-icon-size-1);
12584
+ height: var(--content-icon-size-1);
12585
+ flex-shrink: 0;
12586
+ }
12587
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
12588
+ font-size: var(--font-size-2);
12589
+ line-height: var(--line-height-2);
12590
+ letter-spacing: var(--letter-spacing-2);
12591
+ border-radius: var(--radius-3);
12592
+ }
12593
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
12594
+ width: var(--content-icon-size-2);
12595
+ height: var(--content-icon-size-2);
12596
+ flex-shrink: 0;
12597
+ }
12598
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
12599
+ width: var(--indicator-icon-size-2);
12600
+ height: var(--indicator-icon-size-2);
12601
+ flex-shrink: 0;
12602
+ margin-left: auto;
12603
+ }
12604
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
12605
+ font-size: var(--font-size-2);
12606
+ line-height: var(--line-height-2);
12607
+ letter-spacing: var(--letter-spacing-2);
12608
+ }
12609
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
12610
+ font-size: var(--font-size-2);
12611
+ line-height: var(--line-height-2);
12612
+ letter-spacing: var(--letter-spacing-2);
12613
+ border-radius: var(--radius-3);
12614
+ }
12615
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
12616
+ width: var(--content-icon-size-2);
12617
+ height: var(--content-icon-size-2);
12618
+ flex-shrink: 0;
12619
+ }
12620
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
12621
+ font-size: var(--font-size-2);
12622
+ line-height: var(--line-height-2);
12623
+ letter-spacing: var(--letter-spacing-2);
12624
+ border-radius: var(--radius-3);
12625
+ }
12626
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
12627
+ width: var(--content-icon-size-2);
12628
+ height: var(--content-icon-size-2);
12629
+ flex-shrink: 0;
12630
+ }
12631
+ }
12632
+ .rt-SidebarContainer:where(.rt-variant-ghost) {
12633
+ background-color: transparent;
12634
+ -webkit-backdrop-filter: none;
12635
+ backdrop-filter: none;
12636
+ border: none;
12637
+ }
12638
+ .rt-SidebarContainer:where(.rt-variant-soft) {
12639
+ background-color: var(--accent-2);
12640
+ }
12641
+ :where([data-panel-background='translucent']) .rt-SidebarContainer:where(.rt-variant-soft) {
12642
+ background-color: var(--accent-a2);
12643
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
12644
+ backdrop-filter: var(--backdrop-filter-panel);
12645
+ }
12646
+ .rt-SidebarContainer:where(.rt-variant-soft):where([data-panel-background='solid']) {
12647
+ background-color: var(--accent-2);
12648
+ -webkit-backdrop-filter: none;
12649
+ backdrop-filter: none;
12650
+ --backdrop-filter-components: none;
12651
+ }
12652
+ .rt-SidebarContainer:where(.rt-variant-soft):where([data-panel-background='translucent']) {
12653
+ background-color: var(--accent-a2);
12654
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
12655
+ backdrop-filter: var(--backdrop-filter-panel);
12656
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
12657
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
12658
+ }
12659
+ :where(.rt-SidebarRoot[data-type="floating"]) .rt-SidebarContainer:where(.rt-variant-ghost) {
12660
+ box-shadow: var(--shadow-4);
12661
+ }
12662
+ .rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) {
12663
+ background-color: var(--accent-9);
12664
+ color: var(--accent-contrast);
12665
+ }
12666
+ .rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text) {
12667
+ color: inherit !important;
12668
+ }
12669
+ .rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']) {
12670
+ color: inherit !important;
12671
+ }
12672
+ .rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) {
12673
+ background-color: var(--accent-9);
12674
+ color: var(--accent-contrast);
12675
+ }
12676
+ .rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text) {
12677
+ color: inherit !important;
12678
+ }
12679
+ .rt-SidebarHeader:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']) {
12680
+ color: inherit !important;
12681
+ }
12682
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
12683
+ .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
12684
+ .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
12685
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]),
12686
+ .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]),
12687
+ .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) {
12688
+ background-color: var(--accent-12);
12689
+ color: var(--accent-1);
12690
+ }
12691
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text) {
12692
+ color: inherit !important;
12693
+ }
12694
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]) :where([data-accent-color='gray']), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) :where([data-accent-color='gray']) {
12695
+ color: inherit !important;
12696
+ }
12697
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) {
12698
+ background-color: var(--accent-9);
12699
+ color: var(--accent-contrast);
12700
+ }
12701
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where(.rt-Text), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where(.rt-Text) {
12702
+ color: inherit !important;
12703
+ }
12704
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where([data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]):where([data-accent-color]) :where([data-accent-color='gray']) {
12705
+ color: inherit !important;
12706
+ }
12707
+ .rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) {
12708
+ background-color: var(--accent-3);
12709
+ color: var(--accent-12);
12710
+ }
12711
+ :where([data-panel-background='translucent']) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where([data-panel-background='translucent']) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where([data-panel-background='translucent']) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])) {
12712
+ background-color: var(--accent-a3);
12713
+ color: var(--accent-a12);
12714
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
12715
+ backdrop-filter: var(--backdrop-filter-components);
12716
+ }
12717
+ :where(.rt-SidebarContainer[data-panel-background='solid']) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where(.rt-SidebarContainer[data-panel-background='solid']) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where(.rt-SidebarContainer[data-panel-background='solid']) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])) {
12718
+ background-color: var(--accent-3);
12719
+ color: var(--accent-12);
12720
+ -webkit-backdrop-filter: none;
12721
+ backdrop-filter: none;
12722
+ --backdrop-filter-components: none;
12723
+ }
12724
+ :where(.rt-SidebarContainer[data-panel-background='translucent']) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where(.rt-SidebarContainer[data-panel-background='translucent']) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where(.rt-SidebarContainer[data-panel-background='translucent']) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])) {
12725
+ background-color: var(--accent-a3);
12726
+ color: var(--accent-a12);
12727
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
12728
+ backdrop-filter: var(--backdrop-filter-components);
12729
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
12730
+ }
12731
+ :where(.rt-SidebarContainer.rt-variant-surface) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where(.rt-SidebarContainer.rt-variant-surface) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])), :where(.rt-SidebarContainer.rt-variant-surface) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active])) {
12732
+ -webkit-backdrop-filter: none;
12733
+ backdrop-filter: none;
12734
+ }
12735
+ .rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-active]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
12736
+ color: var(--gray-11) !important;
12737
+ }
12738
+ .rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) {
12739
+ background-color: var(--accent-3);
12740
+ }
12741
+ :where([data-panel-background='translucent']) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where([data-panel-background='translucent']) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where([data-panel-background='translucent']) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])) {
12742
+ background-color: var(--accent-a3);
12743
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
12744
+ backdrop-filter: var(--backdrop-filter-components);
12745
+ }
12746
+ :where(.rt-SidebarContainer[data-panel-background='solid']) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where(.rt-SidebarContainer[data-panel-background='solid']) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where(.rt-SidebarContainer[data-panel-background='solid']) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])) {
12747
+ background-color: var(--accent-3);
12748
+ -webkit-backdrop-filter: none;
12749
+ backdrop-filter: none;
12750
+ --backdrop-filter-components: none;
12751
+ }
12752
+ :where(.rt-SidebarContainer[data-panel-background='translucent']) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where(.rt-SidebarContainer[data-panel-background='translucent']) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where(.rt-SidebarContainer[data-panel-background='translucent']) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])) {
12753
+ background-color: var(--accent-a3);
12754
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
12755
+ backdrop-filter: var(--backdrop-filter-components);
12756
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
12757
+ }
12758
+ :where(.rt-SidebarContainer.rt-variant-surface) :is(.rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where(.rt-SidebarContainer.rt-variant-surface) :is(.rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])), :where(.rt-SidebarContainer.rt-variant-surface) :is(.rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted])) {
12759
+ -webkit-backdrop-filter: none;
12760
+ backdrop-filter: none;
12761
+ }
12762
+ .rt-SidebarHeader:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarContent:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']), .rt-SidebarFooter:where(.rt-menu-variant-soft) :where(.rt-SidebarMenuButton[data-highlighted]) :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
12763
+ color: var(--gray-11) !important;
12764
+ }
12765
+ .rt-SidebarContent :where(.rt-BaseMenuItem) {
12766
+ border-radius: var(--radius-2);
12767
+ margin-bottom: var(--space-1);
12768
+ }
12769
+ .rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) {
12770
+ transform: translateX(-100%);
12771
+ transition: transform var(--duration-3) var(--ease-2);
12772
+ }
12773
+ .rt-SidebarRoot:where([data-collapsible="icon"][data-state="expanded"]) {
12774
+ transform: translateX(0);
12775
+ transition: transform var(--duration-3) var(--ease-2);
12776
+ }
12777
+ .rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"][data-side="right"]) {
12778
+ transform: translateX(100%);
12779
+ }
12780
+ @media (prefers-reduced-motion: reduce) {
12781
+ .rt-SidebarRoot:where([data-collapsible="icon"]) {
12782
+ transition: none;
12783
+ }
12784
+ }
12785
+ @media (max-width: 768px) {
12786
+ .rt-SidebarRoot {
12787
+ display: none;
12788
+ }
12789
+ }
12790
+ :where(.rt-SidebarContent.rt-r-size-1) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
12791
+ padding-right: calc(var(--space-1) * 0.75);
12792
+ }
12793
+ :where(.rt-SidebarContent.rt-r-size-2) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
12794
+ padding-right: var(--space-1);
12795
+ }
12796
+ :where(.rt-SidebarContainer.rt-r-size-1) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
12797
+ padding-right: calc(var(--space-1) * 0.75);
12798
+ }
12799
+ :where(.rt-SidebarContainer.rt-r-size-2) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
12800
+ padding-right: var(--space-1);
12801
+ }
12802
+ .rt-SidebarMenuShortcut {
12803
+ display: flex;
12804
+ align-items: center;
12805
+ margin-left: auto;
12806
+ padding-left: var(--space-4);
12807
+ color: var(--gray-a11);
12808
+ }
12809
+ .rt-SidebarMenuBadge {
12810
+ display: flex;
12811
+ align-items: center;
12812
+ margin-left: auto;
12813
+ padding-left: var(--space-2);
12814
+ }
11398
12815
  .rt-SliderRoot {
11399
12816
  --slider-thumb-size: calc(var(--slider-track-size) + var(--space-1));
11400
12817
  position: relative;