@ecopages/radiant-ui 0.1.0-beta.7 → 0.1.0-beta.8

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 (264) hide show
  1. package/README.md +1 -1
  2. package/dist/components/ui/alert/alert.css +88 -50
  3. package/dist/components/ui/alert/alert.d.ts +43 -5
  4. package/dist/components/ui/alert/alert.script.d.ts +51 -4
  5. package/dist/components/ui/alert/index.d.ts +2 -2
  6. package/dist/components/ui/alert/index.js +1 -1
  7. package/dist/components/ui/alert/index.js.map +4 -4
  8. package/dist/components/ui/autocomplete/autocomplete.css +4 -4
  9. package/dist/components/ui/autocomplete/autocomplete.d.ts +15 -5
  10. package/dist/components/ui/autocomplete/autocomplete.script.d.ts +9 -0
  11. package/dist/components/ui/autocomplete/index.js +1 -1
  12. package/dist/components/ui/autocomplete/index.js.map +4 -4
  13. package/dist/components/ui/avatar/avatar.d.ts +15 -1
  14. package/dist/components/ui/avatar/index.js +1 -1
  15. package/dist/components/ui/avatar/index.js.map +4 -4
  16. package/dist/components/ui/breadcrumb/breadcrumb.d.ts +32 -6
  17. package/dist/components/ui/breadcrumb/index.js +1 -1
  18. package/dist/components/ui/breadcrumb/index.js.map +4 -4
  19. package/dist/{styles/components → components/ui/button}/button.css +45 -31
  20. package/dist/components/ui/button/button.d.ts +21 -4
  21. package/dist/components/ui/button-group/button-group.d.ts +7 -1
  22. package/dist/components/ui/button-group/index.js +1 -1
  23. package/dist/components/ui/button-group/index.js.map +4 -4
  24. package/dist/components/ui/calendar/calendar.css +7 -7
  25. package/dist/components/ui/calendar/calendar.d.ts +3 -2
  26. package/dist/components/ui/calendar/calendar.script.d.ts +39 -1
  27. package/dist/components/ui/calendar/index.js +1 -1
  28. package/dist/components/ui/calendar/index.js.map +4 -4
  29. package/dist/components/ui/carousel/carousel.d.ts +32 -6
  30. package/dist/components/ui/carousel/carousel.script.d.ts +44 -0
  31. package/dist/components/ui/carousel/index.js +1 -1
  32. package/dist/components/ui/carousel/index.js.map +4 -4
  33. package/dist/components/ui/checkbox/checkbox.css +1 -1
  34. package/dist/components/ui/checkbox/checkbox.d.ts +3 -2
  35. package/dist/components/ui/checkbox/checkbox.script.d.ts +4 -0
  36. package/dist/components/ui/checkbox/index.js +1 -1
  37. package/dist/components/ui/checkbox/index.js.map +4 -4
  38. package/dist/components/ui/chip/chip.d.ts +8 -0
  39. package/dist/components/ui/chip/index.js +1 -1
  40. package/dist/components/ui/chip/index.js.map +4 -4
  41. package/dist/components/ui/chip-list/chip-list.d.ts +10 -2
  42. package/dist/components/ui/chip-list/index.js +1 -1
  43. package/dist/components/ui/chip-list/index.js.map +4 -4
  44. package/dist/components/ui/combobox/combobox.css +39 -1
  45. package/dist/components/ui/combobox/combobox.d.ts +15 -5
  46. package/dist/components/ui/combobox/combobox.script.d.ts +13 -1
  47. package/dist/components/ui/combobox/index.js +1 -1
  48. package/dist/components/ui/combobox/index.js.map +4 -4
  49. package/dist/components/ui/cycle-toggle/cycle-toggle.css +15 -0
  50. package/dist/components/ui/cycle-toggle/cycle-toggle.d.ts +29 -0
  51. package/dist/components/ui/cycle-toggle/cycle-toggle.script.d.ts +61 -0
  52. package/dist/components/ui/cycle-toggle/index.d.ts +5 -0
  53. package/dist/components/ui/cycle-toggle/index.js +2 -0
  54. package/dist/components/ui/cycle-toggle/index.js.map +7 -0
  55. package/dist/components/ui/cycle-toggle/theme-preference-icons.d.ts +12 -0
  56. package/dist/components/ui/date-field/date-field.css +37 -0
  57. package/dist/components/ui/date-field/date-field.d.ts +22 -3
  58. package/dist/components/ui/date-field/date-field.script.d.ts +29 -5
  59. package/dist/components/ui/date-field/index.d.ts +1 -1
  60. package/dist/components/ui/date-field/index.js +1 -1
  61. package/dist/components/ui/date-field/index.js.map +4 -4
  62. package/dist/components/ui/date-range-picker/date-range-picker.css +37 -0
  63. package/dist/components/ui/date-range-picker/date-range-picker.d.ts +37 -4
  64. package/dist/components/ui/date-range-picker/date-range-picker.script.d.ts +31 -5
  65. package/dist/components/ui/date-range-picker/index.d.ts +1 -1
  66. package/dist/components/ui/date-range-picker/index.js +1 -1
  67. package/dist/components/ui/date-range-picker/index.js.map +4 -4
  68. package/dist/components/ui/dialog/dialog.css +1 -1
  69. package/dist/components/ui/dialog/dialog.d.ts +30 -5
  70. package/dist/components/ui/dialog/dialog.script.d.ts +3 -0
  71. package/dist/components/ui/dialog/index.js +1 -1
  72. package/dist/components/ui/dialog/index.js.map +4 -4
  73. package/dist/components/ui/disclosure/disclosure-group.css +1 -1
  74. package/dist/components/ui/disclosure/disclosure-group.script.d.ts +6 -0
  75. package/dist/components/ui/disclosure/disclosure.d.ts +26 -7
  76. package/dist/components/ui/disclosure/disclosure.script.d.ts +5 -0
  77. package/dist/components/ui/disclosure/index.js +1 -1
  78. package/dist/components/ui/disclosure/index.js.map +4 -4
  79. package/dist/components/ui/feed/feed.d.ts +37 -7
  80. package/dist/components/ui/feed/index.js +1 -1
  81. package/dist/components/ui/feed/index.js.map +4 -4
  82. package/dist/components/ui/field/field-description.d.ts +5 -1
  83. package/dist/components/ui/field/field-error.d.ts +5 -0
  84. package/dist/components/ui/field/field.d.ts +8 -1
  85. package/dist/components/ui/field/field.script.d.ts +35 -0
  86. package/dist/components/ui/field/index.js +1 -1
  87. package/dist/components/ui/field/index.js.map +4 -4
  88. package/dist/components/ui/form/control-protocol.d.ts +6 -0
  89. package/dist/components/ui/form/form.d.ts +2 -1
  90. package/dist/components/ui/form/form.script.d.ts +16 -1
  91. package/dist/components/ui/form/index.d.ts +1 -1
  92. package/dist/components/ui/form/index.js +1 -1
  93. package/dist/components/ui/form/index.js.map +4 -4
  94. package/dist/components/ui/grid/grid.d.ts +12 -2
  95. package/dist/components/ui/grid/grid.script.d.ts +14 -0
  96. package/dist/components/ui/grid/index.js +1 -1
  97. package/dist/components/ui/grid/index.js.map +4 -4
  98. package/dist/components/ui/heading/heading.d.ts +26 -4
  99. package/dist/components/ui/heading/index.js +1 -1
  100. package/dist/components/ui/heading/index.js.map +4 -4
  101. package/dist/components/ui/headline/headline.d.ts +9 -1
  102. package/dist/components/ui/headline/index.js +1 -1
  103. package/dist/components/ui/headline/index.js.map +4 -4
  104. package/dist/components/ui/input/index.d.ts +1 -1
  105. package/dist/components/ui/input/index.js +1 -1
  106. package/dist/components/ui/input/index.js.map +4 -4
  107. package/dist/components/ui/input/input.css +2 -7
  108. package/dist/components/ui/input/input.d.ts +7 -2
  109. package/dist/components/ui/label/index.js +1 -1
  110. package/dist/components/ui/label/index.js.map +4 -4
  111. package/dist/components/ui/label/label.d.ts +8 -1
  112. package/dist/components/ui/listbox/index.js +1 -1
  113. package/dist/components/ui/listbox/index.js.map +4 -4
  114. package/dist/components/ui/listbox/listbox.css +2 -5
  115. package/dist/components/ui/listbox/listbox.d.ts +7 -3
  116. package/dist/components/ui/listbox/listbox.script.d.ts +14 -1
  117. package/dist/components/ui/menu-button/index.d.ts +1 -1
  118. package/dist/components/ui/menu-button/index.js +1 -1
  119. package/dist/components/ui/menu-button/index.js.map +4 -4
  120. package/dist/components/ui/menu-button/menu-button.css +2 -2
  121. package/dist/components/ui/menu-button/menu-button.d.ts +27 -5
  122. package/dist/components/ui/menu-button/menu-button.script.d.ts +8 -3
  123. package/dist/components/ui/menubar/index.js +1 -1
  124. package/dist/components/ui/menubar/index.js.map +4 -4
  125. package/dist/components/ui/menubar/menubar.css +4 -4
  126. package/dist/components/ui/menubar/menubar.d.ts +14 -2
  127. package/dist/components/ui/menubar/menubar.script.d.ts +10 -1
  128. package/dist/components/ui/meter/index.js +1 -1
  129. package/dist/components/ui/meter/index.js.map +4 -4
  130. package/dist/components/ui/meter/meter.css +1 -1
  131. package/dist/components/ui/meter/meter.d.ts +7 -2
  132. package/dist/components/ui/meter/meter.script.d.ts +21 -0
  133. package/dist/components/ui/navigation-menu/index.js +1 -1
  134. package/dist/components/ui/navigation-menu/index.js.map +4 -4
  135. package/dist/components/ui/navigation-menu/navigation-menu.css +2 -2
  136. package/dist/components/ui/navigation-menu/navigation-menu.d.ts +3 -2
  137. package/dist/components/ui/navigation-menu/navigation-menu.script.d.ts +4 -0
  138. package/dist/components/ui/number-field/index.d.ts +1 -1
  139. package/dist/components/ui/number-field/index.js +1 -1
  140. package/dist/components/ui/number-field/index.js.map +4 -4
  141. package/dist/components/ui/number-field/number-field.css +18 -3
  142. package/dist/components/ui/number-field/number-field.d.ts +36 -8
  143. package/dist/components/ui/number-field/number-field.script.d.ts +28 -1
  144. package/dist/components/ui/popover/index.js +1 -1
  145. package/dist/components/ui/popover/index.js.map +4 -4
  146. package/dist/components/ui/popover/popover.d.ts +5 -4
  147. package/dist/components/ui/popover/popover.script.d.ts +4 -0
  148. package/dist/components/ui/radio-group/index.d.ts +1 -1
  149. package/dist/components/ui/radio-group/index.js +1 -1
  150. package/dist/components/ui/radio-group/index.js.map +4 -4
  151. package/dist/components/ui/radio-group/radio-group.d.ts +29 -4
  152. package/dist/components/ui/radio-group/radio-group.script.d.ts +14 -9
  153. package/dist/components/ui/select/index.js +1 -1
  154. package/dist/components/ui/select/index.js.map +4 -4
  155. package/dist/components/ui/select/select.css +48 -6
  156. package/dist/components/ui/select/select.d.ts +29 -8
  157. package/dist/components/ui/select/select.script.d.ts +7 -0
  158. package/dist/components/ui/sidebar/index.js +1 -1
  159. package/dist/components/ui/sidebar/index.js.map +4 -4
  160. package/dist/components/ui/sidebar/sidebar-trigger.script.d.ts +4 -0
  161. package/dist/components/ui/sidebar/sidebar.css +41 -24
  162. package/dist/components/ui/sidebar/sidebar.d.ts +68 -14
  163. package/dist/components/ui/sidebar/sidebar.docs.css +5 -2
  164. package/dist/components/ui/sidebar/sidebar.script.d.ts +9 -0
  165. package/dist/components/ui/slider/index.js +1 -1
  166. package/dist/components/ui/slider/index.js.map +4 -4
  167. package/dist/components/ui/slider/slider.d.ts +2 -1
  168. package/dist/components/ui/slider/slider.script.d.ts +29 -1
  169. package/dist/components/ui/switch/index.js +1 -1
  170. package/dist/components/ui/switch/index.js.map +4 -4
  171. package/dist/components/ui/switch/switch.css +3 -3
  172. package/dist/components/ui/switch/switch.d.ts +11 -2
  173. package/dist/components/ui/switch/switch.script.d.ts +5 -0
  174. package/dist/components/ui/tabs/index.js +1 -1
  175. package/dist/components/ui/tabs/index.js.map +4 -4
  176. package/dist/components/ui/tabs/tabs.css +9 -10
  177. package/dist/components/ui/tabs/tabs.d.ts +30 -9
  178. package/dist/components/ui/tag-group/index.js +1 -1
  179. package/dist/components/ui/tag-group/index.js.map +4 -4
  180. package/dist/components/ui/tag-group/tag-group.css +2 -11
  181. package/dist/components/ui/tag-group/tag-group.d.ts +18 -5
  182. package/dist/components/ui/tag-group/tag-group.script.d.ts +9 -2
  183. package/dist/components/ui/textarea/index.d.ts +1 -1
  184. package/dist/components/ui/textarea/index.js +1 -1
  185. package/dist/components/ui/textarea/index.js.map +4 -4
  186. package/dist/components/ui/textarea/textarea.d.ts +7 -2
  187. package/dist/components/ui/toast/index.d.ts +1 -1
  188. package/dist/components/ui/toast/index.js +1 -1
  189. package/dist/components/ui/toast/index.js.map +4 -4
  190. package/dist/components/ui/toast/stack-layout.d.ts +18 -0
  191. package/dist/components/ui/toast/toast-context.d.ts +10 -0
  192. package/dist/components/ui/toast/toast.css +30 -9
  193. package/dist/components/ui/toast/toast.d.ts +12 -2
  194. package/dist/components/ui/toast/toast.script.d.ts +60 -4
  195. package/dist/components/ui/toast/toaster.script.d.ts +71 -2
  196. package/dist/components/ui/toc/index.js +1 -1
  197. package/dist/components/ui/toc/index.js.map +4 -4
  198. package/dist/components/ui/toc/toc.css +3 -0
  199. package/dist/components/ui/toc/toc.d.ts +2 -1
  200. package/dist/components/ui/toc/toc.script.d.ts +15 -0
  201. package/dist/components/ui/toolbar/index.js +1 -1
  202. package/dist/components/ui/toolbar/index.js.map +4 -4
  203. package/dist/components/ui/toolbar/toolbar.d.ts +3 -2
  204. package/dist/components/ui/toolbar/toolbar.script.d.ts +8 -0
  205. package/dist/components/ui/tooltip/index.js +1 -1
  206. package/dist/components/ui/tooltip/index.js.map +4 -4
  207. package/dist/components/ui/tooltip/tooltip.d.ts +3 -2
  208. package/dist/components/ui/tooltip/tooltip.script.d.ts +3 -0
  209. package/dist/components/ui/tree/index.js +1 -1
  210. package/dist/components/ui/tree/index.js.map +4 -4
  211. package/dist/components/ui/tree/tree.d.ts +12 -2
  212. package/dist/components/ui/tree/tree.script.d.ts +18 -1
  213. package/dist/components/ui/treegrid/index.js +1 -1
  214. package/dist/components/ui/treegrid/index.js.map +4 -4
  215. package/dist/components/ui/treegrid/treegrid.d.ts +15 -2
  216. package/dist/components/ui/treegrid/treegrid.script.d.ts +22 -1
  217. package/dist/components/ui/window-splitter/index.js +1 -1
  218. package/dist/components/ui/window-splitter/index.js.map +4 -4
  219. package/dist/components/ui/window-splitter/window-splitter.css +1 -1
  220. package/dist/components/ui/window-splitter/window-splitter.d.ts +3 -2
  221. package/dist/components/ui/window-splitter/window-splitter.script.d.ts +22 -0
  222. package/dist/index.d.ts +1 -0
  223. package/dist/index.js +1 -1
  224. package/dist/index.js.map +4 -4
  225. package/dist/lib/cycle-value.d.ts +8 -0
  226. package/dist/lib/intl-number/range.d.ts +8 -0
  227. package/dist/styles/radiant-ui-core.css +110 -341
  228. package/dist/styles/radiant-ui.css +413 -377
  229. package/dist/styles/styles.css +839 -2731
  230. package/dist/styles/tailwind.css +626 -530
  231. package/dist/styles/tokens/colors/aurora.css +2 -2
  232. package/dist/styles/tokens/colors/basalt.css +2 -1
  233. package/dist/styles/tokens/colors/glacier.css +2 -1
  234. package/dist/styles/tokens/presets/colors/aurora.css +42 -14
  235. package/dist/styles/tokens/presets/colors/basalt.css +28 -0
  236. package/dist/styles/tokens/presets/colors/ember.css +28 -0
  237. package/dist/styles/tokens/presets/colors/glacier.css +28 -0
  238. package/dist/styles/tokens/semantic.css +22 -2
  239. package/dist/styles/tokens/spacing/compact.css +12 -12
  240. package/package.json +21 -8
  241. package/dist/components/ui/dialog/dialog-registry.test.d.ts +0 -1
  242. package/dist/components/ui/field/field-ssr-hydration.test.d.ts +0 -1
  243. package/dist/components/ui/form/form-field.test.d.ts +0 -4
  244. package/dist/components/ui/form/form-store.test.d.ts +0 -1
  245. package/dist/components/ui/shared/collection-navigation.test.d.ts +0 -1
  246. package/dist/components/ui/shared/floating-position.test.d.ts +0 -1
  247. package/dist/components/ui/shared/listbox-popover-behavior.test.d.ts +0 -1
  248. package/dist/components/ui/shared/popover-controller.test.d.ts +0 -1
  249. package/dist/components/ui/shared/portal.test.d.ts +0 -1
  250. package/dist/components/ui/sidebar/sidebar.ssr.test.d.ts +0 -2
  251. package/dist/components/ui/sidebar/sidebar.test.d.ts +0 -1
  252. package/dist/components/ui/toast/toast.test.d.ts +0 -2
  253. package/dist/components/ui/toc/toc-helpers.test.d.ts +0 -1
  254. package/dist/components/ui/toc/toc.ssr.test.d.ts +0 -1
  255. package/dist/components/ui/toc/toc.test.d.ts +0 -1
  256. package/dist/lib/intl-date/parts.test.d.ts +0 -1
  257. package/dist/lib/intl-date/segments.test.d.ts +0 -1
  258. package/dist/lib/intl-date/selection.test.d.ts +0 -1
  259. package/dist/lib/mask/date-mask.test.d.ts +0 -1
  260. package/dist/lib/mask/input-mask.test.d.ts +0 -1
  261. package/dist/lib/radiant-view.d.ts +0 -43
  262. package/dist/lib/text-filter.test.d.ts +0 -1
  263. package/dist/styles/tokens/presets/radius.css +0 -45
  264. package/dist/styles/tokens/presets/spacing.css +0 -57
package/dist/styles/styles.css CHANGED
@@ -1,1857 +1,357 @@
1
1
  /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
2
2
  @layer properties;
