@kushagradhawan/kookie-ui 0.1.54 → 0.1.55

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 (13) hide show
  1. package/components.css +292 -187
  2. package/package.json +1 -1
  3. package/schemas/base-button.json +1 -1
  4. package/schemas/button.json +1 -1
  5. package/schemas/icon-button.json +1 -1
  6. package/schemas/index.json +6 -6
  7. package/schemas/toggle-button.json +1 -1
  8. package/schemas/toggle-icon-button.json +1 -1
  9. package/src/components/_internal/base-card.css +20 -83
  10. package/src/components/_internal/base-sidebar.css +2 -19
  11. package/src/components/callout.css +22 -5
  12. package/src/components/table.css +25 -5
  13. package/styles.css +292 -187
package/components.css CHANGED
@@ -4612,6 +4612,7 @@
4612
4612
  text-align: left;
4613
4613
  color: var(--accent-a11);
4614
4614
  transition: var(--transition-card);
4615
+ border-radius: var(--callout-border-radius);
4615
4616
  isolation: isolate;
4616
4617
  }
4617
4618
  :where([data-panel-background='translucent'], [data-material='translucent']) .rt-CalloutRoot {
@@ -4665,7 +4666,7 @@
4665
4666
  -moz-column-gap: var(--space-2);
4666
4667
  column-gap: var(--space-2);
4667
4668
  padding: var(--space-3);
4668
- border-radius: var(--radius-1);
4669
+ --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
4669
4670
  --callout-icon-height: var(--line-height-1);
4670
4671
  --callout-icon-size: var(--content-icon-size-1);
4671
4672
  }
@@ -4674,7 +4675,7 @@
4674
4675
  -moz-column-gap: var(--space-3);
4675
4676
  column-gap: var(--space-3);
4676
4677
  padding: var(--space-4);
4677
- border-radius: var(--radius-2);
4678
+ --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
4678
4679
  --callout-icon-height: var(--line-height-2);
4679
4680
  --callout-icon-size: var(--content-icon-size-2);
4680
4681
  }
@@ -4683,17 +4684,35 @@
4683
4684
  -moz-column-gap: var(--space-4);
4684
4685
  column-gap: var(--space-4);
4685
4686
  padding: var(--space-5);
4686
- border-radius: var(--radius-3);
4687
+ --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
4687
4688
  --callout-icon-height: var(--line-height-3);
4688
4689
  --callout-icon-size: var(--content-icon-size-3);
4689
4690
  }
4691
+ .rt-CalloutRoot:where(.rt-r-size-4) {
4692
+ row-gap: var(--space-3);
4693
+ -moz-column-gap: var(--space-5);
4694
+ column-gap: var(--space-5);
4695
+ padding: var(--space-6);
4696
+ --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
4697
+ --callout-icon-height: var(--line-height-4);
4698
+ --callout-icon-size: var(--content-icon-size-4);
4699
+ }
4700
+ .rt-CalloutRoot:where(.rt-r-size-5) {
4701
+ row-gap: var(--space-4);
4702
+ -moz-column-gap: var(--space-6);
4703
+ column-gap: var(--space-6);
4704
+ padding: var(--space-7);
4705
+ --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
4706
+ --callout-icon-height: var(--line-height-5);
4707
+ --callout-icon-size: var(--content-icon-size-5);
4708
+ }
4690
4709
  @media (min-width: 520px) {
4691
4710
  .rt-CalloutRoot:where(.xs\:rt-r-size-1) {
4692
4711
  row-gap: var(--space-2);
4693
4712
  -moz-column-gap: var(--space-2);
4694
4713
  column-gap: var(--space-2);
4695
4714
  padding: var(--space-3);
4696
- border-radius: var(--radius-1);
4715
+ --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
4697
4716
  --callout-icon-height: var(--line-height-1);
4698
4717
  --callout-icon-size: var(--content-icon-size-1);
4699
4718
  }
@@ -4702,7 +4721,7 @@
4702
4721
  -moz-column-gap: var(--space-3);
4703
4722
  column-gap: var(--space-3);
4704
4723
  padding: var(--space-4);
4705
- border-radius: var(--radius-2);
4724
+ --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
4706
4725
  --callout-icon-height: var(--line-height-2);
4707
4726
  --callout-icon-size: var(--content-icon-size-2);
4708
4727
  }
@@ -4711,10 +4730,28 @@
4711
4730
  -moz-column-gap: var(--space-4);
4712
4731
  column-gap: var(--space-4);
4713
4732
  padding: var(--space-5);
4714
- border-radius: var(--radius-3);
4733
+ --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
4715
4734
  --callout-icon-height: var(--line-height-3);
4716
4735
  --callout-icon-size: var(--content-icon-size-3);
4717
4736
  }
4737
+ .rt-CalloutRoot:where(.xs\:rt-r-size-4) {
4738
+ row-gap: var(--space-3);
4739
+ -moz-column-gap: var(--space-5);
4740
+ column-gap: var(--space-5);
4741
+ padding: var(--space-6);
4742
+ --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
4743
+ --callout-icon-height: var(--line-height-4);
4744
+ --callout-icon-size: var(--content-icon-size-4);
4745
+ }
4746
+ .rt-CalloutRoot:where(.xs\:rt-r-size-5) {
4747
+ row-gap: var(--space-4);
4748
+ -moz-column-gap: var(--space-6);
4749
+ column-gap: var(--space-6);
4750
+ padding: var(--space-7);
4751
+ --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
4752
+ --callout-icon-height: var(--line-height-5);
4753
+ --callout-icon-size: var(--content-icon-size-5);
4754
+ }
4718
4755
  }
