@rokkit/themes 1.0.0-next.15 → 1.0.0-next.150

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 (320) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +106 -9
  3. package/build.mjs +244 -0
  4. package/dist/ant-design.css +2065 -0
  5. package/dist/base.css +5560 -0
  6. package/dist/bits-ui.css +2060 -0
  7. package/dist/carbon.css +2072 -0
  8. package/dist/daisy-ui.css +2081 -0
  9. package/dist/glass.css +1760 -0
  10. package/dist/grada-ui.css +1766 -0
  11. package/dist/index.css +25485 -0
  12. package/dist/material.css +1847 -0
  13. package/dist/minimal.css +1905 -0
  14. package/dist/rokkit.css +2306 -0
  15. package/dist/shadcn.css +2053 -0
  16. package/package.json +82 -52
  17. package/src/ant-design/button.css +183 -0
  18. package/src/ant-design/card.css +100 -0
  19. package/src/ant-design/chart.css +34 -0
  20. package/src/ant-design/connector.css +11 -0
  21. package/src/ant-design/dropdown.css +50 -0
  22. package/src/ant-design/floating-action.css +63 -0
  23. package/src/ant-design/floating-navigation.css +70 -0
  24. package/src/ant-design/grid.css +46 -0
  25. package/src/ant-design/index.css +34 -0
  26. package/src/ant-design/input.css +149 -0
  27. package/src/ant-design/list.css +126 -0
  28. package/src/ant-design/menu.css +88 -0
  29. package/src/ant-design/message.css +35 -0
  30. package/src/ant-design/range.css +61 -0
  31. package/src/ant-design/search-filter.css +49 -0
  32. package/src/ant-design/select.css +158 -0
  33. package/src/ant-design/status-list.css +66 -0
  34. package/src/ant-design/switch.css +29 -0
  35. package/src/ant-design/table.css +89 -0
  36. package/src/ant-design/tabs.css +149 -0
  37. package/src/ant-design/timeline.css +45 -0
  38. package/src/ant-design/toc.css +18 -0
  39. package/src/ant-design/toggle.css +48 -0
  40. package/src/ant-design/toolbar.css +85 -0
  41. package/src/ant-design/tree.css +127 -0
  42. package/src/ant-design/upload-progress.css +102 -0
  43. package/src/ant-design/upload-target.css +50 -0
  44. package/src/base/alert-list.css +91 -0
  45. package/src/base/breadcrumbs.css +47 -0
  46. package/src/base/button.css +254 -0
  47. package/src/base/card.css +36 -0
  48. package/src/base/carousel.css +128 -0
  49. package/src/base/chart.css +94 -0
  50. package/src/base/connector.css +92 -0
  51. package/src/base/display.css +91 -0
  52. package/src/base/dropdown.css +166 -0
  53. package/src/base/floating-action.css +388 -0
  54. package/src/base/floating-navigation.css +405 -0
  55. package/src/base/graph-paper.css +83 -0
  56. package/src/base/grid.css +93 -0
  57. package/src/base/index.css +47 -0
  58. package/src/base/input.css +288 -0
  59. package/src/base/item.css +78 -0
  60. package/src/base/list.css +183 -0
  61. package/src/base/menu.css +274 -0
  62. package/src/base/message.css +62 -0
  63. package/src/base/pill.css +57 -0
  64. package/src/base/progress.css +34 -0
  65. package/src/base/range.css +121 -0
  66. package/src/base/rating.css +42 -0
  67. package/src/base/reveal.css +37 -0
  68. package/src/base/search-filter.css +132 -0
  69. package/src/base/select.css +411 -0
  70. package/src/base/shine.css +14 -0
  71. package/src/base/status-list.css +19 -0
  72. package/src/base/stepper.css +140 -0
  73. package/src/base/swatch.css +79 -0
  74. package/src/base/switch.css +152 -0
  75. package/src/base/table.css +159 -0
  76. package/src/base/tabs.css +171 -0
  77. package/src/base/tilt.css +14 -0
  78. package/src/base/timeline.css +84 -0
  79. package/src/base/toc.css +50 -0
  80. package/src/base/toggle.css +138 -0
  81. package/src/base/toolbar.css +341 -0
  82. package/src/base/tree.css +235 -0
  83. package/src/base/upload-progress.css +155 -0
  84. package/src/base/upload-target.css +67 -0
  85. package/src/bits-ui/button.css +176 -0
  86. package/src/bits-ui/card.css +99 -0
  87. package/src/bits-ui/chart.css +34 -0
  88. package/src/bits-ui/connector.css +11 -0
  89. package/src/bits-ui/dropdown.css +50 -0
  90. package/src/bits-ui/floating-action.css +63 -0
  91. package/src/bits-ui/floating-navigation.css +70 -0
  92. package/src/bits-ui/grid.css +46 -0
  93. package/src/bits-ui/index.css +34 -0
  94. package/src/bits-ui/input.css +150 -0
  95. package/src/bits-ui/list.css +126 -0
  96. package/src/bits-ui/menu.css +88 -0
  97. package/src/bits-ui/message.css +35 -0
  98. package/src/bits-ui/range.css +61 -0
  99. package/src/bits-ui/search-filter.css +49 -0
  100. package/src/bits-ui/select.css +158 -0
  101. package/src/bits-ui/status-list.css +66 -0
  102. package/src/bits-ui/switch.css +29 -0
  103. package/src/bits-ui/table.css +89 -0
  104. package/src/bits-ui/tabs.css +151 -0
  105. package/src/bits-ui/timeline.css +45 -0
  106. package/src/bits-ui/toc.css +18 -0
  107. package/src/bits-ui/toggle.css +48 -0
  108. package/src/bits-ui/toolbar.css +85 -0
  109. package/src/bits-ui/tree.css +127 -0
  110. package/src/bits-ui/upload-progress.css +102 -0
  111. package/src/bits-ui/upload-target.css +50 -0
  112. package/src/carbon/button.css +183 -0
  113. package/src/carbon/card.css +97 -0
  114. package/src/carbon/chart.css +34 -0
  115. package/src/carbon/connector.css +11 -0
  116. package/src/carbon/dropdown.css +50 -0
  117. package/src/carbon/floating-action.css +63 -0
  118. package/src/carbon/floating-navigation.css +70 -0
  119. package/src/carbon/grid.css +46 -0
  120. package/src/carbon/index.css +33 -0
  121. package/src/carbon/input.css +148 -0
  122. package/src/carbon/list.css +126 -0
  123. package/src/carbon/menu.css +88 -0
  124. package/src/carbon/message.css +37 -0
  125. package/src/carbon/range.css +61 -0
  126. package/src/carbon/search-filter.css +49 -0
  127. package/src/carbon/select.css +158 -0
  128. package/src/carbon/status-list.css +66 -0
  129. package/src/carbon/switch.css +31 -0
  130. package/src/carbon/table.css +93 -0
  131. package/src/carbon/tabs.css +149 -0
  132. package/src/carbon/timeline.css +45 -0
  133. package/src/carbon/toc.css +22 -0
  134. package/src/carbon/toggle.css +48 -0
  135. package/src/carbon/toolbar.css +85 -0
  136. package/src/carbon/tree.css +127 -0
  137. package/src/carbon/upload-progress.css +102 -0
  138. package/src/carbon/upload-target.css +50 -0
  139. package/src/daisy-ui/button.css +195 -0
  140. package/src/daisy-ui/card.css +99 -0
  141. package/src/daisy-ui/chart.css +34 -0
  142. package/src/daisy-ui/connector.css +11 -0
  143. package/src/daisy-ui/dropdown.css +50 -0
  144. package/src/daisy-ui/floating-action.css +63 -0
  145. package/src/daisy-ui/floating-navigation.css +70 -0
  146. package/src/daisy-ui/grid.css +46 -0
  147. package/src/daisy-ui/index.css +33 -0
  148. package/src/daisy-ui/input.css +146 -0
  149. package/src/daisy-ui/list.css +127 -0
  150. package/src/daisy-ui/menu.css +88 -0
  151. package/src/daisy-ui/message.css +37 -0
  152. package/src/daisy-ui/range.css +61 -0
  153. package/src/daisy-ui/search-filter.css +49 -0
  154. package/src/daisy-ui/select.css +158 -0
  155. package/src/daisy-ui/status-list.css +66 -0
  156. package/src/daisy-ui/switch.css +31 -0
  157. package/src/daisy-ui/table.css +89 -0
  158. package/src/daisy-ui/tabs.css +149 -0
  159. package/src/daisy-ui/timeline.css +45 -0
  160. package/src/daisy-ui/toc.css +22 -0
  161. package/src/daisy-ui/toggle.css +48 -0
  162. package/src/daisy-ui/toolbar.css +85 -0
  163. package/src/daisy-ui/tree.css +127 -0
  164. package/src/daisy-ui/upload-progress.css +102 -0
  165. package/src/daisy-ui/upload-target.css +50 -0
  166. package/src/glass/button.css +174 -0
  167. package/src/glass/card.css +103 -0
  168. package/src/glass/chart.css +38 -0
  169. package/src/glass/dropdown.css +50 -0
  170. package/src/glass/floating-action.css +61 -0
  171. package/src/glass/floating-navigation.css +74 -0
  172. package/src/glass/index.css +30 -0
  173. package/src/glass/input.css +128 -0
  174. package/src/glass/list.css +122 -0
  175. package/src/glass/menu.css +92 -0
  176. package/src/glass/message.css +36 -0
  177. package/src/glass/range.css +61 -0
  178. package/src/glass/search-filter.css +49 -0
  179. package/src/glass/select.css +178 -0
  180. package/src/glass/status-list.css +66 -0
  181. package/src/glass/swatch.css +19 -0
  182. package/src/glass/switch.css +28 -0
  183. package/src/glass/table.css +87 -0
  184. package/src/glass/tabs.css +58 -0
  185. package/src/glass/timeline.css +46 -0
  186. package/src/glass/toc.css +18 -0
  187. package/src/glass/toggle.css +48 -0
  188. package/src/glass/toolbar.css +84 -0
  189. package/src/glass/tree.css +110 -0
  190. package/src/grada-ui/button.css +235 -0
  191. package/src/grada-ui/card.css +90 -0
  192. package/src/grada-ui/chart.css +34 -0
  193. package/src/grada-ui/dropdown.css +54 -0
  194. package/src/grada-ui/floating-action.css +59 -0
  195. package/src/grada-ui/floating-navigation.css +65 -0
  196. package/src/grada-ui/index.css +55 -0
  197. package/src/grada-ui/input.css +154 -0
  198. package/src/grada-ui/list.css +112 -0
  199. package/src/grada-ui/menu.css +81 -0
  200. package/src/grada-ui/message.css +48 -0
  201. package/src/grada-ui/range.css +55 -0
  202. package/src/grada-ui/search-filter.css +43 -0
  203. package/src/grada-ui/select.css +172 -0
  204. package/src/grada-ui/status-list.css +62 -0
  205. package/src/grada-ui/switch.css +31 -0
  206. package/src/grada-ui/table.css +79 -0
  207. package/src/grada-ui/tabs.css +55 -0
  208. package/src/grada-ui/timeline.css +38 -0
  209. package/src/grada-ui/toc.css +24 -0
  210. package/src/grada-ui/toggle.css +43 -0
  211. package/src/grada-ui/toolbar.css +83 -0
  212. package/src/grada-ui/tree.css +94 -0
  213. package/src/index.css +18 -0
  214. package/src/index.js +25 -2
  215. package/src/material/button.css +178 -0
  216. package/src/material/card.css +99 -0
  217. package/src/material/chart.css +38 -0
  218. package/src/material/dropdown.css +50 -0
  219. package/src/material/floating-action.css +64 -0
  220. package/src/material/floating-navigation.css +74 -0
  221. package/src/material/index.css +30 -0
  222. package/src/material/input.css +164 -0
  223. package/src/material/list.css +126 -0
  224. package/src/material/menu.css +92 -0
  225. package/src/material/message.css +36 -0
  226. package/src/material/range.css +62 -0
  227. package/src/material/search-filter.css +49 -0
  228. package/src/material/select.css +175 -0
  229. package/src/material/status-list.css +66 -0
  230. package/src/material/swatch.css +19 -0
  231. package/src/material/switch.css +28 -0
  232. package/src/material/table.css +91 -0
  233. package/src/material/tabs.css +85 -0
  234. package/src/material/timeline.css +46 -0
  235. package/src/material/toc.css +18 -0
  236. package/src/material/toggle.css +48 -0
  237. package/src/material/toolbar.css +85 -0
  238. package/src/material/tree.css +124 -0
  239. package/src/minimal/button.css +176 -0
  240. package/src/minimal/card.css +99 -0
  241. package/src/minimal/chart.css +38 -0
  242. package/src/minimal/dropdown.css +50 -0
  243. package/src/minimal/floating-action.css +63 -0
  244. package/src/minimal/floating-navigation.css +70 -0
  245. package/src/minimal/index.css +30 -0
  246. package/src/minimal/input.css +171 -0
  247. package/src/minimal/list.css +126 -0
  248. package/src/minimal/menu.css +88 -0
  249. package/src/minimal/message.css +36 -0
  250. package/src/minimal/range.css +61 -0
  251. package/src/minimal/search-filter.css +49 -0
  252. package/src/minimal/select.css +170 -0
  253. package/src/minimal/status-list.css +66 -0
  254. package/src/minimal/swatch.css +19 -0
  255. package/src/minimal/switch.css +32 -0
  256. package/src/minimal/table.css +89 -0
  257. package/src/minimal/tabs.css +149 -0
  258. package/src/minimal/timeline.css +45 -0
  259. package/src/minimal/toc.css +18 -0
  260. package/src/minimal/toggle.css +48 -0
  261. package/src/minimal/toolbar.css +85 -0
  262. package/src/minimal/tree.css +127 -0
  263. package/src/palette.css +7 -0
  264. package/src/rokkit/button.css +290 -0
  265. package/src/rokkit/card.css +102 -0
  266. package/src/rokkit/chart.css +38 -0
  267. package/src/rokkit/connector.css +11 -0
  268. package/src/rokkit/dropdown.css +70 -0
  269. package/src/rokkit/floating-action.css +65 -0
  270. package/src/rokkit/floating-navigation.css +83 -0
  271. package/src/rokkit/grid.css +46 -0
  272. package/src/rokkit/index.css +34 -0
  273. package/src/rokkit/input.css +134 -0
  274. package/src/rokkit/list.css +177 -0
  275. package/src/rokkit/menu.css +93 -0
  276. package/src/rokkit/message.css +44 -0
  277. package/src/rokkit/range.css +62 -0
  278. package/src/rokkit/search-filter.css +49 -0
  279. package/src/rokkit/select.css +190 -0
  280. package/src/rokkit/status-list.css +68 -0
  281. package/src/rokkit/swatch.css +18 -0
  282. package/src/rokkit/switch.css +29 -0
  283. package/src/rokkit/table.css +89 -0
  284. package/src/rokkit/tabs.css +111 -0
  285. package/src/rokkit/timeline.css +46 -0
  286. package/src/rokkit/toc.css +18 -0
  287. package/src/rokkit/toggle.css +48 -0
  288. package/src/rokkit/toolbar.css +90 -0
  289. package/src/rokkit/tree.css +149 -0
  290. package/src/rokkit/upload-progress.css +102 -0
  291. package/src/rokkit/upload-target.css +50 -0
  292. package/src/shadcn/button.css +176 -0
  293. package/src/shadcn/card.css +99 -0
  294. package/src/shadcn/chart.css +34 -0
  295. package/src/shadcn/connector.css +11 -0
  296. package/src/shadcn/dropdown.css +50 -0
  297. package/src/shadcn/floating-action.css +63 -0
  298. package/src/shadcn/floating-navigation.css +70 -0
  299. package/src/shadcn/grid.css +46 -0
  300. package/src/shadcn/index.css +34 -0
  301. package/src/shadcn/input.css +141 -0
  302. package/src/shadcn/list.css +126 -0
  303. package/src/shadcn/menu.css +88 -0
  304. package/src/shadcn/message.css +35 -0
  305. package/src/shadcn/range.css +61 -0
  306. package/src/shadcn/search-filter.css +49 -0
  307. package/src/shadcn/select.css +158 -0
  308. package/src/shadcn/status-list.css +66 -0
  309. package/src/shadcn/switch.css +31 -0
  310. package/src/shadcn/table.css +89 -0
  311. package/src/shadcn/tabs.css +149 -0
  312. package/src/shadcn/timeline.css +45 -0
  313. package/src/shadcn/toc.css +20 -0
  314. package/src/shadcn/toggle.css +48 -0
  315. package/src/shadcn/toolbar.css +85 -0
  316. package/src/shadcn/tree.css +127 -0
  317. package/src/shadcn/upload-progress.css +102 -0
  318. package/src/shadcn/upload-target.css +50 -0
  319. package/src/constants.js +0 -4
  320. package/src/utils.js +0 -88
