banhaten 0.4.0 → 0.5.0

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 (348) hide show
  1. package/CHANGELOG.md +139 -100
  2. package/CONTRIBUTING.md +46 -44
  3. package/README.md +192 -190
  4. package/SECURITY.md +15 -15
  5. package/banhaten.config.example.json +11 -11
  6. package/docs/design-spacing.md +13 -0
  7. package/docs/design-system/README.md +22 -20
  8. package/docs/design-system/adoption-quality-remediation.md +87 -87
  9. package/docs/design-system/agent-usage.md +13 -13
  10. package/docs/design-system/appearance-presets.md +189 -189
  11. package/docs/design-system/appearances/default.md +94 -94
  12. package/docs/design-system/appearances/rounded.md +95 -95
  13. package/docs/design-system/appearances/sharp.md +95 -95
  14. package/docs/design-system/component-docs-pattern.md +81 -81
  15. package/docs/design-system/component-implementation-ownership-audit.md +245 -245
  16. package/docs/design-system/component-quality-audit-2026-08-20.md +225 -225
  17. package/docs/design-system/component-showcase-consistency-report.md +219 -219
  18. package/docs/design-system/component-token-consistency-audit.md +173 -173
  19. package/docs/design-system/components/README.md +90 -76
  20. package/docs/design-system/components/accordion.md +53 -53
  21. package/docs/design-system/components/activity-feed.md +94 -94
  22. package/docs/design-system/components/activity-heatmap.md +57 -57
  23. package/docs/design-system/components/agent-input.md +85 -0
  24. package/docs/design-system/components/alert-dialog.md +72 -72
  25. package/docs/design-system/components/alert.md +97 -97
  26. package/docs/design-system/components/approval-card.md +134 -0
  27. package/docs/design-system/components/aspect-ratio.md +45 -45
  28. package/docs/design-system/components/attribute.md +88 -88
  29. package/docs/design-system/components/autocomplete.md +75 -75
  30. package/docs/design-system/components/avatar.md +54 -54
  31. package/docs/design-system/components/badge.md +54 -54
  32. package/docs/design-system/components/banner.md +87 -87
  33. package/docs/design-system/components/breadcrumbs.md +176 -175
  34. package/docs/design-system/components/button-group.md +98 -98
  35. package/docs/design-system/components/button.md +83 -80
  36. package/docs/design-system/components/card.md +88 -88
  37. package/docs/design-system/components/carousel.md +46 -46
  38. package/docs/design-system/components/catalog-components.md +47 -47
  39. package/docs/design-system/components/chart.md +95 -24
  40. package/docs/design-system/components/checkbox.md +54 -54
  41. package/docs/design-system/components/collapsible.md +67 -53
  42. package/docs/design-system/components/command.md +62 -62
  43. package/docs/design-system/components/context-menu.md +46 -46
  44. package/docs/design-system/components/date-picker.md +81 -81
  45. package/docs/design-system/components/divider.md +102 -102
  46. package/docs/design-system/components/empty-state.md +56 -56
  47. package/docs/design-system/components/field.md +70 -70
  48. package/docs/design-system/components/file-upload.md +187 -187
  49. package/docs/design-system/components/hover-card.md +48 -48
  50. package/docs/design-system/components/icons.md +48 -48
  51. package/docs/design-system/components/inline-citations.md +93 -0
  52. package/docs/design-system/components/input-group.md +58 -58
  53. package/docs/design-system/components/input-otp.md +56 -56
  54. package/docs/design-system/components/input.md +114 -60
  55. package/docs/design-system/components/item.md +59 -59
  56. package/docs/design-system/components/kbd.md +51 -49
  57. package/docs/design-system/components/label.md +49 -49
  58. package/docs/design-system/components/menu.md +71 -61
  59. package/docs/design-system/components/menubar.md +47 -47
  60. package/docs/design-system/components/modal.md +105 -105
  61. package/docs/design-system/components/native-select.md +54 -54
  62. package/docs/design-system/components/navigation-menu.md +50 -50
  63. package/docs/design-system/components/onboarding-step-list-item.md +82 -82
  64. package/docs/design-system/components/page-header.md +93 -86
  65. package/docs/design-system/components/pagination.md +57 -57
  66. package/docs/design-system/components/popover.md +60 -60
  67. package/docs/design-system/components/progress-slider.md +50 -50
  68. package/docs/design-system/components/progress.md +76 -76
  69. package/docs/design-system/components/radio-card.md +51 -51
  70. package/docs/design-system/components/radio-group.md +57 -57
  71. package/docs/design-system/components/resizable.md +44 -44
  72. package/docs/design-system/components/rolling-count.md +61 -0
  73. package/docs/design-system/components/scroll-area.md +51 -51
  74. package/docs/design-system/components/segmented-control.md +54 -54
  75. package/docs/design-system/components/select.md +68 -62
  76. package/docs/design-system/components/sheet.md +67 -67
  77. package/docs/design-system/components/shimmer-text.md +67 -0
  78. package/docs/design-system/components/sidebar.md +110 -99
  79. package/docs/design-system/components/skeleton.md +75 -75
  80. package/docs/design-system/components/slideout.md +65 -65
  81. package/docs/design-system/components/slider.md +63 -63
  82. package/docs/design-system/components/social-button.md +50 -50
  83. package/docs/design-system/components/spinner.md +62 -62
  84. package/docs/design-system/components/steps.md +65 -65
  85. package/docs/design-system/components/streaming-text.md +82 -0
  86. package/docs/design-system/components/table.md +419 -414
  87. package/docs/design-system/components/tabs.md +59 -55
  88. package/docs/design-system/components/tag.md +80 -80
  89. package/docs/design-system/components/task-list.md +95 -0
  90. package/docs/design-system/components/textarea.md +50 -50
  91. package/docs/design-system/components/thinking-reasoning.md +72 -0
  92. package/docs/design-system/components/thinking-state.md +67 -0
  93. package/docs/design-system/components/timeline.md +83 -83
  94. package/docs/design-system/components/toast.md +58 -58
  95. package/docs/design-system/components/toggle.md +81 -81
  96. package/docs/design-system/components/toolbar.md +92 -87
  97. package/docs/design-system/components/tooltip.md +94 -92
  98. package/docs/design-system/components/typography.md +18 -18
  99. package/docs/design-system/density-and-elevation.md +65 -65
  100. package/docs/design-system/design-system-test-missing-items.md +368 -368
  101. package/docs/design-system/direction-and-localization.md +23 -23
  102. package/docs/design-system/form-recipes.md +73 -73
  103. package/docs/design-system/gap-promotion-policy.md +21 -21
  104. package/docs/design-system/icons.md +74 -74
  105. package/docs/design-system/installation.md +70 -68
  106. package/docs/design-system/launch-comparison-shadcn.md +98 -98
  107. package/docs/design-system/registry-and-cli.md +64 -64
  108. package/docs/design-system/release-policy.md +30 -30
  109. package/docs/design-system/roadmap.md +14 -14
  110. package/docs/design-system/support-matrix.md +23 -23
  111. package/docs/design-system/tabs.md +54 -53
  112. package/docs/design-system/template-gap-audit.md +32 -0
  113. package/docs/design-system/templates.md +59 -0
  114. package/docs/design-system/token-governance.md +72 -59
  115. package/package.json +98 -98
  116. package/registry/component-contract.json +40 -40
  117. package/registry/components/accordion.tsx +155 -155
  118. package/registry/components/agent-input-parts.tsx +552 -0
  119. package/registry/components/agent-input-state.ts +156 -0
  120. package/registry/components/agent-input.css +307 -0
  121. package/registry/components/agent-input.tsx +382 -0
  122. package/registry/components/alert-dialog.tsx +297 -297
  123. package/registry/components/alert.tsx +293 -293
  124. package/registry/components/approval-card.css +409 -0
  125. package/registry/components/approval-card.tsx +401 -0
  126. package/registry/components/approval-frame.tsx +108 -0
  127. package/registry/components/approval-questions.tsx +559 -0
  128. package/registry/components/aspect-ratio.tsx +30 -30
  129. package/registry/components/attribute.tsx +454 -454
  130. package/registry/components/autocomplete.tsx +598 -651
  131. package/registry/components/avatar.tsx +385 -385
  132. package/registry/components/badge.tsx +629 -629
  133. package/registry/components/button-group.tsx +565 -565
  134. package/registry/components/button.tsx +127 -123
  135. package/registry/components/card.tsx +638 -638
  136. package/registry/components/carousel.tsx +296 -296
  137. package/registry/components/chart-block-data.ts +177 -0
  138. package/registry/components/chart-block.css +171 -0
  139. package/registry/components/chart-block.tsx +260 -0
  140. package/registry/components/chart-interactions.ts +123 -0
  141. package/registry/components/chart-options.cartesian.ts +162 -0
  142. package/registry/components/chart-options.paint.ts +99 -0
  143. package/registry/components/chart-options.parts.ts +72 -0
  144. package/registry/components/chart-options.radial.ts +109 -0
  145. package/registry/components/chart-options.ts +44 -0
  146. package/registry/components/chart-options.types.ts +67 -0
  147. package/registry/components/chart.tsx +203 -203
  148. package/registry/components/checkbox.tsx +247 -247
  149. package/registry/components/collapsible.tsx +109 -69
  150. package/registry/components/command.tsx +208 -208
  151. package/registry/components/context-menu.tsx +236 -236
  152. package/registry/components/data-chart.tsx +40 -0
  153. package/registry/components/date-picker.tsx +1289 -1289
  154. package/registry/components/echart-theme.ts +246 -0
  155. package/registry/components/echart.css +49 -0
  156. package/registry/components/echart.tsx +178 -0
  157. package/registry/components/expanded/ActivityFeed.tsx +227 -227
  158. package/registry/components/expanded/ActivityHeatmap.tsx +64 -64
  159. package/registry/components/expanded/Banner.tsx +179 -179
  160. package/registry/components/expanded/Breadcrumbs.tsx +131 -131
  161. package/registry/components/expanded/CatalogComponentsShowcase.tsx +205 -205
  162. package/registry/components/expanded/CatalogDivider.tsx +49 -49
  163. package/registry/components/expanded/EmptyState.tsx +155 -155
  164. package/registry/components/expanded/FileUpload.tsx +543 -543
  165. package/registry/components/expanded/OnboardingStepListItem.tsx +60 -60
  166. package/registry/components/expanded/PageHeader.tsx +179 -166
  167. package/registry/components/expanded/Slideout.tsx +108 -108
  168. package/registry/components/expanded/Steps.tsx +402 -402
  169. package/registry/components/expanded/Table.tsx +1092 -1071
  170. package/registry/components/expanded/Timeline.tsx +203 -203
  171. package/registry/components/expanded/activityFeed.css +248 -248
  172. package/registry/components/expanded/activityHeatmap.css +66 -66
  173. package/registry/components/expanded/banner.css +260 -260
  174. package/registry/components/expanded/breadcrumbs.css +140 -140
  175. package/registry/components/expanded/catalogComponentsShowcase.css +87 -87
  176. package/registry/components/expanded/divider.css +75 -75
  177. package/registry/components/expanded/emptyState.css +111 -111
  178. package/registry/components/expanded/fileUpload.css +457 -457
  179. package/registry/components/expanded/onboardingStepListItem.css +135 -135
  180. package/registry/components/expanded/pageHeader.css +248 -290
  181. package/registry/components/expanded/slideout.css +276 -276
  182. package/registry/components/expanded/steps.css +356 -356
  183. package/registry/components/expanded/table.css +606 -606
  184. package/registry/components/expanded/timeline.css +286 -286
  185. package/registry/components/field.tsx +283 -283
  186. package/registry/components/hover-card.tsx +48 -48
  187. package/registry/components/inline-citations.css +126 -0
  188. package/registry/components/inline-citations.tsx +292 -0
  189. package/registry/components/input-content.ts +107 -107
  190. package/registry/components/input-group.tsx +130 -130
  191. package/registry/components/input-otp.tsx +584 -584
  192. package/registry/components/input.tsx +990 -979
  193. package/registry/components/item.tsx +189 -189
  194. package/registry/components/kbd.tsx +246 -245
  195. package/registry/components/label.tsx +78 -78
  196. package/registry/components/menu.tsx +978 -986
  197. package/registry/components/menubar.tsx +226 -226
  198. package/registry/components/modal.tsx +872 -872
  199. package/registry/components/native-select.tsx +205 -205
  200. package/registry/components/navigation-menu.tsx +171 -171
  201. package/registry/components/pagination.css +36 -36
  202. package/registry/components/pagination.tsx +560 -560
  203. package/registry/components/popover.tsx +338 -338
  204. package/registry/components/progress-slider.tsx +216 -216
  205. package/registry/components/radio-card.tsx +676 -676
  206. package/registry/components/radio-group.tsx +570 -570
  207. package/registry/components/resizable.tsx +108 -108
  208. package/registry/components/rolling-count.css +37 -0
  209. package/registry/components/rolling-count.tsx +110 -0
  210. package/registry/components/scroll-area.tsx +91 -91
  211. package/registry/components/segmented-control.tsx +87 -87
  212. package/registry/components/select-content.tsx +218 -218
  213. package/registry/components/select.tsx +937 -932
  214. package/registry/components/sheet.tsx +305 -305
  215. package/registry/components/shimmer-text.css +69 -0
  216. package/registry/components/shimmer-text.tsx +43 -0
  217. package/registry/components/sidebar.tsx +1433 -1230
  218. package/registry/components/skeleton.css +54 -54
  219. package/registry/components/skeleton.tsx +482 -482
  220. package/registry/components/slider.tsx +380 -380
  221. package/registry/components/social-button.tsx +387 -387
  222. package/registry/components/spinner.tsx +78 -78
  223. package/registry/components/streaming-text.css +45 -0
  224. package/registry/components/streaming-text.tsx +165 -0
  225. package/registry/components/table-elements.tsx +128 -128
  226. package/registry/components/tabs.css +222 -218
  227. package/registry/components/tabs.tsx +241 -241
  228. package/registry/components/tag.tsx +423 -423
  229. package/registry/components/task-list.css +328 -0
  230. package/registry/components/task-list.tsx +429 -0
  231. package/registry/components/textarea.tsx +610 -610
  232. package/registry/components/thinking-reasoning.css +178 -0
  233. package/registry/components/thinking-reasoning.tsx +253 -0
  234. package/registry/components/thinking-state.css +8 -0
  235. package/registry/components/thinking-state.tsx +46 -0
  236. package/registry/components/toast.tsx +136 -136
  237. package/registry/components/toggle.tsx +256 -256
  238. package/registry/components/toolbar.tsx +539 -539
  239. package/registry/components/tooltip.tsx +433 -431
  240. package/registry/examples/agent-input-demo.tsx +90 -0
  241. package/registry/examples/alert-demo.tsx +34 -34
  242. package/registry/examples/alert-dialog-demo.tsx +42 -42
  243. package/registry/examples/approval-card-demo.tsx +83 -0
  244. package/registry/examples/aspect-ratio-demo.tsx +11 -11
  245. package/registry/examples/attribute-demo.tsx +65 -65
  246. package/registry/examples/autocomplete-demo.tsx +109 -109
  247. package/registry/examples/avatar-demo.tsx +132 -132
  248. package/registry/examples/badge-demo.tsx +69 -69
  249. package/registry/examples/button-demo.tsx +86 -83
  250. package/registry/examples/button-group-demo.tsx +63 -63
  251. package/registry/examples/card-demo.tsx +86 -86
  252. package/registry/examples/carousel-demo.tsx +43 -43
  253. package/registry/examples/chart-block-demo.tsx +5 -0
  254. package/registry/examples/chart-demo.tsx +18 -33
  255. package/registry/examples/checkbox-demo.tsx +62 -62
  256. package/registry/examples/collapsible-demo.tsx +16 -16
  257. package/registry/examples/collection-filter-bar-demo.tsx +135 -135
  258. package/registry/examples/command-demo.tsx +42 -42
  259. package/registry/examples/command-palette-demo.tsx +235 -235
  260. package/registry/examples/context-menu-demo.tsx +29 -29
  261. package/registry/examples/control-density-contract-demo.tsx +65 -61
  262. package/registry/examples/date-picker-demo.tsx +127 -127
  263. package/registry/examples/divider-demo.tsx +17 -17
  264. package/registry/examples/expanded/activity-heatmap-demo.tsx +29 -29
  265. package/registry/examples/expanded/banner-demo.tsx +48 -48
  266. package/registry/examples/expanded/breadcrumbs-demo.tsx +59 -59
  267. package/registry/examples/expanded/empty-state-demo.tsx +39 -39
  268. package/registry/examples/expanded/file-upload-demo.tsx +60 -60
  269. package/registry/examples/expanded/onboarding-step-demo.tsx +11 -11
  270. package/registry/examples/expanded/slideout-demo.tsx +15 -15
  271. package/registry/examples/expanded/steps-demo.tsx +29 -29
  272. package/registry/examples/expanded/tabs-demo.tsx +13 -13
  273. package/registry/examples/expanded/timeline-demo.tsx +18 -18
  274. package/registry/examples/field-demo.tsx +51 -51
  275. package/registry/examples/hover-card-demo.tsx +23 -23
  276. package/registry/examples/inline-citations-demo.tsx +31 -0
  277. package/registry/examples/input-actions-demo.tsx +36 -0
  278. package/registry/examples/input-demo.tsx +87 -87
  279. package/registry/examples/input-group-demo.tsx +16 -16
  280. package/registry/examples/input-otp-demo.tsx +72 -72
  281. package/registry/examples/item-demo.tsx +46 -46
  282. package/registry/examples/kbd-demo.tsx +12 -12
  283. package/registry/examples/label-demo.tsx +20 -20
  284. package/registry/examples/menu-demo.tsx +122 -122
  285. package/registry/examples/menubar-demo.tsx +34 -34
  286. package/registry/examples/modal-demo.tsx +74 -74
  287. package/registry/examples/native-select-demo.tsx +16 -16
  288. package/registry/examples/navigation-menu-demo.tsx +29 -29
  289. package/registry/examples/pagination-demo.tsx +20 -20
  290. package/registry/examples/popover-demo.tsx +547 -546
  291. package/registry/examples/progress-demo.tsx +37 -37
  292. package/registry/examples/progress-slider-demo.tsx +29 -29
  293. package/registry/examples/radio-card-demo.tsx +51 -51
  294. package/registry/examples/radio-group-demo.tsx +62 -62
  295. package/registry/examples/resizable-demo.tsx +22 -22
  296. package/registry/examples/results-toolbar-demo.tsx +44 -44
  297. package/registry/examples/rolling-count-demo.tsx +39 -0
  298. package/registry/examples/scroll-area-demo.tsx +15 -15
  299. package/registry/examples/segmented-control-demo.tsx +39 -39
  300. package/registry/examples/select-demo.tsx +87 -87
  301. package/registry/examples/sheet-demo.tsx +47 -47
  302. package/registry/examples/shimmer-text-demo.tsx +20 -0
  303. package/registry/examples/sidebar-demo.tsx +101 -101
  304. package/registry/examples/slider-demo.tsx +31 -31
  305. package/registry/examples/social-button-demo.tsx +61 -61
  306. package/registry/examples/spinner-demo.tsx +59 -59
  307. package/registry/examples/streaming-text-demo.tsx +28 -0
  308. package/registry/examples/tabs-demo.tsx +13 -13
  309. package/registry/examples/tag-demo.tsx +29 -29
  310. package/registry/examples/task-list-demo.tsx +74 -0
  311. package/registry/examples/textarea-demo.tsx +79 -79
  312. package/registry/examples/thinking-reasoning-demo.tsx +74 -0
  313. package/registry/examples/thinking-state-demo.tsx +13 -0
  314. package/registry/examples/toast-demo.tsx +35 -35
  315. package/registry/examples/toggle-demo.tsx +59 -59
  316. package/registry/examples/tooltip-demo.tsx +115 -115
  317. package/registry/guidance/USAGE.md +27 -27
  318. package/registry/guidance/charts.LICENSE.txt +24 -0
  319. package/registry/hooks/use-controllable-state.ts +33 -0
  320. package/registry/hooks/use-direction.ts +207 -207
  321. package/registry/hooks/use-listbox-navigation.ts +73 -0
  322. package/registry/hooks/use-motion-end.ts +55 -0
  323. package/registry/hooks/use-reduced-motion.ts +28 -0
  324. package/registry/index.json +1403 -155
  325. package/registry/styles/globals.css +946 -1088
  326. package/registry.json +361 -8
  327. package/schema/config.schema.json +51 -51
  328. package/schema/registry.schema.json +194 -190
  329. package/schema/tokens.schema.json +167 -163
  330. package/src/cli/command-line.js +194 -194
  331. package/src/cli/config-editors.js +9 -9
  332. package/src/cli/doctor.js +399 -399
  333. package/src/cli/file-transaction.js +302 -295
  334. package/src/cli/global-css.js +153 -153
  335. package/src/cli/index.js +1002 -1009
  336. package/src/cli/install-plan.js +592 -592
  337. package/src/cli/install-receipt.js +171 -171
  338. package/src/cli/jsonc.js +203 -203
  339. package/src/cli/package-install-state.js +254 -254
  340. package/src/cli/package-manager.js +238 -238
  341. package/src/cli/package-plan.js +185 -185
  342. package/src/cli/package-version.js +97 -97
  343. package/src/cli/registry-query.js +207 -207
  344. package/src/cli/reporting.js +55 -55
  345. package/src/cli/schema-validation.js +19 -19
  346. package/src/cli/source-scanner.js +686 -686
  347. package/src/cli/vite-config.js +478 -478
  348. package/tokens/banhaten.tokens.json +306 -192
@@ -1,252 +1,437 @@
1
1
  /* Banhaten design system tokens: deterministically generated from tokens/banhaten.tokens.json and tokens/banhaten.utilities.css. */
2
2
 
3
3
  :root,