4719
4756
  @media (min-width: 768px) {
4720
4757
  .rt-CalloutRoot:where(.sm\:rt-r-size-1) {
@@ -4722,7 +4759,7 @@
4722
4759
  -moz-column-gap: var(--space-2);
4723
4760
  column-gap: var(--space-2);
4724
4761
  padding: var(--space-3);
4725
- border-radius: var(--radius-1);
4762
+ --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
4726
4763
  --callout-icon-height: var(--line-height-1);
4727
4764
  --callout-icon-size: var(--content-icon-size-1);
4728
4765
  }
@@ -4731,7 +4768,7 @@
4731
4768
  -moz-column-gap: var(--space-3);
4732
4769
  column-gap: var(--space-3);
4733
4770
  padding: var(--space-4);
4734
- border-radius: var(--radius-2);
4771
+ --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
4735
4772
  --callout-icon-height: var(--line-height-2);
4736
4773
  --callout-icon-size: var(--content-icon-size-2);
4737
4774
  }
@@ -4740,10 +4777,28 @@
4740
4777
  -moz-column-gap: var(--space-4);
4741
4778
  column-gap: var(--space-4);
4742
4779
  padding: var(--space-5);
4743
- border-radius: var(--radius-3);
4780
+ --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
4744
4781
  --callout-icon-height: var(--line-height-3);
4745
4782
  --callout-icon-size: var(--content-icon-size-3);
4746
4783
  }
4784
+ .rt-CalloutRoot:where(.sm\:rt-r-size-4) {
4785
+ row-gap: var(--space-3);
4786
+ -moz-column-gap: var(--space-5);
4787
+ column-gap: var(--space-5);
4788
+ padding: var(--space-6);
4789
+ --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
4790
+ --callout-icon-height: var(--line-height-4);
4791
+ --callout-icon-size: var(--content-icon-size-4);
4792
+ }
4793
+ .rt-CalloutRoot:where(.sm\:rt-r-size-5) {
4794
+ row-gap: var(--space-4);
4795
+ -moz-column-gap: var(--space-6);
4796
+ column-gap: var(--space-6);
4797
+ padding: var(--space-7);
4798
+ --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
4799
+ --callout-icon-height: var(--line-height-5);
4800
+ --callout-icon-size: var(--content-icon-size-5);
4801
+ }
4747
4802
  }
4748
4803
  @media (min-width: 1024px) {
4749
4804
  .rt-CalloutRoot:where(.md\:rt-r-size-1) {
@@ -4751,7 +4806,7 @@
4751
4806
  -moz-column-gap: var(--space-2);
4752
4807
  column-gap: var(--space-2);
4753
4808
  padding: var(--space-3);
4754
- border-radius: var(--radius-1);
4809
+ --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
4755
4810
  --callout-icon-height: var(--line-height-1);
4756
4811
  --callout-icon-size: var(--content-icon-size-1);
4757
4812
  }
@@ -4760,7 +4815,7 @@
4760
4815
  -moz-column-gap: var(--space-3);
4761
4816
  column-gap: var(--space-3);
4762
4817
  padding: var(--space-4);
4763
- border-radius: var(--radius-2);
4818
+ --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
4764
4819
  --callout-icon-height: var(--line-height-2);
4765
4820
  --callout-icon-size: var(--content-icon-size-2);
4766
4821
  }
@@ -4769,10 +4824,28 @@
4769
4824
  -moz-column-gap: var(--space-4);
4770
4825
  column-gap: var(--space-4);
4771
4826
  padding: var(--space-5);
4772
- border-radius: var(--radius-3);
4827
+ --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
4773
4828
  --callout-icon-height: var(--line-height-3);
4774
4829
  --callout-icon-size: var(--content-icon-size-3);
4775
4830
  }
4831
+ .rt-CalloutRoot:where(.md\:rt-r-size-4) {
4832
+ row-gap: var(--space-3);
4833
+ -moz-column-gap: var(--space-5);
4834
+ column-gap: var(--space-5);
4835
+ padding: var(--space-6);
4836
+ --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
4837
+ --callout-icon-height: var(--line-height-4);
4838
+ --callout-icon-size: var(--content-icon-size-4);
4839
+ }
4840
+ .rt-CalloutRoot:where(.md\:rt-r-size-5) {
4841
+ row-gap: var(--space-4);
4842
+ -moz-column-gap: var(--space-6);
4843
+ column-gap: var(--space-6);
4844
+ padding: var(--space-7);
4845
+ --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
4846
+ --callout-icon-height: var(--line-height-5);
4847
+ --callout-icon-size: var(--content-icon-size-5);
4848
+ }
4776
4849
  }
4777
4850
  @media (min-width: 1280px) {
4778
4851
  .rt-CalloutRoot:where(.lg\:rt-r-size-1) {
@@ -4780,7 +4853,7 @@
4780
4853
  -moz-column-gap: var(--space-2);
4781
4854
  column-gap: var(--space-2);
4782
4855
  padding: var(--space-3);
4783
- border-radius: var(--radius-1);
4856
+ --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
4784
4857
  --callout-icon-height: var(--line-height-1);
4785
4858
  --callout-icon-size: var(--content-icon-size-1);
4786
4859
  }
@@ -4789,7 +4862,7 @@
4789
4862
  -moz-column-gap: var(--space-3);
4790
4863
  column-gap: var(--space-3);
4791
4864
  padding: var(--space-4);
4792
- border-radius: var(--radius-2);
4865
+ --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
4793
4866
  --callout-icon-height: var(--line-height-2);
4794
4867
  --callout-icon-size: var(--content-icon-size-2);
4795
4868
  }
@@ -4798,10 +4871,28 @@
4798
4871
  -moz-column-gap: var(--space-4);
4799
4872
  column-gap: var(--space-4);
4800
4873
  padding: var(--space-5);
4801
- border-radius: var(--radius-3);
4874
+ --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
4802
4875
  --callout-icon-height: var(--line-height-3);
4803
4876
  --callout-icon-size: var(--content-icon-size-3);
4804
4877
  }