package/dist/bits-ui.css ADDED
@@ -0,0 +1,2060 @@
1
+ /**
2
+ * @rokkit/themes - bits-ui Theme
3
+ *
4
+ * Softer, more premium shadcn-inspired styling with rounded corners,
5
+ * subtle shadows, and elevated surfaces.
6
+ * Use with data-style="bits-ui" wrapper.
7
+ */
8
+
9
+ /**
10
+ * Button - bits-ui Theme Styles
11
+ *
12
+ * Softer, more premium styling with rounded corners and subtle elevation.
13
+ */
14
+
15
+ /* =============================================================================
16
+ Default Style (filled)
17
+ ============================================================================= */
18
+
19
+ [data-style='bits-ui'] [data-button][data-style='default'][data-variant='default'],
20
+ [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='default'],
21
+ [data-style='bits-ui'] [data-button][data-style='default']:not([data-variant]),
22
+ [data-style='bits-ui'] [data-button]:not([data-style]):not([data-variant]) {
23
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
24
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"][data-variant="default"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"][data-variant="default"],[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style])[data-variant="default"],[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style])[data-variant="default"],[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"]:not([data-variant]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"]:not([data-variant]),[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style]):not([data-variant]),[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style]):not([data-variant]){--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
25
+
26
+ [data-style='bits-ui'] [data-button][data-style='default'][data-variant='primary'],
27
+ [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='primary'] {
28
+ border-color:transparent;border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
29
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"][data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"][data-variant="primary"],[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style])[data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style])[data-variant="primary"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));}
30
+
31
+ [data-style='bits-ui'] [data-button][data-style='default'][data-variant='secondary'],
32
+ [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='secondary'] {
33
+ border-color:transparent;border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-secondary-400),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
34
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"][data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"][data-variant="secondary"],[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style])[data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style])[data-variant="secondary"]{--un-bg-opacity:1;background-color:rgba(var(--color-secondary-600),var(--un-bg-opacity));}
35
+
36
+ [data-style='bits-ui'] [data-button][data-style='default'][data-variant='accent'],
37
+ [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='accent'] {
38
+ border-color:transparent;border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-accent-400),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-accent-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
39
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"][data-variant="accent"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"][data-variant="accent"],[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style])[data-variant="accent"],[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style])[data-variant="accent"]{--un-bg-opacity:1;background-color:rgba(var(--color-accent-600),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-accent-50),var(--un-text-opacity));}
40
+
41
+ [data-style='bits-ui'] [data-button][data-style='default'][data-variant='danger'],
42
+ [data-style='bits-ui'] [data-button]:not([data-style])[data-variant='danger'] {
43
+ border-color:transparent;border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-danger-400),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
44
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"][data-variant="danger"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"][data-variant="danger"],[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style])[data-variant="danger"],[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style])[data-variant="danger"]{--un-bg-opacity:1;background-color:rgba(var(--color-danger-600),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));}
45
+
46
+ /* =============================================================================
47
+ Outline Style
48
+ ============================================================================= */
49
+
50
+ [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='default'],
51
+ [data-style='bits-ui'] [data-button][data-style='outline']:not([data-variant]) {
52
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
53
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"][data-variant="default"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"][data-variant="default"],[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"]:not([data-variant]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"]:not([data-variant]){--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
54
+
55
+ [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='primary'] {
56
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
57
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"][data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"][data-variant="primary"]{--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
58
+
59
+ [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='secondary'] {
60
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-secondary-400),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-secondary-600),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
61
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"][data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"][data-variant="secondary"]{--un-border-opacity:1;border-color:rgba(var(--color-secondary-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-secondary-400),var(--un-text-opacity));}
62
+
63
+ [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='accent'] {
64
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-accent-400),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-accent-600),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
65
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"][data-variant="accent"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"][data-variant="accent"]{--un-border-opacity:1;border-color:rgba(var(--color-accent-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-accent-400),var(--un-text-opacity));}
66
+
67
+ [data-style='bits-ui'] [data-button][data-style='outline'][data-variant='danger'] {
68
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-danger-400),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-danger-400),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
69
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"][data-variant="danger"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"][data-variant="danger"]{--un-border-opacity:1;border-color:rgba(var(--color-danger-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-danger-600),var(--un-text-opacity));}
70
+
71
+ /* =============================================================================
72
+ Ghost Style
73
+ ============================================================================= */
74
+
75
+ [data-style='bits-ui'] [data-button][data-style='ghost'] {
76
+ border-color:transparent;border-radius:0.5rem;background-color:transparent;
77
+ }
78
+
79
+ [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='default'],
80
+ [data-style='bits-ui'] [data-button][data-style='ghost']:not([data-variant]) {
81
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
82
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="default"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="default"],[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"]:not([data-variant]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"]:not([data-variant]){--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
83
+
84
+ [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='primary'] {
85
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
86
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="primary"]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
87
+
88
+ [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='secondary'] {
89
+ --un-text-opacity:1;color:rgba(var(--color-secondary-600),var(--un-text-opacity));
90
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="secondary"]{--un-text-opacity:1;color:rgba(var(--color-secondary-400),var(--un-text-opacity));}
91
+
92
+ [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='accent'] {
93
+ --un-text-opacity:1;color:rgba(var(--color-accent-600),var(--un-text-opacity));
94
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="accent"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="accent"]{--un-text-opacity:1;color:rgba(var(--color-accent-400),var(--un-text-opacity));}
95
+
96
+ [data-style='bits-ui'] [data-button][data-style='ghost'][data-variant='danger'] {
97
+ --un-text-opacity:1;color:rgba(var(--color-danger-400),var(--un-text-opacity));
98
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="danger"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"][data-variant="danger"]{--un-text-opacity:1;color:rgba(var(--color-danger-600),var(--un-text-opacity));}
99
+
100
+ /* =============================================================================
101
+ Gradient Style
102
+ ============================================================================= */
103
+
104
+ [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='default'],
105
+ [data-style='bits-ui'] [data-button][data-style='gradient']:not([data-variant]) {
106
+ border-radius:0.5rem;--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-surface-300),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-surface-100),1) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
107
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="default"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="default"],[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="gradient"]:not([data-variant]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="gradient"]:not([data-variant]){--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-surface-700),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-surface-900),1) var(--un-gradient-to-position);--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
108
+
109
+ [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='primary'] {
110
+ border-radius:0.5rem;--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-primary-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-primary-300),1) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
111
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="primary"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-primary-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-primary-700),1) var(--un-gradient-to-position);}
112
+
113
+ [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='secondary'] {
114
+ border-radius:0.5rem;--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-secondary-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-secondary-300),1) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
115
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="secondary"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-secondary-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-secondary-700),1) var(--un-gradient-to-position);}
116
+
117
+ [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='accent'] {
118
+ border-radius:0.5rem;--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-accent-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-accent-300),1) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-accent-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
119
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="accent"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="accent"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-accent-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-accent-700),1) var(--un-gradient-to-position);--un-text-opacity:1;color:rgba(var(--color-accent-50),var(--un-text-opacity));}
120
+
121
+ [data-style='bits-ui'] [data-button][data-style='gradient'][data-variant='danger'] {
122
+ border-radius:0.5rem;--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-danger-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-danger-300),1) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
123
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="danger"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="gradient"][data-variant="danger"]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-danger-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-danger-700),1) var(--un-gradient-to-position);--un-text-opacity:1;color:rgba(var(--color-danger-50),var(--un-text-opacity));}
124
+
125
+ [data-style='bits-ui']
126
+ [data-button][data-style='gradient']:hover:not(:disabled):not([data-disabled]) {
127
+ filter: brightness(1.05);
128
+ }
129
+
130
+ /* =============================================================================
131
+ Link Style
132
+ ============================================================================= */
133
+
134
+ [data-style='bits-ui'] [data-button][data-style='link'][data-variant='default'],
135
+ [data-style='bits-ui'] [data-button][data-style='link']:not([data-variant]) {
136
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
137
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"][data-variant="default"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"][data-variant="default"],[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"]:not([data-variant]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"]:not([data-variant]){--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
138
+
139
+ [data-style='bits-ui'] [data-button][data-style='link'][data-variant='primary'] {
140
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
141
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"][data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"][data-variant="primary"]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
142
+
143
+ [data-style='bits-ui'] [data-button][data-style='link'][data-variant='secondary'] {
144
+ --un-text-opacity:1;color:rgba(var(--color-secondary-600),var(--un-text-opacity));
145
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"][data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"][data-variant="secondary"]{--un-text-opacity:1;color:rgba(var(--color-secondary-400),var(--un-text-opacity));}
146
+
147
+ [data-style='bits-ui'] [data-button][data-style='link'][data-variant='accent'] {
148
+ --un-text-opacity:1;color:rgba(var(--color-accent-600),var(--un-text-opacity));
149
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"][data-variant="accent"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"][data-variant="accent"]{--un-text-opacity:1;color:rgba(var(--color-accent-400),var(--un-text-opacity));}
150
+
151
+ [data-style='bits-ui'] [data-button][data-style='link'][data-variant='danger'] {
152
+ --un-text-opacity:1;color:rgba(var(--color-danger-400),var(--un-text-opacity));
153
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"][data-variant="danger"],[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"][data-variant="danger"]{--un-text-opacity:1;color:rgba(var(--color-danger-600),var(--un-text-opacity));}
154
+
155
+ [data-style='bits-ui'] [data-button][data-style='link']:hover:not(:disabled):not([data-disabled]) {
156
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
157
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="link"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="link"]:hover:not(:disabled):not([data-disabled]){--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
158
+
159
+ /* =============================================================================
160
+ Hover States
161
+ ============================================================================= */
162
+
163
+ [data-style='bits-ui']
164
+ [data-button][data-style='default']:hover:not(:disabled):not([data-disabled]),
165
+ [data-style='bits-ui'] [data-button]:not([data-style]):hover:not(:disabled):not([data-disabled]) {
166
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
167
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="default"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="default"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"][data-style="bits-ui"] [data-button]:not([data-style]):hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-button]:not([data-style]):hover:not(:disabled):not([data-disabled]){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
168
+
169
+ [data-style='bits-ui']
170
+ [data-button][data-style='outline']:hover:not(:disabled):not([data-disabled]) {
171
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
172
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="outline"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="outline"]:hover:not(:disabled):not([data-disabled]){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
173
+
174
+ [data-style='bits-ui'] [data-button][data-style='ghost']:hover:not(:disabled):not([data-disabled]) {
175
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
176
+ }[data-mode="dark"][data-style="bits-ui"] [data-button][data-style="ghost"]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-button][data-style="ghost"]:hover:not(:disabled):not([data-disabled]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
177
+
178
+ /* =============================================================================
179
+ Focus
180
+ ============================================================================= */
181
+
182
+ [data-style='bits-ui'] [data-button]:focus-visible {
183
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
184
+ }[data-mode="dark"][data-style="bits-ui"] [data-button]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-button]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
185
+
186
+ /**
187
+ * Toolbar - bits-ui Theme Styles
188
+ *
189
+ * Softer styling with subtle borders.
190
+ */
191
+
192
+ /* =============================================================================
193
+ Toolbar Container
194
+ ============================================================================= */
195
+
196
+ [data-style='bits-ui'] [data-toolbar] {
197
+ background-color:transparent;background-image:none;
198
+ }
199
+
200
+ /* Position-based borders */
201
+ [data-style='bits-ui'] [data-toolbar][data-toolbar-position='top'],
202
+ [data-style='bits-ui'] [data-toolbar]:not([data-toolbar-position]) {
203
+ border-bottom-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
204
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar][data-toolbar-position="top"],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar][data-toolbar-position="top"],[data-mode="dark"][data-style="bits-ui"] [data-toolbar]:not([data-toolbar-position]),[data-mode="dark"] [data-style="bits-ui"] [data-toolbar]:not([data-toolbar-position]){--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
205
+
206
+ [data-style='bits-ui'] [data-toolbar][data-toolbar-position='bottom'] {
207
+ border-top-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
208
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar][data-toolbar-position="bottom"],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar][data-toolbar-position="bottom"]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
209
+
210
+ [data-style='bits-ui'] [data-toolbar][data-toolbar-position='left'] {
211
+ border-right-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
212
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar][data-toolbar-position="left"],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar][data-toolbar-position="left"]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
213
+
214
+ [data-style='bits-ui'] [data-toolbar][data-toolbar-position='right'] {
215
+ border-left-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
216
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar][data-toolbar-position="right"],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar][data-toolbar-position="right"]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
217
+
218
+ /* =============================================================================
219
+ Toolbar Items
220
+ ============================================================================= */
221
+
222
+ [data-style='bits-ui'] [data-toolbar-item] {
223
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
224
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
225
+
226
+ [data-style='bits-ui'] [data-toolbar-item]:hover:not(:disabled):not([data-disabled='true']) {
227
+ background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
228
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item]:hover:not(:disabled):not([data-disabled="true"]){--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
229
+
230
+ [data-style='bits-ui']
231
+ [data-toolbar-item]:focus-visible:not(:disabled):not([data-disabled='true']) {
232
+ background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
233
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item]:focus-visible:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item]:focus-visible:not(:disabled):not([data-disabled="true"]){--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
234
+
235
+ /* Active/pressed state */
236
+ [data-style='bits-ui'] [data-toolbar-item][data-active='true'] {
237
+ background-image:none;--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
238
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item][data-active="true"]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
239
+
240
+ [data-style='bits-ui'] [data-toolbar-item][data-active='true']:hover:not(:disabled) {
241
+ background-image:none;--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
242
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item][data-active="true"]:hover:not(:disabled){--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
243
+
244
+ /* =============================================================================
245
+ Toolbar Icon
246
+ ============================================================================= */
247
+
248
+ [data-style='bits-ui'] [data-toolbar-item] [data-toolbar-icon] {
249
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
250
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item] [data-toolbar-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item] [data-toolbar-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
251
+
252
+ [data-style='bits-ui'] [data-toolbar-item]:hover:not(:disabled) [data-toolbar-icon] {
253
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
254
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item]:hover:not(:disabled) [data-toolbar-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item]:hover:not(:disabled) [data-toolbar-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
255
+
256
+ [data-style='bits-ui'] [data-toolbar-item][data-active='true'] [data-toolbar-icon] {
257
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
258
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-item][data-active="true"] [data-toolbar-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-item][data-active="true"] [data-toolbar-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
259
+
260
+ /* =============================================================================
261
+ Separator & Divider
262
+ ============================================================================= */
263
+
264
+ [data-style='bits-ui'] [data-toolbar-separator] {
265
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;
266
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-separator],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-separator]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
267
+
268
+ [data-style='bits-ui'] [data-toolbar-divider] {
269
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;
270
+ }[data-mode="dark"][data-style="bits-ui"] [data-toolbar-divider],[data-mode="dark"] [data-style="bits-ui"] [data-toolbar-divider]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
271
+
272
+ /**
273
+ * Tabs - bits-ui Theme Styles
274
+ *
275
+ * Pill-style tabs with rounded-lg treatment. Active tab: filled pill background.
276
+ */
277
+
278
+ /* =============================================================================
279
+ Tab List
280
+ ============================================================================= */
281
+
282
+ [data-style='bits-ui'] [data-tabs-list] {
283
+ gap:0.25rem;border-width:0px;border-bottom-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));padding-left:0;padding-right:0;
284
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-list],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-list]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
285
+
286
+ [data-style='bits-ui'] [data-tabs][data-position='after'] [data-tabs-list] {
287
+ border-top-width:1px;border-bottom-width:0px;
288
+ }
289
+
290
+ [data-style='bits-ui'] [data-tabs][data-orientation='vertical'] [data-tabs-list] {
291
+ border-right-width:1px;border-bottom-width:0px;
292
+ }
293
+
294
+ [data-style='bits-ui']
295
+ [data-tabs][data-orientation='vertical'][data-position='after']
296
+ [data-tabs-list] {
297
+ border-top-width:0px;border-right-width:0px;border-left-width:1px;
298
+ }
299
+
300
+ /* =============================================================================
301
+ Tab Triggers — default: horizontal/before
302
+ ============================================================================= */
303
+
304
+ [data-style='bits-ui'] [data-tabs-trigger] {
305
+ border-bottom-width:3px;border-bottom-color:transparent;border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
306
+ font-weight: 400;
307
+ transition:
308
+ color 150ms ease,
309
+ background-color 150ms ease,
310
+ border-color 150ms ease;
311
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-trigger]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
312
+
313
+ [data-style='bits-ui'] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]) {
314
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
315
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
316
+
317
+ [data-style='bits-ui'] [data-tabs-trigger][data-selected] {
318
+ --un-border-opacity:1;--un-border-bottom-opacity:var(--un-border-opacity);border-bottom-color:rgba(var(--color-primary-500),var(--un-border-bottom-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
319
+ font-weight: 600;
320
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-trigger][data-selected]{--un-border-opacity:1;--un-border-bottom-opacity:var(--un-border-opacity);border-bottom-color:rgba(var(--color-primary-500),var(--un-border-bottom-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
321
+
322
+ /* Reset rokkit gradients bleeding in */
323
+ [data-style='bits-ui'] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected] {
324
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
325
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
326
+
327
+ [data-style='bits-ui']
328
+ [data-tabs][data-orientation='vertical']
329
+ [data-tabs-list]:focus-within
330
+ [data-tabs-trigger][data-selected] {
331
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
332
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-orientation="vertical"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-orientation="vertical"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
333
+
334
+ [data-style='bits-ui']
335
+ [data-tabs][data-orientation='vertical'][data-position='after']
336
+ [data-tabs-list]:focus-within
337
+ [data-tabs-trigger][data-selected] {
338
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
339
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-orientation="vertical"][data-position="after"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-orientation="vertical"][data-position="after"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
340
+
341
+ /* Horizontal after (tabs below content): top border */
342
+ [data-style='bits-ui'] [data-tabs][data-position='after'] [data-tabs-trigger] {
343
+ border-bottom-width:0px;border-top-width:3px;border-top-color:transparent;
344
+ }
345
+
346
+ [data-style='bits-ui']
347
+ [data-tabs][data-position='after']
348
+ [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]) {
349
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
350
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-position="after"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-position="after"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
351
+
352
+ [data-style='bits-ui'] [data-tabs][data-position='after'] [data-tabs-trigger][data-selected] {
353
+ --un-border-opacity:1;--un-border-top-opacity:var(--un-border-opacity);border-top-color:rgba(var(--color-primary-500),var(--un-border-top-opacity));
354
+ font-weight: 600;
355
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-position="after"] [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-position="after"] [data-tabs-trigger][data-selected]{--un-border-opacity:1;--un-border-top-opacity:var(--un-border-opacity);border-top-color:rgba(var(--color-primary-500),var(--un-border-top-opacity));}
356
+
357
+ [data-style='bits-ui']
358
+ [data-tabs][data-position='after']
359
+ [data-tabs-list]:focus-within
360
+ [data-tabs-trigger][data-selected] {
361
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
362
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-position="after"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-position="after"] [data-tabs-list]:focus-within [data-tabs-trigger][data-selected]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
363
+
364
+ /* Vertical before (tabs on left): right border */
365
+ [data-style='bits-ui'] [data-tabs][data-orientation='vertical'] [data-tabs-trigger] {
366
+ border-bottom-width:0px;border-right-width:3px;border-right-color:transparent;border-radius:0.5rem;
367
+ }
368
+
369
+ [data-style='bits-ui']
370
+ [data-tabs][data-orientation='vertical']
371
+ [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]) {
372
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
373
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-orientation="vertical"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-orientation="vertical"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
374
+
375
+ [data-style='bits-ui'] [data-tabs][data-orientation='vertical'] [data-tabs-trigger][data-selected] {
376
+ --un-border-opacity:1;--un-border-right-opacity:var(--un-border-opacity);border-right-color:rgba(var(--color-primary-500),var(--un-border-right-opacity));
377
+ font-weight: 600;
378
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-orientation="vertical"] [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-orientation="vertical"] [data-tabs-trigger][data-selected]{--un-border-opacity:1;--un-border-right-opacity:var(--un-border-opacity);border-right-color:rgba(var(--color-primary-500),var(--un-border-right-opacity));}
379
+
380
+ /* Vertical after (tabs on right): left border */
381
+ [data-style='bits-ui']
382
+ [data-tabs][data-orientation='vertical'][data-position='after']
383
+ [data-tabs-trigger] {
384
+ border-top-width:0px;border-bottom-width:0px;border-right-width:0px;border-left-width:3px;border-left-color:transparent;border-radius:0.5rem;
385
+ }
386
+
387
+ [data-style='bits-ui']
388
+ [data-tabs][data-orientation='vertical'][data-position='after']
389
+ [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]) {
390
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
391
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-orientation="vertical"][data-position="after"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-orientation="vertical"][data-position="after"] [data-tabs-trigger]:hover:not(:disabled):not([data-disabled]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
392
+
393
+ [data-style='bits-ui']
394
+ [data-tabs][data-orientation='vertical'][data-position='after']
395
+ [data-tabs-trigger][data-selected] {
396
+ border-top-width:0px;border-bottom-width:0px;border-right-width:0px;--un-border-opacity:1;--un-border-left-opacity:var(--un-border-opacity);border-left-color:rgba(var(--color-primary-500),var(--un-border-left-opacity));
397
+ font-weight: 600;
398
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs][data-orientation="vertical"][data-position="after"] [data-tabs-trigger][data-selected],[data-mode="dark"] [data-style="bits-ui"] [data-tabs][data-orientation="vertical"][data-position="after"] [data-tabs-trigger][data-selected]{--un-border-opacity:1;--un-border-left-opacity:var(--un-border-opacity);border-left-color:rgba(var(--color-primary-500),var(--un-border-left-opacity));}
399
+
400
+ /* =============================================================================
401
+ Tab Icon
402
+ ============================================================================= */
403
+
404
+ [data-style='bits-ui'] [data-tabs-trigger] [data-tabs-icon] {
405
+ --un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
406
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-trigger] [data-tabs-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-trigger] [data-tabs-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
407
+
408
+ [data-style='bits-ui'] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon] {
409
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
410
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
411
+
412
+ [data-style='bits-ui'] [data-tabs-trigger][data-selected] [data-tabs-icon] {
413
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
414
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-trigger][data-selected] [data-tabs-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-trigger][data-selected] [data-tabs-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
415
+
416
+ /* =============================================================================
417
+ Tab Panel
418
+ ============================================================================= */
419
+
420
+ [data-style='bits-ui'] [data-tabs-content] {
421
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
422
+ }[data-mode="dark"][data-style="bits-ui"] [data-tabs-content],[data-mode="dark"] [data-style="bits-ui"] [data-tabs-content]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
423
+
424
+ /**
425
+ * Toggle - bits-ui Theme Styles
426
+ *
427
+ * Rounded pill container with softer styling.
428
+ */
429
+
430
+ /* =============================================================================
431
+ Toggle Container
432
+ ============================================================================= */
433
+
434
+ [data-style='bits-ui'] [data-toggle] {
435
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
436
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle],[data-mode="dark"] [data-style="bits-ui"] [data-toggle]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
437
+
438
+ /* =============================================================================
439
+ Toggle Options
440
+ ============================================================================= */
441
+
442
+ [data-style='bits-ui'] [data-toggle-option] {
443
+ border-width:0px;border-color:transparent;border-radius:0.5rem;border-style:solid;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
444
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle-option],[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
445
+
446
+ [data-style='bits-ui'] [data-toggle-option]:hover:not(:disabled):not([data-disabled='true']),
447
+ [data-style='bits-ui'] [data-toggle-option]:focus:not(:disabled):not([data-disabled='true']) {
448
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
449
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle-option]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"][data-style="bits-ui"] [data-toggle-option]:focus:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option]:focus:not(:disabled):not([data-disabled="true"]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
450
+
451
+ /* Selected state */
452
+ [data-style='bits-ui'] [data-toggle-option][data-selected='true'] {
453
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
454
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle-option][data-selected="true"],[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option][data-selected="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
455
+
456
+ /* =============================================================================
457
+ Toggle Icon
458
+ ============================================================================= */
459
+
460
+ [data-style='bits-ui'] [data-toggle-option] [data-toggle-icon] {
461
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
462
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle-option] [data-toggle-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option] [data-toggle-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
463
+
464
+ [data-style='bits-ui'] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],
465
+ [data-style='bits-ui'] [data-toggle-option]:focus:not(:disabled) [data-toggle-icon] {
466
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
467
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],[data-mode="dark"][data-style="bits-ui"] [data-toggle-option]:focus:not(:disabled) [data-toggle-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option]:focus:not(:disabled) [data-toggle-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
468
+
469
+ [data-style='bits-ui'] [data-toggle-option][data-selected='true'] [data-toggle-icon] {
470
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
471
+ }[data-mode="dark"][data-style="bits-ui"] [data-toggle-option][data-selected="true"] [data-toggle-icon],[data-mode="dark"] [data-style="bits-ui"] [data-toggle-option][data-selected="true"] [data-toggle-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
472
+
473
+ /**
474
+ * Switch - bits-ui Theme Styles
475
+ */
476
+
477
+ [data-style='bits-ui'] [data-switch-track] {
478
+ border-width:2px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));background-image:none;
479
+ }[data-mode="dark"][data-style="bits-ui"] [data-switch-track],[data-mode="dark"] [data-style="bits-ui"] [data-switch-track]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
480
+
481
+ [data-style='bits-ui'] [data-switch] [data-switch-thumb] {
482
+ --switch-thumb-travel: 1rem;
483
+ border-radius:0.25rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-500),var(--un-bg-opacity));
484
+ }[data-mode="dark"][data-style="bits-ui"] [data-switch] [data-switch-thumb],[data-mode="dark"] [data-style="bits-ui"] [data-switch] [data-switch-thumb]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-500),var(--un-bg-opacity));}
485
+
486
+ [data-style='bits-ui'] [data-switch]:focus-visible [data-switch-track] {
487
+ --un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-offset-width:1px;--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
488
+ }[data-mode="dark"][data-style="bits-ui"] [data-switch]:focus-visible [data-switch-track],[data-mode="dark"] [data-style="bits-ui"] [data-switch]:focus-visible [data-switch-track]{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
489
+
490
+ /* On state */
491
+ [data-style='bits-ui'] [data-switch][aria-checked='true'] [data-switch-track] {
492
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));background-image:none;
493
+ }[data-mode="dark"][data-style="bits-ui"] [data-switch][aria-checked="true"] [data-switch-track],[data-mode="dark"] [data-style="bits-ui"] [data-switch][aria-checked="true"] [data-switch-track]{--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));}
494
+
495
+ [data-style='bits-ui'] [data-switch][aria-checked='true'] [data-switch-thumb] {
496
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));
497
+ }[data-mode="dark"][data-style="bits-ui"] [data-switch][aria-checked="true"] [data-switch-thumb],[data-mode="dark"] [data-style="bits-ui"] [data-switch][aria-checked="true"] [data-switch-thumb]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));}
498
+
499
+ [data-style='bits-ui'] [data-switch-label] {
500
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
501
+ }[data-mode="dark"][data-style="bits-ui"] [data-switch-label],[data-mode="dark"] [data-style="bits-ui"] [data-switch-label]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
502
+
503
+ /**
504
+ * List - bits-ui Theme Styles
505
+ *
506
+ * Softer list styling with rounded item backgrounds on hover/active.
507
+ */
508
+
509
+ /* =============================================================================
510
+ List Container
511
+ ============================================================================= */
512
+
513
+ [data-style='bits-ui'] [data-list]:focus-within {
514
+ outline:2px solid transparent;outline-offset:2px;
515
+ }
516
+
517
+ /* =============================================================================
518
+ List Items
519
+ ============================================================================= */
520
+
521
+ [data-style='bits-ui'] [data-list] [data-list-item] {
522
+ border-width:0px;border-color:transparent;border-radius:0.5rem;border-style:solid;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
523
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
524
+
525
+ [data-style='bits-ui'] [data-list] a[data-list-item],
526
+ [data-style='bits-ui'] [data-list] button[data-list-item] {
527
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
528
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] a[data-list-item],[data-mode="dark"] [data-style="bits-ui"] [data-list] a[data-list-item],[data-mode="dark"][data-style="bits-ui"] [data-list] button[data-list-item],[data-mode="dark"] [data-style="bits-ui"] [data-list] button[data-list-item]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
529
+
530
+ /* Hover and focus (keyboard navigation) */
531
+ [data-style='bits-ui']
532
+ [data-list]
533
+ [data-list-item]:hover:not(:disabled):not([data-disabled='true']),
534
+ [data-style='bits-ui']
535
+ [data-list]
536
+ [data-list-item]:focus:not(:disabled):not([data-disabled='true']) {
537
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
538
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item]:hover:not(:disabled):not([data-disabled="true"]),[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item]:focus:not(:disabled):not([data-disabled="true"]),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item]:focus:not(:disabled):not([data-disabled="true"]){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
539
+
540
+ /* Active state — muted when list not focused */
541
+ [data-style='bits-ui'] [data-list] [data-list-item][data-active='true'] {
542
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
543
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-active="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
544
+
545
+ /* Active state — full highlight when list has focus */
546
+ [data-style='bits-ui'] [data-list]:focus-within [data-list-item][data-active='true'] {
547
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
548
+ }[data-mode="dark"][data-style="bits-ui"] [data-list]:focus-within [data-list-item][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-list]:focus-within [data-list-item][data-active="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
549
+
550
+ /* Active + hover/focus */
551
+ [data-style='bits-ui'] [data-list] [data-list-item][data-active='true']:hover:not(:disabled),
552
+ [data-style='bits-ui'] [data-list] [data-list-item][data-active='true']:focus:not(:disabled) {
553
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
554
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-active="true"]:hover:not(:disabled),[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-active="true"]:focus:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-active="true"]:focus:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-primary-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
555
+
556
+ /* =============================================================================
557
+ Item Elements
558
+ ============================================================================= */
559
+
560
+ [data-style='bits-ui'] [data-list] [data-list-item] [data-item-icon] {
561
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
562
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
563
+
564
+ [data-style='bits-ui'] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],
565
+ [data-style='bits-ui'] [data-list] [data-list-item]:focus:not(:disabled) [data-item-icon] {
566
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
567
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item]:focus:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item]:focus:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
568
+
569
+ [data-style='bits-ui'] [data-list] [data-list-item][data-active='true'] [data-item-icon] {
570
+ --un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));
571
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-active="true"] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-active="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));}
572
+
573
+ [data-style='bits-ui'] [data-list] [data-list-item] [data-item-description] {
574
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
575
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
576
+
577
+ [data-style='bits-ui'] [data-list] [data-list-item][data-active='true'] [data-item-description] {
578
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
579
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-active="true"] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-active="true"] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
580
+
581
+ [data-style='bits-ui'] [data-list] [data-list-item] [data-item-badge] {
582
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
583
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item] [data-item-badge],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item] [data-item-badge]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
584
+
585
+ [data-style='bits-ui'] [data-list] [data-list-item][data-active='true'] [data-item-badge] {
586
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-300),var(--un-border-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
587
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-active="true"] [data-item-badge],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-active="true"] [data-item-badge]{--un-border-opacity:1;border-color:rgba(var(--color-primary-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
588
+
589
+ /* =============================================================================
590
+ Groups
591
+ ============================================================================= */
592
+
593
+ [data-style='bits-ui'] [data-list] [data-list-group] {
594
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
595
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-group],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-group]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
596
+
597
+ [data-style='bits-ui'] [data-list] [data-list-group]:hover:not(:disabled),
598
+ [data-style='bits-ui'] [data-list] [data-list-group]:focus:not(:disabled) {
599
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
600
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-group]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-group]:hover:not(:disabled),[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-group]:focus:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-group]:focus:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
601
+
602
+ /* =============================================================================
603
+ Separator
604
+ ============================================================================= */
605
+
606
+ [data-style='bits-ui'] [data-list] [data-list-separator] {
607
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;
608
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-separator],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-separator]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
609
+
610
+ /* =============================================================================
611
+ Multi-Selection
612
+ ============================================================================= */
613
+
614
+ [data-style='bits-ui'] [data-list] [data-list-item][data-selected='true'] {
615
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
616
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-selected="true"],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-selected="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
617
+
618
+ [data-style='bits-ui'] [data-list]:focus-within [data-list-item][data-selected='true'] {
619
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
620
+ }[data-mode="dark"][data-style="bits-ui"] [data-list]:focus-within [data-list-item][data-selected="true"],[data-mode="dark"] [data-style="bits-ui"] [data-list]:focus-within [data-list-item][data-selected="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
621
+
622
+ [data-style='bits-ui'] [data-list] [data-list-item][data-selected='true']:hover:not(:disabled) {
623
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
624
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-selected="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-selected="true"]:hover:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-primary-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
625
+
626
+ [data-style='bits-ui'] [data-list] [data-list-item][data-selected='true'] [data-item-icon] {
627
+ --un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));
628
+ }[data-mode="dark"][data-style="bits-ui"] [data-list] [data-list-item][data-selected="true"] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-list] [data-list-item][data-selected="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));}
629
+
630
+ /**
631
+ * Tree - bits-ui Theme Styles
632
+ *
633
+ * Softer tree with rounded item backgrounds on hover/active.
634
+ */
635
+
636
+ /* =============================================================================
637
+ Tree Container
638
+ ============================================================================= */
639
+
640
+ [data-style='bits-ui'] [data-tree]:focus-within {
641
+ outline:2px solid transparent;outline-offset:2px;
642
+ }
643
+
644
+ /* =============================================================================
645
+ Tree Toggle Button
646
+ ============================================================================= */
647
+
648
+ [data-style='bits-ui'] [data-tree-toggle-btn] {
649
+ border-radius:0.25rem;--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
650
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-toggle-btn],[data-mode="dark"] [data-style="bits-ui"] [data-tree-toggle-btn]{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
651
+
652
+ [data-style='bits-ui'] [data-tree-toggle-btn]:hover {
653
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
654
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-toggle-btn]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-tree-toggle-btn]:hover{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
655
+
656
+ /* =============================================================================
657
+ Tree Item Content
658
+ ============================================================================= */
659
+
660
+ [data-style='bits-ui'] [data-tree-item-content] {
661
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
662
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
663
+
664
+ [data-style='bits-ui'] [data-tree-item-content]:hover:not(:disabled),
665
+ [data-style='bits-ui'] [data-tree-item-content]:focus:not(:disabled) {
666
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
667
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content]:hover:not(:disabled),[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content]:focus:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content]:focus:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
668
+
669
+ /* Focus visible for keyboard navigation */
670
+ [data-style='bits-ui'] [data-tree-item-content]:focus-visible {
671
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
672
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
673
+
674
+ /* Active/selected state */
675
+ [data-style='bits-ui'] [data-tree-item-content][data-active='true'] {
676
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
677
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content][data-active="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
678
+
679
+ [data-style='bits-ui'] [data-tree-item-content][data-active='true']:hover:not(:disabled) {
680
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
681
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content][data-active="true"]:hover:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-primary-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
682
+
683
+ /* Reset rokkit gradients bleeding in from body[data-style='rokkit'] ancestor */
684
+ [data-style='bits-ui'] [data-tree]:focus-within [data-tree-item-content][data-active='true'] {
685
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));
686
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree]:focus-within [data-tree-item-content][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-tree]:focus-within [data-tree-item-content][data-active="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));}
687
+
688
+ [data-style='bits-ui'] [data-tree]:focus-within [data-tree-item-content][data-active='true']:hover:not(:disabled) {
689
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-300),var(--un-bg-opacity));
690
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree]:focus-within [data-tree-item-content][data-active="true"]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-tree]:focus-within [data-tree-item-content][data-active="true"]:hover:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-primary-700),var(--un-bg-opacity));}
691
+
692
+ [data-style='bits-ui'] [data-tree]:not(:focus-within) [data-tree-item-content][data-active='true'] {
693
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
694
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree]:not(:focus-within) [data-tree-item-content][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-tree]:not(:focus-within) [data-tree-item-content][data-active="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
695
+
696
+ /* =============================================================================
697
+ Item Elements
698
+ ============================================================================= */
699
+
700
+ [data-style='bits-ui'] [data-tree-item-content] [data-item-icon] {
701
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
702
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
703
+
704
+ [data-style='bits-ui'] [data-tree-item-content]:hover:not(:disabled) [data-item-icon] {
705
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
706
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content]:hover:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
707
+
708
+ [data-style='bits-ui'] [data-tree-item-content][data-active='true'] [data-item-icon] {
709
+ --un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));
710
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content][data-active="true"] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content][data-active="true"] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));}
711
+
712
+ [data-style='bits-ui'] [data-tree-item-content] [data-item-description] {
713
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
714
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
715
+
716
+ [data-style='bits-ui'] [data-tree-item-content][data-active='true'] [data-item-description] {
717
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
718
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content][data-active="true"] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content][data-active="true"] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
719
+
720
+ [data-style='bits-ui'] [data-tree-item-content] [data-item-badge] {
721
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
722
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content] [data-item-badge],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content] [data-item-badge]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
723
+
724
+ [data-style='bits-ui'] [data-tree-item-content][data-active='true'] [data-item-badge] {
725
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-300),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
726
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-item-content][data-active="true"] [data-item-badge],[data-mode="dark"] [data-style="bits-ui"] [data-tree-item-content][data-active="true"] [data-item-badge]{--un-border-opacity:1;border-color:rgba(var(--color-primary-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
727
+
728
+ [data-style='bits-ui'] [data-tree]:focus-within [data-tree-item-content][data-active='true'] [data-item-badge] {
729
+ background-image:none;
730
+ }
731
+
732
+ [data-style='bits-ui'] [data-tree]:not(:focus-within) [data-tree-item-content][data-active='true'] [data-item-badge] {
733
+ background-image:none;
734
+ }
735
+
736
+ /* =============================================================================
737
+ Multi-Selection
738
+ ============================================================================= */
739
+
740
+ [data-style='bits-ui'] [data-tree-node][data-selected='true'] [data-tree-item-content] {
741
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
742
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-node][data-selected="true"] [data-tree-item-content],[data-mode="dark"] [data-style="bits-ui"] [data-tree-node][data-selected="true"] [data-tree-item-content]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
743
+
744
+ [data-style='bits-ui']
745
+ [data-tree]:focus-within
746
+ [data-tree-node][data-selected='true']
747
+ [data-tree-item-content] {
748
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
749
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree]:focus-within [data-tree-node][data-selected="true"] [data-tree-item-content],[data-mode="dark"] [data-style="bits-ui"] [data-tree]:focus-within [data-tree-node][data-selected="true"] [data-tree-item-content]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
750
+
751
+ [data-style='bits-ui']
752
+ [data-tree-node][data-selected='true']
753
+ [data-tree-item-content]
754
+ [data-item-icon] {
755
+ --un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));
756
+ }[data-mode="dark"][data-style="bits-ui"] [data-tree-node][data-selected="true"] [data-tree-item-content] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-tree-node][data-selected="true"] [data-tree-item-content] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-500),var(--un-text-opacity));}
757
+
758
+ /**
759
+ * Connector - bits-ui Theme Styles
760
+ *
761
+ * Visual theming for tree line connectors.
762
+ */
763
+
764
+ [data-style='bits-ui'] [data-connector] [data-connector-v],
765
+ [data-style='bits-ui'] [data-connector] [data-connector-h],
766
+ [data-style='bits-ui'] [data-connector] [data-connector-corner] {
767
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
768
+ }[data-mode="dark"][data-style="bits-ui"] [data-connector] [data-connector-v],[data-mode="dark"] [data-style="bits-ui"] [data-connector] [data-connector-v],[data-mode="dark"][data-style="bits-ui"] [data-connector] [data-connector-h],[data-mode="dark"] [data-style="bits-ui"] [data-connector] [data-connector-h],[data-mode="dark"][data-style="bits-ui"] [data-connector] [data-connector-corner],[data-mode="dark"] [data-style="bits-ui"] [data-connector] [data-connector-corner]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
769
+
770
+ /**
771
+ * Select - bits-ui Theme Styles
772
+ *
773
+ * Rounded trigger with shadow, dropdown with rounded-xl panel.
774
+ */
775
+
776
+ /* =============================================================================
777
+ Trigger Button
778
+ ============================================================================= */
779
+
780
+ [data-style='bits-ui'] [data-select-trigger] {
781
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
782
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-select-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
783
+
784
+ [data-style='bits-ui'] [data-select-trigger]:hover:not(:disabled) {
785
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
786
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-select-trigger]:hover:not(:disabled){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
787
+
788
+ [data-style='bits-ui'] [data-select-trigger]:focus-visible {
789
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
790
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-trigger]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-select-trigger]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
791
+
792
+ [data-style='bits-ui'] [data-select][data-open='true'] [data-select-trigger] {
793
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));background-image:none;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
794
+ }[data-mode="dark"][data-style="bits-ui"] [data-select][data-open="true"] [data-select-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-select][data-open="true"] [data-select-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
795
+
796
+ /* =============================================================================
797
+ Placeholder
798
+ ============================================================================= */
799
+
800
+ [data-style='bits-ui'] [data-select-placeholder] {
801
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
802
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-placeholder],[data-mode="dark"] [data-style="bits-ui"] [data-select-placeholder]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
803
+
804
+ /* =============================================================================
805
+ Arrow
806
+ ============================================================================= */
807
+
808
+ [data-style='bits-ui'] [data-select-arrow] {
809
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
810
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-arrow],[data-mode="dark"] [data-style="bits-ui"] [data-select-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
811
+
812
+ [data-style='bits-ui'] [data-select-trigger]:hover:not(:disabled) [data-select-arrow] {
813
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
814
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-trigger]:hover:not(:disabled) [data-select-arrow],[data-mode="dark"] [data-style="bits-ui"] [data-select-trigger]:hover:not(:disabled) [data-select-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
815
+
816
+ /* =============================================================================
817
+ Tags (MultiSelect)
818
+ ============================================================================= */
819
+
820
+ [data-style='bits-ui'] [data-select-tag] {
821
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
822
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-tag],[data-mode="dark"] [data-style="bits-ui"] [data-select-tag]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
823
+
824
+ [data-style='bits-ui'] [data-select-tag-remove] {
825
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
826
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-tag-remove],[data-mode="dark"] [data-style="bits-ui"] [data-select-tag-remove]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
827
+
828
+ [data-style='bits-ui'] [data-select-tag-remove]:hover {
829
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
830
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-tag-remove]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-select-tag-remove]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
831
+
832
+ /* =============================================================================
833
+ Dropdown Panel
834
+ ============================================================================= */
835
+
836
+ [data-style='bits-ui'] [data-select-dropdown] {
837
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.75rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
838
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-dropdown],[data-mode="dark"] [data-style="bits-ui"] [data-select-dropdown]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
839
+
840
+ /* =============================================================================
841
+ Options
842
+ ============================================================================= */
843
+
844
+ [data-style='bits-ui'] [data-select-option] {
845
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
846
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-option],[data-mode="dark"] [data-style="bits-ui"] [data-select-option]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
847
+
848
+ /* Hover and focus */
849
+ [data-style='bits-ui'] [data-select-option]:hover:not(:disabled),
850
+ [data-style='bits-ui'] [data-select-option]:focus:not(:disabled) {
851
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
852
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-option]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-select-option]:hover:not(:disabled),[data-mode="dark"][data-style="bits-ui"] [data-select-option]:focus:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-select-option]:focus:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
853
+
854
+ /* Selected state */
855
+ [data-style='bits-ui'] [data-select-option][data-selected='true'] {
856
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
857
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-option][data-selected="true"],[data-mode="dark"] [data-style="bits-ui"] [data-select-option][data-selected="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
858
+
859
+ /* Selected state — full highlight when dropdown has focus */
860
+ [data-style='bits-ui']
861
+ [data-select-dropdown]:focus-within
862
+ [data-select-option][data-selected='true'] {
863
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
864
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-dropdown]:focus-within [data-select-option][data-selected="true"],[data-mode="dark"] [data-style="bits-ui"] [data-select-dropdown]:focus-within [data-select-option][data-selected="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
865
+
866
+ /* Check mark */
867
+ [data-style='bits-ui'] [data-select-check] {
868
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
869
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-check],[data-mode="dark"] [data-style="bits-ui"] [data-select-check]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
870
+
871
+ /* Checkbox */
872
+ [data-style='bits-ui'] [data-select-checkbox] {
873
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));border-radius:0.25rem;background-color:transparent;background-image:none;
874
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-checkbox],[data-mode="dark"] [data-style="bits-ui"] [data-select-checkbox]{--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));}
875
+
876
+ [data-style='bits-ui'] [data-select-checkbox][data-checked='true'] {
877
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-500),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));
878
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-checkbox][data-checked="true"],[data-mode="dark"] [data-style="bits-ui"] [data-select-checkbox][data-checked="true"]{--un-border-opacity:1;border-color:rgba(var(--color-primary-500),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));}
879
+
880
+ /* Item elements */
881
+ [data-style='bits-ui'] [data-select-option] [data-item-description] {
882
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
883
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-option] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-select-option] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
884
+
885
+ [data-style='bits-ui'] [data-select-option][data-selected='true'] [data-item-description] {
886
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
887
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-option][data-selected="true"] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-select-option][data-selected="true"] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
888
+
889
+ /* =============================================================================
890
+ Groups
891
+ ============================================================================= */
892
+
893
+ [data-style='bits-ui'] [data-select-group-label] {
894
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
895
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-group-label],[data-mode="dark"] [data-style="bits-ui"] [data-select-group-label]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
896
+
897
+ /* =============================================================================
898
+ Divider
899
+ ============================================================================= */
900
+
901
+ [data-style='bits-ui'] [data-select-divider] {
902
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;
903
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-divider],[data-mode="dark"] [data-style="bits-ui"] [data-select-divider]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
904
+
905
+ /* =============================================================================
906
+ Filter Input
907
+ ============================================================================= */
908
+
909
+ [data-style='bits-ui'] [data-select-filter] {
910
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));
911
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-filter],[data-mode="dark"] [data-style="bits-ui"] [data-select-filter]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
912
+
913
+ [data-style='bits-ui'] [data-select-filter-input] {
914
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;background-color:transparent;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
915
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-filter-input],[data-mode="dark"] [data-style="bits-ui"] [data-select-filter-input]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
916
+
917
+ [data-style='bits-ui'] [data-select-filter-input]:focus {
918
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
919
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-filter-input]:focus,[data-mode="dark"] [data-style="bits-ui"] [data-select-filter-input]:focus{--un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
920
+
921
+ [data-style='bits-ui'] [data-select-filter-input]::placeholder {
922
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
923
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-filter-input]::placeholder,[data-mode="dark"] [data-style="bits-ui"] [data-select-filter-input]::placeholder{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
924
+
925
+ [data-style='bits-ui'] [data-select-empty] {
926
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
927
+ }[data-mode="dark"][data-style="bits-ui"] [data-select-empty],[data-mode="dark"] [data-style="bits-ui"] [data-select-empty]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
928
+
929
+ /**
930
+ * Menu - bits-ui Theme Styles
931
+ *
932
+ * Rounded trigger, dropdown with rounded-xl and larger shadow.
933
+ */
934
+
935
+ /* =============================================================================
936
+ Menu Trigger
937
+ ============================================================================= */
938
+
939
+ [data-style='bits-ui'] [data-menu-trigger] {
940
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
941
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-menu-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
942
+
943
+ [data-style='bits-ui'] [data-menu-trigger]:hover:not(:disabled) {
944
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
945
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-menu-trigger]:hover:not(:disabled){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
946
+
947
+ [data-style='bits-ui'] [data-menu-trigger]:focus-visible {
948
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
949
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-trigger]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-menu-trigger]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
950
+
951
+ [data-style='bits-ui'] [data-menu][data-open='true'] [data-menu-trigger] {
952
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));background-image:none;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
953
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu][data-open="true"] [data-menu-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-menu][data-open="true"] [data-menu-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
954
+
955
+ /* Trigger elements */
956
+ [data-style='bits-ui'] [data-menu-trigger] [data-menu-icon] {
957
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
958
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-trigger] [data-menu-icon],[data-mode="dark"] [data-style="bits-ui"] [data-menu-trigger] [data-menu-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
959
+
960
+ [data-style='bits-ui'] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon] {
961
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
962
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon],[data-mode="dark"] [data-style="bits-ui"] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
963
+
964
+ [data-style='bits-ui'] [data-menu-trigger] [data-menu-arrow] {
965
+ --un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
966
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-trigger] [data-menu-arrow],[data-mode="dark"] [data-style="bits-ui"] [data-menu-trigger] [data-menu-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
967
+
968
+ /* =============================================================================
969
+ Menu Dropdown
970
+ ============================================================================= */
971
+
972
+ [data-style='bits-ui'] [data-menu-dropdown] {
973
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.75rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
974
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-dropdown],[data-mode="dark"] [data-style="bits-ui"] [data-menu-dropdown]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
975
+
976
+ /* =============================================================================
977
+ Menu Items
978
+ ============================================================================= */
979
+
980
+ [data-style='bits-ui'] [data-menu-item] {
981
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
982
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-item],[data-mode="dark"] [data-style="bits-ui"] [data-menu-item]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
983
+
984
+ [data-style='bits-ui'] [data-menu-item]:hover:not(:disabled),
985
+ [data-style='bits-ui'] [data-menu-item]:focus:not(:disabled) {
986
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
987
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-item]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-menu-item]:hover:not(:disabled),[data-mode="dark"][data-style="bits-ui"] [data-menu-item]:focus:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-menu-item]:focus:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
988
+
989
+ /* Item elements */
990
+ [data-style='bits-ui'] [data-menu-item] [data-item-icon] {
991
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
992
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-item] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-menu-item] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
993
+
994
+ [data-style='bits-ui'] [data-menu-item]:hover:not(:disabled) [data-item-icon] {
995
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
996
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-menu-item]:hover:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
997
+
998
+ [data-style='bits-ui'] [data-menu-item] [data-item-description] {
999
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1000
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-item] [data-item-description],[data-mode="dark"] [data-style="bits-ui"] [data-menu-item] [data-item-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1001
+
1002
+ /* =============================================================================
1003
+ Groups
1004
+ ============================================================================= */
1005
+
1006
+ [data-style='bits-ui'] [data-menu-group] {
1007
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1008
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-group],[data-mode="dark"] [data-style="bits-ui"] [data-menu-group]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1009
+
1010
+ /* =============================================================================
1011
+ Divider
1012
+ ============================================================================= */
1013
+
1014
+ [data-style='bits-ui'] [data-menu-separator] {
1015
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;
1016
+ }[data-mode="dark"][data-style="bits-ui"] [data-menu-separator],[data-mode="dark"] [data-style="bits-ui"] [data-menu-separator]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1017
+
1018
+ /**
1019
+ * Dropdown - bits-ui Theme Styles
1020
+ *
1021
+ * Rounded trigger with shadow, panel with rounded-xl and elevated shadow.
1022
+ */
1023
+
1024
+ [data-style='bits-ui'] [data-dropdown-trigger] {
1025
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1026
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1027
+
1028
+ [data-style='bits-ui'] [data-dropdown-trigger]:hover:not(:disabled) {
1029
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1030
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-trigger]:hover:not(:disabled){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1031
+
1032
+ [data-style='bits-ui'] [data-dropdown-trigger]:focus-visible {
1033
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1034
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-trigger]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-trigger]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1035
+
1036
+ [data-style='bits-ui'] [data-dropdown][data-open='true'] [data-dropdown-trigger] {
1037
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));background-image:none;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1038
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown][data-open="true"] [data-dropdown-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown][data-open="true"] [data-dropdown-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-500),var(--un-border-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1039
+
1040
+ [data-style='bits-ui'] [data-dropdown-trigger] [data-dropdown-icon] {
1041
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1042
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-trigger] [data-dropdown-icon],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-trigger] [data-dropdown-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1043
+
1044
+ [data-style='bits-ui'] [data-dropdown-trigger] [data-dropdown-arrow] {
1045
+ --un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
1046
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-trigger] [data-dropdown-arrow],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-trigger] [data-dropdown-arrow]{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
1047
+
1048
+ [data-style='bits-ui'] [data-dropdown-panel] {
1049
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.75rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 10px 15px -3px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 4px 6px -4px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1050
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-panel],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-panel]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
1051
+
1052
+ [data-style='bits-ui'] [data-dropdown-option] {
1053
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1054
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-option],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-option]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1055
+
1056
+ [data-style='bits-ui'] [data-dropdown-option]:hover:not(:disabled),
1057
+ [data-style='bits-ui'] [data-dropdown-option]:focus:not(:disabled) {
1058
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
1059
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-option]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-option]:hover:not(:disabled),[data-mode="dark"][data-style="bits-ui"] [data-dropdown-option]:focus:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-option]:focus:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1060
+
1061
+ [data-style='bits-ui'] [data-dropdown-option][data-active='true'] {
1062
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
1063
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-option][data-active="true"],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-option][data-active="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
1064
+
1065
+ [data-style='bits-ui'] [data-dropdown-separator] {
1066
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;
1067
+ }[data-mode="dark"][data-style="bits-ui"] [data-dropdown-separator],[data-mode="dark"] [data-style="bits-ui"] [data-dropdown-separator]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1068
+
1069
+ /**
1070
+ * FloatingAction - bits-ui Theme Styles
1071
+ *
1072
+ * Rounded buttons with shadow elevation.
1073
+ */
1074
+
1075
+ /* =============================================================================
1076
+ FAB Trigger Button
1077
+ ============================================================================= */
1078
+
1079
+ [data-style='bits-ui'] [data-fab-trigger] {
1080
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1081
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-fab-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1082
+
1083
+ [data-style='bits-ui'] [data-fab-trigger]:hover:not(:disabled) {
1084
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-950),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1085
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-trigger]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-fab-trigger]:hover:not(:disabled){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));}
1086
+
1087
+ [data-style='bits-ui'] [data-fab-trigger]:focus-visible {
1088
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1089
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-trigger]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-fab-trigger]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1090
+
1091
+ [data-style='bits-ui'] [data-fab][data-open='true'] [data-fab-trigger] {
1092
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1093
+ transform: rotate(45deg);
1094
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab][data-open="true"] [data-fab-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-fab][data-open="true"] [data-fab-trigger]{--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1095
+
1096
+ [data-style='bits-ui'] [data-fab][data-open='true'] [data-fab-trigger]:hover:not(:disabled) {
1097
+ background-image:none;
1098
+ }
1099
+
1100
+ /* =============================================================================
1101
+ FAB Items
1102
+ ============================================================================= */
1103
+
1104
+ [data-style='bits-ui'] [data-fab-item] {
1105
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1106
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-item],[data-mode="dark"] [data-style="bits-ui"] [data-fab-item]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1107
+
1108
+ [data-style='bits-ui'] [data-fab-item]:hover:not(:disabled) {
1109
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1110
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-item]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-fab-item]:hover:not(:disabled){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1111
+
1112
+ [data-style='bits-ui'] [data-fab-item]:focus-visible {
1113
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1114
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-item]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-fab-item]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1115
+
1116
+ /* Item icon */
1117
+ [data-style='bits-ui'] [data-fab-item] [data-fab-item-icon] {
1118
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1119
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-item] [data-fab-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-fab-item] [data-fab-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1120
+
1121
+ [data-style='bits-ui'] [data-fab-item]:hover:not(:disabled) [data-fab-item-icon] {
1122
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1123
+ }[data-mode="dark"][data-style="bits-ui"] [data-fab-item]:hover:not(:disabled) [data-fab-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-fab-item]:hover:not(:disabled) [data-fab-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1124
+
1125
+ /* =============================================================================
1126
+ Backdrop
1127
+ ============================================================================= */
1128
+
1129
+ [data-style='bits-ui'] [data-fab-backdrop] {
1130
+ background: rgba(0, 0, 0, 0.2);
1131
+ }
1132
+
1133
+ /**
1134
+ * bits-ui Theme - Form field and input styles
1135
+ *
1136
+ * Rounded bordered inputs with shadow-inner on focus. Premium feel.
1137
+ */
1138
+
1139
+ /* Input root: rounded border, subtle background */
1140
+ [data-style='bits-ui'] [data-input-root] {
1141
+ position:relative;display:flex;align-items:center;border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1142
+ background-image: none;
1143
+ transition:
1144
+ background-color 150ms ease,
1145
+ border-color 150ms ease,
1146
+ box-shadow 150ms ease;
1147
+ }[data-mode="dark"][data-style="bits-ui"] [data-input-root],[data-mode="dark"] [data-style="bits-ui"] [data-input-root]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
1148
+
1149
+ /* Hover: slightly elevated border */
1150
+ [data-style='bits-ui'] [data-input-root]:hover:not(:focus-within) {
1151
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));
1152
+ background-image: none;
1153
+ }[data-mode="dark"][data-style="bits-ui"] [data-input-root]:hover:not(:focus-within),[data-mode="dark"] [data-style="bits-ui"] [data-input-root]:hover:not(:focus-within){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));}
1154
+
1155
+ /* Focus: primary ring */
1156
+ [data-style='bits-ui'] [data-input-root]:focus-within {
1157
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));
1158
+ background-image: none;
1159
+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), 0 0 0 2px var(--color-primary-z3, rgba(0,0,0,0.08));
1160
+ }[data-mode="dark"][data-style="bits-ui"] [data-input-root]:focus-within,[data-mode="dark"] [data-style="bits-ui"] [data-input-root]:focus-within{--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
1161
+
1162
+ /* Inputs inside wrapper */
1163
+ [data-style='bits-ui']
1164
+ [data-input-root]
1165
+ input:not([type='checkbox'], [type='radio'], [type='color']),
1166
+ [data-style='bits-ui'] [data-input-root] textarea,
1167
+ [data-style='bits-ui'] [data-input-root] select {
1168
+ width:100%;border-style:none;background-color:transparent;padding-left:0.75rem;padding-right:0.75rem;padding-top:0.5rem;padding-bottom:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
1169
+ font-size: 0.875rem;
1170
+ line-height: 1.25rem;
1171
+ transition: color 150ms ease;
1172
+ }[data-mode="dark"][data-style="bits-ui"] [data-input-root] input:not([type="checkbox"],[type="radio"],[type="color"]),[data-mode="dark"] [data-style="bits-ui"] [data-input-root] input:not([type="checkbox"],[type="radio"],[type="color"]),[data-mode="dark"][data-style="bits-ui"] [data-input-root] textarea,[data-mode="dark"] [data-style="bits-ui"] [data-input-root] textarea,[data-mode="dark"][data-style="bits-ui"] [data-input-root] select,[data-mode="dark"] [data-style="bits-ui"] [data-input-root] select{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1173
+
1174
+ [data-style='bits-ui'] [data-input-root] textarea {
1175
+ min-height:5rem;padding-top:0.5rem;padding-bottom:0.5rem;
1176
+ }
1177
+
1178
+ /* Select inside input-root: match text input appearance */
1179
+ [data-style='bits-ui'] [data-input-root] [data-select-trigger] {
1180
+ border-radius:0.5rem;border-style:none;background-color:transparent;padding-left:0.75rem;padding-right:0.75rem;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:0 0 var(--un-shadow-color, rgb(0 0 0 / 0));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-width:0px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1181
+ font-size: 0.875rem;
1182
+ background-image: none;
1183
+ transition: color 150ms ease;
1184
+ }[data-mode="dark"][data-style="bits-ui"] [data-input-root] [data-select-trigger],[data-mode="dark"] [data-style="bits-ui"] [data-input-root] [data-select-trigger]{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}[data-style="bits-ui"] [data-input-root] [data-select-trigger]:focus{outline:2px solid transparent;outline-offset:2px;}
1185
+
1186
+ [data-style='bits-ui'] [data-input-root] [data-select-trigger]:hover:not(:disabled) {
1187
+ background-color:transparent;
1188
+ background-image: none;
1189
+ }
1190
+
1191
+ [data-style='bits-ui'] [data-input-root] [data-select][data-open='true'] [data-select-trigger] {
1192
+ border-style:none;background-color:transparent;--un-shadow:0 0 var(--un-shadow-color, rgb(0 0 0 / 0));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-width:0px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1193
+ }
1194
+
1195
+ /* Labels: slightly muted */
1196
+ [data-style='bits-ui'] [data-field] > label {
1197
+ font-size:0.875rem;line-height:1.25rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));font-weight:500;
1198
+ transition: color 150ms ease;
1199
+ }[data-mode="dark"][data-style="bits-ui"] [data-field]>label,[data-mode="dark"] [data-style="bits-ui"] [data-field]>label{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1200
+
1201
+ [data-style='bits-ui'] [data-form-root] label {
1202
+ font-size:0.875rem;line-height:1.25rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));font-weight:500;
1203
+ }[data-mode="dark"][data-style="bits-ui"] [data-form-root] label,[data-mode="dark"] [data-style="bits-ui"] [data-form-root] label{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1204
+
1205
+ /* Focused label: primary color */
1206
+ [data-style='bits-ui'] [data-field]:has([data-input-root]:focus-within) > label {
1207
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1208
+ }[data-mode="dark"][data-style="bits-ui"] [data-field]:has([data-input-root]:focus-within)>label,[data-mode="dark"] [data-style="bits-ui"] [data-field]:has([data-input-root]:focus-within)>label{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1209
+
1210
+ /* Field root */
1211
+ [data-style='bits-ui'] [data-field-root] {
1212
+ gap:0.25rem;
1213
+ }
1214
+
1215
+ /* Info field value */
1216
+ [data-style='bits-ui'] [data-field-info] {
1217
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1218
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-info],[data-mode="dark"] [data-style="bits-ui"] [data-field-info]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1219
+
1220
+ /* Separator */
1221
+ [data-style='bits-ui'] [data-form-separator] {
1222
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
1223
+ }[data-mode="dark"][data-style="bits-ui"] [data-form-separator],[data-mode="dark"] [data-style="bits-ui"] [data-form-separator]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
1224
+
1225
+ /* Disabled state */
1226
+ [data-style='bits-ui'] [data-field-disabled] [data-input-root] {
1227
+ cursor:not-allowed;--un-border-opacity:1;border-color:rgba(var(--color-surface-200),var(--un-border-opacity));opacity:0.4;
1228
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-disabled] [data-input-root],[data-mode="dark"] [data-style="bits-ui"] [data-field-disabled] [data-input-root]{--un-border-opacity:1;border-color:rgba(var(--color-surface-800),var(--un-border-opacity));}
1229
+
1230
+ /* Error state */
1231
+ [data-style='bits-ui'] [data-field-state='fail'] [data-input-root] {
1232
+ --un-border-opacity:1;border-color:rgba(var(--color-danger-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-danger-100),var(--un-bg-opacity));
1233
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-state="fail"] [data-input-root],[data-mode="dark"] [data-style="bits-ui"] [data-field-state="fail"] [data-input-root]{--un-border-opacity:1;border-color:rgba(var(--color-danger-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-danger-900),var(--un-bg-opacity));}
1234
+
1235
+ [data-style='bits-ui'] [data-field-state='fail'] [data-input-root]:hover:not(:focus-within) {
1236
+ --un-bg-opacity:1;background-color:rgba(var(--color-danger-200),var(--un-bg-opacity));
1237
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-state="fail"] [data-input-root]:hover:not(:focus-within),[data-mode="dark"] [data-style="bits-ui"] [data-field-state="fail"] [data-input-root]:hover:not(:focus-within){--un-bg-opacity:1;background-color:rgba(var(--color-danger-800),var(--un-bg-opacity));}
1238
+
1239
+ [data-style='bits-ui'] [data-field-state='fail'] [data-input-root]:focus-within {
1240
+ box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), 0 0 0 2px var(--color-danger-z3, rgba(0,0,0,0.08));
1241
+ }
1242
+
1243
+ /* Pass state */
1244
+ [data-style='bits-ui'] [data-field-state='pass'] [data-input-root] {
1245
+ --un-border-opacity:1;border-color:rgba(var(--color-success-300),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-success-100),var(--un-bg-opacity));
1246
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-state="pass"] [data-input-root],[data-mode="dark"] [data-style="bits-ui"] [data-field-state="pass"] [data-input-root]{--un-border-opacity:1;border-color:rgba(var(--color-success-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-success-900),var(--un-bg-opacity));}
1247
+
1248
+ [data-style='bits-ui'] [data-field-state='pass'] [data-input-root]:hover:not(:focus-within) {
1249
+ --un-bg-opacity:1;background-color:rgba(var(--color-success-200),var(--un-bg-opacity));
1250
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-state="pass"] [data-input-root]:hover:not(:focus-within),[data-mode="dark"] [data-style="bits-ui"] [data-field-state="pass"] [data-input-root]:hover:not(:focus-within){--un-bg-opacity:1;background-color:rgba(var(--color-success-800),var(--un-bg-opacity));}
1251
+
1252
+ /* Description */
1253
+ [data-style='bits-ui'] [data-description] {
1254
+ margin-top:0.125rem;font-size:0.75rem;line-height:1rem;--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1255
+ }[data-mode="dark"][data-style="bits-ui"] [data-description],[data-mode="dark"] [data-style="bits-ui"] [data-description]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1256
+
1257
+ /* Message */
1258
+ [data-style='bits-ui'] [data-message] {
1259
+ margin-top:0.125rem;font-size:0.75rem;line-height:1rem;--un-text-opacity:1;color:rgba(var(--color-danger-500),var(--un-text-opacity));
1260
+ }[data-mode="dark"][data-style="bits-ui"] [data-message],[data-mode="dark"] [data-style="bits-ui"] [data-message]{--un-text-opacity:1;color:rgba(var(--color-danger-500),var(--un-text-opacity));}
1261
+
1262
+ /* Checkbox */
1263
+ [data-style='bits-ui'] [data-checkbox-icon] {
1264
+ font-size:1.125rem;line-height:1.75rem;--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1265
+ }[data-mode="dark"][data-style="bits-ui"] [data-checkbox-icon],[data-mode="dark"] [data-style="bits-ui"] [data-checkbox-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1266
+
1267
+ [data-style='bits-ui']
1268
+ [data-checkbox-root][data-variant='custom']:has(input:checked)
1269
+ [data-checkbox-icon] {
1270
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1271
+ }[data-mode="dark"][data-style="bits-ui"] [data-checkbox-root][data-variant="custom"]:has(input:checked) [data-checkbox-icon],[data-mode="dark"] [data-style="bits-ui"] [data-checkbox-root][data-variant="custom"]:has(input:checked) [data-checkbox-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1272
+
1273
+ /* Checkbox label: primary on focus */
1274
+ [data-style='bits-ui'] [data-field-type='checkbox'] [data-field]:has(:focus-within) > label {
1275
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1276
+ }[data-mode="dark"][data-style="bits-ui"] [data-field-type="checkbox"] [data-field]:has(:focus-within)>label,[data-mode="dark"] [data-style="bits-ui"] [data-field-type="checkbox"] [data-field]:has(:focus-within)>label{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1277
+
1278
+ /* Placeholders */
1279
+ [data-style='bits-ui'] [data-input-root] input::placeholder,
1280
+ [data-style='bits-ui'] [data-input-root] textarea::placeholder {
1281
+ --un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
1282
+ }[data-mode="dark"][data-style="bits-ui"] [data-input-root] input::placeholder,[data-mode="dark"] [data-style="bits-ui"] [data-input-root] input::placeholder,[data-mode="dark"][data-style="bits-ui"] [data-input-root] textarea::placeholder,[data-mode="dark"] [data-style="bits-ui"] [data-input-root] textarea::placeholder{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
1283
+
1284
+ /**
1285
+ * Table - bits-ui Theme Styles
1286
+ *
1287
+ * Clean table with subtle borders and rounded selection highlight.
1288
+ */
1289
+
1290
+ /* =============================================================================
1291
+ Header
1292
+ ============================================================================= */
1293
+
1294
+ [data-style='bits-ui'] [data-table-header] th {
1295
+ border-bottom-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1296
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-header] th,[data-mode="dark"] [data-style="bits-ui"] [data-table-header] th{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1297
+
1298
+ [data-style='bits-ui'] [data-table-header-cell][data-sortable='true']:hover {
1299
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1300
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-header-cell][data-sortable="true"]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-table-header-cell][data-sortable="true"]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1301
+
1302
+ [data-style='bits-ui'] [data-table-header-cell][data-sort-order='ascending'],
1303
+ [data-style='bits-ui'] [data-table-header-cell][data-sort-order='descending'] {
1304
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1305
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-header-cell][data-sort-order="ascending"],[data-mode="dark"] [data-style="bits-ui"] [data-table-header-cell][data-sort-order="ascending"],[data-mode="dark"][data-style="bits-ui"] [data-table-header-cell][data-sort-order="descending"],[data-mode="dark"] [data-style="bits-ui"] [data-table-header-cell][data-sort-order="descending"]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1306
+
1307
+ [data-style='bits-ui'] [data-table-sort-icon] {
1308
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1309
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-sort-icon],[data-mode="dark"] [data-style="bits-ui"] [data-table-sort-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1310
+
1311
+ [data-style='bits-ui'] [data-table-header-cell][data-sort-order='ascending'] [data-table-sort-icon],
1312
+ [data-style='bits-ui']
1313
+ [data-table-header-cell][data-sort-order='descending']
1314
+ [data-table-sort-icon] {
1315
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1316
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-header-cell][data-sort-order="ascending"] [data-table-sort-icon],[data-mode="dark"] [data-style="bits-ui"] [data-table-header-cell][data-sort-order="ascending"] [data-table-sort-icon],[data-mode="dark"][data-style="bits-ui"] [data-table-header-cell][data-sort-order="descending"] [data-table-sort-icon],[data-mode="dark"] [data-style="bits-ui"] [data-table-header-cell][data-sort-order="descending"] [data-table-sort-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1317
+
1318
+ /* =============================================================================
1319
+ Caption
1320
+ ============================================================================= */
1321
+
1322
+ [data-style='bits-ui'] [data-table-caption] {
1323
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1324
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-caption],[data-mode="dark"] [data-style="bits-ui"] [data-table-caption]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1325
+
1326
+ /* =============================================================================
1327
+ Rows
1328
+ ============================================================================= */
1329
+
1330
+ [data-style='bits-ui'] [data-table-row] {
1331
+ border-bottom-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-200),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1332
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-row],[data-mode="dark"] [data-style="bits-ui"] [data-table-row]{--un-border-opacity:1;border-color:rgba(var(--color-surface-800),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1333
+
1334
+ [data-style='bits-ui'] [data-table-row]:hover {
1335
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1336
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-row]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-table-row]:hover{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1337
+
1338
+ [data-style='bits-ui'] [data-table-row]:focus {
1339
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1340
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-row]:focus,[data-mode="dark"] [data-style="bits-ui"] [data-table-row]:focus{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1341
+
1342
+ [data-style='bits-ui'] [data-table-row][data-selected='true'] {
1343
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
1344
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-row][data-selected="true"],[data-mode="dark"] [data-style="bits-ui"] [data-table-row][data-selected="true"]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
1345
+
1346
+ /* =============================================================================
1347
+ Striped
1348
+ ============================================================================= */
1349
+
1350
+ [data-style='bits-ui'] [data-striped='true'] [data-table-body] tr:nth-child(even) {
1351
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));
1352
+ }[data-mode="dark"][data-style="bits-ui"] [data-striped="true"] [data-table-body] tr:nth-child(even),[data-mode="dark"] [data-style="bits-ui"] [data-striped="true"] [data-table-body] tr:nth-child(even){--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
1353
+
1354
+ /* =============================================================================
1355
+ Empty
1356
+ ============================================================================= */
1357
+
1358
+ [data-style='bits-ui'] [data-table-empty] {
1359
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1360
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-empty],[data-mode="dark"] [data-style="bits-ui"] [data-table-empty]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1361
+
1362
+ /* =============================================================================
1363
+ Cell Icon
1364
+ ============================================================================= */
1365
+
1366
+ [data-style='bits-ui'] [data-table-cell] [data-cell-icon] {
1367
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1368
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-cell] [data-cell-icon],[data-mode="dark"] [data-style="bits-ui"] [data-table-cell] [data-cell-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1369
+
1370
+ [data-style='bits-ui'] [data-table-row][data-selected='true'] [data-cell-icon] {
1371
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1372
+ }[data-mode="dark"][data-style="bits-ui"] [data-table-row][data-selected="true"] [data-cell-icon],[data-mode="dark"] [data-style="bits-ui"] [data-table-row][data-selected="true"] [data-cell-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1373
+
1374
+ /**
1375
+ * SearchFilter - bits-ui Theme Styles
1376
+ *
1377
+ * Rounded input with subtle shadow.
1378
+ */
1379
+
1380
+ /* =============================================================================
1381
+ Input
1382
+ ============================================================================= */
1383
+
1384
+ [data-style='bits-ui'] [data-search-input] {
1385
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1386
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-input],[data-mode="dark"] [data-style="bits-ui"] [data-search-input]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1387
+
1388
+ [data-style='bits-ui'] [data-search-input]:focus {
1389
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1390
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-input]:focus,[data-mode="dark"] [data-style="bits-ui"] [data-search-input]:focus{--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1391
+
1392
+ [data-style='bits-ui'] [data-search-input]::placeholder {
1393
+ --un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
1394
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-input]::placeholder,[data-mode="dark"] [data-style="bits-ui"] [data-search-input]::placeholder{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
1395
+
1396
+ /* =============================================================================
1397
+ Clear Button
1398
+ ============================================================================= */
1399
+
1400
+ [data-style='bits-ui'] [data-search-clear] {
1401
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1402
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-clear],[data-mode="dark"] [data-style="bits-ui"] [data-search-clear]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1403
+
1404
+ [data-style='bits-ui'] [data-search-clear]:hover {
1405
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1406
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-clear]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-search-clear]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1407
+
1408
+ /* =============================================================================
1409
+ Tags
1410
+ ============================================================================= */
1411
+
1412
+ [data-style='bits-ui'] [data-search-tag] {
1413
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1414
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-tag],[data-mode="dark"] [data-style="bits-ui"] [data-search-tag]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1415
+
1416
+ [data-style='bits-ui'] [data-search-tag-remove] {
1417
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1418
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-tag-remove],[data-mode="dark"] [data-style="bits-ui"] [data-search-tag-remove]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1419
+
1420
+ [data-style='bits-ui'] [data-search-tag-remove]:hover {
1421
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1422
+ }[data-mode="dark"][data-style="bits-ui"] [data-search-tag-remove]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-search-tag-remove]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1423
+
1424
+ /**
1425
+ * Range - bits-ui Theme Styles
1426
+ *
1427
+ * Softer range slider with rounded thumb and primary fill.
1428
+ */
1429
+
1430
+ /* =============================================================================
1431
+ Track
1432
+ ============================================================================= */
1433
+
1434
+ [data-style='bits-ui'] [data-range-bar] {
1435
+ border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));
1436
+ }[data-mode="dark"][data-style="bits-ui"] [data-range-bar],[data-mode="dark"] [data-style="bits-ui"] [data-range-bar]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1437
+
1438
+ [data-style='bits-ui'] [data-range-selected] {
1439
+ border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-primary),var(--un-bg-opacity));background-image:none;
1440
+ }
1441
+
1442
+ /* =============================================================================
1443
+ Thumb
1444
+ ============================================================================= */
1445
+
1446
+ [data-style='bits-ui'] [data-range-thumb] {
1447
+ border-width:2px;--un-border-opacity:1;border-color:rgba(var(--color-primary),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1448
+ }[data-mode="dark"][data-style="bits-ui"] [data-range-thumb],[data-mode="dark"] [data-style="bits-ui"] [data-range-thumb]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
1449
+
1450
+ [data-style='bits-ui'] [data-range-thumb][data-sliding] {
1451
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary),var(--un-bg-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1452
+ }
1453
+
1454
+ [data-style='bits-ui'] [data-range-thumb]:focus-visible {
1455
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary),var(--un-bg-opacity));--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1456
+ }[data-mode="dark"][data-style="bits-ui"] [data-range-thumb]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-range-thumb]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1457
+
1458
+ /* =============================================================================
1459
+ Ticks
1460
+ ============================================================================= */
1461
+
1462
+ [data-style='bits-ui'] [data-range-tick] {
1463
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1464
+ }[data-mode="dark"][data-style="bits-ui"] [data-range-tick],[data-mode="dark"] [data-style="bits-ui"] [data-range-tick]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1465
+
1466
+ [data-style='bits-ui'] [data-tick-bar] {
1467
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));
1468
+ }[data-mode="dark"][data-style="bits-ui"] [data-tick-bar],[data-mode="dark"] [data-style="bits-ui"] [data-tick-bar]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));}
1469
+
1470
+ [data-style='bits-ui'] [data-tick-label] {
1471
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1472
+ }[data-mode="dark"][data-style="bits-ui"] [data-tick-label],[data-mode="dark"] [data-style="bits-ui"] [data-tick-label]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1473
+
1474
+ /* =============================================================================
1475
+ Disabled
1476
+ ============================================================================= */
1477
+
1478
+ [data-style='bits-ui'] [data-range][data-disabled] [data-range-thumb] {
1479
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));
1480
+ }[data-mode="dark"][data-style="bits-ui"] [data-range][data-disabled] [data-range-thumb],[data-mode="dark"] [data-style="bits-ui"] [data-range][data-disabled] [data-range-thumb]{--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1481
+
1482
+ [data-style='bits-ui'] [data-range][data-disabled] [data-range-selected] {
1483
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-400),var(--un-bg-opacity));
1484
+ }[data-mode="dark"][data-style="bits-ui"] [data-range][data-disabled] [data-range-selected],[data-mode="dark"] [data-style="bits-ui"] [data-range][data-disabled] [data-range-selected]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-600),var(--un-bg-opacity));}
1485
+
1486
+ /**
1487
+ * Timeline - bits-ui Theme Styles
1488
+ *
1489
+ * Softer timeline with rounded circles and primary accent.
1490
+ */
1491
+
1492
+ /* =============================================================================
1493
+ Circle
1494
+ ============================================================================= */
1495
+
1496
+ [data-style='bits-ui'] [data-timeline-circle] {
1497
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1498
+ }[data-mode="dark"][data-style="bits-ui"] [data-timeline-circle],[data-mode="dark"] [data-style="bits-ui"] [data-timeline-circle]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1499
+
1500
+ [data-style='bits-ui'] [data-timeline-item][data-completed] [data-timeline-circle] {
1501
+ --un-border-opacity:1;border-color:rgba(var(--color-primary),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-primary),var(--un-text-opacity));
1502
+ }
1503
+
1504
+ [data-style='bits-ui'] [data-timeline-item][data-active] [data-timeline-circle] {
1505
+ border-width:2px;--un-border-opacity:1;border-color:rgba(var(--color-primary),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-primary),var(--un-text-opacity));
1506
+ }
1507
+
1508
+ /* =============================================================================
1509
+ Connector
1510
+ ============================================================================= */
1511
+
1512
+ [data-style='bits-ui'] [data-timeline-connector] {
1513
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));
1514
+ }[data-mode="dark"][data-style="bits-ui"] [data-timeline-connector],[data-mode="dark"] [data-style="bits-ui"] [data-timeline-connector]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1515
+
1516
+ [data-style='bits-ui'] [data-timeline-item][data-completed] [data-timeline-connector] {
1517
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary),var(--un-bg-opacity));
1518
+ }
1519
+
1520
+ /* =============================================================================
1521
+ Body
1522
+ ============================================================================= */
1523
+
1524
+ [data-style='bits-ui'] [data-timeline-title] {
1525
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1526
+ }[data-mode="dark"][data-style="bits-ui"] [data-timeline-title],[data-mode="dark"] [data-style="bits-ui"] [data-timeline-title]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1527
+
1528
+ [data-style='bits-ui'] [data-timeline-description] {
1529
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1530
+ }[data-mode="dark"][data-style="bits-ui"] [data-timeline-description],[data-mode="dark"] [data-style="bits-ui"] [data-timeline-description]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1531
+
1532
+ /**
1533
+ * FloatingNavigation - bits-ui Theme Styles
1534
+ *
1535
+ * Card-like container with rounded-xl and shadow.
1536
+ */
1537
+
1538
+ /* =============================================================================
1539
+ Container
1540
+ ============================================================================= */
1541
+
1542
+ [data-style='bits-ui'] [data-floating-nav] {
1543
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.75rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1544
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));}
1545
+
1546
+ /* =============================================================================
1547
+ Header
1548
+ ============================================================================= */
1549
+
1550
+ [data-style='bits-ui'] [data-floating-nav-title] {
1551
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1552
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-title],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-title]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1553
+
1554
+ [data-style='bits-ui'] [data-floating-nav-pin] {
1555
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1556
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-pin],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-pin]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1557
+
1558
+ [data-style='bits-ui'] [data-floating-nav-pin]:hover {
1559
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1560
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-pin]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-pin]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1561
+
1562
+ [data-style='bits-ui'] [data-floating-nav-pin][aria-pressed='true'] {
1563
+ --un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1564
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-pin][aria-pressed="true"],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-pin][aria-pressed="true"]{--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1565
+
1566
+ /* =============================================================================
1567
+ Items
1568
+ ============================================================================= */
1569
+
1570
+ [data-style='bits-ui'] [data-floating-nav-item] {
1571
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1572
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-item],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-item]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1573
+
1574
+ [data-style='bits-ui'] [data-floating-nav-item]:hover {
1575
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1576
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-item]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-item]:hover{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1577
+
1578
+ [data-style='bits-ui'] [data-floating-nav-item][data-active] {
1579
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-800),var(--un-text-opacity));
1580
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-item][data-active],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-item][data-active]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-200),var(--un-text-opacity));}
1581
+
1582
+ [data-style='bits-ui'] [data-floating-nav-item]:focus-visible {
1583
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1584
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-item]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-item]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1585
+
1586
+ /* Icon */
1587
+ [data-style='bits-ui'] [data-floating-nav-icon] {
1588
+ --un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1589
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-icon],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1590
+
1591
+ [data-style='bits-ui'] [data-floating-nav-item][data-active] [data-floating-nav-icon] {
1592
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1593
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-item][data-active] [data-floating-nav-icon],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-item][data-active] [data-floating-nav-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1594
+
1595
+ /* =============================================================================
1596
+ Active Indicator
1597
+ ============================================================================= */
1598
+
1599
+ [data-style='bits-ui'] [data-floating-nav-indicator] {
1600
+ border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));background-image:none;
1601
+ }[data-mode="dark"][data-style="bits-ui"] [data-floating-nav-indicator],[data-mode="dark"] [data-style="bits-ui"] [data-floating-nav-indicator]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));}
1602
+
1603
+ /**
1604
+ * Grid - bits-ui Theme Styles
1605
+ *
1606
+ * Card-like tiles with rounded-xl, shadow, and primary selection.
1607
+ */
1608
+
1609
+ /* =============================================================================
1610
+ Grid Tiles
1611
+ ============================================================================= */
1612
+
1613
+ [data-style='bits-ui'] [data-grid] [data-grid-item] {
1614
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.75rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1615
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item],[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1616
+
1617
+ [data-style='bits-ui'] [data-grid] [data-grid-item]:hover:not(:disabled):not([data-disabled]) {
1618
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1619
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item]:hover:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item]:hover:not(:disabled):not([data-disabled]){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1620
+
1621
+ [data-style='bits-ui'] [data-grid] [data-grid-item]:focus:not(:disabled):not([data-disabled]) {
1622
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1623
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item]:focus:not(:disabled):not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item]:focus:not(:disabled):not([data-disabled]){--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1624
+
1625
+ /* Active / selected tile */
1626
+ [data-style='bits-ui'] [data-grid] [data-grid-item][data-active] {
1627
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-900),var(--un-text-opacity));
1628
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item][data-active],[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item][data-active]{--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-100),var(--un-text-opacity));}
1629
+
1630
+ [data-style='bits-ui'] [data-grid] [data-grid-item][data-active]:hover:not(:disabled) {
1631
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-300),var(--un-bg-opacity));
1632
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item][data-active]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item][data-active]:hover:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-primary-700),var(--un-bg-opacity));}
1633
+
1634
+ /* =============================================================================
1635
+ Item Elements
1636
+ ============================================================================= */
1637
+
1638
+ [data-style='bits-ui'] [data-grid] [data-grid-item] [data-item-icon] {
1639
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1640
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1641
+
1642
+ [data-style='bits-ui'] [data-grid] [data-grid-item]:hover:not(:disabled) [data-item-icon] {
1643
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1644
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item]:hover:not(:disabled) [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item]:hover:not(:disabled) [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1645
+
1646
+ [data-style='bits-ui'] [data-grid] [data-grid-item][data-active] [data-item-icon] {
1647
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1648
+ }[data-mode="dark"][data-style="bits-ui"] [data-grid] [data-grid-item][data-active] [data-item-icon],[data-mode="dark"] [data-style="bits-ui"] [data-grid] [data-grid-item][data-active] [data-item-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1649
+
1650
+ /**
1651
+ * UploadTarget - bits-ui Theme Styles
1652
+ *
1653
+ * Rounded drop zone with shadow and primary drag highlight.
1654
+ */
1655
+
1656
+ /* =============================================================================
1657
+ Drop Zone
1658
+ ============================================================================= */
1659
+
1660
+ [data-style='bits-ui'] [data-upload-target] {
1661
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.75rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1662
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target],[data-mode="dark"] [data-style="bits-ui"] [data-upload-target]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1663
+
1664
+ [data-style='bits-ui'] [data-upload-target]:hover:not([data-disabled]) {
1665
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1666
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target]:hover:not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-upload-target]:hover:not([data-disabled]){--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1667
+
1668
+ [data-style='bits-ui'] [data-upload-target]:focus-visible:not([data-disabled]) {
1669
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1670
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target]:focus-visible:not([data-disabled]),[data-mode="dark"] [data-style="bits-ui"] [data-upload-target]:focus-visible:not([data-disabled]){--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1671
+
1672
+ /* Drag-over highlight */
1673
+ [data-style='bits-ui'] [data-upload-target][data-dragging] {
1674
+ --un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1675
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target][data-dragging],[data-mode="dark"] [data-style="bits-ui"] [data-upload-target][data-dragging]{--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1676
+
1677
+ /* =============================================================================
1678
+ Upload Icon
1679
+ ============================================================================= */
1680
+
1681
+ [data-style='bits-ui'] [data-upload-target] [data-upload-icon] {
1682
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1683
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target] [data-upload-icon],[data-mode="dark"] [data-style="bits-ui"] [data-upload-target] [data-upload-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1684
+
1685
+ [data-style='bits-ui'] [data-upload-target][data-dragging] [data-upload-icon] {
1686
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1687
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target][data-dragging] [data-upload-icon],[data-mode="dark"] [data-style="bits-ui"] [data-upload-target][data-dragging] [data-upload-icon]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1688
+
1689
+ /* =============================================================================
1690
+ Browse Button
1691
+ ============================================================================= */
1692
+
1693
+ [data-style='bits-ui'] [data-upload-target] [data-upload-button] {
1694
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1695
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target] [data-upload-button],[data-mode="dark"] [data-style="bits-ui"] [data-upload-target] [data-upload-button]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1696
+
1697
+ [data-style='bits-ui'] [data-upload-target] [data-upload-button]:hover:not(:disabled) {
1698
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1699
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-target] [data-upload-button]:hover:not(:disabled),[data-mode="dark"] [data-style="bits-ui"] [data-upload-target] [data-upload-button]:hover:not(:disabled){--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1700
+
1701
+ /**
1702
+ * UploadProgress - bits-ui Theme Styles
1703
+ *
1704
+ * Status colors, progress fill, action buttons.
1705
+ */
1706
+
1707
+ /* =============================================================================
1708
+ Header
1709
+ ============================================================================= */
1710
+
1711
+ [data-style='bits-ui'] [data-upload-header] {
1712
+ --un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1713
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-header],[data-mode="dark"] [data-style="bits-ui"] [data-upload-header]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1714
+
1715
+ [data-style='bits-ui'] [data-upload-clear] {
1716
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-300),var(--un-border-opacity));border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1717
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-clear],[data-mode="dark"] [data-style="bits-ui"] [data-upload-clear]{--un-border-opacity:1;border-color:rgba(var(--color-surface-700),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1718
+
1719
+ [data-style='bits-ui'] [data-upload-clear]:hover {
1720
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1721
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-clear]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-upload-clear]:hover{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1722
+
1723
+ /* =============================================================================
1724
+ File Rows
1725
+ ============================================================================= */
1726
+
1727
+ [data-style='bits-ui'] [data-upload-file-status] {
1728
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1729
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-status],[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-status]{--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1730
+
1731
+ [data-style='bits-ui'] [data-upload-file-status]:hover {
1732
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
1733
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-status]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-status]:hover{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
1734
+
1735
+ /* =============================================================================
1736
+ File Elements
1737
+ ============================================================================= */
1738
+
1739
+ [data-style='bits-ui'] [data-upload-file-icon] {
1740
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1741
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-icon],[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-icon]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1742
+
1743
+ [data-style='bits-ui'] [data-upload-file-size] {
1744
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1745
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-size],[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-size]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1746
+
1747
+ /* =============================================================================
1748
+ Progress Bar
1749
+ ============================================================================= */
1750
+
1751
+ [data-style='bits-ui'] [data-upload-bar] {
1752
+ border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));
1753
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-bar],[data-mode="dark"] [data-style="bits-ui"] [data-upload-bar]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));}
1754
+
1755
+ [data-style='bits-ui'] [data-upload-fill] {
1756
+ border-radius:0.5rem;--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-primary-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-secondary-500),1) var(--un-gradient-to-position);--un-gradient-shape:to right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));
1757
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-fill],[data-mode="dark"] [data-style="bits-ui"] [data-upload-fill]{--un-gradient-from-position:0%;--un-gradient-from:rgba(var(--color-primary-500),1) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:rgba(var(--color-secondary-500),1) var(--un-gradient-to-position);}
1758
+
1759
+ /* =============================================================================
1760
+ Status Colors
1761
+ ============================================================================= */
1762
+
1763
+ [data-style='bits-ui'] [data-upload-file-status][data-status='uploading'] [data-upload-status] {
1764
+ --un-text-opacity:1;color:rgba(var(--color-primary-600),var(--un-text-opacity));
1765
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-status][data-status="uploading"] [data-upload-status],[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-status][data-status="uploading"] [data-upload-status]{--un-text-opacity:1;color:rgba(var(--color-primary-400),var(--un-text-opacity));}
1766
+
1767
+ [data-style='bits-ui'] [data-upload-file-status][data-status='done'] [data-upload-status] {
1768
+ --un-text-opacity:1;color:rgb(34 197 94 / var(--un-text-opacity));
1769
+ }
1770
+
1771
+ [data-style='bits-ui'] [data-upload-file-status][data-status='error'] [data-upload-status] {
1772
+ --un-text-opacity:1;color:rgb(239 68 68 / var(--un-text-opacity));
1773
+ }
1774
+
1775
+ [data-style='bits-ui'] [data-upload-file-status][data-status='pending'] [data-upload-status] {
1776
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1777
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-status][data-status="pending"] [data-upload-status],[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-status][data-status="pending"] [data-upload-status]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1778
+
1779
+ /* Status-based file icon tinting */
1780
+ [data-style='bits-ui'] [data-upload-file-status][data-status='done'] [data-upload-file-icon] {
1781
+ --un-text-opacity:1;color:rgb(34 197 94 / var(--un-text-opacity));
1782
+ }
1783
+
1784
+ [data-style='bits-ui'] [data-upload-file-status][data-status='error'] [data-upload-file-icon] {
1785
+ --un-text-opacity:1;color:rgb(239 68 68 / var(--un-text-opacity));
1786
+ }
1787
+
1788
+ /* =============================================================================
1789
+ Action Buttons
1790
+ ============================================================================= */
1791
+
1792
+ [data-style='bits-ui'] [data-upload-actions] button {
1793
+ border-radius:0.25rem;--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1794
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-actions] button,[data-mode="dark"] [data-style="bits-ui"] [data-upload-actions] button{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1795
+
1796
+ [data-style='bits-ui'] [data-upload-actions] button:hover {
1797
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-300),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));
1798
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-actions] button:hover,[data-mode="dark"] [data-style="bits-ui"] [data-upload-actions] button:hover{--un-bg-opacity:1;background-color:rgba(var(--color-surface-700),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1799
+
1800
+ [data-style='bits-ui'] [data-upload-file-status][data-status='error'] [data-upload-retry]:hover {
1801
+ --un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1802
+ }[data-mode="dark"][data-style="bits-ui"] [data-upload-file-status][data-status="error"] [data-upload-retry]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-upload-file-status][data-status="error"] [data-upload-retry]:hover{--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1803
+
1804
+ /* TableOfContents — bits-ui theme */
1805
+
1806
+ [data-style='bits-ui'] [data-toc] [data-toc-label] {
1807
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1808
+ }[data-mode="dark"][data-style="bits-ui"] [data-toc] [data-toc-label],[data-mode="dark"] [data-style="bits-ui"] [data-toc] [data-toc-label]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1809
+
1810
+ [data-style='bits-ui'] [data-toc] [data-toc-item] {
1811
+ border-radius:0.5rem;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));
1812
+ }[data-mode="dark"][data-style="bits-ui"] [data-toc] [data-toc-item],[data-mode="dark"] [data-style="bits-ui"] [data-toc] [data-toc-item]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
1813
+
1814
+ [data-style='bits-ui'] [data-toc] [data-toc-item]:hover,
1815
+ [data-style='bits-ui'] [data-toc] [data-toc-item][data-toc-focused] {
1816
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));outline:2px solid transparent;outline-offset:2px;
1817
+ }[data-mode="dark"][data-style="bits-ui"] [data-toc] [data-toc-item]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-toc] [data-toc-item]:hover,[data-mode="dark"][data-style="bits-ui"] [data-toc] [data-toc-item][data-toc-focused],[data-mode="dark"] [data-style="bits-ui"] [data-toc] [data-toc-item][data-toc-focused]{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1818
+
1819
+ [data-style='bits-ui'] [data-toc] [data-toc-item][data-toc-active] {
1820
+ --un-bg-opacity:1;background-color:rgba(var(--color-primary-200),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-700),var(--un-text-opacity));
1821
+ }[data-mode="dark"][data-style="bits-ui"] [data-toc] [data-toc-item][data-toc-active],[data-mode="dark"] [data-style="bits-ui"] [data-toc] [data-toc-item][data-toc-active]{--un-bg-opacity:1;background-color:rgba(var(--color-primary-800),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-primary-300),var(--un-text-opacity));}
1822
+
1823
+ /**
1824
+ * Card - bits-ui Theme Styles
1825
+ *
1826
+ * Premium card styling with rounded-xl and shadow.
1827
+ */
1828
+
1829
+ /* =============================================================================
1830
+ Base Card Styles
1831
+ ============================================================================= */
1832
+
1833
+ [data-style='bits-ui'] [data-card] {
1834
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-200),var(--un-border-opacity));border-radius:0.75rem;--un-bg-opacity:1;background-color:rgba(var(--color-surface-100),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-900),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1835
+ }[data-mode="dark"][data-style="bits-ui"] [data-card],[data-mode="dark"] [data-style="bits-ui"] [data-card]{--un-border-opacity:1;border-color:rgba(var(--color-surface-800),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-100),var(--un-text-opacity));}
1836
+
1837
+ /* Interactive cards (buttons) */
1838
+ [data-style='bits-ui'] [data-card][data-card-interactive] {
1839
+ cursor: pointer;
1840
+ transition:
1841
+ border-color 0.2s ease,
1842
+ box-shadow 0.2s ease;
1843
+ }
1844
+
1845
+ [data-style='bits-ui'] [data-card][data-card-interactive]:hover {
1846
+ --un-border-opacity:1;border-color:rgba(var(--color-surface-400),var(--un-border-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1847
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-card-interactive]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-card][data-card-interactive]:hover{--un-border-opacity:1;border-color:rgba(var(--color-surface-600),var(--un-border-opacity));}
1848
+
1849
+ [data-style='bits-ui'] [data-card][data-card-interactive]:active {
1850
+ --un-bg-opacity:1;background-color:rgba(var(--color-surface-200),var(--un-bg-opacity));
1851
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-card-interactive]:active,[data-mode="dark"] [data-style="bits-ui"] [data-card][data-card-interactive]:active{--un-bg-opacity:1;background-color:rgba(var(--color-surface-800),var(--un-bg-opacity));}
1852
+
1853
+ /* =============================================================================
1854
+ Card Sections
1855
+ ============================================================================= */
1856
+
1857
+ [data-style='bits-ui'] [data-card-header] {
1858
+ border-bottom-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-200),var(--un-border-opacity));
1859
+ }[data-mode="dark"][data-style="bits-ui"] [data-card-header],[data-mode="dark"] [data-style="bits-ui"] [data-card-header]{--un-border-opacity:1;border-color:rgba(var(--color-surface-800),var(--un-border-opacity));}
1860
+
1861
+ [data-style='bits-ui'] [data-card-body] {
1862
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
1863
+ }[data-mode="dark"][data-style="bits-ui"] [data-card-body],[data-mode="dark"] [data-style="bits-ui"] [data-card-body]{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
1864
+
1865
+ [data-style='bits-ui'] [data-card-footer] {
1866
+ border-top-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-200),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));
1867
+ }[data-mode="dark"][data-style="bits-ui"] [data-card-footer],[data-mode="dark"] [data-style="bits-ui"] [data-card-footer]{--un-border-opacity:1;border-color:rgba(var(--color-surface-800),var(--un-border-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1868
+
1869
+ /* =============================================================================
1870
+ Focus States
1871
+ ============================================================================= */
1872
+
1873
+ [data-style='bits-ui'] [data-card][data-card-interactive]:focus-visible {
1874
+ outline:2px solid transparent;outline-offset:2px;--un-ring-width:2px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-300),var(--un-ring-opacity));
1875
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-card-interactive]:focus-visible,[data-mode="dark"] [data-style="bits-ui"] [data-card][data-card-interactive]:focus-visible{--un-ring-opacity:1;--un-ring-color:rgba(var(--color-primary-700),var(--un-ring-opacity));}
1876
+
1877
+ /* =============================================================================
1878
+ Disabled State
1879
+ ============================================================================= */
1880
+
1881
+ [data-style='bits-ui'] [data-card][data-card-interactive][data-disabled],
1882
+ [data-style='bits-ui'] [data-card][data-card-interactive]:disabled {
1883
+ cursor:not-allowed;opacity:0.5;
1884
+ }
1885
+
1886
+ /* =============================================================================
1887
+ Variants
1888
+ ============================================================================= */
1889
+
1890
+ /* Primary — solid primary fill */
1891
+ [data-style='bits-ui'] [data-card][data-variant='primary'] {
1892
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-primary-600),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1893
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="primary"],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="primary"]{--un-border-opacity:1;border-color:rgba(var(--color-primary-400),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-primary-500),var(--un-bg-opacity));}
1894
+
1895
+ [data-style='bits-ui'] [data-card][data-variant='primary'] [data-card-header],
1896
+ [data-style='bits-ui'] [data-card][data-variant='primary'] [data-card-footer] {
1897
+ border-color:rgba(var(--color-primary-400),0.4);
1898
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="primary"] [data-card-header],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="primary"] [data-card-header],[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="primary"] [data-card-footer],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="primary"] [data-card-footer]{border-color:rgba(var(--color-primary-600),0.4);}
1899
+
1900
+ [data-style='bits-ui'] [data-card][data-variant='primary'] [data-card-body] {
1901
+ @apply text-on-primary/80;
1902
+ }
1903
+
1904
+ /* Secondary — solid secondary fill */
1905
+ [data-style='bits-ui'] [data-card][data-variant='secondary'] {
1906
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-secondary-500),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-secondary-400),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-50),var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1907
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="secondary"],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="secondary"]{--un-border-opacity:1;border-color:rgba(var(--color-secondary-500),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-secondary-600),var(--un-bg-opacity));}
1908
+
1909
+ [data-style='bits-ui'] [data-card][data-variant='secondary'] [data-card-header],
1910
+ [data-style='bits-ui'] [data-card][data-variant='secondary'] [data-card-footer] {
1911
+ border-color:rgba(var(--color-secondary-300),0.4);
1912
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="secondary"] [data-card-header],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="secondary"] [data-card-header],[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="secondary"] [data-card-footer],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="secondary"] [data-card-footer]{border-color:rgba(var(--color-secondary-700),0.4);}
1913
+
1914
+ [data-style='bits-ui'] [data-card][data-variant='secondary'] [data-card-body] {
1915
+ @apply text-on-secondary/80;
1916
+ }
1917
+
1918
+ /* Tertiary — recessed surface, lighter border */
1919
+ [data-style='bits-ui'] [data-card][data-variant='tertiary'] {
1920
+ border-width:1px;--un-border-opacity:1;border-color:rgba(var(--color-surface-200),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-50),var(--un-bg-opacity));background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-700),var(--un-text-opacity));--un-shadow:0 0 var(--un-shadow-color, rgb(0 0 0 / 0));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
1921
+ }[data-mode="dark"][data-style="bits-ui"] [data-card][data-variant="tertiary"],[data-mode="dark"] [data-style="bits-ui"] [data-card][data-variant="tertiary"]{--un-border-opacity:1;border-color:rgba(var(--color-surface-800),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-surface-950),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-surface-300),var(--un-text-opacity));}
1922
+
1923
+ /**
1924
+ * Message - bits-ui Theme Styles
1925
+ */
1926
+
1927
+ [data-style='bits-ui'] [data-message-root][data-type='error'] {
1928
+ --un-border-opacity:1;border-color:rgba(var(--color-error-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-error-100),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-error-800),var(--un-text-opacity));
1929
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="error"],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="error"]{--un-border-opacity:1;border-color:rgba(var(--color-error-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-error-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-error-200),var(--un-text-opacity));}
1930
+ [data-style='bits-ui'] [data-message-root][data-type='error'] [data-message-icon],
1931
+ [data-style='bits-ui'] [data-message-root][data-type='error'] [data-message-dismiss] {
1932
+ --un-text-opacity:1;color:rgba(var(--color-error-500),var(--un-text-opacity));
1933
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="error"] [data-message-icon],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="error"] [data-message-icon],[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="error"] [data-message-dismiss],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="error"] [data-message-dismiss]{--un-text-opacity:1;color:rgba(var(--color-error-500),var(--un-text-opacity));}
1934
+
1935
+ [data-style='bits-ui'] [data-message-root][data-type='warning'] {
1936
+ --un-border-opacity:1;border-color:rgba(var(--color-warning-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-warning-100),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-warning-800),var(--un-text-opacity));
1937
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="warning"],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="warning"]{--un-border-opacity:1;border-color:rgba(var(--color-warning-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-warning-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-warning-200),var(--un-text-opacity));}
1938
+ [data-style='bits-ui'] [data-message-root][data-type='warning'] [data-message-icon],
1939
+ [data-style='bits-ui'] [data-message-root][data-type='warning'] [data-message-dismiss] {
1940
+ --un-text-opacity:1;color:rgba(var(--color-warning-500),var(--un-text-opacity));
1941
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="warning"] [data-message-icon],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="warning"] [data-message-icon],[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="warning"] [data-message-dismiss],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="warning"] [data-message-dismiss]{--un-text-opacity:1;color:rgba(var(--color-warning-500),var(--un-text-opacity));}
1942
+
1943
+ [data-style='bits-ui'] [data-message-root][data-type='info'] {
1944
+ --un-border-opacity:1;border-color:rgba(var(--color-info-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-info-100),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-info-800),var(--un-text-opacity));
1945
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="info"],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="info"]{--un-border-opacity:1;border-color:rgba(var(--color-info-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-info-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-info-200),var(--un-text-opacity));}
1946
+ [data-style='bits-ui'] [data-message-root][data-type='info'] [data-message-icon],
1947
+ [data-style='bits-ui'] [data-message-root][data-type='info'] [data-message-dismiss] {
1948
+ --un-text-opacity:1;color:rgba(var(--color-info-500),var(--un-text-opacity));
1949
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="info"] [data-message-icon],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="info"] [data-message-icon],[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="info"] [data-message-dismiss],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="info"] [data-message-dismiss]{--un-text-opacity:1;color:rgba(var(--color-info-500),var(--un-text-opacity));}
1950
+
1951
+ [data-style='bits-ui'] [data-message-root][data-type='success'] {
1952
+ --un-border-opacity:1;border-color:rgba(var(--color-success-300),var(--un-border-opacity));border-radius:0.5rem;--un-bg-opacity:1;background-color:rgba(var(--color-success-100),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-success-800),var(--un-text-opacity));
1953
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="success"],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="success"]{--un-border-opacity:1;border-color:rgba(var(--color-success-700),var(--un-border-opacity));--un-bg-opacity:1;background-color:rgba(var(--color-success-900),var(--un-bg-opacity));--un-text-opacity:1;color:rgba(var(--color-success-200),var(--un-text-opacity));}
1954
+ [data-style='bits-ui'] [data-message-root][data-type='success'] [data-message-icon],
1955
+ [data-style='bits-ui'] [data-message-root][data-type='success'] [data-message-dismiss] {
1956
+ --un-text-opacity:1;color:rgba(var(--color-success-500),var(--un-text-opacity));
1957
+ }[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="success"] [data-message-icon],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="success"] [data-message-icon],[data-mode="dark"][data-style="bits-ui"] [data-message-root][data-type="success"] [data-message-dismiss],[data-mode="dark"] [data-style="bits-ui"] [data-message-root][data-type="success"] [data-message-dismiss]{--un-text-opacity:1;color:rgba(var(--color-success-500),var(--un-text-opacity));}
1958
+
1959
+ /**
1960
+ * StatusList - bits-ui Theme Styles
1961
+ */
1962
+
1963
+ /* ── @rokkit/ui StatusList: icon and text colors by status ── */
1964
+
1965
+ [data-style='bits-ui'] [data-status-item][data-status='pass'] span {
1966
+ --un-text-opacity:1;color:rgba(var(--color-success-500),var(--un-text-opacity));
1967
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="pass"] span,[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="pass"] span{--un-text-opacity:1;color:rgba(var(--color-success-500),var(--un-text-opacity));}
1968
+ [data-style='bits-ui'] [data-status-item][data-status='fail'] span {
1969
+ --un-text-opacity:1;color:rgba(var(--color-error-500),var(--un-text-opacity));
1970
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="fail"] span,[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="fail"] span{--un-text-opacity:1;color:rgba(var(--color-error-500),var(--un-text-opacity));}
1971
+ [data-style='bits-ui'] [data-status-item][data-status='warn'] span {
1972
+ --un-text-opacity:1;color:rgba(var(--color-warning-500),var(--un-text-opacity));
1973
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="warn"] span,[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="warn"] span{--un-text-opacity:1;color:rgba(var(--color-warning-500),var(--un-text-opacity));}
1974
+ [data-style='bits-ui'] [data-status-item][data-status='unknown'] span {
1975
+ --un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));
1976
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="unknown"] span,[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="unknown"] span{--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));}
1977
+
1978
+ [data-style='bits-ui'] [data-status-item][data-status='pass'] {
1979
+ --un-text-opacity:1;color:rgba(var(--color-success-700),var(--un-text-opacity));
1980
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="pass"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="pass"]{--un-text-opacity:1;color:rgba(var(--color-success-300),var(--un-text-opacity));}
1981
+ [data-style='bits-ui'] [data-status-item][data-status='fail'] {
1982
+ --un-text-opacity:1;color:rgba(var(--color-error-700),var(--un-text-opacity));
1983
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="fail"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="fail"]{--un-text-opacity:1;color:rgba(var(--color-error-300),var(--un-text-opacity));}
1984
+ [data-style='bits-ui'] [data-status-item][data-status='warn'] {
1985
+ --un-text-opacity:1;color:rgba(var(--color-warning-700),var(--un-text-opacity));
1986
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="warn"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="warn"]{--un-text-opacity:1;color:rgba(var(--color-warning-300),var(--un-text-opacity));}
1987
+ [data-style='bits-ui'] [data-status-item][data-status='unknown'] {
1988
+ --un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));
1989
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="unknown"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="unknown"]{--un-text-opacity:1;color:rgba(var(--color-surface-500),var(--un-text-opacity));}
1990
+
1991
+ /* ── @rokkit/forms StatusList: group headers by severity ── */
1992
+
1993
+ [data-style='bits-ui'] [data-status-group][data-severity='error'] [data-status-header] {
1994
+ --un-text-opacity:1;color:rgba(var(--color-error-500),var(--un-text-opacity));
1995
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-group][data-severity="error"] [data-status-header],[data-mode="dark"] [data-style="bits-ui"] [data-status-group][data-severity="error"] [data-status-header]{--un-text-opacity:1;color:rgba(var(--color-error-500),var(--un-text-opacity));}
1996
+ [data-style='bits-ui'] [data-status-group][data-severity='warning'] [data-status-header] {
1997
+ --un-text-opacity:1;color:rgba(var(--color-warning-500),var(--un-text-opacity));
1998
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-group][data-severity="warning"] [data-status-header],[data-mode="dark"] [data-style="bits-ui"] [data-status-group][data-severity="warning"] [data-status-header]{--un-text-opacity:1;color:rgba(var(--color-warning-500),var(--un-text-opacity));}
1999
+ [data-style='bits-ui'] [data-status-group][data-severity='info'] [data-status-header] {
2000
+ --un-text-opacity:1;color:rgba(var(--color-info-500),var(--un-text-opacity));
2001
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-group][data-severity="info"] [data-status-header],[data-mode="dark"] [data-style="bits-ui"] [data-status-group][data-severity="info"] [data-status-header]{--un-text-opacity:1;color:rgba(var(--color-info-500),var(--un-text-opacity));}
2002
+ [data-style='bits-ui'] [data-status-group][data-severity='success'] [data-status-header] {
2003
+ --un-text-opacity:1;color:rgba(var(--color-success-500),var(--un-text-opacity));
2004
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-group][data-severity="success"] [data-status-header],[data-mode="dark"] [data-style="bits-ui"] [data-status-group][data-severity="success"] [data-status-header]{--un-text-opacity:1;color:rgba(var(--color-success-500),var(--un-text-opacity));}
2005
+
2006
+ /* ── @rokkit/forms StatusList: item colors ── */
2007
+
2008
+ [data-style='bits-ui'] [data-status-item][data-status='error'] {
2009
+ --un-text-opacity:1;color:rgba(var(--color-error-700),var(--un-text-opacity));
2010
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="error"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="error"]{--un-text-opacity:1;color:rgba(var(--color-error-300),var(--un-text-opacity));}
2011
+ [data-style='bits-ui'] [data-status-item][data-status='warning'] {
2012
+ --un-text-opacity:1;color:rgba(var(--color-warning-700),var(--un-text-opacity));
2013
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="warning"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="warning"]{--un-text-opacity:1;color:rgba(var(--color-warning-300),var(--un-text-opacity));}
2014
+ [data-style='bits-ui'] [data-status-item][data-status='info'] {
2015
+ --un-text-opacity:1;color:rgba(var(--color-info-700),var(--un-text-opacity));
2016
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="info"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="info"]{--un-text-opacity:1;color:rgba(var(--color-info-300),var(--un-text-opacity));}
2017
+ [data-style='bits-ui'] [data-status-item][data-status='success'] {
2018
+ --un-text-opacity:1;color:rgba(var(--color-success-700),var(--un-text-opacity));
2019
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-item][data-status="success"],[data-mode="dark"] [data-style="bits-ui"] [data-status-item][data-status="success"]{--un-text-opacity:1;color:rgba(var(--color-success-300),var(--un-text-opacity));}
2020
+
2021
+ /* Count badge */
2022
+ [data-style='bits-ui'] [data-status-count] {
2023
+ background-image:none;--un-text-opacity:1;color:rgba(var(--color-surface-600),var(--un-text-opacity));font-weight:600;
2024
+ }[data-mode="dark"][data-style="bits-ui"] [data-status-count],[data-mode="dark"] [data-style="bits-ui"] [data-status-count]{--un-text-opacity:1;color:rgba(var(--color-surface-400),var(--un-text-opacity));}
2025
+
2026
+ /**
2027
+ * Chart - Bits UI Theme Styles
2028
+ */
2029
+
2030
+ [data-style='bits-ui'] [data-chart-axis-line],
2031
+ [data-style='bits-ui'] [data-chart-tick] line {
2032
+ --un-stroke-opacity:1;stroke:rgba(var(--color-surface-300),var(--un-stroke-opacity));
2033
+ }[data-mode="dark"][data-style="bits-ui"] [data-chart-axis-line],[data-mode="dark"] [data-style="bits-ui"] [data-chart-axis-line],[data-mode="dark"][data-style="bits-ui"] [data-chart-tick] line,[data-mode="dark"] [data-style="bits-ui"] [data-chart-tick] line{--un-stroke-opacity:1;stroke:rgba(var(--color-surface-700),var(--un-stroke-opacity));}
2034
+
2035
+ [data-style='bits-ui'] [data-chart-tick-label] {
2036
+ --un-fill-opacity:1;fill:rgba(var(--color-surface-500),var(--un-fill-opacity));
2037
+ }[data-mode="dark"][data-style="bits-ui"] [data-chart-tick-label],[data-mode="dark"] [data-style="bits-ui"] [data-chart-tick-label]{--un-fill-opacity:1;fill:rgba(var(--color-surface-500),var(--un-fill-opacity));}
2038
+
2039
+ [data-style='bits-ui'] [data-chart-grid-line] {
2040
+ --un-stroke-opacity:1;stroke:rgba(var(--color-surface-300),var(--un-stroke-opacity));
2041
+ stroke-opacity: 0.5;
2042
+ stroke-dasharray: 2 4;
2043
+ }[data-mode="dark"][data-style="bits-ui"] [data-chart-grid-line],[data-mode="dark"] [data-style="bits-ui"] [data-chart-grid-line]{--un-stroke-opacity:1;stroke:rgba(var(--color-surface-700),var(--un-stroke-opacity));}
2044
+
2045
+ [data-style='bits-ui'] [data-chart-legend-label] {
2046
+ --un-fill-opacity:1;fill:rgba(var(--color-surface-500),var(--un-fill-opacity));
2047
+ }[data-mode="dark"][data-style="bits-ui"] [data-chart-legend-label],[data-mode="dark"] [data-style="bits-ui"] [data-chart-legend-label]{--un-fill-opacity:1;fill:rgba(var(--color-surface-500),var(--un-fill-opacity));}
2048
+
2049
+ [data-style='bits-ui'] [data-chart-legend-item]:hover {
2050
+ --un-text-opacity:1;color:rgba(var(--color-surface-800),var(--un-text-opacity));
2051
+ }[data-mode="dark"][data-style="bits-ui"] [data-chart-legend-item]:hover,[data-mode="dark"] [data-style="bits-ui"] [data-chart-legend-item]:hover{--un-text-opacity:1;color:rgba(var(--color-surface-200),var(--un-text-opacity));}
2052
+
2053
+ [data-style='bits-ui'] [data-plot-element="bar"][data-dimmed],
2054
+ [data-style='bits-ui'] [data-plot-element="point"][data-dimmed],
2055
+ [data-style='bits-ui'] [data-plot-element="arc"][data-dimmed],
2056
+ [data-style='bits-ui'] [data-plot-element="line"][data-dimmed],
2057
+ [data-style='bits-ui'] [data-plot-element="area"][data-dimmed] {
2058
+ opacity: 0.15;
2059
+ }
2060
+