bromcom-ui 2.7.38-rc.13 → 2.7.38-rc.14

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 (296) hide show
  1. package/dist/bromcom-ui/bromcom-ui.css +1 -1
  2. package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
  3. package/dist/bromcom-ui/{p-14d4b66f.entry.js → p-047c35b1.entry.js} +1 -1
  4. package/dist/bromcom-ui/p-0fb362d7.entry.js +5 -0
  5. package/dist/bromcom-ui/p-16b50160.js +1 -1
  6. package/dist/bromcom-ui/p-1ff8838d.entry.js +5 -0
  7. package/dist/bromcom-ui/p-27429bb5.entry.js +5 -0
  8. package/dist/bromcom-ui/{p-134c6c32.entry.js → p-29866cdb.entry.js} +1 -1
  9. package/dist/bromcom-ui/p-2a1f44d8.entry.js +5 -0
  10. package/dist/bromcom-ui/p-2a5b5ecc.entry.js +5 -0
  11. package/dist/bromcom-ui/p-335dd2b5.entry.js +5 -0
  12. package/dist/bromcom-ui/p-3cbeb4dc.entry.js +5 -0
  13. package/dist/bromcom-ui/{p-a39daf28.entry.js → p-3ed25f2b.entry.js} +2 -2
  14. package/dist/bromcom-ui/p-4487e8c2.js +1 -1
  15. package/dist/bromcom-ui/{p-18b8a460.js → p-44f3ca76.js} +1 -1
  16. package/dist/bromcom-ui/p-468af02f.entry.js +5 -0
  17. package/dist/bromcom-ui/p-480024c3.js +5 -0
  18. package/dist/bromcom-ui/p-4b2852a8.entry.js +5 -0
  19. package/dist/bromcom-ui/p-4c91002a.js +5 -0
  20. package/dist/bromcom-ui/p-4debe197.entry.js +5 -0
  21. package/dist/bromcom-ui/p-4f5acd80.entry.js +5 -0
  22. package/dist/bromcom-ui/p-503a376b.entry.js +5 -0
  23. package/dist/bromcom-ui/p-56898932.js +1 -1
  24. package/dist/bromcom-ui/p-58c108a5.entry.js +5 -0
  25. package/dist/bromcom-ui/p-5b664dec.js +5 -0
  26. package/dist/bromcom-ui/p-5bf68f57.entry.js +5 -0
  27. package/dist/bromcom-ui/p-5d70f446.entry.js +5 -0
  28. package/dist/bromcom-ui/{p-a183a09f.entry.js → p-5de651cc.entry.js} +1 -1
  29. package/dist/bromcom-ui/p-5ebfa466.entry.js +5 -0
  30. package/dist/bromcom-ui/p-60947a22.entry.js +5 -0
  31. package/dist/bromcom-ui/p-67e6f5fe.entry.js +5 -0
  32. package/dist/bromcom-ui/p-687f8d9c.entry.js +5 -0
  33. package/dist/bromcom-ui/p-6d7be2d1.entry.js +5 -0
  34. package/dist/bromcom-ui/p-6e9e2e3b.entry.js +5 -0
  35. package/dist/bromcom-ui/{p-9a9151f4.js → p-74bac994.js} +1 -1
  36. package/dist/bromcom-ui/p-882f8cb1.entry.js +5 -0
  37. package/dist/bromcom-ui/p-8b9d2bb3.entry.js +5 -0
  38. package/dist/bromcom-ui/p-9799c72f.entry.js +5 -0
  39. package/dist/bromcom-ui/p-98af14a9.entry.js +5 -0
  40. package/dist/bromcom-ui/p-a1c843ae.entry.js +5 -0
  41. package/dist/bromcom-ui/p-a373d8b6.entry.js +5 -0
  42. package/dist/bromcom-ui/{p-39175c90.js → p-a3b9fc0c.js} +1 -1
  43. package/dist/bromcom-ui/p-a429e85b.js +1 -1
  44. package/dist/bromcom-ui/p-ab6d3082.entry.js +5 -0
  45. package/dist/bromcom-ui/p-ac1f9851.entry.js +5 -0
  46. package/dist/bromcom-ui/p-aff12492.entry.js +5 -0
  47. package/dist/bromcom-ui/p-b963626d.js +5 -0
  48. package/dist/bromcom-ui/p-ba73ad6b.entry.js +5 -0
  49. package/dist/bromcom-ui/{p-731eb879.js → p-bd031390.js} +1 -1
  50. package/dist/bromcom-ui/p-bdb0dfda.entry.js +5 -0
  51. package/dist/bromcom-ui/p-bef9e2fe.entry.js +5 -0
  52. package/dist/bromcom-ui/p-c0f70afa.entry.js +5 -0
  53. package/dist/bromcom-ui/p-ce1f522e.entry.js +5 -0
  54. package/dist/bromcom-ui/p-cebefc96.entry.js +5 -0
  55. package/dist/bromcom-ui/p-d01e8312.entry.js +5 -0
  56. package/dist/bromcom-ui/{p-9a5e145b.js → p-d651e723.js} +1 -1
  57. package/dist/bromcom-ui/p-d73e3d1d.entry.js +5 -0
  58. package/dist/bromcom-ui/p-d8fd3bbb.entry.js +5 -0
  59. package/dist/bromcom-ui/p-d9baf5e7.entry.js +5 -0
  60. package/dist/bromcom-ui/p-dda54e92.entry.js +5 -0
  61. package/dist/bromcom-ui/p-e34ad7a7.entry.js +5 -0
  62. package/dist/bromcom-ui/p-e38087d9.entry.js +5 -0
  63. package/dist/bromcom-ui/p-e3bfaffd.entry.js +5 -0
  64. package/dist/bromcom-ui/p-e74b4689.entry.js +5 -0
  65. package/dist/bromcom-ui/p-ea21c68d.entry.js +5 -0
  66. package/dist/bromcom-ui/p-ef787294.entry.js +5 -0
  67. package/dist/cjs/{bcm-ab921827.js → bcm-634604e3.js} +4 -4
  68. package/dist/cjs/bcm-accordion.cjs.entry.js +3 -1
  69. package/dist/cjs/bcm-alert.cjs.entry.js +4 -3
  70. package/dist/cjs/bcm-attendance.cjs.entry.js +3 -1
  71. package/dist/cjs/bcm-avatar_2.cjs.entry.js +12 -11
  72. package/dist/cjs/bcm-breadcrumb.cjs.entry.js +2 -1
  73. package/dist/cjs/bcm-button-group.cjs.entry.js +7 -6
  74. package/dist/cjs/bcm-button.cjs.entry.js +13 -12
  75. package/dist/cjs/bcm-card.cjs.entry.js +6 -5
  76. package/dist/cjs/bcm-checkbox-group.cjs.entry.js +25 -24
  77. package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +6 -5
  78. package/dist/cjs/bcm-checkbox_2.cjs.entry.js +11 -10
  79. package/dist/cjs/bcm-chip.cjs.entry.js +3 -2
  80. package/dist/cjs/bcm-collapse.cjs.entry.js +2 -1
  81. package/dist/cjs/bcm-color-input.cjs.entry.js +7 -6
  82. package/dist/cjs/bcm-colorful_2.cjs.entry.js +10 -9
  83. package/dist/cjs/bcm-date-picker.cjs.entry.js +4 -3
  84. package/dist/cjs/bcm-datetime-picker.cjs.entry.js +9 -8
  85. package/dist/cjs/bcm-default.cjs.entry.js +3 -1
  86. package/dist/cjs/bcm-drawer.cjs.entry.js +9 -8
  87. package/dist/cjs/bcm-dropdown.cjs.entry.js +7 -6
  88. package/dist/cjs/bcm-expansion-panel.cjs.entry.js +5 -4
  89. package/dist/cjs/bcm-form-2.cjs.entry.js +5 -4
  90. package/dist/cjs/bcm-form.cjs.entry.js +2 -2
  91. package/dist/cjs/{bcm-list.cjs.entry.js → bcm-icon_3.cjs.entry.js} +383 -113
  92. package/dist/cjs/bcm-input-custom.cjs.entry.js +73 -0
  93. package/dist/cjs/bcm-input.cjs.entry.js +12 -11
  94. package/dist/cjs/bcm-item.cjs.entry.js +5 -4
  95. package/dist/cjs/bcm-items.cjs.entry.js +4 -3
  96. package/dist/cjs/bcm-label_2.cjs.entry.js +39 -15
  97. package/dist/cjs/bcm-link.cjs.entry.js +3 -3
  98. package/dist/cjs/bcm-menu.cjs.entry.js +9 -8
  99. package/dist/cjs/bcm-modal.cjs.entry.js +7 -6
  100. package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +6 -5
  101. package/dist/cjs/bcm-popconfirm.cjs.entry.js +5 -4
  102. package/dist/cjs/bcm-popover.cjs.entry.js +88 -38
  103. package/dist/cjs/bcm-progress.cjs.entry.js +5 -4
  104. package/dist/cjs/bcm-radio-group.cjs.entry.js +77 -211
  105. package/dist/cjs/bcm-radio.cjs.entry.js +35 -76
  106. package/dist/cjs/bcm-range.cjs.entry.js +6 -5
  107. package/dist/cjs/bcm-select.cjs.entry.js +2 -2
  108. package/dist/cjs/bcm-skeleton.cjs.entry.js +3 -1
  109. package/dist/cjs/bcm-step.cjs.entry.js +3 -2
  110. package/dist/cjs/bcm-stepper.cjs.entry.js +10 -9
  111. package/dist/cjs/bcm-switch.cjs.entry.js +9 -8
  112. package/dist/cjs/bcm-tab-group.cjs.entry.js +160 -0
  113. package/dist/cjs/bcm-tab-item-header.cjs.entry.js +87 -0
  114. package/dist/cjs/bcm-tab-item.cjs.entry.js +104 -0
  115. package/dist/cjs/bcm-tag.cjs.entry.js +15 -14
  116. package/dist/cjs/bcm-text.cjs.entry.js +63 -0
  117. package/dist/cjs/bcm-textarea.cjs.entry.js +7 -6
  118. package/dist/cjs/bcm-time-picker.cjs.entry.js +4 -3
  119. package/dist/cjs/bromcom-ui.cjs.js +1 -1
  120. package/dist/cjs/color-helper-0e3e8ce5.js +86 -0
  121. package/dist/cjs/{color-helper-c9882bd8.js → colors-25c96ed6.js} +4 -81
  122. package/dist/cjs/{floating-ui-0ca84e74.js → floating-ui-c23acc6c.js} +2 -2
  123. package/dist/cjs/{generate-1c6288f3.js → generate-9739666b.js} +38 -1
  124. package/dist/cjs/{input-template-a6387296.js → input-template-8307182a.js} +6 -6
  125. package/dist/cjs/{json-parse-decarator-fb0443a2.js → json-parse-decarator-7a7415e0.js} +1 -1
  126. package/dist/cjs/{label-template-e83fc65c.js → label-template-098a30a4.js} +3 -3
  127. package/dist/cjs/loader.cjs.js +1 -1
  128. package/dist/cjs/{number-helper-9cb681ed.js → number-helper-063f8c7b.js} +1 -1
  129. package/dist/cjs/old-bcm-popover-box.cjs.entry.js +7 -6
  130. package/dist/cjs/old-bcm-popover.cjs.entry.js +5 -4
  131. package/dist/cjs/{popover-placement-5db8811b.js → popover-placement-69d37a5f.js} +1 -1
  132. package/dist/cjs/{slot-template-175c51fb.js → slot-template-7a07f865.js} +1 -1
  133. package/dist/cjs/{stepper-states-5ba5cabd.js → stepper-states-7dd1eab4.js} +1 -1
  134. package/dist/cjs/{string-helper-087a8134.js → string-helper-71b10c53.js} +2 -2
  135. package/dist/cjs/{tooltip-helper-348e4222.js → tooltip-helper-01c69059.js} +43 -13
  136. package/dist/cjs/{validators-d8faa4be.js → validators-861b4246.js} +1 -1
  137. package/dist/collection/collection-manifest.json +2 -1
  138. package/dist/collection/components/external-source/bcm-toast-helper.js +20 -0
  139. package/dist/collection/components/external-source/test.js/bcm-toast-helper.js +20 -0
  140. package/dist/collection/components/molecules/popover/popover.js +106 -1
  141. package/dist/collection/components/molecules/radio/{group.js → radio-group.js} +163 -246
  142. package/dist/collection/components/molecules/radio/radio.js +42 -132
  143. package/dist/collection/components/molecules/tooltip/tooltip.js +108 -1
  144. package/dist/collection/components/organism/states/bcm-list2.states.js +1 -1
  145. package/dist/collection/components/other/input-custom/input-custom.js +249 -0
  146. package/dist/collection/helper/generate.js +36 -0
  147. package/dist/collection/helper/popover-helper.js +57 -29
  148. package/dist/collection/helper/tooltip-helper.js +33 -4
  149. package/dist/components/bcm-input-custom.d.ts +11 -0
  150. package/dist/components/bcm-input-custom.js +114 -0
  151. package/dist/components/bcm-list.js +1 -1
  152. package/dist/components/bcm-popover.js +82 -29
  153. package/dist/components/bcm-radio-group.js +88 -230
  154. package/dist/components/color-helper.js +1 -405
  155. package/dist/{esm/color-helper-b5e9aa56.js → components/colors2.js} +2 -79
  156. package/dist/components/generate.js +37 -1
  157. package/dist/components/index.d.ts +2 -1
  158. package/dist/components/index.js +1 -0
  159. package/dist/components/radio.js +38 -82
  160. package/dist/components/tooltip-helper.js +33 -3
  161. package/dist/components/tooltip.js +28 -2
  162. package/dist/esm/bcm-9f50af9c.js +1 -1
  163. package/dist/esm/bcm-accordion.entry.js +3 -1
  164. package/dist/esm/bcm-alert.entry.js +2 -1
  165. package/dist/esm/bcm-attendance.entry.js +3 -1
  166. package/dist/esm/bcm-avatar_2.entry.js +6 -5
  167. package/dist/esm/bcm-breadcrumb.entry.js +2 -1
  168. package/dist/esm/bcm-button-group.entry.js +3 -2
  169. package/dist/esm/bcm-button.entry.js +4 -3
  170. package/dist/esm/bcm-card.entry.js +3 -2
  171. package/dist/esm/bcm-checkbox-group.entry.js +9 -8
  172. package/dist/esm/bcm-checkbox-lite_9.entry.js +3 -2
  173. package/dist/esm/bcm-checkbox_2.entry.js +4 -3
  174. package/dist/esm/bcm-chip.entry.js +3 -2
  175. package/dist/esm/bcm-collapse.entry.js +2 -1
  176. package/dist/esm/bcm-color-input.entry.js +5 -4
  177. package/dist/esm/bcm-colorful_2.entry.js +6 -5
  178. package/dist/esm/bcm-date-picker.entry.js +3 -2
  179. package/dist/esm/bcm-datetime-picker.entry.js +3 -2
  180. package/dist/esm/bcm-default.entry.js +3 -1
  181. package/dist/esm/bcm-drawer.entry.js +6 -5
  182. package/dist/esm/bcm-dropdown.entry.js +4 -3
  183. package/dist/esm/bcm-expansion-panel.entry.js +3 -2
  184. package/dist/esm/bcm-form-2.entry.js +3 -2
  185. package/dist/esm/{bcm-list.entry.js → bcm-icon_3.entry.js} +314 -46
  186. package/dist/esm/bcm-input-custom.entry.js +69 -0
  187. package/dist/esm/bcm-input.entry.js +6 -5
  188. package/dist/esm/bcm-item.entry.js +4 -3
  189. package/dist/esm/bcm-items.entry.js +3 -2
  190. package/dist/esm/bcm-label_2.entry.js +32 -8
  191. package/dist/esm/bcm-link.entry.js +1 -1
  192. package/dist/esm/bcm-menu.entry.js +6 -5
  193. package/dist/esm/bcm-modal.entry.js +3 -2
  194. package/dist/esm/bcm-popconfirm-box.entry.js +3 -2
  195. package/dist/esm/bcm-popconfirm.entry.js +3 -2
  196. package/dist/esm/bcm-popover.entry.js +85 -35
  197. package/dist/esm/bcm-progress.entry.js +4 -3
  198. package/dist/esm/bcm-radio-group.entry.js +72 -206
  199. package/dist/esm/bcm-radio.entry.js +35 -76
  200. package/dist/esm/bcm-range.entry.js +3 -2
  201. package/dist/esm/bcm-skeleton.entry.js +3 -1
  202. package/dist/esm/bcm-step.entry.js +3 -2
  203. package/dist/esm/bcm-stepper.entry.js +7 -6
  204. package/dist/esm/bcm-switch.entry.js +3 -2
  205. package/dist/esm/bcm-tab-group.entry.js +156 -0
  206. package/dist/esm/bcm-tab-item-header.entry.js +83 -0
  207. package/dist/esm/bcm-tab-item.entry.js +100 -0
  208. package/dist/esm/bcm-tag.entry.js +4 -3
  209. package/dist/esm/bcm-text.entry.js +59 -0
  210. package/dist/esm/bcm-textarea.entry.js +4 -3
  211. package/dist/esm/bcm-time-picker.entry.js +3 -2
  212. package/dist/esm/bromcom-ui.js +1 -1
  213. package/dist/esm/color-helper-0277e11a.js +84 -0
  214. package/dist/esm/colors-fabca483.js +411 -0
  215. package/dist/esm/floating-ui-4a49ea46.js +1 -1
  216. package/dist/esm/{generate-6d61a8d4.js → generate-0dc9b243.js} +38 -1
  217. package/dist/esm/{input-template-5377ad24.js → input-template-de00be57.js} +2 -2
  218. package/dist/esm/{json-parse-decarator-24e9b234.js → json-parse-decarator-5b16dfec.js} +1 -1
  219. package/dist/esm/label-template-eed2dd69.js +1 -1
  220. package/dist/esm/loader.js +1 -1
  221. package/dist/esm/{number-helper-056c158e.js → number-helper-282f0beb.js} +1 -1
  222. package/dist/esm/old-bcm-popover-box.entry.js +3 -2
  223. package/dist/esm/old-bcm-popover.entry.js +3 -2
  224. package/dist/esm/{stepper-states-450629eb.js → stepper-states-fdf47afe.js} +1 -1
  225. package/dist/esm/string-helper-0fb7ff20.js +1 -1
  226. package/dist/esm/{tooltip-helper-05959548.js → tooltip-helper-4e2db0c0.js} +38 -8
  227. package/dist/esm/{validators-649cde78.js → validators-089d15b9.js} +1 -1
  228. package/dist/types/components/external-source/bcm-toast-helper.d.ts +12 -0
  229. package/dist/types/components/external-source/test.js/bcm-toast-helper.d.ts +12 -0
  230. package/dist/types/components/molecules/popover/popover.d.ts +10 -1
  231. package/dist/types/components/molecules/radio/{group.d.ts → radio-group.d.ts} +19 -27
  232. package/dist/types/components/molecules/radio/radio.d.ts +5 -11
  233. package/dist/types/components/molecules/tooltip/tooltip.d.ts +10 -1
  234. package/dist/types/components/other/input-custom/input-custom.d.ts +20 -0
  235. package/dist/types/components.d.ts +76 -33
  236. package/dist/types/helper/generate.d.ts +2 -0
  237. package/dist/types/helper/popover-helper.d.ts +13 -3
  238. package/dist/types/helper/tooltip-helper.d.ts +13 -3
  239. package/package.json +1 -1
  240. package/dist/bromcom-ui/p-0b10d948.entry.js +0 -5
  241. package/dist/bromcom-ui/p-125b65f6.entry.js +0 -5
  242. package/dist/bromcom-ui/p-1945b686.entry.js +0 -5
  243. package/dist/bromcom-ui/p-29dc2191.js +0 -5
  244. package/dist/bromcom-ui/p-2a391ece.entry.js +0 -5
  245. package/dist/bromcom-ui/p-2ec946a1.entry.js +0 -5
  246. package/dist/bromcom-ui/p-33f4e17f.entry.js +0 -5
  247. package/dist/bromcom-ui/p-36224b1d.entry.js +0 -5
  248. package/dist/bromcom-ui/p-366e47ab.entry.js +0 -5
  249. package/dist/bromcom-ui/p-41c296b0.entry.js +0 -5
  250. package/dist/bromcom-ui/p-41dc9559.entry.js +0 -5
  251. package/dist/bromcom-ui/p-45367974.entry.js +0 -5
  252. package/dist/bromcom-ui/p-50db7a26.entry.js +0 -5
  253. package/dist/bromcom-ui/p-579e8412.entry.js +0 -5
  254. package/dist/bromcom-ui/p-5a899703.entry.js +0 -5
  255. package/dist/bromcom-ui/p-5e55f59b.entry.js +0 -5
  256. package/dist/bromcom-ui/p-5efd7090.entry.js +0 -5
  257. package/dist/bromcom-ui/p-688f1e5e.entry.js +0 -5
  258. package/dist/bromcom-ui/p-6a768487.entry.js +0 -5
  259. package/dist/bromcom-ui/p-6b321329.entry.js +0 -5
  260. package/dist/bromcom-ui/p-6c9920df.entry.js +0 -5
  261. package/dist/bromcom-ui/p-73d6483e.entry.js +0 -5
  262. package/dist/bromcom-ui/p-7aad993b.entry.js +0 -5
  263. package/dist/bromcom-ui/p-7e0b3687.entry.js +0 -5
  264. package/dist/bromcom-ui/p-82318c6a.entry.js +0 -5
  265. package/dist/bromcom-ui/p-880b9e3d.entry.js +0 -5
  266. package/dist/bromcom-ui/p-92382af0.entry.js +0 -5
  267. package/dist/bromcom-ui/p-96f555da.entry.js +0 -5
  268. package/dist/bromcom-ui/p-9c910424.entry.js +0 -5
  269. package/dist/bromcom-ui/p-a25d69f2.js +0 -5
  270. package/dist/bromcom-ui/p-a87c6718.entry.js +0 -5
  271. package/dist/bromcom-ui/p-a8d1397d.js +0 -5
  272. package/dist/bromcom-ui/p-a990ad01.entry.js +0 -5
  273. package/dist/bromcom-ui/p-aaac6552.entry.js +0 -5
  274. package/dist/bromcom-ui/p-abff65bf.entry.js +0 -5
  275. package/dist/bromcom-ui/p-bf7d791d.entry.js +0 -5
  276. package/dist/bromcom-ui/p-c2dfd997.entry.js +0 -5
  277. package/dist/bromcom-ui/p-c7d37238.entry.js +0 -5
  278. package/dist/bromcom-ui/p-cbb00d90.entry.js +0 -5
  279. package/dist/bromcom-ui/p-cf82f22a.entry.js +0 -5
  280. package/dist/bromcom-ui/p-d75546da.entry.js +0 -5
  281. package/dist/bromcom-ui/p-d8f62742.entry.js +0 -5
  282. package/dist/bromcom-ui/p-ddc53b28.entry.js +0 -5
  283. package/dist/bromcom-ui/p-e5dc36af.entry.js +0 -5
  284. package/dist/bromcom-ui/p-e85f520f.entry.js +0 -5
  285. package/dist/bromcom-ui/p-e94dcd9a.entry.js +0 -5
  286. package/dist/bromcom-ui/p-ec23e7f7.entry.js +0 -5
  287. package/dist/cjs/bcm-icon_5.cjs.entry.js +0 -378
  288. package/dist/cjs/bcm-search.cjs.entry.js +0 -258
  289. package/dist/collection/components/molecules/radio/group.css +0 -802
  290. package/dist/collection/components/molecules/radio/radio.css +0 -1287
  291. package/dist/collection/components/molecules/radio/types.js +0 -30
  292. package/dist/collection/components/molecules/states/radio-group.states.js +0 -107
  293. package/dist/esm/bcm-icon_5.entry.js +0 -370
  294. package/dist/esm/bcm-search.entry.js +0 -254
  295. package/dist/types/components/molecules/radio/types.d.ts +0 -29
  296. package/dist/types/components/molecules/states/radio-group.states.d.ts +0 -48