4878
+ .rt-CalloutRoot:where(.lg\:rt-r-size-4) {
4879
+ row-gap: var(--space-3);
4880
+ -moz-column-gap: var(--space-5);
4881
+ column-gap: var(--space-5);
4882
+ padding: var(--space-6);
4883
+ --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
4884
+ --callout-icon-height: var(--line-height-4);
4885
+ --callout-icon-size: var(--content-icon-size-4);
4886
+ }
4887
+ .rt-CalloutRoot:where(.lg\:rt-r-size-5) {
4888
+ row-gap: var(--space-4);
4889
+ -moz-column-gap: var(--space-6);
4890
+ column-gap: var(--space-6);
4891
+ padding: var(--space-7);
4892
+ --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
4893
+ --callout-icon-height: var(--line-height-5);
4894
+ --callout-icon-size: var(--content-icon-size-5);
4895
+ }
4805
4896
  }
4806
4897
  @media (min-width: 1640px) {
4807
4898
  .rt-CalloutRoot:where(.xl\:rt-r-size-1) {
@@ -4809,7 +4900,7 @@
4809
4900
  -moz-column-gap: var(--space-2);
4810
4901
  column-gap: var(--space-2);
4811
4902
  padding: var(--space-3);
4812
- border-radius: var(--radius-1);
4903
+ --callout-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
4813
4904
  --callout-icon-height: var(--line-height-1);
4814
4905
  --callout-icon-size: var(--content-icon-size-1);
4815
4906
  }
@@ -4818,7 +4909,7 @@
4818
4909
  -moz-column-gap: var(--space-3);
4819
4910
  column-gap: var(--space-3);
4820
4911
  padding: var(--space-4);
4821
- border-radius: var(--radius-2);
4912
+ --callout-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
4822
4913
  --callout-icon-height: var(--line-height-2);
4823
4914
  --callout-icon-size: var(--content-icon-size-2);
4824
4915
  }
@@ -4827,10 +4918,28 @@
4827
4918
  -moz-column-gap: var(--space-4);
4828
4919
  column-gap: var(--space-4);
4829
4920
  padding: var(--space-5);
4830
- border-radius: var(--radius-3);
4921
+ --callout-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
4831
4922
  --callout-icon-height: var(--line-height-3);
4832
4923
  --callout-icon-size: var(--content-icon-size-3);
4833
4924
  }
4925
+ .rt-CalloutRoot:where(.xl\:rt-r-size-4) {
4926
+ row-gap: var(--space-3);
4927
+ -moz-column-gap: var(--space-5);
4928
+ column-gap: var(--space-5);
4929
+ padding: var(--space-6);
4930
+ --callout-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
4931
+ --callout-icon-height: var(--line-height-4);
4932
+ --callout-icon-size: var(--content-icon-size-4);
4933
+ }
4934
+ .rt-CalloutRoot:where(.xl\:rt-r-size-5) {
4935
+ row-gap: var(--space-4);
4936
+ -moz-column-gap: var(--space-6);
4937
+ column-gap: var(--space-6);
4938
+ padding: var(--space-7);
4939
+ --callout-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
4940
+ --callout-icon-height: var(--line-height-5);
4941
+ --callout-icon-size: var(--content-icon-size-5);
4942
+ }
4834
4943
  }