4
- [data-theme="gray"] {
4
+ [data-theme="gray"],
5
+ [data-theme="blue"],
6
+ [data-theme="brown"],
7
+ [data-theme="orange"],
8
+ [data-theme="green"],
9
+ [data-theme="purple"],
10
+ [data-theme="teal"],
11
+ .dark,
12
+ .dark[data-theme="blue"],
13
+ .dark [data-theme="blue"],
14
+ .dark[data-theme="gray"],
15
+ .dark [data-theme="gray"],
16
+ .dark[data-theme="brown"],
17
+ .dark [data-theme="brown"],
18
+ .dark[data-theme="orange"],
19
+ .dark [data-theme="orange"],
20
+ .dark[data-theme="green"],
21
+ .dark [data-theme="green"],
22
+ .dark[data-theme="purple"],
23
+ .dark [data-theme="purple"],
24
+ .dark[data-theme="teal"],
25
+ .dark [data-theme="teal"] {
5
26
  --accent: var(--bh-interactive-ghost-hover);
6
27
  --accent-foreground: var(--bh-content-default);
7
28
  --accent-hover: var(--bh-interactive-ghost-pressed);
8
29
  --background: var(--bh-bg-default);
9
- --bh-activity-feed-compact-width: 600px;
10
- --bh-activity-feed-completed-brightness: 0.99;
11
- --bh-alert-compact-height: calc(var(--bh-space-8xl-48) + var(--bh-space-md-8));
12
- --bh-alert-compact-padding: var(--bh-space-3xl-16);
13
- --bh-alert-compact-radius: var(--bh-radius-lg-8);
14
- --bh-alert-compact-width: 470px;
15
- --bh-alert-expanded-height: calc(var(--bh-space-12xl-128) + var(--bh-space-3xl-16));
16
- --bh-alert-expanded-padding-x: var(--bh-space-3xl-16);
17
- --bh-alert-expanded-padding-y: var(--bh-space-4xl-20);
18
- --bh-alert-expanded-radius: var(--bh-radius-xl-10);
19
- --bh-alert-expanded-rtl-height: calc(var(--bh-space-11xl-96) + var(--bh-space-5xl-24));
20
- --bh-alert-expanded-width: 500px;
21
- --bh-alert-icon-size: var(--bh-icon-size-default);
22
- --bh-alert-icon-slot-size: var(--bh-icon-slot-size-default);
23
- --bh-alpha-alpha-transparent: rgb(255 255 255 / 0);
24
- --bh-alpha-alpha-transparent-to-100: rgb(255 255 255 / 0);
25
- --bh-alpha-alpha-transparent-to-500: rgb(255 255 255 / 0);
26
- --bh-amber-100: #FFE7BE;
27
30
  --bh-amber-300: #FFC369;
28
- --bh-amber-50: #FFF2DB;
29
31
  --bh-amber-500: #EE7300;
30
32
  --bh-amber-600: #CD6103;
31
- --bh-amber-700: #AC4C03;
32
33
  --bh-amber-800: #863E07;
33
34
  --bh-amber-900: #652C07;
34
- --bh-aqua-100: #BBFAEA;
35
- --bh-aqua-200: #87F0D5;
36
- --bh-aqua-50: #DBFFF6;
37
35
  --bh-aqua-500: #03A980;
38
- --bh-aqua-600: #03906E;
39
- --bh-aqua-700: #076F57;
40
- --bh-attribute-header-icon-size: var(--bh-space-6xl-32);
41
- --bh-attribute-header-icon-size-lg: var(--bh-space-8xl-48);
42
- --bh-attribute-label-width: 220px;
43
- --bh-avatar-action-icon-size-2xl: var(--bh-space-2xl-14);
44
- --bh-avatar-action-icon-size-3xl: 18px;
45
- --bh-avatar-action-icon-size-4xl: 22px;
46
- --bh-avatar-action-icon-size-large: var(--bh-space-lg-10);
47
- --bh-avatar-action-icon-size-medium: 9px;
48
- --bh-avatar-action-icon-size-small: var(--bh-space-md-8);
49
- --bh-avatar-action-icon-size-tiny: var(--bh-space-sm-6);
50
- --bh-avatar-action-icon-size-xlarge: var(--bh-space-xl-12);
51
- --bh-avatar-action-icon-size-xsmall: 7px;
52
- --bh-avatar-action-size-2xl: var(--bh-space-5xl-24);
53
- --bh-avatar-action-size-3xl: var(--bh-space-6xl-32);
54
- --bh-avatar-action-size-4xl: var(--bh-space-7xl-40);
55
- --bh-avatar-action-size-large: 18px;
56
- --bh-avatar-action-size-medium: var(--bh-space-3xl-16);
57
- --bh-avatar-action-size-small: var(--bh-space-2xl-14);
58
- --bh-avatar-action-size-tiny: var(--bh-space-lg-10);
59
- --bh-avatar-action-size-xlarge: var(--bh-space-4xl-20);
60
- --bh-avatar-action-size-xsmall: var(--bh-space-xl-12);
61
- --bh-avatar-fallback-font-size-2xl: var(--bh-text-body-sm-semibold-font-size);
62
- --bh-avatar-fallback-font-size-2xs: 9px;
63
- --bh-avatar-fallback-font-size-3xl: var(--bh-text-body-md-semibold-font-size);
64
- --bh-avatar-fallback-font-size-4xl: var(--bh-text-body-md-semibold-font-size);
65
- --bh-avatar-fallback-font-size-lg: var(--bh-text-body-sm-semibold-font-size);
66
- --bh-avatar-fallback-font-size-md: var(--bh-text-body-2xs-semibold-font-size);
67
- --bh-avatar-fallback-font-size-sm: var(--bh-text-body-2xs-semibold-font-size);
68
- --bh-avatar-fallback-font-size-xl: var(--bh-text-body-sm-semibold-font-size);
69
- --bh-avatar-fallback-font-size-xs: var(--bh-space-lg-10);
70
- --bh-avatar-icon-size-2xl: var(--bh-radius-6xl-28);
71
- --bh-avatar-icon-size-2xs: var(--bh-space-lg-10);
72
- --bh-avatar-icon-size-3xl: var(--bh-space-6xl-32);
73
- --bh-avatar-icon-size-4xl: 36px;
74
- --bh-avatar-icon-size-lg: var(--bh-icon-size-default);
75
- --bh-avatar-icon-size-md: var(--bh-icon-size-default);
76
- --bh-avatar-icon-size-sm: var(--bh-space-3xl-16);
77
- --bh-avatar-icon-size-xl: var(--bh-space-5xl-24);
78
- --bh-avatar-icon-size-xs: var(--bh-space-xl-12);
79
- --bh-avatar-size-2xl: var(--bh-space-8xl-48);
80
- --bh-avatar-size-2xs: var(--bh-space-3xl-16);
81
- --bh-avatar-size-3xl: 56px;
82
- --bh-avatar-size-4xl: var(--bh-space-9xl-64);
83
- --bh-avatar-size-lg: 36px;
84
- --bh-avatar-size-md: var(--bh-space-6xl-32);
85
- --bh-avatar-size-sm: var(--bh-space-5xl-24);
86
- --bh-avatar-size-xl: var(--bh-space-7xl-40);
87
- --bh-avatar-size-xs: var(--bh-space-4xl-20);
88
- --bh-avatar-status-ring-default: var(--bh-space-xxs-2);
89
- --bh-avatar-status-ring-thin: var(--bh-space-xxxs-1);
90
- --bh-avatar-status-size-large: var(--bh-space-3xl-16);
91
- --bh-avatar-status-size-medium: var(--bh-space-2xl-14);
92
- --bh-avatar-status-size-small: var(--bh-space-lg-10);
93
- --bh-avatar-status-size-tiny: var(--bh-space-sm-6);
94
- --bh-avatar-status-size-xlarge: var(--bh-space-4xl-20);
95
- --bh-avatar-status-size-xsmall: var(--bh-space-md-8);
96
- --bh-badge-focus-ring-width: var(--bh-space-xs-4);
97
- --bh-badge-outline-border-width: calc(var(--bh-border-width-default) + (var(--bh-border-width-default) / 2));
98
36
  --bh-base-white: #FFFFFF;
99
- --bh-bg-accent-amber-default: var(--bh-amber-500);
100
- --bh-bg-accent-amber-soft: var(--bh-amber-100);
101
- --bh-bg-accent-amber-subtle: var(--bh-amber-50);
102
37
  --bh-bg-accent-aqua-default: var(--bh-aqua-500);
103
- --bh-bg-accent-aqua-soft: var(--bh-aqua-100);
104
- --bh-bg-accent-aqua-subtle: var(--bh-aqua-50);
105
38
  --bh-bg-accent-blue-bold: var(--bh-blue-600);
106
39
  --bh-bg-accent-blue-default: var(--bh-blue-500);
107
- --bh-bg-accent-blue-soft: var(--bh-blue-100);
108
- --bh-bg-accent-blue-subtle: var(--bh-blue-50);
109
40
  --bh-bg-accent-fuchsia-default: var(--bh-fuchsia-500);
110
- --bh-bg-accent-fuchsia-soft: var(--bh-fuchsia-100);
111
- --bh-bg-accent-fuchsia-subtle: var(--bh-fuchsia-50);
112
- --bh-bg-accent-golden-bold: var(--bh-golden-600);
113
- --bh-bg-accent-golden-default: var(--bh-golden-400);
114
- --bh-bg-accent-golden-soft: var(--bh-golden-100);
115
- --bh-bg-accent-golden-subtle: var(--bh-golden-50);
116
41
  --bh-bg-accent-green-default: var(--bh-green-500);
117
- --bh-bg-accent-green-soft: var(--bh-green-100);
118
- --bh-bg-accent-green-subtle: var(--bh-green-50);
119
42
  --bh-bg-accent-lime-default: var(--bh-lime-500);
120
- --bh-bg-accent-lime-soft: var(--bh-lime-100);
121
- --bh-bg-accent-lime-subtle: var(--bh-lime-50);
122
43
  --bh-bg-accent-purple-default: var(--bh-purple-500);
123
- --bh-bg-accent-purple-soft: var(--bh-purple-100);
124
- --bh-bg-accent-purple-subtle: var(--bh-purple-50);
125
- --bh-bg-accent-red-default: var(--bh-red-500);
126
- --bh-bg-accent-red-soft: var(--bh-red-100);
127
- --bh-bg-accent-red-subtle: var(--bh-red-50);
128
44
  --bh-bg-accent-rose-bold: var(--bh-rose-600);
129
45
  --bh-bg-accent-rose-default: var(--bh-rose-500);
130
- --bh-bg-accent-rose-soft: var(--bh-rose-100);
131
- --bh-bg-accent-rose-subtle: var(--bh-rose-50);
132
46
  --bh-bg-accent-sky-base: var(--bh-sky-500);
133
- --bh-bg-accent-sky-soft: var(--bh-sky-100);
134
- --bh-bg-accent-sky-subtle: var(--bh-sky-50);
135
- --bh-bg-always-dark: var(--bh-colors-neutral-900);
136
47
  --bh-bg-always-white: var(--bh-base-white);
137
48
  --bh-bg-backdrop: rgb(0 0 0 / 0.5);
138
- --bh-bg-brand-bold: var(--bh-colors-brand-surface-bold-light);
139
- --bh-bg-brand-default: var(--bh-colors-brand-surface-base);
140
- --bh-bg-brand-soft: var(--bh-colors-brand-surface-soft-light);
141
- --bh-bg-brand-strong: var(--bh-colors-brand-surface-strong-light);
142
- --bh-bg-brand-subtle: var(--bh-colors-brand-surface-subtle-light);
143
- --bh-bg-danger-default: var(--bh-red-500);
144
- --bh-bg-danger-soft: var(--bh-red-100);
145
- --bh-bg-danger-subtle: var(--bh-red-50);
146
- --bh-bg-default: var(--bh-base-white);
147
- --bh-bg-default-hover: var(--bh-colors-neutral-50);
148
- --bh-bg-dim: var(--bh-colors-neutral-200);
149
- --bh-bg-dim-hover: var(--bh-colors-neutral-300);
150
- --bh-bg-disabled: var(--bh-colors-neutral-50);
151
- --bh-bg-divider: var(--bh-colors-neutral-alpha-300);
152
- --bh-bg-grouped: var(--bh-colors-neutral-100);
153
- --bh-bg-grouped-surface: var(--bh-base-white);
154
- --bh-bg-info-bold: var(--bh-blue-600);
155
- --bh-bg-info-default: var(--bh-blue-500);
156
- --bh-bg-info-soft: var(--bh-blue-100);
157
- --bh-bg-info-strong: var(--bh-blue-700);
158
- --bh-bg-info-subtle: var(--bh-blue-50);
159
- --bh-bg-inverse: var(--bh-colors-neutral-950);
160
- --bh-bg-muted: var(--bh-colors-neutral-100);
161
- --bh-bg-muted-hover: var(--bh-colors-neutral-200);
162
- --bh-bg-neutral-bold: var(--bh-colors-neutral-800);
163
- --bh-bg-neutral-default: var(--bh-colors-neutral-700);
164
- --bh-bg-neutral-medium: var(--bh-colors-neutral-500);
165
- --bh-bg-neutral-soft: var(--bh-colors-neutral-alpha-200);
166
- --bh-bg-neutral-subtle: var(--bh-colors-neutral-alpha-100);
167
- --bh-bg-raised: var(--bh-base-white);
168
- --bh-bg-raised-hover: var(--bh-colors-neutral-50);
169
- --bh-bg-raised-subtle: var(--bh-colors-neutral-50);
170
- --bh-bg-subtle: var(--bh-colors-neutral-50);
171
- --bh-bg-subtle-alpha: var(--bh-colors-neutral-50);
172
- --bh-bg-subtle-hover: var(--bh-colors-neutral-100);
173
- --bh-bg-success-bold: var(--bh-green-600);
174
- --bh-bg-success-default: var(--bh-green-500);
175
- --bh-bg-success-soft: var(--bh-green-100);
176
- --bh-bg-success-strong: var(--bh-green-700);
177
- --bh-bg-success-subtle: var(--bh-green-50);
178
- --bh-bg-warning-bold: var(--bh-amber-600);
179
- --bh-bg-warning-default: var(--bh-amber-500);
180
- --bh-bg-warning-soft: var(--bh-amber-100);
181
- --bh-bg-warning-strong: var(--bh-amber-700);
182
- --bh-bg-warning-subtle: var(--bh-amber-50);
183
- --bh-blue-100: #D6EAFF;
184
49
  --bh-blue-200: #BBDAFF;
185
- --bh-blue-50: #EBF5FF;
186
50
  --bh-blue-500: #3276FF;
187
51
  --bh-blue-600: #245DED;
188
- --bh-blue-700: #1D49BF;
189
52
  --bh-blue-900: #0A1B63;
190
53
  --bh-border-accent-amber-strong: var(--bh-amber-500);
191
- --bh-border-accent-amber-subtle: var(--bh-amber-300);
192
54
  --bh-border-accent-aqua-strong: var(--bh-aqua-500);
193
- --bh-border-accent-aqua-subtle: var(--bh-aqua-200);
194
55
  --bh-border-accent-blue-strong: var(--bh-blue-500);
195
- --bh-border-accent-blue-subtle: var(--bh-blue-200);
196
56
  --bh-border-accent-fuchsia-strong: var(--bh-fuchsia-500);
197
- --bh-border-accent-fuchsia-subtle: var(--bh-fuchsia-200);
198
- --bh-border-accent-golden-strong: var(--bh-golden-600);
199
- --bh-border-accent-golden-subtle: var(--bh-golden-300);
200
57
  --bh-border-accent-green-strong: var(--bh-green-500);
201
- --bh-border-accent-green-subtle: var(--bh-green-200);
202
- --bh-border-accent-lime-strong: var(--bh-lime-600);
203
- --bh-border-accent-lime-subtle: var(--bh-lime-200);
204
58
  --bh-border-accent-purple-strong: var(--bh-purple-500);
205
- --bh-border-accent-purple-subtle: var(--bh-purple-200);
206
59
  --bh-border-accent-red-strong: var(--bh-red-500);
207
- --bh-border-accent-red-subtle: var(--bh-red-200);
208
60
  --bh-border-accent-rose-strong: var(--bh-rose-500);
209
- --bh-border-accent-rose-subtle: var(--bh-rose-200);
210
61
  --bh-border-accent-sky-strong: var(--bh-sky-500);
211
- --bh-border-accent-sky-subtle: var(--bh-sky-200);
212
- --bh-border-brand-strong: var(--bh-colors-brand-border-border-strong);
213
- --bh-border-brand-subtle: var(--bh-colors-brand-border-border-subtle);
214
62
  --bh-border-danger-strong: var(--bh-red-500);
215
- --bh-border-danger-subtle: var(--bh-red-300);
216
- --bh-border-default: var(--bh-colors-neutral-alpha-400);
217
- --bh-border-disabled: var(--bh-colors-neutral-alpha-200);
218
- --bh-border-focus: var(--bh-colors-brand-focused-light);
219
- --bh-border-focus-danger: var(--bh-red-400);
220
63
  --bh-border-info-strong: var(--bh-blue-500);
221
- --bh-border-info-subtle: var(--bh-blue-200);
222
- --bh-border-input: var(--bh-colors-neutral-alpha-400);
223
- --bh-border-inverse: var(--bh-base-white);
224
- --bh-border-inverse-subtle: rgb(255 255 255 / 0.15);
225
- --bh-border-strong: var(--bh-colors-neutral-800);
226
- --bh-border-subtle: var(--bh-colors-neutral-alpha-300);
227
64
  --bh-border-success-strong: var(--bh-green-500);
228
- --bh-border-success-subtle: var(--bh-green-200);
229
65
  --bh-border-warning-strong: var(--bh-amber-500);
230
- --bh-border-warning-subtle: var(--bh-amber-300);
66
+ --bh-button-group-bg: var(--bh-bg-subtle);
67
+ --bh-button-group-border: var(--bh-border-default);
68
+ --bh-button-group-content: var(--bh-button-group-content-default);
69
+ --bh-button-group-content-active: var(--bh-content-default);
70
+ --bh-button-group-content-default: var(--bh-content-subtle);
71
+ --bh-button-group-content-disabled: var(--bh-content-disabled);
72
+ --bh-button-group-divider: var(--bh-border-subtle);
73
+ --bh-button-group-item-active-bg: var(--bh-interactive-ghost-active);
74
+ --bh-button-group-item-bg: var(--bh-interactive-ghost-default);
75
+ --bh-button-group-item-disabled-bg: var(--bh-interactive-ghost-disabled);
76
+ --bh-button-group-item-hover: var(--bh-button-group-item-hover-bg);
77
+ --bh-button-group-item-hover-bg: var(--bh-interactive-ghost-hover);
78
+ --bh-button-group-item-pressed-bg: var(--bh-interactive-ghost-pressed);
79
+ --bh-card-media-overlay: color-mix(in srgb, var(--bh-bg-always-dark) 80%, transparent);
80
+ --bh-chart-1: var(--bh-chart-categorical-brand);
81
+ --bh-chart-2: var(--bh-chart-categorical-success);
82
+ --bh-chart-3: var(--bh-chart-categorical-warning);
83
+ --bh-chart-4: var(--bh-chart-categorical-danger);
84
+ --bh-chart-5: var(--bh-chart-categorical-information);
85
+ --bh-chart-brand-default: var(--bh-colors-brand-surface-base);
86
+ --bh-chart-categorical-1: var(--bh-sky-600);
87
+ --bh-chart-categorical-6: var(--bh-purple-500);
88
+ --bh-chart-categorical-aqua: var(--bh-content-accent-aqua-default);
89
+ --bh-chart-categorical-brand: var(--bh-content-brand-default);
90
+ --bh-chart-categorical-danger: var(--bh-content-danger-default);
91
+ --bh-chart-categorical-fuchsia: var(--bh-content-accent-fuchsia-default);
92
+ --bh-chart-categorical-information: var(--bh-content-information-default);
93
+ --bh-chart-categorical-purple: var(--bh-content-accent-purple-default);
94
+ --bh-chart-categorical-success: var(--bh-content-success-default);
95
+ --bh-chart-categorical-warning: var(--bh-content-warning-default);
96
+ --bh-content-on-color: var(--bh-base-white);
97
+ --bh-fuchsia-500: #E703EB;
98
+ --bh-golden-400: #F7C407;
99
+ --bh-golden-800: #7E4F03;
100
+ --bh-green-500: #0BAE45;
101
+ --bh-green-600: #039536;
102
+ --bh-green-800: #075622;
103
+ --bh-green-900: #043F18;
104
+ --bh-icon-explorer-topbar-bg: color-mix(in srgb, var(--bh-bg-grouped) 92%, transparent);
105
+ --bh-interactive-switch-active: var(--bh-green-500);
106
+ --bh-interactive-switch-active-hover: var(--bh-green-600);
107
+ --bh-interactive-switch-handle: var(--bh-base-white);
108
+ --bh-lime-500: #8EB903;
109
+ --bh-menu-bg: var(--bh-bg-raised);
110
+ --bh-menu-border: var(--bh-border-subtle);
111
+ --bh-menu-item-bg: var(--bh-interactive-ghost-default);
112
+ --bh-menu-item-hover-bg: var(--bh-interactive-ghost-hover);
113
+ --bh-pagination-action-gap: var(--bh-space-md-8);
114
+ --bh-pagination-active-bg: var(--bh-interactive-brand-default);
115
+ --bh-pagination-active-border: var(--bh-border-subtle);
116
+ --bh-pagination-active-content: var(--bh-content-on-brand);
117
+ --bh-pagination-caption-content: var(--bh-content-subtle);
118
+ --bh-pagination-caption-font-weight: var(--bh-text-body-md-regular-font-weight);
119
+ --bh-pagination-caption-width: 254px;
120
+ --bh-pagination-control-content: var(--bh-content-default);
121
+ --bh-pagination-control-gap: var(--bh-space-lg-10);
122
+ --bh-pagination-control-ghost-bg: var(--bh-interactive-ghost-default);
123
+ --bh-pagination-control-ghost-hover: var(--bh-interactive-ghost-hover);
124
+ --bh-pagination-control-ghost-pressed: var(--bh-interactive-ghost-pressed);
125
+ --bh-pagination-control-label-padding-x: var(--bh-space-xxs-2);
126
+ --bh-pagination-control-label-rtl-padding-x: var(--bh-space-xs-4);
127
+ --bh-pagination-control-soft-bg: var(--bh-interactive-soft-default);
128
+ --bh-pagination-control-soft-hover: var(--bh-interactive-soft-hover);
129
+ --bh-pagination-control-soft-pressed: var(--bh-interactive-soft-pressed);
130
+ --bh-pagination-control-text-gap: var(--bh-space-xs-4);
131
+ --bh-pagination-control-text-padding-x: var(--bh-space-md-8);
132
+ --bh-pagination-control-text-rtl-gap: var(--bh-space-xxs-2);
133
+ --bh-pagination-control-text-rtl-padding-x: var(--bh-space-sm-6);
134
+ --bh-pagination-font-size: var(--bh-text-body-md-medium-font-size);
135
+ --bh-pagination-icon-size: var(--bh-icon-size-default);
136
+ --bh-pagination-icon-slot-size: var(--bh-icon-slot-size-default);
137
+ --bh-pagination-item-size: var(--bh-space-6xl-32);
138
+ --bh-pagination-label-font-weight: var(--bh-text-body-md-medium-font-weight);
139
+ --bh-pagination-letter-spacing: var(--bh-text-body-md-medium-letter-spacing);
140
+ --bh-pagination-line-height: var(--bh-text-body-md-medium-line-height);
141
+ --bh-pagination-numeric-width: 560px;
142
+ --bh-pagination-page-bg: var(--bh-interactive-ghost-default);
143
+ --bh-pagination-page-content: var(--bh-content-subtle);
144
+ --bh-pagination-page-gap: var(--bh-space-xs-4);
145
+ --bh-pagination-page-hover: var(--bh-interactive-ghost-hover);
146
+ --bh-pagination-page-pressed: var(--bh-interactive-ghost-pressed);
147
+ --bh-pagination-radius: var(--bh-control-default);
148
+ --bh-pagination-root-gap: var(--bh-space-3xl-16);
149
+ --bh-pagination-simple-width: 458px;
150
+ --bh-popover-bg: var(--bh-bg-raised);
151
+ --bh-popover-border: var(--bh-border-subtle);
152
+ --bh-progress-slider-tick-bg: color-mix(in srgb, var(--bh-progress-slider-grip-bg, var(--bh-border-brand-strong)) 34%, transparent);
153
+ --bh-purple-500: #A135FA;
154
+ --bh-red-300: #FF96A1;
155
+ --bh-red-400: #FC5666;
156
+ --bh-red-500: #E8172C;
157
+ --bh-red-600: #CA1224;
158
+ --bh-red-700: #A60C1B;
159
+ --bh-rose-200: #FFB9D7;
160
+ --bh-rose-500: #F01071;
161
+ --bh-rose-600: #D10A60;
162
+ --bh-select-avatar-font-size: var(--bh-space-lg-10);
163
+ --bh-select-check-color: var(--bh-interactive-indicator-default);
164
+ --bh-select-checkbox-icon-size: var(--bh-space-xl-12);
165
+ --bh-select-checkbox-radius: var(--bh-radius-sm-4);
166
+ --bh-select-checkbox-size: var(--bh-space-3xl-16);
167
+ --bh-select-company-icon-size: 18px;
168
+ --bh-select-content-gap: var(--bh-space-xxs-2);
169
+ --bh-select-field-gap: var(--bh-space-sm-6);
170
+ --bh-select-icon-size: var(--bh-space-3xl-16);
171
+ --bh-select-icon-slot-size: var(--bh-space-4xl-20);
172
+ --bh-select-item-check-offset: var(--bh-space-3xl-16);
173
+ --bh-select-item-content-padding: var(--bh-space-sm-6);
174
+ --bh-select-item-gap: var(--bh-space-xs-4);
175
+ --bh-select-item-hover-bg: var(--bh-interactive-ghost-hover);
176
+ --bh-select-item-min-height: var(--bh-space-6xl-32);
177
+ --bh-select-item-padding-x: var(--bh-space-sm-6);
178
+ --bh-select-item-radius: var(--bh-radius-md-6);
179
+ --bh-select-item-selected-padding-end: var(--bh-space-6xl-32);
180
+ --bh-select-item-value-padding-x: var(--bh-space-xs-4);
181
+ --bh-select-label-gap: var(--bh-space-xs-4);
182
+ --bh-select-media-inset: var(--bh-space-xxs-2);
183
+ --bh-select-menu-bg: var(--bh-bg-raised);
184
+ --bh-select-menu-border: var(--bh-border-subtle);
185
+ --bh-select-menu-list-gap: var(--bh-space-xxs-2);
186
+ --bh-select-menu-offset: var(--bh-space-xs-4);
187
+ --bh-select-menu-padding-y: var(--bh-space-sm-6);
188
+ --bh-select-menu-radius: var(--bh-radius-xl-10);
189
+ --bh-select-menu-width: var(--bh-select-width);
190
+ --bh-select-payment-height: var(--bh-space-4xl-20);
191
+ --bh-select-payment-mark-offset: 7px;
192
+ --bh-select-payment-mark-size: 9px;
193
+ --bh-select-payment-radius: var(--bh-radius-sm-4);
194
+ --bh-select-payment-width: 28.333px;
195
+ --bh-select-status-dot-size: var(--bh-space-md-8);
196
+ --bh-select-trigger-bg: var(--bh-interactive-input-default);
197
+ --bh-select-trigger-bg-disabled: var(--bh-interactive-input-disabled);
198
+ --bh-select-trigger-bg-soft: var(--bh-interactive-input-soft);
199
+ --bh-select-trigger-border: var(--bh-border-input);
200
+ --bh-select-trigger-border-disabled: var(--bh-border-disabled);
201
+ --bh-select-trigger-border-error: var(--bh-border-danger-strong);
202
+ --bh-select-trigger-border-focus: var(--bh-border-focus);
203
+ --bh-select-trigger-gap: var(--bh-space-sm-6);
204
+ --bh-select-trigger-icon-color: var(--bh-content-muted);
205
+ --bh-select-trigger-padding-x: var(--bh-space-md-8);
206
+ --bh-select-trigger-padding-y-comfortable: var(--bh-space-md-8);
207
+ --bh-select-trigger-padding-y-lg: var(--bh-space-sm-6);
208
+ --bh-select-trigger-padding-y-md: var(--bh-space-xs-4);
209
+ --bh-select-trigger-radius: var(--bh-radius-lg-8);
210
+ --bh-select-value-padding-inline: var(--bh-space-xs-4);
211
+ --bh-select-width: var(--bh-space-18xl-320);
212
+ --bh-sidebar-bg: var(--bh-bg-default);
213
+ --bh-sidebar-bg-collapsed: var(--bh-bg-default);
214
+ --bh-sidebar-border: var(--bh-border-subtle);
215
+ --bh-sidebar-item-bg-active: var(--bh-interactive-soft-default);
216
+ --bh-sidebar-item-bg-hover: var(--bh-interactive-ghost-hover);
217
+ --bh-sidebar-item-content: var(--bh-content-subtle);
218
+ --bh-sidebar-item-content-active: var(--bh-content-default);
219
+ --bh-sky-500: #059FE5;
220
+ --bh-sky-600: #0C85C3;
221
+ --bh-slider-pill-track-bg: color-mix(in srgb, var(--bh-slider-range-bg, var(--bh-interactive-indicator-default)) 12%, var(--bh-bg-default));
222
+ --bh-slider-tick-bg: color-mix(in srgb, var(--bh-slider-range-bg, var(--bh-interactive-indicator-default)) 45%, transparent);
223
+ --bh-social-apple-bg: var(--bh-bg-always-dark);
224
+ --bh-social-apple-border: var(--bh-border-subtle);
225
+ --bh-social-apple-fg: var(--bh-content-on-color);
226
+ --bh-social-apple-hover: color-mix(in srgb, var(--bh-bg-always-dark) 88%, var(--bh-bg-always-white));
227
+ --bh-social-apple-icon: var(--bh-content-on-color);
228
+ --bh-social-apple-icon-border: var(--bh-border-subtle);
229
+ --bh-social-apple-outline-icon: var(--bh-bg-always-dark);
230
+ --bh-social-facebook-fg: var(--bh-content-on-color);
231
+ --bh-social-facebook-icon: var(--bh-content-on-color);
232
+ --bh-social-google-bg: var(--bh-bg-always-dark);
233
+ --bh-social-google-border: var(--bh-border-subtle);
234
+ --bh-social-google-fg: var(--bh-content-on-color);
235
+ --bh-social-google-hover: color-mix(in srgb, var(--bh-bg-always-dark) 88%, var(--bh-bg-always-white));
236
+ --bh-social-linkedin-fg: var(--bh-content-on-color);
237
+ --bh-social-linkedin-icon: var(--bh-content-on-color);
238
+ --bh-social-twitter-bg: var(--bh-bg-always-dark);
239
+ --bh-social-twitter-border: var(--bh-border-subtle);
240
+ --bh-social-twitter-fg: var(--bh-content-on-color);
241
+ --bh-social-twitter-hover: color-mix(in srgb, var(--bh-bg-always-dark) 88%, var(--bh-bg-always-white));
242
+ --bh-social-twitter-icon: var(--bh-content-on-color);
243
+ --bh-social-twitter-icon-border: var(--bh-border-subtle);
244
+ --bh-social-twitter-outline-icon: var(--bh-bg-always-dark);
245
+ --bh-social-whatsapp-fg: var(--bh-content-on-color);
246
+ --bh-social-whatsapp-icon: var(--bh-content-on-color);
247
+ --border: var(--bh-border-default);
248
+ --card: var(--bh-bg-raised);
249
+ --card-foreground: var(--bh-content-default);
250
+ --danger-ring: var(--bh-border-focus-danger);
251
+ --destructive: var(--bh-interactive-danger-default);
252
+ --destructive-foreground: var(--bh-content-on-color);
253
+ --destructive-hover: var(--bh-interactive-danger-hover);
254
+ --destructive-pressed: var(--bh-interactive-danger-pressed);
255
+ --destructive-soft: var(--bh-interactive-danger-soft-default);
256
+ --destructive-soft-foreground: var(--bh-content-danger-default);
257
+ --destructive-soft-hover: var(--bh-interactive-danger-soft-hover);
258
+ --destructive-soft-pressed: var(--bh-interactive-danger-soft-pressed);
259
+ --elevation-accordion-item: none;
260
+ --elevation-avatar-badge: none;
261
+ --elevation-badge: none;
262
+ --elevation-button: var(--elevation-button-raised);
263
+ --elevation-button-active: var(--elevation-button-raised);
264
+ --elevation-button-danger-focus: var(--elevation-component-danger-focus-ring);
265
+ --elevation-button-focus: var(--elevation-component-focus-ring);
266
+ --elevation-button-group: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-group-border), var(--elevation-component-default);
267
+ --elevation-button-group-focus: var(--elevation-button-group), var(--elevation-component-focus-ring);
268
+ --elevation-button-group-focus-ring: var(--elevation-component-focus-ring);
269
+ --elevation-button-hover: var(--elevation-button-raised);
270
+ --elevation-button-raised: var(--elevation-component-raised);
271
+ --elevation-button-secondary: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-secondary-border, var(--bh-border-default)), var(--elevation-button-surface);
272
+ --elevation-button-secondary-focus: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-secondary-focus-border, var(--bh-border-brand-strong)), var(--elevation-button-surface), var(--elevation-button-focus);
273
+ --elevation-button-soft: inset 0px 1px 0px 0px rgb(255 255 255 / 0);
274
+ --elevation-button-surface: var(--elevation-component-surface);
275
+ --elevation-checkbox: var(--elevation-checkbox-control);
276
+ --elevation-checkbox-card: inset 0px 0px 0px var(--bh-checkbox-card-border-width, var(--bh-border-width-default)) var(--bh-checkbox-card-border, var(--bh-border-subtle)), var(--elevation-component-default);
277
+ --elevation-checkbox-card-focus: var(--elevation-checkbox-card), var(--elevation-button-focus);
278
+ --elevation-checkbox-control: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-checkbox-control-border, var(--bh-border-input)), var(--elevation-component-default);
279
+ --elevation-checkbox-focus: var(--elevation-checkbox), var(--elevation-button-focus);
280
+ --elevation-component-danger-focus-ring: 0px 0px 0px var(--bh-focus-ring-width) var(--bh-border-focus-danger);
281
+ --elevation-component-danger-focus-stroke: 0px 0px 0px var(--bh-border-width-default) var(--bh-bg-default), 0px 0px 0px calc(var(--bh-border-width-default) + var(--bh-focus-ring-width)) var(--bh-border-focus-danger);
282
+ --elevation-component-focus-ring: 0px 0px 0px var(--bh-focus-ring-width) var(--bh-border-focus);
283
+ --elevation-component-focus-stroke: 0px 0px 0px var(--bh-border-width-default) var(--bh-bg-default), 0px 0px 0px calc(var(--bh-border-width-default) + var(--bh-focus-ring-width)) var(--bh-border-focus);
284
+ --elevation-date-month-year-list: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-subtle);
285
+ --elevation-date-surface: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-date-surface-border, var(--bh-border-subtle)), var(--elevation-04);
286
+ --elevation-date-time-input: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-input);
287
+ --elevation-input: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-input-border, var(--bh-border-input)), var(--elevation-component-default);
288
+ --elevation-input-focus-ring: var(--elevation-component-focus-stroke);
289
+ --elevation-menu: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-menu-border), var(--elevation-04);
290
+ --elevation-pagination-active: var(--elevation-button-raised);
291
+ --elevation-pagination-control: var(--elevation-button-soft);
292
+ --elevation-pagination-focus: var(--elevation-button-focus);
293
+ --elevation-popover: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-popover-border), var(--elevation-04);
294
+ --elevation-progress-slider-thumb-focus: var(--elevation-component-focus-ring);
295
+ --elevation-radio-card: inset 0px 0px 0px var(--bh-radio-card-border-width, var(--bh-border-width-default)) var(--bh-radio-card-border, var(--bh-border-default)), var(--elevation-radio-card-surface);
296
+ --elevation-radio-card-disabled: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-disabled);
297
+ --elevation-radio-card-surface: var(--elevation-component-default);
298
+ --elevation-radio-control: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-radio-control-border, var(--bh-border-input)), var(--elevation-component-default);
299
+ --elevation-select-checkbox: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-checkbox-border, var(--bh-border-input)), var(--elevation-component-default);
300
+ --elevation-select-danger-focus-ring: var(--elevation-component-danger-focus-stroke);
301
+ --elevation-select-focus-ring: var(--elevation-component-focus-stroke);
302
+ --elevation-select-menu: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-menu-border), var(--elevation-04);
303
+ --elevation-select-trigger: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-trigger-border-current, var(--bh-select-trigger-border)), var(--elevation-component-default);
304
+ --elevation-sidebar: inset calc(var(--bh-border-width-default) * -1) 0px 0px 0px var(--bh-sidebar-border), var(--elevation-component-surface);
305
+ --elevation-slider-thumb: var(--elevation-03);
306
+ --elevation-slider-thumb-focus: var(--elevation-slider-thumb), var(--elevation-component-focus-ring);
307
+ --elevation-slider-tooltip: var(--elevation-04);
308
+ --elevation-social-button: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-social-button-border, transparent), var(--elevation-component-default);
309
+ --elevation-social-button-focus: var(--elevation-social-button), var(--elevation-component-focus-ring);
310
+ --elevation-social-button-focus-ring: var(--elevation-component-focus-ring);
311
+ --elevation-textarea: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-textarea-border, var(--bh-border-input)), var(--elevation-component-default);
312
+ --foreground: var(--bh-content-default);
313
+ --ghost: var(--bh-interactive-ghost-default);
314
+ --ghost-hover: var(--bh-interactive-ghost-hover);
315
+ --ghost-pressed: var(--bh-interactive-ghost-pressed);
316
+ --input: var(--bh-border-input);
317
+ --muted: var(--bh-bg-muted);
318
+ --muted-foreground: var(--bh-content-muted);
319
+ --outline: var(--bh-interactive-outlined-default);
320
+ --outline-hover: var(--bh-interactive-outlined-hover);
321
+ --outline-pressed: var(--bh-interactive-outlined-pressed);
322
+ --popover: var(--bh-bg-raised);
323
+ --popover-foreground: var(--bh-content-default);
324
+ --primary: var(--bh-interactive-brand-default);
325
+ --primary-foreground: var(--bh-content-on-brand);
326
+ --primary-hover: var(--bh-interactive-brand-hover);
327
+ --primary-pressed: var(--bh-interactive-brand-pressed);
328
+ --ring: var(--bh-border-focus);
329
+ --secondary: var(--bh-interactive-secondary-default);
330
+ --secondary-foreground: var(--bh-content-default);
331
+ --secondary-hover: var(--bh-interactive-secondary-hover);
332
+ --secondary-pressed: var(--bh-interactive-secondary-pressed);
333
+ --soft: var(--bh-interactive-soft-default);
334
+ --soft-hover: var(--bh-interactive-soft-hover);
335
+ --soft-pressed: var(--bh-interactive-soft-pressed);
336
+ --success: var(--bh-bg-success-default);
337
+ --success-foreground: var(--bh-content-on-color);
338
+ --success-hover: var(--bh-bg-success-bold);
339
+ --success-pressed: var(--bh-bg-success-strong);
340
+ --warning: var(--bh-bg-warning-default);
341
+ --warning-foreground: var(--bh-content-on-light);
342
+ --warning-hover: var(--bh-bg-warning-bold);
343
+ --warning-pressed: var(--bh-bg-warning-strong);
344
+ --warning-soft: var(--bh-bg-warning-subtle);
345
+ --warning-soft-foreground: var(--bh-content-warning-default);
346
+ --warning-soft-hover: var(--bh-bg-warning-soft);
347
+ }
348
+
349
+ /* Banhaten brand theme light token modes: generated from tokens/banhaten.tokens.json. */
350
+
351
+ :root,
352
+ [data-theme="gray"] {
353
+ --bh-activity-feed-compact-width: 600px;
354
+ --bh-activity-feed-completed-brightness: 0.99;
355
+ --bh-agent-input-field-max-height: var(--bh-space-13xl-160);
356
+ --bh-agent-input-palette-width: var(--bh-space-15xl-224);
357
+ --bh-agent-input-ring-duration: 1.1s;
358
+ --bh-agent-input-ring-width: var(--bh-space-xxxs-1);
359
+ --bh-alert-compact-height: calc(var(--bh-space-8xl-48) + var(--bh-space-md-8));
360
+ --bh-alert-compact-padding: var(--bh-space-3xl-16);
361
+ --bh-alert-compact-radius: var(--bh-radius-lg-8);
362
+ --bh-alert-compact-width: 470px;
363
+ --bh-alert-expanded-height: calc(var(--bh-space-12xl-128) + var(--bh-space-3xl-16));
364
+ --bh-alert-expanded-padding-x: var(--bh-space-3xl-16);
365
+ --bh-alert-expanded-padding-y: var(--bh-space-4xl-20);
366
+ --bh-alert-expanded-radius: var(--bh-radius-xl-10);
367
+ --bh-alert-expanded-rtl-height: calc(var(--bh-space-11xl-96) + var(--bh-space-5xl-24));
368
+ --bh-alert-expanded-width: 500px;
369
+ --bh-alert-icon-size: var(--bh-icon-size-default);
370
+ --bh-alert-icon-slot-size: var(--bh-icon-slot-size-default);
371
+ --bh-attribute-header-icon-size: var(--bh-space-6xl-32);
372
+ --bh-attribute-header-icon-size-lg: var(--bh-space-8xl-48);
373
+ --bh-attribute-label-width: 220px;
374
+ --bh-avatar-action-icon-size-2xl: var(--bh-space-2xl-14);
375
+ --bh-avatar-action-icon-size-3xl: 18px;
376
+ --bh-avatar-action-icon-size-4xl: 22px;
377
+ --bh-avatar-action-icon-size-large: var(--bh-space-lg-10);
378
+ --bh-avatar-action-icon-size-medium: 9px;
379
+ --bh-avatar-action-icon-size-small: var(--bh-space-md-8);
380
+ --bh-avatar-action-icon-size-tiny: var(--bh-space-sm-6);
381
+ --bh-avatar-action-icon-size-xlarge: var(--bh-space-xl-12);
382
+ --bh-avatar-action-icon-size-xsmall: 7px;
383
+ --bh-avatar-action-size-2xl: var(--bh-space-5xl-24);
384
+ --bh-avatar-action-size-3xl: var(--bh-space-6xl-32);
385
+ --bh-avatar-action-size-4xl: var(--bh-space-7xl-40);
386
+ --bh-avatar-action-size-large: 18px;
387
+ --bh-avatar-action-size-medium: var(--bh-space-3xl-16);
388
+ --bh-avatar-action-size-small: var(--bh-space-2xl-14);
389
+ --bh-avatar-action-size-tiny: var(--bh-space-lg-10);
390
+ --bh-avatar-action-size-xlarge: var(--bh-space-4xl-20);
391
+ --bh-avatar-action-size-xsmall: var(--bh-space-xl-12);
392
+ --bh-avatar-fallback-font-size-2xl: var(--bh-text-body-sm-semibold-font-size);
393
+ --bh-avatar-fallback-font-size-2xs: 9px;
394
+ --bh-avatar-fallback-font-size-3xl: var(--bh-text-body-md-semibold-font-size);
395
+ --bh-avatar-fallback-font-size-4xl: var(--bh-text-body-md-semibold-font-size);
396
+ --bh-avatar-fallback-font-size-lg: var(--bh-text-body-sm-semibold-font-size);
397
+ --bh-avatar-fallback-font-size-md: var(--bh-text-body-2xs-semibold-font-size);
398
+ --bh-avatar-fallback-font-size-sm: var(--bh-text-body-2xs-semibold-font-size);
399
+ --bh-avatar-fallback-font-size-xl: var(--bh-text-body-sm-semibold-font-size);
400
+ --bh-avatar-fallback-font-size-xs: var(--bh-space-lg-10);
401
+ --bh-avatar-icon-size-2xl: var(--bh-radius-6xl-28);
402
+ --bh-avatar-icon-size-2xs: var(--bh-space-lg-10);
403
+ --bh-avatar-icon-size-3xl: var(--bh-space-6xl-32);
404
+ --bh-avatar-icon-size-4xl: 36px;
405
+ --bh-avatar-icon-size-lg: var(--bh-icon-size-default);
406
+ --bh-avatar-icon-size-md: var(--bh-icon-size-default);
407
+ --bh-avatar-icon-size-sm: var(--bh-space-3xl-16);
408
+ --bh-avatar-icon-size-xl: var(--bh-space-5xl-24);
409
+ --bh-avatar-icon-size-xs: var(--bh-space-xl-12);
410
+ --bh-avatar-size-2xl: var(--bh-space-8xl-48);
411
+ --bh-avatar-size-2xs: var(--bh-space-3xl-16);
412
+ --bh-avatar-size-3xl: 56px;
413
+ --bh-avatar-size-4xl: var(--bh-space-9xl-64);
414
+ --bh-avatar-size-lg: 36px;
415
+ --bh-avatar-size-md: var(--bh-space-6xl-32);
416
+ --bh-avatar-size-sm: var(--bh-space-5xl-24);
417
+ --bh-avatar-size-xl: var(--bh-space-7xl-40);
418
+ --bh-avatar-size-xs: var(--bh-space-4xl-20);
419
+ --bh-avatar-status-ring-default: var(--bh-space-xxs-2);
420
+ --bh-avatar-status-ring-thin: var(--bh-space-xxxs-1);
421
+ --bh-avatar-status-size-large: var(--bh-space-3xl-16);
422
+ --bh-avatar-status-size-medium: var(--bh-space-2xl-14);
423
+ --bh-avatar-status-size-small: var(--bh-space-lg-10);
424
+ --bh-avatar-status-size-tiny: var(--bh-space-sm-6);
425
+ --bh-avatar-status-size-xlarge: var(--bh-space-4xl-20);
426
+ --bh-avatar-status-size-xsmall: var(--bh-space-md-8);
427
+ --bh-badge-focus-ring-width: var(--bh-space-xs-4);
428
+ --bh-badge-outline-border-width: calc(var(--bh-border-width-default) + (var(--bh-border-width-default) / 2));
231
429
  --bh-border-width-default: var(--bh-space-xxxs-1);
232
430
  --bh-border-width-strong: var(--bh-space-xxs-2);
233
431
  --bh-button-gap: var(--bh-space-xs-4);
234
432
  --bh-button-gap-xs: var(--bh-space-xxs-2);
235
- --bh-button-group-bg: var(--bh-bg-subtle);
236
- --bh-button-group-border: var(--bh-border-default);
237
- --bh-button-group-content: var(--bh-button-group-content-default);
238
- --bh-button-group-content-active: var(--bh-content-default);
239
- --bh-button-group-content-default: var(--bh-content-subtle);
240
- --bh-button-group-content-disabled: var(--bh-content-disabled);
241
- --bh-button-group-divider: var(--bh-border-subtle);
242
433
  --bh-button-group-icon-size: var(--bh-icon-size-default);
243
434
  --bh-button-group-icon-slot-size: var(--bh-icon-slot-size-default);
244
- --bh-button-group-item-active-bg: var(--bh-interactive-ghost-active);
245
- --bh-button-group-item-bg: var(--bh-interactive-ghost-default);
246
- --bh-button-group-item-disabled-bg: var(--bh-interactive-ghost-disabled);
247
- --bh-button-group-item-hover: var(--bh-button-group-item-hover-bg);
248
- --bh-button-group-item-hover-bg: var(--bh-interactive-ghost-hover);
249
- --bh-button-group-item-pressed-bg: var(--bh-interactive-ghost-pressed);
250
435
  --bh-button-group-label-padding-x: var(--bh-space-xxs-2);
251
436
  --bh-button-group-md-gap: var(--bh-space-xs-4);
252
437
  --bh-button-group-md-height: var(--bh-space-7xl-40);
@@ -291,7 +476,6 @@
291
476
  --bh-card-horizontal-media-width: 480px;
292
477
  --bh-card-horizontal-min-height: var(--bh-space-18xl-320);
293
478
  --bh-card-horizontal-width: 1020px;
294
- --bh-card-media-overlay: color-mix(in srgb, var(--bh-bg-always-dark) 80%, transparent);
295
479
  --bh-card-mobile-content-padding: var(--bh-space-4xl-20);
296
480
  --bh-card-mobile-full-height: 300px;
297
481
  --bh-card-mobile-horizontal-padding: var(--bh-space-4xl-20);
@@ -305,29 +489,6 @@
305
489
  --bh-catalog-file-preview-min: 260px;
306
490
  --bh-catalog-showcase-breakpoint-lg: 1100px;
307
491
  --bh-catalog-showcase-breakpoint-sm: 640px;
308
- --bh-chart-1: var(--bh-chart-categorical-brand);
309
- --bh-chart-2: var(--bh-chart-categorical-success);
310
- --bh-chart-3: var(--bh-chart-categorical-warning);
311
- --bh-chart-4: var(--bh-chart-categorical-danger);
312
- --bh-chart-5: var(--bh-chart-categorical-information);
313
- --bh-chart-brand-default: var(--bh-colors-brand-surface-base);
314
- --bh-chart-categorical-1: var(--bh-sky-600);
315
- --bh-chart-categorical-2: var(--bh-purple-700);
316
- --bh-chart-categorical-3: var(--bh-amber-500);
317
- --bh-chart-categorical-4: var(--bh-rose-700);
318
- --bh-chart-categorical-5: var(--bh-blue-900);
319
- --bh-chart-categorical-6: var(--bh-purple-500);
320
- --bh-chart-categorical-7: var(--bh-rose-950);
321
- --bh-chart-categorical-8: var(--bh-amber-700);
322
- --bh-chart-categorical-aqua: var(--bh-content-accent-aqua-default);
323
- --bh-chart-categorical-brand: var(--bh-content-brand-default);
324
- --bh-chart-categorical-danger: var(--bh-content-danger-default);
325
- --bh-chart-categorical-fuchsia: var(--bh-content-accent-fuchsia-default);
326
- --bh-chart-categorical-information: var(--bh-content-information-default);
327
- --bh-chart-categorical-purple: var(--bh-content-accent-purple-default);
328
- --bh-chart-categorical-success: var(--bh-content-success-default);
329
- --bh-chart-categorical-warning: var(--bh-content-warning-default);
330
- --bh-chart-neutral-default: var(--bh-colors-neutral-400);
331
492
  --bh-checkbox-card-border-width: var(--bh-border-width-default);
332
493
  --bh-checkbox-card-border-width-active: var(--bh-border-width-strong);
333
494
  --bh-checkbox-card-content-gap: var(--bh-space-xl-12);
@@ -344,6 +505,7 @@
344
505
  --bh-checkbox-indeterminate-height: var(--bh-space-xxs-2);
345
506
  --bh-checkbox-indeterminate-width: var(--bh-space-md-8);
346
507
  --bh-checkbox-root-size: var(--bh-space-4xl-20);
508
+ --bh-citation-mark-size: var(--bh-space-2xl-14);
347
509
  --bh-colors-brand-border-border-strong: var(--bh-gray-950);
348
510
  --bh-colors-brand-border-border-strong-dark: var(--bh-gray-dark-950);
349
511
  --bh-colors-brand-border-border-subtle: var(--bh-gray-500);
@@ -353,7 +515,6 @@
353
515
  --bh-colors-brand-checkbox-bg-hover: var(--bh-gray-950);
354
516
  --bh-colors-brand-checkbox-bg-hover-dark: var(--bh-gray-100);
355
517
  --bh-colors-brand-color-on-brand-dark: var(--bh-gray-dark-50);
356
- --bh-colors-brand-color-on-brand-light: var(--bh-base-white);
357
518
  --bh-colors-brand-content-dark: var(--bh-base-white);
358
519
  --bh-colors-brand-content-light: var(--bh-gray-950);
359
520
  --bh-colors-brand-content-strong-dark: var(--bh-base-white);
@@ -386,85 +547,6 @@
386
547
  --bh-colors-brand-surface-strong-light: var(--bh-gray-900);
387
548
  --bh-colors-brand-surface-subtle-dark: var(--bh-gray-dark-alpha-200);
388
549
  --bh-colors-brand-surface-subtle-light: var(--bh-gray-200);
389
- --bh-colors-neutral-100: var(--bh-gray-100);
390
- --bh-colors-neutral-200: var(--bh-gray-200);
391
- --bh-colors-neutral-300: var(--bh-gray-300);
392
- --bh-colors-neutral-400: var(--bh-gray-400);
393
- --bh-colors-neutral-50: var(--bh-gray-50);
394
- --bh-colors-neutral-500: var(--bh-gray-500);
395
- --bh-colors-neutral-600: var(--bh-gray-600);
396
- --bh-colors-neutral-700: var(--bh-gray-700);
397
- --bh-colors-neutral-800: var(--bh-gray-800);
398
- --bh-colors-neutral-900: var(--bh-gray-900);
399
- --bh-colors-neutral-950: var(--bh-gray-950);
400
- --bh-colors-neutral-alpha-100: var(--bh-gray-alpha-100);
401
- --bh-colors-neutral-alpha-200: var(--bh-gray-alpha-200);
402
- --bh-colors-neutral-alpha-300: var(--bh-gray-alpha-300);
403
- --bh-colors-neutral-alpha-400: var(--bh-gray-alpha-400);
404
- --bh-colors-neutral-alpha-50: var(--bh-gray-alpha-50);
405
- --bh-colors-neutral-alpha-500: var(--bh-gray-alpha-500);
406
- --bh-colors-neutral-alpha-dark-100: var(--bh-gray-dark-alpha-100);
407
- --bh-colors-neutral-alpha-dark-200: var(--bh-gray-dark-alpha-200);
408
- --bh-colors-neutral-alpha-dark-300: var(--bh-gray-dark-alpha-300);
409
- --bh-colors-neutral-alpha-dark-400: var(--bh-gray-dark-alpha-400);
410
- --bh-colors-neutral-alpha-dark-50: var(--bh-gray-dark-alpha-50);
411
- --bh-colors-neutral-alpha-dark-500: var(--bh-gray-dark-alpha-500);
412
- --bh-colors-neutral-dark-100: var(--bh-gray-dark-100);
413
- --bh-colors-neutral-dark-200: var(--bh-gray-dark-200);
414
- --bh-colors-neutral-dark-300: var(--bh-gray-dark-300);
415
- --bh-colors-neutral-dark-400: var(--bh-gray-dark-400);
416
- --bh-colors-neutral-dark-50: var(--bh-gray-dark-50);
417
- --bh-colors-neutral-dark-500: var(--bh-gray-dark-500);
418
- --bh-colors-neutral-dark-600: var(--bh-gray-dark-600);
419
- --bh-colors-neutral-dark-700: var(--bh-gray-dark-700);
420
- --bh-colors-neutral-dark-800: var(--bh-gray-dark-800);
421
- --bh-colors-neutral-dark-900: var(--bh-gray-dark-900);
422
- --bh-colors-neutral-dark-950: var(--bh-gray-dark-950);
423
- --bh-content-accent-amber-default: var(--bh-amber-600);
424
- --bh-content-accent-amber-strong: var(--bh-amber-800);
425
- --bh-content-accent-aqua-default: var(--bh-aqua-600);
426
- --bh-content-accent-aqua-strong: var(--bh-aqua-700);
427
- --bh-content-accent-blue-default: var(--bh-blue-600);
428
- --bh-content-accent-blue-strong: var(--bh-blue-700);
429
- --bh-content-accent-fuchsia-default: var(--bh-fuchsia-600);
430
- --bh-content-accent-fuchsia-strong: var(--bh-fuchsia-700);
431
- --bh-content-accent-golden-default: var(--bh-golden-700);
432
- --bh-content-accent-golden-strong: var(--bh-golden-800);
433
- --bh-content-accent-green-default: var(--bh-green-600);
434
- --bh-content-accent-green-strong: var(--bh-green-700);
435
- --bh-content-accent-lime-default: var(--bh-lime-600);
436
- --bh-content-accent-lime-strong: var(--bh-lime-700);
437
- --bh-content-accent-purple-default: var(--bh-purple-600);
438
- --bh-content-accent-purple-strong: var(--bh-purple-700);
439
- --bh-content-accent-red-default: var(--bh-red-600);
440
- --bh-content-accent-red-strong: var(--bh-red-700);
441
- --bh-content-accent-rose-default: var(--bh-rose-600);
442
- --bh-content-accent-rose-strong: var(--bh-rose-700);
443
- --bh-content-accent-sky-default: var(--bh-sky-600);
444
- --bh-content-accent-sky-strong: var(--bh-sky-700);
445
- --bh-content-brand-default: var(--bh-colors-brand-content-light);
446
- --bh-content-brand-strong: var(--bh-colors-brand-content-strong-light);
447
- --bh-content-danger-default: var(--bh-red-600);
448
- --bh-content-danger-strong: var(--bh-red-700);
449
- --bh-content-default: var(--bh-colors-neutral-950);
450
- --bh-content-disabled: var(--bh-colors-neutral-600);
451
- --bh-content-information-default: var(--bh-blue-600);
452
- --bh-content-information-strong: var(--bh-blue-700);
453
- --bh-content-inverse: var(--bh-base-white);
454
- --bh-content-link: var(--bh-colors-brand-link-light);
455
- --bh-content-link-hover: var(--bh-colors-brand-link-hover-light);
456
- --bh-content-muted: #627084;
457
- --bh-content-on-brand: var(--bh-colors-brand-color-on-brand-light);
458
- --bh-content-on-color: var(--bh-base-white);
459
- --bh-content-on-light: var(--bh-colors-neutral-950);
460
- --bh-content-on-neutral: var(--bh-base-white);
461
- --bh-content-on-success: var(--bh-base-white);
462
- --bh-content-on-warning: var(--bh-base-white);
463
- --bh-content-subtle: var(--bh-colors-neutral-800);
464
- --bh-content-success-default: var(--bh-green-600);
465
- --bh-content-success-strong: var(--bh-green-700);
466
- --bh-content-warning-default: var(--bh-amber-600);
467
- --bh-content-warning-strong: var(--bh-amber-700);
468
550
  --bh-control-default: 8px;
469
551
  --bh-control-lg: 10px;
470
552
  --bh-control-md: 6px;
@@ -475,103 +557,53 @@
475
557
  --bh-date-list-item-height: var(--bh-button-sm-height);
476
558
  --bh-date-month-year-item-height: var(--bh-space-6xl-32);
477
559
  --bh-date-month-year-list-top: calc(var(--bh-space-8xl-48) + var(--bh-space-xs-4));
478
- --bh-date-month-year-list-width: var(--bh-date-range-month-width);
479
- --bh-date-month-year-spacer-height: 252px;
480
- --bh-date-nav-button-size: var(--bh-button-xs-height);
481
- --bh-date-nav-icon-size: var(--bh-icon-size-default);
482
- --bh-date-nav-icon-slot-size: var(--bh-icon-slot-size-default);
483
- --bh-date-picker-width: var(--bh-date-trigger-width);
484
- --bh-date-presets-width: 144px;
485
- --bh-date-range-month-width: var(--bh-space-15xl-224);
486
- --bh-date-range-surface-max-width: calc(100vw - var(--bh-space-6xl-32));
487
- --bh-date-surface-width-calendar: 240px;
488
- --bh-date-surface-width-picker: var(--bh-space-16xl-256);
489
- --bh-date-time-input-min-height: var(--bh-space-6xl-32);
490
- --bh-date-title-chevron-size: var(--bh-space-3xl-16);
491
- --bh-date-title-height: var(--bh-button-xs-height);
492
- --bh-date-trigger-height: var(--bh-button-md-height);
493
- --bh-date-trigger-icon-size: var(--bh-icon-size-default);
494
- --bh-date-trigger-icon-slot-size: var(--bh-icon-slot-size-default);
495
- --bh-date-trigger-width: 260px;
496
- --bh-duration-accordion: 180ms;
497
- --bh-duration-default: 200ms;
498
- --bh-duration-fast: 160ms;
499
- --bh-duration-reduced-motion: 0.01ms;
500
- --bh-easing-out: ease-out;
501
- --bh-easing-standard: ease;
502
- --bh-empty-state-icon-stroke-width: 2;
503
- --bh-expanded-breakpoint-lg: 980px;
504
- --bh-expanded-breakpoint-md: 820px;
505
- --bh-expanded-breakpoint-sm: 620px;
506
- --bh-expanded-breakpoint-xs: 560px;
507
- --bh-file-upload-content-max-width: 343px;
508
- --bh-file-upload-root-max-width: 500px;
509
- --bh-file-upload-spin-duration: 1s;
510
- --bh-focus-ring-offset: var(--bh-space-xxs-2);
511
- --bh-focus-ring-width: var(--bh-space-xs-4);
512
- --bh-font-family: var(--bh-font-family-english), var(--bh-font-family-arabic), var(--bh-font-family-fallback);
513
- --bh-font-family-arabic: "IBM Plex Sans Arabic";
514
- --bh-font-family-english: Inter;
515
- --bh-font-family-fallback: sans-serif;
516
- --bh-font-weight-bold: 700;
517
- --bh-font-weight-medium: 500;
518
- --bh-font-weight-regular: 400;
519
- --bh-font-weight-semibold: 600;
520
- --bh-fuchsia-100: #FED6FF;
521
- --bh-fuchsia-200: #FEB9FF;
522
- --bh-fuchsia-50: #FFEBFF;
523
- --bh-fuchsia-500: #E703EB;
524
- --bh-fuchsia-600: #C20AC5;
525
- --bh-fuchsia-700: #92089F;
526
- --bh-golden-100: #FFEDAE;
527
- --bh-golden-300: #FAD658;
528
- --bh-golden-400: #F7C407;
529
- --bh-golden-50: #FFF5D1;
530
- --bh-golden-600: #C98B04;
531
- --bh-golden-700: #A96C03;
532
- --bh-golden-800: #7E4F03;
533
- --bh-gray-100: #F5F5F5;
534
- --bh-gray-200: #F0F0F0;
535
- --bh-gray-300: #EBEBEB;
536
- --bh-gray-400: #DBDBDB;
537
- --bh-gray-50: #FAFAFA;
538
- --bh-gray-500: #BFBFBF;
539
- --bh-gray-600: #ADADAD;
540
- --bh-gray-700: #8C8C8C;
541
- --bh-gray-800: #595959;
542
- --bh-gray-900: #2E2E2E;
543
- --bh-gray-950: #1A1A1A;
544
- --bh-gray-alpha-100: rgb(0 0 0 / 0.06);
545
- --bh-gray-alpha-200: rgb(0 0 0 / 0.08);
546
- --bh-gray-alpha-300: rgb(0 0 0 / 0.1);
547
- --bh-gray-alpha-400: rgb(0 0 0 / 0.14);
548
- --bh-gray-alpha-50: rgb(0 0 0 / 0.04);
549
- --bh-gray-alpha-500: rgb(0 0 0 / 0.25);
550
- --bh-gray-dark-100: #141414;
551
- --bh-gray-dark-200: #1A1A1A;
552
- --bh-gray-dark-300: #242424;
553
- --bh-gray-dark-400: #3B3B3B;
554
- --bh-gray-dark-50: #0E0E0F;
555
- --bh-gray-dark-500: #4D4D4D;
556
- --bh-gray-dark-600: #5E5E5E;
557
- --bh-gray-dark-700: #7A7A7A;
558
- --bh-gray-dark-800: #A3A3A3;
559
- --bh-gray-dark-900: #E8E8E8;
560
- --bh-gray-dark-950: #FCFCFC;
561
- --bh-gray-dark-alpha-100: rgb(255 255 255 / 0.08);
562
- --bh-gray-dark-alpha-200: rgb(255 255 255 / 0.11);
563
- --bh-gray-dark-alpha-300: rgb(255 255 255 / 0.12);
564
- --bh-gray-dark-alpha-400: rgb(255 255 255 / 0.19);
565
- --bh-gray-dark-alpha-50: rgb(255 255 255 / 0.05);
566
- --bh-gray-dark-alpha-500: rgb(255 255 255 / 0.3);
567
- --bh-green-100: #BCFAD2;
568
- --bh-green-200: #89EBAC;
569
- --bh-green-50: #DBFFE8;
570
- --bh-green-500: #0BAE45;
571
- --bh-green-600: #039536;
572
- --bh-green-700: #07712C;
573
- --bh-green-800: #075622;
574
- --bh-green-900: #043F18;
560
+ --bh-date-month-year-list-width: var(--bh-date-range-month-width);
561
+ --bh-date-month-year-spacer-height: 252px;
562
+ --bh-date-nav-button-size: var(--bh-button-xs-height);
563
+ --bh-date-nav-icon-size: var(--bh-icon-size-default);
564
+ --bh-date-nav-icon-slot-size: var(--bh-icon-slot-size-default);
565
+ --bh-date-picker-width: var(--bh-date-trigger-width);
566
+ --bh-date-presets-width: 144px;
567
+ --bh-date-range-month-width: var(--bh-space-15xl-224);
568
+ --bh-date-range-surface-max-width: calc(100vw - var(--bh-space-6xl-32));
569
+ --bh-date-surface-width-calendar: 240px;
570
+ --bh-date-surface-width-picker: var(--bh-space-16xl-256);
571
+ --bh-date-time-input-min-height: var(--bh-space-6xl-32);
572
+ --bh-date-title-chevron-size: var(--bh-space-3xl-16);
573
+ --bh-date-title-height: var(--bh-button-xs-height);
574
+ --bh-date-trigger-height: var(--bh-button-md-height);
575
+ --bh-date-trigger-icon-size: var(--bh-icon-size-default);
576
+ --bh-date-trigger-icon-slot-size: var(--bh-icon-slot-size-default);
577
+ --bh-date-trigger-width: 260px;
578
+ --bh-duration-accordion: 180ms;
579
+ --bh-duration-default: 200ms;
580
+ --bh-duration-fast: 160ms;
581
+ --bh-duration-moderate: 280ms;
582
+ --bh-duration-reduced-motion: 0.01ms;
583
+ --bh-duration-slow: 350ms;
584
+ --bh-duration-slower: 560ms;
585
+ --bh-easing-emphasized: cubic-bezier(0.22, 1, 0.36, 1);
586
+ --bh-easing-out: ease-out;
587
+ --bh-easing-standard: ease;
588
+ --bh-empty-state-icon-stroke-width: 2;
589
+ --bh-expanded-breakpoint-lg: 980px;
590
+ --bh-expanded-breakpoint-md: 820px;
591
+ --bh-expanded-breakpoint-sm: 620px;
592
+ --bh-expanded-breakpoint-xs: 560px;
593
+ --bh-file-upload-content-max-width: 343px;
594
+ --bh-file-upload-root-max-width: 500px;
595
+ --bh-file-upload-spin-duration: 1s;
596
+ --bh-focus-ring-offset: var(--bh-space-xxs-2);
597
+ --bh-focus-ring-width: var(--bh-space-xs-4);
598
+ --bh-font-family: var(--bh-font-family-english), var(--bh-font-family-arabic), var(--bh-font-family-fallback);
599
+ --bh-font-family-arabic: "IBM Plex Sans Arabic";
600
+ --bh-font-family-english: Inter;
601
+ --bh-font-family-fallback: sans-serif;
602
+ --bh-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
603
+ --bh-font-weight-bold: 700;
604
+ --bh-font-weight-medium: 500;
605
+ --bh-font-weight-regular: 400;
606
+ --bh-font-weight-semibold: 600;
575
607
  --bh-icon-explorer-canvas-max-width: 1280px;
576
608
  --bh-icon-explorer-detail-max-width: 760px;
577
609
  --bh-icon-explorer-detail-preview-size: 86px;
@@ -591,7 +623,6 @@
591
623
  --bh-icon-explorer-selected-min-height: 176px;
592
624
  --bh-icon-explorer-style-card-min-height: 74px;
593
625
  --bh-icon-explorer-swatch-width: 150px;
594
- --bh-icon-explorer-topbar-bg: color-mix(in srgb, var(--bh-bg-grouped) 92%, transparent);
595
626
  --bh-icon-explorer-topbar-min-height: 74px;
596
627
  --bh-icon-size-default: 18px;
597
628
  --bh-icon-slot-inset-default: calc((var(--bh-icon-slot-size-default) - var(--bh-icon-size-default)) / 2);
@@ -643,59 +674,6 @@
643
674
  --bh-input-tag-height: var(--bh-space-5xl-24);
644
675
  --bh-input-tag-padding-x: var(--bh-space-sm-6);
645
676
  --bh-input-width: var(--bh-space-18xl-320);
646
- --bh-interactive-brand-default: var(--bh-colors-brand-interactive-default);
647
- --bh-interactive-brand-disabled: var(--bh-colors-neutral-alpha-100);
648
- --bh-interactive-brand-hover: var(--bh-colors-brand-interactive-hover);
649
- --bh-interactive-brand-pressed: var(--bh-colors-brand-interactive-pressed);
650
- --bh-interactive-checkbox-default: var(--bh-colors-brand-checkbox-bg-default);
651
- --bh-interactive-checkbox-hover: var(--bh-colors-brand-checkbox-bg-hover);
652
- --bh-interactive-danger-default: var(--bh-red-500);
653
- --bh-interactive-danger-disabled: var(--bh-colors-neutral-alpha-100);
654
- --bh-interactive-danger-hover: var(--bh-red-600);
655
- --bh-interactive-danger-pressed: var(--bh-red-500);
656
- --bh-interactive-danger-soft-default: var(--bh-red-50);
657
- --bh-interactive-danger-soft-disabled: var(--bh-colors-neutral-alpha-100);
658
- --bh-interactive-danger-soft-hover: var(--bh-red-100);
659
- --bh-interactive-danger-soft-pressed: var(--bh-red-50);
660
- --bh-interactive-ghost-active: var(--bh-colors-neutral-alpha-100);
661
- --bh-interactive-ghost-default: rgb(0 0 0 / 0);
662
- --bh-interactive-ghost-disabled: rgb(0 0 0 / 0);
663
- --bh-interactive-ghost-hover: var(--bh-colors-neutral-alpha-50);
664
- --bh-interactive-ghost-pressed: var(--bh-colors-neutral-alpha-100);
665
- --bh-interactive-indicator-default: var(--bh-colors-brand-indicator);
666
- --bh-interactive-input-default: var(--bh-base-white);
667
- --bh-interactive-input-disabled: var(--bh-colors-neutral-alpha-50);
668
- --bh-interactive-input-soft: var(--bh-colors-neutral-alpha-100);
669
- --bh-interactive-input-soft-disabled: var(--bh-colors-neutral-alpha-50);
670
- --bh-interactive-outlined-default: rgb(0 0 0 / 0);
671
- --bh-interactive-outlined-disabled: rgb(0 0 0 / 0);
672
- --bh-interactive-outlined-hover: var(--bh-colors-neutral-alpha-50);
673
- --bh-interactive-outlined-pressed: var(--bh-colors-neutral-alpha-100);
674
- --bh-interactive-radiobutton-default: var(--bh-colors-brand-radiobutton-bg-default);
675
- --bh-interactive-radiobutton-hover: var(--bh-colors-brand-radiobutton-bg-hover);
676
- --bh-interactive-secondary-default: var(--bh-colors-neutral-50);
677
- --bh-interactive-secondary-disabled: var(--bh-colors-neutral-alpha-100);
678
- --bh-interactive-secondary-hover: var(--bh-colors-neutral-100);
679
- --bh-interactive-secondary-pressed: var(--bh-colors-neutral-200);
680
- --bh-interactive-soft-default: var(--bh-colors-neutral-alpha-100);
681
- --bh-interactive-soft-disabled: var(--bh-colors-neutral-alpha-100);
682
- --bh-interactive-soft-hover: var(--bh-colors-neutral-alpha-200);
683
- --bh-interactive-soft-pressed: var(--bh-colors-neutral-alpha-300);
684
- --bh-interactive-success-default: var(--bh-green-700);
685
- --bh-interactive-success-hover: var(--bh-green-800);
686
- --bh-interactive-success-pressed: var(--bh-green-900);
687
- --bh-interactive-switch-active: var(--bh-green-500);
688
- --bh-interactive-switch-active-disabled: var(--bh-green-100);
689
- --bh-interactive-switch-active-hover: var(--bh-green-600);
690
- --bh-interactive-switch-default: var(--bh-colors-neutral-400);
691
- --bh-interactive-switch-disabled: var(--bh-colors-neutral-alpha-100);
692
- --bh-interactive-switch-handle: var(--bh-base-white);
693
- --bh-interactive-switch-handle-disabled: var(--bh-colors-neutral-50);
694
- --bh-interactive-switch-hover: var(--bh-colors-neutral-500);
695
- --bh-interactive-table-header: var(--bh-colors-neutral-alpha-50);
696
- --bh-interactive-warning-default: var(--bh-amber-700);
697
- --bh-interactive-warning-hover: var(--bh-amber-800);
698
- --bh-interactive-warning-pressed: var(--bh-amber-900);
699
677
  --bh-item-actions-gap: var(--bh-space-md-8);
700
678
  --bh-item-content-gap: var(--bh-space-xxs-2);
701
679
  --bh-item-gap: var(--bh-space-xl-12);
@@ -710,25 +688,16 @@
710
688
  --bh-item-padding-x: var(--bh-space-3xl-16);
711
689
  --bh-item-padding-y: var(--bh-space-xl-12);
712
690
  --bh-item-radius: var(--bh-radius-xl-10);
713
- --bh-lime-100: #E8FCA8;
714
- --bh-lime-200: #D4F273;
715
- --bh-lime-50: #F4FFD1;
716
- --bh-lime-500: #8EB903;
717
- --bh-lime-600: #7CA203;
718
- --bh-lime-700: #668303;
719
691
  --bh-menu-action-gap: var(--bh-space-xxs-2);
720
692
  --bh-menu-action-height: var(--bh-space-6xl-32);
721
693
  --bh-menu-action-padding-x: var(--bh-space-sm-6);
722
694
  --bh-menu-badge-height: var(--bh-space-5xl-24);
723
695
  --bh-menu-badge-padding-x: var(--bh-space-md-8);
724
- --bh-menu-bg: var(--bh-bg-raised);
725
- --bh-menu-border: var(--bh-border-subtle);
726
696
  --bh-menu-divider-padding-y: var(--bh-space-xxs-2);
727
697
  --bh-menu-gap: var(--bh-space-xs-4);
728
698
  --bh-menu-icon-padding: var(--bh-space-xxs-2);
729
699
  --bh-menu-item-action-height: var(--bh-space-8xl-48);
730
700
  --bh-menu-item-action-width: 240px;
731
- --bh-menu-item-bg: var(--bh-interactive-ghost-default);
732
701
  --bh-menu-item-button-height: var(--bh-space-7xl-40);
733
702
  --bh-menu-item-caption-height: var(--bh-radius-6xl-28);
734
703
  --bh-menu-item-content-compact-padding-y: var(--bh-space-xs-4);
@@ -737,7 +706,6 @@
737
706
  --bh-menu-item-default-width: 355px;
738
707
  --bh-menu-item-divider-height: var(--bh-space-xs-4);
739
708
  --bh-menu-item-gap: var(--bh-space-xs-4);
740
- --bh-menu-item-hover-bg: var(--bh-interactive-ghost-hover);
741
709
  --bh-menu-item-label-height: var(--bh-radius-6xl-28);
742
710
  --bh-menu-item-multiline-height: var(--bh-space-8xl-48);
743
711
  --bh-menu-item-multiline-width: 402px;
@@ -785,51 +753,12 @@
785
753
  --bh-opacity-muted: var(--bh-opacity-55);
786
754
  --bh-opacity-subtle: var(--bh-opacity-70);
787
755
  --bh-opacity-tag-muted: var(--bh-opacity-70);
788
- --bh-pagination-action-gap: var(--bh-space-md-8);
789
- --bh-pagination-active-bg: var(--bh-interactive-brand-default);
790
- --bh-pagination-active-border: var(--bh-border-subtle);
791
- --bh-pagination-active-content: var(--bh-content-on-brand);
792
- --bh-pagination-caption-content: var(--bh-content-subtle);
793
- --bh-pagination-caption-font-weight: var(--bh-text-body-md-regular-font-weight);
794
- --bh-pagination-caption-width: 254px;
795
- --bh-pagination-control-content: var(--bh-content-default);
796
- --bh-pagination-control-gap: var(--bh-space-lg-10);
797
- --bh-pagination-control-ghost-bg: var(--bh-interactive-ghost-default);
798
- --bh-pagination-control-ghost-hover: var(--bh-interactive-ghost-hover);
799
- --bh-pagination-control-ghost-pressed: var(--bh-interactive-ghost-pressed);
800
- --bh-pagination-control-label-padding-x: var(--bh-space-xxs-2);
801
- --bh-pagination-control-label-rtl-padding-x: var(--bh-space-xs-4);
802
- --bh-pagination-control-soft-bg: var(--bh-interactive-soft-default);
803
- --bh-pagination-control-soft-hover: var(--bh-interactive-soft-hover);
804
- --bh-pagination-control-soft-pressed: var(--bh-interactive-soft-pressed);
805
- --bh-pagination-control-text-gap: var(--bh-space-xs-4);
806
- --bh-pagination-control-text-padding-x: var(--bh-space-md-8);
807
- --bh-pagination-control-text-rtl-gap: var(--bh-space-xxs-2);
808
- --bh-pagination-control-text-rtl-padding-x: var(--bh-space-sm-6);
809
- --bh-pagination-font-size: var(--bh-text-body-md-medium-font-size);
810
- --bh-pagination-icon-size: var(--bh-icon-size-default);
811
- --bh-pagination-icon-slot-size: var(--bh-icon-slot-size-default);
812
- --bh-pagination-item-size: var(--bh-space-6xl-32);
813
- --bh-pagination-label-font-weight: var(--bh-text-body-md-medium-font-weight);
814
- --bh-pagination-letter-spacing: var(--bh-text-body-md-medium-letter-spacing);
815
- --bh-pagination-line-height: var(--bh-text-body-md-medium-line-height);
816
- --bh-pagination-numeric-width: 560px;
817
- --bh-pagination-page-bg: var(--bh-interactive-ghost-default);
818
- --bh-pagination-page-content: var(--bh-content-subtle);
819
- --bh-pagination-page-gap: var(--bh-space-xs-4);
820
- --bh-pagination-page-hover: var(--bh-interactive-ghost-hover);
821
- --bh-pagination-page-pressed: var(--bh-interactive-ghost-pressed);
822
- --bh-pagination-radius: var(--bh-control-default);
823
- --bh-pagination-root-gap: var(--bh-space-3xl-16);
824
- --bh-pagination-simple-width: 458px;
825
756
  --bh-popover-arrow-depth: var(--bh-space-md-8);
826
757
  --bh-popover-arrow-inline-offset: var(--bh-space-xl-12);
827
758
  --bh-popover-arrow-offset: calc(var(--bh-popover-arrow-depth) * -1);
828
759
  --bh-popover-arrow-overlap: var(--bh-border-width-default);
829
760
  --bh-popover-arrow-width: var(--bh-space-xl-12);
830
- --bh-popover-bg: var(--bh-bg-raised);
831
761
  --bh-popover-body-gap: var(--bh-space-md-8);
832
- --bh-popover-border: var(--bh-border-subtle);
833
762
  --bh-popover-close-icon-size: var(--bh-space-3xl-16);
834
763
  --bh-popover-close-size: var(--bh-space-5xl-24);
835
764
  --bh-popover-content-gap: var(--bh-space-lg-10);
@@ -856,18 +785,11 @@
856
785
  --bh-progress-slider-height-lg: 72px;
857
786
  --bh-progress-slider-height-md: 56px;
858
787
  --bh-progress-slider-radius: var(--bh-radius-5xl-24);
859
- --bh-progress-slider-tick-bg: color-mix(in srgb, var(--bh-progress-slider-grip-bg, var(--bh-border-brand-strong)) 34%, transparent);
860
788
  --bh-progress-slider-tick-gap: var(--bh-space-xl-12);
861
789
  --bh-progress-slider-tick-padding: var(--bh-space-6xl-32);
862
790
  --bh-progress-slider-tick-size: var(--bh-space-sm-6);
863
791
  --bh-progress-slider-width-lg: 472px;
864
792
  --bh-progress-slider-width-md: calc(var(--bh-space-18xl-320) + var(--bh-space-7xl-40));
865
- --bh-purple-100: #F0DEFF;
866
- --bh-purple-200: #E3C3FF;
867
- --bh-purple-50: #F7EDFF;
868
- --bh-purple-500: #A135FA;
869
- --bh-purple-600: #8216DB;
870
- --bh-purple-700: #610FAD;
871
793
  --bh-radio-card-border-width: var(--bh-border-width-default);
872
794
  --bh-radio-card-border-width-active: var(--bh-border-width-strong);
873
795
  --bh-radio-card-company-mark-color: #7F57F1;
@@ -890,95 +812,32 @@
890
812
  --bh-radius-sm-4: 4px;
891
813
  --bh-radius-xl-10: 10px;
892
814
  --bh-radius-xs-2: 2px;
893
- --bh-red-100: #FFDBDF;
894
- --bh-red-200: #FFBFC6;
895
- --bh-red-300: #FF96A1;
896
- --bh-red-400: #FC5666;
897
- --bh-red-50: #FFEDEF;
898
- --bh-red-500: #E8172C;
899
- --bh-red-600: #CA1224;
900
- --bh-red-700: #A60C1B;
901
- --bh-rose-100: #FFD6E7;
902
- --bh-rose-200: #FFB9D7;
903
- --bh-rose-50: #FFEBF3;
904
- --bh-rose-500: #F01071;
905
- --bh-rose-600: #D10A60;
906
- --bh-rose-700: #A7094D;
907
- --bh-rose-950: #44071F;
908
- --bh-select-avatar-font-size: var(--bh-space-lg-10);
909
- --bh-select-check-color: var(--bh-interactive-indicator-default);
910
- --bh-select-checkbox-icon-size: var(--bh-space-xl-12);
911
- --bh-select-checkbox-radius: var(--bh-radius-sm-4);
912
- --bh-select-checkbox-size: var(--bh-space-3xl-16);
913
- --bh-select-company-icon-size: 18px;
914
- --bh-select-content-gap: var(--bh-space-xxs-2);
915
- --bh-select-field-gap: var(--bh-space-sm-6);
916
- --bh-select-icon-size: var(--bh-space-3xl-16);
917
- --bh-select-icon-slot-size: var(--bh-space-4xl-20);
918
- --bh-select-item-check-offset: var(--bh-space-3xl-16);
919
- --bh-select-item-content-padding: var(--bh-space-sm-6);
920
- --bh-select-item-gap: var(--bh-space-xs-4);
921
- --bh-select-item-hover-bg: var(--bh-interactive-ghost-hover);
922
- --bh-select-item-min-height: var(--bh-space-6xl-32);
923
- --bh-select-item-padding-x: var(--bh-space-sm-6);
924
- --bh-select-item-radius: var(--bh-radius-md-6);
925
- --bh-select-item-selected-padding-end: var(--bh-space-6xl-32);
926
- --bh-select-item-value-padding-x: var(--bh-space-xs-4);
927
- --bh-select-label-gap: var(--bh-space-xs-4);
928
- --bh-select-media-inset: var(--bh-space-xxs-2);
929
- --bh-select-menu-bg: var(--bh-bg-raised);
930
- --bh-select-menu-border: var(--bh-border-subtle);
931
- --bh-select-menu-list-gap: var(--bh-space-xxs-2);
932
- --bh-select-menu-offset: var(--bh-space-xs-4);
933
- --bh-select-menu-padding-y: var(--bh-space-sm-6);
934
- --bh-select-menu-radius: var(--bh-radius-xl-10);
935
- --bh-select-menu-width: var(--bh-select-width);
936
- --bh-select-payment-height: var(--bh-space-4xl-20);
937
- --bh-select-payment-mark-offset: 7px;
938
- --bh-select-payment-mark-size: 9px;
939
- --bh-select-payment-radius: var(--bh-radius-sm-4);
940
- --bh-select-payment-width: 28.333px;
941
- --bh-select-status-dot-size: var(--bh-space-md-8);
942
- --bh-select-trigger-bg: var(--bh-interactive-input-default);
943
- --bh-select-trigger-bg-disabled: var(--bh-interactive-input-disabled);
944
- --bh-select-trigger-bg-soft: var(--bh-interactive-input-soft);
945
- --bh-select-trigger-border: var(--bh-border-input);
946
- --bh-select-trigger-border-disabled: var(--bh-border-disabled);
947
- --bh-select-trigger-border-error: var(--bh-border-danger-strong);
948
- --bh-select-trigger-border-focus: var(--bh-border-focus);
949
- --bh-select-trigger-gap: var(--bh-space-sm-6);
950
- --bh-select-trigger-icon-color: var(--bh-content-muted);
951
- --bh-select-trigger-padding-x: var(--bh-space-md-8);
952
- --bh-select-trigger-padding-y-comfortable: var(--bh-space-md-8);
953
- --bh-select-trigger-padding-y-lg: var(--bh-space-sm-6);
954
- --bh-select-trigger-padding-y-md: var(--bh-space-xs-4);
955
- --bh-select-trigger-radius: var(--bh-radius-lg-8);
956
- --bh-select-value-padding-inline: var(--bh-space-xs-4);
957
- --bh-select-width: var(--bh-space-18xl-320);
815
+ --bh-shimmer-text-duration: 2.25s;
958
816
  --bh-sidebar-active-guide-height: 15px;
959
- --bh-sidebar-bg: var(--bh-bg-default);
960
- --bh-sidebar-bg-collapsed: var(--bh-bg-default);
961
- --bh-sidebar-border: var(--bh-border-subtle);
962
817
  --bh-sidebar-brand-height: 38px;
963
818
  --bh-sidebar-compact-control-size: 36px;
964
819
  --bh-sidebar-header-action-size: 28px;
965
820
  --bh-sidebar-icon-size: var(--bh-icon-size-default);
966
821
  --bh-sidebar-icon-size-collapsed: var(--bh-icon-size-default);
967
822
  --bh-sidebar-icon-slot-size: var(--bh-icon-slot-size-default);
968
- --bh-sidebar-item-bg-active: var(--bh-interactive-soft-default);
969
- --bh-sidebar-item-bg-hover: var(--bh-interactive-ghost-hover);
970
- --bh-sidebar-item-content: var(--bh-content-subtle);
971
- --bh-sidebar-item-content-active: var(--bh-content-default);
972
823
  --bh-sidebar-item-gap: var(--bh-space-md-8);
973
824
  --bh-sidebar-item-height: var(--bh-space-6xl-32);
974
825
  --bh-sidebar-item-height-collapsed: var(--bh-space-7xl-40);
975
826
  --bh-sidebar-item-padding-x: var(--bh-space-sm-6);
976
- --bh-sidebar-level-2-indent-width: 44px;
827
+ --bh-sidebar-level-2-indent-width: var(--bh-sidebar-icon-slot-size);
828
+ --bh-sidebar-min-height: 900px;
829
+ --bh-sidebar-motion-delay-content: 40ms;
830
+ --bh-sidebar-motion-duration: var(--bh-duration-default);
831
+ --bh-sidebar-motion-duration-content: var(--bh-duration-fast);
832
+ --bh-sidebar-motion-easing: cubic-bezier(0.2, 0, 0.38, 0.9);
977
833
  --bh-sidebar-padding: var(--bh-space-lg-10);
978
834
  --bh-sidebar-rail-width: 16px;
979
835
  --bh-sidebar-section-gap: var(--bh-space-3xl-16);
980
836
  --bh-sidebar-tree-indent-step: 22px;
981
837
  --bh-sidebar-tree-item-height: 28px;
838
+ --bh-sidebar-user-preview-gap: var(--bh-space-md-8);
839
+ --bh-sidebar-user-preview-height: 56px;
840
+ --bh-sidebar-user-preview-width: 232px;
982
841
  --bh-sidebar-width: 280px;
983
842
  --bh-sidebar-width-collapsed: 48px;
984
843
  --bh-sidebar-workspace-card-height: 50px;
@@ -987,18 +846,11 @@
987
846
  --bh-skeleton-duration: 1.4s;
988
847
  --bh-skeleton-shimmer-width: 62%;
989
848
  --bh-skeleton-width: 100%;
990
- --bh-sky-100: #CFF0FF;
991
- --bh-sky-200: #A4E2FF;
992
- --bh-sky-50: #EDF9FF;
993
- --bh-sky-500: #059FE5;
994
- --bh-sky-600: #0C85C3;
995
- --bh-sky-700: #036EA4;
996
849
  --bh-slider-indicator-gap: var(--bh-space-md-8);
997
850
  --bh-slider-pill-height: 72px;
998
851
  --bh-slider-pill-radius: var(--bh-radius-5xl-24);
999
852
  --bh-slider-pill-thumb-border-width: calc(var(--bh-border-width-strong) + var(--bh-border-width-default));
1000
853
  --bh-slider-pill-thumb-width: 126px;
1001
- --bh-slider-pill-track-bg: color-mix(in srgb, var(--bh-slider-range-bg, var(--bh-interactive-indicator-default)) 12%, var(--bh-bg-default));
1002
854
  --bh-slider-thumb-grip-width: calc(var(--bh-border-width-strong) + var(--bh-border-width-default));
1003
855
  --bh-slider-thumb-radius: var(--bh-radius-full);
1004
856
  --bh-slider-thumb-ring-width-lg: 9px;
@@ -1007,7 +859,6 @@
1007
859
  --bh-slider-thumb-size-lg: var(--bh-radius-6xl-28);
1008
860
  --bh-slider-thumb-size-md: var(--bh-space-5xl-24);
1009
861
  --bh-slider-thumb-size-sm: var(--bh-space-4xl-20);
1010
- --bh-slider-tick-bg: color-mix(in srgb, var(--bh-slider-range-bg, var(--bh-interactive-indicator-default)) 45%, transparent);
1011
862
  --bh-slider-tick-gap: var(--bh-space-xl-12);
1012
863
  --bh-slider-tick-size: var(--bh-space-sm-6);
1013
864
  --bh-slider-track-radius: var(--bh-radius-full);
@@ -1016,13 +867,6 @@
1016
867
  --bh-slider-track-size-sm: var(--bh-space-sm-6);
1017
868
  --bh-slider-vertical-height: var(--bh-space-13xl-160);
1018
869
  --bh-slider-width: var(--bh-space-18xl-320);
1019
- --bh-social-apple-bg: var(--bh-bg-always-dark);
1020
- --bh-social-apple-border: var(--bh-border-subtle);
1021
- --bh-social-apple-fg: var(--bh-content-on-color);
1022
- --bh-social-apple-hover: color-mix(in srgb, var(--bh-bg-always-dark) 88%, var(--bh-bg-always-white));
1023
- --bh-social-apple-icon: var(--bh-content-on-color);
1024
- --bh-social-apple-icon-border: var(--bh-border-subtle);
1025
- --bh-social-apple-outline-icon: var(--bh-bg-always-dark);
1026
870
  --bh-social-apple-width: 181px;
1027
871
  --bh-social-apple-width-rtl: 222px;
1028
872
  --bh-social-button-gap: var(--bh-space-md-8);
@@ -1034,44 +878,27 @@
1034
878
  --bh-social-button-radius: var(--bh-control-default);
1035
879
  --bh-social-facebook-bg: #1465CE;
1036
880
  --bh-social-facebook-border: transparent;
1037
- --bh-social-facebook-fg: var(--bh-content-on-color);
1038
881
  --bh-social-facebook-hover: #0F52A8;
1039
- --bh-social-facebook-icon: var(--bh-content-on-color);
1040
882
  --bh-social-facebook-outline-icon: var(--bh-social-facebook-bg);
1041
883
  --bh-social-facebook-width: 210px;
1042
884
  --bh-social-facebook-width-rtl: 254px;
1043
- --bh-social-google-bg: var(--bh-bg-always-dark);
1044
885
  --bh-social-google-blue: #4285F4;
1045
- --bh-social-google-border: var(--bh-border-subtle);
1046
- --bh-social-google-fg: var(--bh-content-on-color);
1047
886
  --bh-social-google-green: #34A853;
1048
- --bh-social-google-hover: color-mix(in srgb, var(--bh-bg-always-dark) 88%, var(--bh-bg-always-white));
1049
887
  --bh-social-google-red: #EA4335;
1050
888
  --bh-social-google-width: 191px;
1051
889
  --bh-social-google-width-rtl: 239px;
1052
890
  --bh-social-google-yellow: #FBBC05;
1053
891
  --bh-social-linkedin-bg: #0077B7;
1054
892
  --bh-social-linkedin-border: transparent;
1055
- --bh-social-linkedin-fg: var(--bh-content-on-color);
1056
893
  --bh-social-linkedin-hover: #006BA5;
1057
- --bh-social-linkedin-icon: var(--bh-content-on-color);
1058
894
  --bh-social-linkedin-outline-icon: var(--bh-social-linkedin-bg);
1059
895
  --bh-social-linkedin-width: 200px;
1060
896
  --bh-social-linkedin-width-rtl: 252px;
1061
- --bh-social-twitter-bg: var(--bh-bg-always-dark);
1062
- --bh-social-twitter-border: var(--bh-border-subtle);
1063
- --bh-social-twitter-fg: var(--bh-content-on-color);
1064
- --bh-social-twitter-hover: color-mix(in srgb, var(--bh-bg-always-dark) 88%, var(--bh-bg-always-white));
1065
- --bh-social-twitter-icon: var(--bh-content-on-color);
1066
- --bh-social-twitter-icon-border: var(--bh-border-subtle);
1067
- --bh-social-twitter-outline-icon: var(--bh-bg-always-dark);
1068
897
  --bh-social-twitter-width: 190px;
1069
898
  --bh-social-twitter-width-rtl: 231px;
1070
899
  --bh-social-whatsapp-bg: #087D34;
1071
900
  --bh-social-whatsapp-border: transparent;
1072
- --bh-social-whatsapp-fg: var(--bh-content-on-color);
1073
901
  --bh-social-whatsapp-hover: #066428;
1074
- --bh-social-whatsapp-icon: var(--bh-content-on-color);
1075
902
  --bh-social-whatsapp-outline-icon: var(--bh-social-whatsapp-bg);
1076
903
  --bh-social-whatsapp-width: 214px;
1077
904
  --bh-social-whatsapp-width-rtl: 250px;
@@ -1109,6 +936,8 @@
1109
936
  --bh-steps-horizontal-width: 900px;
1110
937
  --bh-steps-indicator-panel-width: 400px;
1111
938
  --bh-steps-vertical-width: 240px;
939
+ --bh-streaming-text-caret-duration: 1s;
940
+ --bh-streaming-text-caret-width: var(--bh-space-xxs-2);
1112
941
  --bh-table-checkbox-opacity: var(--bh-opacity-100);
1113
942
  --bh-table-checkbox-opacity-hidden: var(--bh-opacity-0);
1114
943
  --bh-table-min-width: 960px;
@@ -1116,6 +945,8 @@
1116
945
  --bh-tag-active-border-width: calc(var(--bh-border-width-default) + (var(--bh-border-width-default) / 2));
1117
946
  --bh-tag-focus-ring-inset: calc(var(--bh-space-xxxs-1) * -1);
1118
947
  --bh-tag-focus-ring-width: var(--bh-space-xs-4);
948
+ --bh-task-list-icon-size: var(--bh-space-3xl-16);
949
+ --bh-task-list-stagger: 50ms;
1119
950
  --bh-text-base-font-size: var(--bh-text-body-md-regular-font-size);
1120
951
  --bh-text-base-font-weight: var(--bh-text-body-md-regular-font-weight);
1121
952
  --bh-text-base-letter-spacing: var(--bh-text-body-md-regular-letter-spacing);
@@ -1315,6 +1146,9 @@
1315
1146
  --bh-textarea-tag-avatar-size: var(--bh-space-3xl-16);
1316
1147
  --bh-textarea-tag-height: var(--bh-space-5xl-24);
1317
1148
  --bh-textarea-width: var(--bh-space-18xl-320);
1149
+ --bh-thinking-reasoning-fade: var(--bh-space-3xl-16);
1150
+ --bh-thinking-reasoning-max-height: 180px;
1151
+ --bh-thinking-reasoning-width: 360px;
1318
1152
  --bh-timeline-grid-width: 1000px;
1319
1153
  --bh-timeline-narrow-width: 600px;
1320
1154
  --bh-timeline-sidebar-width: 240px;
@@ -1344,125 +1178,373 @@
1344
1178
  --bh-z-overlay: 50;
1345
1179
  --bh-z-popover: 20;
1346
1180
  --bh-z-raised: 10;
1347
- --border: var(--bh-border-default);
1348
- --card: var(--bh-bg-raised);
1349
- --card-foreground: var(--bh-content-default);
1350
- --danger-ring: var(--bh-border-focus-danger);
1351
- --destructive: var(--bh-interactive-danger-default);
1352
- --destructive-foreground: var(--bh-content-on-color);
1353
- --destructive-hover: var(--bh-interactive-danger-hover);
1354
- --destructive-pressed: var(--bh-interactive-danger-pressed);
1355
- --destructive-soft: var(--bh-interactive-danger-soft-default);
1356
- --destructive-soft-foreground: var(--bh-content-danger-default);
1357
- --destructive-soft-hover: var(--bh-interactive-danger-soft-hover);
1358
- --destructive-soft-pressed: var(--bh-interactive-danger-soft-pressed);
1359
1181
  --font-sans: var(--bh-font-family);
1360
- --foreground: var(--bh-content-default);
1361
- --ghost: var(--bh-interactive-ghost-default);
1362
- --ghost-hover: var(--bh-interactive-ghost-hover);
1363
- --ghost-pressed: var(--bh-interactive-ghost-pressed);
1364
- --input: var(--bh-border-input);
1365
- --muted: var(--bh-bg-muted);
1366
- --muted-foreground: var(--bh-content-muted);
1367
- --outline: var(--bh-interactive-outlined-default);
1368
- --outline-hover: var(--bh-interactive-outlined-hover);
1369
- --outline-pressed: var(--bh-interactive-outlined-pressed);
1370
- --popover: var(--bh-bg-raised);
1371
- --popover-foreground: var(--bh-content-default);
1372
- --primary: var(--bh-interactive-brand-default);
1373
- --primary-foreground: var(--bh-content-on-brand);
1374
- --primary-hover: var(--bh-interactive-brand-hover);
1375
- --primary-pressed: var(--bh-interactive-brand-pressed);
1376
1182
  --radius: var(--bh-control-default);
1377
1183
  --radius-lg: var(--bh-radius-lg-8);
1378
1184
  --radius-md: var(--bh-radius-md-6);
1379
1185
  --radius-sm: var(--bh-radius-sm-4);
1380
1186
  --radius-xl: var(--bh-radius-xl-10);
1381
- --ring: var(--bh-border-focus);
1382
- --secondary: var(--bh-interactive-secondary-default);
1383
- --secondary-foreground: var(--bh-content-default);
1384
- --secondary-hover: var(--bh-interactive-secondary-hover);
1385
- --secondary-pressed: var(--bh-interactive-secondary-pressed);
1386
- --shadow-2xl: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), 0px 12px 12px -6px rgb(0 0 0 / 0.06), 0px 24px 24px -12px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1387
- --shadow-3xl: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), 0px 12px 12px -6px rgb(0 0 0 / 0.06), 0px 24px 24px -12px rgb(0 0 0 / 0.06), 0px 48px 48px -24px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1388
- --shadow-accordion-item: none;
1389
- --shadow-avatar-badge: none;
1390
- --shadow-badge: none;
1391
- --shadow-button: var(--shadow-button-raised);
1392
- --shadow-button-active: var(--shadow-button-raised);
1393
- --shadow-button-danger-focus: var(--shadow-component-danger-focus-ring);
1394
- --shadow-button-focus: var(--shadow-component-focus-ring);
1395
- --shadow-button-group: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-group-border), var(--shadow-component-default);
1396
- --shadow-button-group-focus: var(--shadow-button-group), var(--shadow-component-focus-ring);
1397
- --shadow-button-group-focus-ring: var(--shadow-component-focus-ring);
1398
- --shadow-button-hover: var(--shadow-button-raised);
1399
- --shadow-button-raised: var(--shadow-component-raised);
1400
- --shadow-button-secondary: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-secondary-border, var(--bh-border-default)), var(--shadow-button-surface);
1401
- --shadow-button-secondary-focus: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-secondary-focus-border, var(--bh-border-brand-strong)), var(--shadow-button-surface), var(--shadow-button-focus);
1402
- --shadow-button-soft: inset 0px 1px 0px 0px rgb(255 255 255 / 0);
1403
- --shadow-button-surface: var(--shadow-component-surface);
1404
- --shadow-checkbox: var(--shadow-checkbox-control);
1405
- --shadow-checkbox-card: inset 0px 0px 0px var(--bh-checkbox-card-border-width, var(--bh-border-width-default)) var(--bh-checkbox-card-border, var(--bh-border-subtle)), var(--shadow-component-default);
1406
- --shadow-checkbox-card-focus: var(--shadow-checkbox-card), var(--shadow-button-focus);
1407
- --shadow-checkbox-control: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-checkbox-control-border, var(--bh-border-input)), var(--shadow-component-default);
1408
- --shadow-checkbox-focus: var(--shadow-checkbox), var(--shadow-button-focus);
1409
- --shadow-component-danger-focus-ring: 0px 0px 0px var(--bh-focus-ring-width) var(--bh-border-focus-danger);
1410
- --shadow-component-danger-focus-stroke: 0px 0px 0px var(--bh-border-width-default) var(--bh-bg-default), 0px 0px 0px calc(var(--bh-border-width-default) + var(--bh-focus-ring-width)) var(--bh-border-focus-danger);
1411
- --shadow-component-default: 0px 1px 2px 0px rgb(15 17 20 / 0.05), inset 0px -1px 0px 0px rgb(0 0 0 / 0.08);
1412
- --shadow-component-focus-ring: 0px 0px 0px var(--bh-focus-ring-width) var(--bh-border-focus);
1413
- --shadow-component-focus-stroke: 0px 0px 0px var(--bh-border-width-default) var(--bh-bg-default), 0px 0px 0px calc(var(--bh-border-width-default) + var(--bh-focus-ring-width)) var(--bh-border-focus);
1414
- --shadow-component-raised: inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px -1px 0px 0px rgb(0 0 0 / 0.08), 0px 1px 2px 0px rgb(15 17 20 / 0.05);
1415
- --shadow-component-surface: inset 0px -1px 0px 0px rgb(0 0 0 / 0.08), 0px 1px 2px 0px rgb(15 17 20 / 0.05);
1416
- --shadow-date-month-year-list: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-subtle);
1417
- --shadow-date-surface: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-date-surface-border, var(--bh-border-subtle)), var(--shadow-lg);
1418
- --shadow-date-time-input: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-input);
1419
- --shadow-input: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-input-border, var(--bh-border-input)), var(--shadow-component-default);
1420
- --shadow-input-focus-ring: var(--shadow-component-focus-stroke);
1421
- --shadow-lg: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1422
- --shadow-md: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1423
- --shadow-menu: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-menu-border), var(--shadow-lg);
1424
- --shadow-pagination-active: var(--shadow-button-raised);
1425
- --shadow-pagination-control: var(--shadow-button-soft);
1426
- --shadow-pagination-focus: var(--shadow-button-focus);
1427
- --shadow-popover: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-popover-border), var(--shadow-lg);
1428
- --shadow-progress-slider-thumb-focus: var(--shadow-component-focus-ring);
1429
- --shadow-radio-card: inset 0px 0px 0px var(--bh-radio-card-border-width, var(--bh-border-width-default)) var(--bh-radio-card-border, var(--bh-border-default)), var(--shadow-radio-card-surface);
1430
- --shadow-radio-card-disabled: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-disabled);
1431
- --shadow-radio-card-surface: var(--shadow-component-default);
1432
- --shadow-radio-control: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-radio-control-border, var(--bh-border-input)), var(--shadow-component-default);
1433
- --shadow-select-checkbox: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-checkbox-border, var(--bh-border-input)), var(--shadow-component-default);
1434
- --shadow-select-danger-focus-ring: var(--shadow-component-danger-focus-stroke);
1435
- --shadow-select-focus-ring: var(--shadow-component-focus-stroke);
1436
- --shadow-select-menu: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-menu-border), var(--shadow-lg);
1437
- --shadow-select-trigger: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-trigger-border-current, var(--bh-select-trigger-border)), var(--shadow-component-default);
1438
- --shadow-sidebar: inset calc(var(--bh-border-width-default) * -1) 0px 0px 0px var(--bh-sidebar-border), var(--shadow-component-surface);
1439
- --shadow-slider-thumb: var(--shadow-md);
1440
- --shadow-slider-thumb-focus: var(--shadow-slider-thumb), var(--shadow-component-focus-ring);
1441
- --shadow-slider-tooltip: var(--shadow-lg);
1442
- --shadow-sm: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1443
- --shadow-social-button: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-social-button-border, transparent), var(--shadow-component-default);
1444
- --shadow-social-button-focus: var(--shadow-social-button), var(--shadow-component-focus-ring);
1445
- --shadow-social-button-focus-ring: var(--shadow-component-focus-ring);
1446
- --shadow-textarea: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-textarea-border, var(--bh-border-input)), var(--shadow-component-default);
1447
- --shadow-xl: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), 0px 12px 12px -6px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1448
- --shadow-xs: 0px 0px 0px 1px rgb(0 0 0 / 0.06), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1449
- --soft: var(--bh-interactive-soft-default);
1450
- --soft-hover: var(--bh-interactive-soft-hover);
1451
- --soft-pressed: var(--bh-interactive-soft-pressed);
1452
- --success: var(--bh-bg-success-default);
1453
- --success-foreground: var(--bh-content-on-color);
1454
- --success-hover: var(--bh-bg-success-bold);
1455
- --success-pressed: var(--bh-bg-success-strong);
1456
- --warning: var(--bh-bg-warning-default);
1457
- --warning-foreground: var(--bh-content-on-light);
1458
- --warning-hover: var(--bh-bg-warning-bold);
1459
- --warning-pressed: var(--bh-bg-warning-strong);
1460
- --warning-soft: var(--bh-bg-warning-subtle);
1461
- --warning-soft-foreground: var(--bh-content-warning-default);
1462
- --warning-soft-hover: var(--bh-bg-warning-soft);
1463
1187
  }