package/dist/collection/components/molecules/radio/radio.css DELETED
@@ -1,1287 +0,0 @@
1
- @import url("https://fonts.googleapis.com/css?family=Roboto:400,500");
2
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
3
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
4
- @import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
5
- .size-1 {
6
- font-size: 12px;
7
- line-height: 20px;
8
- }
9
-
10
- .size-2 {
11
- font-size: 14px;
12
- line-height: 22px;
13
- }
14
-
15
- .size-3 {
16
- font-size: 16px;
17
- line-height: 24px;
18
- }
19
-
20
- .size-4 {
21
- font-size: 20px;
22
- line-height: 28px;
23
- }
24
-
25
- .size-5 {
26
- font-size: 24px;
27
- line-height: 32px;
28
- }
29
-
30
- .size-6 {
31
- font-size: 30px;
32
- line-height: 38px;
33
- }
34
-
35
- .size-7 {
36
- font-size: 38px;
37
- line-height: 46px;
38
- }
39
-
40
- .size-8 {
41
- font-size: 46px;
42
- line-height: 54px;
43
- }
44
-
45
- .size-9 {
46
- font-size: 56px;
47
- line-height: 64px;
48
- }
49
-
50
- .weight-regular {
51
- font-weight: 400;
52
- }
53
-
54
- .weight-semibold {
55
- font-weight: 500;
56
- }
57
-
58
- /**
59
- * Generator
60
- */
61
- .input-size-large {
62
- height: 40px;
63
- }
64
-
65
- .input-size-medium {
66
- height: 32px;
67
- }
68
-
69
- .input-size-small {
70
- height: 24px;
71
- }
72
-
73
- .resize-none textarea {
74
- resize: none;
75
- }
76
-
77
- .resize-vertical textarea {
78
- resize: vertical;
79
- }
80
-
81
- .resize-auto textarea {
82
- height: auto;
83
- resize: none;
84
- }
85
-
86
- .textarea-size-large {
87
- padding: 4px 0 0 4px;
88
- min-height: 40px;
89
- }
90
- .textarea-size-large .bcm-input-element {
91
- min-height: calc((40px - 8px) + 2px);
92
- }
93
- .textarea-size-large .input-clear-button {
94
- height: calc( 40px - 16px );
95
- top: 8px;
96
- padding: 0;
97
- margin-right: 8px;
98
- }
99
-
100
- .textarea-size-medium {
101
- padding: 4px 0 0 4px;
102
- min-height: 32px;
103
- }
104
- .textarea-size-medium .bcm-input-element {
105
- min-height: calc((32px - 8px) + 2px);
106
- }
107
- .textarea-size-medium .input-clear-button {
108
- height: calc( 32px - 16px );
109
- top: 8px;
110
- padding: 0;
111
- margin-right: 8px;
112
- }
113
-
114
- .textarea-size-small {
115
- padding: 0px 0 0 4px;
116
- min-height: 24px;
117
- }
118
- .textarea-size-small .bcm-input-element {
119
- min-height: calc((24px - 8px) + 2px);
120
- }
121
- .textarea-size-small .input-clear-button {
122
- height: calc( 24px - 16px );
123
- top: 8px;
124
- padding: 0;
125
- margin-right: 8px;
126
- }
127
-
128
- :root,
129
- ::after,
130
- ::before {
131
- --bcm-new-ds-color-inherit: inherit;
132
- --bcm-new-ds-color-current: currentColor;
133
- --bcm-new-ds-color-transparent: transparent;
134
- --bcm-new-ds-color-black: #000;
135
- --bcm-new-ds-color-white: #fff;
136
- --bcm-new-ds-color-slate: #64748b;
137
- --bcm-new-ds-color-slate-50: #f8fafc;
138
- --bcm-new-ds-color-slate-100: #f1f5f9;
139
- --bcm-new-ds-color-slate-200: #e2e8f0;
140
- --bcm-new-ds-color-slate-300: #cbd5e1;
141
- --bcm-new-ds-color-slate-400: #94a3b8;
142
- --bcm-new-ds-color-slate-500: #64748b;
143
- --bcm-new-ds-color-slate-600: #475569;
144
- --bcm-new-ds-color-slate-700: #334155;
145
- --bcm-new-ds-color-slate-800: #1e293b;
146
- --bcm-new-ds-color-slate-900: #0f172a;
147
- --bcm-new-ds-color-gray: #6b7280;
148
- --bcm-new-ds-color-gray-50: #f9fafb;
149
- --bcm-new-ds-color-gray-100: #f3f4f6;
150
- --bcm-new-ds-color-gray-200: #e5e7eb;
151
- --bcm-new-ds-color-gray-300: #d1d5db;
152
- --bcm-new-ds-color-gray-400: #9ca3af;
153
- --bcm-new-ds-color-gray-500: #6b7280;
154
- --bcm-new-ds-color-gray-600: #4b5563;
155
- --bcm-new-ds-color-gray-700: #374151;
156
- --bcm-new-ds-color-gray-800: #1f2937;
157
- --bcm-new-ds-color-gray-900: #111827;
158
- --bcm-new-ds-color-zinc: #71717a;
159
- --bcm-new-ds-color-zinc-50: #fafafa;
160
- --bcm-new-ds-color-zinc-100: #f4f4f5;
161
- --bcm-new-ds-color-zinc-200: #e4e4e7;
162
- --bcm-new-ds-color-zinc-300: #d4d4d8;
163
- --bcm-new-ds-color-zinc-400: #a1a1aa;
164
- --bcm-new-ds-color-zinc-500: #71717a;
165
- --bcm-new-ds-color-zinc-600: #52525b;
166
- --bcm-new-ds-color-zinc-700: #3f3f46;
167
- --bcm-new-ds-color-zinc-800: #27272a;
168
- --bcm-new-ds-color-zinc-900: #18181b;
169
- --bcm-new-ds-color-neutral: #737373;
170
- --bcm-new-ds-color-neutral-50: #fafafa;
171
- --bcm-new-ds-color-neutral-100: #f5f5f5;
172
- --bcm-new-ds-color-neutral-200: #e5e5e5;
173
- --bcm-new-ds-color-neutral-300: #d4d4d4;
174
- --bcm-new-ds-color-neutral-400: #a3a3a3;
175
- --bcm-new-ds-color-neutral-500: #737373;
176
- --bcm-new-ds-color-neutral-600: #525252;
177
- --bcm-new-ds-color-neutral-700: #404040;
178
- --bcm-new-ds-color-neutral-800: #262626;
179
- --bcm-new-ds-color-neutral-900: #171717;
180
- --bcm-new-ds-color-stone: #78716c;
181
- --bcm-new-ds-color-stone-50: #fafaf9;
182
- --bcm-new-ds-color-stone-100: #f5f5f4;
183
- --bcm-new-ds-color-stone-200: #e7e5e4;
184
- --bcm-new-ds-color-stone-300: #d6d3d1;
185
- --bcm-new-ds-color-stone-400: #a8a29e;
186
- --bcm-new-ds-color-stone-500: #78716c;
187
- --bcm-new-ds-color-stone-600: #57534e;
188
- --bcm-new-ds-color-stone-700: #44403c;
189
- --bcm-new-ds-color-stone-800: #292524;
190
- --bcm-new-ds-color-stone-900: #1c1917;
191
- --bcm-new-ds-color-red: #ef4444;
192
- --bcm-new-ds-color-red-50: #fef2f2;
193
- --bcm-new-ds-color-red-100: #fee2e2;
194
- --bcm-new-ds-color-red-200: #fecaca;
195
- --bcm-new-ds-color-red-300: #fca5a5;
196
- --bcm-new-ds-color-red-400: #f87171;
197
- --bcm-new-ds-color-red-500: #ef4444;
198
- --bcm-new-ds-color-red-600: #dc2626;
199
- --bcm-new-ds-color-red-700: #b91c1c;
200
- --bcm-new-ds-color-red-800: #991b1b;
201
- --bcm-new-ds-color-red-900: #7f1d1d;
202
- --bcm-new-ds-color-orange: #f97316;
203
- --bcm-new-ds-color-orange-50: #fff7ed;
204
- --bcm-new-ds-color-orange-100: #ffedd5;
205
- --bcm-new-ds-color-orange-200: #fed7aa;
206
- --bcm-new-ds-color-orange-300: #fdba74;
207
- --bcm-new-ds-color-orange-400: #fb923c;
208
- --bcm-new-ds-color-orange-500: #f97316;
209
- --bcm-new-ds-color-orange-600: #ea580c;
210
- --bcm-new-ds-color-orange-700: #c2410c;
211
- --bcm-new-ds-color-orange-800: #9a3412;
212
- --bcm-new-ds-color-orange-900: #7c2d12;
213
- --bcm-new-ds-color-amber: #f59e0b;
214
- --bcm-new-ds-color-amber-50: #fffbeb;
215
- --bcm-new-ds-color-amber-100: #fef3c7;
216
- --bcm-new-ds-color-amber-200: #fde68a;
217
- --bcm-new-ds-color-amber-300: #fcd34d;
218
- --bcm-new-ds-color-amber-400: #fbbf24;
219
- --bcm-new-ds-color-amber-500: #f59e0b;
220
- --bcm-new-ds-color-amber-600: #d97706;
221
- --bcm-new-ds-color-amber-700: #b45309;
222
- --bcm-new-ds-color-amber-800: #92400e;
223
- --bcm-new-ds-color-amber-900: #78350f;
224
- --bcm-new-ds-color-yellow: #eab308;
225
- --bcm-new-ds-color-yellow-50: #fefce8;
226
- --bcm-new-ds-color-yellow-100: #fef9c3;
227
- --bcm-new-ds-color-yellow-200: #fef08a;
228
- --bcm-new-ds-color-yellow-300: #fde047;
229
- --bcm-new-ds-color-yellow-400: #facc15;
230
- --bcm-new-ds-color-yellow-500: #eab308;
231
- --bcm-new-ds-color-yellow-600: #ca8a04;
232
- --bcm-new-ds-color-yellow-700: #a16207;
233
- --bcm-new-ds-color-yellow-800: #854d0e;
234
- --bcm-new-ds-color-yellow-900: #713f12;
235
- --bcm-new-ds-color-lime: #84cc16;
236
- --bcm-new-ds-color-lime-50: #f7fee7;
237
- --bcm-new-ds-color-lime-100: #ecfccb;
238
- --bcm-new-ds-color-lime-200: #d9f99d;
239
- --bcm-new-ds-color-lime-300: #bef264;
240
- --bcm-new-ds-color-lime-400: #a3e635;
241
- --bcm-new-ds-color-lime-500: #84cc16;
242
- --bcm-new-ds-color-lime-600: #65a30d;
243
- --bcm-new-ds-color-lime-700: #4d7c0f;
244
- --bcm-new-ds-color-lime-800: #3f6212;
245
- --bcm-new-ds-color-lime-900: #365314;
246
- --bcm-new-ds-color-green: #22c55e;
247
- --bcm-new-ds-color-green-50: #f0fdf4;
248
- --bcm-new-ds-color-green-100: #dcfce7;
249
- --bcm-new-ds-color-green-200: #bbf7d0;
250
- --bcm-new-ds-color-green-300: #86efac;
251
- --bcm-new-ds-color-green-400: #4ade80;
252
- --bcm-new-ds-color-green-500: #22c55e;
253
- --bcm-new-ds-color-green-600: #16a34a;
254
- --bcm-new-ds-color-green-700: #15803d;
255
- --bcm-new-ds-color-green-800: #166534;
256
- --bcm-new-ds-color-green-900: #14532d;
257
- --bcm-new-ds-color-emerald: #10b981;
258
- --bcm-new-ds-color-emerald-50: #ecfdf5;
259
- --bcm-new-ds-color-emerald-100: #d1fae5;
260
- --bcm-new-ds-color-emerald-200: #a7f3d0;
261
- --bcm-new-ds-color-emerald-300: #6ee7b7;
262
- --bcm-new-ds-color-emerald-400: #34d399;
263
- --bcm-new-ds-color-emerald-500: #10b981;
264
- --bcm-new-ds-color-emerald-600: #059669;
265
- --bcm-new-ds-color-emerald-700: #047857;
266
- --bcm-new-ds-color-emerald-800: #065f46;
267
- --bcm-new-ds-color-emerald-900: #064e3b;
268
- --bcm-new-ds-color-teal: #14b8a6;
269
- --bcm-new-ds-color-teal-50: #f0fdfa;
270
- --bcm-new-ds-color-teal-100: #ccfbf1;
271
- --bcm-new-ds-color-teal-200: #99f6e4;
272
- --bcm-new-ds-color-teal-300: #5eead4;
273
- --bcm-new-ds-color-teal-400: #2dd4bf;
274
- --bcm-new-ds-color-teal-500: #14b8a6;
275
- --bcm-new-ds-color-teal-600: #0d9488;
276
- --bcm-new-ds-color-teal-700: #0f766e;
277
- --bcm-new-ds-color-teal-800: #115e59;
278
- --bcm-new-ds-color-teal-900: #134e4a;
279
- --bcm-new-ds-color-cyan: #06b6d4;
280
- --bcm-new-ds-color-cyan-50: #ecfeff;
281
- --bcm-new-ds-color-cyan-100: #cffafe;
282
- --bcm-new-ds-color-cyan-200: #a5f3fc;
283
- --bcm-new-ds-color-cyan-300: #67e8f9;
284
- --bcm-new-ds-color-cyan-400: #22d3ee;
285
- --bcm-new-ds-color-cyan-500: #06b6d4;
286
- --bcm-new-ds-color-cyan-600: #0891b2;
287
- --bcm-new-ds-color-cyan-700: #0e7490;
288
- --bcm-new-ds-color-cyan-800: #155e75;
289
- --bcm-new-ds-color-cyan-900: #164e63;
290
- --bcm-new-ds-color-sky: #0ea5e9;
291
- --bcm-new-ds-color-sky-50: #f0f9ff;
292
- --bcm-new-ds-color-sky-100: #e0f2fe;
293
- --bcm-new-ds-color-sky-200: #bae6fd;
294
- --bcm-new-ds-color-sky-300: #7dd3fc;
295
- --bcm-new-ds-color-sky-400: #38bdf8;
296
- --bcm-new-ds-color-sky-500: #0ea5e9;
297
- --bcm-new-ds-color-sky-600: #0284c7;
298
- --bcm-new-ds-color-sky-700: #0369a1;
299
- --bcm-new-ds-color-sky-800: #075985;
300
- --bcm-new-ds-color-sky-900: #0c4a6e;
301
- --bcm-new-ds-color-blue: #3b82f6;
302
- --bcm-new-ds-color-blue-50: #eff6ff;
303
- --bcm-new-ds-color-blue-100: #dbeafe;
304
- --bcm-new-ds-color-blue-200: #bfdbfe;
305
- --bcm-new-ds-color-blue-300: #93c5fd;
306
- --bcm-new-ds-color-blue-400: #60a5fa;
307
- --bcm-new-ds-color-blue-500: #3b82f6;
308
- --bcm-new-ds-color-blue-600: #2563eb;
309
- --bcm-new-ds-color-blue-700: #1d4ed8;
310
- --bcm-new-ds-color-blue-800: #1e40af;
311
- --bcm-new-ds-color-blue-900: #1e3a8a;
312
- --bcm-new-ds-color-indigo: #6366f1;
313
- --bcm-new-ds-color-indigo-50: #eef2ff;
314
- --bcm-new-ds-color-indigo-100: #e0e7ff;
315
- --bcm-new-ds-color-indigo-200: #c7d2fe;
316
- --bcm-new-ds-color-indigo-300: #a5b4fc;
317
- --bcm-new-ds-color-indigo-400: #818cf8;
318
- --bcm-new-ds-color-indigo-500: #6366f1;
319
- --bcm-new-ds-color-indigo-600: #4f46e5;
320
- --bcm-new-ds-color-indigo-700: #4338ca;
321
- --bcm-new-ds-color-indigo-800: #3730a3;
322
- --bcm-new-ds-color-indigo-900: #312e81;
323
- --bcm-new-ds-color-violet: #8b5cf6;
324
- --bcm-new-ds-color-violet-50: #f5f3ff;
325
- --bcm-new-ds-color-violet-100: #ede9fe;
326
- --bcm-new-ds-color-violet-200: #ddd6fe;
327
- --bcm-new-ds-color-violet-300: #c4b5fd;
328
- --bcm-new-ds-color-violet-400: #a78bfa;
329
- --bcm-new-ds-color-violet-500: #8b5cf6;
330
- --bcm-new-ds-color-violet-600: #7c3aed;
331
- --bcm-new-ds-color-violet-700: #6d28d9;
332
- --bcm-new-ds-color-violet-800: #5b21b6;
333
- --bcm-new-ds-color-violet-900: #4c1d95;
334
- --bcm-new-ds-color-purple: #a855f7;
335
- --bcm-new-ds-color-purple-50: #faf5ff;
336
- --bcm-new-ds-color-purple-100: #f3e8ff;
337
- --bcm-new-ds-color-purple-200: #e9d5ff;
338
- --bcm-new-ds-color-purple-300: #d8b4fe;
339
- --bcm-new-ds-color-purple-400: #c084fc;
340
- --bcm-new-ds-color-purple-500: #a855f7;
341
- --bcm-new-ds-color-purple-600: #9333ea;
342
- --bcm-new-ds-color-purple-700: #7e22ce;
343
- --bcm-new-ds-color-purple-800: #6b21a8;
344
- --bcm-new-ds-color-purple-900: #581c87;
345
- --bcm-new-ds-color-fuchsia: #d946ef;
346
- --bcm-new-ds-color-fuchsia-50: #fdf4ff;
347
- --bcm-new-ds-color-fuchsia-100: #fae8ff;
348
- --bcm-new-ds-color-fuchsia-200: #f5d0fe;
349
- --bcm-new-ds-color-fuchsia-300: #f0abfc;
350
- --bcm-new-ds-color-fuchsia-400: #e879f9;
351
- --bcm-new-ds-color-fuchsia-500: #d946ef;
352
- --bcm-new-ds-color-fuchsia-600: #c026d3;
353
- --bcm-new-ds-color-fuchsia-700: #a21caf;
354
- --bcm-new-ds-color-fuchsia-800: #86198f;
355
- --bcm-new-ds-color-fuchsia-900: #701a75;
356
- --bcm-new-ds-color-pink: #ec4899;
357
- --bcm-new-ds-color-pink-50: #fdf2f8;
358
- --bcm-new-ds-color-pink-100: #fce7f3;
359
- --bcm-new-ds-color-pink-200: #fbcfe8;
360
- --bcm-new-ds-color-pink-300: #f9a8d4;
361
- --bcm-new-ds-color-pink-400: #f472b6;
362
- --bcm-new-ds-color-pink-500: #ec4899;
363
- --bcm-new-ds-color-pink-600: #db2777;
364
- --bcm-new-ds-color-pink-700: #be185d;
365
- --bcm-new-ds-color-pink-800: #9d174d;
366
- --bcm-new-ds-color-pink-900: #831843;
367
- --bcm-new-ds-color-rose: #f43f5e;
368
- --bcm-new-ds-color-rose-50: #fff1f2;
369
- --bcm-new-ds-color-rose-100: #ffe4e6;
370
- --bcm-new-ds-color-rose-200: #fecdd3;
371
- --bcm-new-ds-color-rose-300: #fda4af;
372
- --bcm-new-ds-color-rose-400: #fb7185;
373
- --bcm-new-ds-color-rose-500: #f43f5e;
374
- --bcm-new-ds-color-rose-600: #e11d48;
375
- --bcm-new-ds-color-rose-700: #be123c;
376
- --bcm-new-ds-color-rose-800: #9f1239;
377
- --bcm-new-ds-color-rose-900: #881337;
378
- }
379
-
380
- * {
381
- box-sizing: border-box;
382
- }
383
-
384
- .bcm-caption-area {
385
- font-family: "Inter", sans-serif;
386
- font-size: 14px;
387
- line-height: calc(14px + 8px);
388
- font-weight: 400;
389
- font-size: 12px;
390
- line-height: calc(12px + 8px);
391
- color: var(--bcm-new-ds-color-slate-400);
392
- display: flex;
393
- flex-direction: row;
394
- align-items: flex-start;
395
- justify-content: space-between;
396
- flex-wrap: nowrap;
397
- margin-top: 2px;
398
- }
399
- .bcm-caption-area__text {
400
- color: var(--bcm-new-ds-color-slate-400);
401
- }
402
- .bcm-caption-area__text.default {
403
- color: var(--bcm-new-ds-color-slate-400);
404
- }
405
- .bcm-caption-area__text.info {
406
- color: var(--bcm-new-ds-color-blue-500);
407
- }
408
- .bcm-caption-area__text.success {
409
- color: var(--bcm-new-ds-color-emerald-500);
410
- }
411
- .bcm-caption-area__text.warning {
412
- color: var(--bcm-new-ds-color-amber-500);
413
- }
414
- .bcm-caption-area__text.error {
415
- color: var(--bcm-new-ds-color-red-500);
416
- }
417
- .bcm-caption-area__size-small {
418
- font-size: 10px;
419
- line-height: calc(10px + 8px);
420
- min-height: calc(10px + 8px);
421
- }
422
- .bcm-caption-area__size-medium {
423
- font-size: 12px;
424
- line-height: calc(12px + 8px);
425
- min-height: calc(12px + 8px);
426
- }
427
- .bcm-caption-area__size-large {
428
- font-size: 14px;
429
- line-height: calc(14px + 8px);
430
- min-height: calc(14px + 8px);
431
- }
432
-
433
- :root,
434
- ::after,
435
- ::before {
436
- --bcm-new-ds-color-inherit: inherit;
437
- --bcm-new-ds-color-current: currentColor;
438
- --bcm-new-ds-color-transparent: transparent;
439
- --bcm-new-ds-color-black: #000;
440
- --bcm-new-ds-color-white: #fff;
441
- --bcm-new-ds-color-slate: #64748b;
442
- --bcm-new-ds-color-slate-50: #f8fafc;
443
- --bcm-new-ds-color-slate-100: #f1f5f9;
444
- --bcm-new-ds-color-slate-200: #e2e8f0;
445
- --bcm-new-ds-color-slate-300: #cbd5e1;
446
- --bcm-new-ds-color-slate-400: #94a3b8;
447
- --bcm-new-ds-color-slate-500: #64748b;
448
- --bcm-new-ds-color-slate-600: #475569;
449
- --bcm-new-ds-color-slate-700: #334155;
450
- --bcm-new-ds-color-slate-800: #1e293b;
451
- --bcm-new-ds-color-slate-900: #0f172a;
452
- --bcm-new-ds-color-gray: #6b7280;
453
- --bcm-new-ds-color-gray-50: #f9fafb;
454
- --bcm-new-ds-color-gray-100: #f3f4f6;
455
- --bcm-new-ds-color-gray-200: #e5e7eb;
456
- --bcm-new-ds-color-gray-300: #d1d5db;
457
- --bcm-new-ds-color-gray-400: #9ca3af;
458
- --bcm-new-ds-color-gray-500: #6b7280;
459
- --bcm-new-ds-color-gray-600: #4b5563;
460
- --bcm-new-ds-color-gray-700: #374151;
461
- --bcm-new-ds-color-gray-800: #1f2937;
462
- --bcm-new-ds-color-gray-900: #111827;
463
- --bcm-new-ds-color-zinc: #71717a;
464
- --bcm-new-ds-color-zinc-50: #fafafa;
465
- --bcm-new-ds-color-zinc-100: #f4f4f5;
466
- --bcm-new-ds-color-zinc-200: #e4e4e7;
467
- --bcm-new-ds-color-zinc-300: #d4d4d8;
468
- --bcm-new-ds-color-zinc-400: #a1a1aa;
469
- --bcm-new-ds-color-zinc-500: #71717a;
470
- --bcm-new-ds-color-zinc-600: #52525b;
471
- --bcm-new-ds-color-zinc-700: #3f3f46;
472
- --bcm-new-ds-color-zinc-800: #27272a;
473
- --bcm-new-ds-color-zinc-900: #18181b;
474
- --bcm-new-ds-color-neutral: #737373;
475
- --bcm-new-ds-color-neutral-50: #fafafa;
476
- --bcm-new-ds-color-neutral-100: #f5f5f5;
477
- --bcm-new-ds-color-neutral-200: #e5e5e5;
478
- --bcm-new-ds-color-neutral-300: #d4d4d4;
479
- --bcm-new-ds-color-neutral-400: #a3a3a3;
480
- --bcm-new-ds-color-neutral-500: #737373;
481
- --bcm-new-ds-color-neutral-600: #525252;
482
- --bcm-new-ds-color-neutral-700: #404040;
483
- --bcm-new-ds-color-neutral-800: #262626;
484
- --bcm-new-ds-color-neutral-900: #171717;
485
- --bcm-new-ds-color-stone: #78716c;
486
- --bcm-new-ds-color-stone-50: #fafaf9;
487
- --bcm-new-ds-color-stone-100: #f5f5f4;
488
- --bcm-new-ds-color-stone-200: #e7e5e4;
489
- --bcm-new-ds-color-stone-300: #d6d3d1;
490
- --bcm-new-ds-color-stone-400: #a8a29e;
491
- --bcm-new-ds-color-stone-500: #78716c;
492
- --bcm-new-ds-color-stone-600: #57534e;
493
- --bcm-new-ds-color-stone-700: #44403c;
494
- --bcm-new-ds-color-stone-800: #292524;
495
- --bcm-new-ds-color-stone-900: #1c1917;
496
- --bcm-new-ds-color-red: #ef4444;
497
- --bcm-new-ds-color-red-50: #fef2f2;
498
- --bcm-new-ds-color-red-100: #fee2e2;
499
- --bcm-new-ds-color-red-200: #fecaca;
500
- --bcm-new-ds-color-red-300: #fca5a5;
501
- --bcm-new-ds-color-red-400: #f87171;
502
- --bcm-new-ds-color-red-500: #ef4444;
503
- --bcm-new-ds-color-red-600: #dc2626;
504
- --bcm-new-ds-color-red-700: #b91c1c;
505
- --bcm-new-ds-color-red-800: #991b1b;
506
- --bcm-new-ds-color-red-900: #7f1d1d;
507
- --bcm-new-ds-color-orange: #f97316;
508
- --bcm-new-ds-color-orange-50: #fff7ed;
509
- --bcm-new-ds-color-orange-100: #ffedd5;
510
- --bcm-new-ds-color-orange-200: #fed7aa;
511
- --bcm-new-ds-color-orange-300: #fdba74;
512
- --bcm-new-ds-color-orange-400: #fb923c;
513
- --bcm-new-ds-color-orange-500: #f97316;
514
- --bcm-new-ds-color-orange-600: #ea580c;
515
- --bcm-new-ds-color-orange-700: #c2410c;
516
- --bcm-new-ds-color-orange-800: #9a3412;
517
- --bcm-new-ds-color-orange-900: #7c2d12;
518
- --bcm-new-ds-color-amber: #f59e0b;
519
- --bcm-new-ds-color-amber-50: #fffbeb;
520
- --bcm-new-ds-color-amber-100: #fef3c7;
521
- --bcm-new-ds-color-amber-200: #fde68a;
522
- --bcm-new-ds-color-amber-300: #fcd34d;
523
- --bcm-new-ds-color-amber-400: #fbbf24;
524
- --bcm-new-ds-color-amber-500: #f59e0b;
525
- --bcm-new-ds-color-amber-600: #d97706;
526
- --bcm-new-ds-color-amber-700: #b45309;
527
- --bcm-new-ds-color-amber-800: #92400e;
528
- --bcm-new-ds-color-amber-900: #78350f;
529
- --bcm-new-ds-color-yellow: #eab308;
530
- --bcm-new-ds-color-yellow-50: #fefce8;
531
- --bcm-new-ds-color-yellow-100: #fef9c3;
532
- --bcm-new-ds-color-yellow-200: #fef08a;
533
- --bcm-new-ds-color-yellow-300: #fde047;
534
- --bcm-new-ds-color-yellow-400: #facc15;
535
- --bcm-new-ds-color-yellow-500: #eab308;
536
- --bcm-new-ds-color-yellow-600: #ca8a04;
537
- --bcm-new-ds-color-yellow-700: #a16207;
538
- --bcm-new-ds-color-yellow-800: #854d0e;
539
- --bcm-new-ds-color-yellow-900: #713f12;
540
- --bcm-new-ds-color-lime: #84cc16;
541
- --bcm-new-ds-color-lime-50: #f7fee7;
542
- --bcm-new-ds-color-lime-100: #ecfccb;
543
- --bcm-new-ds-color-lime-200: #d9f99d;
544
- --bcm-new-ds-color-lime-300: #bef264;
545
- --bcm-new-ds-color-lime-400: #a3e635;
546
- --bcm-new-ds-color-lime-500: #84cc16;
547
- --bcm-new-ds-color-lime-600: #65a30d;
548
- --bcm-new-ds-color-lime-700: #4d7c0f;
549
- --bcm-new-ds-color-lime-800: #3f6212;
550
- --bcm-new-ds-color-lime-900: #365314;
551
- --bcm-new-ds-color-green: #22c55e;
552
- --bcm-new-ds-color-green-50: #f0fdf4;
553
- --bcm-new-ds-color-green-100: #dcfce7;
554
- --bcm-new-ds-color-green-200: #bbf7d0;
555
- --bcm-new-ds-color-green-300: #86efac;
556
- --bcm-new-ds-color-green-400: #4ade80;
557
- --bcm-new-ds-color-green-500: #22c55e;
558
- --bcm-new-ds-color-green-600: #16a34a;
559
- --bcm-new-ds-color-green-700: #15803d;
560
- --bcm-new-ds-color-green-800: #166534;
561
- --bcm-new-ds-color-green-900: #14532d;
562
- --bcm-new-ds-color-emerald: #10b981;
563
- --bcm-new-ds-color-emerald-50: #ecfdf5;
564
- --bcm-new-ds-color-emerald-100: #d1fae5;
565
- --bcm-new-ds-color-emerald-200: #a7f3d0;
566
- --bcm-new-ds-color-emerald-300: #6ee7b7;
567
- --bcm-new-ds-color-emerald-400: #34d399;
568
- --bcm-new-ds-color-emerald-500: #10b981;
569
- --bcm-new-ds-color-emerald-600: #059669;
570
- --bcm-new-ds-color-emerald-700: #047857;
571
- --bcm-new-ds-color-emerald-800: #065f46;
572
- --bcm-new-ds-color-emerald-900: #064e3b;
573
- --bcm-new-ds-color-teal: #14b8a6;
574
- --bcm-new-ds-color-teal-50: #f0fdfa;
575
- --bcm-new-ds-color-teal-100: #ccfbf1;
576
- --bcm-new-ds-color-teal-200: #99f6e4;
577
- --bcm-new-ds-color-teal-300: #5eead4;
578
- --bcm-new-ds-color-teal-400: #2dd4bf;
579
- --bcm-new-ds-color-teal-500: #14b8a6;
580
- --bcm-new-ds-color-teal-600: #0d9488;
581
- --bcm-new-ds-color-teal-700: #0f766e;
582
- --bcm-new-ds-color-teal-800: #115e59;
583
- --bcm-new-ds-color-teal-900: #134e4a;
584
- --bcm-new-ds-color-cyan: #06b6d4;
585
- --bcm-new-ds-color-cyan-50: #ecfeff;
586
- --bcm-new-ds-color-cyan-100: #cffafe;
587
- --bcm-new-ds-color-cyan-200: #a5f3fc;
588
- --bcm-new-ds-color-cyan-300: #67e8f9;
589
- --bcm-new-ds-color-cyan-400: #22d3ee;
590
- --bcm-new-ds-color-cyan-500: #06b6d4;
591
- --bcm-new-ds-color-cyan-600: #0891b2;
592
- --bcm-new-ds-color-cyan-700: #0e7490;
593
- --bcm-new-ds-color-cyan-800: #155e75;
594
- --bcm-new-ds-color-cyan-900: #164e63;
595
- --bcm-new-ds-color-sky: #0ea5e9;
596
- --bcm-new-ds-color-sky-50: #f0f9ff;
597
- --bcm-new-ds-color-sky-100: #e0f2fe;
598
- --bcm-new-ds-color-sky-200: #bae6fd;
599
- --bcm-new-ds-color-sky-300: #7dd3fc;
600
- --bcm-new-ds-color-sky-400: #38bdf8;
601
- --bcm-new-ds-color-sky-500: #0ea5e9;
602
- --bcm-new-ds-color-sky-600: #0284c7;
603
- --bcm-new-ds-color-sky-700: #0369a1;
604
- --bcm-new-ds-color-sky-800: #075985;
605
- --bcm-new-ds-color-sky-900: #0c4a6e;
606
- --bcm-new-ds-color-blue: #3b82f6;
607
- --bcm-new-ds-color-blue-50: #eff6ff;
608
- --bcm-new-ds-color-blue-100: #dbeafe;
609
- --bcm-new-ds-color-blue-200: #bfdbfe;
610
- --bcm-new-ds-color-blue-300: #93c5fd;
611
- --bcm-new-ds-color-blue-400: #60a5fa;
612
- --bcm-new-ds-color-blue-500: #3b82f6;
613
- --bcm-new-ds-color-blue-600: #2563eb;
614
- --bcm-new-ds-color-blue-700: #1d4ed8;
615
- --bcm-new-ds-color-blue-800: #1e40af;
616
- --bcm-new-ds-color-blue-900: #1e3a8a;
617
- --bcm-new-ds-color-indigo: #6366f1;
618
- --bcm-new-ds-color-indigo-50: #eef2ff;
619
- --bcm-new-ds-color-indigo-100: #e0e7ff;
620
- --bcm-new-ds-color-indigo-200: #c7d2fe;
621
- --bcm-new-ds-color-indigo-300: #a5b4fc;
622
- --bcm-new-ds-color-indigo-400: #818cf8;
623
- --bcm-new-ds-color-indigo-500: #6366f1;
624
- --bcm-new-ds-color-indigo-600: #4f46e5;
625
- --bcm-new-ds-color-indigo-700: #4338ca;
626
- --bcm-new-ds-color-indigo-800: #3730a3;
627
- --bcm-new-ds-color-indigo-900: #312e81;
628
- --bcm-new-ds-color-violet: #8b5cf6;
629
- --bcm-new-ds-color-violet-50: #f5f3ff;
630
- --bcm-new-ds-color-violet-100: #ede9fe;
631
- --bcm-new-ds-color-violet-200: #ddd6fe;
632
- --bcm-new-ds-color-violet-300: #c4b5fd;
633
- --bcm-new-ds-color-violet-400: #a78bfa;
634
- --bcm-new-ds-color-violet-500: #8b5cf6;
635
- --bcm-new-ds-color-violet-600: #7c3aed;
636
- --bcm-new-ds-color-violet-700: #6d28d9;
637
- --bcm-new-ds-color-violet-800: #5b21b6;
638
- --bcm-new-ds-color-violet-900: #4c1d95;
639
- --bcm-new-ds-color-purple: #a855f7;
640
- --bcm-new-ds-color-purple-50: #faf5ff;
641
- --bcm-new-ds-color-purple-100: #f3e8ff;
642
- --bcm-new-ds-color-purple-200: #e9d5ff;
643
- --bcm-new-ds-color-purple-300: #d8b4fe;
644
- --bcm-new-ds-color-purple-400: #c084fc;
645
- --bcm-new-ds-color-purple-500: #a855f7;
646
- --bcm-new-ds-color-purple-600: #9333ea;
647
- --bcm-new-ds-color-purple-700: #7e22ce;
648
- --bcm-new-ds-color-purple-800: #6b21a8;
649
- --bcm-new-ds-color-purple-900: #581c87;
650
- --bcm-new-ds-color-fuchsia: #d946ef;
651
- --bcm-new-ds-color-fuchsia-50: #fdf4ff;
652
- --bcm-new-ds-color-fuchsia-100: #fae8ff;
653
- --bcm-new-ds-color-fuchsia-200: #f5d0fe;
654
- --bcm-new-ds-color-fuchsia-300: #f0abfc;
655
- --bcm-new-ds-color-fuchsia-400: #e879f9;
656
- --bcm-new-ds-color-fuchsia-500: #d946ef;
657
- --bcm-new-ds-color-fuchsia-600: #c026d3;
658
- --bcm-new-ds-color-fuchsia-700: #a21caf;
659
- --bcm-new-ds-color-fuchsia-800: #86198f;
660
- --bcm-new-ds-color-fuchsia-900: #701a75;
661
- --bcm-new-ds-color-pink: #ec4899;
662
- --bcm-new-ds-color-pink-50: #fdf2f8;
663
- --bcm-new-ds-color-pink-100: #fce7f3;
664
- --bcm-new-ds-color-pink-200: #fbcfe8;
665
- --bcm-new-ds-color-pink-300: #f9a8d4;
666
- --bcm-new-ds-color-pink-400: #f472b6;
667
- --bcm-new-ds-color-pink-500: #ec4899;
668
- --bcm-new-ds-color-pink-600: #db2777;
669
- --bcm-new-ds-color-pink-700: #be185d;
670
- --bcm-new-ds-color-pink-800: #9d174d;
671
- --bcm-new-ds-color-pink-900: #831843;
672
- --bcm-new-ds-color-rose: #f43f5e;
673
- --bcm-new-ds-color-rose-50: #fff1f2;
674
- --bcm-new-ds-color-rose-100: #ffe4e6;
675
- --bcm-new-ds-color-rose-200: #fecdd3;
676
- --bcm-new-ds-color-rose-300: #fda4af;
677
- --bcm-new-ds-color-rose-400: #fb7185;
678
- --bcm-new-ds-color-rose-500: #f43f5e;
679
- --bcm-new-ds-color-rose-600: #e11d48;
680
- --bcm-new-ds-color-rose-700: #be123c;
681
- --bcm-new-ds-color-rose-800: #9f1239;
682
- --bcm-new-ds-color-rose-900: #881337;
683
- }
684
-
685
- * {
686
- box-sizing: border-box;
687
- }
688
-
689
- .bcm-label {
690
- display: inline-flex;
691
- align-items: flex-start;
692
- grid-gap: 2px;
693
- }
694
- .bcm-label__text {
695
- margin-bottom: 2px;
696
- font-family: "Inter", sans-serif;
697
- font-size: 14px;
698
- line-height: calc(14px + 8px);
699
- font-weight: 400;
700
- display: inline-block;
701
- color: var(--bcm-new-ds-color-slate-600);
702
- }
703
- .bcm-label__size-small {
704
- font-size: 10px;
705
- line-height: calc(10px + 8px);
706
- min-height: calc(10px + 8px);
707
- }
708
- .bcm-label__size-medium {
709
- font-size: 12px;
710
- line-height: calc(12px + 8px);
711
- min-height: calc(12px + 8px);
712
- }
713
- .bcm-label__size-large {
714
- font-size: 14px;
715
- line-height: calc(14px + 8px);
716
- min-height: calc(14px + 8px);
717
- }
718
-
719
- .bcm-input[no-margin] {
720
- margin: 0;
721
- }
722
-
723
- .bcm-textarea[no-margin] {
724
- margin: 0;
725
- }
726
-
727
- .bcm-switch[no-margin] {
728
- margin: 0;
729
- }
730
-
731
- .bcm-checkbox[no-margin] {
732
- margin: 0;
733
- }
734
-
735
- .bcm-radio-group[no-margin] {
736
- margin: 0;
737
- }
738
-
739
- .bcm-checkbox-group[no-margin] {
740
- margin: 0;
741
- }
742
-
743
- .bcm-range[no-margin] {
744
- margin: 0;
745
- }
746
-
747
- .bcm-form[no-margin] {
748
- margin: 0;
749
- }
750
-
751
- .bcm-form-group[no-margin] {
752
- margin: 0;
753
- }
754
-
755
- .bcm-list[no-margin] {
756
- margin: 0;
757
- }
758
-
759
- .bcm-colorpicker[no-margin] {
760
- margin: 0;
761
- }
762
-
763
- .bcm-date-picker[no-margin] {
764
- margin: 0;
765
- }
766
-
767
- .bcm-time-picker[no-margin] {
768
- margin: 0;
769
- }
770
-
771
- .bcm-datetime-picker[no-margin] {
772
- margin: 0;
773
- }
774
-
775
- .bcm-select[no-margin] {
776
- margin: 0;
777
- }
778
-
779
- .bcm-listbox[no-margin] {
780
- margin: 0;
781
- }
782
-
783
- :root,
784
- ::after,
785
- ::before {
786
- --bcm-new-ds-color-inherit: inherit;
787
- --bcm-new-ds-color-current: currentColor;
788
- --bcm-new-ds-color-transparent: transparent;
789
- --bcm-new-ds-color-black: #000;
790
- --bcm-new-ds-color-white: #fff;
791
- --bcm-new-ds-color-slate: #64748b;
792
- --bcm-new-ds-color-slate-50: #f8fafc;
793
- --bcm-new-ds-color-slate-100: #f1f5f9;
794
- --bcm-new-ds-color-slate-200: #e2e8f0;
795
- --bcm-new-ds-color-slate-300: #cbd5e1;
796
- --bcm-new-ds-color-slate-400: #94a3b8;
797
- --bcm-new-ds-color-slate-500: #64748b;
798
- --bcm-new-ds-color-slate-600: #475569;
799
- --bcm-new-ds-color-slate-700: #334155;
800
- --bcm-new-ds-color-slate-800: #1e293b;
801
- --bcm-new-ds-color-slate-900: #0f172a;
802
- --bcm-new-ds-color-gray: #6b7280;
803
- --bcm-new-ds-color-gray-50: #f9fafb;
804
- --bcm-new-ds-color-gray-100: #f3f4f6;
805
- --bcm-new-ds-color-gray-200: #e5e7eb;
806
- --bcm-new-ds-color-gray-300: #d1d5db;
807
- --bcm-new-ds-color-gray-400: #9ca3af;
808
- --bcm-new-ds-color-gray-500: #6b7280;
809
- --bcm-new-ds-color-gray-600: #4b5563;
810
- --bcm-new-ds-color-gray-700: #374151;
811
- --bcm-new-ds-color-gray-800: #1f2937;
812
- --bcm-new-ds-color-gray-900: #111827;
813
- --bcm-new-ds-color-zinc: #71717a;
814
- --bcm-new-ds-color-zinc-50: #fafafa;
815
- --bcm-new-ds-color-zinc-100: #f4f4f5;
816
- --bcm-new-ds-color-zinc-200: #e4e4e7;
817
- --bcm-new-ds-color-zinc-300: #d4d4d8;
818
- --bcm-new-ds-color-zinc-400: #a1a1aa;
819
- --bcm-new-ds-color-zinc-500: #71717a;
820
- --bcm-new-ds-color-zinc-600: #52525b;
821
- --bcm-new-ds-color-zinc-700: #3f3f46;
822
- --bcm-new-ds-color-zinc-800: #27272a;
823
- --bcm-new-ds-color-zinc-900: #18181b;
824
- --bcm-new-ds-color-neutral: #737373;
825
- --bcm-new-ds-color-neutral-50: #fafafa;
826
- --bcm-new-ds-color-neutral-100: #f5f5f5;
827
- --bcm-new-ds-color-neutral-200: #e5e5e5;
828
- --bcm-new-ds-color-neutral-300: #d4d4d4;
829
- --bcm-new-ds-color-neutral-400: #a3a3a3;
830
- --bcm-new-ds-color-neutral-500: #737373;
831
- --bcm-new-ds-color-neutral-600: #525252;
832
- --bcm-new-ds-color-neutral-700: #404040;
833
- --bcm-new-ds-color-neutral-800: #262626;
834
- --bcm-new-ds-color-neutral-900: #171717;
835
- --bcm-new-ds-color-stone: #78716c;
836
- --bcm-new-ds-color-stone-50: #fafaf9;
837
- --bcm-new-ds-color-stone-100: #f5f5f4;
838
- --bcm-new-ds-color-stone-200: #e7e5e4;
839
- --bcm-new-ds-color-stone-300: #d6d3d1;
840
- --bcm-new-ds-color-stone-400: #a8a29e;
841
- --bcm-new-ds-color-stone-500: #78716c;
842
- --bcm-new-ds-color-stone-600: #57534e;
843
- --bcm-new-ds-color-stone-700: #44403c;
844
- --bcm-new-ds-color-stone-800: #292524;
845
- --bcm-new-ds-color-stone-900: #1c1917;
846
- --bcm-new-ds-color-red: #ef4444;
847
- --bcm-new-ds-color-red-50: #fef2f2;
848
- --bcm-new-ds-color-red-100: #fee2e2;
849
- --bcm-new-ds-color-red-200: #fecaca;
850
- --bcm-new-ds-color-red-300: #fca5a5;
851
- --bcm-new-ds-color-red-400: #f87171;
852
- --bcm-new-ds-color-red-500: #ef4444;
853
- --bcm-new-ds-color-red-600: #dc2626;
854
- --bcm-new-ds-color-red-700: #b91c1c;
855
- --bcm-new-ds-color-red-800: #991b1b;
856
- --bcm-new-ds-color-red-900: #7f1d1d;
857
- --bcm-new-ds-color-orange: #f97316;
858
- --bcm-new-ds-color-orange-50: #fff7ed;
859
- --bcm-new-ds-color-orange-100: #ffedd5;
860
- --bcm-new-ds-color-orange-200: #fed7aa;
861
- --bcm-new-ds-color-orange-300: #fdba74;
862
- --bcm-new-ds-color-orange-400: #fb923c;
863
- --bcm-new-ds-color-orange-500: #f97316;
864
- --bcm-new-ds-color-orange-600: #ea580c;
865
- --bcm-new-ds-color-orange-700: #c2410c;
866
- --bcm-new-ds-color-orange-800: #9a3412;
867
- --bcm-new-ds-color-orange-900: #7c2d12;
868
- --bcm-new-ds-color-amber: #f59e0b;
869
- --bcm-new-ds-color-amber-50: #fffbeb;
870
- --bcm-new-ds-color-amber-100: #fef3c7;
871
- --bcm-new-ds-color-amber-200: #fde68a;
872
- --bcm-new-ds-color-amber-300: #fcd34d;
873
- --bcm-new-ds-color-amber-400: #fbbf24;
874
- --bcm-new-ds-color-amber-500: #f59e0b;
875
- --bcm-new-ds-color-amber-600: #d97706;
876
- --bcm-new-ds-color-amber-700: #b45309;
877
- --bcm-new-ds-color-amber-800: #92400e;
878
- --bcm-new-ds-color-amber-900: #78350f;
879
- --bcm-new-ds-color-yellow: #eab308;
880
- --bcm-new-ds-color-yellow-50: #fefce8;
881
- --bcm-new-ds-color-yellow-100: #fef9c3;
882
- --bcm-new-ds-color-yellow-200: #fef08a;
883
- --bcm-new-ds-color-yellow-300: #fde047;
884
- --bcm-new-ds-color-yellow-400: #facc15;
885
- --bcm-new-ds-color-yellow-500: #eab308;
886
- --bcm-new-ds-color-yellow-600: #ca8a04;
887
- --bcm-new-ds-color-yellow-700: #a16207;
888
- --bcm-new-ds-color-yellow-800: #854d0e;
889
- --bcm-new-ds-color-yellow-900: #713f12;
890
- --bcm-new-ds-color-lime: #84cc16;
891
- --bcm-new-ds-color-lime-50: #f7fee7;
892
- --bcm-new-ds-color-lime-100: #ecfccb;
893
- --bcm-new-ds-color-lime-200: #d9f99d;
894
- --bcm-new-ds-color-lime-300: #bef264;
895
- --bcm-new-ds-color-lime-400: #a3e635;
896
- --bcm-new-ds-color-lime-500: #84cc16;
897
- --bcm-new-ds-color-lime-600: #65a30d;
898
- --bcm-new-ds-color-lime-700: #4d7c0f;
899
- --bcm-new-ds-color-lime-800: #3f6212;
900
- --bcm-new-ds-color-lime-900: #365314;
901
- --bcm-new-ds-color-green: #22c55e;
902
- --bcm-new-ds-color-green-50: #f0fdf4;
903
- --bcm-new-ds-color-green-100: #dcfce7;
904
- --bcm-new-ds-color-green-200: #bbf7d0;
905
- --bcm-new-ds-color-green-300: #86efac;
906
- --bcm-new-ds-color-green-400: #4ade80;
907
- --bcm-new-ds-color-green-500: #22c55e;
908
- --bcm-new-ds-color-green-600: #16a34a;
909
- --bcm-new-ds-color-green-700: #15803d;
910
- --bcm-new-ds-color-green-800: #166534;
911
- --bcm-new-ds-color-green-900: #14532d;
912
- --bcm-new-ds-color-emerald: #10b981;
913
- --bcm-new-ds-color-emerald-50: #ecfdf5;
914
- --bcm-new-ds-color-emerald-100: #d1fae5;
915
- --bcm-new-ds-color-emerald-200: #a7f3d0;
916
- --bcm-new-ds-color-emerald-300: #6ee7b7;
917
- --bcm-new-ds-color-emerald-400: #34d399;
918
- --bcm-new-ds-color-emerald-500: #10b981;
919
- --bcm-new-ds-color-emerald-600: #059669;
920
- --bcm-new-ds-color-emerald-700: #047857;
921
- --bcm-new-ds-color-emerald-800: #065f46;
922
- --bcm-new-ds-color-emerald-900: #064e3b;
923
- --bcm-new-ds-color-teal: #14b8a6;
924
- --bcm-new-ds-color-teal-50: #f0fdfa;
925
- --bcm-new-ds-color-teal-100: #ccfbf1;
926
- --bcm-new-ds-color-teal-200: #99f6e4;
927
- --bcm-new-ds-color-teal-300: #5eead4;
928
- --bcm-new-ds-color-teal-400: #2dd4bf;
929
- --bcm-new-ds-color-teal-500: #14b8a6;
930
- --bcm-new-ds-color-teal-600: #0d9488;
931
- --bcm-new-ds-color-teal-700: #0f766e;
932
- --bcm-new-ds-color-teal-800: #115e59;
933
- --bcm-new-ds-color-teal-900: #134e4a;
934
- --bcm-new-ds-color-cyan: #06b6d4;
935
- --bcm-new-ds-color-cyan-50: #ecfeff;
936
- --bcm-new-ds-color-cyan-100: #cffafe;
937
- --bcm-new-ds-color-cyan-200: #a5f3fc;
938
- --bcm-new-ds-color-cyan-300: #67e8f9;
939
- --bcm-new-ds-color-cyan-400: #22d3ee;
940
- --bcm-new-ds-color-cyan-500: #06b6d4;
941
- --bcm-new-ds-color-cyan-600: #0891b2;
942
- --bcm-new-ds-color-cyan-700: #0e7490;
943
- --bcm-new-ds-color-cyan-800: #155e75;
944
- --bcm-new-ds-color-cyan-900: #164e63;
945
- --bcm-new-ds-color-sky: #0ea5e9;
946
- --bcm-new-ds-color-sky-50: #f0f9ff;
947
- --bcm-new-ds-color-sky-100: #e0f2fe;
948
- --bcm-new-ds-color-sky-200: #bae6fd;
949
- --bcm-new-ds-color-sky-300: #7dd3fc;
950
- --bcm-new-ds-color-sky-400: #38bdf8;
951
- --bcm-new-ds-color-sky-500: #0ea5e9;
952
- --bcm-new-ds-color-sky-600: #0284c7;
953
- --bcm-new-ds-color-sky-700: #0369a1;
954
- --bcm-new-ds-color-sky-800: #075985;
955
- --bcm-new-ds-color-sky-900: #0c4a6e;
956
- --bcm-new-ds-color-blue: #3b82f6;
957
- --bcm-new-ds-color-blue-50: #eff6ff;
958
- --bcm-new-ds-color-blue-100: #dbeafe;
959
- --bcm-new-ds-color-blue-200: #bfdbfe;
960
- --bcm-new-ds-color-blue-300: #93c5fd;
961
- --bcm-new-ds-color-blue-400: #60a5fa;
962
- --bcm-new-ds-color-blue-500: #3b82f6;
963
- --bcm-new-ds-color-blue-600: #2563eb;
964
- --bcm-new-ds-color-blue-700: #1d4ed8;
965
- --bcm-new-ds-color-blue-800: #1e40af;
966
- --bcm-new-ds-color-blue-900: #1e3a8a;
967
- --bcm-new-ds-color-indigo: #6366f1;
968
- --bcm-new-ds-color-indigo-50: #eef2ff;
969
- --bcm-new-ds-color-indigo-100: #e0e7ff;
970
- --bcm-new-ds-color-indigo-200: #c7d2fe;
971
- --bcm-new-ds-color-indigo-300: #a5b4fc;
972
- --bcm-new-ds-color-indigo-400: #818cf8;
973
- --bcm-new-ds-color-indigo-500: #6366f1;
974
- --bcm-new-ds-color-indigo-600: #4f46e5;
975
- --bcm-new-ds-color-indigo-700: #4338ca;
976
- --bcm-new-ds-color-indigo-800: #3730a3;
977
- --bcm-new-ds-color-indigo-900: #312e81;
978
- --bcm-new-ds-color-violet: #8b5cf6;
979
- --bcm-new-ds-color-violet-50: #f5f3ff;
980
- --bcm-new-ds-color-violet-100: #ede9fe;
981
- --bcm-new-ds-color-violet-200: #ddd6fe;
982
- --bcm-new-ds-color-violet-300: #c4b5fd;
983
- --bcm-new-ds-color-violet-400: #a78bfa;
984
- --bcm-new-ds-color-violet-500: #8b5cf6;
985
- --bcm-new-ds-color-violet-600: #7c3aed;
986
- --bcm-new-ds-color-violet-700: #6d28d9;
987
- --bcm-new-ds-color-violet-800: #5b21b6;
988
- --bcm-new-ds-color-violet-900: #4c1d95;
989
- --bcm-new-ds-color-purple: #a855f7;
990
- --bcm-new-ds-color-purple-50: #faf5ff;
991
- --bcm-new-ds-color-purple-100: #f3e8ff;
992
- --bcm-new-ds-color-purple-200: #e9d5ff;
993
- --bcm-new-ds-color-purple-300: #d8b4fe;
994
- --bcm-new-ds-color-purple-400: #c084fc;
995
- --bcm-new-ds-color-purple-500: #a855f7;
996
- --bcm-new-ds-color-purple-600: #9333ea;
997
- --bcm-new-ds-color-purple-700: #7e22ce;
998
- --bcm-new-ds-color-purple-800: #6b21a8;
999
- --bcm-new-ds-color-purple-900: #581c87;
1000
- --bcm-new-ds-color-fuchsia: #d946ef;
1001
- --bcm-new-ds-color-fuchsia-50: #fdf4ff;
1002
- --bcm-new-ds-color-fuchsia-100: #fae8ff;
1003
- --bcm-new-ds-color-fuchsia-200: #f5d0fe;
1004
- --bcm-new-ds-color-fuchsia-300: #f0abfc;
1005
- --bcm-new-ds-color-fuchsia-400: #e879f9;
1006
- --bcm-new-ds-color-fuchsia-500: #d946ef;
1007
- --bcm-new-ds-color-fuchsia-600: #c026d3;
1008
- --bcm-new-ds-color-fuchsia-700: #a21caf;
1009
- --bcm-new-ds-color-fuchsia-800: #86198f;
1010
- --bcm-new-ds-color-fuchsia-900: #701a75;
1011
- --bcm-new-ds-color-pink: #ec4899;
1012
- --bcm-new-ds-color-pink-50: #fdf2f8;
1013
- --bcm-new-ds-color-pink-100: #fce7f3;
1014
- --bcm-new-ds-color-pink-200: #fbcfe8;
1015
- --bcm-new-ds-color-pink-300: #f9a8d4;
1016
- --bcm-new-ds-color-pink-400: #f472b6;
1017
- --bcm-new-ds-color-pink-500: #ec4899;
1018
- --bcm-new-ds-color-pink-600: #db2777;
1019
- --bcm-new-ds-color-pink-700: #be185d;
1020
- --bcm-new-ds-color-pink-800: #9d174d;
1021
- --bcm-new-ds-color-pink-900: #831843;
1022
- --bcm-new-ds-color-rose: #f43f5e;
1023
- --bcm-new-ds-color-rose-50: #fff1f2;
1024
- --bcm-new-ds-color-rose-100: #ffe4e6;
1025
- --bcm-new-ds-color-rose-200: #fecdd3;
1026
- --bcm-new-ds-color-rose-300: #fda4af;
1027
- --bcm-new-ds-color-rose-400: #fb7185;
1028
- --bcm-new-ds-color-rose-500: #f43f5e;
1029
- --bcm-new-ds-color-rose-600: #e11d48;
1030
- --bcm-new-ds-color-rose-700: #be123c;
1031
- --bcm-new-ds-color-rose-800: #9f1239;
1032
- --bcm-new-ds-color-rose-900: #881337;
1033
- }
1034
-
1035
- * {
1036
- box-sizing: border-box;
1037
- }
1038
-
1039
- .bcm-checkbox {
1040
- outline: none;
1041
- border: none;
1042
- --bcm-checkbox-primary-color-default: var(--bcm-new-ds-color-blue-500);
1043
- --bcm-checkbox-secondary-color-default: var(--bcm-new-ds-color-white);
1044
- --bcm-checkbox-primary-color-hover: var(--bcm-new-ds-color-blue-600);
1045
- --bcm-checkbox-secondary-color-hover: var(--bcm-new-ds-color-slate-50);
1046
- --bcm-checkbox-primary-color-focus-visible: var(--bcm-new-ds-color-blue-800);
1047
- --bcm-checkbox-secondary-color-focus-visible: var(--bcm-new-ds-color-slate-50);
1048
- --bcm-checkbox-primary-color-active: var(--bcm-new-ds-color-blue-700);
1049
- --bcm-checkbox-secondary-color-active: var(--bcm-new-ds-color-slate-50);
1050
- --bcm-checkbox-primary-color-disabled: var(--bcm-new-ds-color-slate-300);
1051
- --bcm-checkbox-secondary-color-disabled: var(--bcm-new-ds-color-slate-200);
1052
- display: inline-flex;
1053
- width: fit-content;
1054
- flex-direction: column;
1055
- margin-bottom: 8px;
1056
- }
1057
- .bcm-checkbox:focus, .bcm-checkbox:hover, .bcm-checkbox:active {
1058
- outline: none;
1059
- border: none;
1060
- }
1061
- .bcm-checkbox * {
1062
- box-sizing: border-box;
1063
- }
1064
- .bcm-checkbox input[type=radio],
1065
- .bcm-checkbox input[type=checkbox] {
1066
- -webkit-appearance: none;
1067
- appearance: none;
1068
- background-color: #fff;
1069
- margin: 0;
1070
- display: none;
1071
- }
1072
- .bcm-checkbox__input {
1073
- display: flex;
1074
- flex-direction: row;
1075
- align-items: flex-start;
1076
- justify-content: flex-start;
1077
- flex-wrap: nowrap;
1078
- padding-top: 4px;
1079
- }
1080
- .bcm-checkbox.hidden {
1081
- display: none;
1082
- }
1083
- .bcm-checkbox :hover {
1084
- cursor: pointer;
1085
- }
1086
- .bcm-checkbox[disabled] :hover, .bcm-checkbox.disabled :hover {
1087
- cursor: not-allowed;
1088
- }
1089
- .bcm-checkbox .slot {
1090
- font-family: "Inter", sans-serif;
1091
- font-size: 14px;
1092
- line-height: calc(14px + 8px);
1093
- font-weight: 400;
1094
- font-weight: 500;
1095
- color: var(--bcm-new-ds-color-slate-600);
1096
- }
1097
- .bcm-checkbox .slot:not(:empty) {
1098
- margin-left: 8px;
1099
- margin-right: 8px;
1100
- }
1101
- .bcm-checkbox-size-small .slot {
1102
- font-size: 12px;
1103
- line-height: calc(12px + 8px);
1104
- margin-top: -2.5px;
1105
- }
1106
- .bcm-checkbox-size-small .bcm-checkbox__input {
1107
- min-height: calc(24px - 4px);
1108
- }
1109
- .bcm-checkbox-size-small .bcm-checkbox__label-icon {
1110
- width: 14px;
1111
- height: 14px;
1112
- min-width: 14px;
1113
- font-size: calc(10px - 2px);
1114
- }
1115
- .bcm-checkbox-size-medium .slot {
1116
- font-size: calc(12px + 1px);
1117
- line-height: calc(12px + 8px);
1118
- margin-top: -1.5px;
1119
- }
1120
- .bcm-checkbox-size-medium .bcm-checkbox__input {
1121
- min-height: calc(32px - 4px);
1122
- }
1123
- .bcm-checkbox-size-medium .bcm-checkbox__label-icon {
1124
- width: 16px;
1125
- height: 16px;
1126
- min-width: 16px;
1127
- font-size: 10px;
1128
- }
1129
- .bcm-checkbox-size-large .slot {
1130
- font-size: 16px;
1131
- line-height: calc(16px + 8px);
1132
- margin-top: -1.5px;
1133
- }
1134
- .bcm-checkbox-size-large .bcm-checkbox__input {
1135
- min-height: calc(32px - 4px);
1136
- }
1137
- .bcm-checkbox-size-large .bcm-checkbox__label-icon {
1138
- width: 18px;
1139
- height: 18px;
1140
- min-width: 18px;
1141
- font-size: 12px;
1142
- }
1143
- .bcm-checkbox__label {
1144
- display: flex;
1145
- flex-direction: row;
1146
- align-items: flex-start;
1147
- justify-content: flex-start;
1148
- flex-wrap: nowrap;
1149
- }
1150
- .bcm-checkbox__label-icon {
1151
- display: flex;
1152
- flex-direction: column;
1153
- align-items: center;
1154
- justify-content: center;
1155
- flex-wrap: nowrap;
1156
- border-width: 1px;
1157
- border-style: solid;
1158
- border-radius: 2px;
1159
- }
1160
- .bcm-checkbox__label-icon-indeterminate {
1161
- position: relative;
1162
- }
1163
- .bcm-checkbox__label-icon-indeterminate:after {
1164
- content: "";
1165
- display: block;
1166
- position: absolute;
1167
- width: 70%;
1168
- height: 1.5px;
1169
- background: var(--bcm-new-ds-color-white);
1170
- }
1171
- .bcm-checkbox__label-icon.bcm-radio__icon {
1172
- width: 16px;
1173
- height: 16px;
1174
- box-sizing: border-box;
1175
- border-radius: 100px;
1176
- }
1177
- .bcm-checkbox__label-icon.bcm-radio__icon .bcm-radio__icon-inner {
1178
- width: 10px;
1179
- height: 10px;
1180
- border-radius: 100px;
1181
- background-color: var(--bcm-new-ds-color-white);
1182
- }
1183
- .bcm-checkbox .bcm-checkbox__label-icon {
1184
- background: var(--bcm-checkbox-secondary-color-default);
1185
- color: var(--bcm-checkbox-secondary-color-default);
1186
- border-color: var(--bcm-new-ds-color-slate-300);
1187
- }
1188
- .bcm-checkbox .bcm-checkbox__label-icon-checked, .bcm-checkbox .bcm-checkbox__label-icon-indeterminate {
1189
- color: var(--bcm-new-ds-color-white);
1190
- background-color: var(--bcm-checkbox-primary-color-default);
1191
- border-color: var(--bcm-checkbox-primary-color-default);
1192
- }
1193
- .bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon, .bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon {
1194
- border-color: var(--bcm-checkbox-primary-color-default);
1195
- background-color: var(--bcm-checkbox-secondary-color-default);
1196
- }
1197
- .bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner {
1198
- background-color: var(--bcm-checkbox-primary-color-default);
1199
- }
1200
- .bcm-checkbox .bcm-checkbox__label-icon-indeterminate {
1201
- color: var(--bcm-checkbox-primary-color-default);
1202
- }
1203
- .bcm-checkbox:hover .bcm-checkbox__label-icon {
1204
- background: var(--bcm-checkbox-secondary-color-hover);
1205
- color: var(--bcm-checkbox-secondary-color-hover);
1206
- border-color: var(--bcm-checkbox-primary-color-hover);
1207
- }
1208
- .bcm-checkbox:hover .bcm-checkbox__label-icon-checked, .bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate {
1209
- color: var(--bcm-new-ds-color-white);
1210
- background-color: var(--bcm-checkbox-primary-color-hover);
1211
- border-color: var(--bcm-checkbox-primary-color-hover);
1212
- }
1213
- .bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon, .bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon {
1214
- border-color: var(--bcm-checkbox-primary-color-hover);
1215
- background-color: var(--bcm-checkbox-secondary-color-hover);
1216
- }
1217
- .bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner {
1218
- background-color: var(--bcm-checkbox-primary-color-hover);
1219
- }
1220
- .bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate {
1221
- color: var(--bcm-checkbox-primary-color-hover);
1222
- }
1223
- .bcm-checkbox:focus-visible .bcm-checkbox__label-icon {
1224
- background: var(--bcm-checkbox-secondary-color-focus-visible);
1225
- color: var(--bcm-checkbox-secondary-color-focus-visible);
1226
- border-color: var(--bcm-checkbox-primary-color-focus-visible);
1227
- }
1228
- .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked, .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate {
1229
- color: var(--bcm-new-ds-color-white);
1230
- background-color: var(--bcm-checkbox-primary-color-focus-visible);
1231
- border-color: var(--bcm-checkbox-primary-color-focus-visible);
1232
- }
1233
- .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon, .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon {
1234
- border-color: var(--bcm-checkbox-primary-color-focus-visible);
1235
- background-color: var(--bcm-checkbox-secondary-color-focus-visible);
1236
- }
1237
- .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner {
1238
- background-color: var(--bcm-checkbox-primary-color-focus-visible);
1239
- }
1240
- .bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate {
1241
- color: var(--bcm-checkbox-primary-color-focus-visible);
1242
- }
1243
- .bcm-checkbox:active .bcm-checkbox__label-icon {
1244
- background: var(--bcm-checkbox-secondary-color-active);
1245
- color: var(--bcm-checkbox-secondary-color-active);
1246
- border-color: var(--bcm-checkbox-primary-color-active);
1247
- }
1248
- .bcm-checkbox:active .bcm-checkbox__label-icon-checked, .bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate {
1249
- color: var(--bcm-new-ds-color-white);
1250
- background-color: var(--bcm-checkbox-primary-color-active);
1251
- border-color: var(--bcm-checkbox-primary-color-active);
1252
- }
1253
- .bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon, .bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon {
1254
- border-color: var(--bcm-checkbox-primary-color-active);
1255
- background-color: var(--bcm-checkbox-secondary-color-active);
1256
- }
1257
- .bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner {
1258
- background-color: var(--bcm-checkbox-primary-color-active);
1259
- }
1260
- .bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate {
1261
- color: var(--bcm-checkbox-primary-color-active);
1262
- }
1263
- .bcm-checkbox[disabled] .bcm-checkbox__label-icon, .bcm-checkbox.disabled .bcm-checkbox__label-icon {
1264
- background: var(--bcm-checkbox-secondary-color-disabled);
1265
- color: var(--bcm-checkbox-secondary-color-disabled);
1266
- border-color: var(--bcm-checkbox-primary-color-disabled);
1267
- }
1268
- .bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked, .bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate, .bcm-checkbox.disabled .bcm-checkbox__label-icon-checked, .bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate {
1269
- color: var(--bcm-new-ds-color-white);
1270
- background-color: var(--bcm-checkbox-primary-color-disabled);
1271
- border-color: var(--bcm-checkbox-primary-color-disabled);
1272
- }
1273
- .bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon, .bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon, .bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon, .bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon {
1274
- border-color: var(--bcm-checkbox-primary-color-disabled);
1275
- background-color: var(--bcm-checkbox-secondary-color-disabled);
1276
- }
1277
- .bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner, .bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner {
1278
- background-color: var(--bcm-checkbox-primary-color-disabled);
1279
- }
1280
- .bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate, .bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate {
1281
- color: var(--bcm-checkbox-primary-color-disabled);
1282
- }
1283
- .bcm-checkbox[no-margin] .bcm-checkbox__input {
1284
- margin: 0;
1285
- min-height: 0;
1286
- padding: 0;
1287
- }