4835
4944
  .rt-CalloutRoot:where(.rt-variant-soft) {
4836
4945
  background-color: var(--accent-2);
@@ -4953,9 +5062,10 @@
4953
5062
  .rt-BaseCard::before {
4954
5063
  z-index: -1;
4955
5064
  }
4956
- :where([data-panel-background='translucent']) .rt-BaseCard::before {
5065
+ :where([data-panel-background='translucent'], [data-material='translucent']) .rt-BaseCard::before {
4957
5066
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
4958
5067
  backdrop-filter: var(--backdrop-filter-panel);
5068
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
4959
5069
  }
4960
5070
  :where(.rt-BaseCard[data-panel-background='solid']) .rt-BaseCard::before {
4961
5071
  -webkit-backdrop-filter: none;
@@ -4967,21 +5077,6 @@
4967
5077
  backdrop-filter: var(--backdrop-filter-panel);
4968
5078
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
4969
5079
  }
4970
- :where(
4971
- .rt-PopoverContent,
4972
- .rt-BaseDialogContent,
4973
- .rt-BaseMenuContent,
4974
- .rt-DropdownMenuContent,
4975
- .rt-ContextMenuContent,
4976
- .rt-AlertDialogContent,
4977
- .rt-HoverCardContent,
4978
- .rt-TooltipContent,
4979
- .rt-Card
4980
- )
4981
- .rt-BaseCard::before {
4982
- -webkit-backdrop-filter: none !important;
4983
- backdrop-filter: none !important;
4984
- }
4985
5080
  .rt-BaseCard:where(.rt-r-size-1) {
4986
5081
  --base-card-padding-top: var(--space-2);
4987
5082
  --base-card-padding-right: var(--space-2);
@@ -5397,17 +5492,14 @@
5397
5492
  :where([data-panel-background='translucent'], [data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic)::before {
5398
5493
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5399
5494
  backdrop-filter: var(--backdrop-filter-panel);
5495
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
5400
5496
  }
5401
5497
  :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-classic)::before {
5402
5498
  -webkit-backdrop-filter: none;
5403
5499
  backdrop-filter: none;
5404
5500
  --backdrop-filter-panel: none;
5405
5501
  }
5406
- :where(
5407
- .rt-BaseCard[data-panel-background='translucent'],
5408
- .rt-BaseCard[data-material='translucent']
5409
- )
5410
- .rt-BaseCard:where(.rt-variant-classic)::before {
5502
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic)::before {
5411
5503
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5412
5504
  backdrop-filter: var(--backdrop-filter-panel);
5413
5505
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
@@ -5443,33 +5535,23 @@
5443
5535
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5444
5536
  backdrop-filter: var(--backdrop-filter-panel);
5445
5537
  }
5446
- :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid'])
5447
- .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where(:hover)::before {
5538
+ :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where(:hover)::before {
5448
5539
  background-color: var(--gray-2);
5449
5540
  backdrop-filter: none;
5450
5541
  --backdrop-filter-panel: none;
5451
5542
  }
5452
- :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid'])
5453
- .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where(:hover)::before {
5543
+ :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where(:hover)::before {
5454
5544
  background-color: var(--gray-2);
5455
5545
  -webkit-backdrop-filter: none;
5456
5546
  backdrop-filter: none;
5457
5547
  --backdrop-filter-panel: none;
5458
5548
  }
5459
- :where(
5460
- .rt-BaseCard[data-panel-background='translucent'],
5461
- .rt-BaseCard[data-material='translucent']
5462
- )
5463
- .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where(:hover)::before {
5549
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where(:hover)::before {
5464
5550
  background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
5465
5551
  backdrop-filter: var(--backdrop-filter-panel);
5466
5552
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
5467
5553
  }
5468
- :where(
5469
- .rt-BaseCard[data-panel-background='translucent'],
5470
- .rt-BaseCard[data-material='translucent']
5471
- )
5472
- .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where(:hover)::before {
5554
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where(:hover)::before {
5473
5555
  background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
5474
5556
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5475
5557
  backdrop-filter: var(--backdrop-filter-panel);
@@ -5516,20 +5598,12 @@
5516
5598
  backdrop-filter: none;
5517
5599
  --backdrop-filter-panel: none;
5518
5600
  }
5519
- :where(
5520
- .rt-BaseCard[data-panel-background='translucent'],
5521
- .rt-BaseCard[data-material='translucent']
5522
- )
5523
- .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where([data-state='open'])::before {
5601
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where([data-state='open'])::before {
5524
5602
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
5525
5603
  backdrop-filter: var(--backdrop-filter-panel);
5526
5604
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
5527
5605
  }
5528
- :where(
5529
- .rt-BaseCard[data-panel-background='translucent'],
5530
- .rt-BaseCard[data-material='translucent']
5531
- )
5532
- .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where([data-state='open'])::before {
5606
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where([data-state='open'])::before {
5533
5607
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
5534
5608
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5535
5609
  backdrop-filter: var(--backdrop-filter-panel);
@@ -5573,20 +5647,12 @@
5573
5647
  backdrop-filter: none;
5574
5648
  --backdrop-filter-panel: none;
5575
5649
  }
5576
- :where(
5577
- .rt-BaseCard[data-panel-background='translucent'],
5578
- .rt-BaseCard[data-material='translucent']
5579
- )
5580
- .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where(:active:not([data-state='open']))::before {
5650
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic):where(:-moz-any-link, button, label):where(:active:not([data-state='open']))::before {
5581
5651
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
5582
5652
  backdrop-filter: var(--backdrop-filter-panel);
5583
5653
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
5584
5654
  }
5585
- :where(
5586
- .rt-BaseCard[data-panel-background='translucent'],
5587
- .rt-BaseCard[data-material='translucent']
5588
- )
5589
- .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where(:active:not([data-state='open']))::before {
5655
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-classic):where(:any-link, button, label):where(:active:not([data-state='open']))::before {
5590
5656
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
5591
5657
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5592
5658
  backdrop-filter: var(--backdrop-filter-panel);
@@ -5883,17 +5949,14 @@
5883
5949
  :where([data-panel-background='translucent'], [data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft)::before {
5884
5950
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5885
5951
  backdrop-filter: var(--backdrop-filter-panel);
5952
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
5886
5953
  }
5887
5954
  :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-soft)::before {
5888
5955
  -webkit-backdrop-filter: none;
5889
5956
  backdrop-filter: none;
5890
5957
  --backdrop-filter-panel: none;
5891
5958
  }
5892
- :where(
5893
- .rt-BaseCard[data-panel-background='translucent'],
5894
- .rt-BaseCard[data-material='translucent']
5895
- )
5896
- .rt-BaseCard:where(.rt-variant-soft)::before {
5959
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft)::before {
5897
5960
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5898
5961
  backdrop-filter: var(--backdrop-filter-panel);
5899
5962
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
@@ -5923,33 +5986,23 @@
5923
5986
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5924
5987
  backdrop-filter: var(--backdrop-filter-panel);
5925
5988
  }
5926
- :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid'])
5927
- .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where(:hover)::before {
5989
+ :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where(:hover)::before {
5928
5990
  background-color: var(--gray-3);
5929
5991
  backdrop-filter: none;
5930
5992
  --backdrop-filter-panel: none;
5931
5993
  }
5932
- :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid'])
5933
- .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where(:hover)::before {
5994
+ :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where(:hover)::before {
5934
5995
  background-color: var(--gray-3);
5935
5996
  -webkit-backdrop-filter: none;
5936
5997
  backdrop-filter: none;
5937
5998
  --backdrop-filter-panel: none;
5938
5999
  }
5939
- :where(
5940
- .rt-BaseCard[data-panel-background='translucent'],
5941
- .rt-BaseCard[data-material='translucent']
5942
- )
5943
- .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where(:hover)::before {
6000
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where(:hover)::before {
5944
6001
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
5945
6002
  backdrop-filter: var(--backdrop-filter-panel);
5946
6003
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
5947
6004
  }
5948
- :where(
5949
- .rt-BaseCard[data-panel-background='translucent'],
5950
- .rt-BaseCard[data-material='translucent']
5951
- )
5952
- .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where(:hover)::before {
6005
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where(:hover)::before {
5953
6006
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
5954
6007
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
5955
6008
  backdrop-filter: var(--backdrop-filter-panel);
@@ -6011,20 +6064,12 @@
6011
6064
  backdrop-filter: none;
6012
6065
  --backdrop-filter-panel: none;
6013
6066
  }
6014
- :where(
6015
- .rt-BaseCard[data-panel-background='translucent'],
6016
- .rt-BaseCard[data-material='translucent']
6017
- )
6018
- .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where([data-state='open'])::before {
6067
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where([data-state='open'])::before {
6019
6068
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
6020
6069
  backdrop-filter: var(--backdrop-filter-panel);
6021
6070
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
6022
6071
  }
6023
- :where(
6024
- .rt-BaseCard[data-panel-background='translucent'],
6025
- .rt-BaseCard[data-material='translucent']
6026
- )
6027
- .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where([data-state='open'])::before {
6072
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where([data-state='open'])::before {
6028
6073
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
6029
6074
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6030
6075
  backdrop-filter: var(--backdrop-filter-panel);
@@ -6085,20 +6130,12 @@
6085
6130
  backdrop-filter: none;
6086
6131
  --backdrop-filter-panel: none;
6087
6132
  }
6088
- :where(
6089
- .rt-BaseCard[data-panel-background='translucent'],
6090
- .rt-BaseCard[data-material='translucent']
6091
- )
6092
- .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where(:active:not([data-state='open']))::before {
6133
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft):where(:-moz-any-link, button, label):where(:active:not([data-state='open']))::before {
6093
6134
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
6094
6135
  backdrop-filter: var(--backdrop-filter-panel);
6095
6136
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
6096
6137
  }
6097
- :where(
6098
- .rt-BaseCard[data-panel-background='translucent'],
6099
- .rt-BaseCard[data-material='translucent']
6100
- )
6101
- .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where(:active:not([data-state='open']))::before {
6138
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-soft):where(:any-link, button, label):where(:active:not([data-state='open']))::before {
6102
6139
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
6103
6140
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6104
6141
  backdrop-filter: var(--backdrop-filter-panel);
@@ -6131,17 +6168,14 @@
6131
6168
  :where([data-panel-background='translucent'], [data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface)::before {
6132
6169
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6133
6170
  backdrop-filter: var(--backdrop-filter-panel);
6171
+ --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
6134
6172
  }
6135
6173
  :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-surface)::before {
6136
6174
  -webkit-backdrop-filter: none;
6137
6175
  backdrop-filter: none;
6138
6176
  --backdrop-filter-panel: none;
6139
6177
  }
6140
- :where(
6141
- .rt-BaseCard[data-panel-background='translucent'],
6142
- .rt-BaseCard[data-material='translucent']
6143
- )
6144
- .rt-BaseCard:where(.rt-variant-surface)::before {
6178
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface)::before {
6145
6179
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6146
6180
  backdrop-filter: var(--backdrop-filter-panel);
6147
6181
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
@@ -6178,33 +6212,23 @@
6178
6212
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6179
6213
  backdrop-filter: var(--backdrop-filter-panel);
6180
6214
  }
6181
- :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid'])
6182
- .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where(:hover)::before {
6215
+ :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where(:hover)::before {
6183
6216
  background-color: var(--gray-2);
6184
6217
  backdrop-filter: none;
6185
6218
  --backdrop-filter-panel: none;
6186
6219
  }
6187
- :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid'])
6188
- .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where(:hover)::before {
6220
+ :where(.rt-BaseCard[data-panel-background='solid'], .rt-BaseCard[data-material='solid']) .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where(:hover)::before {
6189
6221
  background-color: var(--gray-2);
6190
6222
  -webkit-backdrop-filter: none;
6191
6223
  backdrop-filter: none;
6192
6224
  --backdrop-filter-panel: none;
6193
6225
  }
6194
- :where(
6195
- .rt-BaseCard[data-panel-background='translucent'],
6196
- .rt-BaseCard[data-material='translucent']
6197
- )
6198
- .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where(:hover)::before {
6226
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where(:hover)::before {
6199
6227
  background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
6200
6228
  backdrop-filter: var(--backdrop-filter-panel);
6201
6229
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
6202
6230
  }
6203
- :where(
6204
- .rt-BaseCard[data-panel-background='translucent'],
6205
- .rt-BaseCard[data-material='translucent']
6206
- )
6207
- .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where(:hover)::before {
6231
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where(:hover)::before {
6208
6232
  background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
6209
6233
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6210
6234
  backdrop-filter: var(--backdrop-filter-panel);
@@ -6249,20 +6273,12 @@
6249
6273
  backdrop-filter: none;
6250
6274
  --backdrop-filter-panel: none;
6251
6275
  }
6252
- :where(
6253
- .rt-BaseCard[data-panel-background='translucent'],
6254
- .rt-BaseCard[data-material='translucent']
6255
- )
6256
- .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where([data-state='open'])::before {
6276
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where([data-state='open'])::before {
6257
6277
  background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
6258
6278
  backdrop-filter: var(--backdrop-filter-panel);
6259
6279
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
6260
6280
  }
6261
- :where(
6262
- .rt-BaseCard[data-panel-background='translucent'],
6263
- .rt-BaseCard[data-material='translucent']
6264
- )
6265
- .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where([data-state='open'])::before {
6281
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where([data-state='open'])::before {
6266
6282
  background-color: color-mix(in srgb, var(--gray-a2), var(--gray-2) 60%);
6267
6283
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6268
6284
  backdrop-filter: var(--backdrop-filter-panel);
@@ -6306,20 +6322,12 @@
6306
6322
  backdrop-filter: none;
6307
6323
  --backdrop-filter-panel: none;
6308
6324
  }
6309
- :where(
6310
- .rt-BaseCard[data-panel-background='translucent'],
6311
- .rt-BaseCard[data-material='translucent']
6312
- )
6313
- .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where(:active:not([data-state='open']))::before {
6325
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface):where(:-moz-any-link, button, label):where(:active:not([data-state='open']))::before {
6314
6326
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
6315
6327
  backdrop-filter: var(--backdrop-filter-panel);
6316
6328
  --backdrop-filter-panel: blur(var(--backdrop-blur-panel));
6317
6329
  }
6318
- :where(
6319
- .rt-BaseCard[data-panel-background='translucent'],
6320
- .rt-BaseCard[data-material='translucent']
6321
- )
6322
- .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where(:active:not([data-state='open']))::before {
6330
+ :where(.rt-BaseCard[data-panel-background='translucent'], .rt-BaseCard[data-material='translucent']) .rt-BaseCard:where(.rt-variant-surface):where(:any-link, button, label):where(:active:not([data-state='open']))::before {
6323
6331
  background-color: color-mix(in srgb, var(--gray-a3), var(--gray-3) 60%);
6324
6332
  -webkit-backdrop-filter: var(--backdrop-filter-panel);
6325
6333
  backdrop-filter: var(--backdrop-filter-panel);
@@ -14487,12 +14495,6 @@
14487
14495
  --separator-size: 100%;
14488
14496
  }
14489
14497
  }
14490
- .rt-SidebarProvider:where([data-side='left']) {
14491
- order: -1;
14492
- }
14493
- .rt-SidebarProvider:where([data-side='right']) {
14494
- order: 999;
14495
- }
14496
14498
  .rt-SidebarRoot {
14497
14499
  --sidebar-base-border-radius: 0;
14498
14500
  width: 100%;
@@ -14582,11 +14584,6 @@
14582
14584
  width: 100%;
14583
14585
  margin: var(--space-2) 0;
14584
14586
  }
14585
- @media (max-width: 768px) {
14586
- .rt-SidebarRoot:not(:where(.rt-SheetContent .rt-SidebarRoot)) {
14587
- display: none;
14588
- }
14589
- }
14590
14587
  .rt-SidebarMenu {
14591
14588
  flex: 1;
14592
14589
  display: flex;
@@ -17227,13 +17224,13 @@
17227
17224
  padding-right: var(--inset-padding-right, var(--table-cell-padding));
17228
17225
  }
17229
17226
  .rt-TableColumnHeaderCell {
17230
- font-weight: bold;
17227
+ font-weight: 600;
17231
17228
  }
17232
17229
  .rt-TableRowHeaderCell {
17233
17230
  font-weight: normal;
17234
17231
  }
17235
17232
  .rt-TableRoot:where(.rt-r-size-1) {
17236
- --table-border-radius: var(--radius-3);
17233
+ --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
17237
17234
  --table-cell-padding: var(--space-2);
17238
17235
  --table-cell-min-height: calc(36px * var(--scaling));
17239
17236
  }
@@ -17242,7 +17239,7 @@
17242
17239
  line-height: var(--line-height-2);
17243
17240
  }
17244
17241
  .rt-TableRoot:where(.rt-r-size-2) {
17245
- --table-border-radius: var(--radius-4);
17242
+ --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
17246
17243
  --table-cell-padding: var(--space-3);
17247
17244
  --table-cell-min-height: calc(44px * var(--scaling));
17248
17245
  }
@@ -17251,17 +17248,35 @@
17251
17248
  line-height: var(--line-height-2);
17252
17249
  }
17253
17250
  .rt-TableRoot:where(.rt-r-size-3) {
17254
- --table-border-radius: var(--radius-4);
17255
- --table-cell-padding: var(--space-3) var(--space-4);
17251
+ --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
17252
+ --table-cell-padding: var(--space-4);
17256
17253
  --table-cell-min-height: var(--space-8);
17257
17254
  }
17258
17255
  .rt-TableRoot:where(.rt-r-size-3) :where(.rt-TableRootTable) {
17259
17256
  font-size: var(--font-size-3);
17260
17257
  line-height: var(--line-height-3);
17261
17258
  }
17259
+ .rt-TableRoot:where(.rt-r-size-4) {
17260
+ --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
17261
+ --table-cell-padding: var(--space-5);
17262
+ --table-cell-min-height: var(--space-9);
17263
+ }
17264
+ .rt-TableRoot:where(.rt-r-size-4) :where(.rt-TableRootTable) {
17265
+ font-size: var(--font-size-3);
17266
+ line-height: var(--line-height-3);
17267
+ }
17268
+ .rt-TableRoot:where(.rt-r-size-5) {
17269
+ --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
17270
+ --table-cell-padding: var(--space-6);
17271
+ --table-cell-min-height: var(--space-10);
17272
+ }
17273
+ .rt-TableRoot:where(.rt-r-size-5) :where(.rt-TableRootTable) {
17274
+ font-size: var(--font-size-4);
17275
+ line-height: var(--line-height-4);
17276
+ }
17262
17277
  @media (min-width: 520px) {
17263
17278
  .rt-TableRoot:where(.xs\:rt-r-size-1) {
17264
- --table-border-radius: var(--radius-3);
17279
+ --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
17265
17280
  --table-cell-padding: var(--space-2);
17266
17281
  --table-cell-min-height: calc(36px * var(--scaling));
17267
17282
  }
@@ -17270,7 +17285,7 @@
17270
17285
  line-height: var(--line-height-2);
17271
17286
  }
17272
17287
  .rt-TableRoot:where(.xs\:rt-r-size-2) {
17273
- --table-border-radius: var(--radius-4);
17288
+ --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
17274
17289
  --table-cell-padding: var(--space-3);
17275
17290
  --table-cell-min-height: calc(44px * var(--scaling));
17276
17291
  }
@@ -17279,18 +17294,36 @@
17279
17294
  line-height: var(--line-height-2);
17280
17295
  }
17281
17296
  .rt-TableRoot:where(.xs\:rt-r-size-3) {
17282
- --table-border-radius: var(--radius-4);
17283
- --table-cell-padding: var(--space-3) var(--space-4);
17297
+ --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
17298
+ --table-cell-padding: var(--space-4);
17284
17299
  --table-cell-min-height: var(--space-8);
17285
17300
  }
17286
17301
  .rt-TableRoot:where(.xs\:rt-r-size-3) :where(.rt-TableRootTable) {
17287
17302
  font-size: var(--font-size-3);
17288
17303
  line-height: var(--line-height-3);
17289
17304
  }
17305
+ .rt-TableRoot:where(.xs\:rt-r-size-4) {
17306
+ --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
17307
+ --table-cell-padding: var(--space-5);
17308
+ --table-cell-min-height: var(--space-9);
17309
+ }
17310
+ .rt-TableRoot:where(.xs\:rt-r-size-4) :where(.rt-TableRootTable) {
17311
+ font-size: var(--font-size-3);
17312
+ line-height: var(--line-height-3);
17313
+ }
17314
+ .rt-TableRoot:where(.xs\:rt-r-size-5) {
17315
+ --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
17316
+ --table-cell-padding: var(--space-6);
17317
+ --table-cell-min-height: var(--space-10);
17318
+ }
17319
+ .rt-TableRoot:where(.xs\:rt-r-size-5) :where(.rt-TableRootTable) {
17320
+ font-size: var(--font-size-4);
17321
+ line-height: var(--line-height-4);
17322
+ }
17290
17323
  }
17291
17324
  @media (min-width: 768px) {
17292
17325
  .rt-TableRoot:where(.sm\:rt-r-size-1) {
17293
- --table-border-radius: var(--radius-3);
17326
+ --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
17294
17327
  --table-cell-padding: var(--space-2);
17295
17328
  --table-cell-min-height: calc(36px * var(--scaling));
17296
17329
  }
@@ -17299,7 +17332,7 @@
17299
17332
  line-height: var(--line-height-2);
17300
17333
  }
17301
17334
  .rt-TableRoot:where(.sm\:rt-r-size-2) {
17302
- --table-border-radius: var(--radius-4);
17335
+ --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
17303
17336
  --table-cell-padding: var(--space-3);
17304
17337
  --table-cell-min-height: calc(44px * var(--scaling));
17305
17338
  }
@@ -17308,18 +17341,36 @@
17308
17341
  line-height: var(--line-height-2);
17309
17342
  }
17310
17343
  .rt-TableRoot:where(.sm\:rt-r-size-3) {
17311
- --table-border-radius: var(--radius-4);
17312
- --table-cell-padding: var(--space-3) var(--space-4);
17344
+ --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
17345
+ --table-cell-padding: var(--space-4);
17313
17346
  --table-cell-min-height: var(--space-8);
17314
17347
  }
17315
17348
  .rt-TableRoot:where(.sm\:rt-r-size-3) :where(.rt-TableRootTable) {
17316
17349
  font-size: var(--font-size-3);
17317
17350
  line-height: var(--line-height-3);
17318
17351
  }
17352
+ .rt-TableRoot:where(.sm\:rt-r-size-4) {
17353
+ --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
17354
+ --table-cell-padding: var(--space-5);
17355
+ --table-cell-min-height: var(--space-9);
17356
+ }
17357
+ .rt-TableRoot:where(.sm\:rt-r-size-4) :where(.rt-TableRootTable) {
17358
+ font-size: var(--font-size-3);
17359
+ line-height: var(--line-height-3);
17360
+ }
17361
+ .rt-TableRoot:where(.sm\:rt-r-size-5) {
17362
+ --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
17363
+ --table-cell-padding: var(--space-6);
17364
+ --table-cell-min-height: var(--space-10);
17365
+ }
17366
+ .rt-TableRoot:where(.sm\:rt-r-size-5) :where(.rt-TableRootTable) {
17367
+ font-size: var(--font-size-4);
17368
+ line-height: var(--line-height-4);
17369
+ }
17319
17370
  }
17320
17371
  @media (min-width: 1024px) {
17321
17372
  .rt-TableRoot:where(.md\:rt-r-size-1) {
17322
- --table-border-radius: var(--radius-3);
17373
+ --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
17323
17374
  --table-cell-padding: var(--space-2);
17324
17375
  --table-cell-min-height: calc(36px * var(--scaling));
17325
17376
  }
@@ -17328,7 +17379,7 @@
17328
17379
  line-height: var(--line-height-2);
17329
17380
  }
17330
17381
  .rt-TableRoot:where(.md\:rt-r-size-2) {
17331
- --table-border-radius: var(--radius-4);
17382
+ --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
17332
17383
  --table-cell-padding: var(--space-3);
17333
17384
  --table-cell-min-height: calc(44px * var(--scaling));
17334
17385
  }
@@ -17337,18 +17388,36 @@
17337
17388
  line-height: var(--line-height-2);
17338
17389
  }
17339
17390
  .rt-TableRoot:where(.md\:rt-r-size-3) {
17340
- --table-border-radius: var(--radius-4);
17341
- --table-cell-padding: var(--space-3) var(--space-4);
17391
+ --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
17392
+ --table-cell-padding: var(--space-4);
17342
17393
  --table-cell-min-height: var(--space-8);
17343
17394
  }
17344
17395
  .rt-TableRoot:where(.md\:rt-r-size-3) :where(.rt-TableRootTable) {
17345
17396
  font-size: var(--font-size-3);
17346
17397
  line-height: var(--line-height-3);
17347
17398
  }
17399
+ .rt-TableRoot:where(.md\:rt-r-size-4) {
17400
+ --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
17401
+ --table-cell-padding: var(--space-5);
17402
+ --table-cell-min-height: var(--space-9);
17403
+ }
17404
+ .rt-TableRoot:where(.md\:rt-r-size-4) :where(.rt-TableRootTable) {
17405
+ font-size: var(--font-size-3);
17406
+ line-height: var(--line-height-3);
17407
+ }
17408
+ .rt-TableRoot:where(.md\:rt-r-size-5) {
17409
+ --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
17410
+ --table-cell-padding: var(--space-6);
17411
+ --table-cell-min-height: var(--space-10);
17412
+ }
17413
+ .rt-TableRoot:where(.md\:rt-r-size-5) :where(.rt-TableRootTable) {
17414
+ font-size: var(--font-size-4);
17415
+ line-height: var(--line-height-4);
17416
+ }
17348
17417
  }
17349
17418
  @media (min-width: 1280px) {
17350
17419
  .rt-TableRoot:where(.lg\:rt-r-size-1) {
17351
- --table-border-radius: var(--radius-3);
17420
+ --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
17352
17421
  --table-cell-padding: var(--space-2);
17353
17422
  --table-cell-min-height: calc(36px * var(--scaling));
17354
17423
  }
@@ -17357,7 +17426,7 @@
17357
17426
  line-height: var(--line-height-2);
17358
17427
  }
17359
17428
  .rt-TableRoot:where(.lg\:rt-r-size-2) {
17360
- --table-border-radius: var(--radius-4);
17429
+ --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
17361
17430
  --table-cell-padding: var(--space-3);
17362
17431
  --table-cell-min-height: calc(44px * var(--scaling));
17363
17432
  }
@@ -17366,18 +17435,36 @@
17366
17435
  line-height: var(--line-height-2);
17367
17436
  }
17368
17437
  .rt-TableRoot:where(.lg\:rt-r-size-3) {
17369
- --table-border-radius: var(--radius-4);
17370
- --table-cell-padding: var(--space-3) var(--space-4);
17438
+ --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
17439
+ --table-cell-padding: var(--space-4);
17371
17440
  --table-cell-min-height: var(--space-8);
17372
17441
  }
17373
17442
  .rt-TableRoot:where(.lg\:rt-r-size-3) :where(.rt-TableRootTable) {
17374
17443
  font-size: var(--font-size-3);
17375
17444
  line-height: var(--line-height-3);
17376
17445
  }
17446
+ .rt-TableRoot:where(.lg\:rt-r-size-4) {
17447
+ --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
17448
+ --table-cell-padding: var(--space-5);
17449
+ --table-cell-min-height: var(--space-9);
17450
+ }
17451
+ .rt-TableRoot:where(.lg\:rt-r-size-4) :where(.rt-TableRootTable) {
17452
+ font-size: var(--font-size-3);
17453
+ line-height: var(--line-height-3);
17454
+ }
17455
+ .rt-TableRoot:where(.lg\:rt-r-size-5) {
17456
+ --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
17457
+ --table-cell-padding: var(--space-6);
17458
+ --table-cell-min-height: var(--space-10);
17459
+ }
17460
+ .rt-TableRoot:where(.lg\:rt-r-size-5) :where(.rt-TableRootTable) {
17461
+ font-size: var(--font-size-4);
17462
+ line-height: var(--line-height-4);
17463
+ }
17377
17464
  }
17378
17465
  @media (min-width: 1640px) {
17379
17466
  .rt-TableRoot:where(.xl\:rt-r-size-1) {
17380
- --table-border-radius: var(--radius-3);
17467
+ --table-border-radius: min(var(--radius-5), calc(var(--radius-1) + var(--space-1)));
17381
17468
  --table-cell-padding: var(--space-2);
17382
17469
  --table-cell-min-height: calc(36px * var(--scaling));
17383
17470
  }
@@ -17386,7 +17473,7 @@
17386
17473
  line-height: var(--line-height-2);
17387
17474
  }
17388
17475
  .rt-TableRoot:where(.xl\:rt-r-size-2) {
17389
- --table-border-radius: var(--radius-4);
17476
+ --table-border-radius: min(var(--radius-6), calc(var(--radius-2) + var(--space-2)));
17390
17477
  --table-cell-padding: var(--space-3);
17391
17478
  --table-cell-min-height: calc(44px * var(--scaling));
17392
17479
  }
@@ -17395,14 +17482,32 @@
17395
17482
  line-height: var(--line-height-2);
17396
17483
  }
17397
17484
  .rt-TableRoot:where(.xl\:rt-r-size-3) {
17398
- --table-border-radius: var(--radius-4);
17399
- --table-cell-padding: var(--space-3) var(--space-4);
17485
+ --table-border-radius: min(var(--radius-7), calc(var(--radius-3) + var(--space-3)));
17486
+ --table-cell-padding: var(--space-4);
17400
17487
  --table-cell-min-height: var(--space-8);
17401
17488
  }
17402
17489
  .rt-TableRoot:where(.xl\:rt-r-size-3) :where(.rt-TableRootTable) {
17403
17490
  font-size: var(--font-size-3);
17404
17491
  line-height: var(--line-height-3);
17405
17492
  }
17493
+ .rt-TableRoot:where(.xl\:rt-r-size-4) {
17494
+ --table-border-radius: min(var(--radius-8), calc(var(--radius-4) + var(--space-4)));
17495
+ --table-cell-padding: var(--space-5);
17496
+ --table-cell-min-height: var(--space-9);
17497
+ }
17498
+ .rt-TableRoot:where(.xl\:rt-r-size-4) :where(.rt-TableRootTable) {
17499
+ font-size: var(--font-size-3);
17500
+ line-height: var(--line-height-3);
17501
+ }
17502
+ .rt-TableRoot:where(.xl\:rt-r-size-5) {
17503
+ --table-border-radius: min(var(--radius-9), calc(var(--radius-5) + var(--space-5)));
17504
+ --table-cell-padding: var(--space-6);
17505
+ --table-cell-min-height: var(--space-10);
17506
+ }
17507
+ .rt-TableRoot:where(.xl\:rt-r-size-5) :where(.rt-TableRootTable) {
17508
+ font-size: var(--font-size-4);
17509
+ line-height: var(--line-height-4);
17510
+ }
17406
17511
  }
17407
17512
  .rt-TableRoot:where(.rt-variant-surface) {
17408
17513
  box-sizing: border-box;