1464
1188
 
1465
- /* Banhaten brand theme light token modes: generated from tokens/banhaten.tokens.json. */
1189
+ :root,
1190
+ [data-theme="gray"],
1191
+ [data-theme="blue"],
1192
+ [data-theme="brown"],
1193
+ [data-theme="orange"],
1194
+ [data-theme="green"],
1195
+ [data-theme="purple"],
1196
+ [data-theme="teal"] {
1197
+ --bh-alpha-alpha-transparent: rgb(255 255 255 / 0);
1198
+ --bh-alpha-alpha-transparent-to-100: rgb(255 255 255 / 0);
1199
+ --bh-alpha-alpha-transparent-to-500: rgb(255 255 255 / 0);
1200
+ --bh-amber-100: #FFE7BE;
1201
+ --bh-amber-50: #FFF2DB;
1202
+ --bh-amber-700: #AC4C03;
1203
+ --bh-aqua-100: #BBFAEA;
1204
+ --bh-aqua-200: #87F0D5;
1205
+ --bh-aqua-50: #DBFFF6;
1206
+ --bh-aqua-600: #03906E;
1207
+ --bh-aqua-700: #076F57;
1208
+ --bh-bg-accent-amber-default: var(--bh-amber-500);
1209
+ --bh-bg-accent-amber-soft: var(--bh-amber-100);
1210
+ --bh-bg-accent-amber-subtle: var(--bh-amber-50);
1211
+ --bh-bg-accent-aqua-soft: var(--bh-aqua-100);
1212
+ --bh-bg-accent-aqua-subtle: var(--bh-aqua-50);
1213
+ --bh-bg-accent-blue-soft: var(--bh-blue-100);
1214
+ --bh-bg-accent-blue-subtle: var(--bh-blue-50);
1215
+ --bh-bg-accent-fuchsia-soft: var(--bh-fuchsia-100);
1216
+ --bh-bg-accent-fuchsia-subtle: var(--bh-fuchsia-50);
1217
+ --bh-bg-accent-golden-bold: var(--bh-golden-600);
1218
+ --bh-bg-accent-golden-default: var(--bh-golden-400);
1219
+ --bh-bg-accent-golden-soft: var(--bh-golden-100);
1220
+ --bh-bg-accent-golden-subtle: var(--bh-golden-50);
1221
+ --bh-bg-accent-green-soft: var(--bh-green-100);
1222
+ --bh-bg-accent-green-subtle: var(--bh-green-50);
1223
+ --bh-bg-accent-lime-soft: var(--bh-lime-100);
1224
+ --bh-bg-accent-lime-subtle: var(--bh-lime-50);
1225
+ --bh-bg-accent-purple-soft: var(--bh-purple-100);
1226
+ --bh-bg-accent-purple-subtle: var(--bh-purple-50);
1227
+ --bh-bg-accent-red-default: var(--bh-red-500);
1228
+ --bh-bg-accent-red-soft: var(--bh-red-100);
1229
+ --bh-bg-accent-red-subtle: var(--bh-red-50);
1230
+ --bh-bg-accent-rose-soft: var(--bh-rose-100);
1231
+ --bh-bg-accent-rose-subtle: var(--bh-rose-50);
1232
+ --bh-bg-accent-sky-soft: var(--bh-sky-100);
1233
+ --bh-bg-accent-sky-subtle: var(--bh-sky-50);
1234
+ --bh-bg-always-dark: var(--bh-colors-neutral-900);
1235
+ --bh-bg-brand-bold: var(--bh-colors-brand-surface-bold-light);
1236
+ --bh-bg-brand-default: var(--bh-colors-brand-surface-base);
1237
+ --bh-bg-brand-soft: var(--bh-colors-brand-surface-soft-light);
1238
+ --bh-bg-brand-strong: var(--bh-colors-brand-surface-strong-light);
1239
+ --bh-bg-brand-subtle: var(--bh-colors-brand-surface-subtle-light);
1240
+ --bh-bg-danger-default: var(--bh-red-500);
1241
+ --bh-bg-danger-soft: var(--bh-red-100);
1242
+ --bh-bg-danger-subtle: var(--bh-red-50);
1243
+ --bh-bg-default: var(--bh-base-white);
1244
+ --bh-bg-default-hover: var(--bh-colors-neutral-50);
1245
+ --bh-bg-dim: var(--bh-colors-neutral-200);
1246
+ --bh-bg-dim-hover: var(--bh-colors-neutral-300);
1247
+ --bh-bg-disabled: var(--bh-colors-neutral-50);
1248
+ --bh-bg-divider: var(--bh-colors-neutral-alpha-300);
1249
+ --bh-bg-grouped: var(--bh-colors-neutral-100);
1250
+ --bh-bg-grouped-surface: var(--bh-base-white);
1251
+ --bh-bg-info-bold: var(--bh-blue-600);
1252
+ --bh-bg-info-default: var(--bh-blue-500);
1253
+ --bh-bg-info-soft: var(--bh-blue-100);
1254
+ --bh-bg-info-strong: var(--bh-blue-700);
1255
+ --bh-bg-info-subtle: var(--bh-blue-50);
1256
+ --bh-bg-inverse: var(--bh-colors-neutral-950);
1257
+ --bh-bg-muted: var(--bh-colors-neutral-100);
1258
+ --bh-bg-muted-hover: var(--bh-colors-neutral-200);
1259
+ --bh-bg-neutral-bold: var(--bh-colors-neutral-800);
1260
+ --bh-bg-neutral-default: var(--bh-colors-neutral-700);
1261
+ --bh-bg-neutral-medium: var(--bh-colors-neutral-500);
1262
+ --bh-bg-neutral-soft: var(--bh-colors-neutral-alpha-200);
1263
+ --bh-bg-neutral-subtle: var(--bh-colors-neutral-alpha-100);
1264
+ --bh-bg-raised: var(--bh-base-white);
1265
+ --bh-bg-raised-hover: var(--bh-colors-neutral-50);
1266
+ --bh-bg-raised-subtle: var(--bh-colors-neutral-50);
1267
+ --bh-bg-subtle: var(--bh-colors-neutral-50);
1268
+ --bh-bg-subtle-alpha: var(--bh-colors-neutral-50);
1269
+ --bh-bg-subtle-hover: var(--bh-colors-neutral-100);
1270
+ --bh-bg-success-bold: var(--bh-green-600);
1271
+ --bh-bg-success-default: var(--bh-green-500);
1272
+ --bh-bg-success-soft: var(--bh-green-100);
1273
+ --bh-bg-success-strong: var(--bh-green-700);
1274
+ --bh-bg-success-subtle: var(--bh-green-50);
1275
+ --bh-bg-warning-bold: var(--bh-amber-600);
1276
+ --bh-bg-warning-default: var(--bh-amber-500);
1277
+ --bh-bg-warning-soft: var(--bh-amber-100);
1278
+ --bh-bg-warning-strong: var(--bh-amber-700);
1279
+ --bh-bg-warning-subtle: var(--bh-amber-50);
1280
+ --bh-blue-100: #D6EAFF;
1281
+ --bh-blue-50: #EBF5FF;
1282
+ --bh-blue-700: #1D49BF;
1283
+ --bh-border-accent-amber-subtle: var(--bh-amber-300);
1284
+ --bh-border-accent-aqua-subtle: var(--bh-aqua-200);
1285
+ --bh-border-accent-blue-subtle: var(--bh-blue-200);
1286
+ --bh-border-accent-fuchsia-subtle: var(--bh-fuchsia-200);
1287
+ --bh-border-accent-golden-strong: var(--bh-golden-600);
1288
+ --bh-border-accent-golden-subtle: var(--bh-golden-300);
1289
+ --bh-border-accent-green-subtle: var(--bh-green-200);
1290
+ --bh-border-accent-lime-strong: var(--bh-lime-600);
1291
+ --bh-border-accent-lime-subtle: var(--bh-lime-200);
1292
+ --bh-border-accent-purple-subtle: var(--bh-purple-200);
1293
+ --bh-border-accent-red-subtle: var(--bh-red-200);
1294
+ --bh-border-accent-rose-subtle: var(--bh-rose-200);
1295
+ --bh-border-accent-sky-subtle: var(--bh-sky-200);
1296
+ --bh-border-brand-strong: var(--bh-colors-brand-border-border-strong);
1297
+ --bh-border-brand-subtle: var(--bh-colors-brand-border-border-subtle);
1298
+ --bh-border-danger-subtle: var(--bh-red-300);
1299
+ --bh-border-default: var(--bh-colors-neutral-alpha-400);
1300
+ --bh-border-disabled: var(--bh-colors-neutral-alpha-200);
1301
+ --bh-border-focus: var(--bh-colors-brand-focused-light);
1302
+ --bh-border-focus-danger: var(--bh-red-400);
1303
+ --bh-border-info-subtle: var(--bh-blue-200);
1304
+ --bh-border-input: var(--bh-colors-neutral-alpha-400);
1305
+ --bh-border-inverse: var(--bh-base-white);
1306
+ --bh-border-inverse-subtle: rgb(255 255 255 / 0.15);
1307
+ --bh-border-strong: var(--bh-colors-neutral-800);
1308
+ --bh-border-subtle: var(--bh-colors-neutral-alpha-300);
1309
+ --bh-border-success-subtle: var(--bh-green-200);
1310
+ --bh-border-warning-subtle: var(--bh-amber-300);
1311
+ --bh-chart-categorical-2: var(--bh-purple-700);
1312
+ --bh-chart-categorical-3: var(--bh-amber-500);
1313
+ --bh-chart-categorical-4: var(--bh-rose-700);
1314
+ --bh-chart-categorical-5: var(--bh-blue-900);
1315
+ --bh-chart-categorical-7: var(--bh-rose-950);
1316
+ --bh-chart-categorical-8: var(--bh-amber-700);
1317
+ --bh-chart-neutral-default: var(--bh-colors-neutral-400);
1318
+ --bh-content-accent-amber-default: var(--bh-amber-600);
1319
+ --bh-content-accent-amber-strong: var(--bh-amber-800);
1320
+ --bh-content-accent-aqua-default: var(--bh-aqua-600);
1321
+ --bh-content-accent-aqua-strong: var(--bh-aqua-700);
1322
+ --bh-content-accent-blue-default: var(--bh-blue-600);
1323
+ --bh-content-accent-blue-strong: var(--bh-blue-700);
1324
+ --bh-content-accent-fuchsia-default: var(--bh-fuchsia-600);
1325
+ --bh-content-accent-fuchsia-strong: var(--bh-fuchsia-700);
1326
+ --bh-content-accent-golden-default: var(--bh-golden-700);
1327
+ --bh-content-accent-golden-strong: var(--bh-golden-800);
1328
+ --bh-content-accent-green-default: var(--bh-green-600);
1329
+ --bh-content-accent-green-strong: var(--bh-green-700);
1330
+ --bh-content-accent-lime-default: var(--bh-lime-600);
1331
+ --bh-content-accent-lime-strong: var(--bh-lime-700);
1332
+ --bh-content-accent-purple-default: var(--bh-purple-600);
1333
+ --bh-content-accent-purple-strong: var(--bh-purple-700);
1334
+ --bh-content-accent-red-default: var(--bh-red-600);
1335
+ --bh-content-accent-red-strong: var(--bh-red-700);
1336
+ --bh-content-accent-rose-default: var(--bh-rose-600);
1337
+ --bh-content-accent-rose-strong: var(--bh-rose-700);
1338
+ --bh-content-accent-sky-default: var(--bh-sky-600);
1339
+ --bh-content-accent-sky-strong: var(--bh-sky-700);
1340
+ --bh-content-brand-default: var(--bh-colors-brand-content-light);
1341
+ --bh-content-brand-strong: var(--bh-colors-brand-content-strong-light);
1342
+ --bh-content-danger-default: var(--bh-red-600);
1343
+ --bh-content-danger-strong: var(--bh-red-700);
1344
+ --bh-content-default: var(--bh-colors-neutral-950);
1345
+ --bh-content-disabled: var(--bh-colors-neutral-600);
1346
+ --bh-content-information-default: var(--bh-blue-600);
1347
+ --bh-content-information-strong: var(--bh-blue-700);
1348
+ --bh-content-inverse: var(--bh-base-white);
1349
+ --bh-content-link: var(--bh-colors-brand-link-light);
1350
+ --bh-content-link-hover: var(--bh-colors-brand-link-hover-light);
1351
+ --bh-content-muted: #627084;
1352
+ --bh-content-on-brand: var(--bh-colors-brand-color-on-brand-light);
1353
+ --bh-content-on-light: var(--bh-colors-neutral-950);
1354
+ --bh-content-on-neutral: var(--bh-base-white);
1355
+ --bh-content-on-success: var(--bh-base-white);
1356
+ --bh-content-on-warning: var(--bh-base-white);
1357
+ --bh-content-subtle: var(--bh-colors-neutral-800);
1358
+ --bh-content-success-default: var(--bh-green-600);
1359
+ --bh-content-success-strong: var(--bh-green-700);
1360
+ --bh-content-warning-default: var(--bh-amber-600);
1361
+ --bh-content-warning-strong: var(--bh-amber-700);
1362
+ --bh-fuchsia-100: #FED6FF;
1363
+ --bh-fuchsia-200: #FEB9FF;
1364
+ --bh-fuchsia-50: #FFEBFF;
1365
+ --bh-fuchsia-600: #C20AC5;
1366
+ --bh-fuchsia-700: #92089F;
1367
+ --bh-golden-100: #FFEDAE;
1368
+ --bh-golden-300: #FAD658;
1369
+ --bh-golden-50: #FFF5D1;
1370
+ --bh-golden-600: #C98B04;
1371
+ --bh-golden-700: #A96C03;
1372
+ --bh-green-100: #BCFAD2;
1373
+ --bh-green-200: #89EBAC;
1374
+ --bh-green-50: #DBFFE8;
1375
+ --bh-green-700: #07712C;
1376
+ --bh-interactive-brand-default: var(--bh-colors-brand-interactive-default);
1377
+ --bh-interactive-brand-disabled: var(--bh-colors-neutral-alpha-100);
1378
+ --bh-interactive-brand-hover: var(--bh-colors-brand-interactive-hover);
1379
+ --bh-interactive-brand-pressed: var(--bh-colors-brand-interactive-pressed);
1380
+ --bh-interactive-checkbox-content: var(--bh-base-white);
1381
+ --bh-interactive-checkbox-default: var(--bh-colors-brand-checkbox-bg-default);
1382
+ --bh-interactive-checkbox-hover: var(--bh-colors-brand-checkbox-bg-hover);
1383
+ --bh-interactive-danger-default: var(--bh-red-500);
1384
+ --bh-interactive-danger-disabled: var(--bh-colors-neutral-alpha-100);
1385
+ --bh-interactive-danger-hover: var(--bh-red-600);
1386
+ --bh-interactive-danger-pressed: var(--bh-red-500);
1387
+ --bh-interactive-danger-soft-default: var(--bh-red-50);
1388
+ --bh-interactive-danger-soft-disabled: var(--bh-colors-neutral-alpha-100);
1389
+ --bh-interactive-danger-soft-hover: var(--bh-red-100);
1390
+ --bh-interactive-danger-soft-pressed: var(--bh-red-50);
1391
+ --bh-interactive-ghost-active: var(--bh-colors-neutral-alpha-100);
1392
+ --bh-interactive-ghost-default: rgb(0 0 0 / 0);
1393
+ --bh-interactive-ghost-disabled: rgb(0 0 0 / 0);
1394
+ --bh-interactive-ghost-hover: var(--bh-colors-neutral-alpha-50);
1395
+ --bh-interactive-ghost-pressed: var(--bh-colors-neutral-alpha-100);
1396
+ --bh-interactive-indicator-default: var(--bh-colors-brand-indicator);
1397
+ --bh-interactive-input-default: var(--bh-base-white);
1398
+ --bh-interactive-input-disabled: var(--bh-colors-neutral-alpha-50);
1399
+ --bh-interactive-input-soft: var(--bh-colors-neutral-alpha-100);
1400
+ --bh-interactive-input-soft-disabled: var(--bh-colors-neutral-alpha-50);
1401
+ --bh-interactive-outlined-default: rgb(0 0 0 / 0);
1402
+ --bh-interactive-outlined-disabled: rgb(0 0 0 / 0);
1403
+ --bh-interactive-outlined-hover: var(--bh-colors-neutral-alpha-50);
1404
+ --bh-interactive-outlined-pressed: var(--bh-colors-neutral-alpha-100);
1405
+ --bh-interactive-radiobutton-default: var(--bh-colors-brand-radiobutton-bg-default);
1406
+ --bh-interactive-radiobutton-hover: var(--bh-colors-brand-radiobutton-bg-hover);
1407
+ --bh-interactive-secondary-default: var(--bh-colors-neutral-50);
1408
+ --bh-interactive-secondary-disabled: var(--bh-colors-neutral-alpha-100);
1409
+ --bh-interactive-secondary-hover: var(--bh-colors-neutral-100);
1410
+ --bh-interactive-secondary-pressed: var(--bh-colors-neutral-200);
1411
+ --bh-interactive-soft-default: var(--bh-colors-neutral-alpha-100);
1412
+ --bh-interactive-soft-disabled: var(--bh-colors-neutral-alpha-100);
1413
+ --bh-interactive-soft-hover: var(--bh-colors-neutral-alpha-200);
1414
+ --bh-interactive-soft-pressed: var(--bh-colors-neutral-alpha-300);
1415
+ --bh-interactive-success-default: var(--bh-green-700);
1416
+ --bh-interactive-success-hover: var(--bh-green-800);
1417
+ --bh-interactive-success-pressed: var(--bh-green-900);
1418
+ --bh-interactive-switch-active-disabled: var(--bh-green-100);
1419
+ --bh-interactive-switch-default: var(--bh-colors-neutral-400);
1420
+ --bh-interactive-switch-disabled: var(--bh-colors-neutral-alpha-100);
1421
+ --bh-interactive-switch-handle-disabled: var(--bh-colors-neutral-50);
1422
+ --bh-interactive-switch-hover: var(--bh-colors-neutral-500);
1423
+ --bh-interactive-table-header: var(--bh-colors-neutral-alpha-50);
1424
+ --bh-interactive-warning-default: var(--bh-amber-700);
1425
+ --bh-interactive-warning-hover: var(--bh-amber-800);
1426
+ --bh-interactive-warning-pressed: var(--bh-amber-900);
1427
+ --bh-lime-100: #E8FCA8;
1428
+ --bh-lime-200: #D4F273;
1429
+ --bh-lime-50: #F4FFD1;
1430
+ --bh-lime-600: #7CA203;
1431
+ --bh-lime-700: #668303;
1432
+ --bh-purple-100: #F0DEFF;
1433
+ --bh-purple-200: #E3C3FF;
1434
+ --bh-purple-50: #F7EDFF;
1435
+ --bh-purple-600: #8216DB;
1436
+ --bh-purple-700: #610FAD;
1437
+ --bh-red-100: #FFDBDF;
1438
+ --bh-red-200: #FFBFC6;
1439
+ --bh-red-50: #FFEDEF;
1440
+ --bh-rose-100: #FFD6E7;
1441
+ --bh-rose-50: #FFEBF3;
1442
+ --bh-rose-700: #A7094D;
1443
+ --bh-rose-950: #44071F;
1444
+ --bh-sky-100: #CFF0FF;
1445
+ --bh-sky-200: #A4E2FF;
1446
+ --bh-sky-50: #EDF9FF;
1447
+ --bh-sky-700: #036EA4;
1448
+ --elevation-01: 0px 0px 0px 1px rgb(0 0 0 / 0.06), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1449
+ --elevation-02: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1450
+ --elevation-03: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1451
+ --elevation-04: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1452
+ --elevation-05: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), 0px 12px 12px -6px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1453
+ --elevation-06: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), 0px 12px 12px -6px rgb(0 0 0 / 0.06), 0px 24px 24px -12px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1454
+ --elevation-07: 0px 0px 0px 1px rgb(0 0 0 / 0.06), 0px 1px 1px -0.5px rgb(0 0 0 / 0.06), 0px 3px 3px -1.5px rgb(0 0 0 / 0.06), 0px 6px 6px -3px rgb(0 0 0 / 0.06), 0px 12px 12px -6px rgb(0 0 0 / 0.06), 0px 24px 24px -12px rgb(0 0 0 / 0.06), 0px 48px 48px -24px rgb(0 0 0 / 0.06), inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0);
1455
+ --elevation-component-default: 0px 1px 2px 0px rgb(15 17 20 / 0.05), inset 0px -1px 0px 0px rgb(0 0 0 / 0.08);
1456
+ --elevation-component-raised: inset 0px 1px 0px 0px rgb(255 255 255 / 0), inset 0px -1px 0px 0px rgb(0 0 0 / 0.08), 0px 1px 2px 0px rgb(15 17 20 / 0.05);
1457
+ --elevation-component-surface: inset 0px -1px 0px 0px rgb(0 0 0 / 0.08), 0px 1px 2px 0px rgb(15 17 20 / 0.05);
1458
+ }
1459
+
1460
+ :root,
1461
+ [data-theme="gray"],
1462
+ [data-theme="blue"],
1463
+ [data-theme="brown"],
1464
+ [data-theme="green"],
1465
+ [data-theme="purple"],
1466
+ [data-theme="teal"] {
1467
+ --bh-colors-brand-color-on-brand-light: var(--bh-base-white);
1468
+ }
1469
+
1470
+ :root,
1471
+ [data-theme="gray"],
1472
+ [data-theme="blue"] {
1473
+ --bh-colors-neutral-100: var(--bh-gray-100);
1474
+ --bh-colors-neutral-200: var(--bh-gray-200);
1475
+ --bh-colors-neutral-300: var(--bh-gray-300);
1476
+ --bh-colors-neutral-400: var(--bh-gray-400);
1477
+ --bh-colors-neutral-50: var(--bh-gray-50);
1478
+ --bh-colors-neutral-500: var(--bh-gray-500);
1479
+ --bh-colors-neutral-600: var(--bh-gray-600);
1480
+ --bh-colors-neutral-700: var(--bh-gray-700);
1481
+ --bh-colors-neutral-800: var(--bh-gray-800);
1482
+ --bh-colors-neutral-900: var(--bh-gray-900);
1483
+ --bh-colors-neutral-950: var(--bh-gray-950);
1484
+ --bh-colors-neutral-alpha-100: var(--bh-gray-alpha-100);
1485
+ --bh-colors-neutral-alpha-200: var(--bh-gray-alpha-200);
1486
+ --bh-colors-neutral-alpha-300: var(--bh-gray-alpha-300);
1487
+ --bh-colors-neutral-alpha-400: var(--bh-gray-alpha-400);
1488
+ --bh-colors-neutral-alpha-50: var(--bh-gray-alpha-50);
1489
+ --bh-colors-neutral-alpha-500: var(--bh-gray-alpha-500);
1490
+ --bh-gray-100: #F5F5F5;
1491
+ --bh-gray-200: #F0F0F0;
1492
+ --bh-gray-300: #EBEBEB;
1493
+ --bh-gray-400: #DBDBDB;
1494
+ --bh-gray-50: #FAFAFA;
1495
+ --bh-gray-500: #BFBFBF;
1496
+ --bh-gray-600: #ADADAD;
1497
+ --bh-gray-700: #8C8C8C;
1498
+ --bh-gray-800: #595959;
1499
+ --bh-gray-900: #2E2E2E;
1500
+ --bh-gray-950: #1A1A1A;
1501
+ --bh-gray-alpha-100: rgb(0 0 0 / 0.06);
1502
+ --bh-gray-alpha-200: rgb(0 0 0 / 0.08);
1503
+ --bh-gray-alpha-300: rgb(0 0 0 / 0.1);
1504
+ --bh-gray-alpha-400: rgb(0 0 0 / 0.14);
1505
+ --bh-gray-alpha-50: rgb(0 0 0 / 0.04);
1506
+ --bh-gray-alpha-500: rgb(0 0 0 / 0.25);
1507
+ }
1508
+
1509
+ :root,
1510
+ [data-theme="gray"],
1511
+ [data-theme="blue"],
1512
+ [data-theme="brown"] {
1513
+ --bh-colors-neutral-alpha-dark-100: var(--bh-gray-dark-alpha-100);
1514
+ --bh-colors-neutral-alpha-dark-200: var(--bh-gray-dark-alpha-200);
1515
+ --bh-colors-neutral-alpha-dark-300: var(--bh-gray-dark-alpha-300);
1516
+ --bh-colors-neutral-alpha-dark-400: var(--bh-gray-dark-alpha-400);
1517
+ --bh-colors-neutral-alpha-dark-50: var(--bh-gray-dark-alpha-50);
1518
+ --bh-colors-neutral-alpha-dark-500: var(--bh-gray-dark-alpha-500);
1519
+ --bh-colors-neutral-dark-100: var(--bh-gray-dark-100);
1520
+ --bh-colors-neutral-dark-200: var(--bh-gray-dark-200);
1521
+ --bh-colors-neutral-dark-300: var(--bh-gray-dark-300);
1522
+ --bh-colors-neutral-dark-400: var(--bh-gray-dark-400);
1523
+ --bh-colors-neutral-dark-50: var(--bh-gray-dark-50);
1524
+ --bh-colors-neutral-dark-500: var(--bh-gray-dark-500);
1525
+ --bh-colors-neutral-dark-600: var(--bh-gray-dark-600);
1526
+ --bh-colors-neutral-dark-700: var(--bh-gray-dark-700);
1527
+ --bh-colors-neutral-dark-800: var(--bh-gray-dark-800);
1528
+ --bh-colors-neutral-dark-900: var(--bh-gray-dark-900);
1529
+ --bh-colors-neutral-dark-950: var(--bh-gray-dark-950);
1530
+ --bh-gray-dark-100: #141414;
1531
+ --bh-gray-dark-200: #1A1A1A;
1532
+ --bh-gray-dark-300: #242424;
1533
+ --bh-gray-dark-400: #3B3B3B;
1534
+ --bh-gray-dark-50: #0E0E0F;
1535
+ --bh-gray-dark-500: #4D4D4D;
1536
+ --bh-gray-dark-600: #5E5E5E;
1537
+ --bh-gray-dark-700: #7A7A7A;
1538
+ --bh-gray-dark-800: #A3A3A3;
1539
+ --bh-gray-dark-900: #E8E8E8;
1540
+ --bh-gray-dark-950: #FCFCFC;
1541
+ --bh-gray-dark-alpha-100: rgb(255 255 255 / 0.08);
1542
+ --bh-gray-dark-alpha-200: rgb(255 255 255 / 0.11);
1543
+ --bh-gray-dark-alpha-300: rgb(255 255 255 / 0.12);
1544
+ --bh-gray-dark-alpha-400: rgb(255 255 255 / 0.19);
1545
+ --bh-gray-dark-alpha-50: rgb(255 255 255 / 0.05);
1546
+ --bh-gray-dark-alpha-500: rgb(255 255 255 / 0.3);
1547
+ }
1466
1548
 