3
+ rui-alert {
4
+ display: block;
5
+ }
3
6
  @layer components {
4
- .rui-button {
5
- display: inline-flex;
6
- height: fit-content;
7
- width: fit-content;
8
- align-items: center;
9
- justify-content: center;
10
- gap: var(--spacing-2, var(--space-2));
11
- border-radius: var(--radius-button, var(--radius-control));
12
- border-style: var(--tw-border-style);
13
- border-width: 1px;
14
- border-color: transparent;
7
+ .rui-alert {
8
+ position: relative;
9
+ border-radius: var(--radius-container, var(--radius-container));
15
10
  font-size: var(--text-sm, var(--text-sm));
16
11
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
17
- --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
18
- font-weight: var(--font-weight-medium, var(--weight-medium));
19
- transition-property: background-color,color,box-shadow;
20
- transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
21
- transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
22
- --tw-duration: 300ms;
23
- transition-duration: 300ms;
24
- --tw-ease: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
25
- transition-timing-function: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
26
- cursor: pointer;
27
- white-space: nowrap;
12
+ --tw-shadow: var(--shadow-control);
13
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
28
14
  }
29
- .rui-button > svg {
30
- pointer-events: none;
15
+ .rui-alert--inline {
16
+ display: flex;
17
+ align-items: center;
18
+ gap: var(--spacing-inline, var(--space-inline));
19
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
20
+ padding-block: var(--spacing-control-y, var(--space-control-y));
31
21
  }
32
- .rui-button:focus-visible {
33
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
34
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
35
- --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
36
- --tw-outline-style: none;
37
- outline-style: none;
38
- @media (forced-colors: active) {
39
- outline: 2px solid transparent;
40
- outline-offset: 2px;
41
- }
22
+ .rui-alert--inline.rui-alert--dismissible {
23
+ padding-right: calc(var(--spacing, 0.25rem) * 2.5);
42
24
  }
43
- .rui-button:disabled {
44
- cursor: not-allowed;
45
- opacity: 50%;
25
+ .rui-alert__icon {
26
+ display: inline-flex;
27
+ flex-shrink: 0;
28
+ align-items: center;
29
+ justify-content: center;
46
30
  }
47
- .rui-button--filled {
48
- background-color: var(--color-primary, var(--primary));
49
- @media (forced-colors: active) {
50
- background-image: none;
51
- }
52
- @media (forced-colors: active) {
53
- background-image: none;
54
- }
55
- @media (forced-colors: active) {
56
- background-image: none;
57
- }
58
- @media (forced-colors: active) {
59
- background-image: none;
60
- }
61
- @media (forced-colors: active) {
62
- background-image: none;
63
- }
64
- @media (forced-colors: active) {
65
- background-image: none;
66
- }
67
- @media (forced-colors: active) {
68
- background-image: none;
69
- }
70
- @media (forced-colors: active) {
71
- background-image: none;
72
- }
73
- @media (forced-colors: active) {
74
- background-image: none;
75
- }
76
- @media (forced-colors: active) {
77
- background-image: none;
78
- }
79
- @media (forced-colors: active) {
80
- background-image: none;
81
- }
82
- @media (forced-colors: active) {
83
- background-image: none;
84
- }
85
- @media (forced-colors: active) {
86
- background-image: none;
87
- }
88
- @media (forced-colors: active) {
89
- background-image: none;
90
- }
91
- @media (forced-colors: active) {
92
- background-image: none;
93
- }
94
- @media (forced-colors: active) {
95
- background-image: none;
96
- }
97
- @media (forced-colors: active) {
98
- background-image: none;
99
- }
100
- @media (forced-colors: active) {
101
- background-image: none;
102
- }
103
- @media (forced-colors: active) {
104
- background-image: none;
105
- }
106
- @media (forced-colors: active) {
107
- background-image: none;
108
- }
109
- @media (forced-colors: active) {
110
- background-image: none;
111
- }
112
- @media (forced-colors: active) {
113
- background-image: none;
114
- }
115
- @media (forced-colors: active) {
116
- background-image: none;
117
- }
118
- @media (forced-colors: active) {
119
- background-image: none;
120
- }
121
- @media (forced-colors: active) {
122
- background-image: none;
123
- }
124
- @media (forced-colors: active) {
125
- background-image: none;
126
- }
127
- @media (forced-colors: active) {
128
- background-image: none;
129
- }
130
- @media (forced-colors: active) {
131
- background-image: none;
132
- }
133
- @media (forced-colors: active) {
134
- background-image: none;
135
- }
136
- @media (forced-colors: active) {
137
- background-image: none;
138
- }
139
- @media (forced-colors: active) {
140
- background-image: none;
141
- }
142
- @media (forced-colors: active) {
143
- background-image: none;
144
- }
145
- @media (forced-colors: active) {
146
- background-image: none;
147
- }
148
- @media (forced-colors: active) {
149
- background-image: none;
150
- }
151
- @media (forced-colors: active) {
152
- background-image: none;
153
- }
154
- @media (forced-colors: active) {
155
- background-image: none;
156
- }
157
- @media (forced-colors: active) {
158
- background-image: none;
31
+ .rui-alert--banner {
32
+ margin-top: var(--spacing-stack, var(--space-stack));
33
+ display: flex;
34
+ flex-direction: column;
35
+ padding-block: var(--spacing-control-y, var(--space-control-y));
36
+ padding-right: var(--spacing-control-x, var(--space-control-x));
37
+ padding-left: var(--spacing-6, var(--space-6));
38
+ &::before {
39
+ content: '';
40
+ position: absolute;
41
+ top: var(--spacing-2, var(--space-2));
42
+ bottom: var(--spacing-2, var(--space-2));
43
+ left: var(--spacing-2, var(--space-2));
44
+ width: var(--spacing-1, var(--space-1));
45
+ border-radius: var(--radius-full, var(--border-radius-full));
46
+ background-color: currentcolor;
47
+ opacity: 50%;
159
48
  }
160
- @media (forced-colors: active) {
161
- background-image: none;
49
+ }
50
+ .rui-alert--banner.rui-alert--dismissible {
51
+ padding-right: calc(var(--spacing, 0.25rem) * 11);
52
+ }
53
+ .rui-alert__close {
54
+ display: inline-flex;
55
+ width: calc(var(--spacing, 0.25rem) * 7);
56
+ height: calc(var(--spacing, 0.25rem) * 7);
57
+ flex-shrink: 0;
58
+ cursor: pointer;
59
+ align-items: center;
60
+ justify-content: center;
61
+ border-radius: var(--radius-control, var(--radius-control));
62
+ color: currentcolor;
63
+ opacity: 65%;
64
+ transition-property: opacity;
65
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
66
+ transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
67
+ &:hover {
68
+ @media (hover: hover) {
69
+ opacity: 100%;
70
+ }
162
71
  }
163
- @media (forced-colors: active) {
164
- background-image: none;
72
+ &:focus-visible {
73
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
74
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
165
75
  }
166
- @media (forced-colors: active) {
167
- background-image: none;
76
+ &:focus-visible {
77
+ --tw-ring-color: currentcolor;
78
+ @supports (color: color-mix(in lab, red, red)) {
79
+ --tw-ring-color: color-mix(in oklab, currentcolor 35%, transparent);
80
+ }
168
81
  }
169
- @media (forced-colors: active) {
170
- background-image: none;
82
+ &:focus-visible {
83
+ --tw-outline-style: none;
84
+ outline-style: none;
171
85
  }
172
- @media (forced-colors: active) {
173
- background-image: none;
86
+ }
87
+ .rui-alert--inline .rui-alert__close {
88
+ margin-left: auto;
89
+ }
90
+ .rui-alert--banner .rui-alert__close {
91
+ position: absolute;
92
+ top: calc(var(--spacing, 0.25rem) * 2.5);
93
+ right: calc(var(--spacing, 0.25rem) * 2.5);
94
+ }
95
+ .rui-alert__title {
96
+ margin-bottom: 0px;
97
+ --tw-font-weight: var(--font-weight-bold, 700);
98
+ font-weight: var(--font-weight-bold, 700);
99
+ }
100
+ .rui-alert__description p {
101
+ margin-block: var(--spacing-1, var(--space-1));
102
+ }
103
+ .rui-alert--info {
104
+ border-style: var(--tw-border-style);
105
+ border-width: 1px;
106
+ border-color: var(--color-info, var(--info));
107
+ @supports (color: color-mix(in lab, red, red)) {
108
+ border-color: color-mix(in oklab, var(--color-info, var(--info)) 30%, transparent);
174
109
  }
175
- @media (forced-colors: active) {
176
- background-image: none;
110
+ background-color: var(--color-info-container, var(--info-container));
111
+ color: var(--color-on-info-container, var(--on-info-container));
112
+ }
113
+ .rui-alert--info.rui-alert--banner::before {
114
+ background-color: var(--color-info, var(--info));
115
+ opacity: 100%;
116
+ }
117
+ .rui-alert--success {
118
+ border-style: var(--tw-border-style);
119
+ border-width: 1px;
120
+ border-color: var(--color-success, var(--success));
121
+ @supports (color: color-mix(in lab, red, red)) {
122
+ border-color: color-mix(in oklab, var(--color-success, var(--success)) 30%, transparent);
177
123
  }
178
- @media (forced-colors: active) {
179
- background-image: none;
124
+ background-color: var(--color-success-container, var(--success-container));
125
+ color: var(--color-on-success-container, var(--on-success-container));
126
+ }
127
+ .rui-alert--success.rui-alert--banner::before {
128
+ background-color: var(--color-success, var(--success));
129
+ opacity: 100%;
130
+ }
131
+ .rui-alert--warning {
132
+ border-style: var(--tw-border-style);
133
+ border-width: 1px;
134
+ border-color: var(--color-warning, var(--warning));
135
+ @supports (color: color-mix(in lab, red, red)) {
136
+ border-color: color-mix(in oklab, var(--color-warning, var(--warning)) 30%, transparent);
180
137
  }
181
- @media (forced-colors: active) {
182
- background-image: none;
138
+ background-color: var(--color-warning-container, var(--warning-container));
139
+ color: var(--color-on-warning-container, var(--on-warning-container));
140
+ }
141
+ .rui-alert--warning.rui-alert--banner::before {
142
+ background-color: var(--color-warning, var(--warning));
143
+ opacity: 100%;
144
+ }
145
+ .rui-alert--error {
146
+ border-style: var(--tw-border-style);
147
+ border-width: 1px;
148
+ border-color: var(--color-error, var(--error));
149
+ @supports (color: color-mix(in lab, red, red)) {
150
+ border-color: color-mix(in oklab, var(--color-error, var(--error)) 30%, transparent);
183
151
  }
184
- @media (forced-colors: active) {
185
- background-image: none;
186
- }
187
- @media (forced-colors: active) {
188
- background-image: none;
189
- }
190
- @media (forced-colors: active) {
191
- background-image: none;
192
- }
193
- @media (forced-colors: active) {
194
- background-image: none;
195
- }
196
- @media (forced-colors: active) {
197
- background-image: none;
198
- }
199
- @media (forced-colors: active) {
200
- background-image: none;
201
- }
202
- @media (forced-colors: active) {
203
- background-image: none;
204
- }
205
- @media (forced-colors: active) {
206
- background-image: none;
207
- }
208
- @media (forced-colors: active) {
209
- background-image: none;
210
- }
211
- @media (forced-colors: active) {
212
- background-image: none;
213
- }
214
- @media (forced-colors: active) {
215
- background-image: none;
216
- }
217
- @media (forced-colors: active) {
218
- background-image: none;
219
- }
220
- @media (forced-colors: active) {
221
- background-image: none;
222
- }
223
- @media (forced-colors: active) {
224
- background-image: none;
225
- }
226
- @media (forced-colors: active) {
227
- background-image: none;
228
- }
229
- @media (forced-colors: active) {
230
- background-image: none;
231
- }
232
- @media (forced-colors: active) {
233
- background-image: none;
234
- }
235
- @media (forced-colors: active) {
236
- background-image: none;
237
- }
238
- @media (forced-colors: active) {
239
- background-image: none;
240
- }
241
- @media (forced-colors: active) {
242
- background-image: none;
243
- }
244
- @media (forced-colors: active) {
245
- background-image: none;
246
- }
247
- @media (forced-colors: active) {
248
- background-image: none;
249
- }
250
- @media (forced-colors: active) {
251
- background-image: none;
252
- }
253
- @media (forced-colors: active) {
254
- background-image: none;
255
- }
256
- @media (forced-colors: active) {
257
- background-image: none;
258
- }
259
- @media (forced-colors: active) {
260
- background-image: none;
261
- }
262
- @media (forced-colors: active) {
263
- background-image: none;
264
- }
265
- @media (forced-colors: active) {
266
- background-image: none;
267
- }
268
- @media (forced-colors: active) {
269
- background-image: none;
270
- }
271
- @media (forced-colors: active) {
272
- background-image: none;
273
- }
274
- @media (forced-colors: active) {
275
- background-image: none;
276
- }
277
- @media (forced-colors: active) {
278
- background-image: none;
279
- }
280
- @media (forced-colors: active) {
281
- background-image: none;
282
- }
283
- @media (forced-colors: active) {
284
- background-image: none;
285
- }
286
- @media (forced-colors: active) {
287
- background-image: none;
288
- }
289
- @media (forced-colors: active) {
290
- background-image: none;
291
- }
292
- @media (forced-colors: active) {
293
- background-image: none;
294
- }
295
- @media (forced-colors: active) {
296
- background-image: none;
297
- }
298
- @media (forced-colors: active) {
299
- background-image: none;
300
- }
301
- @media (forced-colors: active) {
302
- background-image: none;
303
- }
304
- @media (forced-colors: active) {
305
- background-image: none;
306
- }
307
- @media (forced-colors: active) {
308
- background-image: none;
309
- }
310
- @media (forced-colors: active) {
311
- background-image: none;
312
- }
313
- @media (forced-colors: active) {
314
- background-image: none;
315
- }
316
- @media (forced-colors: active) {
317
- background-image: none;
318
- }
319
- @media (forced-colors: active) {
320
- background-image: none;
321
- }
322
- @media (forced-colors: active) {
323
- background-image: none;
324
- }
325
- @media (forced-colors: active) {
326
- background-image: none;
327
- }
328
- @media (forced-colors: active) {
329
- background-image: none;
330
- }
331
- @media (forced-colors: active) {
332
- background-image: none;
333
- }
334
- @media (forced-colors: active) {
335
- background-image: none;
336
- }
337
- @media (forced-colors: active) {
338
- background-image: none;
339
- }
340
- @media (forced-colors: active) {
341
- background-image: none;
342
- }
343
- @media (forced-colors: active) {
344
- background-image: none;
345
- }
346
- @media (forced-colors: active) {
347
- background-image: none;
348
- }
349
- @media (forced-colors: active) {
350
- background-image: none;
351
- }
352
- @media (forced-colors: active) {
353
- background-image: none;
354
- }
355
- @media (forced-colors: active) {
356
- background-image: none;
357
- }
358
- @media (forced-colors: active) {
359
- background-image: none;
360
- }
361
- @media (forced-colors: active) {
362
- background-image: none;
363
- }
364
- @media (forced-colors: active) {
365
- background-image: none;
366
- }
367
- background-image: var(--sheen-image);
368
- @media (forced-colors: active) {
369
- background-image: none;
370
- }
371
- color: var(--color-on-primary, var(--on-primary));
152
+ background-color: var(--color-error-container, var(--error-container));
153
+ color: var(--color-on-error-container, var(--on-error-container));
372
154
  }
373
- .rui-button--filled:hover:not(:disabled) {
374
- background-color: var(--color-primary, var(--primary));
375
- @supports (color: color-mix(in lab, red, red)) {
376
- background-color: color-mix(in oklab, var(--color-primary, var(--primary)) 90%, transparent);
377
- }
155
+ .rui-alert--error.rui-alert--banner::before {
156
+ background-color: var(--color-error, var(--error));
157
+ opacity: 100%;
378
158
  }
379
- .rui-button--filled:active:not(:disabled) {
380
- background-color: var(--color-primary-dark, var(--primary-dark));
159
+ .rui-autocomplete {
160
+ display: flex;
161
+ min-height: 0px;
162
+ flex-direction: column;
381
163
  }
382
- .rui-button--filled[aria-pressed='true'] {
383
- background-color: var(--color-primary-dark, var(--primary-dark));
164
+ .rui-autocomplete__input {
165
+ min-width: 0px;
166
+ border-radius: var(--radius-control, var(--radius-control));
167
+ border-style: var(--tw-border-style);
168
+ border-width: 1px;
169
+ border-color: var(--color-border, var(--border));
170
+ background-color: var(--color-background, var(--background));
171
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
172
+ padding-block: var(--spacing-control-y, var(--space-control-y));
173
+ font-size: var(--text-sm, var(--text-sm));
174
+ line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
175
+ color: var(--color-on-background, var(--on-background));
176
+ --tw-outline-style: none;
177
+ outline-style: none;
178
+ }
179
+ .rui-autocomplete__input:focus-visible {
384
180
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
385
181
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
386
182
  --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
387
183
  }
388
- .rui-button--outline {
389
- border-color: var(--color-border, var(--border));
390
- background-color: transparent;
391
- color: var(--color-on-background, var(--on-background));
184
+ .rui-autocomplete__collection {
185
+ min-height: 0px;
186
+ flex: 1;
187
+ overflow: auto;
392
188
  }
393
- .rui-button--outline:hover:not(:disabled) {
394
- background-color: var(--color-surface, var(--surface));
395
- @media (forced-colors: active) {
396
- background-image: none;
397
- }
398
- @media (forced-colors: active) {
399
- background-image: none;
400
- }
401
- @media (forced-colors: active) {
402
- background-image: none;
403
- }
404
- @media (forced-colors: active) {
405
- background-image: none;
406
- }
407
- @media (forced-colors: active) {
408
- background-image: none;
409
- }
410
- @media (forced-colors: active) {
411
- background-image: none;
412
- }
413
- @media (forced-colors: active) {
414
- background-image: none;
415
- }
416
- @media (forced-colors: active) {
417
- background-image: none;
418
- }
419
- @media (forced-colors: active) {
420
- background-image: none;
421
- }
422
- @media (forced-colors: active) {
423
- background-image: none;
424
- }
425
- @media (forced-colors: active) {
426
- background-image: none;
427
- }
428
- @media (forced-colors: active) {
429
- background-image: none;
430
- }
431
- @media (forced-colors: active) {
432
- background-image: none;
433
- }
434
- @media (forced-colors: active) {
435
- background-image: none;
436
- }
437
- @media (forced-colors: active) {
438
- background-image: none;
439
- }
440
- @media (forced-colors: active) {
441
- background-image: none;
442
- }
443
- @media (forced-colors: active) {
444
- background-image: none;
445
- }
446
- @media (forced-colors: active) {
447
- background-image: none;
448
- }
449
- @media (forced-colors: active) {
450
- background-image: none;
451
- }
452
- @media (forced-colors: active) {
453
- background-image: none;
454
- }
455
- @media (forced-colors: active) {
456
- background-image: none;
457
- }
458
- @media (forced-colors: active) {
459
- background-image: none;
460
- }
461
- @media (forced-colors: active) {
462
- background-image: none;
463
- }
464
- @media (forced-colors: active) {
465
- background-image: none;
466
- }
467
- @media (forced-colors: active) {
468
- background-image: none;
469
- }
470
- @media (forced-colors: active) {
471
- background-image: none;
472
- }
473
- @media (forced-colors: active) {
474
- background-image: none;
475
- }
476
- @media (forced-colors: active) {
477
- background-image: none;
478
- }
479
- @media (forced-colors: active) {
480
- background-image: none;
481
- }
482
- @media (forced-colors: active) {
483
- background-image: none;
484
- }
485
- @media (forced-colors: active) {
486
- background-image: none;
487
- }
488
- @media (forced-colors: active) {
489
- background-image: none;
490
- }
491
- @media (forced-colors: active) {
492
- background-image: none;
493
- }
494
- @media (forced-colors: active) {
495
- background-image: none;
496
- }
497
- @media (forced-colors: active) {
498
- background-image: none;
499
- }
500
- @media (forced-colors: active) {
501
- background-image: none;
502
- }
503
- @media (forced-colors: active) {
504
- background-image: none;
505
- }
506
- @media (forced-colors: active) {
507
- background-image: none;
508
- }
509
- @media (forced-colors: active) {
510
- background-image: none;
511
- }
512
- @media (forced-colors: active) {
513
- background-image: none;
514
- }
515
- @media (forced-colors: active) {
516
- background-image: none;
517
- }
518
- @media (forced-colors: active) {
519
- background-image: none;
520
- }
521
- @media (forced-colors: active) {
522
- background-image: none;
523
- }
524
- @media (forced-colors: active) {
525
- background-image: none;
526
- }
527
- @media (forced-colors: active) {
528
- background-image: none;
529
- }
530
- @media (forced-colors: active) {
531
- background-image: none;
532
- }
533
- @media (forced-colors: active) {
534
- background-image: none;
535
- }
536
- @media (forced-colors: active) {
537
- background-image: none;
538
- }
539
- @media (forced-colors: active) {
540
- background-image: none;
541
- }
542
- @media (forced-colors: active) {
543
- background-image: none;
544
- }
545
- @media (forced-colors: active) {
546
- background-image: none;
547
- }
548
- @media (forced-colors: active) {
549
- background-image: none;
550
- }
551
- @media (forced-colors: active) {
552
- background-image: none;
553
- }
554
- @media (forced-colors: active) {
555
- background-image: none;
556
- }
557
- @media (forced-colors: active) {
558
- background-image: none;
559
- }
560
- @media (forced-colors: active) {
561
- background-image: none;
562
- }
563
- @media (forced-colors: active) {
564
- background-image: none;
565
- }
566
- @media (forced-colors: active) {
567
- background-image: none;
568
- }
569
- @media (forced-colors: active) {
570
- background-image: none;
571
- }
572
- @media (forced-colors: active) {
573
- background-image: none;
574
- }
575
- @media (forced-colors: active) {
576
- background-image: none;
577
- }
578
- @media (forced-colors: active) {
579
- background-image: none;
580
- }
581
- @media (forced-colors: active) {
582
- background-image: none;
583
- }
584
- @media (forced-colors: active) {
585
- background-image: none;
586
- }
587
- @media (forced-colors: active) {
588
- background-image: none;
589
- }
590
- @media (forced-colors: active) {
591
- background-image: none;
592
- }
593
- @media (forced-colors: active) {
594
- background-image: none;
595
- }
596
- @media (forced-colors: active) {
597
- background-image: none;
598
- }
599
- @media (forced-colors: active) {
600
- background-image: none;
601
- }
602
- @media (forced-colors: active) {
603
- background-image: none;
604
- }
605
- @media (forced-colors: active) {
606
- background-image: none;
607
- }
608
- @media (forced-colors: active) {
609
- background-image: none;
610
- }
611
- @media (forced-colors: active) {
612
- background-image: none;
613
- }
614
- @media (forced-colors: active) {
615
- background-image: none;
616
- }
617
- @media (forced-colors: active) {
618
- background-image: none;
619
- }
620
- @media (forced-colors: active) {
621
- background-image: none;
622
- }
623
- @media (forced-colors: active) {
624
- background-image: none;
625
- }
626
- @media (forced-colors: active) {
627
- background-image: none;
628
- }
629
- @media (forced-colors: active) {
630
- background-image: none;
631
- }
632
- @media (forced-colors: active) {
633
- background-image: none;
634
- }
635
- @media (forced-colors: active) {
636
- background-image: none;
637
- }
638
- @media (forced-colors: active) {
639
- background-image: none;
640
- }
641
- @media (forced-colors: active) {
642
- background-image: none;
643
- }
644
- @media (forced-colors: active) {
645
- background-image: none;
646
- }
647
- @media (forced-colors: active) {
648
- background-image: none;
649
- }
650
- @media (forced-colors: active) {
651
- background-image: none;
652
- }
653
- @media (forced-colors: active) {
654
- background-image: none;
655
- }
656
- @media (forced-colors: active) {
657
- background-image: none;
658
- }
659
- @media (forced-colors: active) {
660
- background-image: none;
661
- }
662
- @media (forced-colors: active) {
663
- background-image: none;
664
- }
665
- @media (forced-colors: active) {
666
- background-image: none;
667
- }
668
- @media (forced-colors: active) {
669
- background-image: none;
670
- }
671
- @media (forced-colors: active) {
672
- background-image: none;
673
- }
674
- @media (forced-colors: active) {
675
- background-image: none;
676
- }
677
- @media (forced-colors: active) {
678
- background-image: none;
679
- }
680
- @media (forced-colors: active) {
681
- background-image: none;
682
- }
683
- @media (forced-colors: active) {
684
- background-image: none;
685
- }
686
- @media (forced-colors: active) {
687
- background-image: none;
688
- }
689
- @media (forced-colors: active) {
690
- background-image: none;
691
- }
692
- @media (forced-colors: active) {
693
- background-image: none;
694
- }
695
- @media (forced-colors: active) {
696
- background-image: none;
697
- }
698
- @media (forced-colors: active) {
699
- background-image: none;
700
- }
701
- @media (forced-colors: active) {
702
- background-image: none;
703
- }
704
- @media (forced-colors: active) {
705
- background-image: none;
706
- }
707
- @media (forced-colors: active) {
708
- background-image: none;
709
- }
710
- @media (forced-colors: active) {
711
- background-image: none;
712
- }
713
- background-image: var(--sheen-image);
714
- @media (forced-colors: active) {
715
- background-image: none;
716
- }
717
- }
718
- .rui-button--outline:active:not(:disabled) {
719
- background-color: var(--color-surface, var(--surface));
720
- @supports (color: color-mix(in lab, red, red)) {
721
- background-color: color-mix(in oklab, var(--color-surface, var(--surface)) 80%, transparent);
722
- }
723
- @media (forced-colors: active) {
724
- background-image: none;
725
- }
726
- @media (forced-colors: active) {
727
- background-image: none;
728
- }
729
- @media (forced-colors: active) {
730
- background-image: none;
731
- }
732
- @media (forced-colors: active) {
733
- background-image: none;
734
- }
735
- @media (forced-colors: active) {
736
- background-image: none;
737
- }
738
- @media (forced-colors: active) {
739
- background-image: none;
740
- }
741
- @media (forced-colors: active) {
742
- background-image: none;
743
- }
744
- @media (forced-colors: active) {
745
- background-image: none;
746
- }
747
- @media (forced-colors: active) {
748
- background-image: none;
749
- }
750
- @media (forced-colors: active) {
751
- background-image: none;
752
- }
753
- @media (forced-colors: active) {
754
- background-image: none;
755
- }
756
- @media (forced-colors: active) {
757
- background-image: none;
758
- }
759
- @media (forced-colors: active) {
760
- background-image: none;
761
- }
762
- @media (forced-colors: active) {
763
- background-image: none;
764
- }
765
- @media (forced-colors: active) {
766
- background-image: none;
767
- }
768
- @media (forced-colors: active) {
769
- background-image: none;
770
- }
771
- @media (forced-colors: active) {
772
- background-image: none;
773
- }
774
- @media (forced-colors: active) {
775
- background-image: none;
776
- }
777
- @media (forced-colors: active) {
778
- background-image: none;
779
- }
780
- @media (forced-colors: active) {
781
- background-image: none;
782
- }
783
- @media (forced-colors: active) {
784
- background-image: none;
785
- }
786
- @media (forced-colors: active) {
787
- background-image: none;
788
- }
789
- @media (forced-colors: active) {
790
- background-image: none;
791
- }
792
- @media (forced-colors: active) {
793
- background-image: none;
794
- }
795
- @media (forced-colors: active) {
796
- background-image: none;
797
- }
798
- @media (forced-colors: active) {
799
- background-image: none;
800
- }
801
- @media (forced-colors: active) {
802
- background-image: none;
803
- }
804
- @media (forced-colors: active) {
805
- background-image: none;
806
- }
807
- @media (forced-colors: active) {
808
- background-image: none;
809
- }
810
- @media (forced-colors: active) {
811
- background-image: none;
812
- }
813
- @media (forced-colors: active) {
814
- background-image: none;
815
- }
816
- @media (forced-colors: active) {
817
- background-image: none;
818
- }
819
- @media (forced-colors: active) {
820
- background-image: none;
821
- }
822
- @media (forced-colors: active) {
823
- background-image: none;
824
- }
825
- @media (forced-colors: active) {
826
- background-image: none;
827
- }
828
- @media (forced-colors: active) {
829
- background-image: none;
830
- }
831
- @media (forced-colors: active) {
832
- background-image: none;
833
- }
834
- @media (forced-colors: active) {
835
- background-image: none;
836
- }
837
- @media (forced-colors: active) {
838
- background-image: none;
839
- }
840
- @media (forced-colors: active) {
841
- background-image: none;
842
- }
843
- @media (forced-colors: active) {
844
- background-image: none;
845
- }
846
- @media (forced-colors: active) {
847
- background-image: none;
848
- }
849
- @media (forced-colors: active) {
850
- background-image: none;
851
- }
852
- @media (forced-colors: active) {
853
- background-image: none;
854
- }
855
- @media (forced-colors: active) {
856
- background-image: none;
857
- }
858
- @media (forced-colors: active) {
859
- background-image: none;
860
- }
861
- @media (forced-colors: active) {
862
- background-image: none;
863
- }
864
- @media (forced-colors: active) {
865
- background-image: none;
866
- }
867
- @media (forced-colors: active) {
868
- background-image: none;
869
- }
870
- @media (forced-colors: active) {
871
- background-image: none;
872
- }
873
- @media (forced-colors: active) {
874
- background-image: none;
875
- }
876
- @media (forced-colors: active) {
877
- background-image: none;
878
- }
879
- @media (forced-colors: active) {
880
- background-image: none;
881
- }
882
- @media (forced-colors: active) {
883
- background-image: none;
884
- }
885
- @media (forced-colors: active) {
886
- background-image: none;
887
- }
888
- @media (forced-colors: active) {
889
- background-image: none;
890
- }
891
- @media (forced-colors: active) {
892
- background-image: none;
893
- }
894
- @media (forced-colors: active) {
895
- background-image: none;
896
- }
897
- @media (forced-colors: active) {
898
- background-image: none;
899
- }
900
- @media (forced-colors: active) {
901
- background-image: none;
902
- }
903
- @media (forced-colors: active) {
904
- background-image: none;
905
- }
906
- @media (forced-colors: active) {
907
- background-image: none;
908
- }
909
- @media (forced-colors: active) {
910
- background-image: none;
911
- }
912
- @media (forced-colors: active) {
913
- background-image: none;
914
- }
915
- @media (forced-colors: active) {
916
- background-image: none;
917
- }
918
- @media (forced-colors: active) {
919
- background-image: none;
920
- }
921
- @media (forced-colors: active) {
922
- background-image: none;
923
- }
924
- @media (forced-colors: active) {
925
- background-image: none;
926
- }
927
- @media (forced-colors: active) {
928
- background-image: none;
929
- }
930
- @media (forced-colors: active) {
931
- background-image: none;
932
- }
933
- @media (forced-colors: active) {
934
- background-image: none;
935
- }
936
- @media (forced-colors: active) {
937
- background-image: none;
938
- }
939
- @media (forced-colors: active) {
940
- background-image: none;
941
- }
942
- @media (forced-colors: active) {
943
- background-image: none;
944
- }
945
- @media (forced-colors: active) {
946
- background-image: none;
947
- }
948
- @media (forced-colors: active) {
949
- background-image: none;
950
- }
951
- @media (forced-colors: active) {
952
- background-image: none;
953
- }
954
- @media (forced-colors: active) {
955
- background-image: none;
956
- }
957
- @media (forced-colors: active) {
958
- background-image: none;
959
- }
960
- @media (forced-colors: active) {
961
- background-image: none;
962
- }
963
- @media (forced-colors: active) {
964
- background-image: none;
965
- }
966
- @media (forced-colors: active) {
967
- background-image: none;
968
- }
969
- @media (forced-colors: active) {
970
- background-image: none;
971
- }
972
- @media (forced-colors: active) {
973
- background-image: none;
974
- }
975
- @media (forced-colors: active) {
976
- background-image: none;
977
- }
978
- @media (forced-colors: active) {
979
- background-image: none;
980
- }
981
- @media (forced-colors: active) {
982
- background-image: none;
983
- }
984
- @media (forced-colors: active) {
985
- background-image: none;
986
- }
987
- @media (forced-colors: active) {
988
- background-image: none;
989
- }
990
- @media (forced-colors: active) {
991
- background-image: none;
992
- }
993
- @media (forced-colors: active) {
994
- background-image: none;
995
- }
996
- @media (forced-colors: active) {
997
- background-image: none;
998
- }
999
- @media (forced-colors: active) {
1000
- background-image: none;
1001
- }
1002
- @media (forced-colors: active) {
1003
- background-image: none;
1004
- }
1005
- @media (forced-colors: active) {
1006
- background-image: none;
1007
- }
1008
- @media (forced-colors: active) {
1009
- background-image: none;
1010
- }
1011
- @media (forced-colors: active) {
1012
- background-image: none;
1013
- }
1014
- @media (forced-colors: active) {
1015
- background-image: none;
1016
- }
1017
- @media (forced-colors: active) {
1018
- background-image: none;
1019
- }
1020
- @media (forced-colors: active) {
1021
- background-image: none;
1022
- }
1023
- @media (forced-colors: active) {
1024
- background-image: none;
1025
- }
1026
- @media (forced-colors: active) {
1027
- background-image: none;
1028
- }
1029
- @media (forced-colors: active) {
1030
- background-image: none;
1031
- }
1032
- @media (forced-colors: active) {
1033
- background-image: none;
1034
- }
1035
- @media (forced-colors: active) {
1036
- background-image: none;
1037
- }
1038
- @media (forced-colors: active) {
1039
- background-image: none;
1040
- }
1041
- background-image: var(--sheen-image);
1042
- @media (forced-colors: active) {
1043
- background-image: none;
1044
- }
1045
- }
1046
- .rui-button--outline[aria-pressed='true'] {
1047
- background-color: var(--color-background, var(--background));
1048
- @media (forced-colors: active) {
1049
- background-image: none;
1050
- }
1051
- @media (forced-colors: active) {
1052
- background-image: none;
1053
- }
1054
- @media (forced-colors: active) {
1055
- background-image: none;
1056
- }
1057
- @media (forced-colors: active) {
1058
- background-image: none;
1059
- }
1060
- @media (forced-colors: active) {
1061
- background-image: none;
1062
- }
1063
- @media (forced-colors: active) {
1064
- background-image: none;
1065
- }
1066
- @media (forced-colors: active) {
1067
- background-image: none;
1068
- }
1069
- @media (forced-colors: active) {
1070
- background-image: none;
1071
- }
1072
- @media (forced-colors: active) {
1073
- background-image: none;
1074
- }
1075
- @media (forced-colors: active) {
1076
- background-image: none;
1077
- }
1078
- @media (forced-colors: active) {
1079
- background-image: none;
1080
- }
1081
- @media (forced-colors: active) {
1082
- background-image: none;
1083
- }
1084
- @media (forced-colors: active) {
1085
- background-image: none;
1086
- }
1087
- @media (forced-colors: active) {
1088
- background-image: none;
1089
- }
1090
- @media (forced-colors: active) {
1091
- background-image: none;
1092
- }
1093
- @media (forced-colors: active) {
1094
- background-image: none;
1095
- }
1096
- @media (forced-colors: active) {
1097
- background-image: none;
1098
- }
1099
- @media (forced-colors: active) {
1100
- background-image: none;
1101
- }
1102
- @media (forced-colors: active) {
1103
- background-image: none;
1104
- }
1105
- @media (forced-colors: active) {
1106
- background-image: none;
1107
- }
1108
- @media (forced-colors: active) {
1109
- background-image: none;
1110
- }
1111
- @media (forced-colors: active) {
1112
- background-image: none;
1113
- }
1114
- @media (forced-colors: active) {
1115
- background-image: none;
1116
- }
1117
- @media (forced-colors: active) {
1118
- background-image: none;
1119
- }
1120
- @media (forced-colors: active) {
1121
- background-image: none;
1122
- }
1123
- @media (forced-colors: active) {
1124
- background-image: none;
1125
- }
1126
- @media (forced-colors: active) {
1127
- background-image: none;
1128
- }
1129
- @media (forced-colors: active) {
1130
- background-image: none;
1131
- }
1132
- @media (forced-colors: active) {
1133
- background-image: none;
1134
- }
1135
- @media (forced-colors: active) {
1136
- background-image: none;
1137
- }
1138
- @media (forced-colors: active) {
1139
- background-image: none;
1140
- }
1141
- @media (forced-colors: active) {
1142
- background-image: none;
1143
- }
1144
- @media (forced-colors: active) {
1145
- background-image: none;
1146
- }
1147
- @media (forced-colors: active) {
1148
- background-image: none;
1149
- }
1150
- @media (forced-colors: active) {
1151
- background-image: none;
1152
- }
1153
- @media (forced-colors: active) {
1154
- background-image: none;
1155
- }
1156
- @media (forced-colors: active) {
1157
- background-image: none;
1158
- }
1159
- @media (forced-colors: active) {
1160
- background-image: none;
1161
- }
1162
- @media (forced-colors: active) {
1163
- background-image: none;
1164
- }
1165
- @media (forced-colors: active) {
1166
- background-image: none;
1167
- }
1168
- @media (forced-colors: active) {
1169
- background-image: none;
1170
- }
1171
- @media (forced-colors: active) {
1172
- background-image: none;
1173
- }
1174
- @media (forced-colors: active) {
1175
- background-image: none;
1176
- }
1177
- @media (forced-colors: active) {
1178
- background-image: none;
1179
- }
1180
- @media (forced-colors: active) {
1181
- background-image: none;
1182
- }
1183
- @media (forced-colors: active) {
1184
- background-image: none;
1185
- }
1186
- @media (forced-colors: active) {
1187
- background-image: none;
1188
- }
1189
- @media (forced-colors: active) {
1190
- background-image: none;
1191
- }
1192
- @media (forced-colors: active) {
1193
- background-image: none;
1194
- }
1195
- @media (forced-colors: active) {
1196
- background-image: none;
1197
- }
1198
- @media (forced-colors: active) {
1199
- background-image: none;
1200
- }
1201
- @media (forced-colors: active) {
1202
- background-image: none;
1203
- }
1204
- @media (forced-colors: active) {
1205
- background-image: none;
1206
- }
1207
- @media (forced-colors: active) {
1208
- background-image: none;
1209
- }
1210
- @media (forced-colors: active) {
1211
- background-image: none;
1212
- }
1213
- @media (forced-colors: active) {
1214
- background-image: none;
1215
- }
1216
- @media (forced-colors: active) {
1217
- background-image: none;
1218
- }
1219
- @media (forced-colors: active) {
1220
- background-image: none;
1221
- }
1222
- @media (forced-colors: active) {
1223
- background-image: none;
1224
- }
1225
- @media (forced-colors: active) {
1226
- background-image: none;
1227
- }
1228
- @media (forced-colors: active) {
1229
- background-image: none;
1230
- }
1231
- @media (forced-colors: active) {
1232
- background-image: none;
1233
- }
1234
- @media (forced-colors: active) {
1235
- background-image: none;
1236
- }
1237
- @media (forced-colors: active) {
1238
- background-image: none;
1239
- }
1240
- @media (forced-colors: active) {
1241
- background-image: none;
1242
- }
1243
- @media (forced-colors: active) {
1244
- background-image: none;
1245
- }
1246
- @media (forced-colors: active) {
1247
- background-image: none;
1248
- }
1249
- @media (forced-colors: active) {
1250
- background-image: none;
1251
- }
1252
- @media (forced-colors: active) {
1253
- background-image: none;
1254
- }
1255
- @media (forced-colors: active) {
1256
- background-image: none;
1257
- }
1258
- @media (forced-colors: active) {
1259
- background-image: none;
1260
- }
1261
- @media (forced-colors: active) {
1262
- background-image: none;
1263
- }
1264
- @media (forced-colors: active) {
1265
- background-image: none;
1266
- }
1267
- @media (forced-colors: active) {
1268
- background-image: none;
1269
- }
1270
- @media (forced-colors: active) {
1271
- background-image: none;
1272
- }
1273
- @media (forced-colors: active) {
1274
- background-image: none;
1275
- }
1276
- @media (forced-colors: active) {
1277
- background-image: none;
1278
- }
1279
- @media (forced-colors: active) {
1280
- background-image: none;
1281
- }
1282
- @media (forced-colors: active) {
1283
- background-image: none;
1284
- }
1285
- @media (forced-colors: active) {
1286
- background-image: none;
1287
- }
1288
- @media (forced-colors: active) {
1289
- background-image: none;
1290
- }
1291
- @media (forced-colors: active) {
1292
- background-image: none;
1293
- }
1294
- @media (forced-colors: active) {
1295
- background-image: none;
1296
- }
1297
- @media (forced-colors: active) {
1298
- background-image: none;
1299
- }
1300
- @media (forced-colors: active) {
1301
- background-image: none;
1302
- }
1303
- @media (forced-colors: active) {
1304
- background-image: none;
1305
- }
1306
- @media (forced-colors: active) {
1307
- background-image: none;
1308
- }
1309
- @media (forced-colors: active) {
1310
- background-image: none;
1311
- }
1312
- @media (forced-colors: active) {
1313
- background-image: none;
1314
- }
1315
- @media (forced-colors: active) {
1316
- background-image: none;
1317
- }
1318
- @media (forced-colors: active) {
1319
- background-image: none;
1320
- }
1321
- @media (forced-colors: active) {
1322
- background-image: none;
1323
- }
1324
- @media (forced-colors: active) {
1325
- background-image: none;
1326
- }
1327
- @media (forced-colors: active) {
1328
- background-image: none;
1329
- }
1330
- @media (forced-colors: active) {
1331
- background-image: none;
1332
- }
1333
- @media (forced-colors: active) {
1334
- background-image: none;
1335
- }
1336
- @media (forced-colors: active) {
1337
- background-image: none;
1338
- }
1339
- @media (forced-colors: active) {
1340
- background-image: none;
1341
- }
1342
- @media (forced-colors: active) {
1343
- background-image: none;
1344
- }
1345
- @media (forced-colors: active) {
1346
- background-image: none;
1347
- }
1348
- @media (forced-colors: active) {
1349
- background-image: none;
1350
- }
1351
- @media (forced-colors: active) {
1352
- background-image: none;
1353
- }
1354
- @media (forced-colors: active) {
1355
- background-image: none;
1356
- }
1357
- @media (forced-colors: active) {
1358
- background-image: none;
1359
- }
1360
- @media (forced-colors: active) {
1361
- background-image: none;
1362
- }
1363
- @media (forced-colors: active) {
1364
- background-image: none;
1365
- }
1366
- background-image: var(--sheen-image);
1367
- @media (forced-colors: active) {
1368
- background-image: none;
1369
- }
1370
- --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
1371
- font-weight: var(--font-weight-medium, var(--weight-medium));
1372
- color: var(--color-on-background, var(--on-background));
1373
- --tw-shadow: var(--shadow-control);
1374
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1375
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1376
- --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
1377
- }
1378
- .rui-button--ghost {
1379
- background-color: transparent;
1380
- color: var(--color-on-surface, var(--on-surface));
1381
- }
1382
- .rui-button--ghost:hover:not(:disabled) {
1383
- background-color: var(--color-surface-container-low, var(--surface-container-low));
1384
- @media (forced-colors: active) {
1385
- background-image: none;
1386
- }
1387
- @media (forced-colors: active) {
1388
- background-image: none;
1389
- }
1390
- @media (forced-colors: active) {
1391
- background-image: none;
1392
- }
1393
- @media (forced-colors: active) {
1394
- background-image: none;
1395
- }
1396
- @media (forced-colors: active) {
1397
- background-image: none;
1398
- }
1399
- @media (forced-colors: active) {
1400
- background-image: none;
1401
- }
1402
- @media (forced-colors: active) {
1403
- background-image: none;
1404
- }
1405
- @media (forced-colors: active) {
1406
- background-image: none;
1407
- }
1408
- @media (forced-colors: active) {
1409
- background-image: none;
1410
- }
1411
- @media (forced-colors: active) {
1412
- background-image: none;
1413
- }
1414
- @media (forced-colors: active) {
1415
- background-image: none;
1416
- }
1417
- @media (forced-colors: active) {
1418
- background-image: none;
1419
- }
1420
- @media (forced-colors: active) {
1421
- background-image: none;
1422
- }
1423
- @media (forced-colors: active) {
1424
- background-image: none;
1425
- }
1426
- @media (forced-colors: active) {
1427
- background-image: none;
1428
- }
1429
- @media (forced-colors: active) {
1430
- background-image: none;
1431
- }
1432
- @media (forced-colors: active) {
1433
- background-image: none;
1434
- }
1435
- @media (forced-colors: active) {
1436
- background-image: none;
1437
- }
1438
- @media (forced-colors: active) {
1439
- background-image: none;
1440
- }
1441
- @media (forced-colors: active) {
1442
- background-image: none;
1443
- }
1444
- @media (forced-colors: active) {
1445
- background-image: none;
1446
- }
1447
- @media (forced-colors: active) {
1448
- background-image: none;
1449
- }
1450
- @media (forced-colors: active) {
1451
- background-image: none;
1452
- }
1453
- @media (forced-colors: active) {
1454
- background-image: none;
1455
- }
1456
- @media (forced-colors: active) {
1457
- background-image: none;
1458
- }
1459
- @media (forced-colors: active) {
1460
- background-image: none;
1461
- }
1462
- @media (forced-colors: active) {
1463
- background-image: none;
1464
- }
1465
- @media (forced-colors: active) {
1466
- background-image: none;
1467
- }
1468
- @media (forced-colors: active) {
1469
- background-image: none;
1470
- }
1471
- @media (forced-colors: active) {
1472
- background-image: none;
1473
- }
1474
- @media (forced-colors: active) {
1475
- background-image: none;
1476
- }
1477
- @media (forced-colors: active) {
1478
- background-image: none;
1479
- }
1480
- @media (forced-colors: active) {
1481
- background-image: none;
1482
- }
1483
- @media (forced-colors: active) {
1484
- background-image: none;
1485
- }
1486
- @media (forced-colors: active) {
1487
- background-image: none;
1488
- }
1489
- @media (forced-colors: active) {
1490
- background-image: none;
1491
- }
1492
- @media (forced-colors: active) {
1493
- background-image: none;
1494
- }
1495
- @media (forced-colors: active) {
1496
- background-image: none;
1497
- }
1498
- @media (forced-colors: active) {
1499
- background-image: none;
1500
- }
1501
- @media (forced-colors: active) {
1502
- background-image: none;
1503
- }
1504
- @media (forced-colors: active) {
1505
- background-image: none;
1506
- }
1507
- @media (forced-colors: active) {
1508
- background-image: none;
1509
- }
1510
- @media (forced-colors: active) {
1511
- background-image: none;
1512
- }
1513
- @media (forced-colors: active) {
1514
- background-image: none;
1515
- }
1516
- @media (forced-colors: active) {
1517
- background-image: none;
1518
- }
1519
- @media (forced-colors: active) {
1520
- background-image: none;
1521
- }
1522
- @media (forced-colors: active) {
1523
- background-image: none;
1524
- }
1525
- @media (forced-colors: active) {
1526
- background-image: none;
1527
- }
1528
- @media (forced-colors: active) {
1529
- background-image: none;
1530
- }
1531
- @media (forced-colors: active) {
1532
- background-image: none;
1533
- }
1534
- @media (forced-colors: active) {
1535
- background-image: none;
1536
- }
1537
- @media (forced-colors: active) {
1538
- background-image: none;
1539
- }
1540
- @media (forced-colors: active) {
1541
- background-image: none;
1542
- }
1543
- @media (forced-colors: active) {
1544
- background-image: none;
1545
- }
1546
- @media (forced-colors: active) {
1547
- background-image: none;
1548
- }
1549
- @media (forced-colors: active) {
1550
- background-image: none;
1551
- }
1552
- @media (forced-colors: active) {
1553
- background-image: none;
1554
- }
1555
- @media (forced-colors: active) {
1556
- background-image: none;
1557
- }
1558
- @media (forced-colors: active) {
1559
- background-image: none;
1560
- }
1561
- @media (forced-colors: active) {
1562
- background-image: none;
1563
- }
1564
- @media (forced-colors: active) {
1565
- background-image: none;
1566
- }
1567
- @media (forced-colors: active) {
1568
- background-image: none;
1569
- }
1570
- @media (forced-colors: active) {
1571
- background-image: none;
1572
- }
1573
- @media (forced-colors: active) {
1574
- background-image: none;
1575
- }
1576
- @media (forced-colors: active) {
1577
- background-image: none;
1578
- }
1579
- @media (forced-colors: active) {
1580
- background-image: none;
1581
- }
1582
- @media (forced-colors: active) {
1583
- background-image: none;
1584
- }
1585
- @media (forced-colors: active) {
1586
- background-image: none;
1587
- }
1588
- @media (forced-colors: active) {
1589
- background-image: none;
1590
- }
1591
- @media (forced-colors: active) {
1592
- background-image: none;
1593
- }
1594
- @media (forced-colors: active) {
1595
- background-image: none;
1596
- }
1597
- @media (forced-colors: active) {
1598
- background-image: none;
1599
- }
1600
- @media (forced-colors: active) {
1601
- background-image: none;
1602
- }
1603
- @media (forced-colors: active) {
1604
- background-image: none;
1605
- }
1606
- @media (forced-colors: active) {
1607
- background-image: none;
1608
- }
1609
- @media (forced-colors: active) {
1610
- background-image: none;
1611
- }
1612
- @media (forced-colors: active) {
1613
- background-image: none;
1614
- }
1615
- @media (forced-colors: active) {
1616
- background-image: none;
1617
- }
1618
- @media (forced-colors: active) {
1619
- background-image: none;
1620
- }
1621
- @media (forced-colors: active) {
1622
- background-image: none;
1623
- }
1624
- @media (forced-colors: active) {
1625
- background-image: none;
1626
- }
1627
- @media (forced-colors: active) {
1628
- background-image: none;
1629
- }
1630
- @media (forced-colors: active) {
1631
- background-image: none;
1632
- }
1633
- @media (forced-colors: active) {
1634
- background-image: none;
1635
- }
1636
- @media (forced-colors: active) {
1637
- background-image: none;
1638
- }
1639
- @media (forced-colors: active) {
1640
- background-image: none;
1641
- }
1642
- @media (forced-colors: active) {
1643
- background-image: none;
1644
- }
1645
- @media (forced-colors: active) {
1646
- background-image: none;
1647
- }
1648
- @media (forced-colors: active) {
1649
- background-image: none;
1650
- }
1651
- @media (forced-colors: active) {
1652
- background-image: none;
1653
- }
1654
- @media (forced-colors: active) {
1655
- background-image: none;
1656
- }
1657
- @media (forced-colors: active) {
1658
- background-image: none;
1659
- }
1660
- @media (forced-colors: active) {
1661
- background-image: none;
1662
- }
1663
- @media (forced-colors: active) {
1664
- background-image: none;
1665
- }
1666
- @media (forced-colors: active) {
1667
- background-image: none;
1668
- }
1669
- @media (forced-colors: active) {
1670
- background-image: none;
1671
- }
1672
- @media (forced-colors: active) {
1673
- background-image: none;
1674
- }
1675
- @media (forced-colors: active) {
1676
- background-image: none;
1677
- }
1678
- @media (forced-colors: active) {
1679
- background-image: none;
1680
- }
1681
- @media (forced-colors: active) {
1682
- background-image: none;
1683
- }
1684
- @media (forced-colors: active) {
1685
- background-image: none;
1686
- }
1687
- @media (forced-colors: active) {
1688
- background-image: none;
1689
- }
1690
- @media (forced-colors: active) {
1691
- background-image: none;
1692
- }
1693
- @media (forced-colors: active) {
1694
- background-image: none;
1695
- }
1696
- @media (forced-colors: active) {
1697
- background-image: none;
1698
- }
1699
- @media (forced-colors: active) {
1700
- background-image: none;
1701
- }
1702
- background-image: var(--sheen-image);
1703
- @media (forced-colors: active) {
1704
- background-image: none;
1705
- }
189
+ .rui-autocomplete__empty {
190
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
191
+ padding-block: var(--spacing-control-y, var(--space-control-y));
192
+ font-size: var(--text-sm, var(--text-sm));
193
+ line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
194
+ color: var(--color-on-surface, var(--on-surface));
1706
195
  }
1707
- .rui-button--ghost:active:not(:disabled) {
196
+ .rui-autocomplete__empty[hidden] {
197
+ display: none;
198
+ }
199
+ .rui-avatar {
200
+ position: relative;
201
+ display: inline-flex;
202
+ flex-shrink: 0;
203
+ align-items: center;
204
+ justify-content: center;
205
+ overflow: hidden;
206
+ border-radius: var(--radius-pill, var(--radius-pill));
1708
207
  background-color: var(--color-surface-container, var(--surface-container));
208
+ --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
209
+ font-weight: var(--font-weight-medium, var(--weight-medium));
210
+ color: var(--color-on-surface, var(--on-surface));
1709
211
  }
1710
- .rui-button--ghost[aria-pressed='true'] {
1711
- background-color: var(--color-background, var(--background));
212
+ .rui-avatar--sm {
213
+ width: var(--spacing-8, var(--space-8));
214
+ height: var(--spacing-8, var(--space-8));
215
+ font-size: var(--text-xs, var(--text-xs));
216
+ line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
217
+ }
218
+ .rui-avatar--md {
219
+ width: calc(var(--spacing, 0.25rem) * 10);
220
+ height: calc(var(--spacing, 0.25rem) * 10);
221
+ font-size: var(--text-sm, var(--text-sm));
222
+ line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
223
+ }
224
+ .rui-avatar--lg {
225
+ width: calc(var(--spacing, 0.25rem) * 12);
226
+ height: calc(var(--spacing, 0.25rem) * 12);
227
+ font-size: var(--text-body, var(--text-body));
228
+ }
229
+ .rui-avatar__image {
230
+ width: 100%;
231
+ height: 100%;
232
+ object-fit: cover;
233
+ }
234
+ .rui-avatar__fallback {
235
+ display: flex;
236
+ width: 100%;
237
+ height: 100%;
238
+ align-items: center;
239
+ justify-content: center;
240
+ text-transform: uppercase;
241
+ }
242
+ }
243
+ rui-breadcrumb {
244
+ display: block;
245
+ --rui-breadcrumb-separator: '/';
246
+ }
247
+ @layer components {
248
+ .rui-breadcrumb__list {
249
+ margin: 0px;
250
+ display: flex;
251
+ list-style-type: none;
252
+ flex-wrap: wrap;
253
+ align-items: center;
254
+ gap: var(--spacing-inline, var(--space-inline));
255
+ padding: 0px;
256
+ font-size: var(--text-sm, var(--text-sm));
257
+ line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
258
+ }
259
+ .rui-breadcrumb__item {
260
+ display: inline-flex;
261
+ align-items: center;
262
+ gap: var(--spacing-inline, var(--space-inline));
263
+ }
264
+ .rui-breadcrumb__link {
265
+ display: inline-flex;
266
+ align-items: center;
267
+ gap: var(--spacing-inline, var(--space-inline));
268
+ color: var(--color-primary, var(--primary));
269
+ text-underline-offset: 2px;
270
+ &:hover {
271
+ @media (hover: hover) {
272
+ text-decoration-line: underline;
273
+ }
274
+ }
275
+ }
276
+ .rui-breadcrumb__page, .rui-breadcrumb [aria-current='page'] {
1712
277
  --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
1713
278
  font-weight: var(--font-weight-medium, var(--weight-medium));
1714
279
  color: var(--color-on-background, var(--on-background));
1715
- --tw-shadow: var(--shadow-control);
1716
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1717
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1718
- --tw-ring-color: var(--color-border, var(--border));
1719
- --tw-ring-inset: inset;
1720
280
  }
1721
- .rui-button--destructive {
1722
- background-color: var(--color-error, var(--error));
1723
- @media (forced-colors: active) {
1724
- background-image: none;
1725
- }
1726
- @media (forced-colors: active) {
1727
- background-image: none;
1728
- }
1729
- @media (forced-colors: active) {
1730
- background-image: none;
1731
- }
1732
- @media (forced-colors: active) {
1733
- background-image: none;
1734
- }
1735
- @media (forced-colors: active) {
1736
- background-image: none;
1737
- }
1738
- @media (forced-colors: active) {
1739
- background-image: none;
1740
- }
1741
- @media (forced-colors: active) {
1742
- background-image: none;
1743
- }
1744
- @media (forced-colors: active) {
1745
- background-image: none;
1746
- }
1747
- @media (forced-colors: active) {
1748
- background-image: none;
1749
- }
1750
- @media (forced-colors: active) {
1751
- background-image: none;
1752
- }
1753
- @media (forced-colors: active) {
1754
- background-image: none;
1755
- }
1756
- @media (forced-colors: active) {
1757
- background-image: none;
1758
- }
1759
- @media (forced-colors: active) {
1760
- background-image: none;
1761
- }
1762
- @media (forced-colors: active) {
1763
- background-image: none;
1764
- }
1765
- @media (forced-colors: active) {
1766
- background-image: none;
1767
- }
1768
- @media (forced-colors: active) {
1769
- background-image: none;
1770
- }
1771
- @media (forced-colors: active) {
1772
- background-image: none;
1773
- }
1774
- @media (forced-colors: active) {
1775
- background-image: none;
1776
- }
1777
- @media (forced-colors: active) {
1778
- background-image: none;
1779
- }
1780
- @media (forced-colors: active) {
1781
- background-image: none;
1782
- }
1783
- @media (forced-colors: active) {
1784
- background-image: none;
1785
- }
1786
- @media (forced-colors: active) {
1787
- background-image: none;
1788
- }
1789
- @media (forced-colors: active) {
1790
- background-image: none;
1791
- }
1792
- @media (forced-colors: active) {
1793
- background-image: none;
1794
- }
1795
- @media (forced-colors: active) {
1796
- background-image: none;
1797
- }
1798
- @media (forced-colors: active) {
1799
- background-image: none;
1800
- }
1801
- @media (forced-colors: active) {
1802
- background-image: none;
1803
- }
1804
- @media (forced-colors: active) {
1805
- background-image: none;
1806
- }
1807
- @media (forced-colors: active) {
1808
- background-image: none;
1809
- }
1810
- @media (forced-colors: active) {
1811
- background-image: none;
1812
- }
1813
- @media (forced-colors: active) {
1814
- background-image: none;
1815
- }
1816
- @media (forced-colors: active) {
1817
- background-image: none;
1818
- }
1819
- @media (forced-colors: active) {
1820
- background-image: none;
1821
- }
1822
- @media (forced-colors: active) {
1823
- background-image: none;
1824
- }
1825
- @media (forced-colors: active) {
1826
- background-image: none;
1827
- }
1828
- @media (forced-colors: active) {
1829
- background-image: none;
1830
- }
1831
- @media (forced-colors: active) {
1832
- background-image: none;
1833
- }
1834
- @media (forced-colors: active) {
1835
- background-image: none;
1836
- }
1837
- @media (forced-colors: active) {
1838
- background-image: none;
1839
- }
1840
- @media (forced-colors: active) {
1841
- background-image: none;
1842
- }
1843
- @media (forced-colors: active) {
1844
- background-image: none;
1845
- }
1846
- @media (forced-colors: active) {
1847
- background-image: none;
281
+ .rui-breadcrumb__separator {
282
+ display: inline-flex;
283
+ align-items: center;
284
+ color: var(--color-on-surface, var(--on-surface));
285
+ @supports (color: color-mix(in lab, red, red)) {
286
+ color: color-mix(in oklab, var(--color-on-surface, var(--on-surface)) 60%, transparent);
1848
287
  }
1849
- @media (forced-colors: active) {
1850
- background-image: none;
288
+ }
289
+ .rui-breadcrumb__separator:empty::before {
290
+ content: var(--rui-breadcrumb-separator);
291
+ }
292
+ .rui-breadcrumb__ellipsis {
293
+ display: inline-flex;
294
+ align-items: center;
295
+ --tw-tracking: var(--tracking-widest, 0.1em);
296
+ letter-spacing: var(--tracking-widest, 0.1em);
297
+ color: var(--color-on-surface, var(--on-surface));
298
+ @supports (color: color-mix(in lab, red, red)) {
299
+ color: color-mix(in oklab, var(--color-on-surface, var(--on-surface)) 60%, transparent);
1851
300
  }
301
+ }
302
+ .rui-breadcrumb__ellipsis-label {
303
+ position: absolute;
304
+ width: 1px;
305
+ height: 1px;
306
+ padding: 0;
307
+ margin: -1px;
308
+ overflow: hidden;
309
+ clip-path: inset(50%);
310
+ white-space: nowrap;
311
+ border-width: 0;
312
+ }
313
+ .rui-button {
314
+ display: inline-flex;
315
+ width: fit-content;
316
+ align-items: center;
317
+ justify-content: center;
318
+ border-radius: var(--radius-button, var(--radius-control));
319
+ border-style: var(--tw-border-style);
320
+ border-width: 1px;
321
+ border-color: transparent;
322
+ --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
323
+ font-weight: var(--font-weight-medium, var(--weight-medium));
324
+ transition-property: background-color,color,box-shadow;
325
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
326
+ transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));
327
+ --tw-duration: 300ms;
328
+ transition-duration: 300ms;
329
+ --tw-ease: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
330
+ transition-timing-function: var(--ease-out, cubic-bezier(0, 0, 0.2, 1));
331
+ cursor: pointer;
332
+ white-space: nowrap;
333
+ gap: var(--space-inline);
334
+ }
335
+ .rui-button > svg {
336
+ pointer-events: none;
337
+ }
338
+ .rui-button:focus-visible {
339
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
340
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
341
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
342
+ --tw-outline-style: none;
343
+ outline-style: none;
1852
344
  @media (forced-colors: active) {
1853
- background-image: none;
345
+ outline: 2px solid transparent;
346
+ outline-offset: 2px;
1854
347
  }
348
+ }
349
+ .rui-button:disabled {
350
+ cursor: not-allowed;
351
+ opacity: 50%;
352
+ }
353
+ .rui-button--filled {
354
+ background-color: var(--color-primary, var(--primary));
1855
355
  @media (forced-colors: active) {
1856
356
  background-image: none;
1857
357
  }
@@ -2042,84 +542,39 @@
2042
542
  @media (forced-colors: active) {
2043
543
  background-image: none;
2044
544
  }
2045
- color: var(--color-on-error, var(--on-error));
545
+ color: var(--color-on-primary, var(--on-primary));
2046
546
  }
2047
- .rui-button--destructive:hover:not(:disabled) {
2048
- background-color: var(--color-error, var(--error));
547
+ .rui-button--filled:hover:not(:disabled) {
548
+ background-color: var(--color-primary, var(--primary));
2049
549
  @supports (color: color-mix(in lab, red, red)) {
2050
- background-color: color-mix(in oklab, var(--color-error, var(--error)) 90%, transparent);
550
+ background-color: color-mix(in oklab, var(--color-primary, var(--primary)) 90%, transparent);
2051
551
  }
2052
552
  }
2053
- .rui-button--destructive:active:not(:disabled) {
2054
- background-color: var(--color-error-dark, var(--error-dark));
2055
- }
2056
- .rui-button--sm {
2057
- padding-inline: var(--spacing-2, var(--space-2));
2058
- padding-block: var(--spacing-1, var(--space-1));
2059
- font-size: var(--text-xs, var(--text-xs));
2060
- line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
553
+ .rui-button--filled:active:not(:disabled) {
554
+ background-color: var(--color-primary-dark, var(--primary-dark));
2061
555
  }
2062
- .rui-button--md {
2063
- padding-inline: var(--spacing-4, var(--space-4));
2064
- padding-block: var(--spacing-2, var(--space-2));
2065
- font-size: var(--text-sm, var(--text-sm));
2066
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
556
+ .rui-button--filled[aria-pressed='true'] {
557
+ background-color: var(--color-primary-dark, var(--primary-dark));
558
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
559
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
560
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
2067
561
  }
2068
- .rui-button--lg {
2069
- padding-inline: var(--spacing-6, var(--space-6));
2070
- padding-block: var(--spacing-3, var(--space-3));
2071
- font-size: var(--text-base, 1rem);
2072
- line-height: var(--tw-leading, var(--text-base--line-height, calc(1.5 / 1)));
562
+ .rui-button--outline {
563
+ border-color: var(--color-border, var(--border));
564
+ background-color: transparent;
565
+ color: var(--color-on-background, var(--on-background));
2073
566
  }
2074
- .rui-button--icon {
2075
- padding: var(--spacing-2, var(--space-2));
2076
- font-size: var(--text-sm, var(--text-sm));
2077
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
567
+ .rui-button--outline:hover:not(:disabled) {
568
+ background-color: var(--color-surface, var(--surface));
2078
569
  }
2079
- .rui-button--primary {
2080
- background-color: var(--color-primary, var(--primary));
2081
- @media (forced-colors: active) {
2082
- background-image: none;
2083
- }
2084
- @media (forced-colors: active) {
2085
- background-image: none;
2086
- }
2087
- @media (forced-colors: active) {
2088
- background-image: none;
2089
- }
2090
- @media (forced-colors: active) {
2091
- background-image: none;
2092
- }
2093
- @media (forced-colors: active) {
2094
- background-image: none;
2095
- }
2096
- @media (forced-colors: active) {
2097
- background-image: none;
2098
- }
2099
- @media (forced-colors: active) {
2100
- background-image: none;
2101
- }
2102
- @media (forced-colors: active) {
2103
- background-image: none;
2104
- }
2105
- @media (forced-colors: active) {
2106
- background-image: none;
2107
- }
2108
- @media (forced-colors: active) {
2109
- background-image: none;
2110
- }
2111
- @media (forced-colors: active) {
2112
- background-image: none;
2113
- }
2114
- @media (forced-colors: active) {
2115
- background-image: none;
2116
- }
2117
- @media (forced-colors: active) {
2118
- background-image: none;
2119
- }
2120
- @media (forced-colors: active) {
2121
- background-image: none;
570
+ .rui-button--outline:active:not(:disabled) {
571
+ background-color: var(--color-surface, var(--surface));
572
+ @supports (color: color-mix(in lab, red, red)) {
573
+ background-color: color-mix(in oklab, var(--color-surface, var(--surface)) 80%, transparent);
2122
574
  }
575
+ }
576
+ .rui-button--outline[aria-pressed='true'] {
577
+ background-color: var(--color-background, var(--background));
2123
578
  @media (forced-colors: active) {
2124
579
  background-image: none;
2125
580
  }
@@ -2306,9 +761,41 @@
2306
761
  @media (forced-colors: active) {
2307
762
  background-image: none;
2308
763
  }
764
+ background-image: var(--sheen-image);
2309
765
  @media (forced-colors: active) {
2310
766
  background-image: none;
2311
767
  }
768
+ --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
769
+ font-weight: var(--font-weight-medium, var(--weight-medium));
770
+ color: var(--color-on-background, var(--on-background));
771
+ --tw-shadow: var(--shadow-control);
772
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
773
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
774
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
775
+ }
776
+ .rui-button--ghost {
777
+ background-color: transparent;
778
+ color: var(--color-on-surface, var(--on-surface));
779
+ }
780
+ .rui-button--ghost:hover:not(:disabled) {
781
+ background-color: var(--color-surface-container-low, var(--surface-container-low));
782
+ }
783
+ .rui-button--ghost:active:not(:disabled) {
784
+ background-color: var(--color-surface-container, var(--surface-container));
785
+ }
786
+ .rui-button--ghost[aria-pressed='true'] {
787
+ background-color: var(--color-background, var(--background));
788
+ --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
789
+ font-weight: var(--font-weight-medium, var(--weight-medium));
790
+ color: var(--color-on-background, var(--on-background));
791
+ --tw-shadow: var(--shadow-control);
792
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
793
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
794
+ --tw-ring-color: var(--color-border, var(--border));
795
+ --tw-ring-inset: inset;
796
+ }
797
+ .rui-button--destructive {
798
+ background-color: var(--color-error, var(--error));
2312
799
  @media (forced-colors: active) {
2313
800
  background-image: none;
2314
801
  }
@@ -2396,14 +883,9 @@
2396
883
  @media (forced-colors: active) {
2397
884
  background-image: none;
2398
885
  }
2399
- background-image: var(--sheen-image);
2400
886
  @media (forced-colors: active) {
2401
887
  background-image: none;
2402
888
  }
2403
- color: var(--color-on-primary, var(--on-primary));
2404
- }
2405
- .rui-button--secondary {
2406
- background-color: var(--color-secondary, var(--secondary));
2407
889
  @media (forced-colors: active) {
2408
890
  background-image: none;
2409
891
  }
@@ -2500,12 +982,72 @@
2500
982
  @media (forced-colors: active) {
2501
983
  background-image: none;
2502
984
  }
985
+ background-image: var(--sheen-image);
2503
986
  @media (forced-colors: active) {
2504
987
  background-image: none;
2505
988
  }
2506
- @media (forced-colors: active) {
2507
- background-image: none;
989
+ color: var(--color-on-error, var(--on-error));
990
+ }
991
+ .rui-button--destructive:hover:not(:disabled) {
992
+ background-color: var(--color-error, var(--error));
993
+ @supports (color: color-mix(in lab, red, red)) {
994
+ background-color: color-mix(in oklab, var(--color-error, var(--error)) 90%, transparent);
2508
995
  }
996
+ }
997
+ .rui-button--destructive:active:not(:disabled) {
998
+ background-color: var(--color-error-dark, var(--error-dark));
999
+ }
1000
+ .rui-button--link {
1001
+ background-color: transparent;
1002
+ --tw-font-weight: var(--font-weight-normal, 400);
1003
+ font-weight: var(--font-weight-normal, 400);
1004
+ color: var(--color-link, var(--link));
1005
+ text-decoration-line: none;
1006
+ text-underline-offset: 2px;
1007
+ }
1008
+ .rui-button--link:hover:not(:disabled), .rui-button--link:focus-visible:not(:disabled) {
1009
+ text-decoration-line: underline;
1010
+ }
1011
+ .rui-button--link:active:not(:disabled) {
1012
+ text-decoration-line: underline;
1013
+ }
1014
+ .rui-button--link[aria-pressed='true'] {
1015
+ text-decoration-line: underline;
1016
+ }
1017
+ .rui-button--none {
1018
+ height: auto;
1019
+ min-height: 0px;
1020
+ padding-inline: 0;
1021
+ padding-block: 0;
1022
+ }
1023
+ .rui-button--sm {
1024
+ height: var(--size-control-sm);
1025
+ padding-inline: calc(var(--space-control-x) * 0.75);
1026
+ font-size: var(--text-xs);
1027
+ }
1028
+ .rui-button--md {
1029
+ height: var(--size-control-md);
1030
+ padding-inline: var(--space-control-x);
1031
+ font-size: var(--text-control, 0.875rem);
1032
+ }
1033
+ .rui-button--lg {
1034
+ height: var(--size-control-lg);
1035
+ padding-inline: calc(var(--space-control-x) * 1.5);
1036
+ font-size: var(--text-body);
1037
+ }
1038
+ .rui-button--icon {
1039
+ height: var(--size-control-md);
1040
+ width: var(--size-control-md);
1041
+ padding-inline: 0;
1042
+ font-size: var(--text-control, 0.875rem);
1043
+ }
1044
+ .rui-button--link.rui-button--sm, .rui-button--link.rui-button--md, .rui-button--link.rui-button--lg {
1045
+ height: auto;
1046
+ padding-inline: 0;
1047
+ padding-block: 0;
1048
+ }
1049
+ .rui-button--primary {
1050
+ background-color: var(--color-primary, var(--primary));
2509
1051
  @media (forced-colors: active) {
2510
1052
  background-image: none;
2511
1053
  }
@@ -2692,9 +1234,14 @@
2692
1234
  @media (forced-colors: active) {
2693
1235
  background-image: none;
2694
1236
  }
1237
+ background-image: var(--sheen-image);
2695
1238
  @media (forced-colors: active) {
2696
1239
  background-image: none;
2697
1240
  }
1241
+ color: var(--color-on-primary, var(--on-primary));
1242
+ }
1243
+ .rui-button--secondary {
1244
+ background-color: var(--color-secondary, var(--secondary));
2698
1245
  @media (forced-colors: active) {
2699
1246
  background-image: none;
2700
1247
  }
@@ -2722,14 +1269,9 @@
2722
1269
  @media (forced-colors: active) {
2723
1270
  background-image: none;
2724
1271
  }
2725
- background-image: var(--sheen-image);
2726
1272
  @media (forced-colors: active) {
2727
1273
  background-image: none;
2728
1274
  }
2729
- color: var(--color-on-secondary, var(--on-secondary));
2730
- }
2731
- .rui-button--error {
2732
- background-color: var(--color-error, var(--error));
2733
1275
  @media (forced-colors: active) {
2734
1276
  background-image: none;
2735
1277
  }
@@ -2886,9 +1428,14 @@
2886
1428
  @media (forced-colors: active) {
2887
1429
  background-image: none;
2888
1430
  }
1431
+ background-image: var(--sheen-image);
2889
1432
  @media (forced-colors: active) {
2890
1433
  background-image: none;
2891
1434
  }
1435
+ color: var(--color-on-secondary, var(--on-secondary));
1436
+ }
1437
+ .rui-button--error {
1438
+ background-color: var(--color-error, var(--error));
2892
1439
  @media (forced-colors: active) {
2893
1440
  background-image: none;
2894
1441
  }
@@ -3048,272 +1595,38 @@
3048
1595
  @media (forced-colors: active) {
3049
1596
  background-image: none;
3050
1597
  }
3051
- background-image: var(--sheen-image);
3052
1598
  @media (forced-colors: active) {
3053
- background-image: none;
3054
- }
3055
- color: var(--color-on-error, var(--on-error));
3056
- }
3057
- }
3058
- rui-alert {
3059
- display: block;
3060
- }
3061
- @layer components {
3062
- .rui-alert {
3063
- border-radius: var(--radius-md, var(--border-radius-md));
3064
- font-size: var(--text-sm, var(--text-sm));
3065
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3066
- --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
3067
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3068
- }
3069
- .rui-alert--inline {
3070
- display: flex;
3071
- align-items: flex-start;
3072
- gap: var(--spacing-2, var(--space-2));
3073
- padding-inline: var(--spacing-4, var(--space-4));
3074
- padding-block: var(--spacing-3, var(--space-3));
3075
- }
3076
- .rui-alert__icon {
3077
- display: inline-flex;
3078
- flex-shrink: 0;
3079
- }
3080
- .rui-alert--banner {
3081
- position: relative;
3082
- margin-top: var(--spacing-4, var(--space-4));
3083
- display: flex;
3084
- flex-direction: column;
3085
- padding-block: var(--spacing-4, var(--space-4));
3086
- padding-right: var(--spacing-4, var(--space-4));
3087
- padding-left: var(--spacing-6, var(--space-6));
3088
- &::before {
3089
- content: '';
3090
- position: absolute;
3091
- top: var(--spacing-2, var(--space-2));
3092
- bottom: var(--spacing-2, var(--space-2));
3093
- left: var(--spacing-2, var(--space-2));
3094
- width: var(--spacing-1, var(--space-1));
3095
- border-radius: var(--radius-full, var(--border-radius-full));
3096
- background-color: currentcolor;
3097
- opacity: 50%;
1599
+ background-image: none;
3098
1600
  }
3099
- }
3100
- .rui-alert__title {
3101
- margin-bottom: 0px;
3102
- --tw-font-weight: var(--font-weight-bold, 700);
3103
- font-weight: var(--font-weight-bold, 700);
3104
- }
3105
- .rui-alert__description p {
3106
- margin-block: var(--spacing-1, var(--space-1));
3107
- }
3108
- .rui-alert--info {
3109
- border-style: var(--tw-border-style);
3110
- border-width: 1px;
3111
- border-color: var(--color-blue-300, oklch(80.9% 0.105 251.813));
3112
- background-color: var(--color-blue-100, oklch(93.2% 0.032 255.585));
3113
- color: var(--color-blue-700, oklch(48.8% 0.243 264.376));
3114
- }
3115
- .rui-alert--info.rui-alert--banner::before {
3116
- background-color: var(--color-blue-500, oklch(62.3% 0.214 259.815));
3117
- opacity: 100%;
3118
- }
3119
- .rui-alert--info.rui-alert--banner .rui-alert__title, .rui-alert--info.rui-alert--banner .rui-alert__description p, .rui-alert--info.rui-alert--banner .rui-alert__description span, .rui-alert--info.rui-alert--banner .rui-alert__description a {
3120
- color: var(--color-blue-700, oklch(48.8% 0.243 264.376));
3121
- }
3122
- .rui-alert--success {
3123
- border-style: var(--tw-border-style);
3124
- border-width: 1px;
3125
- border-color: var(--color-emerald-300, oklch(84.5% 0.143 164.978));
3126
- background-color: var(--color-emerald-100, oklch(95% 0.052 163.051));
3127
- color: var(--color-emerald-700, oklch(50.8% 0.118 165.612));
3128
- }
3129
- .rui-alert--success.rui-alert--banner::before {
3130
- background-color: var(--color-emerald-500, oklch(69.6% 0.17 162.48));
3131
- opacity: 100%;
3132
- }
3133
- .rui-alert--success.rui-alert--banner .rui-alert__title, .rui-alert--success.rui-alert--banner .rui-alert__description p, .rui-alert--success.rui-alert--banner .rui-alert__description span, .rui-alert--success.rui-alert--banner .rui-alert__description a {
3134
- color: var(--color-emerald-700, oklch(50.8% 0.118 165.612));
3135
- }
3136
- .rui-alert--warning {
3137
- border-style: var(--tw-border-style);
3138
- border-width: 1px;
3139
- border-color: var(--color-yellow-300, oklch(90.5% 0.182 98.111));
3140
- background-color: var(--color-yellow-100, oklch(97.3% 0.071 103.193));
3141
- color: var(--color-yellow-700, oklch(55.4% 0.135 66.442));
3142
- }
3143
- .rui-alert--warning.rui-alert--banner::before {
3144
- background-color: var(--color-yellow-500, oklch(79.5% 0.184 86.047));
3145
- opacity: 100%;
3146
- }
3147
- .rui-alert--warning.rui-alert--banner .rui-alert__title, .rui-alert--warning.rui-alert--banner .rui-alert__description p, .rui-alert--warning.rui-alert--banner .rui-alert__description span, .rui-alert--warning.rui-alert--banner .rui-alert__description a {
3148
- color: var(--color-yellow-700, oklch(55.4% 0.135 66.442));
3149
- }
3150
- .rui-alert--error {
3151
- border-style: var(--tw-border-style);
3152
- border-width: 1px;
3153
- border-color: var(--color-red-300, oklch(80.8% 0.114 19.571));
3154
- background-color: var(--color-red-100, oklch(93.6% 0.032 17.717));
3155
- color: var(--color-red-700, oklch(50.5% 0.213 27.518));
3156
- }
3157
- .rui-alert--error.rui-alert--banner::before {
3158
- background-color: var(--color-red-500, oklch(63.7% 0.237 25.331));
3159
- opacity: 100%;
3160
- }
3161
- .rui-alert--error.rui-alert--banner .rui-alert__title, .rui-alert--error.rui-alert--banner .rui-alert__description p, .rui-alert--error.rui-alert--banner .rui-alert__description span, .rui-alert--error.rui-alert--banner .rui-alert__description a {
3162
- color: var(--color-red-700, oklch(50.5% 0.213 27.518));
3163
- }
3164
- .rui-autocomplete {
3165
- display: flex;
3166
- min-height: 0px;
3167
- flex-direction: column;
3168
- }
3169
- .rui-autocomplete__input {
3170
- min-width: 0px;
3171
- border-radius: var(--radius-control, var(--radius-control));
3172
- border-style: var(--tw-border-style);
3173
- border-width: 1px;
3174
- border-color: var(--color-border, var(--border));
3175
- background-color: var(--color-background, var(--background));
3176
- padding-inline: var(--spacing-3, var(--space-3));
3177
- padding-block: var(--spacing-2, var(--space-2));
3178
- font-size: var(--text-sm, var(--text-sm));
3179
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3180
- color: var(--color-on-background, var(--on-background));
3181
- --tw-outline-style: none;
3182
- outline-style: none;
3183
- }
3184
- .rui-autocomplete__input:focus-visible {
3185
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
3186
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3187
- --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
3188
- }
3189
- .rui-autocomplete__collection {
3190
- min-height: 0px;
3191
- flex: 1;
3192
- overflow: auto;
3193
- }
3194
- .rui-autocomplete__empty {
3195
- padding-inline: var(--spacing-3, var(--space-3));
3196
- padding-block: var(--spacing-2, var(--space-2));
3197
- font-size: var(--text-sm, var(--text-sm));
3198
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3199
- color: var(--color-on-surface, var(--on-surface));
3200
- }
3201
- .rui-autocomplete__empty[hidden] {
3202
- display: none;
3203
- }
3204
- .rui-avatar {
3205
- position: relative;
3206
- display: inline-flex;
3207
- flex-shrink: 0;
3208
- align-items: center;
3209
- justify-content: center;
3210
- overflow: hidden;
3211
- border-radius: var(--radius-pill, var(--radius-pill));
3212
- background-color: var(--color-surface-container, var(--surface-container));
3213
- --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
3214
- font-weight: var(--font-weight-medium, var(--weight-medium));
3215
- color: var(--color-on-surface, var(--on-surface));
3216
- }
3217
- .rui-avatar--sm {
3218
- width: var(--spacing-8, var(--space-8));
3219
- height: var(--spacing-8, var(--space-8));
3220
- font-size: var(--text-xs, var(--text-xs));
3221
- line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
3222
- }
3223
- .rui-avatar--md {
3224
- width: calc(var(--spacing, 0.25rem) * 10);
3225
- height: calc(var(--spacing, 0.25rem) * 10);
3226
- font-size: var(--text-sm, var(--text-sm));
3227
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3228
- }
3229
- .rui-avatar--lg {
3230
- width: calc(var(--spacing, 0.25rem) * 12);
3231
- height: calc(var(--spacing, 0.25rem) * 12);
3232
- font-size: var(--text-body, var(--text-body));
3233
- }
3234
- .rui-avatar__image {
3235
- width: 100%;
3236
- height: 100%;
3237
- object-fit: cover;
3238
- }
3239
- .rui-avatar__fallback {
3240
- display: flex;
3241
- width: 100%;
3242
- height: 100%;
3243
- align-items: center;
3244
- justify-content: center;
3245
- text-transform: uppercase;
3246
- }
3247
- }
3248
- rui-breadcrumb {
3249
- display: block;
3250
- --rui-breadcrumb-separator: '/';
3251
- }
3252
- @layer components {
3253
- .rui-breadcrumb__list {
3254
- margin: 0px;
3255
- display: flex;
3256
- list-style-type: none;
3257
- flex-wrap: wrap;
3258
- align-items: center;
3259
- gap: var(--spacing-inline, var(--space-inline));
3260
- padding: 0px;
3261
- font-size: var(--text-sm, var(--text-sm));
3262
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3263
- }
3264
- .rui-breadcrumb__item {
3265
- display: inline-flex;
3266
- align-items: center;
3267
- gap: var(--spacing-inline, var(--space-inline));
3268
- }
3269
- .rui-breadcrumb__link {
3270
- display: inline-flex;
3271
- align-items: center;
3272
- gap: var(--spacing-inline, var(--space-inline));
3273
- color: var(--color-primary, var(--primary));
3274
- text-underline-offset: 2px;
3275
- &:hover {
3276
- @media (hover: hover) {
3277
- text-decoration-line: underline;
3278
- }
1601
+ @media (forced-colors: active) {
1602
+ background-image: none;
3279
1603
  }
3280
- }
3281
- .rui-breadcrumb__page, .rui-breadcrumb [aria-current='page'] {
3282
- --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
3283
- font-weight: var(--font-weight-medium, var(--weight-medium));
3284
- color: var(--color-on-background, var(--on-background));
3285
- }
3286
- .rui-breadcrumb__separator {
3287
- display: inline-flex;
3288
- align-items: center;
3289
- color: var(--color-on-surface, var(--on-surface));
3290
- @supports (color: color-mix(in lab, red, red)) {
3291
- color: color-mix(in oklab, var(--color-on-surface, var(--on-surface)) 60%, transparent);
1604
+ @media (forced-colors: active) {
1605
+ background-image: none;
3292
1606
  }
3293
- }
3294
- .rui-breadcrumb__separator:empty::before {
3295
- content: var(--rui-breadcrumb-separator);
3296
- }
3297
- .rui-breadcrumb__ellipsis {
3298
- display: inline-flex;
3299
- align-items: center;
3300
- --tw-tracking: var(--tracking-widest, 0.1em);
3301
- letter-spacing: var(--tracking-widest, 0.1em);
3302
- color: var(--color-on-surface, var(--on-surface));
3303
- @supports (color: color-mix(in lab, red, red)) {
3304
- color: color-mix(in oklab, var(--color-on-surface, var(--on-surface)) 60%, transparent);
1607
+ @media (forced-colors: active) {
1608
+ background-image: none;
3305
1609
  }
3306
- }
3307
- .rui-breadcrumb__ellipsis-label {
3308
- position: absolute;
3309
- width: 1px;
3310
- height: 1px;
3311
- padding: 0;
3312
- margin: -1px;
3313
- overflow: hidden;
3314
- clip-path: inset(50%);
3315
- white-space: nowrap;
3316
- border-width: 0;
1610
+ @media (forced-colors: active) {
1611
+ background-image: none;
1612
+ }
1613
+ @media (forced-colors: active) {
1614
+ background-image: none;
1615
+ }
1616
+ @media (forced-colors: active) {
1617
+ background-image: none;
1618
+ }
1619
+ @media (forced-colors: active) {
1620
+ background-image: none;
1621
+ }
1622
+ @media (forced-colors: active) {
1623
+ background-image: none;
1624
+ }
1625
+ background-image: var(--sheen-image);
1626
+ @media (forced-colors: active) {
1627
+ background-image: none;
1628
+ }
1629
+ color: var(--color-on-error, var(--on-error));
3317
1630
  }
3318
1631
  .rui-button-group {
3319
1632
  display: flex;
@@ -3339,10 +1652,10 @@ rui-calendar {
3339
1652
  border-width: 1px;
3340
1653
  border-color: var(--color-border, var(--border));
3341
1654
  background-color: var(--color-background, var(--background));
3342
- padding: var(--spacing-3, var(--space-3));
1655
+ padding: var(--spacing-inset, var(--space-inset));
3343
1656
  font-size: var(--text-sm, var(--text-sm));
3344
1657
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3345
- --tw-shadow: var(--shadow-overlay);
1658
+ --tw-shadow: var(--shadow-control);
3346
1659
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3347
1660
  }
3348
1661
  .rui-calendar--multi {
@@ -3352,12 +1665,12 @@ rui-calendar {
3352
1665
  .rui-calendar__months {
3353
1666
  display: flex;
3354
1667
  flex-direction: column;
3355
- gap: var(--spacing-4, var(--space-4));
1668
+ gap: var(--spacing-stack, var(--space-stack));
3356
1669
  @media (width >= 40rem) {
3357
1670
  flex-direction: row;
3358
1671
  }
3359
1672
  @media (width >= 40rem) {
3360
- gap: var(--spacing-3, var(--space-3));
1673
+ gap: var(--spacing-stack, var(--space-stack));
3361
1674
  }
3362
1675
  }
3363
1676
  .rui-calendar__month-panel {
@@ -3369,7 +1682,7 @@ rui-calendar {
3369
1682
  display: flex;
3370
1683
  align-items: center;
3371
1684
  justify-content: space-between;
3372
- gap: var(--spacing-2, var(--space-2));
1685
+ gap: var(--spacing-inline, var(--space-inline));
3373
1686
  }
3374
1687
  .rui-calendar__nav-spacer {
3375
1688
  display: inline-flex;
@@ -3528,8 +1841,8 @@ rui-calendar {
3528
1841
  border-style: var(--tw-border-style);
3529
1842
  border-width: 0px;
3530
1843
  background-color: transparent;
3531
- padding-inline: var(--spacing-3, var(--space-3));
3532
- padding-block: var(--spacing-1, var(--space-1));
1844
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
1845
+ padding-block: var(--spacing-control-y, var(--space-control-y));
3533
1846
  font-size: var(--text-sm, var(--text-sm));
3534
1847
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
3535
1848
  color: var(--color-primary, var(--primary));
@@ -3880,7 +2193,7 @@ rui-checkbox {
3880
2193
  width: var(--spacing-4, var(--space-4));
3881
2194
  height: var(--spacing-4, var(--space-4));
3882
2195
  flex-shrink: 0;
3883
- border-radius: var(--radius-xs, var(--border-radius-xs));
2196
+ border-radius: var(--radius-control, var(--radius-control));
3884
2197
  border-style: var(--tw-border-style);
3885
2198
  border-width: 1px;
3886
2199
  border-color: var(--color-border, var(--border));
@@ -3961,17 +2274,54 @@ rui-checkbox {
3961
2274
  background-color: var(--color-primary-container, var(--primary-container));
3962
2275
  color: var(--color-on-primary-container, var(--on-primary-container));
3963
2276
  }
3964
- .rui-chip-list {
3965
- margin: 0px;
3966
- display: flex;
3967
- list-style-type: none;
3968
- flex-wrap: wrap;
3969
- gap: var(--spacing-inline, var(--space-inline));
3970
- padding: 0px;
2277
+ .rui-chip-list {
2278
+ margin: 0px;
2279
+ display: flex;
2280
+ list-style-type: none;
2281
+ flex-wrap: wrap;
2282
+ gap: var(--spacing-inline, var(--space-inline));
2283
+ padding: 0px;
2284
+ }
2285
+ .rui-chip-list__item {
2286
+ margin: 0px;
2287
+ padding: 0px;
2288
+ }
2289
+ .rui-icon {
2290
+ width: var(--size-icon-sm);
2291
+ height: var(--size-icon-sm);
2292
+ flex-shrink: 0;
2293
+ }
2294
+ .rui-icon--md {
2295
+ width: var(--size-icon-md);
2296
+ height: var(--size-icon-md);
2297
+ }
2298
+ .rui-control-toggle {
2299
+ display: inline-flex;
2300
+ height: var(--spacing-8, var(--space-8));
2301
+ width: var(--spacing-8, var(--space-8));
2302
+ flex-shrink: 0;
2303
+ align-items: center;
2304
+ justify-content: center;
2305
+ border-radius: var(--radius-control, var(--radius-control));
2306
+ border-style: var(--tw-border-style);
2307
+ border-width: 0px;
2308
+ background-color: transparent;
2309
+ color: var(--color-on-surface, var(--on-surface));
2310
+ cursor: pointer;
2311
+ }
2312
+ .rui-control-toggle:hover:not(:disabled) {
2313
+ background-color: var(--color-surface-container-low, var(--surface-container-low));
3971
2314
  }
3972
- .rui-chip-list__item {
3973
- margin: 0px;
3974
- padding: 0px;
2315
+ .rui-control-toggle:focus-visible {
2316
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2317
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2318
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
2319
+ --tw-outline-style: none;
2320
+ outline-style: none;
2321
+ }
2322
+ .rui-control-toggle:disabled {
2323
+ cursor: not-allowed;
2324
+ opacity: var(--opacity-muted, var(--opacity-muted));
3975
2325
  }
3976
2326
  .rui-floating {
3977
2327
  position: fixed;
@@ -4005,12 +2355,13 @@ rui-checkbox {
4005
2355
  rui-combobox {
4006
2356
  position: relative;
4007
2357
  display: inline-flex;
2358
+ width: 100%;
4008
2359
  flex-direction: column;
4009
2360
  }
4010
2361
  @layer components {
4011
2362
  .rui-combobox {
4012
2363
  position: relative;
4013
- width: calc(var(--spacing, 0.25rem) * 64);
2364
+ width: 100%;
4014
2365
  font-size: var(--text-sm, var(--text-sm));
4015
2366
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
4016
2367
  }
@@ -4058,6 +2409,55 @@ rui-combobox {
4058
2409
  .rui-combobox__listbox > rui-listbox {
4059
2410
  min-width: 0px;
4060
2411
  }
2412
+ .rui-cycle-toggle__button {
2413
+ gap: var(--spacing-inline, var(--space-inline));
2414
+ }
2415
+ .rui-cycle-toggle__item {
2416
+ display: inline-flex;
2417
+ align-items: center;
2418
+ gap: var(--spacing-inline, var(--space-inline));
2419
+ }
2420
+ .rui-cycle-toggle__item > svg {
2421
+ pointer-events: none;
2422
+ flex-shrink: 0;
2423
+ }
2424
+ .rui-icon {
2425
+ width: var(--size-icon-sm);
2426
+ height: var(--size-icon-sm);
2427
+ flex-shrink: 0;
2428
+ }
2429
+ .rui-icon--md {
2430
+ width: var(--size-icon-md);
2431
+ height: var(--size-icon-md);
2432
+ }
2433
+ .rui-control-toggle {
2434
+ display: inline-flex;
2435
+ height: var(--spacing-8, var(--space-8));
2436
+ width: var(--spacing-8, var(--space-8));
2437
+ flex-shrink: 0;
2438
+ align-items: center;
2439
+ justify-content: center;
2440
+ border-radius: var(--radius-control, var(--radius-control));
2441
+ border-style: var(--tw-border-style);
2442
+ border-width: 0px;
2443
+ background-color: transparent;
2444
+ color: var(--color-on-surface, var(--on-surface));
2445
+ cursor: pointer;
2446
+ }
2447
+ .rui-control-toggle:hover:not(:disabled) {
2448
+ background-color: var(--color-surface-container-low, var(--surface-container-low));
2449
+ }
2450
+ .rui-control-toggle:focus-visible {
2451
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2452
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2453
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
2454
+ --tw-outline-style: none;
2455
+ outline-style: none;
2456
+ }
2457
+ .rui-control-toggle:disabled {
2458
+ cursor: not-allowed;
2459
+ opacity: var(--opacity-muted, var(--opacity-muted));
2460
+ }
4061
2461
  .rui-floating {
4062
2462
  position: fixed;
4063
2463
  visibility: hidden;
@@ -4147,6 +2547,43 @@ rui-date-field {
4147
2547
  .rui-date-field__popover[hidden] {
4148
2548
  display: none;
4149
2549
  }
2550
+ .rui-icon {
2551
+ width: var(--size-icon-sm);
2552
+ height: var(--size-icon-sm);
2553
+ flex-shrink: 0;
2554
+ }
2555
+ .rui-icon--md {
2556
+ width: var(--size-icon-md);
2557
+ height: var(--size-icon-md);
2558
+ }
2559
+ .rui-control-toggle {
2560
+ display: inline-flex;
2561
+ height: var(--spacing-8, var(--space-8));
2562
+ width: var(--spacing-8, var(--space-8));
2563
+ flex-shrink: 0;
2564
+ align-items: center;
2565
+ justify-content: center;
2566
+ border-radius: var(--radius-control, var(--radius-control));
2567
+ border-style: var(--tw-border-style);
2568
+ border-width: 0px;
2569
+ background-color: transparent;
2570
+ color: var(--color-on-surface, var(--on-surface));
2571
+ cursor: pointer;
2572
+ }
2573
+ .rui-control-toggle:hover:not(:disabled) {
2574
+ background-color: var(--color-surface-container-low, var(--surface-container-low));
2575
+ }
2576
+ .rui-control-toggle:focus-visible {
2577
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2578
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2579
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
2580
+ --tw-outline-style: none;
2581
+ outline-style: none;
2582
+ }
2583
+ .rui-control-toggle:disabled {
2584
+ cursor: not-allowed;
2585
+ opacity: var(--opacity-muted, var(--opacity-muted));
2586
+ }
4150
2587
  .rui-floating {
4151
2588
  position: fixed;
4152
2589
  visibility: hidden;
@@ -4277,7 +2714,7 @@ rui-dialog {
4277
2714
  background-color: var(--color-background, var(--background));
4278
2715
  padding: var(--spacing-inset, var(--space-inset));
4279
2716
  color: var(--color-on-background, var(--on-background));
4280
- --tw-shadow: var(--shadow-overlay);
2717
+ --tw-shadow: var(--shadow-modal);
4281
2718
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4282
2719
  --tw-outline-style: none;
4283
2720
  outline-style: none;
@@ -4484,7 +2921,7 @@ rui-disclosure-group {
4484
2921
  }
4485
2922
  .rui-disclosure-group > rui-disclosure .rui-disclosure__trigger {
4486
2923
  border-radius: var(--radius-none, var(--border-radius-none));
4487
- padding-inline: var(--spacing-4, var(--space-4));
2924
+ padding-inline: var(--spacing-inset, var(--space-inset));
4488
2925
  }
4489
2926
  .rui-disclosure-group > rui-disclosure .rui-disclosure__panel-inner {
4490
2927
  border-top-style: var(--tw-border-style);
@@ -4834,8 +3271,9 @@ rui-grid {
4834
3271
  --tw-outline-style: none;
4835
3272
  outline-style: none;
4836
3273
  border-radius: var(--radius-control);
3274
+ height: var(--size-control-md);
4837
3275
  padding-inline: var(--space-control-x);
4838
- padding-block: var(--space-control-y);
3276
+ padding-block: 0;
4839
3277
  font-size: var(--text-control, 0.875rem);
4840
3278
  transition-duration: var(--duration-normal);
4841
3279
  }
@@ -4851,12 +3289,6 @@ rui-grid {
4851
3289
  .rui-input[aria-invalid='true'] {
4852
3290
  border-color: var(--color-error, var(--error));
4853
3291
  }
4854
- .rui-input--sm {
4855
- padding-block: calc(var(--space-control-y) * 0.75);
4856
- }
4857
- .rui-input--lg {
4858
- padding-block: calc(var(--space-control-y) * 1.25);
4859
- }
4860
3292
  .rui-label {
4861
3293
  display: block;
4862
3294
  --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
@@ -4886,8 +3318,8 @@ rui-listbox {
4886
3318
  .rui-listbox__option {
4887
3319
  cursor: pointer;
4888
3320
  border-radius: var(--radius-control, var(--radius-control));
4889
- padding-inline: var(--spacing-3, var(--space-3));
4890
- padding-block: var(--spacing-2, var(--space-2));
3321
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
3322
+ padding-block: var(--spacing-control-y, var(--space-control-y));
4891
3323
  font-size: var(--text-sm, var(--text-sm));
4892
3324
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
4893
3325
  color: var(--color-on-background, var(--on-background));
@@ -5091,138 +3523,6 @@ rui-listbox {
5091
3523
  @media (forced-colors: active) {
5092
3524
  background-image: none;
5093
3525
  }
5094
- @media (forced-colors: active) {
5095
- background-image: none;
5096
- }
5097
- @media (forced-colors: active) {
5098
- background-image: none;
5099
- }
5100
- @media (forced-colors: active) {
5101
- background-image: none;
5102
- }
5103
- @media (forced-colors: active) {
5104
- background-image: none;
5105
- }
5106
- @media (forced-colors: active) {
5107
- background-image: none;
5108
- }
5109
- @media (forced-colors: active) {
5110
- background-image: none;
5111
- }
5112
- @media (forced-colors: active) {
5113
- background-image: none;
5114
- }
5115
- @media (forced-colors: active) {
5116
- background-image: none;
5117
- }
5118
- @media (forced-colors: active) {
5119
- background-image: none;
5120
- }
5121
- @media (forced-colors: active) {
5122
- background-image: none;
5123
- }
5124
- @media (forced-colors: active) {
5125
- background-image: none;
5126
- }
5127
- @media (forced-colors: active) {
5128
- background-image: none;
5129
- }
5130
- @media (forced-colors: active) {
5131
- background-image: none;
5132
- }
5133
- @media (forced-colors: active) {
5134
- background-image: none;
5135
- }
5136
- @media (forced-colors: active) {
5137
- background-image: none;
5138
- }
5139
- @media (forced-colors: active) {
5140
- background-image: none;
5141
- }
5142
- @media (forced-colors: active) {
5143
- background-image: none;
5144
- }
5145
- @media (forced-colors: active) {
5146
- background-image: none;
5147
- }
5148
- @media (forced-colors: active) {
5149
- background-image: none;
5150
- }
5151
- @media (forced-colors: active) {
5152
- background-image: none;
5153
- }
5154
- @media (forced-colors: active) {
5155
- background-image: none;
5156
- }
5157
- @media (forced-colors: active) {
5158
- background-image: none;
5159
- }
5160
- @media (forced-colors: active) {
5161
- background-image: none;
5162
- }
5163
- @media (forced-colors: active) {
5164
- background-image: none;
5165
- }
5166
- @media (forced-colors: active) {
5167
- background-image: none;
5168
- }
5169
- @media (forced-colors: active) {
5170
- background-image: none;
5171
- }
5172
- @media (forced-colors: active) {
5173
- background-image: none;
5174
- }
5175
- @media (forced-colors: active) {
5176
- background-image: none;
5177
- }
5178
- @media (forced-colors: active) {
5179
- background-image: none;
5180
- }
5181
- @media (forced-colors: active) {
5182
- background-image: none;
5183
- }
5184
- @media (forced-colors: active) {
5185
- background-image: none;
5186
- }
5187
- @media (forced-colors: active) {
5188
- background-image: none;
5189
- }
5190
- @media (forced-colors: active) {
5191
- background-image: none;
5192
- }
5193
- @media (forced-colors: active) {
5194
- background-image: none;
5195
- }
5196
- @media (forced-colors: active) {
5197
- background-image: none;
5198
- }
5199
- @media (forced-colors: active) {
5200
- background-image: none;
5201
- }
5202
- @media (forced-colors: active) {
5203
- background-image: none;
5204
- }
5205
- @media (forced-colors: active) {
5206
- background-image: none;
5207
- }
5208
- @media (forced-colors: active) {
5209
- background-image: none;
5210
- }
5211
- @media (forced-colors: active) {
5212
- background-image: none;
5213
- }
5214
- @media (forced-colors: active) {
5215
- background-image: none;
5216
- }
5217
- @media (forced-colors: active) {
5218
- background-image: none;
5219
- }
5220
- @media (forced-colors: active) {
5221
- background-image: none;
5222
- }
5223
- @media (forced-colors: active) {
5224
- background-image: none;
5225
- }
5226
3526
  background-image: var(--sheen-image);
5227
3527
  @media (forced-colors: active) {
5228
3528
  background-image: none;
@@ -5318,8 +3618,8 @@ rui-menu-button {
5318
3618
  border-style: var(--tw-border-style);
5319
3619
  border-width: 0px;
5320
3620
  background-color: transparent;
5321
- padding-inline: var(--spacing-3, var(--space-3));
5322
- padding-block: var(--spacing-2, var(--space-2));
3621
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
3622
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5323
3623
  text-align: left;
5324
3624
  font-size: var(--text-sm, var(--text-sm));
5325
3625
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
@@ -5387,8 +3687,8 @@ rui-menubar {
5387
3687
  border-style: var(--tw-border-style);
5388
3688
  border-width: 0px;
5389
3689
  background-color: transparent;
5390
- padding-inline: var(--spacing-3, var(--space-3));
5391
- padding-block: calc(var(--spacing, 0.25rem) * 1.5);
3690
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
3691
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5392
3692
  font-size: var(--text-sm, var(--text-sm));
5393
3693
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
5394
3694
  color: var(--color-on-surface, var(--on-surface));
@@ -5435,8 +3735,8 @@ rui-menubar {
5435
3735
  border-style: var(--tw-border-style);
5436
3736
  border-width: 0px;
5437
3737
  background-color: transparent;
5438
- padding-inline: var(--spacing-3, var(--space-3));
5439
- padding-block: calc(var(--spacing, 0.25rem) * 1.5);
3738
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
3739
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5440
3740
  text-align: left;
5441
3741
  font-size: var(--text-sm, var(--text-sm));
5442
3742
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
@@ -5466,7 +3766,7 @@ rui-meter {
5466
3766
  .rui-meter {
5467
3767
  display: flex;
5468
3768
  align-items: center;
5469
- gap: var(--spacing-3, var(--space-3));
3769
+ gap: var(--spacing-inline, var(--space-inline));
5470
3770
  font-size: var(--text-sm, var(--text-sm));
5471
3771
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
5472
3772
  }
@@ -5506,8 +3806,8 @@ rui-navigation-menu {
5506
3806
  border-bottom-width: 1px;
5507
3807
  border-color: var(--color-border, var(--border));
5508
3808
  background-color: var(--color-background, var(--background));
5509
- padding-inline: var(--spacing-3, var(--space-3));
5510
- padding-block: var(--spacing-2, var(--space-2));
3809
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
3810
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5511
3811
  }
5512
3812
  .rui-navigation-menu__bar .rui-button, .rui-navigation-menu__bar a.rui-button {
5513
3813
  border-radius: var(--radius-container, var(--radius-container));
@@ -5698,23 +3998,38 @@ rui-number-field {
5698
3998
  .rui-number-field__input[data-readonly], .rui-number-field__input:read-only {
5699
3999
  cursor: default;
5700
4000
  }
4001
+ .rui-number-field__steppers {
4002
+ display: inline-flex;
4003
+ flex-shrink: 0;
4004
+ align-items: stretch;
4005
+ border-left-style: var(--tw-border-style);
4006
+ border-left-width: 1px;
4007
+ border-color: var(--color-border, var(--border));
4008
+ }
5701
4009
  .rui-number-field__stepper {
5702
4010
  display: inline-flex;
5703
4011
  flex-shrink: 0;
5704
4012
  cursor: default;
5705
4013
  align-items: center;
5706
4014
  justify-content: center;
5707
- border-style: var(--tw-border-style);
5708
- border-width: 0px;
5709
- border-left-style: var(--tw-border-style);
5710
- border-left-width: 1px;
5711
- border-color: var(--color-border, var(--border));
4015
+ border-style: var(--tw-border-style);
4016
+ border-width: 0px;
5712
4017
  background-color: transparent;
5713
4018
  color: var(--color-on-surface, var(--on-surface));
5714
4019
  padding-inline: var(--space-control-y);
5715
4020
  min-inline-size: var(--size-control-sm);
5716
4021
  transition-duration: var(--duration-normal);
5717
4022
  }
4023
+ .rui-number-field__stepper + .rui-number-field__stepper {
4024
+ border-left-style: var(--tw-border-style);
4025
+ border-left-width: 1px;
4026
+ border-color: var(--color-border, var(--border));
4027
+ }
4028
+ .rui-number-field__input + .rui-number-field__stepper {
4029
+ border-left-style: var(--tw-border-style);
4030
+ border-left-width: 1px;
4031
+ border-color: var(--color-border, var(--border));
4032
+ }
5718
4033
  .rui-number-field__stepper:hover:not(:disabled) {
5719
4034
  background-color: var(--color-surface, var(--surface));
5720
4035
  }
@@ -5843,6 +4158,43 @@ rui-radio-group {
5843
4158
  -webkit-user-select: none;
5844
4159
  user-select: none;
5845
4160
  }
4161
+ .rui-icon {
4162
+ width: var(--size-icon-sm);
4163
+ height: var(--size-icon-sm);
4164
+ flex-shrink: 0;
4165
+ }
4166
+ .rui-icon--md {
4167
+ width: var(--size-icon-md);
4168
+ height: var(--size-icon-md);
4169
+ }
4170
+ .rui-control-toggle {
4171
+ display: inline-flex;
4172
+ height: var(--spacing-8, var(--space-8));
4173
+ width: var(--spacing-8, var(--space-8));
4174
+ flex-shrink: 0;
4175
+ align-items: center;
4176
+ justify-content: center;
4177
+ border-radius: var(--radius-control, var(--radius-control));
4178
+ border-style: var(--tw-border-style);
4179
+ border-width: 0px;
4180
+ background-color: transparent;
4181
+ color: var(--color-on-surface, var(--on-surface));
4182
+ cursor: pointer;
4183
+ }
4184
+ .rui-control-toggle:hover:not(:disabled) {
4185
+ background-color: var(--color-surface-container-low, var(--surface-container-low));
4186
+ }
4187
+ .rui-control-toggle:focus-visible {
4188
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
4189
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
4190
+ --tw-ring-color: var(--color-focus-ring, var(--focus-ring));
4191
+ --tw-outline-style: none;
4192
+ outline-style: none;
4193
+ }
4194
+ .rui-control-toggle:disabled {
4195
+ cursor: not-allowed;
4196
+ opacity: var(--opacity-muted, var(--opacity-muted));
4197
+ }
5846
4198
  .rui-floating {
5847
4199
  position: fixed;
5848
4200
  visibility: hidden;
@@ -5875,17 +4227,19 @@ rui-radio-group {
5875
4227
  rui-select {
5876
4228
  position: relative;
5877
4229
  display: inline-flex;
4230
+ width: 100%;
5878
4231
  flex-direction: column;
5879
4232
  }
5880
4233
  @layer components {
5881
4234
  .rui-select {
5882
4235
  position: relative;
5883
- width: calc(var(--spacing, 0.25rem) * 64);
4236
+ width: 100%;
5884
4237
  font-size: var(--text-sm, var(--text-sm));
5885
4238
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
5886
4239
  }
5887
4240
  .rui-select__control {
5888
4241
  display: flex;
4242
+ min-height: calc(var(--spacing, 0.25rem) * 10);
5889
4243
  width: 100%;
5890
4244
  min-width: 0px;
5891
4245
  align-items: center;
@@ -5904,20 +4258,22 @@ rui-select {
5904
4258
  }
5905
4259
  .rui-select__trigger {
5906
4260
  display: inline-flex;
4261
+ min-height: var(--spacing-8, var(--space-8));
5907
4262
  min-width: 0px;
5908
4263
  flex: 1;
5909
4264
  cursor: pointer;
5910
4265
  align-items: center;
5911
- gap: var(--spacing-2, var(--space-2));
4266
+ gap: var(--spacing-inline, var(--space-inline));
5912
4267
  border-style: var(--tw-border-style);
5913
4268
  border-width: 0px;
5914
4269
  background-color: transparent;
5915
- padding-inline: var(--spacing-3, var(--space-3));
5916
- padding-block: var(--spacing-2, var(--space-2));
4270
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
4271
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5917
4272
  text-align: start;
5918
4273
  color: var(--color-on-background, var(--on-background));
5919
4274
  --tw-outline-style: none;
5920
4275
  outline-style: none;
4276
+ font-size: var(--text-control, 0.875rem);
5921
4277
  }
5922
4278
  .rui-select__trigger:disabled {
5923
4279
  cursor: not-allowed;
@@ -5929,6 +4285,7 @@ rui-select {
5929
4285
  overflow: hidden;
5930
4286
  text-overflow: ellipsis;
5931
4287
  white-space: nowrap;
4288
+ min-height: 1.25em;
5932
4289
  }
5933
4290
  .rui-select__value[data-placeholder] {
5934
4291
  color: var(--color-on-surface, var(--on-surface));
@@ -5953,8 +4310,8 @@ rui-select {
5953
4310
  border-width: 1px;
5954
4311
  border-color: var(--color-border, var(--border));
5955
4312
  background-color: var(--color-background, var(--background));
5956
- padding-inline: var(--spacing-3, var(--space-3));
5957
- padding-block: var(--spacing-2, var(--space-2));
4313
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
4314
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5958
4315
  color: var(--color-on-background, var(--on-background));
5959
4316
  --tw-outline-style: none;
5960
4317
  outline-style: none;
@@ -5975,7 +4332,7 @@ rui-sidebar {
5975
4332
  width: 100%;
5976
4333
  min-width: 0px;
5977
4334
  flex: 1;
5978
- overflow: hidden;
4335
+ overflow: clip;
5979
4336
  background-color: var(--color-background, var(--background));
5980
4337
  }
5981
4338
  .rui-sidebar-provider[data-layout='full'] {
@@ -5986,7 +4343,7 @@ rui-sidebar {
5986
4343
  height: 100svh;
5987
4344
  min-height: 0px;
5988
4345
  flex-direction: column;
5989
- overflow: hidden;
4346
+ overflow: clip;
5990
4347
  .rui-sidebar-provider__site-header {
5991
4348
  position: sticky;
5992
4349
  top: 0px;
@@ -6044,7 +4401,7 @@ rui-sidebar {
6044
4401
  .rui-sidebar-provider__site-header-nav {
6045
4402
  display: flex;
6046
4403
  align-items: center;
6047
- gap: var(--spacing-4, var(--space-4));
4404
+ gap: var(--spacing-1, var(--space-1));
6048
4405
  }
6049
4406
  .rui-sidebar-provider__site-header-link {
6050
4407
  font-size: var(--text-sm, var(--text-sm));
@@ -6056,7 +4413,7 @@ rui-sidebar {
6056
4413
  display: flex;
6057
4414
  min-height: 0px;
6058
4415
  flex: 1;
6059
- overflow: hidden;
4416
+ overflow: clip;
6060
4417
  }
6061
4418
  .rui-sidebar-docs-page {
6062
4419
  margin-inline: auto;
@@ -6102,13 +4459,10 @@ rui-sidebar {
6102
4459
  }
6103
4460
  }
6104
4461
  @media (max-width: 767px) {
6105
- rui-sidebar-trigger {
6106
- display: inline-flex;
6107
- }
6108
4462
  rui-sidebar-trigger .rui-sidebar__trigger {
6109
4463
  width: calc(var(--spacing, 0.25rem) * 9);
6110
4464
  height: calc(var(--spacing, 0.25rem) * 9);
6111
- border-radius: var(--radius-lg, var(--border-radius-lg));
4465
+ border-radius: var(--radius-control, var(--radius-control));
6112
4466
  border-style: var(--tw-border-style);
6113
4467
  border-width: 1px;
6114
4468
  border-color: var(--color-border, var(--border));
@@ -6140,7 +4494,7 @@ rui-sidebar {
6140
4494
  }
6141
4495
  }
6142
4496
  .rui-sidebar-provider:has(rui-sidebar[data-mobile='true'][data-state='expanded']) {
6143
- overflow: hidden;
4497
+ overflow: clip;
6144
4498
  }
6145
4499
  .rui-sidebar {
6146
4500
  position: relative;
@@ -6149,14 +4503,14 @@ rui-sidebar {
6149
4503
  min-width: 0px;
6150
4504
  flex-shrink: 0;
6151
4505
  align-self: stretch;
6152
- background-color: var(--color-surface, var(--surface));
6153
4506
  color: var(--color-on-background, var(--on-background));
4507
+ background-color: var(--rui-sidebar-background, var(--color-surface));
6154
4508
  }
6155
4509
  .rui-sidebar[data-side='right'] {
6156
4510
  flex-direction: row-reverse;
6157
4511
  }
6158
4512
  .rui-sidebar[data-variant='inset'] {
6159
- border-radius: var(--radius-lg, var(--border-radius-lg));
4513
+ border-radius: var(--radius-container, var(--radius-container));
6160
4514
  border-style: var(--tw-border-style);
6161
4515
  border-width: 1px;
6162
4516
  border-color: var(--color-border, var(--border));
@@ -6234,11 +4588,11 @@ rui-sidebar {
6234
4588
  flex-shrink: 0;
6235
4589
  flex-direction: row;
6236
4590
  align-items: center;
6237
- gap: var(--spacing-2, var(--space-2));
4591
+ gap: var(--spacing-inline, var(--space-inline));
6238
4592
  border-bottom-style: var(--tw-border-style);
6239
4593
  border-bottom-width: 1px;
6240
4594
  border-color: var(--color-border, var(--border));
6241
- padding-inline: var(--spacing-3, var(--space-3));
4595
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
6242
4596
  }
6243
4597
  .rui-sidebar[data-collapsible='icon'][data-state='collapsed'] .rui-sidebar__header {
6244
4598
  flex-direction: column;
@@ -6266,7 +4620,7 @@ rui-sidebar {
6266
4620
  padding: var(--spacing-3, var(--space-3));
6267
4621
  }
6268
4622
  .rui-sidebar[data-collapsible='icon'][data-state='collapsed'] .rui-sidebar__content {
6269
- gap: var(--spacing-2, var(--space-2));
4623
+ gap: var(--spacing-inline, var(--space-inline));
6270
4624
  overflow-x: hidden;
6271
4625
  padding-inline: var(--spacing-1, var(--space-1));
6272
4626
  }
@@ -6274,7 +4628,7 @@ rui-sidebar {
6274
4628
  display: flex;
6275
4629
  flex-shrink: 0;
6276
4630
  flex-direction: column;
6277
- gap: var(--spacing-2, var(--space-2));
4631
+ gap: var(--spacing-inline, var(--space-inline));
6278
4632
  border-top-style: var(--tw-border-style);
6279
4633
  border-top-width: 1px;
6280
4634
  border-color: var(--color-border, var(--border));
@@ -6326,7 +4680,7 @@ rui-sidebar {
6326
4680
  cursor: pointer;
6327
4681
  align-items: center;
6328
4682
  justify-content: center;
6329
- border-radius: var(--radius-md, var(--border-radius-md));
4683
+ border-radius: var(--radius-control, var(--radius-control));
6330
4684
  border-style: var(--tw-border-style);
6331
4685
  border-width: 0px;
6332
4686
  background-color: transparent;
@@ -6373,8 +4727,8 @@ rui-sidebar {
6373
4727
  min-width: 0px;
6374
4728
  cursor: pointer;
6375
4729
  align-items: center;
6376
- gap: var(--spacing-2, var(--space-2));
6377
- border-radius: var(--radius-md, var(--border-radius-md));
4730
+ gap: var(--spacing-inline, var(--space-inline));
4731
+ border-radius: var(--radius-control, var(--radius-control));
6378
4732
  border-style: var(--tw-border-style);
6379
4733
  border-width: 0px;
6380
4734
  background-color: transparent;
@@ -6465,7 +4819,7 @@ rui-sidebar {
6465
4819
  flex: 1;
6466
4820
  flex-direction: column;
6467
4821
  gap: 0px;
6468
- overflow: hidden;
4822
+ overflow: clip;
6469
4823
  background-color: var(--color-background, var(--background));
6470
4824
  }
6471
4825
  .rui-sidebar__trigger {
@@ -6489,19 +4843,19 @@ rui-sidebar {
6489
4843
  height: var(--spacing-4, var(--space-4));
6490
4844
  flex-shrink: 0;
6491
4845
  }
6492
- :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='header'], :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='inset'] {
4846
+ :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true']) )) rui-sidebar-trigger.rui-sidebar-trigger-placement--header, :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='header'], :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true']) )) rui-sidebar-trigger.rui-sidebar-trigger-placement--inset, :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='inset'] {
6493
4847
  display: none;
6494
4848
  }
6495
- :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-state='expanded']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='inset'] {
4849
+ :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-state='expanded']:not([data-mobile='true']) )) rui-sidebar-trigger.rui-sidebar-trigger-placement--inset, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-state='expanded']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='inset'] {
6496
4850
  display: none;
6497
4851
  }
6498
- :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='header'] {
4852
+ :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed']:not([data-mobile='true']) )) rui-sidebar-trigger.rui-sidebar-trigger-placement--header, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed']:not([data-mobile='true'])), .rui-sidebar-provider:has( > .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed']:not([data-mobile='true']) )) rui-sidebar-trigger[data-placement='header'] {
6499
4853
  display: none;
6500
4854
  }
6501
- :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded'][data-mobile='true']), .rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded'][data-mobile='true'])) rui-sidebar-trigger[data-placement='inset'] {
4855
+ :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded'][data-mobile='true']), .rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded'][data-mobile='true'])) rui-sidebar-trigger.rui-sidebar-trigger-placement--inset, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded'][data-mobile='true']), .rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded'][data-mobile='true'])) rui-sidebar-trigger[data-placement='inset'] {
6502
4856
  display: none;
6503
4857
  }
6504
- :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed'][data-mobile='true']), .rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed'][data-mobile='true'])) rui-sidebar-trigger[data-placement='header'] {
4858
+ :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed'][data-mobile='true']), .rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed'][data-mobile='true'])) rui-sidebar-trigger.rui-sidebar-trigger-placement--header, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed'][data-mobile='true']), .rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed'][data-mobile='true'])) rui-sidebar-trigger[data-placement='header'] {
6505
4859
  display: none;
6506
4860
  }
6507
4861
  .rui-sidebar[data-mobile='true'] {
@@ -6661,7 +5015,7 @@ rui-switch {
6661
5015
  .rui-switch {
6662
5016
  display: inline-flex;
6663
5017
  align-items: center;
6664
- gap: var(--spacing-2, var(--space-2));
5018
+ gap: var(--spacing-inline, var(--space-inline));
6665
5019
  cursor: pointer;
6666
5020
  font-size: var(--text-sm, var(--text-sm));
6667
5021
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
@@ -6699,7 +5053,7 @@ rui-switch {
6699
5053
  width: var(--rui-switch-width);
6700
5054
  flex-shrink: 0;
6701
5055
  align-items: center;
6702
- border-radius: var(--radius-lg, var(--border-radius-lg));
5056
+ border-radius: var(--radius-pill, var(--radius-pill));
6703
5057
  padding: var(--spacing-1, var(--space-1));
6704
5058
  background-color: var(--color-on-background, var(--on-background));
6705
5059
  @supports (color: color-mix(in lab, red, red)) {
@@ -6735,7 +5089,7 @@ rui-switch {
6735
5089
  height: var(--rui-switch-thumb-size);
6736
5090
  --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
6737
5091
  translate: var(--tw-translate-x) var(--tw-translate-y);
6738
- border-radius: var(--radius-md, var(--border-radius-md));
5092
+ border-radius: var(--radius-full, var(--border-radius-full));
6739
5093
  background-color: var(--color-on-background, var(--on-background));
6740
5094
  transition-property: left,right,transform;
6741
5095
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));
@@ -6824,12 +5178,12 @@ rui-tabs {
6824
5178
  }
6825
5179
  rui-tabs[variant='boxed'] {
6826
5180
  overflow: hidden;
6827
- border-radius: var(--radius-sm, var(--border-radius-sm));
5181
+ border-radius: var(--radius-container, var(--radius-container));
6828
5182
  border-style: var(--tw-border-style);
6829
5183
  border-width: 1px;
6830
5184
  border-color: var(--color-border, var(--border));
6831
5185
  background-color: var(--color-background, var(--background));
6832
- --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
5186
+ --tw-shadow: var(--shadow-control);
6833
5187
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
6834
5188
  }
6835
5189
  rui-tabs[variant='boxed'] .rui-tabs__list {
@@ -6844,8 +5198,8 @@ rui-tabs {
6844
5198
  padding-top: var(--spacing-2, var(--space-2));
6845
5199
  }
6846
5200
  rui-tabs[variant='boxed'] .rui-tabs__tab {
6847
- padding-inline: var(--spacing-3, var(--space-3));
6848
- padding-block: calc(var(--spacing, 0.25rem) * 1.5);
5201
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
5202
+ padding-block: var(--spacing-control-y, var(--space-control-y));
6849
5203
  text-align: center;
6850
5204
  font-size: var(--text-xs, var(--text-xs));
6851
5205
  line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
@@ -6862,197 +5216,64 @@ rui-tabs {
6862
5216
  rui-tabs[variant='boxed'] .rui-tabs__tab[aria-selected='true'] {
6863
5217
  border-color: var(--color-primary, var(--primary));
6864
5218
  --tw-font-weight: var(--font-weight-medium, var(--weight-medium));
6865
- font-weight: var(--font-weight-medium, var(--weight-medium));
6866
- color: var(--color-on-surface-container-low, var(--on-surface-container-low));
6867
- opacity: 100%;
6868
- }
6869
- rui-tabs[variant='boxed'] .rui-tabs__panel {
6870
- background-color: var(--color-background, var(--background));
6871
- padding-inline: var(--spacing-4, var(--space-4));
6872
- padding-block: var(--spacing-3, var(--space-3));
6873
- }
6874
- rui-tabs[variant='ghost'] {
6875
- gap: 0px;
6876
- }
6877
- rui-tabs[variant='ghost'] .rui-tabs__list {
6878
- gap: var(--spacing-1, var(--space-1));
6879
- border-bottom-style: var(--tw-border-style);
6880
- border-bottom-width: 1px;
6881
- border-color: var(--color-border, var(--border));
6882
- }
6883
- rui-tabs[variant='ghost'] .rui-tabs__tab {
6884
- border-top-left-radius: var(--radius-md, var(--border-radius-md));
6885
- border-top-right-radius: var(--radius-md, var(--border-radius-md));
6886
- padding-inline: var(--spacing-control-x, var(--space-control-x));
6887
- padding-block: var(--spacing-2, var(--space-2));
6888
- font-size: var(--text-sm, var(--text-sm));
6889
- line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
6890
- }
6891
- rui-tabs[variant='ghost'] .rui-tabs__panel {
6892
- padding-inline: var(--spacing-1, var(--space-1));
6893
- padding-block: var(--spacing-4, var(--space-4));
6894
- }
6895
- }
6896
- rui-tag-group {
6897
- display: inline-flex;
6898
- }
6899
- @layer components {
6900
- .rui-tag-group__list {
6901
- display: flex;
6902
- flex-wrap: wrap;
6903
- gap: var(--spacing-1, var(--space-1));
6904
- }
6905
- .rui-tag {
6906
- display: inline-flex;
6907
- max-width: 100%;
6908
- align-items: center;
6909
- gap: var(--spacing-1, var(--space-1));
6910
- border-radius: var(--radius-pill, var(--radius-pill));
6911
- border-style: var(--tw-border-style);
6912
- border-width: 1px;
6913
- border-color: var(--color-border, var(--border));
6914
- background-color: var(--color-surface, var(--surface));
6915
- padding-inline: var(--spacing-2, var(--space-2));
6916
- padding-block: calc(var(--spacing, 0.25rem) * 0.5);
6917
- font-size: var(--text-xs, var(--text-xs));
6918
- line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
6919
- color: var(--color-on-background, var(--on-background));
6920
- }
6921
- .rui-tag[aria-selected='true'] {
6922
- border-color: var(--color-primary, var(--primary));
6923
- background-color: var(--color-primary, var(--primary));
6924
- @media (forced-colors: active) {
6925
- background-image: none;
6926
- }
6927
- @media (forced-colors: active) {
6928
- background-image: none;
6929
- }
6930
- @media (forced-colors: active) {
6931
- background-image: none;
6932
- }
6933
- @media (forced-colors: active) {
6934
- background-image: none;
6935
- }
6936
- @media (forced-colors: active) {
6937
- background-image: none;
6938
- }
6939
- @media (forced-colors: active) {
6940
- background-image: none;
6941
- }
6942
- @media (forced-colors: active) {
6943
- background-image: none;
6944
- }
6945
- @media (forced-colors: active) {
6946
- background-image: none;
6947
- }
6948
- @media (forced-colors: active) {
6949
- background-image: none;
6950
- }
6951
- @media (forced-colors: active) {
6952
- background-image: none;
6953
- }
6954
- @media (forced-colors: active) {
6955
- background-image: none;
6956
- }
6957
- @media (forced-colors: active) {
6958
- background-image: none;
6959
- }
6960
- @media (forced-colors: active) {
6961
- background-image: none;
6962
- }
6963
- @media (forced-colors: active) {
6964
- background-image: none;
6965
- }
6966
- @media (forced-colors: active) {
6967
- background-image: none;
6968
- }
6969
- @media (forced-colors: active) {
6970
- background-image: none;
6971
- }
6972
- @media (forced-colors: active) {
6973
- background-image: none;
6974
- }
6975
- @media (forced-colors: active) {
6976
- background-image: none;
6977
- }
6978
- @media (forced-colors: active) {
6979
- background-image: none;
6980
- }
6981
- @media (forced-colors: active) {
6982
- background-image: none;
6983
- }
6984
- @media (forced-colors: active) {
6985
- background-image: none;
6986
- }
6987
- @media (forced-colors: active) {
6988
- background-image: none;
6989
- }
6990
- @media (forced-colors: active) {
6991
- background-image: none;
6992
- }
6993
- @media (forced-colors: active) {
6994
- background-image: none;
6995
- }
6996
- @media (forced-colors: active) {
6997
- background-image: none;
6998
- }
6999
- @media (forced-colors: active) {
7000
- background-image: none;
7001
- }
7002
- @media (forced-colors: active) {
7003
- background-image: none;
7004
- }
7005
- @media (forced-colors: active) {
7006
- background-image: none;
7007
- }
7008
- @media (forced-colors: active) {
7009
- background-image: none;
7010
- }
7011
- @media (forced-colors: active) {
7012
- background-image: none;
7013
- }
7014
- @media (forced-colors: active) {
7015
- background-image: none;
7016
- }
7017
- @media (forced-colors: active) {
7018
- background-image: none;
7019
- }
7020
- @media (forced-colors: active) {
7021
- background-image: none;
7022
- }
7023
- @media (forced-colors: active) {
7024
- background-image: none;
7025
- }
7026
- @media (forced-colors: active) {
7027
- background-image: none;
7028
- }
7029
- @media (forced-colors: active) {
7030
- background-image: none;
7031
- }
7032
- @media (forced-colors: active) {
7033
- background-image: none;
7034
- }
7035
- @media (forced-colors: active) {
7036
- background-image: none;
7037
- }
7038
- @media (forced-colors: active) {
7039
- background-image: none;
7040
- }
7041
- @media (forced-colors: active) {
7042
- background-image: none;
7043
- }
7044
- @media (forced-colors: active) {
7045
- background-image: none;
7046
- }
7047
- @media (forced-colors: active) {
7048
- background-image: none;
7049
- }
7050
- @media (forced-colors: active) {
7051
- background-image: none;
7052
- }
7053
- @media (forced-colors: active) {
7054
- background-image: none;
7055
- }
5219
+ font-weight: var(--font-weight-medium, var(--weight-medium));
5220
+ color: var(--color-on-surface-container-low, var(--on-surface-container-low));
5221
+ opacity: 100%;
5222
+ }
5223
+ rui-tabs[variant='boxed'] .rui-tabs__panel {
5224
+ background-color: var(--color-background, var(--background));
5225
+ padding: var(--spacing-inset, var(--space-inset));
5226
+ }
5227
+ rui-tabs[variant='ghost'] {
5228
+ gap: 0px;
5229
+ }
5230
+ rui-tabs[variant='ghost'] .rui-tabs__list {
5231
+ gap: var(--spacing-1, var(--space-1));
5232
+ border-bottom-style: var(--tw-border-style);
5233
+ border-bottom-width: 1px;
5234
+ border-color: var(--color-border, var(--border));
5235
+ }
5236
+ rui-tabs[variant='ghost'] .rui-tabs__tab {
5237
+ border-top-left-radius: var(--radius-control, var(--radius-control));
5238
+ border-top-right-radius: var(--radius-control, var(--radius-control));
5239
+ padding-inline: var(--spacing-control-x, var(--space-control-x));
5240
+ padding-block: var(--spacing-control-y, var(--space-control-y));
5241
+ font-size: var(--text-sm, var(--text-sm));
5242
+ line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
5243
+ }
5244
+ rui-tabs[variant='ghost'] .rui-tabs__panel {
5245
+ padding-inline: var(--spacing-1, var(--space-1));
5246
+ padding-block: var(--spacing-inset, var(--space-inset));
5247
+ }
5248
+ }
5249
+ rui-tag-group {
5250
+ display: inline-flex;
5251
+ }
5252
+ @layer components {
5253
+ .rui-tag-group__list {
5254
+ display: flex;
5255
+ flex-wrap: wrap;
5256
+ gap: var(--spacing-1, var(--space-1));
5257
+ }
5258
+ .rui-tag {
5259
+ display: inline-flex;
5260
+ max-width: 100%;
5261
+ align-items: center;
5262
+ gap: var(--spacing-1, var(--space-1));
5263
+ border-radius: var(--radius-pill, var(--radius-pill));
5264
+ border-style: var(--tw-border-style);
5265
+ border-width: 1px;
5266
+ border-color: var(--color-border, var(--border));
5267
+ background-color: var(--color-surface, var(--surface));
5268
+ padding-inline: var(--spacing-2, var(--space-2));
5269
+ padding-block: calc(var(--spacing, 0.25rem) * 0.5);
5270
+ font-size: var(--text-xs, var(--text-xs));
5271
+ line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
5272
+ color: var(--color-on-background, var(--on-background));
5273
+ }
5274
+ .rui-tag[aria-selected='true'] {
5275
+ border-color: var(--color-primary, var(--primary));
5276
+ background-color: var(--color-primary, var(--primary));
7056
5277
  @media (forced-colors: active) {
7057
5278
  background-image: none;
7058
5279
  }
@@ -7275,15 +5496,9 @@ rui-tag-group {
7275
5496
  line-height: 1;
7276
5497
  }
7277
5498
  .rui-tag__remove:hover {
7278
- background-color: color-mix(in srgb, oklch(0% 0 0) 10%, transparent);
5499
+ background-color: var(--color-on-background, var(--on-background));
7279
5500
  @supports (color: color-mix(in lab, red, red)) {
7280
- background-color: color-mix(in oklab, var(--color-black, oklch(0% 0 0)) 10%, transparent);
7281
- }
7282
- @media (prefers-color-scheme: dark) {
7283
- background-color: color-mix(in srgb, oklch(100% 0 0) 10%, transparent);
7284
- @supports (color: color-mix(in lab, red, red)) {
7285
- background-color: color-mix(in oklab, var(--color-white, oklch(100% 0 0)) 10%, transparent);
7286
- }
5501
+ background-color: color-mix(in oklab, var(--color-on-background, var(--on-background)) 10%, transparent);
7287
5502
  }
7288
5503
  }
7289
5504
  .rui-tag__remove:focus-visible {
@@ -7340,6 +5555,9 @@ rui-toaster {
7340
5555
  margin: 0;
7341
5556
  padding: 0;
7342
5557
  }
5558
+ rui-toaster[data-contained='true'] {
5559
+ position: absolute;
5560
+ }
7343
5561
  rui-toaster[data-y-position='top'] {
7344
5562
  top: var(--viewport-offset, 24px);
7345
5563
  bottom: auto;
@@ -7402,6 +5620,10 @@ rui-toaster[data-y-position='top'] rui-toast:not([data-mounted='true']) {
7402
5620
  rui-toast[data-mounted='true'] {
7403
5621
  opacity: 1;
7404
5622
  }
5623
+ rui-toast[data-mounted='true'][data-visible='false'] {
5624
+ opacity: 0;
5625
+ pointer-events: none;
5626
+ }
7405
5627
  rui-toast[data-expanded='false'][data-front='false'] {
7406
5628
  pointer-events: none;
7407
5629
  }
@@ -7411,6 +5633,7 @@ rui-toast[data-swiping='true'] {
7411
5633
  }
7412
5634
  rui-toast[data-removed='true'][data-swipe-out='false'] {
7413
5635
  opacity: 0;
5636
+ transition: transform 400ms ease, opacity 200ms ease, height 400ms ease;
7414
5637
  }
7415
5638
  rui-toaster[data-y-position='bottom'] rui-toast[data-removed='true'][data-swipe-out='false'] {
7416
5639
  --y: translateY(100%);
@@ -7435,7 +5658,7 @@ rui-toast[data-swipe-out='true'][data-swipe-direction='up'] {
7435
5658
  rui-toast[data-swipe-out='true'][data-swipe-direction='down'] {
7436
5659
  animation-name: rui-toast-swipe-out-down;
7437
5660
  }
7438
- rui-toast[data-expanded='true']::after {
5661
+ rui-toaster[data-y-position='bottom'] rui-toast[data-expanded='true']::after {
7439
5662
  content: '';
7440
5663
  position: absolute;
7441
5664
  left: 0;
@@ -7443,6 +5666,14 @@ rui-toast[data-expanded='true']::after {
7443
5666
  height: calc(var(--gap, 14px) + 1px);
7444
5667
  bottom: 100%;
7445
5668
  }
5669
+ rui-toaster[data-y-position='top'] rui-toast[data-expanded='true']::after {
5670
+ content: '';
5671
+ position: absolute;
5672
+ left: 0;
5673
+ width: 100%;
5674
+ height: calc(var(--gap, 14px) + 1px);
5675
+ top: 100%;
5676
+ }
7446
5677
  @layer components {
7447
5678
  .rui-toaster-region {
7448
5679
  display: contents;
@@ -7468,7 +5699,7 @@ rui-toast[data-expanded='true']::after {
7468
5699
  display: flex;
7469
5700
  width: 100%;
7470
5701
  align-items: center;
7471
- gap: var(--spacing-2, var(--space-2));
5702
+ gap: var(--spacing-inline, var(--space-inline));
7472
5703
  border-radius: var(--radius-container, var(--radius-container));
7473
5704
  border-style: var(--tw-border-style);
7474
5705
  border-width: 1px;
@@ -7658,138 +5889,6 @@ rui-toast[data-expanded='true']::after {
7658
5889
  @media (forced-colors: active) {
7659
5890
  background-image: none;
7660
5891
  }
7661
- @media (forced-colors: active) {
7662
- background-image: none;
7663
- }
7664
- @media (forced-colors: active) {
7665
- background-image: none;
7666
- }
7667
- @media (forced-colors: active) {
7668
- background-image: none;
7669
- }
7670
- @media (forced-colors: active) {
7671
- background-image: none;
7672
- }
7673
- @media (forced-colors: active) {
7674
- background-image: none;
7675
- }
7676
- @media (forced-colors: active) {
7677
- background-image: none;
7678
- }
7679
- @media (forced-colors: active) {
7680
- background-image: none;
7681
- }
7682
- @media (forced-colors: active) {
7683
- background-image: none;
7684
- }
7685
- @media (forced-colors: active) {
7686
- background-image: none;
7687
- }
7688
- @media (forced-colors: active) {
7689
- background-image: none;
7690
- }
7691
- @media (forced-colors: active) {
7692
- background-image: none;
7693
- }
7694
- @media (forced-colors: active) {
7695
- background-image: none;
7696
- }
7697
- @media (forced-colors: active) {
7698
- background-image: none;
7699
- }
7700
- @media (forced-colors: active) {
7701
- background-image: none;
7702
- }
7703
- @media (forced-colors: active) {
7704
- background-image: none;
7705
- }
7706
- @media (forced-colors: active) {
7707
- background-image: none;
7708
- }
7709
- @media (forced-colors: active) {
7710
- background-image: none;
7711
- }
7712
- @media (forced-colors: active) {
7713
- background-image: none;
7714
- }
7715
- @media (forced-colors: active) {
7716
- background-image: none;
7717
- }
7718
- @media (forced-colors: active) {
7719
- background-image: none;
7720
- }
7721
- @media (forced-colors: active) {
7722
- background-image: none;
7723
- }
7724
- @media (forced-colors: active) {
7725
- background-image: none;
7726
- }
7727
- @media (forced-colors: active) {
7728
- background-image: none;
7729
- }
7730
- @media (forced-colors: active) {
7731
- background-image: none;
7732
- }
7733
- @media (forced-colors: active) {
7734
- background-image: none;
7735
- }
7736
- @media (forced-colors: active) {
7737
- background-image: none;
7738
- }
7739
- @media (forced-colors: active) {
7740
- background-image: none;
7741
- }
7742
- @media (forced-colors: active) {
7743
- background-image: none;
7744
- }
7745
- @media (forced-colors: active) {
7746
- background-image: none;
7747
- }
7748
- @media (forced-colors: active) {
7749
- background-image: none;
7750
- }
7751
- @media (forced-colors: active) {
7752
- background-image: none;
7753
- }
7754
- @media (forced-colors: active) {
7755
- background-image: none;
7756
- }
7757
- @media (forced-colors: active) {
7758
- background-image: none;
7759
- }
7760
- @media (forced-colors: active) {
7761
- background-image: none;
7762
- }
7763
- @media (forced-colors: active) {
7764
- background-image: none;
7765
- }
7766
- @media (forced-colors: active) {
7767
- background-image: none;
7768
- }
7769
- @media (forced-colors: active) {
7770
- background-image: none;
7771
- }
7772
- @media (forced-colors: active) {
7773
- background-image: none;
7774
- }
7775
- @media (forced-colors: active) {
7776
- background-image: none;
7777
- }
7778
- @media (forced-colors: active) {
7779
- background-image: none;
7780
- }
7781
- @media (forced-colors: active) {
7782
- background-image: none;
7783
- }
7784
- @media (forced-colors: active) {
7785
- background-image: none;
7786
- }
7787
- @media (forced-colors: active) {
7788
- background-image: none;
7789
- }
7790
- @media (forced-colors: active) {
7791
- background-image: none;
7792
- }
7793
5892
  background-image: var(--sheen-image);
7794
5893
  @media (forced-colors: active) {
7795
5894
  background-image: none;
@@ -7805,9 +5904,12 @@ rui-toast[data-expanded='true']::after {
7805
5904
  color: var(--color-on-surface, var(--on-surface));
7806
5905
  }
7807
5906
  .rui-toast--info {
7808
- border-color: var(--color-border, var(--border));
5907
+ border-color: var(--color-info, var(--info));
5908
+ @supports (color: color-mix(in lab, red, red)) {
5909
+ border-color: color-mix(in oklab, var(--color-info, var(--info)) 40%, transparent);
5910
+ }
7809
5911
  background-color: var(--color-surface, var(--surface));
7810
- color: var(--color-on-surface, var(--on-surface));
5912
+ color: var(--color-info, var(--info));
7811
5913
  }
7812
5914
  .rui-toast--success {
7813
5915
  border-color: var(--color-success, var(--success));
@@ -7818,9 +5920,12 @@ rui-toast[data-expanded='true']::after {
7818
5920
  color: var(--color-success, var(--success));
7819
5921
  }
7820
5922
  .rui-toast--warning {
7821
- border-color: var(--color-border, var(--border));
5923
+ border-color: var(--color-warning, var(--warning));
5924
+ @supports (color: color-mix(in lab, red, red)) {
5925
+ border-color: color-mix(in oklab, var(--color-warning, var(--warning)) 40%, transparent);
5926
+ }
7822
5927
  background-color: var(--color-surface, var(--surface));
7823
- color: var(--color-on-surface, var(--on-surface));
5928
+ color: var(--color-warning, var(--warning));
7824
5929
  }
7825
5930
  .rui-toast--error {
7826
5931
  border-color: var(--color-error, var(--error));
@@ -8032,6 +6137,8 @@ rui-toc {
8032
6137
  }
8033
6138
  padding: 0px;
8034
6139
  padding-left: var(--spacing-3, var(--space-3));
6140
+ --rui-docs-navigation-inset: var(--space-3);
6141
+ padding-left: var(--rui-docs-navigation-inset);
8035
6142
  }
8036
6143
  .rui-toc__item + .rui-toc__item {
8037
6144
  margin-top: var(--spacing-2, var(--space-2));
@@ -8070,6 +6177,7 @@ rui-toc {
8070
6177
  border-top-right-radius: var(--radius-sm, var(--border-radius-sm));
8071
6178
  border-bottom-right-radius: var(--radius-sm, var(--border-radius-sm));
8072
6179
  background-color: var(--color-primary, var(--primary));
6180
+ left: calc(-1 * (var(--rui-docs-navigation-inset) + 1px));
8073
6181
  }
8074
6182
  .rui-toc__item--depth-3 .rui-toc__link {
8075
6183
  margin-left: var(--spacing-3, var(--space-3));
@@ -8337,7 +6445,7 @@ rui-window-splitter {
8337
6445
  flex: 1;
8338
6446
  overflow: auto;
8339
6447
  background-color: var(--color-background, var(--background));
8340
- padding: var(--spacing-3, var(--space-3));
6448
+ padding: var(--spacing-inset, var(--space-inset));
8341
6449
  font-size: var(--text-sm, var(--text-sm));
8342
6450
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
8343
6451
  }
@@ -8367,23 +6475,6 @@ rui-window-splitter {
8367
6475
  outline-style: none;
8368
6476
  }
8369
6477
  }
8370
- @property --tw-border-style {
8371
- syntax: "*";
8372
- inherits: false;
8373
- initial-value: solid;
8374
- }
8375
- @property --tw-font-weight {
8376
- syntax: "*";
8377
- inherits: false;
8378
- }
8379
- @property --tw-duration {
8380
- syntax: "*";
8381
- inherits: false;
8382
- }
8383
- @property --tw-ease {
8384
- syntax: "*";
8385
- inherits: false;
8386
- }
8387
6478
  @property --tw-shadow {
8388
6479
  syntax: "*";
8389
6480
  inherits: false;
@@ -8449,10 +6540,27 @@ rui-window-splitter {
8449
6540
  inherits: false;
8450
6541
  initial-value: 0 0 #0000;
8451
6542
  }
6543
+ @property --tw-font-weight {
6544
+ syntax: "*";
6545
+ inherits: false;
6546
+ }
6547
+ @property --tw-border-style {
6548
+ syntax: "*";
6549
+ inherits: false;
6550
+ initial-value: solid;
6551
+ }
8452
6552
  @property --tw-tracking {
8453
6553
  syntax: "*";
8454
6554
  inherits: false;
8455
6555
  }
6556
+ @property --tw-duration {
6557
+ syntax: "*";
6558
+ inherits: false;
6559
+ }
6560
+ @property --tw-ease {
6561
+ syntax: "*";
6562
+ inherits: false;
6563
+ }
8456
6564
  @property --tw-translate-x {
8457
6565
  syntax: "*";
8458
6566
  inherits: false;
@@ -8536,10 +6644,6 @@ rui-window-splitter {
8536
6644
  @layer properties {
8537
6645
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
8538
6646
  *, ::before, ::after, ::backdrop {
8539
- --tw-border-style: solid;
8540
- --tw-font-weight: initial;
8541
- --tw-duration: initial;
8542
- --tw-ease: initial;
8543
6647
  --tw-shadow: 0 0 #0000;
8544
6648
  --tw-shadow-color: initial;
8545
6649
  --tw-shadow-alpha: 100%;
@@ -8554,7 +6658,11 @@ rui-window-splitter {
8554
6658
  --tw-ring-offset-width: 0px;
8555
6659
  --tw-ring-offset-color: #fff;
8556
6660
  --tw-ring-offset-shadow: 0 0 #0000;
6661
+ --tw-font-weight: initial;
6662
+ --tw-border-style: solid;
8557
6663
  --tw-tracking: initial;
6664
+ --tw-duration: initial;
6665
+ --tw-ease: initial;
8558
6666
  --tw-translate-x: 0;
8559
6667
  --tw-translate-y: 0;
8560
6668
  --tw-translate-z: 0;