@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/styles.css CHANGED
@@ -16221,6 +16221,1423 @@
16221
16221
  --separator-size: 100%;
16222
16222
  }
16223
16223
  }
16224
+ .rt-SidebarProvider:where([data-side="left"]) {
16225
+ order: -1;
16226
+ }
16227
+ .rt-SidebarProvider:where([data-side="right"]) {
16228
+ order: 999;
16229
+ }
16230
+ .rt-SidebarRoot {
16231
+ --sidebar-width: 16rem;
16232
+ --sidebar-base-border-radius: 0;
16233
+ width: var(--sidebar-width);
16234
+ height: 100%;
16235
+ flex-shrink: 0;
16236
+ display: flex;
16237
+ flex-direction: column;
16238
+ }
16239
+ .rt-SidebarRoot :where(.radix-themes) {
16240
+ display: flex;
16241
+ flex-direction: column;
16242
+ flex: 1;
16243
+ height: 100%;
16244
+ }
16245
+ .rt-SidebarRoot:where([data-type="floating"]) {
16246
+ border-radius: var(--sidebar-base-border-radius);
16247
+ margin: var(--space-2);
16248
+ height: calc(100% - var(--space-4));
16249
+ overflow: visible;
16250
+ position: relative;
16251
+ --sidebar-base-border-radius: var(--radius-5);
16252
+ }
16253
+ .rt-SidebarRoot:where([data-type="floating"]) :where(.radix-themes) {
16254
+ border-radius: inherit;
16255
+ }
16256
+ .rt-SidebarRoot:where([data-type="floating"]):where(.rt-r-size-1) {
16257
+ --sidebar-base-border-radius: var(--radius-5);
16258
+ }
16259
+ .rt-SidebarRoot:where([data-type="floating"]):where(.rt-r-size-2) {
16260
+ --sidebar-base-border-radius: var(--radius-6);
16261
+ }
16262
+ .rt-SidebarContainer {
16263
+ --sidebar-base-border-radius: 0;
16264
+ display: flex;
16265
+ flex-direction: column;
16266
+ height: 100%;
16267
+ width: 100%;
16268
+ background-color: var(--color-panel);
16269
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
16270
+ backdrop-filter: var(--backdrop-filter-panel);
16271
+ border-radius: inherit;
16272
+ flex: 1;
16273
+ }
16274
+ .rt-SidebarContainer:where(.rt-variant-surface) {
16275
+ background-color: var(--color-panel);
16276
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
16277
+ backdrop-filter: var(--backdrop-filter-panel);
16278
+ }
16279
+ .rt-SidebarContainer:where(.rt-variant-surface):where([data-panel-background='solid']) {
16280
+ --color-panel: var(--color-panel-solid);
16281
+ -webkit-backdrop-filter: none;
16282
+ backdrop-filter: none;
16283
+ --backdrop-filter-panel: none;
16284
+ --backdrop-filter-components: none;
16285
+ }
16286
+ .rt-SidebarContainer:where(.rt-variant-surface):where([data-panel-background='translucent']) {
16287
+ --color-panel: var(--color-panel-translucent);
16288
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
16289
+ backdrop-filter: var(--backdrop-filter-panel);
16290
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
16291
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
16292
+ }
16293
+ :where(.rt-SidebarRoot[data-type="floating"]) .rt-SidebarContainer:where(.rt-variant-surface) {
16294
+ box-shadow: inset 0 0 0 1px var(--gray-a6);
16295
+ }
16296
+ :where(.rt-SidebarRoot[data-type="sidebar"][data-side="left"]) .rt-SidebarContainer:where(.rt-variant-surface) {
16297
+ box-shadow: inset -1px 0 0 0 var(--gray-a6);
16298
+ }
16299
+ :where(.rt-SidebarRoot[data-type="sidebar"][data-side="right"]) .rt-SidebarContainer:where(.rt-variant-surface) {
16300
+ box-shadow: inset 1px 0 0 0 var(--gray-a6);
16301
+ }
16302
+ .rt-SidebarHeader {
16303
+ display: flex;
16304
+ flex-direction: column;
16305
+ flex-shrink: 0;
16306
+ border-radius: var(--sidebar-base-border-radius) var(--sidebar-base-border-radius) 0 0;
16307
+ }
16308
+ .rt-SidebarHeader :where(.rt-SidebarMenuButton) {
16309
+ display: flex;
16310
+ align-items: center;
16311
+ gap: var(--space-2);
16312
+ min-height: var(--sidebar-item-height);
16313
+ padding-top: var(--sidebar-item-padding-y);
16314
+ padding-bottom: var(--sidebar-item-padding-y);
16315
+ padding-left: var(--sidebar-item-padding-left);
16316
+ padding-right: var(--sidebar-item-padding-right);
16317
+ box-sizing: border-box;
16318
+ position: relative;
16319
+ outline: none;
16320
+ background: none;
16321
+ border: none;
16322
+ width: 100%;
16323
+ text-align: left;
16324
+ cursor: var(--cursor-menu-item);
16325
+ -webkit-user-select: none;
16326
+ user-select: none;
16327
+ justify-content: flex-start;
16328
+ border-radius: var(--sidebar-base-border-radius) var(--sidebar-base-border-radius) 0 0;
16329
+ transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
16330
+ }
16331
+ .rt-SidebarHeader :where(.rt-SidebarMenuButton):where(:focus-visible) {
16332
+ outline: 2px solid var(--focus-8);
16333
+ outline-offset: 2px;
16334
+ }
16335
+ @media (prefers-reduced-motion: reduce) {
16336
+ .rt-SidebarHeader :where(.rt-SidebarMenuButton) {
16337
+ transition: none;
16338
+ }
16339
+ }
16340
+ .rt-SidebarHeader:where(.rt-SidebarHeader--container) {
16341
+ display: flex;
16342
+ flex-direction: row;
16343
+ align-items: center;
16344
+ gap: var(--space-2);
16345
+ padding: var(--sidebar-content-padding);
16346
+ min-height: var(--sidebar-item-height);
16347
+ }
16348
+ .rt-SidebarHeader:where(.rt-SidebarHeader--container) :where(.rt-SidebarMenuButton) {
16349
+ flex: 1;
16350
+ }
16351
+ .rt-SidebarHeader:where(.rt-flex-row) {
16352
+ flex-direction: row;
16353
+ }
16354
+ .rt-SidebarHeader:where(.rt-flex-col) {
16355
+ flex-direction: column;
16356
+ }
16357
+ .rt-SidebarHeader:where(.rt-items-center) {
16358
+ align-items: center;
16359
+ }
16360
+ .rt-SidebarHeader:where(.rt-items-start) {
16361
+ align-items: flex-start;
16362
+ }
16363
+ .rt-SidebarHeader:where(.rt-items-end) {
16364
+ align-items: flex-end;
16365
+ }
16366
+ .rt-SidebarHeader:where(.rt-justify-between) {
16367
+ justify-content: space-between;
16368
+ }
16369
+ .rt-SidebarHeader:where(.rt-justify-center) {
16370
+ justify-content: center;
16371
+ }
16372
+ .rt-SidebarHeader:where(.rt-justify-start) {
16373
+ justify-content: flex-start;
16374
+ }
16375
+ .rt-SidebarHeader:where(.rt-justify-end) {
16376
+ justify-content: flex-end;
16377
+ }
16378
+ .rt-SidebarHeader:where(.rt-gap-1) {
16379
+ gap: var(--space-1);
16380
+ }
16381
+ .rt-SidebarHeader:where(.rt-gap-2) {
16382
+ gap: var(--space-2);
16383
+ }
16384
+ .rt-SidebarHeader:where(.rt-gap-3) {
16385
+ gap: var(--space-3);
16386
+ }
16387
+ .rt-SidebarHeader:where(.rt-gap-4) {
16388
+ gap: var(--space-4);
16389
+ }
16390
+ .rt-SidebarContent {
16391
+ --scrollarea-scrollbar-vertical-margin-top: var(--sidebar-content-padding);
16392
+ --scrollarea-scrollbar-vertical-margin-bottom: var(--sidebar-content-padding);
16393
+ --scrollarea-scrollbar-horizontal-margin-left: var(--sidebar-content-padding);
16394
+ --scrollarea-scrollbar-horizontal-margin-right: var(--sidebar-content-padding);
16395
+ display: flex;
16396
+ flex-direction: column;
16397
+ flex: 1;
16398
+ box-sizing: border-box;
16399
+ min-height: 0;
16400
+ }
16401
+ .rt-SidebarContent :where(.rt-ScrollAreaRoot) {
16402
+ flex: 1;
16403
+ display: flex;
16404
+ flex-direction: column;
16405
+ min-height: 0;
16406
+ }
16407
+ .rt-SidebarContent :where(.rt-ScrollAreaViewport) {
16408
+ flex: 1;
16409
+ display: flex;
16410
+ flex-direction: column;
16411
+ min-height: 0;
16412
+ }
16413
+ .rt-SidebarMenu {
16414
+ flex: 1;
16415
+ display: flex;
16416
+ flex-direction: column;
16417
+ gap: var(--space-2);
16418
+ padding: var(--sidebar-content-padding);
16419
+ box-sizing: border-box;
16420
+ list-style: none;
16421
+ margin: 0;
16422
+ min-height: 0;
16423
+ }
16424
+ :where(.rt-SidebarContent:has(.rt-ScrollAreaScrollbar[data-orientation='vertical'])) .rt-SidebarMenu {
16425
+ padding-right: var(--space-3);
16426
+ }
16427
+ .rt-SidebarMenuItem {
16428
+ list-style: none;
16429
+ }
16430
+ .rt-SidebarMenuButton {
16431
+ display: flex;
16432
+ align-items: center;
16433
+ gap: var(--space-2);
16434
+ min-height: var(--sidebar-item-height);
16435
+ padding-top: var(--sidebar-item-padding-y);
16436
+ padding-bottom: var(--sidebar-item-padding-y);
16437
+ padding-left: var(--sidebar-item-padding-left);
16438
+ padding-right: var(--sidebar-item-padding-right);
16439
+ box-sizing: border-box;
16440
+ position: relative;
16441
+ outline: none;
16442
+ scroll-margin: var(--sidebar-content-padding) 0;
16443
+ background: none;
16444
+ border: none;
16445
+ width: 100%;
16446
+ text-align: left;
16447
+ border-radius: var(--radius-2);
16448
+ transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
16449
+ -webkit-user-select: none;
16450
+ user-select: none;
16451
+ cursor: var(--cursor-menu-item);
16452
+ }
16453
+ .rt-SidebarMenuButton:where([data-disabled]) {
16454
+ cursor: default;
16455
+ color: var(--gray-a8);
16456
+ }
16457
+ .rt-SidebarMenuButton:where([data-active], .rt-active) {
16458
+ background-color: var(--accent-a3);
16459
+ color: var(--accent-a12);
16460
+ }
16461
+ .rt-SidebarMenuButton:where(:focus-visible) {
16462
+ outline: 2px solid var(--focus-8);
16463
+ outline-offset: 2px;
16464
+ }
16465
+ .rt-SidebarMenuButton:where([data-accent-color]) {
16466
+ color: var(--accent-a11);
16467
+ }
16468
+ .rt-SidebarMenuButton :where(.rt-Text[data-accent-color='gray'], [data-accent-color='gray']) {
16469
+ color: var(--gray-a10);
16470
+ }
16471
+ .rt-SidebarMenuButton:where([data-disabled], [data-highlighted], [data-active]) :where(.rt-SidebarMenuShortcut) {
16472
+ color: inherit;
16473
+ }
16474
+ @media (prefers-reduced-motion: reduce) {
16475
+ .rt-SidebarMenuButton {
16476
+ transition: none;
16477
+ }
16478
+ }
16479
+ .rt-SidebarMenuSubTrigger {
16480
+ justify-content: space-between;
16481
+ }
16482
+ .rt-SidebarMenuSubTrigger :where(.rt-SidebarMenuSubTriggerIcon) {
16483
+ transition: transform 0.2s ease;
16484
+ }
16485
+ .rt-SidebarMenuSubTrigger:where([data-state="open"]) :where(.rt-SidebarMenuSubTriggerIcon) {
16486
+ transform: rotate(90deg);
16487
+ }
16488
+ .rt-SidebarMenuSubContent {
16489
+ overflow: hidden;
16490
+ }
16491
+ .rt-SidebarMenuSubContent:where(:focus-within) {
16492
+ overflow: visible;
16493
+ }
16494
+ .rt-SidebarMenuSubContent:where([data-state="open"]) {
16495
+ animation: rt-sidebar-slide-down 200ms ease-out;
16496
+ }
16497
+ .rt-SidebarMenuSubContent:where([data-state="closed"]) {
16498
+ animation: rt-sidebar-slide-up 200ms ease-out;
16499
+ }
16500
+ @keyframes rt-sidebar-slide-down {
16501
+ from {
16502
+ height: 0;
16503
+ }
16504
+ to {
16505
+ height: var(--radix-accordion-content-height);
16506
+ }
16507
+ }
16508
+ @keyframes rt-sidebar-slide-up {
16509
+ from {
16510
+ height: var(--radix-accordion-content-height);
16511
+ }
16512
+ to {
16513
+ height: 0;
16514
+ }
16515
+ }
16516
+ .rt-SidebarMenuSubList {
16517
+ padding-left: var(--space-4);
16518
+ border-left: 1px solid var(--gray-a5);
16519
+ margin-left: var(--space-3);
16520
+ }
16521
+ :where(.rt-SidebarContent.rt-r-size-1) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton {
16522
+ padding-left: var(--space-3);
16523
+ padding-top: calc(var(--space-1) * 0.75);
16524
+ padding-bottom: calc(var(--space-1) * 0.75);
16525
+ min-height: var(--space-5);
16526
+ font-size: var(--font-size-1);
16527
+ }
16528
+ :where(.rt-SidebarContent.rt-r-size-2) :where(.rt-SidebarMenuSubList) .rt-SidebarMenuButton {
16529
+ padding-left: var(--space-3);
16530
+ padding-top: var(--space-1);
16531
+ padding-bottom: var(--space-1);
16532
+ min-height: var(--space-6);
16533
+ font-size: var(--font-size-2);
16534
+ }
16535
+ .rt-SidebarFooter {
16536
+ display: flex;
16537
+ flex-direction: column;
16538
+ flex-shrink: 0;
16539
+ margin-top: auto;
16540
+ border-radius: 0 0 var(--sidebar-base-border-radius) var(--sidebar-base-border-radius);
16541
+ }
16542
+ .rt-SidebarFooter :where(.rt-SidebarMenuButton) {
16543
+ display: flex;
16544
+ align-items: center;
16545
+ gap: var(--space-2);
16546
+ min-height: var(--sidebar-item-height);
16547
+ padding-top: var(--sidebar-item-padding-y);
16548
+ padding-bottom: var(--sidebar-item-padding-y);
16549
+ padding-left: var(--sidebar-item-padding-left);
16550
+ padding-right: var(--sidebar-item-padding-right);
16551
+ box-sizing: border-box;
16552
+ position: relative;
16553
+ outline: none;
16554
+ background: none;
16555
+ border: none;
16556
+ width: 100%;
16557
+ text-align: left;
16558
+ cursor: var(--cursor-menu-item);
16559
+ -webkit-user-select: none;
16560
+ user-select: none;
16561
+ justify-content: flex-start;
16562
+ border-radius: 0 0 var(--sidebar-base-border-radius) var(--sidebar-base-border-radius);
16563
+ transition: background var(--duration-2) var(--ease-1), box-shadow var(--duration-2) var(--ease-1), filter var(--duration-2) var(--ease-1);
16564
+ }
16565
+ .rt-SidebarFooter :where(.rt-SidebarMenuButton):where(:focus-visible) {
16566
+ outline: 2px solid var(--focus-8);
16567
+ outline-offset: 2px;
16568
+ }
16569
+ @media (prefers-reduced-motion: reduce) {
16570
+ .rt-SidebarFooter :where(.rt-SidebarMenuButton) {
16571
+ transition: none;
16572
+ }
16573
+ }
16574
+ .rt-SidebarFooter:where(.rt-SidebarFooter--container) {
16575
+ display: flex;
16576
+ flex-direction: row;
16577
+ align-items: center;
16578
+ gap: var(--space-2);
16579
+ padding: var(--sidebar-content-padding);
16580
+ min-height: var(--sidebar-item-height);
16581
+ }
16582
+ .rt-SidebarFooter:where(.rt-SidebarFooter--container) :where(.rt-SidebarMenuButton) {
16583
+ flex: 1;
16584
+ }
16585
+ .rt-SidebarFooter:where(.rt-flex-row) {
16586
+ flex-direction: row;
16587
+ }
16588
+ .rt-SidebarFooter:where(.rt-flex-col) {
16589
+ flex-direction: column;
16590
+ }
16591
+ .rt-SidebarFooter:where(.rt-items-center) {
16592
+ align-items: center;
16593
+ }
16594
+ .rt-SidebarFooter:where(.rt-items-start) {
16595
+ align-items: flex-start;
16596
+ }
16597
+ .rt-SidebarFooter:where(.rt-items-end) {
16598
+ align-items: flex-end;
16599
+ }
16600
+ .rt-SidebarFooter:where(.rt-justify-between) {
16601
+ justify-content: space-between;
16602
+ }
16603
+ .rt-SidebarFooter:where(.rt-justify-center) {
16604
+ justify-content: center;
16605
+ }
16606
+ .rt-SidebarFooter:where(.rt-justify-start) {
16607
+ justify-content: flex-start;
16608
+ }
16609
+ .rt-SidebarFooter:where(.rt-justify-end) {
16610
+ justify-content: flex-end;
16611
+ }
16612
+ .rt-SidebarFooter:where(.rt-gap-1) {
16613
+ gap: var(--space-1);
16614
+ }
16615
+ .rt-SidebarFooter:where(.rt-gap-2) {
16616
+ gap: var(--space-2);
16617
+ }
16618
+ .rt-SidebarFooter:where(.rt-gap-3) {
16619
+ gap: var(--space-3);
16620
+ }
16621
+ .rt-SidebarFooter:where(.rt-gap-4) {
16622
+ gap: var(--space-4);
16623
+ }
16624
+ .rt-SidebarSeparator {
16625
+ width: 100%;
16626
+ margin: var(--space-2) 0;
16627
+ }
16628
+ .rt-SidebarGroup {
16629
+ display: flex;
16630
+ flex-direction: column;
16631
+ flex-shrink: 0;
16632
+ }
16633
+ .rt-SidebarGroup:where(:not(:first-child)) {
16634
+ margin-top: var(--space-4);
16635
+ }
16636
+ .rt-SidebarGroupLabel {
16637
+ display: flex;
16638
+ align-items: center;
16639
+ min-height: var(--sidebar-item-height);
16640
+ padding-top: var(--sidebar-item-padding-y);
16641
+ padding-bottom: var(--sidebar-item-padding-y);
16642
+ padding-left: var(--sidebar-item-padding-left);
16643
+ padding-right: var(--sidebar-item-padding-right);
16644
+ box-sizing: border-box;
16645
+ color: var(--gray-a10);
16646
+ -webkit-user-select: none;
16647
+ user-select: none;
16648
+ cursor: default;
16649
+ flex-shrink: 0;
16650
+ }
16651
+ .rt-SidebarGroupContent {
16652
+ display: flex;
16653
+ flex-direction: column;
16654
+ flex-shrink: 0;
16655
+ }
16656
+ .rt-SidebarContainer:where(.rt-r-size-1) {
16657
+ --sidebar-base-padding: var(--space-3);
16658
+ --sidebar-content-padding: var(--space-1);
16659
+ --sidebar-item-padding-left: var(--space-2);
16660
+ --sidebar-item-padding-right: var(--space-2);
16661
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
16662
+ --sidebar-item-height: var(--space-5);
16663
+ }
16664
+ .rt-SidebarContainer:where(.rt-r-size-2) {
16665
+ --sidebar-base-padding: var(--space-4);
16666
+ --sidebar-content-padding: var(--space-2);
16667
+ --sidebar-item-padding-left: var(--space-3);
16668
+ --sidebar-item-padding-right: var(--space-3);
16669
+ --sidebar-item-padding-y: var(--space-1);
16670
+ --sidebar-item-height: var(--space-6);
16671
+ }
16672
+ .rt-SidebarContent:where(.rt-r-size-1) {
16673
+ --sidebar-content-padding: var(--space-1);
16674
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
16675
+ --sidebar-item-padding-right: var(--space-2);
16676
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
16677
+ --sidebar-item-height: var(--space-5);
16678
+ border-radius: var(--radius-3);
16679
+ }
16680
+ .rt-SidebarContent:where(.rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
16681
+ --sidebar-item-padding-left: var(--space-2);
16682
+ }
16683
+ .rt-SidebarContent:where(.rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
16684
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
16685
+ }
16686
+ .rt-SidebarContent:where(.rt-r-size-2) {
16687
+ --sidebar-content-padding: var(--space-2);
16688
+ --sidebar-item-padding-left: var(--space-3);
16689
+ --sidebar-item-padding-right: var(--space-3);
16690
+ --sidebar-item-padding-y: var(--space-1);
16691
+ --sidebar-item-height: var(--space-6);
16692
+ border-radius: var(--radius-4);
16693
+ }
16694
+ .rt-SidebarContent:where(.rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
16695
+ --sidebar-item-padding-left: var(--space-3);
16696
+ }
16697
+ .rt-SidebarContent:where(.rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
16698
+ --sidebar-item-padding-left: var(--space-5);
16699
+ }
16700
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) {
16701
+ font-size: var(--font-size-1);
16702
+ line-height: var(--line-height-1);
16703
+ letter-spacing: var(--letter-spacing-1);
16704
+ border-radius: var(--radius-1);
16705
+ }
16706
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
16707
+ width: var(--content-icon-size-1);
16708
+ height: var(--content-icon-size-1);
16709
+ flex-shrink: 0;
16710
+ }
16711
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
16712
+ width: var(--indicator-icon-size-1);
16713
+ height: var(--indicator-icon-size-1);
16714
+ flex-shrink: 0;
16715
+ margin-left: auto;
16716
+ }
16717
+ .rt-SidebarContent:where(.rt-r-size-1) :where(.rt-SidebarGroupLabel) {
16718
+ font-size: var(--font-size-1);
16719
+ line-height: var(--line-height-1);
16720
+ letter-spacing: var(--letter-spacing-1);
16721
+ }
16722
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
16723
+ font-size: var(--font-size-1);
16724
+ line-height: var(--line-height-1);
16725
+ letter-spacing: var(--letter-spacing-1);
16726
+ border-radius: var(--radius-1);
16727
+ }
16728
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
16729
+ width: var(--content-icon-size-1);
16730
+ height: var(--content-icon-size-1);
16731
+ flex-shrink: 0;
16732
+ }
16733
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
16734
+ font-size: var(--font-size-1);
16735
+ line-height: var(--line-height-1);
16736
+ letter-spacing: var(--letter-spacing-1);
16737
+ border-radius: var(--radius-1);
16738
+ }
16739
+ .rt-SidebarContainer:where(.rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
16740
+ width: var(--content-icon-size-1);
16741
+ height: var(--content-icon-size-1);
16742
+ flex-shrink: 0;
16743
+ }
16744
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) {
16745
+ font-size: var(--font-size-2);
16746
+ line-height: var(--line-height-2);
16747
+ letter-spacing: var(--letter-spacing-2);
16748
+ border-radius: var(--radius-3);
16749
+ }
16750
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
16751
+ width: var(--content-icon-size-2);
16752
+ height: var(--content-icon-size-2);
16753
+ flex-shrink: 0;
16754
+ }
16755
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
16756
+ width: var(--indicator-icon-size-2);
16757
+ height: var(--indicator-icon-size-2);
16758
+ flex-shrink: 0;
16759
+ margin-left: auto;
16760
+ }
16761
+ .rt-SidebarContent:where(.rt-r-size-2) :where(.rt-SidebarGroupLabel) {
16762
+ font-size: var(--font-size-2);
16763
+ line-height: var(--line-height-2);
16764
+ letter-spacing: var(--letter-spacing-2);
16765
+ }
16766
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
16767
+ font-size: var(--font-size-2);
16768
+ line-height: var(--line-height-2);
16769
+ letter-spacing: var(--letter-spacing-2);
16770
+ border-radius: var(--radius-3);
16771
+ }
16772
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
16773
+ width: var(--content-icon-size-2);
16774
+ height: var(--content-icon-size-2);
16775
+ flex-shrink: 0;
16776
+ }
16777
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
16778
+ font-size: var(--font-size-2);
16779
+ line-height: var(--line-height-2);
16780
+ letter-spacing: var(--letter-spacing-2);
16781
+ border-radius: var(--radius-3);
16782
+ }
16783
+ .rt-SidebarContainer:where(.rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
16784
+ width: var(--content-icon-size-2);
16785
+ height: var(--content-icon-size-2);
16786
+ flex-shrink: 0;
16787
+ }
16788
+ @media (min-width: 520px) {
16789
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) {
16790
+ --sidebar-base-padding: var(--space-3);
16791
+ --sidebar-content-padding: var(--space-1);
16792
+ --sidebar-item-padding-left: var(--space-2);
16793
+ --sidebar-item-padding-right: var(--space-2);
16794
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
16795
+ --sidebar-item-height: var(--space-5);
16796
+ }
16797
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) {
16798
+ --sidebar-base-padding: var(--space-4);
16799
+ --sidebar-content-padding: var(--space-2);
16800
+ --sidebar-item-padding-left: var(--space-3);
16801
+ --sidebar-item-padding-right: var(--space-3);
16802
+ --sidebar-item-padding-y: var(--space-1);
16803
+ --sidebar-item-height: var(--space-6);
16804
+ }
16805
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) {
16806
+ --sidebar-content-padding: var(--space-1);
16807
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
16808
+ --sidebar-item-padding-right: var(--space-2);
16809
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
16810
+ --sidebar-item-height: var(--space-5);
16811
+ border-radius: var(--radius-3);
16812
+ }
16813
+ .rt-SidebarContent:where(.xs\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
16814
+ --sidebar-item-padding-left: var(--space-2);
16815
+ }
16816
+ .rt-SidebarContent:where(.xs\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
16817
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
16818
+ }
16819
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) {
16820
+ --sidebar-content-padding: var(--space-2);
16821
+ --sidebar-item-padding-left: var(--space-3);
16822
+ --sidebar-item-padding-right: var(--space-3);
16823
+ --sidebar-item-padding-y: var(--space-1);
16824
+ --sidebar-item-height: var(--space-6);
16825
+ border-radius: var(--radius-4);
16826
+ }
16827
+ .rt-SidebarContent:where(.xs\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
16828
+ --sidebar-item-padding-left: var(--space-3);
16829
+ }
16830
+ .rt-SidebarContent:where(.xs\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
16831
+ --sidebar-item-padding-left: var(--space-5);
16832
+ }
16833
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
16834
+ font-size: var(--font-size-1);
16835
+ line-height: var(--line-height-1);
16836
+ letter-spacing: var(--letter-spacing-1);
16837
+ border-radius: var(--radius-1);
16838
+ }
16839
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
16840
+ width: var(--content-icon-size-1);
16841
+ height: var(--content-icon-size-1);
16842
+ flex-shrink: 0;
16843
+ }
16844
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
16845
+ width: var(--indicator-icon-size-1);
16846
+ height: var(--indicator-icon-size-1);
16847
+ flex-shrink: 0;
16848
+ margin-left: auto;
16849
+ }
16850
+ .rt-SidebarContent:where(.xs\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
16851
+ font-size: var(--font-size-1);
16852
+ line-height: var(--line-height-1);
16853
+ letter-spacing: var(--letter-spacing-1);
16854
+ }
16855
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
16856
+ font-size: var(--font-size-1);
16857
+ line-height: var(--line-height-1);
16858
+ letter-spacing: var(--letter-spacing-1);
16859
+ border-radius: var(--radius-1);
16860
+ }
16861
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
16862
+ width: var(--content-icon-size-1);
16863
+ height: var(--content-icon-size-1);
16864
+ flex-shrink: 0;
16865
+ }
16866
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
16867
+ font-size: var(--font-size-1);
16868
+ line-height: var(--line-height-1);
16869
+ letter-spacing: var(--letter-spacing-1);
16870
+ border-radius: var(--radius-1);
16871
+ }
16872
+ .rt-SidebarContainer:where(.xs\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
16873
+ width: var(--content-icon-size-1);
16874
+ height: var(--content-icon-size-1);
16875
+ flex-shrink: 0;
16876
+ }
16877
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
16878
+ font-size: var(--font-size-2);
16879
+ line-height: var(--line-height-2);
16880
+ letter-spacing: var(--letter-spacing-2);
16881
+ border-radius: var(--radius-3);
16882
+ }
16883
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
16884
+ width: var(--content-icon-size-2);
16885
+ height: var(--content-icon-size-2);
16886
+ flex-shrink: 0;
16887
+ }
16888
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
16889
+ width: var(--indicator-icon-size-2);
16890
+ height: var(--indicator-icon-size-2);
16891
+ flex-shrink: 0;
16892
+ margin-left: auto;
16893
+ }
16894
+ .rt-SidebarContent:where(.xs\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
16895
+ font-size: var(--font-size-2);
16896
+ line-height: var(--line-height-2);
16897
+ letter-spacing: var(--letter-spacing-2);
16898
+ }
16899
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
16900
+ font-size: var(--font-size-2);
16901
+ line-height: var(--line-height-2);
16902
+ letter-spacing: var(--letter-spacing-2);
16903
+ border-radius: var(--radius-3);
16904
+ }
16905
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
16906
+ width: var(--content-icon-size-2);
16907
+ height: var(--content-icon-size-2);
16908
+ flex-shrink: 0;
16909
+ }
16910
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
16911
+ font-size: var(--font-size-2);
16912
+ line-height: var(--line-height-2);
16913
+ letter-spacing: var(--letter-spacing-2);
16914
+ border-radius: var(--radius-3);
16915
+ }
16916
+ .rt-SidebarContainer:where(.xs\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
16917
+ width: var(--content-icon-size-2);
16918
+ height: var(--content-icon-size-2);
16919
+ flex-shrink: 0;
16920
+ }
16921
+ }
16922
+ @media (min-width: 768px) {
16923
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) {
16924
+ --sidebar-base-padding: var(--space-3);
16925
+ --sidebar-content-padding: var(--space-1);
16926
+ --sidebar-item-padding-left: var(--space-2);
16927
+ --sidebar-item-padding-right: var(--space-2);
16928
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
16929
+ --sidebar-item-height: var(--space-5);
16930
+ }
16931
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) {
16932
+ --sidebar-base-padding: var(--space-4);
16933
+ --sidebar-content-padding: var(--space-2);
16934
+ --sidebar-item-padding-left: var(--space-3);
16935
+ --sidebar-item-padding-right: var(--space-3);
16936
+ --sidebar-item-padding-y: var(--space-1);
16937
+ --sidebar-item-height: var(--space-6);
16938
+ }
16939
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) {
16940
+ --sidebar-content-padding: var(--space-1);
16941
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
16942
+ --sidebar-item-padding-right: var(--space-2);
16943
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
16944
+ --sidebar-item-height: var(--space-5);
16945
+ border-radius: var(--radius-3);
16946
+ }
16947
+ .rt-SidebarContent:where(.sm\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
16948
+ --sidebar-item-padding-left: var(--space-2);
16949
+ }
16950
+ .rt-SidebarContent:where(.sm\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
16951
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
16952
+ }
16953
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) {
16954
+ --sidebar-content-padding: var(--space-2);
16955
+ --sidebar-item-padding-left: var(--space-3);
16956
+ --sidebar-item-padding-right: var(--space-3);
16957
+ --sidebar-item-padding-y: var(--space-1);
16958
+ --sidebar-item-height: var(--space-6);
16959
+ border-radius: var(--radius-4);
16960
+ }
16961
+ .rt-SidebarContent:where(.sm\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
16962
+ --sidebar-item-padding-left: var(--space-3);
16963
+ }
16964
+ .rt-SidebarContent:where(.sm\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
16965
+ --sidebar-item-padding-left: var(--space-5);
16966
+ }
16967
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
16968
+ font-size: var(--font-size-1);
16969
+ line-height: var(--line-height-1);
16970
+ letter-spacing: var(--letter-spacing-1);
16971
+ border-radius: var(--radius-1);
16972
+ }
16973
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
16974
+ width: var(--content-icon-size-1);
16975
+ height: var(--content-icon-size-1);
16976
+ flex-shrink: 0;
16977
+ }
16978
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
16979
+ width: var(--indicator-icon-size-1);
16980
+ height: var(--indicator-icon-size-1);
16981
+ flex-shrink: 0;
16982
+ margin-left: auto;
16983
+ }
16984
+ .rt-SidebarContent:where(.sm\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
16985
+ font-size: var(--font-size-1);
16986
+ line-height: var(--line-height-1);
16987
+ letter-spacing: var(--letter-spacing-1);
16988
+ }
16989
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
16990
+ font-size: var(--font-size-1);
16991
+ line-height: var(--line-height-1);
16992
+ letter-spacing: var(--letter-spacing-1);
16993
+ border-radius: var(--radius-1);
16994
+ }
16995
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
16996
+ width: var(--content-icon-size-1);
16997
+ height: var(--content-icon-size-1);
16998
+ flex-shrink: 0;
16999
+ }
17000
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17001
+ font-size: var(--font-size-1);
17002
+ line-height: var(--line-height-1);
17003
+ letter-spacing: var(--letter-spacing-1);
17004
+ border-radius: var(--radius-1);
17005
+ }
17006
+ .rt-SidebarContainer:where(.sm\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17007
+ width: var(--content-icon-size-1);
17008
+ height: var(--content-icon-size-1);
17009
+ flex-shrink: 0;
17010
+ }
17011
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
17012
+ font-size: var(--font-size-2);
17013
+ line-height: var(--line-height-2);
17014
+ letter-spacing: var(--letter-spacing-2);
17015
+ border-radius: var(--radius-3);
17016
+ }
17017
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
17018
+ width: var(--content-icon-size-2);
17019
+ height: var(--content-icon-size-2);
17020
+ flex-shrink: 0;
17021
+ }
17022
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
17023
+ width: var(--indicator-icon-size-2);
17024
+ height: var(--indicator-icon-size-2);
17025
+ flex-shrink: 0;
17026
+ margin-left: auto;
17027
+ }
17028
+ .rt-SidebarContent:where(.sm\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
17029
+ font-size: var(--font-size-2);
17030
+ line-height: var(--line-height-2);
17031
+ letter-spacing: var(--letter-spacing-2);
17032
+ }
17033
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17034
+ font-size: var(--font-size-2);
17035
+ line-height: var(--line-height-2);
17036
+ letter-spacing: var(--letter-spacing-2);
17037
+ border-radius: var(--radius-3);
17038
+ }
17039
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17040
+ width: var(--content-icon-size-2);
17041
+ height: var(--content-icon-size-2);
17042
+ flex-shrink: 0;
17043
+ }
17044
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17045
+ font-size: var(--font-size-2);
17046
+ line-height: var(--line-height-2);
17047
+ letter-spacing: var(--letter-spacing-2);
17048
+ border-radius: var(--radius-3);
17049
+ }
17050
+ .rt-SidebarContainer:where(.sm\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17051
+ width: var(--content-icon-size-2);
17052
+ height: var(--content-icon-size-2);
17053
+ flex-shrink: 0;
17054
+ }
17055
+ }
17056
+ @media (min-width: 1024px) {
17057
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) {
17058
+ --sidebar-base-padding: var(--space-3);
17059
+ --sidebar-content-padding: var(--space-1);
17060
+ --sidebar-item-padding-left: var(--space-2);
17061
+ --sidebar-item-padding-right: var(--space-2);
17062
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
17063
+ --sidebar-item-height: var(--space-5);
17064
+ }
17065
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) {
17066
+ --sidebar-base-padding: var(--space-4);
17067
+ --sidebar-content-padding: var(--space-2);
17068
+ --sidebar-item-padding-left: var(--space-3);
17069
+ --sidebar-item-padding-right: var(--space-3);
17070
+ --sidebar-item-padding-y: var(--space-1);
17071
+ --sidebar-item-height: var(--space-6);
17072
+ }
17073
+ .rt-SidebarContent:where(.md\:rt-r-size-1) {
17074
+ --sidebar-content-padding: var(--space-1);
17075
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
17076
+ --sidebar-item-padding-right: var(--space-2);
17077
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
17078
+ --sidebar-item-height: var(--space-5);
17079
+ border-radius: var(--radius-3);
17080
+ }
17081
+ .rt-SidebarContent:where(.md\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
17082
+ --sidebar-item-padding-left: var(--space-2);
17083
+ }
17084
+ .rt-SidebarContent:where(.md\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
17085
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
17086
+ }
17087
+ .rt-SidebarContent:where(.md\:rt-r-size-2) {
17088
+ --sidebar-content-padding: var(--space-2);
17089
+ --sidebar-item-padding-left: var(--space-3);
17090
+ --sidebar-item-padding-right: var(--space-3);
17091
+ --sidebar-item-padding-y: var(--space-1);
17092
+ --sidebar-item-height: var(--space-6);
17093
+ border-radius: var(--radius-4);
17094
+ }
17095
+ .rt-SidebarContent:where(.md\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
17096
+ --sidebar-item-padding-left: var(--space-3);
17097
+ }
17098
+ .rt-SidebarContent:where(.md\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
17099
+ --sidebar-item-padding-left: var(--space-5);
17100
+ }
17101
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
17102
+ font-size: var(--font-size-1);
17103
+ line-height: var(--line-height-1);
17104
+ letter-spacing: var(--letter-spacing-1);
17105
+ border-radius: var(--radius-1);
17106
+ }
17107
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
17108
+ width: var(--content-icon-size-1);
17109
+ height: var(--content-icon-size-1);
17110
+ flex-shrink: 0;
17111
+ }
17112
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
17113
+ width: var(--indicator-icon-size-1);
17114
+ height: var(--indicator-icon-size-1);
17115
+ flex-shrink: 0;
17116
+ margin-left: auto;
17117
+ }
17118
+ .rt-SidebarContent:where(.md\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
17119
+ font-size: var(--font-size-1);
17120
+ line-height: var(--line-height-1);
17121
+ letter-spacing: var(--letter-spacing-1);
17122
+ }
17123
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17124
+ font-size: var(--font-size-1);
17125
+ line-height: var(--line-height-1);
17126
+ letter-spacing: var(--letter-spacing-1);
17127
+ border-radius: var(--radius-1);
17128
+ }
17129
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17130
+ width: var(--content-icon-size-1);
17131
+ height: var(--content-icon-size-1);
17132
+ flex-shrink: 0;
17133
+ }
17134
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17135
+ font-size: var(--font-size-1);
17136
+ line-height: var(--line-height-1);
17137
+ letter-spacing: var(--letter-spacing-1);
17138
+ border-radius: var(--radius-1);
17139
+ }
17140
+ .rt-SidebarContainer:where(.md\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17141
+ width: var(--content-icon-size-1);
17142
+ height: var(--content-icon-size-1);
17143
+ flex-shrink: 0;
17144
+ }
17145
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
17146
+ font-size: var(--font-size-2);
17147
+ line-height: var(--line-height-2);
17148
+ letter-spacing: var(--letter-spacing-2);
17149
+ border-radius: var(--radius-3);
17150
+ }
17151
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
17152
+ width: var(--content-icon-size-2);
17153
+ height: var(--content-icon-size-2);
17154
+ flex-shrink: 0;
17155
+ }
17156
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
17157
+ width: var(--indicator-icon-size-2);
17158
+ height: var(--indicator-icon-size-2);
17159
+ flex-shrink: 0;
17160
+ margin-left: auto;
17161
+ }
17162
+ .rt-SidebarContent:where(.md\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
17163
+ font-size: var(--font-size-2);
17164
+ line-height: var(--line-height-2);
17165
+ letter-spacing: var(--letter-spacing-2);
17166
+ }
17167
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17168
+ font-size: var(--font-size-2);
17169
+ line-height: var(--line-height-2);
17170
+ letter-spacing: var(--letter-spacing-2);
17171
+ border-radius: var(--radius-3);
17172
+ }
17173
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17174
+ width: var(--content-icon-size-2);
17175
+ height: var(--content-icon-size-2);
17176
+ flex-shrink: 0;
17177
+ }
17178
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17179
+ font-size: var(--font-size-2);
17180
+ line-height: var(--line-height-2);
17181
+ letter-spacing: var(--letter-spacing-2);
17182
+ border-radius: var(--radius-3);
17183
+ }
17184
+ .rt-SidebarContainer:where(.md\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17185
+ width: var(--content-icon-size-2);
17186
+ height: var(--content-icon-size-2);
17187
+ flex-shrink: 0;
17188
+ }
17189
+ }
17190
+ @media (min-width: 1280px) {
17191
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) {
17192
+ --sidebar-base-padding: var(--space-3);
17193
+ --sidebar-content-padding: var(--space-1);
17194
+ --sidebar-item-padding-left: var(--space-2);
17195
+ --sidebar-item-padding-right: var(--space-2);
17196
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
17197
+ --sidebar-item-height: var(--space-5);
17198
+ }
17199
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) {
17200
+ --sidebar-base-padding: var(--space-4);
17201
+ --sidebar-content-padding: var(--space-2);
17202
+ --sidebar-item-padding-left: var(--space-3);
17203
+ --sidebar-item-padding-right: var(--space-3);
17204
+ --sidebar-item-padding-y: var(--space-1);
17205
+ --sidebar-item-height: var(--space-6);
17206
+ }
17207
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) {
17208
+ --sidebar-content-padding: var(--space-1);
17209
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
17210
+ --sidebar-item-padding-right: var(--space-2);
17211
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
17212
+ --sidebar-item-height: var(--space-5);
17213
+ border-radius: var(--radius-3);
17214
+ }
17215
+ .rt-SidebarContent:where(.lg\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
17216
+ --sidebar-item-padding-left: var(--space-2);
17217
+ }
17218
+ .rt-SidebarContent:where(.lg\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
17219
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
17220
+ }
17221
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) {
17222
+ --sidebar-content-padding: var(--space-2);
17223
+ --sidebar-item-padding-left: var(--space-3);
17224
+ --sidebar-item-padding-right: var(--space-3);
17225
+ --sidebar-item-padding-y: var(--space-1);
17226
+ --sidebar-item-height: var(--space-6);
17227
+ border-radius: var(--radius-4);
17228
+ }
17229
+ .rt-SidebarContent:where(.lg\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
17230
+ --sidebar-item-padding-left: var(--space-3);
17231
+ }
17232
+ .rt-SidebarContent:where(.lg\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
17233
+ --sidebar-item-padding-left: var(--space-5);
17234
+ }
17235
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
17236
+ font-size: var(--font-size-1);
17237
+ line-height: var(--line-height-1);
17238
+ letter-spacing: var(--letter-spacing-1);
17239
+ border-radius: var(--radius-1);
17240
+ }
17241
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
17242
+ width: var(--content-icon-size-1);
17243
+ height: var(--content-icon-size-1);
17244
+ flex-shrink: 0;
17245
+ }
17246
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
17247
+ width: var(--indicator-icon-size-1);
17248
+ height: var(--indicator-icon-size-1);
17249
+ flex-shrink: 0;
17250
+ margin-left: auto;
17251
+ }
17252
+ .rt-SidebarContent:where(.lg\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
17253
+ font-size: var(--font-size-1);
17254
+ line-height: var(--line-height-1);
17255
+ letter-spacing: var(--letter-spacing-1);
17256
+ }
17257
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17258
+ font-size: var(--font-size-1);
17259
+ line-height: var(--line-height-1);
17260
+ letter-spacing: var(--letter-spacing-1);
17261
+ border-radius: var(--radius-1);
17262
+ }
17263
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17264
+ width: var(--content-icon-size-1);
17265
+ height: var(--content-icon-size-1);
17266
+ flex-shrink: 0;
17267
+ }
17268
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17269
+ font-size: var(--font-size-1);
17270
+ line-height: var(--line-height-1);
17271
+ letter-spacing: var(--letter-spacing-1);
17272
+ border-radius: var(--radius-1);
17273
+ }
17274
+ .rt-SidebarContainer:where(.lg\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17275
+ width: var(--content-icon-size-1);
17276
+ height: var(--content-icon-size-1);
17277
+ flex-shrink: 0;
17278
+ }
17279
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
17280
+ font-size: var(--font-size-2);
17281
+ line-height: var(--line-height-2);
17282
+ letter-spacing: var(--letter-spacing-2);
17283
+ border-radius: var(--radius-3);
17284
+ }
17285
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
17286
+ width: var(--content-icon-size-2);
17287
+ height: var(--content-icon-size-2);
17288
+ flex-shrink: 0;
17289
+ }
17290
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
17291
+ width: var(--indicator-icon-size-2);
17292
+ height: var(--indicator-icon-size-2);
17293
+ flex-shrink: 0;
17294
+ margin-left: auto;
17295
+ }
17296
+ .rt-SidebarContent:where(.lg\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
17297
+ font-size: var(--font-size-2);
17298
+ line-height: var(--line-height-2);
17299
+ letter-spacing: var(--letter-spacing-2);
17300
+ }
17301
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17302
+ font-size: var(--font-size-2);
17303
+ line-height: var(--line-height-2);
17304
+ letter-spacing: var(--letter-spacing-2);
17305
+ border-radius: var(--radius-3);
17306
+ }
17307
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17308
+ width: var(--content-icon-size-2);
17309
+ height: var(--content-icon-size-2);
17310
+ flex-shrink: 0;
17311
+ }
17312
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17313
+ font-size: var(--font-size-2);
17314
+ line-height: var(--line-height-2);
17315
+ letter-spacing: var(--letter-spacing-2);
17316
+ border-radius: var(--radius-3);
17317
+ }
17318
+ .rt-SidebarContainer:where(.lg\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17319
+ width: var(--content-icon-size-2);
17320
+ height: var(--content-icon-size-2);
17321
+ flex-shrink: 0;
17322
+ }
17323
+ }
17324
+ @media (min-width: 1640px) {
17325
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) {
17326
+ --sidebar-base-padding: var(--space-3);
17327
+ --sidebar-content-padding: var(--space-1);
17328
+ --sidebar-item-padding-left: var(--space-2);
17329
+ --sidebar-item-padding-right: var(--space-2);
17330
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
17331
+ --sidebar-item-height: var(--space-5);
17332
+ }
17333
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) {
17334
+ --sidebar-base-padding: var(--space-4);
17335
+ --sidebar-content-padding: var(--space-2);
17336
+ --sidebar-item-padding-left: var(--space-3);
17337
+ --sidebar-item-padding-right: var(--space-3);
17338
+ --sidebar-item-padding-y: var(--space-1);
17339
+ --sidebar-item-height: var(--space-6);
17340
+ }
17341
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) {
17342
+ --sidebar-content-padding: var(--space-1);
17343
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
17344
+ --sidebar-item-padding-right: var(--space-2);
17345
+ --sidebar-item-padding-y: calc(var(--space-1) * 0.75);
17346
+ --sidebar-item-height: var(--space-5);
17347
+ border-radius: var(--radius-3);
17348
+ }
17349
+ .rt-SidebarContent:where(.xl\:rt-r-size-1):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
17350
+ --sidebar-item-padding-left: var(--space-2);
17351
+ }
17352
+ .rt-SidebarContent:where(.xl\:rt-r-size-1):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
17353
+ --sidebar-item-padding-left: calc(var(--space-5) / 1.2);
17354
+ }
17355
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) {
17356
+ --sidebar-content-padding: var(--space-2);
17357
+ --sidebar-item-padding-left: var(--space-3);
17358
+ --sidebar-item-padding-right: var(--space-3);
17359
+ --sidebar-item-padding-y: var(--space-1);
17360
+ --sidebar-item-height: var(--space-6);
17361
+ border-radius: var(--radius-4);
17362
+ }
17363
+ .rt-SidebarContent:where(.xl\:rt-r-size-2):where(:not(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem))) {
17364
+ --sidebar-item-padding-left: var(--space-3);
17365
+ }
17366
+ .rt-SidebarContent:where(.xl\:rt-r-size-2):where(:has(.rt-BaseMenuCheckboxItem, .rt-BaseMenuRadioItem)) {
17367
+ --sidebar-item-padding-left: var(--space-5);
17368
+ }
17369
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) {
17370
+ font-size: var(--font-size-1);
17371
+ line-height: var(--line-height-1);
17372
+ letter-spacing: var(--letter-spacing-1);
17373
+ border-radius: var(--radius-1);
17374
+ }
17375
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarMenuButton) :where(svg) {
17376
+ width: var(--content-icon-size-1);
17377
+ height: var(--content-icon-size-1);
17378
+ flex-shrink: 0;
17379
+ }
17380
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-BaseMenuSubTriggerIcon) {
17381
+ width: var(--indicator-icon-size-1);
17382
+ height: var(--indicator-icon-size-1);
17383
+ flex-shrink: 0;
17384
+ margin-left: auto;
17385
+ }
17386
+ .rt-SidebarContent:where(.xl\:rt-r-size-1) :where(.rt-SidebarGroupLabel) {
17387
+ font-size: var(--font-size-1);
17388
+ line-height: var(--line-height-1);
17389
+ letter-spacing: var(--letter-spacing-1);
17390
+ }
17391
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17392
+ font-size: var(--font-size-1);
17393
+ line-height: var(--line-height-1);
17394
+ letter-spacing: var(--letter-spacing-1);
17395
+ border-radius: var(--radius-1);
17396
+ }
17397
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17398
+ width: var(--content-icon-size-1);
17399
+ height: var(--content-icon-size-1);
17400
+ flex-shrink: 0;
17401
+ }
17402
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17403
+ font-size: var(--font-size-1);
17404
+ line-height: var(--line-height-1);
17405
+ letter-spacing: var(--letter-spacing-1);
17406
+ border-radius: var(--radius-1);
17407
+ }
17408
+ .rt-SidebarContainer:where(.xl\:rt-r-size-1) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17409
+ width: var(--content-icon-size-1);
17410
+ height: var(--content-icon-size-1);
17411
+ flex-shrink: 0;
17412
+ }
17413
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) {
17414
+ font-size: var(--font-size-2);
17415
+ line-height: var(--line-height-2);
17416
+ letter-spacing: var(--letter-spacing-2);
17417
+ border-radius: var(--radius-3);
17418
+ }
17419
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarMenuButton) :where(svg) {
17420
+ width: var(--content-icon-size-2);
17421
+ height: var(--content-icon-size-2);
17422
+ flex-shrink: 0;
17423
+ }
17424
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-BaseMenuSubTriggerIcon) {
17425
+ width: var(--indicator-icon-size-2);
17426
+ height: var(--indicator-icon-size-2);
17427
+ flex-shrink: 0;
17428
+ margin-left: auto;
17429
+ }
17430
+ .rt-SidebarContent:where(.xl\:rt-r-size-2) :where(.rt-SidebarGroupLabel) {
17431
+ font-size: var(--font-size-2);
17432
+ line-height: var(--line-height-2);
17433
+ letter-spacing: var(--letter-spacing-2);
17434
+ }
17435
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) {
17436
+ font-size: var(--font-size-2);
17437
+ line-height: var(--line-height-2);
17438
+ letter-spacing: var(--letter-spacing-2);
17439
+ border-radius: var(--radius-3);
17440
+ }
17441
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarHeader .rt-SidebarMenuButton) :where(svg) {
17442
+ width: var(--content-icon-size-2);
17443
+ height: var(--content-icon-size-2);
17444
+ flex-shrink: 0;
17445
+ }
17446
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) {
17447
+ font-size: var(--font-size-2);
17448
+ line-height: var(--line-height-2);
17449
+ letter-spacing: var(--letter-spacing-2);
17450
+ border-radius: var(--radius-3);
17451
+ }
17452
+ .rt-SidebarContainer:where(.xl\:rt-r-size-2) :where(.rt-SidebarFooter .rt-SidebarMenuButton) :where(svg) {
17453
+ width: var(--content-icon-size-2);
17454
+ height: var(--content-icon-size-2);
17455
+ flex-shrink: 0;
17456
+ }
17457
+ }
17458
+ .rt-SidebarContainer:where(.rt-variant-ghost) {
17459
+ background-color: transparent;
17460
+ -webkit-backdrop-filter: none;
17461
+ backdrop-filter: none;
17462
+ border: none;
17463
+ }
17464
+ .rt-SidebarContainer:where(.rt-variant-soft) {
17465
+ background-color: var(--accent-2);
17466
+ }
17467
+ :where([data-panel-background='translucent']) .rt-SidebarContainer:where(.rt-variant-soft) {
17468
+ background-color: var(--accent-a2);
17469
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
17470
+ backdrop-filter: var(--backdrop-filter-panel);
17471
+ }
17472
+ .rt-SidebarContainer:where(.rt-variant-soft):where([data-panel-background='solid']) {
17473
+ background-color: var(--accent-2);
17474
+ -webkit-backdrop-filter: none;
17475
+ backdrop-filter: none;
17476
+ --backdrop-filter-components: none;
17477
+ }
17478
+ .rt-SidebarContainer:where(.rt-variant-soft):where([data-panel-background='translucent']) {
17479
+ background-color: var(--accent-a2);
17480
+ -webkit-backdrop-filter: var(--backdrop-filter-panel);
17481
+ backdrop-filter: var(--backdrop-filter-panel);
17482
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
17483
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
17484
+ }
17485
+ :where(.rt-SidebarRoot[data-type="floating"]) .rt-SidebarContainer:where(.rt-variant-ghost) {
17486
+ box-shadow: var(--shadow-4);
17487
+ }
17488
+ .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]) {
17489
+ background-color: var(--accent-9);
17490
+ color: var(--accent-contrast);
17491
+ }
17492
+ .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) {
17493
+ color: inherit !important;
17494
+ }
17495
+ .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']) {
17496
+ color: inherit !important;
17497
+ }
17498
+ .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]) {
17499
+ background-color: var(--accent-9);
17500
+ color: var(--accent-contrast);
17501
+ }
17502
+ .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) {
17503
+ color: inherit !important;
17504
+ }
17505
+ .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']) {
17506
+ color: inherit !important;
17507
+ }
17508
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
17509
+ .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
17510
+ .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-active]),
17511
+ .rt-SidebarHeader:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]),
17512
+ .rt-SidebarContent:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]),
17513
+ .rt-SidebarFooter:where(.rt-menu-variant-solid):where(.rt-high-contrast) :where(.rt-SidebarMenuButton[data-highlighted]) {
17514
+ background-color: var(--accent-12);
17515
+ color: var(--accent-1);
17516
+ }
17517
+ .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) {
17518
+ color: inherit !important;
17519
+ }
17520
+ .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']) {
17521
+ color: inherit !important;
17522
+ }
17523
+ .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]) {
17524
+ background-color: var(--accent-9);
17525
+ color: var(--accent-contrast);
17526
+ }
17527
+ .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) {
17528
+ color: inherit !important;
17529
+ }
17530
+ .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']) {
17531
+ color: inherit !important;
17532
+ }
17533
+ .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]) {
17534
+ background-color: var(--accent-3);
17535
+ color: var(--accent-12);
17536
+ }
17537
+ :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])) {
17538
+ background-color: var(--accent-a3);
17539
+ color: var(--accent-a12);
17540
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
17541
+ backdrop-filter: var(--backdrop-filter-components);
17542
+ }
17543
+ :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])) {
17544
+ background-color: var(--accent-3);
17545
+ color: var(--accent-12);
17546
+ -webkit-backdrop-filter: none;
17547
+ backdrop-filter: none;
17548
+ --backdrop-filter-components: none;
17549
+ }
17550
+ :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])) {
17551
+ background-color: var(--accent-a3);
17552
+ color: var(--accent-a12);
17553
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
17554
+ backdrop-filter: var(--backdrop-filter-components);
17555
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
17556
+ }
17557
+ :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])) {
17558
+ -webkit-backdrop-filter: none;
17559
+ backdrop-filter: none;
17560
+ }
17561
+ .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']) {
17562
+ color: var(--gray-11) !important;
17563
+ }
17564
+ .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]) {
17565
+ background-color: var(--accent-3);
17566
+ }
17567
+ :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])) {
17568
+ background-color: var(--accent-a3);
17569
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
17570
+ backdrop-filter: var(--backdrop-filter-components);
17571
+ }
17572
+ :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])) {
17573
+ background-color: var(--accent-3);
17574
+ -webkit-backdrop-filter: none;
17575
+ backdrop-filter: none;
17576
+ --backdrop-filter-components: none;
17577
+ }
17578
+ :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])) {
17579
+ background-color: var(--accent-a3);
17580
+ -webkit-backdrop-filter: var(--backdrop-filter-components);
17581
+ backdrop-filter: var(--backdrop-filter-components);
17582
+ --backdrop-filter-components: blur(var(--backdrop-blur-components));
17583
+ }
17584
+ :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])) {
17585
+ -webkit-backdrop-filter: none;
17586
+ backdrop-filter: none;
17587
+ }
17588
+ .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']) {
17589
+ color: var(--gray-11) !important;
17590
+ }
17591
+ .rt-SidebarContent :where(.rt-BaseMenuItem) {
17592
+ border-radius: var(--radius-2);
17593
+ margin-bottom: var(--space-1);
17594
+ }
17595
+ .rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"]) {
17596
+ transform: translateX(-100%);
17597
+ transition: transform var(--duration-3) var(--ease-2);
17598
+ }
17599
+ .rt-SidebarRoot:where([data-collapsible="icon"][data-state="expanded"]) {
17600
+ transform: translateX(0);
17601
+ transition: transform var(--duration-3) var(--ease-2);
17602
+ }
17603
+ .rt-SidebarRoot:where([data-collapsible="icon"][data-state="collapsed"][data-side="right"]) {
17604
+ transform: translateX(100%);
17605
+ }
17606
+ @media (prefers-reduced-motion: reduce) {
17607
+ .rt-SidebarRoot:where([data-collapsible="icon"]) {
17608
+ transition: none;
17609
+ }
17610
+ }
17611
+ @media (max-width: 768px) {
17612
+ .rt-SidebarRoot {
17613
+ display: none;
17614
+ }
17615
+ }
17616
+ :where(.rt-SidebarContent.rt-r-size-1) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
17617
+ padding-right: calc(var(--space-1) * 0.75);
17618
+ }
17619
+ :where(.rt-SidebarContent.rt-r-size-2) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
17620
+ padding-right: var(--space-1);
17621
+ }
17622
+ :where(.rt-SidebarContainer.rt-r-size-1) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
17623
+ padding-right: calc(var(--space-1) * 0.75);
17624
+ }
17625
+ :where(.rt-SidebarContainer.rt-r-size-2) .rt-SidebarMenuButton:where(:has(.rt-SidebarMenuShortcut, .rt-SidebarMenuBadge)) {
17626
+ padding-right: var(--space-1);
17627
+ }
17628
+ .rt-SidebarMenuShortcut {
17629
+ display: flex;
17630
+ align-items: center;
17631
+ margin-left: auto;
17632
+ padding-left: var(--space-4);
17633
+ color: var(--gray-a11);
17634
+ }
17635
+ .rt-SidebarMenuBadge {
17636
+ display: flex;
17637
+ align-items: center;
17638
+ margin-left: auto;
17639
+ padding-left: var(--space-2);
17640
+ }
16224
17641
  .rt-SliderRoot {
16225
17642
  --slider-thumb-size: calc(var(--slider-track-size) + var(--space-1));
16226
17643
  position: relative;