1467
1549
  [data-theme="blue"] {
1468
1550
  --bh-blue-300: #8DBDFF;
@@ -1477,7 +1559,6 @@
1477
1559
  --bh-colors-brand-checkbox-bg-default-dark: var(--bh-blue-500);
1478
1560
  --bh-colors-brand-checkbox-bg-hover: var(--bh-blue-600);
1479
1561
  --bh-colors-brand-checkbox-bg-hover-dark: var(--bh-blue-600);
1480
- --bh-colors-brand-color-on-brand-dark: var(--bh-base-white);
1481
1562
  --bh-colors-brand-content-dark: var(--bh-blue-500);
1482
1563
  --bh-colors-brand-content-light: var(--bh-blue-600);
1483
1564
  --bh-colors-brand-content-strong-dark: var(--bh-blue-400);
@@ -1513,6 +1594,14 @@
1513
1594
  --bh-derived-blue-550-reviewed: #2B6BED;
1514
1595
  }
1515
1596
 
1597
+ [data-theme="blue"],
1598
+ [data-theme="brown"],
1599
+ [data-theme="green"],
1600
+ [data-theme="purple"],
1601
+ [data-theme="teal"] {
1602
+ --bh-colors-brand-color-on-brand-dark: var(--bh-base-white);
1603
+ }
1604
+
1516
1605
  [data-theme="brown"] {
1517
1606
  --bh-amber-400: #FFA136;
1518
1607
  --bh-amber-alpha10: rgb(238 115 0 / 0.1);
@@ -1540,7 +1629,6 @@
1540
1629
  --bh-colors-brand-checkbox-bg-default-dark: var(--bh-amber-600);
1541
1630
  --bh-colors-brand-checkbox-bg-hover: var(--bh-amber-700);
1542
1631
  --bh-colors-brand-checkbox-bg-hover-dark: var(--bh-amber-700);
1543
- --bh-colors-brand-color-on-brand-dark: var(--bh-base-white);
1544
1632
  --bh-colors-brand-content-dark: var(--bh-amber-500);
1545
1633
  --bh-colors-brand-content-light: var(--bh-amber-700);
1546
1634
  --bh-colors-brand-content-strong-dark: var(--bh-amber-400);
@@ -1635,6 +1723,20 @@
1635
1723
  --bh-colors-brand-surface-strong-light: var(--bh-orange-900);
1636
1724
  --bh-colors-brand-surface-subtle-dark: var(--bh-orange-alpha10);
1637
1725
  --bh-colors-brand-surface-subtle-light: var(--bh-orange-50);
1726
+ --bh-orange-100: #FFEDD5;
1727
+ --bh-orange-300: #FDBA74;
1728
+ --bh-orange-400: #FB923C;
1729
+ --bh-orange-50: #FFF7ED;
1730
+ --bh-orange-500: #F97316;
1731
+ --bh-orange-600: #EA580C;
1732
+ --bh-orange-700: #C2410C;
1733
+ --bh-orange-800: #9A3412;
1734
+ --bh-orange-900: #7C2D12;
1735
+ --bh-orange-alpha10: rgb(249 115 22 / 0.1);
1736
+ }
1737
+
1738
+ [data-theme="orange"],
1739
+ [data-theme="teal"] {
1638
1740
  --bh-colors-neutral-100: var(--bh-slate-100);
1639
1741
  --bh-colors-neutral-200: var(--bh-slate-200);
1640
1742
  --bh-colors-neutral-300: var(--bh-slate-300);
@@ -1669,16 +1771,6 @@
1669
1771
  --bh-colors-neutral-dark-800: var(--bh-slate-dark-800);
1670
1772
  --bh-colors-neutral-dark-900: var(--bh-slate-dark-900);
1671
1773
  --bh-colors-neutral-dark-950: var(--bh-slate-dark-950);
1672
- --bh-orange-100: #FFEDD5;
1673
- --bh-orange-300: #FDBA74;
1674
- --bh-orange-400: #FB923C;
1675
- --bh-orange-50: #FFF7ED;
1676
- --bh-orange-500: #F97316;
1677
- --bh-orange-600: #EA580C;
1678
- --bh-orange-700: #C2410C;
1679
- --bh-orange-800: #9A3412;
1680
- --bh-orange-900: #7C2D12;
1681
- --bh-orange-alpha10: rgb(249 115 22 / 0.1);
1682
1774
  --bh-slate-100: #F2F4F5;
1683
1775
  --bh-slate-200: #EBEEF0;
1684
1776
  --bh-slate-300: #E6EBF0;
@@ -1724,7 +1816,6 @@
1724
1816
  --bh-colors-brand-checkbox-bg-default-dark: var(--bh-derived-green-600-dark-reviewed);
1725
1817
  --bh-colors-brand-checkbox-bg-hover: var(--bh-emerald-800);
1726
1818
  --bh-colors-brand-checkbox-bg-hover-dark: var(--bh-emerald-800);
1727
- --bh-colors-brand-color-on-brand-dark: var(--bh-base-white);
1728
1819
  --bh-colors-brand-content-dark: var(--bh-emerald-500);
1729
1820
  --bh-colors-brand-content-light: var(--bh-emerald-700);
1730
1821
  --bh-colors-brand-content-strong-dark: var(--bh-emerald-400);
@@ -1847,7 +1938,6 @@
1847
1938
  --bh-colors-brand-checkbox-bg-default-dark: var(--bh-violet-600);
1848
1939
  --bh-colors-brand-checkbox-bg-hover: var(--bh-violet-800);
1849
1940
  --bh-colors-brand-checkbox-bg-hover-dark: var(--bh-violet-700);
1850
- --bh-colors-brand-color-on-brand-dark: var(--bh-base-white);
1851
1941
  --bh-colors-brand-content-dark: var(--bh-violet-500);
1852
1942
  --bh-colors-brand-content-light: var(--bh-violet-700);
1853
1943
  --bh-colors-brand-content-strong-dark: var(--bh-violet-400);
@@ -1969,108 +2059,39 @@
1969
2059
  --bh-colors-brand-checkbox-bg-default-dark: var(--bh-derived-teal-600-dark-reviewed);
1970
2060
  --bh-colors-brand-checkbox-bg-hover: var(--bh-teal-800);
1971
2061
  --bh-colors-brand-checkbox-bg-hover-dark: var(--bh-teal-800);
1972
- --bh-colors-brand-color-on-brand-dark: var(--bh-base-white);
1973
2062
  --bh-colors-brand-content-dark: var(--bh-teal-500);
1974
2063
  --bh-colors-brand-content-light: var(--bh-teal-700);
1975
2064
  --bh-colors-brand-content-strong-dark: var(--bh-teal-300);
1976
- --bh-colors-brand-content-strong-light: var(--bh-teal-800);
1977
- --bh-colors-brand-focused-dark: var(--bh-teal-300);
1978
- --bh-colors-brand-focused-light: var(--bh-teal-600);
1979
- --bh-colors-brand-indicator: var(--bh-teal-600);
1980
- --bh-colors-brand-indicator-dark: var(--bh-teal-500);
1981
- --bh-colors-brand-interactive-default: var(--bh-teal-700);
1982
- --bh-colors-brand-interactive-default-dark: var(--bh-derived-teal-600-dark-reviewed);
1983
- --bh-colors-brand-interactive-hover: var(--bh-teal-800);
1984
- --bh-colors-brand-interactive-hover-dark: var(--bh-teal-800);
1985
- --bh-colors-brand-interactive-pressed: var(--bh-teal-900);
1986
- --bh-colors-brand-interactive-pressed-dark: var(--bh-derived-teal-600-dark-reviewed);
1987
- --bh-colors-brand-link-dark: var(--bh-teal-500);
1988
- --bh-colors-brand-link-hover-dark: var(--bh-teal-300);
1989
- --bh-colors-brand-link-hover-light: var(--bh-teal-800);
1990
- --bh-colors-brand-link-light: var(--bh-teal-700);
1991
- --bh-colors-brand-radiobutton-bg-default: var(--bh-teal-700);
1992
- --bh-colors-brand-radiobutton-bg-default-dark: var(--bh-derived-teal-600-dark-reviewed);
1993
- --bh-colors-brand-radiobutton-bg-hover: var(--bh-teal-800);
1994
- --bh-colors-brand-radiobutton-bg-hover-dark: var(--bh-teal-800);
1995
- --bh-colors-brand-surface-base: var(--bh-teal-700);
1996
- --bh-colors-brand-surface-base-dark: var(--bh-derived-teal-600-dark-reviewed);
1997
- --bh-colors-brand-surface-bold-dark: var(--bh-teal-700);
1998
- --bh-colors-brand-surface-bold-light: var(--bh-teal-800);
1999
- --bh-colors-brand-surface-soft-dark: var(--bh-teal-900);
2000
- --bh-colors-brand-surface-soft-light: var(--bh-teal-100);
2001
- --bh-colors-brand-surface-strong-dark: var(--bh-teal-900);
2002
- --bh-colors-brand-surface-strong-light: var(--bh-teal-900);
2003
- --bh-colors-brand-surface-subtle-dark: var(--bh-teal-alpha10);
2004
- --bh-colors-brand-surface-subtle-light: var(--bh-teal-50);
2005
- --bh-colors-neutral-100: var(--bh-slate-100);
2006
- --bh-colors-neutral-200: var(--bh-slate-200);
2007
- --bh-colors-neutral-300: var(--bh-slate-300);
2008
- --bh-colors-neutral-400: var(--bh-slate-400);
2009
- --bh-colors-neutral-50: var(--bh-slate-50);
2010
- --bh-colors-neutral-500: var(--bh-slate-500);
2011
- --bh-colors-neutral-600: var(--bh-slate-600);
2012
- --bh-colors-neutral-700: var(--bh-slate-700);
2013
- --bh-colors-neutral-800: var(--bh-slate-800);
2014
- --bh-colors-neutral-900: var(--bh-slate-900);
2015
- --bh-colors-neutral-950: var(--bh-slate-950);
2016
- --bh-colors-neutral-alpha-100: var(--bh-slate-alpha-100);
2017
- --bh-colors-neutral-alpha-200: var(--bh-slate-alpha-200);
2018
- --bh-colors-neutral-alpha-300: var(--bh-slate-alpha-300);
2019
- --bh-colors-neutral-alpha-400: var(--bh-slate-alpha-400);
2020
- --bh-colors-neutral-alpha-50: var(--bh-slate-alpha-50);
2021
- --bh-colors-neutral-alpha-500: var(--bh-slate-alpha-500);
2022
- --bh-colors-neutral-alpha-dark-100: var(--bh-slate-alpha-dark-100);
2023
- --bh-colors-neutral-alpha-dark-200: var(--bh-slate-alpha-dark-200);
2024
- --bh-colors-neutral-alpha-dark-300: var(--bh-slate-alpha-dark-300);
2025
- --bh-colors-neutral-alpha-dark-400: var(--bh-slate-alpha-dark-400);
2026
- --bh-colors-neutral-alpha-dark-50: var(--bh-slate-alpha-dark-50);
2027
- --bh-colors-neutral-alpha-dark-500: var(--bh-slate-alpha-dark-500);
2028
- --bh-colors-neutral-dark-100: var(--bh-slate-dark-100);
2029
- --bh-colors-neutral-dark-200: var(--bh-slate-dark-200);
2030
- --bh-colors-neutral-dark-300: var(--bh-slate-dark-300);
2031
- --bh-colors-neutral-dark-400: var(--bh-slate-dark-400);
2032
- --bh-colors-neutral-dark-50: var(--bh-slate-dark-50);
2033
- --bh-colors-neutral-dark-500: var(--bh-slate-dark-500);
2034
- --bh-colors-neutral-dark-600: var(--bh-slate-dark-600);
2035
- --bh-colors-neutral-dark-700: var(--bh-slate-dark-700);
2036
- --bh-colors-neutral-dark-800: var(--bh-slate-dark-800);
2037
- --bh-colors-neutral-dark-900: var(--bh-slate-dark-900);
2038
- --bh-colors-neutral-dark-950: var(--bh-slate-dark-950);
2039
- --bh-derived-teal-600-dark-reviewed: #0E8278;
2040
- --bh-slate-100: #F2F4F5;
2041
- --bh-slate-200: #EBEEF0;
2042
- --bh-slate-300: #E6EBF0;
2043
- --bh-slate-400: #D8E0E8;
2044
- --bh-slate-50: #F9FBFC;
2045
- --bh-slate-500: #C3D0DE;
2046
- --bh-slate-600: #ABB8C7;
2047
- --bh-slate-700: #7F8C9E;
2048
- --bh-slate-800: #4E596E;
2049
- --bh-slate-900: #232F40;
2050
- --bh-slate-950: #101B2E;
2051
- --bh-slate-alpha-100: rgb(88 123 140 / 0.1);
2052
- --bh-slate-alpha-200: rgb(88 123 140 / 0.13);
2053
- --bh-slate-alpha-300: rgb(55 83 122 / 0.13);
2054
- --bh-slate-alpha-400: rgb(22 64 112 / 0.15);
2055
- --bh-slate-alpha-50: rgb(88 123 140 / 0.07);
2056
- --bh-slate-alpha-500: rgb(24 68 120 / 0.25);
2057
- --bh-slate-alpha-dark-100: rgb(195 216 247 / 0.09);
2058
- --bh-slate-alpha-dark-200: rgb(195 216 247 / 0.11);
2059
- --bh-slate-alpha-dark-300: rgb(217 229 247 / 0.13);
2060
- --bh-slate-alpha-dark-400: rgb(195 216 247 / 0.23);
2061
- --bh-slate-alpha-dark-50: rgb(195 216 247 / 0.05);
2062
- --bh-slate-alpha-dark-500: rgb(198 219 247 / 0.3);
2063
- --bh-slate-dark-100: #121721;
2064
- --bh-slate-dark-200: #181F29;
2065
- --bh-slate-dark-300: #1F252E;
2066
- --bh-slate-dark-400: #2E3742;
2067
- --bh-slate-dark-50: #0B111A;
2068
- --bh-slate-dark-500: #434E5C;
2069
- --bh-slate-dark-600: #515E6E;
2070
- --bh-slate-dark-700: #6F7E8F;
2071
- --bh-slate-dark-800: #98A5B5;
2072
- --bh-slate-dark-900: #DDE5EB;
2073
- --bh-slate-dark-950: #FAFBFC;
2065
+ --bh-colors-brand-content-strong-light: var(--bh-teal-800);
2066
+ --bh-colors-brand-focused-dark: var(--bh-teal-300);
2067
+ --bh-colors-brand-focused-light: var(--bh-teal-600);
2068
+ --bh-colors-brand-indicator: var(--bh-teal-600);
2069
+ --bh-colors-brand-indicator-dark: var(--bh-teal-500);
2070
+ --bh-colors-brand-interactive-default: var(--bh-teal-700);
2071
+ --bh-colors-brand-interactive-default-dark: var(--bh-derived-teal-600-dark-reviewed);
2072
+ --bh-colors-brand-interactive-hover: var(--bh-teal-800);
2073
+ --bh-colors-brand-interactive-hover-dark: var(--bh-teal-800);
2074
+ --bh-colors-brand-interactive-pressed: var(--bh-teal-900);
2075
+ --bh-colors-brand-interactive-pressed-dark: var(--bh-derived-teal-600-dark-reviewed);
2076
+ --bh-colors-brand-link-dark: var(--bh-teal-500);
2077
+ --bh-colors-brand-link-hover-dark: var(--bh-teal-300);
2078
+ --bh-colors-brand-link-hover-light: var(--bh-teal-800);
2079
+ --bh-colors-brand-link-light: var(--bh-teal-700);
2080
+ --bh-colors-brand-radiobutton-bg-default: var(--bh-teal-700);
2081
+ --bh-colors-brand-radiobutton-bg-default-dark: var(--bh-derived-teal-600-dark-reviewed);
2082
+ --bh-colors-brand-radiobutton-bg-hover: var(--bh-teal-800);
2083
+ --bh-colors-brand-radiobutton-bg-hover-dark: var(--bh-teal-800);
2084
+ --bh-colors-brand-surface-base: var(--bh-teal-700);
2085
+ --bh-colors-brand-surface-base-dark: var(--bh-derived-teal-600-dark-reviewed);
2086
+ --bh-colors-brand-surface-bold-dark: var(--bh-teal-700);
2087
+ --bh-colors-brand-surface-bold-light: var(--bh-teal-800);
2088
+ --bh-colors-brand-surface-soft-dark: var(--bh-teal-900);
2089
+ --bh-colors-brand-surface-soft-light: var(--bh-teal-100);
2090
+ --bh-colors-brand-surface-strong-dark: var(--bh-teal-900);
2091
+ --bh-colors-brand-surface-strong-light: var(--bh-teal-900);
2092
+ --bh-colors-brand-surface-subtle-dark: var(--bh-teal-alpha10);
2093
+ --bh-colors-brand-surface-subtle-light: var(--bh-teal-50);
2094
+ --bh-derived-teal-600-dark-reviewed: #0E8278;
2074
2095
  --bh-teal-100: #CCFBF1;
2075
2096
  --bh-teal-300: #5EEAD4;
2076
2097
  --bh-teal-50: #F0FDFA;
@@ -2084,68 +2105,59 @@
2084
2105
 
2085
2106
  /* End Banhaten brand theme light token modes. */
2086
2107
 
2108
+ /* Banhaten brand theme dark token modes: generated from tokens/banhaten.tokens.json. */
2109
+
2087
2110
  .dark,
2111
+ .dark[data-theme="blue"],
2112
+ .dark [data-theme="blue"],
2088
2113
  .dark[data-theme="gray"],
2089
- .dark [data-theme="gray"] {
2090
- --accent: var(--bh-interactive-ghost-hover);
2091
- --accent-foreground: var(--bh-content-default);
2092
- --accent-hover: var(--bh-interactive-ghost-pressed);
2093
- --background: var(--bh-bg-default);
2114
+ .dark [data-theme="gray"],
2115
+ .dark[data-theme="brown"],
2116
+ .dark [data-theme="brown"],
2117
+ .dark[data-theme="orange"],
2118
+ .dark [data-theme="orange"],
2119
+ .dark[data-theme="green"],
2120
+ .dark [data-theme="green"],
2121
+ .dark[data-theme="purple"],
2122
+ .dark [data-theme="purple"],
2123
+ .dark[data-theme="teal"],
2124
+ .dark [data-theme="teal"] {
2094
2125
  --bh-alpha-alpha-transparent: rgb(14 13 13 / 0);
2095
2126
  --bh-alpha-alpha-transparent-to-100: var(--bh-colors-neutral-alpha-dark-300);
2096
2127
  --bh-alpha-alpha-transparent-to-500: var(--bh-colors-neutral-alpha-dark-500);
2097
- --bh-amber-300: #FFC369;
2098
2128
  --bh-amber-400: #FFA136;
2099
- --bh-amber-500: #EE7300;
2100
- --bh-amber-600: #CD6103;
2101
- --bh-amber-800: #863E07;
2102
- --bh-amber-900: #652C07;
2103
2129
  --bh-amber-alpha10: rgb(238 115 0 / 0.1);
2104
2130
  --bh-aqua-400: #2CC8A1;
2105
- --bh-aqua-500: #03A980;
2106
2131
  --bh-aqua-800: #075443;
2107
2132
  --bh-aqua-900: #043F33;
2108
2133
  --bh-aqua-alpha10: rgb(3 169 128 / 0.1);
2109
- --bh-base-white: #FFFFFF;
2110
2134
  --bh-bg-accent-amber-default: var(--bh-amber-600);
2111
2135
  --bh-bg-accent-amber-soft: var(--bh-amber-900);
2112
2136
  --bh-bg-accent-amber-subtle: var(--bh-amber-alpha10);
2113
- --bh-bg-accent-aqua-default: var(--bh-aqua-500);
2114
2137
  --bh-bg-accent-aqua-soft: var(--bh-aqua-900);
2115
2138
  --bh-bg-accent-aqua-subtle: var(--bh-aqua-alpha10);
2116
- --bh-bg-accent-blue-bold: var(--bh-blue-600);
2117
- --bh-bg-accent-blue-default: var(--bh-blue-500);
2118
2139
  --bh-bg-accent-blue-soft: var(--bh-blue-900);
2119
2140
  --bh-bg-accent-blue-subtle: var(--bh-blue-alpha10);
2120
- --bh-bg-accent-fuchsia-default: var(--bh-fuchsia-500);
2121
2141
  --bh-bg-accent-fuchsia-soft: var(--bh-fuchsia-900);
2122
2142
  --bh-bg-accent-fuchsia-subtle: var(--bh-fuchsia-alpha10);
2123
2143
  --bh-bg-accent-golden-bold: var(--bh-golden-400);
2124
2144
  --bh-bg-accent-golden-default: var(--bh-golden-500);
2125
2145
  --bh-bg-accent-golden-soft: var(--bh-golden-900);
2126
2146
  --bh-bg-accent-golden-subtle: var(--bh-golden-alpha10);
2127
- --bh-bg-accent-green-default: var(--bh-green-500);
2128
2147
  --bh-bg-accent-green-soft: var(--bh-green-900);
2129
2148
  --bh-bg-accent-green-subtle: var(--bh-green-alpha10);
2130
- --bh-bg-accent-lime-default: var(--bh-lime-500);
2131
2149
  --bh-bg-accent-lime-soft: var(--bh-lime-900);
2132
2150
  --bh-bg-accent-lime-subtle: var(--bh-lime-alpha10);
2133
- --bh-bg-accent-purple-default: var(--bh-purple-500);
2134
2151
  --bh-bg-accent-purple-soft: var(--bh-purple-900);
2135
2152
  --bh-bg-accent-purple-subtle: var(--bh-purple-alpha10);
2136
2153
  --bh-bg-accent-red-default: var(--bh-red-600);
2137
2154
  --bh-bg-accent-red-soft: var(--bh-red-900);
2138
2155
  --bh-bg-accent-red-subtle: var(--bh-red-alpha10);
2139
- --bh-bg-accent-rose-bold: var(--bh-rose-600);
2140
- --bh-bg-accent-rose-default: var(--bh-rose-500);
2141
2156
  --bh-bg-accent-rose-soft: var(--bh-rose-900);
2142
2157
  --bh-bg-accent-rose-subtle: var(--bh-rose-alpha10);
2143
- --bh-bg-accent-sky-base: var(--bh-sky-500);
2144
2158
  --bh-bg-accent-sky-soft: var(--bh-sky-900);
2145
2159
  --bh-bg-accent-sky-subtle: var(--bh-sky-alpha10);
2146
2160
  --bh-bg-always-dark: var(--bh-colors-neutral-dark-200);
2147
- --bh-bg-always-white: var(--bh-base-white);
2148
- --bh-bg-backdrop: rgb(0 0 0 / 0.5);
2149
2161
  --bh-bg-brand-bold: var(--bh-colors-brand-surface-bold-dark);
2150
2162
  --bh-bg-brand-default: var(--bh-colors-brand-surface-base-dark);
2151
2163
  --bh-bg-brand-soft: var(--bh-colors-brand-surface-soft-dark);
@@ -2191,62 +2203,42 @@
2191
2203
  --bh-bg-warning-soft: var(--bh-amber-800);
2192
2204
  --bh-bg-warning-strong: var(--bh-amber-400);
2193
2205
  --bh-bg-warning-subtle: var(--bh-amber-alpha10);
2194
- --bh-blue-200: #BBDAFF;
2195
2206
  --bh-blue-400: #5B97FF;
2196
- --bh-blue-500: #3276FF;
2197
- --bh-blue-600: #245DED;
2198
2207
  --bh-blue-800: #11318F;
2199
- --bh-blue-900: #0A1B63;
2200
2208
  --bh-blue-alpha10: rgb(50 118 255 / 0.1);
2201
2209
  --bh-blue-alpha25: rgb(50 118 255 / 0.25);
2202
- --bh-border-accent-amber-strong: var(--bh-amber-500);
2203
2210
  --bh-border-accent-amber-subtle: var(--bh-amber-800);
2204
- --bh-border-accent-aqua-strong: var(--bh-aqua-500);
2205
2211
  --bh-border-accent-aqua-subtle: var(--bh-aqua-800);
2206
- --bh-border-accent-blue-strong: var(--bh-blue-500);
2207
2212
  --bh-border-accent-blue-subtle: var(--bh-blue-alpha25);
2208
- --bh-border-accent-fuchsia-strong: var(--bh-fuchsia-500);
2209
2213
  --bh-border-accent-fuchsia-subtle: var(--bh-fuchsia-800);
2210
2214
  --bh-border-accent-golden-strong: var(--bh-golden-500);
2211
2215
  --bh-border-accent-golden-subtle: var(--bh-golden-800);
2212
- --bh-border-accent-green-strong: var(--bh-green-500);
2213
2216
  --bh-border-accent-green-subtle: var(--bh-green-alpha20);
2214
2217
  --bh-border-accent-lime-strong: var(--bh-lime-500);
2215
2218
  --bh-border-accent-lime-subtle: var(--bh-lime-800);
2216
- --bh-border-accent-purple-strong: var(--bh-purple-500);
2217
2219
  --bh-border-accent-purple-subtle: var(--bh-purple-800);
2218
- --bh-border-accent-red-strong: var(--bh-red-500);
2219
2220
  --bh-border-accent-red-subtle: var(--bh-red-alpha20);
2220
- --bh-border-accent-rose-strong: var(--bh-rose-500);
2221
2221
  --bh-border-accent-rose-subtle: var(--bh-rose-800);
2222
- --bh-border-accent-sky-strong: var(--bh-sky-500);
2223
2222
  --bh-border-accent-sky-subtle: var(--bh-sky-800);
2224
2223
  --bh-border-brand-strong: var(--bh-colors-brand-border-border-strong-dark);
2225
2224
  --bh-border-brand-subtle: var(--bh-colors-brand-border-border-subtle-dark);
2226
- --bh-border-danger-strong: var(--bh-red-500);
2227
2225
  --bh-border-danger-subtle: var(--bh-red-800);
2228
2226
  --bh-border-default: var(--bh-colors-neutral-alpha-dark-400);
2229
2227
  --bh-border-disabled: var(--bh-colors-neutral-alpha-dark-200);
2230
2228
  --bh-border-focus: var(--bh-colors-brand-focused-dark);
2231
2229
  --bh-border-focus-danger: var(--bh-red-300);
2232
- --bh-border-info-strong: var(--bh-blue-500);
2233
2230
  --bh-border-info-subtle: var(--bh-blue-800);
2234
2231
  --bh-border-input: var(--bh-colors-neutral-alpha-dark-400);
2235
2232
  --bh-border-inverse: var(--bh-colors-neutral-dark-50);
2236
2233
  --bh-border-inverse-subtle: rgb(255 255 255 / 0.1);
2237
2234
  --bh-border-strong: var(--bh-colors-neutral-dark-800);
2238
2235
  --bh-border-subtle: var(--bh-colors-neutral-alpha-dark-200);
2239
- --bh-border-success-strong: var(--bh-green-500);
2240
2236
  --bh-border-success-subtle: var(--bh-green-800);
2241
- --bh-border-warning-strong: var(--bh-amber-500);
2242
2237
  --bh-border-warning-subtle: var(--bh-amber-800);
2243
- --bh-chart-brand-default: var(--bh-colors-brand-surface-base);
2244
- --bh-chart-categorical-1: var(--bh-sky-600);
2245
2238
  --bh-chart-categorical-2: var(--bh-purple-300);
2246
2239
  --bh-chart-categorical-3: var(--bh-amber-400);
2247
2240
  --bh-chart-categorical-4: var(--bh-rose-400);
2248
2241
  --bh-chart-categorical-5: var(--bh-blue-200);
2249
- --bh-chart-categorical-6: var(--bh-purple-500);
2250
2242
  --bh-chart-categorical-7: var(--bh-rose-200);
2251
2243
  --bh-chart-categorical-8: var(--bh-amber-300);
2252
2244
  --bh-chart-neutral-default: var(--bh-colors-neutral-dark-400);
@@ -2285,7 +2277,6 @@
2285
2277
  --bh-content-link-hover: var(--bh-colors-brand-link-hover-dark);
2286
2278
  --bh-content-muted: #808080;
2287
2279
  --bh-content-on-brand: var(--bh-colors-brand-color-on-brand-dark);
2288
- --bh-content-on-color: var(--bh-base-white);
2289
2280
  --bh-content-on-light: var(--bh-colors-neutral-dark-50);
2290
2281
  --bh-content-on-neutral: var(--bh-colors-neutral-dark-50);
2291
2282
  --bh-content-on-success: var(--bh-colors-neutral-dark-50);
@@ -2296,21 +2287,14 @@
2296
2287
  --bh-content-warning-default: var(--bh-amber-500);
2297
2288
  --bh-content-warning-strong: var(--bh-amber-400);
2298
2289
  --bh-fuchsia-400: #FC54FF;
2299
- --bh-fuchsia-500: #E703EB;
2300
2290
  --bh-fuchsia-800: #6D0776;
2301
2291
  --bh-fuchsia-900: #500659;
2302
2292
  --bh-fuchsia-alpha10: rgb(231 3 235 / 0.1);
2303
- --bh-golden-400: #F7C407;
2304
2293
  --bh-golden-500: #E5AB08;
2305
- --bh-golden-800: #7E4F03;
2306
2294
  --bh-golden-900: #603B03;
2307
2295
  --bh-golden-alpha10: rgb(229 171 8 / 0.1);
2308
2296
  --bh-green-300: #51E585;
2309
2297
  --bh-green-400: #2CC863;
2310
- --bh-green-500: #0BAE45;
2311
- --bh-green-600: #039536;
2312
- --bh-green-800: #075622;
2313
- --bh-green-900: #043F18;
2314
2298
  --bh-green-alpha10: rgb(11 174 69 / 0.1);
2315
2299
  --bh-green-alpha20: rgb(11 174 69 / 0.2);
2316
2300
  --bh-green-alpha25: rgb(11 174 69 / 0.25);
@@ -2318,6 +2302,7 @@
2318
2302
  --bh-interactive-brand-disabled: var(--bh-colors-neutral-alpha-dark-100);
2319
2303
  --bh-interactive-brand-hover: var(--bh-colors-brand-interactive-hover-dark);
2320
2304
  --bh-interactive-brand-pressed: var(--bh-colors-brand-interactive-pressed-dark);
2305
+ --bh-interactive-checkbox-content: var(--bh-colors-brand-color-on-brand-dark);
2321
2306
  --bh-interactive-checkbox-default: var(--bh-colors-brand-checkbox-bg-default-dark);
2322
2307
  --bh-interactive-checkbox-hover: var(--bh-colors-brand-checkbox-bg-hover-dark);
2323
2308
  --bh-interactive-danger-default: var(--bh-red-600);
@@ -2333,7 +2318,7 @@
2333
2318
  --bh-interactive-ghost-disabled: rgb(255 255 255 / 0);
2334
2319
  --bh-interactive-ghost-hover: var(--bh-colors-neutral-alpha-dark-50);
2335
2320
  --bh-interactive-ghost-pressed: var(--bh-colors-neutral-alpha-dark-100);
2336
- --bh-interactive-indicator-default: var(--bh-colors-brand-indicator);
2321
+ --bh-interactive-indicator-default: var(--bh-colors-brand-indicator-dark);
2337
2322
  --bh-interactive-input-default: var(--bh-colors-neutral-alpha-dark-50);
2338
2323
  --bh-interactive-input-disabled: var(--bh-colors-neutral-alpha-dark-50);
2339
2324
  --bh-interactive-input-soft: var(--bh-colors-neutral-alpha-dark-100);
@@ -2355,12 +2340,9 @@
2355
2340
  --bh-interactive-success-default: var(--bh-green-400);
2356
2341
  --bh-interactive-success-hover: var(--bh-green-300);
2357
2342
  --bh-interactive-success-pressed: var(--bh-green-500);
2358
- --bh-interactive-switch-active: var(--bh-green-500);
2359
2343
  --bh-interactive-switch-active-disabled: var(--bh-green-alpha25);
2360
- --bh-interactive-switch-active-hover: var(--bh-green-600);
2361
2344
  --bh-interactive-switch-default: var(--bh-colors-neutral-alpha-dark-400);
2362
2345
  --bh-interactive-switch-disabled: var(--bh-colors-neutral-alpha-dark-100);
2363
- --bh-interactive-switch-handle: var(--bh-base-white);
2364
2346
  --bh-interactive-switch-handle-disabled: var(--bh-colors-neutral-alpha-dark-300);
2365
2347
  --bh-interactive-switch-hover: var(--bh-colors-neutral-alpha-dark-500);
2366
2348
  --bh-interactive-table-header: var(--bh-colors-neutral-alpha-dark-50);
@@ -2368,221 +2350,39 @@
2368
2350
  --bh-interactive-warning-hover: var(--bh-amber-300);
2369
2351
  --bh-interactive-warning-pressed: var(--bh-amber-500);
2370
2352
  --bh-lime-400: #A4D10E;
2371
- --bh-lime-500: #8EB903;
2372
2353
  --bh-lime-800: #4E6503;
2373
2354
  --bh-lime-900: #384C03;
2374
2355
  --bh-lime-alpha10: rgb(142 185 3 / 0.1);
2375
- --bh-pagination-action-gap: var(--bh-space-md-8);
2376
- --bh-pagination-active-bg: var(--bh-interactive-brand-default);
2377
- --bh-pagination-active-border: var(--bh-border-subtle);
2378
- --bh-pagination-active-content: var(--bh-content-on-brand);
2379
- --bh-pagination-caption-content: var(--bh-content-subtle);
2380
- --bh-pagination-caption-font-weight: var(--bh-text-body-md-regular-font-weight);
2381
- --bh-pagination-caption-width: 254px;
2382
- --bh-pagination-control-content: var(--bh-content-default);
2383
- --bh-pagination-control-gap: var(--bh-space-lg-10);
2384
- --bh-pagination-control-ghost-bg: var(--bh-interactive-ghost-default);
2385
- --bh-pagination-control-ghost-hover: var(--bh-interactive-ghost-hover);
2386
- --bh-pagination-control-ghost-pressed: var(--bh-interactive-ghost-pressed);
2387
- --bh-pagination-control-label-padding-x: var(--bh-space-xxs-2);
2388
- --bh-pagination-control-label-rtl-padding-x: var(--bh-space-xs-4);
2389
- --bh-pagination-control-soft-bg: var(--bh-interactive-soft-default);
2390
- --bh-pagination-control-soft-hover: var(--bh-interactive-soft-hover);
2391
- --bh-pagination-control-soft-pressed: var(--bh-interactive-soft-pressed);
2392
- --bh-pagination-control-text-gap: var(--bh-space-xs-4);
2393
- --bh-pagination-control-text-padding-x: var(--bh-space-md-8);
2394
- --bh-pagination-control-text-rtl-gap: var(--bh-space-xxs-2);
2395
- --bh-pagination-control-text-rtl-padding-x: var(--bh-space-sm-6);
2396
- --bh-pagination-font-size: var(--bh-text-body-md-medium-font-size);
2397
- --bh-pagination-icon-size: var(--bh-icon-size-default);
2398
- --bh-pagination-icon-slot-size: var(--bh-icon-slot-size-default);
2399
- --bh-pagination-item-size: var(--bh-space-6xl-32);
2400
- --bh-pagination-label-font-weight: var(--bh-text-body-md-medium-font-weight);
2401
- --bh-pagination-letter-spacing: var(--bh-text-body-md-medium-letter-spacing);
2402
- --bh-pagination-line-height: var(--bh-text-body-md-medium-line-height);
2403
- --bh-pagination-numeric-width: 560px;
2404
- --bh-pagination-page-bg: var(--bh-interactive-ghost-default);
2405
- --bh-pagination-page-content: var(--bh-content-subtle);
2406
- --bh-pagination-page-gap: var(--bh-space-xs-4);
2407
- --bh-pagination-page-hover: var(--bh-interactive-ghost-hover);
2408
- --bh-pagination-page-pressed: var(--bh-interactive-ghost-pressed);
2409
- --bh-pagination-radius: var(--bh-control-default);
2410
- --bh-pagination-root-gap: var(--bh-space-3xl-16);
2411
- --bh-pagination-simple-width: 458px;
2412
2356
  --bh-purple-300: #D097FF;
2413
2357
  --bh-purple-400: #B65CFF;
2414
- --bh-purple-500: #A135FA;
2415
2358
  --bh-purple-800: #4A0B87;
2416
2359
  --bh-purple-900: #340865;
2417
2360
  --bh-purple-alpha10: rgb(182 92 255 / 0.1);
2418
- --bh-red-300: #FF96A1;
2419
- --bh-red-400: #FC5666;
2420
- --bh-red-500: #E8172C;
2421
- --bh-red-600: #CA1224;
2422
- --bh-red-700: #A60C1B;
2423
2361
  --bh-red-800: #820A16;
2424
2362
  --bh-red-900: #5C0810;
2425
2363
  --bh-red-alpha10: rgb(232 23 44 / 0.1);
2426
2364
  --bh-red-alpha15: rgb(232 23 44 / 0.15);
2427
2365
  --bh-red-alpha20: rgb(232 23 44 / 0.2);
2428
- --bh-rose-200: #FFB9D7;
2429
2366
  --bh-rose-400: #FF4F9B;
2430
- --bh-rose-500: #F01071;
2431
- --bh-rose-600: #D10A60;
2432
2367
  --bh-rose-800: #810838;
2433
2368
  --bh-rose-900: #60082B;
2434
2369
  --bh-rose-alpha10: rgb(240 16 113 / 0.1);
2435
- --bh-select-avatar-font-size: var(--bh-space-lg-10);
2436
- --bh-select-check-color: var(--bh-interactive-indicator-default);
2437
- --bh-select-checkbox-icon-size: var(--bh-space-xl-12);
2438
- --bh-select-checkbox-radius: var(--bh-radius-sm-4);
2439
- --bh-select-checkbox-size: var(--bh-space-3xl-16);
2440
- --bh-select-company-icon-size: 18px;
2441
- --bh-select-content-gap: var(--bh-space-xxs-2);
2442
- --bh-select-field-gap: var(--bh-space-sm-6);
2443
- --bh-select-icon-size: var(--bh-space-3xl-16);
2444
- --bh-select-icon-slot-size: var(--bh-space-4xl-20);
2445
- --bh-select-item-check-offset: var(--bh-space-3xl-16);
2446
- --bh-select-item-content-padding: var(--bh-space-sm-6);
2447
- --bh-select-item-gap: var(--bh-space-xs-4);
2448
- --bh-select-item-hover-bg: var(--bh-interactive-ghost-hover);
2449
- --bh-select-item-min-height: var(--bh-space-6xl-32);
2450
- --bh-select-item-padding-x: var(--bh-space-sm-6);
2451
- --bh-select-item-radius: var(--bh-radius-md-6);
2452
- --bh-select-item-selected-padding-end: var(--bh-space-6xl-32);
2453
- --bh-select-item-value-padding-x: var(--bh-space-xs-4);
2454
- --bh-select-label-gap: var(--bh-space-xs-4);
2455
- --bh-select-media-inset: var(--bh-space-xxs-2);
2456
- --bh-select-menu-bg: var(--bh-bg-raised);
2457
- --bh-select-menu-border: var(--bh-border-subtle);
2458
- --bh-select-menu-list-gap: var(--bh-space-xxs-2);
2459
- --bh-select-menu-offset: var(--bh-space-xs-4);
2460
- --bh-select-menu-padding-y: var(--bh-space-sm-6);
2461
- --bh-select-menu-radius: var(--bh-radius-xl-10);
2462
- --bh-select-menu-width: var(--bh-select-width);
2463
- --bh-select-payment-height: var(--bh-space-4xl-20);
2464
- --bh-select-payment-mark-offset: 7px;
2465
- --bh-select-payment-mark-size: 9px;
2466
- --bh-select-payment-radius: var(--bh-radius-sm-4);
2467
- --bh-select-payment-width: 28.333px;
2468
- --bh-select-status-dot-size: var(--bh-space-md-8);
2469
- --bh-select-trigger-bg: var(--bh-interactive-input-default);
2470
- --bh-select-trigger-bg-disabled: var(--bh-interactive-input-disabled);
2471
- --bh-select-trigger-bg-soft: var(--bh-interactive-input-soft);
2472
- --bh-select-trigger-border: var(--bh-border-input);
2473
- --bh-select-trigger-border-disabled: var(--bh-border-disabled);
2474
- --bh-select-trigger-border-error: var(--bh-border-danger-strong);
2475
- --bh-select-trigger-border-focus: var(--bh-border-focus);
2476
- --bh-select-trigger-gap: var(--bh-space-sm-6);
2477
- --bh-select-trigger-icon-color: var(--bh-content-muted);
2478
- --bh-select-trigger-padding-x: var(--bh-space-md-8);
2479
- --bh-select-trigger-padding-y-comfortable: var(--bh-space-md-8);
2480
- --bh-select-trigger-padding-y-lg: var(--bh-space-sm-6);
2481
- --bh-select-trigger-padding-y-md: var(--bh-space-xs-4);
2482
- --bh-select-trigger-radius: var(--bh-radius-lg-8);
2483
- --bh-select-value-padding-inline: var(--bh-space-xs-4);
2484
- --bh-select-width: var(--bh-space-18xl-320);
2485
2370
  --bh-sky-400: #1BB6FC;
2486
- --bh-sky-500: #059FE5;
2487
- --bh-sky-600: #0C85C3;
2488
2371
  --bh-sky-800: #03537E;
2489
2372
  --bh-sky-900: #073D5B;
2490
2373
  --bh-sky-alpha10: rgb(5 159 229 / 0.1);
2491
- --border: var(--bh-border-default);
2492
- --card: var(--bh-bg-raised);
2493
- --card-foreground: var(--bh-content-default);
2494
- --danger-ring: var(--bh-border-focus-danger);
2495
- --destructive: var(--bh-interactive-danger-default);
2496
- --destructive-foreground: var(--bh-content-on-color);
2497
- --destructive-hover: var(--bh-interactive-danger-hover);
2498
- --destructive-pressed: var(--bh-interactive-danger-pressed);
2499
- --destructive-soft: var(--bh-interactive-danger-soft-default);
2500
- --destructive-soft-foreground: var(--bh-content-danger-default);
2501
- --destructive-soft-hover: var(--bh-interactive-danger-soft-hover);
2502
- --destructive-soft-pressed: var(--bh-interactive-danger-soft-pressed);
2503
- --foreground: var(--bh-content-default);
2504
- --ghost: var(--bh-interactive-ghost-default);
2505
- --ghost-hover: var(--bh-interactive-ghost-hover);
2506
- --ghost-pressed: var(--bh-interactive-ghost-pressed);
2507
- --input: var(--bh-border-input);
2508
- --muted: var(--bh-bg-muted);
2509
- --muted-foreground: var(--bh-content-muted);
2510
- --outline: var(--bh-interactive-outlined-default);
2511
- --outline-hover: var(--bh-interactive-outlined-hover);
2512
- --outline-pressed: var(--bh-interactive-outlined-pressed);
2513
- --popover: var(--bh-bg-raised);
2514
- --popover-foreground: var(--bh-content-default);
2515
- --primary: var(--bh-interactive-brand-default);
2516
- --primary-foreground: var(--bh-content-on-brand);
2517
- --primary-hover: var(--bh-interactive-brand-hover);
2518
- --primary-pressed: var(--bh-interactive-brand-pressed);
2519
- --ring: var(--bh-border-focus);
2520
- --secondary: var(--bh-interactive-secondary-default);
2521
- --secondary-foreground: var(--bh-content-default);
2522
- --secondary-hover: var(--bh-interactive-secondary-hover);
2523
- --secondary-pressed: var(--bh-interactive-secondary-pressed);
2524
- --shadow-2xl: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), 0px 12px 12px -6px rgb(0 0 0 / 0.18), 0px 24px 24px -12px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.08), inset 0px 0px 0px 1px rgb(255 255 255 / 0.06);
2525
- --shadow-3xl: 0px 0px 0px 1px rgb(0 0 0 / 0.2), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), 0px 12px 12px -6px rgb(0 0 0 / 0.18), 0px 24px 24px -12px rgb(0 0 0 / 0.18), 0px 48px 48px -24px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.11), inset 0px 0px 0px 1px rgb(255 255 255 / 0.06);
2526
- --shadow-button-danger-focus: var(--shadow-component-danger-focus-ring);
2527
- --shadow-button-focus: var(--shadow-component-focus-ring);
2528
- --shadow-button-group: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-group-border), var(--shadow-component-default);
2529
- --shadow-button-group-focus: var(--shadow-button-group), var(--shadow-component-focus-ring);
2530
- --shadow-button-group-focus-ring: var(--shadow-component-focus-ring);
2531
- --shadow-button-raised: var(--shadow-component-raised);
2532
- --shadow-button-secondary: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-secondary-border, var(--bh-border-default)), var(--shadow-button-surface);
2533
- --shadow-button-secondary-focus: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-button-secondary-focus-border, var(--bh-border-brand-strong)), var(--shadow-button-surface), var(--shadow-button-focus);
2534
- --shadow-button-surface: var(--shadow-component-surface);
2535
- --shadow-checkbox-card: inset 0px 0px 0px var(--bh-checkbox-card-border-width, var(--bh-border-width-default)) var(--bh-checkbox-card-border, var(--bh-border-subtle)), var(--shadow-component-default);
2536
- --shadow-checkbox-control: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-checkbox-control-border, var(--bh-border-input)), var(--shadow-component-default);
2537
- --shadow-component-danger-focus-ring: 0px 0px 0px var(--bh-focus-ring-width) var(--bh-border-focus-danger);
2538
- --shadow-component-danger-focus-stroke: 0px 0px 0px var(--bh-border-width-default) var(--bh-bg-default), 0px 0px 0px calc(var(--bh-border-width-default) + var(--bh-focus-ring-width)) var(--bh-border-focus-danger);
2539
- --shadow-component-default: 0px 1px 2px 0px rgb(0 0 0 / 0.36), inset 0px 1px 0px 0px rgb(255 255 255 / 0.05), inset 0px -1px 0px 0px rgb(0 0 0 / 0.28);
2540
- --shadow-component-focus-ring: 0px 0px 0px var(--bh-focus-ring-width) var(--bh-border-focus);
2541
- --shadow-component-focus-stroke: 0px 0px 0px var(--bh-border-width-default) var(--bh-bg-default), 0px 0px 0px calc(var(--bh-border-width-default) + var(--bh-focus-ring-width)) var(--bh-border-focus);
2542
- --shadow-component-raised: inset 0px 1px 0px 0px rgb(255 255 255 / 0.05), inset 0px -1px 0px 0px rgb(0 0 0 / 0.32), 0px 1px 2px 0px rgb(0 0 0 / 0.32);
2543
- --shadow-component-surface: inset 0px -1px 0px 0px rgb(0 0 0 / 0.32), 0px 1px 2px 0px rgb(0 0 0 / 0.32);
2544
- --shadow-date-surface: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-date-surface-border, var(--bh-border-subtle)), var(--shadow-lg);
2545
- --shadow-input: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-input-border, var(--bh-border-input)), var(--shadow-component-default);
2546
- --shadow-input-focus-ring: var(--shadow-component-focus-stroke);
2547
- --shadow-lg: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.06), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2548
- --shadow-md: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.06), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2549
- --shadow-menu: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-menu-border), var(--shadow-lg);
2550
- --shadow-progress-slider-thumb-focus: var(--shadow-component-focus-ring);
2551
- --shadow-radio-card: inset 0px 0px 0px var(--bh-radio-card-border-width, var(--bh-border-width-default)) var(--bh-radio-card-border, var(--bh-border-default)), var(--shadow-radio-card-surface);
2552
- --shadow-radio-card-disabled: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-border-disabled);
2553
- --shadow-radio-control: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-radio-control-border, var(--bh-border-input)), var(--shadow-component-default);
2554
- --shadow-select-checkbox: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-checkbox-border, var(--bh-border-input)), var(--shadow-component-default);
2555
- --shadow-select-danger-focus-ring: var(--shadow-component-danger-focus-stroke);
2556
- --shadow-select-focus-ring: var(--shadow-component-focus-stroke);
2557
- --shadow-select-menu: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-menu-border), var(--shadow-lg);
2558
- --shadow-select-trigger: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-select-trigger-border-current, var(--bh-select-trigger-border)), var(--shadow-component-default);
2559
- --shadow-slider-thumb-focus: var(--shadow-slider-thumb), var(--shadow-component-focus-ring);
2560
- --shadow-slider-tooltip: var(--shadow-lg);
2561
- --shadow-sm: 0px 0px 0px 1px rgb(0 0 0 / 0), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.04), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2562
- --shadow-social-button: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-social-button-border, transparent), var(--shadow-component-default);
2563
- --shadow-social-button-focus: var(--shadow-social-button), var(--shadow-component-focus-ring);
2564
- --shadow-social-button-focus-ring: var(--shadow-component-focus-ring);
2565
- --shadow-textarea: inset 0px 0px 0px var(--bh-border-width-default) var(--bh-textarea-border, var(--bh-border-input)), var(--shadow-component-default);
2566
- --shadow-xl: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), 0px 12px 12px -6px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.08), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2567
- --shadow-xs: 0px 0px 0px 1px rgb(0 0 0 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2568
- --soft: var(--bh-interactive-soft-default);
2569
- --soft-hover: var(--bh-interactive-soft-hover);
2570
- --soft-pressed: var(--bh-interactive-soft-pressed);
2571
- --success: var(--bh-bg-success-default);
2572
- --success-foreground: var(--bh-content-on-color);
2573
- --success-hover: var(--bh-bg-success-bold);
2574
- --success-pressed: var(--bh-bg-success-strong);
2575
- --warning: var(--bh-bg-warning-default);
2576
- --warning-foreground: var(--bh-content-on-light);
2577
- --warning-hover: var(--bh-bg-warning-bold);
2578
- --warning-pressed: var(--bh-bg-warning-strong);
2579
- --warning-soft: var(--bh-bg-warning-subtle);
2580
- --warning-soft-foreground: var(--bh-content-warning-default);
2581
- --warning-soft-hover: var(--bh-bg-warning-soft);
2374
+ --elevation-01: 0px 0px 0px 1px rgb(0 0 0 / 0), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2375
+ --elevation-02: 0px 0px 0px 1px rgb(0 0 0 / 0), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.04), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2376
+ --elevation-03: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.06), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2377
+ --elevation-04: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.06), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2378
+ --elevation-05: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), 0px 12px 12px -6px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.08), inset 0px 0px 0px 1px rgb(255 255 255 / 0.04);
2379
+ --elevation-06: 0px 0px 0px 1px rgb(0 0 0 / 0.16), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), 0px 12px 12px -6px rgb(0 0 0 / 0.18), 0px 24px 24px -12px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.08), inset 0px 0px 0px 1px rgb(255 255 255 / 0.06);
2380
+ --elevation-07: 0px 0px 0px 1px rgb(0 0 0 / 0.2), 0px 1px 1px -0.5px rgb(0 0 0 / 0.18), 0px 3px 3px -1.5px rgb(0 0 0 / 0.18), 0px 6px 6px -3px rgb(0 0 0 / 0.18), 0px 12px 12px -6px rgb(0 0 0 / 0.18), 0px 24px 24px -12px rgb(0 0 0 / 0.18), 0px 48px 48px -24px rgb(0 0 0 / 0.18), inset 0px 1px 0px 0px rgb(255 255 255 / 0.11), inset 0px 0px 0px 1px rgb(255 255 255 / 0.06);
2381
+ --elevation-component-default: 0px 1px 2px 0px rgb(0 0 0 / 0.36), inset 0px 1px 0px 0px rgb(255 255 255 / 0.05), inset 0px -1px 0px 0px rgb(0 0 0 / 0.28);
2382
+ --elevation-component-raised: inset 0px 1px 0px 0px rgb(255 255 255 / 0.05), inset 0px -1px 0px 0px rgb(0 0 0 / 0.32), 0px 1px 2px 0px rgb(0 0 0 / 0.32);
2383
+ --elevation-component-surface: inset 0px -1px 0px 0px rgb(0 0 0 / 0.32), 0px 1px 2px 0px rgb(0 0 0 / 0.32);
2582
2384
  }
2583
2385
 
2584
- /* Banhaten brand theme dark token modes: generated from tokens/banhaten.tokens.json. */
2585
-
2586
2386
  /* End Banhaten brand theme dark token modes. */
2587
2387
 
2588
2388
  [data-radius="default"] {
@@ -2659,6 +2459,40 @@
2659
2459
 
2660
2460
  /* Banhaten authored token utilities. */
2661
2461
 
2462
+ /* Remove Tailwind's parallel depth scale; Banhaten publishes elevation only. */
2463
+ @theme {
2464
+ --shadow-*: initial;
2465
+ --inset-shadow-*: initial;
2466
+ --drop-shadow-*: initial;
2467
+ --text-shadow-*: initial;
2468
+ }
2469
+
2470
+ /* Neutralize Tailwind's emitted defaults when this file is imported after it. */
2471
+ :root,
2472
+ :host {
2473
+ --shadow-2xs: unset;
2474
+ --shadow-xs: unset;
2475
+ --shadow-sm: unset;
2476
+ --shadow-md: unset;
2477
+ --shadow-lg: unset;
2478
+ --shadow-xl: unset;
2479
+ --shadow-2xl: unset;
2480
+ --inset-shadow-2xs: initial;
2481
+ --inset-shadow-xs: initial;
2482
+ --inset-shadow-sm: initial;
2483
+ --drop-shadow-xs: initial;
2484
+ --drop-shadow-sm: initial;
2485
+ --drop-shadow-md: initial;
2486
+ --drop-shadow-lg: initial;
2487
+ --drop-shadow-xl: initial;
2488
+ --drop-shadow-2xl: initial;
2489
+ --text-shadow-2xs: initial;
2490
+ --text-shadow-xs: initial;
2491
+ --text-shadow-sm: initial;
2492
+ --text-shadow-md: initial;
2493
+ --text-shadow-lg: initial;
2494
+ }
2495
+
2662
2496
  @theme inline {
2663
2497
  --font-sans: var(--bh-font-family);
2664
2498
  --default-border-width: var(--bh-border-width-default);
@@ -2716,6 +2550,30 @@
2716
2550
  }
2717
2551
  }
2718
2552
 
2553
+ @keyframes collapsible-down {
2554
+ from {
2555
+ height: 0;
2556
+ opacity: var(--bh-opacity-0);
2557
+ }
2558
+
2559
+ to {
2560
+ height: var(--radix-collapsible-content-height);
2561
+ opacity: var(--bh-opacity-100);
2562
+ }
2563
+ }
2564
+
2565
+ @keyframes collapsible-up {
2566
+ from {
2567
+ height: var(--radix-collapsible-content-height);
2568
+ opacity: var(--bh-opacity-100);
2569
+ }
2570
+
2571
+ to {
2572
+ height: 0;
2573
+ opacity: var(--bh-opacity-0);
2574
+ }
2575
+ }
2576
+
2719
2577
  @keyframes bh-spinner-steady {
2720
2578
  to {
2721
2579
  transform: rotate(360deg);