@seed-design/lynx-css 0.1.1-alpha.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 (594) hide show
  1. package/all.css +8781 -0
  2. package/all.layered.css +8785 -0
  3. package/all.layered.min.css +1 -0
  4. package/all.min.css +1 -0
  5. package/base.css +858 -0
  6. package/base.layered.css +861 -0
  7. package/base.layered.min.css +1 -0
  8. package/base.min.css +1 -0
  9. package/package.json +56 -0
  10. package/recipes/action-button.css +479 -0
  11. package/recipes/action-button.d.ts +33 -0
  12. package/recipes/action-button.layered.css +747 -0
  13. package/recipes/action-button.layered.mjs +99 -0
  14. package/recipes/action-button.mjs +99 -0
  15. package/recipes/action-chip.css +78 -0
  16. package/recipes/action-chip.d.ts +29 -0
  17. package/recipes/action-chip.layered.css +118 -0
  18. package/recipes/action-chip.layered.mjs +71 -0
  19. package/recipes/action-chip.mjs +71 -0
  20. package/recipes/action-sheet-item.css +30 -0
  21. package/recipes/action-sheet-item.d.ts +25 -0
  22. package/recipes/action-sheet-item.layered.css +38 -0
  23. package/recipes/action-sheet-item.layered.mjs +49 -0
  24. package/recipes/action-sheet-item.mjs +49 -0
  25. package/recipes/action-sheet.css +117 -0
  26. package/recipes/action-sheet.d.ts +21 -0
  27. package/recipes/action-sheet.layered.css +132 -0
  28. package/recipes/action-sheet.layered.mjs +60 -0
  29. package/recipes/action-sheet.mjs +60 -0
  30. package/recipes/app-bar-main.css +169 -0
  31. package/recipes/app-bar-main.d.ts +36 -0
  32. package/recipes/app-bar-main.layered.css +164 -0
  33. package/recipes/app-bar-main.layered.mjs +63 -0
  34. package/recipes/app-bar-main.mjs +63 -0
  35. package/recipes/app-bar.css +375 -0
  36. package/recipes/app-bar.d.ts +36 -0
  37. package/recipes/app-bar.layered.css +385 -0
  38. package/recipes/app-bar.layered.mjs +74 -0
  39. package/recipes/app-bar.mjs +74 -0
  40. package/recipes/app-screen.css +314 -0
  41. package/recipes/app-screen.d.ts +44 -0
  42. package/recipes/app-screen.layered.css +322 -0
  43. package/recipes/app-screen.layered.mjs +98 -0
  44. package/recipes/app-screen.mjs +98 -0
  45. package/recipes/article.css +0 -0
  46. package/recipes/article.d.ts +22 -0
  47. package/recipes/article.layered.css +1 -0
  48. package/recipes/article.layered.mjs +43 -0
  49. package/recipes/article.mjs +43 -0
  50. package/recipes/aspect-ratio.css +22 -0
  51. package/recipes/aspect-ratio.d.ts +22 -0
  52. package/recipes/aspect-ratio.layered.css +24 -0
  53. package/recipes/aspect-ratio.layered.mjs +43 -0
  54. package/recipes/aspect-ratio.mjs +43 -0
  55. package/recipes/avatar-stack.css +79 -0
  56. package/recipes/avatar-stack.d.ts +24 -0
  57. package/recipes/avatar-stack.layered.css +102 -0
  58. package/recipes/avatar-stack.layered.mjs +51 -0
  59. package/recipes/avatar-stack.mjs +51 -0
  60. package/recipes/avatar.css +168 -0
  61. package/recipes/avatar.d.ts +28 -0
  62. package/recipes/avatar.layered.css +201 -0
  63. package/recipes/avatar.layered.mjs +66 -0
  64. package/recipes/avatar.mjs +66 -0
  65. package/recipes/badge.css +112 -0
  66. package/recipes/badge.d.ts +32 -0
  67. package/recipes/badge.layered.css +134 -0
  68. package/recipes/badge.layered.mjs +131 -0
  69. package/recipes/badge.mjs +131 -0
  70. package/recipes/bottom-sheet-handle.css +22 -0
  71. package/recipes/bottom-sheet-handle.d.ts +21 -0
  72. package/recipes/bottom-sheet-handle.layered.css +26 -0
  73. package/recipes/bottom-sheet-handle.layered.mjs +36 -0
  74. package/recipes/bottom-sheet-handle.mjs +36 -0
  75. package/recipes/bottom-sheet.css +184 -0
  76. package/recipes/bottom-sheet.d.ts +28 -0
  77. package/recipes/bottom-sheet.layered.css +210 -0
  78. package/recipes/bottom-sheet.layered.mjs +75 -0
  79. package/recipes/bottom-sheet.mjs +75 -0
  80. package/recipes/callout.css +159 -0
  81. package/recipes/callout.d.ts +24 -0
  82. package/recipes/callout.layered.css +148 -0
  83. package/recipes/callout.layered.mjs +63 -0
  84. package/recipes/callout.mjs +63 -0
  85. package/recipes/checkbox-group.css +5 -0
  86. package/recipes/checkbox-group.d.ts +22 -0
  87. package/recipes/checkbox-group.layered.css +7 -0
  88. package/recipes/checkbox-group.layered.mjs +43 -0
  89. package/recipes/checkbox-group.mjs +43 -0
  90. package/recipes/checkbox.css +37 -0
  91. package/recipes/checkbox.d.ts +28 -0
  92. package/recipes/checkbox.layered.css +47 -0
  93. package/recipes/checkbox.layered.mjs +48 -0
  94. package/recipes/checkbox.mjs +48 -0
  95. package/recipes/checkmark.css +108 -0
  96. package/recipes/checkmark.d.ts +32 -0
  97. package/recipes/checkmark.layered.css +133 -0
  98. package/recipes/checkmark.layered.mjs +86 -0
  99. package/recipes/checkmark.mjs +86 -0
  100. package/recipes/chip-tabs.css +150 -0
  101. package/recipes/chip-tabs.d.ts +36 -0
  102. package/recipes/chip-tabs.layered.css +186 -0
  103. package/recipes/chip-tabs.layered.mjs +75 -0
  104. package/recipes/chip-tabs.mjs +75 -0
  105. package/recipes/chip.css +184 -0
  106. package/recipes/chip.d.ts +32 -0
  107. package/recipes/chip.layered.css +207 -0
  108. package/recipes/chip.layered.mjs +80 -0
  109. package/recipes/chip.mjs +80 -0
  110. package/recipes/content-placeholder.css +19 -0
  111. package/recipes/content-placeholder.d.ts +24 -0
  112. package/recipes/content-placeholder.layered.css +22 -0
  113. package/recipes/content-placeholder.layered.mjs +53 -0
  114. package/recipes/content-placeholder.mjs +53 -0
  115. package/recipes/contextual-floating-button.css +123 -0
  116. package/recipes/contextual-floating-button.d.ts +29 -0
  117. package/recipes/contextual-floating-button.layered.css +190 -0
  118. package/recipes/contextual-floating-button.layered.mjs +54 -0
  119. package/recipes/contextual-floating-button.mjs +54 -0
  120. package/recipes/control-chip.css +97 -0
  121. package/recipes/control-chip.d.ts +29 -0
  122. package/recipes/control-chip.layered.css +147 -0
  123. package/recipes/control-chip.layered.mjs +71 -0
  124. package/recipes/control-chip.mjs +71 -0
  125. package/recipes/dialog.css +101 -0
  126. package/recipes/dialog.d.ts +24 -0
  127. package/recipes/dialog.layered.css +113 -0
  128. package/recipes/dialog.layered.mjs +66 -0
  129. package/recipes/dialog.mjs +66 -0
  130. package/recipes/extended-action-sheet-item.css +39 -0
  131. package/recipes/extended-action-sheet-item.d.ts +25 -0
  132. package/recipes/extended-action-sheet-item.layered.css +55 -0
  133. package/recipes/extended-action-sheet-item.layered.mjs +49 -0
  134. package/recipes/extended-action-sheet-item.mjs +49 -0
  135. package/recipes/extended-action-sheet.css +116 -0
  136. package/recipes/extended-action-sheet.d.ts +21 -0
  137. package/recipes/extended-action-sheet.layered.css +131 -0
  138. package/recipes/extended-action-sheet.layered.mjs +64 -0
  139. package/recipes/extended-action-sheet.mjs +64 -0
  140. package/recipes/extended-fab.css +65 -0
  141. package/recipes/extended-fab.d.ts +29 -0
  142. package/recipes/extended-fab.layered.css +84 -0
  143. package/recipes/extended-fab.layered.mjs +54 -0
  144. package/recipes/extended-fab.mjs +54 -0
  145. package/recipes/fab.css +24 -0
  146. package/recipes/fab.d.ts +22 -0
  147. package/recipes/fab.layered.css +36 -0
  148. package/recipes/fab.layered.mjs +43 -0
  149. package/recipes/fab.mjs +43 -0
  150. package/recipes/field-label.css +27 -0
  151. package/recipes/field-label.d.ts +24 -0
  152. package/recipes/field-label.layered.css +33 -0
  153. package/recipes/field-label.layered.mjs +47 -0
  154. package/recipes/field-label.mjs +47 -0
  155. package/recipes/field.css +66 -0
  156. package/recipes/field.d.ts +21 -0
  157. package/recipes/field.layered.css +77 -0
  158. package/recipes/field.layered.mjs +60 -0
  159. package/recipes/field.mjs +60 -0
  160. package/recipes/floating-action-button.css +63 -0
  161. package/recipes/floating-action-button.d.ts +24 -0
  162. package/recipes/floating-action-button.layered.css +71 -0
  163. package/recipes/floating-action-button.layered.mjs +47 -0
  164. package/recipes/floating-action-button.mjs +47 -0
  165. package/recipes/help-bubble.css +80 -0
  166. package/recipes/help-bubble.d.ts +21 -0
  167. package/recipes/help-bubble.layered.css +92 -0
  168. package/recipes/help-bubble.layered.mjs +60 -0
  169. package/recipes/help-bubble.mjs +60 -0
  170. package/recipes/identity-placeholder.css +15 -0
  171. package/recipes/identity-placeholder.d.ts +24 -0
  172. package/recipes/identity-placeholder.layered.css +18 -0
  173. package/recipes/identity-placeholder.layered.mjs +43 -0
  174. package/recipes/identity-placeholder.mjs +43 -0
  175. package/recipes/image-frame-icon.css +7 -0
  176. package/recipes/image-frame-icon.d.ts +22 -0
  177. package/recipes/image-frame-icon.layered.css +11 -0
  178. package/recipes/image-frame-icon.layered.mjs +43 -0
  179. package/recipes/image-frame-icon.mjs +43 -0
  180. package/recipes/image-frame-indicator.css +16 -0
  181. package/recipes/image-frame-indicator.d.ts +22 -0
  182. package/recipes/image-frame-indicator.layered.css +20 -0
  183. package/recipes/image-frame-indicator.layered.mjs +43 -0
  184. package/recipes/image-frame-indicator.mjs +43 -0
  185. package/recipes/image-frame-reaction-button.css +44 -0
  186. package/recipes/image-frame-reaction-button.d.ts +21 -0
  187. package/recipes/image-frame-reaction-button.layered.css +50 -0
  188. package/recipes/image-frame-reaction-button.layered.mjs +40 -0
  189. package/recipes/image-frame-reaction-button.mjs +40 -0
  190. package/recipes/image-frame.css +28 -0
  191. package/recipes/image-frame.d.ts +28 -0
  192. package/recipes/image-frame.layered.css +34 -0
  193. package/recipes/image-frame.layered.mjs +52 -0
  194. package/recipes/image-frame.mjs +52 -0
  195. package/recipes/inline-banner.css +163 -0
  196. package/recipes/inline-banner.d.ts +24 -0
  197. package/recipes/inline-banner.layered.css +142 -0
  198. package/recipes/inline-banner.layered.mjs +64 -0
  199. package/recipes/inline-banner.mjs +64 -0
  200. package/recipes/input-button.css +120 -0
  201. package/recipes/input-button.d.ts +21 -0
  202. package/recipes/input-button.layered.css +135 -0
  203. package/recipes/input-button.layered.mjs +64 -0
  204. package/recipes/input-button.mjs +64 -0
  205. package/recipes/link-content.css +45 -0
  206. package/recipes/link-content.d.ts +29 -0
  207. package/recipes/link-content.layered.css +72 -0
  208. package/recipes/link-content.layered.mjs +55 -0
  209. package/recipes/link-content.mjs +55 -0
  210. package/recipes/list-header.css +22 -0
  211. package/recipes/list-header.d.ts +25 -0
  212. package/recipes/list-header.layered.css +28 -0
  213. package/recipes/list-header.layered.mjs +49 -0
  214. package/recipes/list-header.mjs +49 -0
  215. package/recipes/list-item.css +108 -0
  216. package/recipes/list-item.d.ts +24 -0
  217. package/recipes/list-item.layered.css +124 -0
  218. package/recipes/list-item.layered.mjs +59 -0
  219. package/recipes/list-item.mjs +59 -0
  220. package/recipes/manner-temp-badge.css +76 -0
  221. package/recipes/manner-temp-badge.d.ts +25 -0
  222. package/recipes/manner-temp-badge.layered.css +100 -0
  223. package/recipes/manner-temp-badge.layered.mjs +57 -0
  224. package/recipes/manner-temp-badge.mjs +57 -0
  225. package/recipes/manner-temp.css +50 -0
  226. package/recipes/manner-temp.d.ts +25 -0
  227. package/recipes/manner-temp.layered.css +71 -0
  228. package/recipes/manner-temp.layered.mjs +57 -0
  229. package/recipes/manner-temp.mjs +57 -0
  230. package/recipes/menu-sheet-item.css +67 -0
  231. package/recipes/menu-sheet-item.d.ts +28 -0
  232. package/recipes/menu-sheet-item.layered.css +83 -0
  233. package/recipes/menu-sheet-item.layered.mjs +56 -0
  234. package/recipes/menu-sheet-item.mjs +56 -0
  235. package/recipes/menu-sheet.css +135 -0
  236. package/recipes/menu-sheet.d.ts +24 -0
  237. package/recipes/menu-sheet.layered.css +151 -0
  238. package/recipes/menu-sheet.layered.mjs +74 -0
  239. package/recipes/menu-sheet.mjs +74 -0
  240. package/recipes/notification-badge-positioner.css +28 -0
  241. package/recipes/notification-badge-positioner.d.ts +29 -0
  242. package/recipes/notification-badge-positioner.layered.css +27 -0
  243. package/recipes/notification-badge-positioner.layered.mjs +71 -0
  244. package/recipes/notification-badge-positioner.mjs +71 -0
  245. package/recipes/notification-badge.css +27 -0
  246. package/recipes/notification-badge.d.ts +25 -0
  247. package/recipes/notification-badge.layered.css +34 -0
  248. package/recipes/notification-badge.layered.mjs +49 -0
  249. package/recipes/notification-badge.mjs +49 -0
  250. package/recipes/page-banner.css +260 -0
  251. package/recipes/page-banner.d.ts +28 -0
  252. package/recipes/page-banner.layered.css +235 -0
  253. package/recipes/page-banner.layered.mjs +117 -0
  254. package/recipes/page-banner.mjs +117 -0
  255. package/recipes/progress-circle.css +55 -0
  256. package/recipes/progress-circle.d.ts +30 -0
  257. package/recipes/progress-circle.mjs +40 -0
  258. package/recipes/pull-to-refresh.css +15 -0
  259. package/recipes/pull-to-refresh.d.ts +21 -0
  260. package/recipes/pull-to-refresh.layered.css +19 -0
  261. package/recipes/pull-to-refresh.layered.mjs +36 -0
  262. package/recipes/pull-to-refresh.mjs +36 -0
  263. package/recipes/radio-group.css +5 -0
  264. package/recipes/radio-group.d.ts +22 -0
  265. package/recipes/radio-group.layered.css +7 -0
  266. package/recipes/radio-group.layered.mjs +43 -0
  267. package/recipes/radio-group.mjs +43 -0
  268. package/recipes/radio.css +37 -0
  269. package/recipes/radio.d.ts +28 -0
  270. package/recipes/radio.layered.css +47 -0
  271. package/recipes/radio.layered.mjs +48 -0
  272. package/recipes/radio.mjs +48 -0
  273. package/recipes/radiomark.css +79 -0
  274. package/recipes/radiomark.d.ts +28 -0
  275. package/recipes/radiomark.layered.css +100 -0
  276. package/recipes/radiomark.layered.mjs +48 -0
  277. package/recipes/radiomark.mjs +48 -0
  278. package/recipes/reaction-button.css +115 -0
  279. package/recipes/reaction-button.d.ts +25 -0
  280. package/recipes/reaction-button.layered.css +173 -0
  281. package/recipes/reaction-button.layered.mjs +49 -0
  282. package/recipes/reaction-button.mjs +49 -0
  283. package/recipes/scroll-fog.css +11 -0
  284. package/recipes/scroll-fog.d.ts +25 -0
  285. package/recipes/scroll-fog.layered.css +19 -0
  286. package/recipes/scroll-fog.layered.mjs +48 -0
  287. package/recipes/scroll-fog.mjs +48 -0
  288. package/recipes/segmented-control.css +59 -0
  289. package/recipes/segmented-control.d.ts +21 -0
  290. package/recipes/segmented-control.layered.css +67 -0
  291. package/recipes/segmented-control.layered.mjs +40 -0
  292. package/recipes/segmented-control.mjs +40 -0
  293. package/recipes/select-box-group.css +10 -0
  294. package/recipes/select-box-group.d.ts +22 -0
  295. package/recipes/select-box-group.layered.css +13 -0
  296. package/recipes/select-box-group.layered.mjs +43 -0
  297. package/recipes/select-box-group.mjs +43 -0
  298. package/recipes/select-box.css +111 -0
  299. package/recipes/select-box.d.ts +24 -0
  300. package/recipes/select-box.layered.css +130 -0
  301. package/recipes/select-box.layered.mjs +63 -0
  302. package/recipes/select-box.mjs +63 -0
  303. package/recipes/selectBoxCheckmark.css +30 -0
  304. package/recipes/selectBoxCheckmark.d.ts +21 -0
  305. package/recipes/selectBoxCheckmark.layered.css +36 -0
  306. package/recipes/selectBoxCheckmark.layered.mjs +36 -0
  307. package/recipes/selectBoxCheckmark.mjs +36 -0
  308. package/recipes/shared.mjs +48 -0
  309. package/recipes/skeleton.css +46 -0
  310. package/recipes/skeleton.d.ts +29 -0
  311. package/recipes/skeleton.layered.css +63 -0
  312. package/recipes/skeleton.layered.mjs +56 -0
  313. package/recipes/skeleton.mjs +56 -0
  314. package/recipes/slider-marker.css +55 -0
  315. package/recipes/slider-marker.d.ts +25 -0
  316. package/recipes/slider-marker.layered.css +73 -0
  317. package/recipes/slider-marker.layered.mjs +50 -0
  318. package/recipes/slider-marker.mjs +50 -0
  319. package/recipes/slider-tick.css +21 -0
  320. package/recipes/slider-tick.d.ts +25 -0
  321. package/recipes/slider-tick.layered.css +32 -0
  322. package/recipes/slider-tick.layered.mjs +49 -0
  323. package/recipes/slider-tick.mjs +49 -0
  324. package/recipes/slider.css +177 -0
  325. package/recipes/slider.d.ts +21 -0
  326. package/recipes/slider.layered.css +209 -0
  327. package/recipes/slider.layered.mjs +68 -0
  328. package/recipes/slider.mjs +68 -0
  329. package/recipes/snackbar-region.css +20 -0
  330. package/recipes/snackbar-region.d.ts +22 -0
  331. package/recipes/snackbar-region.layered.css +29 -0
  332. package/recipes/snackbar-region.layered.mjs +43 -0
  333. package/recipes/snackbar-region.mjs +43 -0
  334. package/recipes/snackbar.css +83 -0
  335. package/recipes/snackbar.d.ts +24 -0
  336. package/recipes/snackbar.layered.css +94 -0
  337. package/recipes/snackbar.layered.mjs +56 -0
  338. package/recipes/snackbar.mjs +56 -0
  339. package/recipes/switch.css +44 -0
  340. package/recipes/switch.d.ts +24 -0
  341. package/recipes/switch.layered.css +54 -0
  342. package/recipes/switch.layered.mjs +44 -0
  343. package/recipes/switch.mjs +44 -0
  344. package/recipes/switchmark.css +70 -0
  345. package/recipes/switchmark.d.ts +28 -0
  346. package/recipes/switchmark.layered.css +89 -0
  347. package/recipes/switchmark.layered.mjs +49 -0
  348. package/recipes/switchmark.mjs +49 -0
  349. package/recipes/tabs.css +157 -0
  350. package/recipes/tabs.d.ts +36 -0
  351. package/recipes/tabs.layered.css +184 -0
  352. package/recipes/tabs.layered.mjs +78 -0
  353. package/recipes/tabs.mjs +78 -0
  354. package/recipes/tag-group-item.css +75 -0
  355. package/recipes/tag-group-item.d.ts +32 -0
  356. package/recipes/tag-group-item.layered.css +94 -0
  357. package/recipes/tag-group-item.layered.mjs +55 -0
  358. package/recipes/tag-group-item.mjs +55 -0
  359. package/recipes/tag-group.css +42 -0
  360. package/recipes/tag-group.d.ts +28 -0
  361. package/recipes/tag-group.layered.css +52 -0
  362. package/recipes/tag-group.layered.mjs +62 -0
  363. package/recipes/tag-group.mjs +62 -0
  364. package/recipes/text-input.css +198 -0
  365. package/recipes/text-input.d.ts +28 -0
  366. package/recipes/text-input.layered.css +212 -0
  367. package/recipes/text-input.layered.mjs +73 -0
  368. package/recipes/text-input.mjs +73 -0
  369. package/recipes/text.css +558 -0
  370. package/recipes/text.d.ts +33 -0
  371. package/recipes/text.layered.css +371 -0
  372. package/recipes/text.layered.mjs +110 -0
  373. package/recipes/text.mjs +110 -0
  374. package/recipes/toggle-button.css +167 -0
  375. package/recipes/toggle-button.d.ts +29 -0
  376. package/recipes/toggle-button.layered.css +239 -0
  377. package/recipes/toggle-button.layered.mjs +54 -0
  378. package/recipes/toggle-button.mjs +54 -0
  379. package/vars/color/banner.d.ts +10 -0
  380. package/vars/color/banner.mjs +10 -0
  381. package/vars/color/bg.d.ts +76 -0
  382. package/vars/color/bg.mjs +41 -0
  383. package/vars/color/fg.d.ts +30 -0
  384. package/vars/color/fg.mjs +16 -0
  385. package/vars/color/index.d.ts +6 -0
  386. package/vars/color/index.mjs +6 -0
  387. package/vars/color/manner-temp/index.d.ts +10 -0
  388. package/vars/color/manner-temp/index.mjs +10 -0
  389. package/vars/color/manner-temp/l1.d.ts +2 -0
  390. package/vars/color/manner-temp/l1.mjs +2 -0
  391. package/vars/color/manner-temp/l10.d.ts +2 -0
  392. package/vars/color/manner-temp/l10.mjs +2 -0
  393. package/vars/color/manner-temp/l2.d.ts +2 -0
  394. package/vars/color/manner-temp/l2.mjs +2 -0
  395. package/vars/color/manner-temp/l3.d.ts +2 -0
  396. package/vars/color/manner-temp/l3.mjs +2 -0
  397. package/vars/color/manner-temp/l4.d.ts +2 -0
  398. package/vars/color/manner-temp/l4.mjs +2 -0
  399. package/vars/color/manner-temp/l5.d.ts +2 -0
  400. package/vars/color/manner-temp/l5.mjs +2 -0
  401. package/vars/color/manner-temp/l6.d.ts +2 -0
  402. package/vars/color/manner-temp/l6.mjs +2 -0
  403. package/vars/color/manner-temp/l7.d.ts +2 -0
  404. package/vars/color/manner-temp/l7.mjs +2 -0
  405. package/vars/color/manner-temp/l8.d.ts +2 -0
  406. package/vars/color/manner-temp/l8.mjs +2 -0
  407. package/vars/color/manner-temp/l9.d.ts +2 -0
  408. package/vars/color/manner-temp/l9.mjs +2 -0
  409. package/vars/color/palette.d.ts +94 -0
  410. package/vars/color/palette.mjs +94 -0
  411. package/vars/color/stroke.d.ts +31 -0
  412. package/vars/color/stroke.mjs +16 -0
  413. package/vars/component/action-button.d.ts +660 -0
  414. package/vars/component/action-button.mjs +541 -0
  415. package/vars/component/action-chip.d.ts +132 -0
  416. package/vars/component/action-chip.mjs +132 -0
  417. package/vars/component/action-sheet-close-button.d.ts +23 -0
  418. package/vars/component/action-sheet-close-button.mjs +23 -0
  419. package/vars/component/action-sheet-item.d.ts +36 -0
  420. package/vars/component/action-sheet-item.mjs +36 -0
  421. package/vars/component/action-sheet.d.ts +46 -0
  422. package/vars/component/action-sheet.mjs +46 -0
  423. package/vars/component/avatar-stack.d.ts +110 -0
  424. package/vars/component/avatar-stack.mjs +110 -0
  425. package/vars/component/avatar.d.ts +204 -0
  426. package/vars/component/avatar.mjs +162 -0
  427. package/vars/component/badge.d.ts +316 -0
  428. package/vars/component/badge.mjs +236 -0
  429. package/vars/component/bottom-sheet-close-button.d.ts +21 -0
  430. package/vars/component/bottom-sheet-close-button.mjs +21 -0
  431. package/vars/component/bottom-sheet-handle.d.ts +24 -0
  432. package/vars/component/bottom-sheet-handle.mjs +24 -0
  433. package/vars/component/bottom-sheet.d.ts +86 -0
  434. package/vars/component/bottom-sheet.mjs +86 -0
  435. package/vars/component/callout.d.ts +229 -0
  436. package/vars/component/callout.mjs +197 -0
  437. package/vars/component/checkbox-group.d.ts +9 -0
  438. package/vars/component/checkbox-group.mjs +9 -0
  439. package/vars/component/checkbox.d.ts +53 -0
  440. package/vars/component/checkbox.mjs +53 -0
  441. package/vars/component/checkmark.d.ts +197 -0
  442. package/vars/component/checkmark.mjs +165 -0
  443. package/vars/component/chip-tab.d.ts +162 -0
  444. package/vars/component/chip-tab.mjs +162 -0
  445. package/vars/component/chip-tablist.d.ts +31 -0
  446. package/vars/component/chip-tablist.mjs +31 -0
  447. package/vars/component/chip.d.ts +301 -0
  448. package/vars/component/chip.mjs +283 -0
  449. package/vars/component/content-placeholder.d.ts +28 -0
  450. package/vars/component/content-placeholder.mjs +27 -0
  451. package/vars/component/contextual-floating-button.d.ts +144 -0
  452. package/vars/component/contextual-floating-button.mjs +132 -0
  453. package/vars/component/control-chip.d.ts +158 -0
  454. package/vars/component/control-chip.mjs +158 -0
  455. package/vars/component/dialog.d.ts +52 -0
  456. package/vars/component/dialog.mjs +52 -0
  457. package/vars/component/divider.d.ts +9 -0
  458. package/vars/component/divider.mjs +9 -0
  459. package/vars/component/extended-action-sheet-close-button.d.ts +24 -0
  460. package/vars/component/extended-action-sheet-close-button.mjs +24 -0
  461. package/vars/component/extended-action-sheet-item.d.ts +46 -0
  462. package/vars/component/extended-action-sheet-item.mjs +46 -0
  463. package/vars/component/extended-action-sheet.d.ts +55 -0
  464. package/vars/component/extended-action-sheet.mjs +55 -0
  465. package/vars/component/extended-fab.d.ts +88 -0
  466. package/vars/component/extended-fab.mjs +82 -0
  467. package/vars/component/fab.d.ts +21 -0
  468. package/vars/component/fab.mjs +21 -0
  469. package/vars/component/field-label.d.ts +25 -0
  470. package/vars/component/field-label.mjs +25 -0
  471. package/vars/component/field.d.ts +78 -0
  472. package/vars/component/field.mjs +72 -0
  473. package/vars/component/floating-action-button.d.ts +60 -0
  474. package/vars/component/floating-action-button.mjs +54 -0
  475. package/vars/component/help-bubble.d.ts +52 -0
  476. package/vars/component/help-bubble.mjs +50 -0
  477. package/vars/component/identity-placeholder.d.ts +12 -0
  478. package/vars/component/identity-placeholder.mjs +12 -0
  479. package/vars/component/image-frame-floater.d.ts +10 -0
  480. package/vars/component/image-frame-floater.mjs +9 -0
  481. package/vars/component/image-frame-indicator.d.ts +20 -0
  482. package/vars/component/image-frame-indicator.mjs +18 -0
  483. package/vars/component/image-frame-reaction-button.d.ts +35 -0
  484. package/vars/component/image-frame-reaction-button.mjs +26 -0
  485. package/vars/component/image-frame.d.ts +48 -0
  486. package/vars/component/image-frame.mjs +26 -0
  487. package/vars/component/index.d.ts +77 -0
  488. package/vars/component/index.mjs +77 -0
  489. package/vars/component/inline-banner.d.ts +191 -0
  490. package/vars/component/inline-banner.mjs +191 -0
  491. package/vars/component/input-button.d.ts +89 -0
  492. package/vars/component/input-button.mjs +88 -0
  493. package/vars/component/link-content.d.ts +58 -0
  494. package/vars/component/link-content.mjs +58 -0
  495. package/vars/component/list-header.d.ts +29 -0
  496. package/vars/component/list-header.mjs +29 -0
  497. package/vars/component/list-item.d.ts +84 -0
  498. package/vars/component/list-item.mjs +84 -0
  499. package/vars/component/manner-temp-badge.d.ts +117 -0
  500. package/vars/component/manner-temp-badge.mjs +117 -0
  501. package/vars/component/manner-temp.d.ts +88 -0
  502. package/vars/component/manner-temp.mjs +88 -0
  503. package/vars/component/menu-sheet-close-button.d.ts +24 -0
  504. package/vars/component/menu-sheet-close-button.mjs +24 -0
  505. package/vars/component/menu-sheet-item.d.ts +73 -0
  506. package/vars/component/menu-sheet-item.mjs +61 -0
  507. package/vars/component/menu-sheet.d.ts +55 -0
  508. package/vars/component/menu-sheet.mjs +55 -0
  509. package/vars/component/notification-badge.d.ts +47 -0
  510. package/vars/component/notification-badge.mjs +41 -0
  511. package/vars/component/page-banner.d.ts +382 -0
  512. package/vars/component/page-banner.mjs +336 -0
  513. package/vars/component/progress-circle.d.ts +88 -0
  514. package/vars/component/progress-circle.mjs +67 -0
  515. package/vars/component/radio-group.d.ts +9 -0
  516. package/vars/component/radio-group.mjs +9 -0
  517. package/vars/component/radio.d.ts +53 -0
  518. package/vars/component/radio.mjs +53 -0
  519. package/vars/component/radiomark.d.ts +120 -0
  520. package/vars/component/radiomark.mjs +117 -0
  521. package/vars/component/reaction-button.d.ts +136 -0
  522. package/vars/component/reaction-button.mjs +136 -0
  523. package/vars/component/scroll-fog.d.ts +11 -0
  524. package/vars/component/scroll-fog.mjs +11 -0
  525. package/vars/component/segmented-control-indicator.d.ts +24 -0
  526. package/vars/component/segmented-control-indicator.mjs +24 -0
  527. package/vars/component/segmented-control-item.d.ts +41 -0
  528. package/vars/component/segmented-control-item.mjs +41 -0
  529. package/vars/component/segmented-control.d.ts +11 -0
  530. package/vars/component/segmented-control.mjs +11 -0
  531. package/vars/component/select-box-checkmark.d.ts +40 -0
  532. package/vars/component/select-box-checkmark.mjs +40 -0
  533. package/vars/component/select-box-group.d.ts +10 -0
  534. package/vars/component/select-box-group.mjs +10 -0
  535. package/vars/component/select-box.d.ts +107 -0
  536. package/vars/component/select-box.mjs +102 -0
  537. package/vars/component/skeleton.d.ts +76 -0
  538. package/vars/component/skeleton.mjs +58 -0
  539. package/vars/component/slider-thumb.d.ts +25 -0
  540. package/vars/component/slider-thumb.mjs +25 -0
  541. package/vars/component/slider-tick.d.ts +23 -0
  542. package/vars/component/slider-tick.mjs +23 -0
  543. package/vars/component/slider.d.ts +78 -0
  544. package/vars/component/slider.mjs +75 -0
  545. package/vars/component/snackbar.d.ts +65 -0
  546. package/vars/component/snackbar.mjs +65 -0
  547. package/vars/component/switch.d.ts +53 -0
  548. package/vars/component/switch.mjs +53 -0
  549. package/vars/component/switchmark.d.ts +115 -0
  550. package/vars/component/switchmark.mjs +112 -0
  551. package/vars/component/tab.d.ts +47 -0
  552. package/vars/component/tab.mjs +47 -0
  553. package/vars/component/tablist.d.ts +51 -0
  554. package/vars/component/tablist.mjs +51 -0
  555. package/vars/component/tag-group-item.d.ts +122 -0
  556. package/vars/component/tag-group-item.mjs +122 -0
  557. package/vars/component/tag-group.d.ts +34 -0
  558. package/vars/component/tag-group.mjs +34 -0
  559. package/vars/component/text-button.d.ts +23 -0
  560. package/vars/component/text-button.mjs +23 -0
  561. package/vars/component/text-input.d.ts +224 -0
  562. package/vars/component/text-input.mjs +211 -0
  563. package/vars/component/toggle-button.d.ts +213 -0
  564. package/vars/component/toggle-button.mjs +207 -0
  565. package/vars/component/top-navigation.d.ts +89 -0
  566. package/vars/component/top-navigation.mjs +89 -0
  567. package/vars/component/typography.d.ts +542 -0
  568. package/vars/component/typography.mjs +461 -0
  569. package/vars/dimension/index.d.ts +22 -0
  570. package/vars/dimension/index.mjs +22 -0
  571. package/vars/dimension/spacing-x.d.ts +4 -0
  572. package/vars/dimension/spacing-x.mjs +2 -0
  573. package/vars/dimension/spacing-y.d.ts +8 -0
  574. package/vars/dimension/spacing-y.mjs +4 -0
  575. package/vars/duration.d.ts +7 -0
  576. package/vars/duration.mjs +7 -0
  577. package/vars/font-size.d.ts +30 -0
  578. package/vars/font-size.mjs +20 -0
  579. package/vars/font-weight.d.ts +3 -0
  580. package/vars/font-weight.mjs +3 -0
  581. package/vars/gradient.d.ts +19 -0
  582. package/vars/gradient.mjs +8 -0
  583. package/vars/index.d.ts +51 -0
  584. package/vars/index.mjs +1 -0
  585. package/vars/line-height.d.ts +30 -0
  586. package/vars/line-height.mjs +20 -0
  587. package/vars/radius.d.ts +11 -0
  588. package/vars/radius.mjs +11 -0
  589. package/vars/shadow.d.ts +4 -0
  590. package/vars/shadow.mjs +3 -0
  591. package/vars/timing-function.d.ts +6 -0
  592. package/vars/timing-function.mjs +6 -0
  593. package/vars/vars.d.ts +10 -0
  594. package/vars/vars.mjs +10 -0
package/recipes/action-button.layered.css ADDED
@@ -0,0 +1,747 @@
1
+ @layer seed-components {
2
+ .seed-action-button {
3
+ --seed-box-flex-grow: 0;
4
+ flex-shrink: 0;
5
+ flex-grow: var(--seed-box-flex-grow);
6
+ --seed-box-min-width: auto;
7
+ min-width: var(--seed-box-min-width);
8
+ --seed-box-padding-bottom: auto;
9
+ --seed-box-padding-top: auto;
10
+ --seed-box-padding-left: auto;
11
+ --seed-box-padding-right: auto;
12
+ padding-top: var(--seed-box-padding-top);
13
+ padding-bottom: var(--seed-box-padding-bottom);
14
+ padding-left: var(--seed-box-padding-left);
15
+ padding-right: var(--seed-box-padding-right);
16
+ --seed-box-bleed-bottom: 0px;
17
+ --seed-box-bleed-top: 0px;
18
+ --seed-box-bleed-left: 0px;
19
+ --seed-box-bleed-right: 0px;
20
+ margin-top: calc(var(--seed-box-bleed-top) * -1);
21
+ margin-bottom: calc(var(--seed-box-bleed-bottom) * -1);
22
+ margin-left: calc(var(--seed-box-bleed-left) * -1);
23
+ margin-right: calc(var(--seed-box-bleed-right) * -1);
24
+ border: none;
25
+ justify-content: center;
26
+ align-items: center;
27
+ display: inline-flex;
28
+ position: relative;
29
+ }
30
+ .seed-action-button__text {
31
+ --seed-box-flex-grow: 0;
32
+ --seed-box-min-width: auto;
33
+ --seed-box-padding-bottom: auto;
34
+ --seed-box-padding-top: auto;
35
+ --seed-box-padding-left: auto;
36
+ --seed-box-padding-right: auto;
37
+ --seed-box-bleed-bottom: 0px;
38
+ --seed-box-bleed-top: 0px;
39
+ --seed-box-bleed-left: 0px;
40
+ --seed-box-bleed-right: 0px;
41
+ }
42
+
43
+ .seed-action-button__text {
44
+ --seed-box-flex-grow: 0;
45
+ --seed-box-min-width: auto;
46
+ --seed-box-padding-bottom: auto;
47
+ --seed-box-padding-top: auto;
48
+ --seed-box-padding-left: auto;
49
+ --seed-box-padding-right: auto;
50
+ --seed-box-bleed-bottom: 0px;
51
+ --seed-box-bleed-top: 0px;
52
+ --seed-box-bleed-left: 0px;
53
+ --seed-box-bleed-right: 0px;
54
+ font-family: inherit;
55
+ }
56
+
57
+ .seed-action-button, .seed-action-button__text {
58
+ transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
59
+ }
60
+
61
+ .seed-action-button--variant_brandSolid {
62
+ background: var(--seed-color-bg-brand-solid);
63
+ --seed-prefix-icon-color: var(--seed-color-palette-static-white);
64
+ --seed-suffix-icon-color: var(--seed-color-palette-static-white);
65
+ --seed-icon-color: var(--seed-color-palette-static-white);
66
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
67
+ --range-color: var(--seed-color-palette-static-white);
68
+ }
69
+
70
+ .seed-action-button__text--variant_brandSolid {
71
+ --seed-prefix-icon-color: var(--seed-color-palette-static-white);
72
+ --seed-suffix-icon-color: var(--seed-color-palette-static-white);
73
+ --seed-icon-color: var(--seed-color-palette-static-white);
74
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
75
+ --range-color: var(--seed-color-palette-static-white);
76
+ }
77
+
78
+ .seed-action-button__text--variant_brandSolid {
79
+ --seed-prefix-icon-color: var(--seed-color-palette-static-white);
80
+ --seed-suffix-icon-color: var(--seed-color-palette-static-white);
81
+ --seed-icon-color: var(--seed-color-palette-static-white);
82
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
83
+ --range-color: var(--seed-color-palette-static-white);
84
+ color: var(--seed-color-palette-static-white);
85
+ font-weight: var(--seed-font-weight-bold);
86
+ }
87
+
88
+ .seed-action-button--variant_brandSolid:active {
89
+ background: var(--seed-color-bg-brand-solid-pressed);
90
+ }
91
+
92
+ .seed-action-button--variant_brandSolid.seed-action-button--disabled_true {
93
+ background: var(--seed-color-bg-disabled);
94
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
95
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
96
+ --seed-icon-color: var(--seed-color-fg-disabled);
97
+ }
98
+
99
+ .seed-action-button__text--variant_brandSolid.seed-action-button__text--disabled_true {
100
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
101
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
102
+ --seed-icon-color: var(--seed-color-fg-disabled);
103
+ }
104
+
105
+ .seed-action-button__text--variant_brandSolid.seed-action-button__text--disabled_true {
106
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
107
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
108
+ --seed-icon-color: var(--seed-color-fg-disabled);
109
+ color: var(--seed-color-fg-disabled);
110
+ }
111
+
112
+ .seed-action-button--variant_brandSolid.seed-action-button--loading_true {
113
+ background: var(--seed-color-bg-brand-solid-pressed);
114
+ }
115
+
116
+ .seed-action-button--variant_neutralSolid {
117
+ background: var(--seed-color-bg-neutral-inverted);
118
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral-inverted);
119
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
120
+ --seed-icon-color: var(--seed-color-fg-neutral-inverted);
121
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
122
+ --range-color: var(--seed-color-palette-static-white);
123
+ }
124
+
125
+ .seed-action-button__text--variant_neutralSolid {
126
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral-inverted);
127
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
128
+ --seed-icon-color: var(--seed-color-fg-neutral-inverted);
129
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
130
+ --range-color: var(--seed-color-palette-static-white);
131
+ }
132
+
133
+ .seed-action-button__text--variant_neutralSolid {
134
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral-inverted);
135
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
136
+ --seed-icon-color: var(--seed-color-fg-neutral-inverted);
137
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
138
+ --range-color: var(--seed-color-palette-static-white);
139
+ color: var(--seed-color-fg-neutral-inverted);
140
+ font-weight: var(--seed-font-weight-bold);
141
+ }
142
+
143
+ .seed-action-button--variant_neutralSolid:active {
144
+ background: var(--seed-color-bg-neutral-inverted-pressed);
145
+ }
146
+
147
+ .seed-action-button--variant_neutralSolid.seed-action-button--disabled_true {
148
+ background: var(--seed-color-bg-disabled);
149
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
150
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
151
+ --seed-icon-color: var(--seed-color-fg-disabled);
152
+ }
153
+
154
+ .seed-action-button__text--variant_neutralSolid.seed-action-button__text--disabled_true {
155
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
156
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
157
+ --seed-icon-color: var(--seed-color-fg-disabled);
158
+ }
159
+
160
+ .seed-action-button__text--variant_neutralSolid.seed-action-button__text--disabled_true {
161
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
162
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
163
+ --seed-icon-color: var(--seed-color-fg-disabled);
164
+ color: var(--seed-color-fg-disabled);
165
+ }
166
+
167
+ .seed-action-button--variant_neutralSolid.seed-action-button--loading_true {
168
+ background: var(--seed-color-bg-neutral-inverted-pressed);
169
+ }
170
+
171
+ .seed-action-button--variant_neutralWeak {
172
+ background: var(--seed-color-bg-neutral-weak);
173
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
174
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
175
+ --seed-icon-color: var(--seed-color-fg-neutral);
176
+ --track-color: var(--seed-color-palette-gray-500);
177
+ --range-color: var(--seed-color-fg-neutral);
178
+ }
179
+
180
+ .seed-action-button__text--variant_neutralWeak {
181
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
182
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
183
+ --seed-icon-color: var(--seed-color-fg-neutral);
184
+ --track-color: var(--seed-color-palette-gray-500);
185
+ --range-color: var(--seed-color-fg-neutral);
186
+ }
187
+
188
+ .seed-action-button__text--variant_neutralWeak {
189
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
190
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
191
+ --seed-icon-color: var(--seed-color-fg-neutral);
192
+ --track-color: var(--seed-color-palette-gray-500);
193
+ --range-color: var(--seed-color-fg-neutral);
194
+ color: var(--seed-color-fg-neutral);
195
+ font-weight: var(--seed-font-weight-bold);
196
+ }
197
+
198
+ .seed-action-button--variant_neutralWeak:active {
199
+ background: var(--seed-color-bg-neutral-weak-pressed);
200
+ }
201
+
202
+ .seed-action-button--variant_neutralWeak.seed-action-button--disabled_true {
203
+ background: var(--seed-color-bg-disabled);
204
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
205
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
206
+ --seed-icon-color: var(--seed-color-fg-disabled);
207
+ }
208
+
209
+ .seed-action-button__text--variant_neutralWeak.seed-action-button__text--disabled_true {
210
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
211
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
212
+ --seed-icon-color: var(--seed-color-fg-disabled);
213
+ }
214
+
215
+ .seed-action-button__text--variant_neutralWeak.seed-action-button__text--disabled_true {
216
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
217
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
218
+ --seed-icon-color: var(--seed-color-fg-disabled);
219
+ color: var(--seed-color-fg-disabled);
220
+ }
221
+
222
+ .seed-action-button--variant_neutralWeak.seed-action-button--loading_true {
223
+ background: var(--seed-color-bg-neutral-weak-pressed);
224
+ }
225
+
226
+ .seed-action-button--variant_criticalSolid {
227
+ background: var(--seed-color-bg-critical-solid);
228
+ --seed-prefix-icon-color: var(--seed-color-palette-static-white);
229
+ --seed-suffix-icon-color: var(--seed-color-palette-static-white);
230
+ --seed-icon-color: var(--seed-color-palette-static-white);
231
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
232
+ --range-color: var(--seed-color-palette-static-white);
233
+ }
234
+
235
+ .seed-action-button__text--variant_criticalSolid {
236
+ --seed-prefix-icon-color: var(--seed-color-palette-static-white);
237
+ --seed-suffix-icon-color: var(--seed-color-palette-static-white);
238
+ --seed-icon-color: var(--seed-color-palette-static-white);
239
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
240
+ --range-color: var(--seed-color-palette-static-white);
241
+ }
242
+
243
+ .seed-action-button__text--variant_criticalSolid {
244
+ --seed-prefix-icon-color: var(--seed-color-palette-static-white);
245
+ --seed-suffix-icon-color: var(--seed-color-palette-static-white);
246
+ --seed-icon-color: var(--seed-color-palette-static-white);
247
+ --track-color: var(--seed-color-palette-static-white-alpha-300);
248
+ --range-color: var(--seed-color-palette-static-white);
249
+ color: var(--seed-color-palette-static-white);
250
+ font-weight: var(--seed-font-weight-bold);
251
+ }
252
+
253
+ .seed-action-button--variant_criticalSolid:active {
254
+ background: var(--seed-color-bg-critical-solid-pressed);
255
+ }
256
+
257
+ .seed-action-button--variant_criticalSolid.seed-action-button--disabled_true {
258
+ background: var(--seed-color-bg-disabled);
259
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
260
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
261
+ --seed-icon-color: var(--seed-color-fg-disabled);
262
+ }
263
+
264
+ .seed-action-button__text--variant_criticalSolid.seed-action-button__text--disabled_true {
265
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
266
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
267
+ --seed-icon-color: var(--seed-color-fg-disabled);
268
+ }
269
+
270
+ .seed-action-button__text--variant_criticalSolid.seed-action-button__text--disabled_true {
271
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
272
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
273
+ --seed-icon-color: var(--seed-color-fg-disabled);
274
+ color: var(--seed-color-fg-disabled);
275
+ }
276
+
277
+ .seed-action-button--variant_criticalSolid.seed-action-button--loading_true {
278
+ background: var(--seed-color-bg-critical-solid-pressed);
279
+ }
280
+
281
+ .seed-action-button--variant_brandOutline {
282
+ background: var(--seed-color-bg-transparent);
283
+ border-style: solid;
284
+ border-width: 1px;
285
+ border-color: var(--seed-color-stroke-neutral-muted);
286
+ --seed-prefix-icon-color: var(--seed-color-fg-brand);
287
+ --seed-suffix-icon-color: var(--seed-color-fg-brand);
288
+ --seed-icon-color: var(--seed-color-fg-brand);
289
+ --track-color: var(--seed-color-palette-carrot-200);
290
+ --range-color: var(--seed-color-bg-brand-solid);
291
+ }
292
+
293
+ .seed-action-button__text--variant_brandOutline {
294
+ --seed-prefix-icon-color: var(--seed-color-fg-brand);
295
+ --seed-suffix-icon-color: var(--seed-color-fg-brand);
296
+ --seed-icon-color: var(--seed-color-fg-brand);
297
+ --track-color: var(--seed-color-palette-carrot-200);
298
+ --range-color: var(--seed-color-bg-brand-solid);
299
+ }
300
+
301
+ .seed-action-button__text--variant_brandOutline {
302
+ --seed-prefix-icon-color: var(--seed-color-fg-brand);
303
+ --seed-suffix-icon-color: var(--seed-color-fg-brand);
304
+ --seed-icon-color: var(--seed-color-fg-brand);
305
+ --track-color: var(--seed-color-palette-carrot-200);
306
+ --range-color: var(--seed-color-bg-brand-solid);
307
+ color: var(--seed-color-fg-brand);
308
+ font-weight: var(--seed-font-weight-bold);
309
+ }
310
+
311
+ .seed-action-button--variant_brandOutline:active {
312
+ background: var(--seed-color-bg-transparent-pressed);
313
+ }
314
+
315
+ .seed-action-button--variant_brandOutline.seed-action-button--disabled_true {
316
+ background: var(--seed-color-bg-transparent);
317
+ border-color: var(--seed-color-stroke-neutral-muted);
318
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
319
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
320
+ --seed-icon-color: var(--seed-color-fg-disabled);
321
+ }
322
+
323
+ .seed-action-button__text--variant_brandOutline.seed-action-button__text--disabled_true {
324
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
325
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
326
+ --seed-icon-color: var(--seed-color-fg-disabled);
327
+ }
328
+
329
+ .seed-action-button__text--variant_brandOutline.seed-action-button__text--disabled_true {
330
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
331
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
332
+ --seed-icon-color: var(--seed-color-fg-disabled);
333
+ color: var(--seed-color-fg-disabled);
334
+ }
335
+
336
+ .seed-action-button--variant_brandOutline.seed-action-button--loading_true {
337
+ background: var(--seed-color-bg-transparent);
338
+ }
339
+
340
+ .seed-action-button--variant_neutralOutline {
341
+ background: var(--seed-color-bg-transparent);
342
+ border-style: solid;
343
+ border-width: 1px;
344
+ border-color: var(--seed-color-stroke-neutral-muted);
345
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
346
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
347
+ --seed-icon-color: var(--seed-color-fg-neutral);
348
+ --track-color: var(--seed-color-palette-gray-500);
349
+ --range-color: var(--seed-color-fg-neutral);
350
+ }
351
+
352
+ .seed-action-button__text--variant_neutralOutline {
353
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
354
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
355
+ --seed-icon-color: var(--seed-color-fg-neutral);
356
+ --track-color: var(--seed-color-palette-gray-500);
357
+ --range-color: var(--seed-color-fg-neutral);
358
+ }
359
+
360
+ .seed-action-button__text--variant_neutralOutline {
361
+ --seed-prefix-icon-color: var(--seed-color-fg-neutral);
362
+ --seed-suffix-icon-color: var(--seed-color-fg-neutral);
363
+ --seed-icon-color: var(--seed-color-fg-neutral);
364
+ --track-color: var(--seed-color-palette-gray-500);
365
+ --range-color: var(--seed-color-fg-neutral);
366
+ color: var(--seed-color-fg-neutral);
367
+ font-weight: var(--seed-font-weight-bold);
368
+ }
369
+
370
+ .seed-action-button--variant_neutralOutline:active {
371
+ background: var(--seed-color-bg-transparent-pressed);
372
+ }
373
+
374
+ .seed-action-button--variant_neutralOutline.seed-action-button--disabled_true {
375
+ background: var(--seed-color-bg-transparent);
376
+ border-color: var(--seed-color-stroke-neutral-muted);
377
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
378
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
379
+ --seed-icon-color: var(--seed-color-fg-disabled);
380
+ }
381
+
382
+ .seed-action-button__text--variant_neutralOutline.seed-action-button__text--disabled_true {
383
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
384
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
385
+ --seed-icon-color: var(--seed-color-fg-disabled);
386
+ }
387
+
388
+ .seed-action-button__text--variant_neutralOutline.seed-action-button__text--disabled_true {
389
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
390
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
391
+ --seed-icon-color: var(--seed-color-fg-disabled);
392
+ color: var(--seed-color-fg-disabled);
393
+ }
394
+
395
+ .seed-action-button--variant_neutralOutline.seed-action-button--loading_true {
396
+ background: var(--seed-color-bg-transparent);
397
+ }
398
+
399
+ .seed-action-button--variant_ghost {
400
+ --seed-box-color: var(--seed-color-fg-neutral);
401
+ --seed-prefix-icon-color: var(--seed-box-color);
402
+ --seed-suffix-icon-color: var(--seed-box-color);
403
+ --seed-icon-color: var(--seed-box-color);
404
+ --seed-font-weight: var(--seed-font-weight-bold);
405
+ --track-color: var(--seed-color-palette-gray-500);
406
+ --range-color: var(--seed-color-fg-neutral);
407
+ background: #fff0;
408
+ }
409
+
410
+ .seed-action-button__text--variant_ghost {
411
+ --seed-box-color: var(--seed-color-fg-neutral);
412
+ --seed-prefix-icon-color: var(--seed-box-color);
413
+ --seed-suffix-icon-color: var(--seed-box-color);
414
+ --seed-icon-color: var(--seed-box-color);
415
+ --seed-font-weight: var(--seed-font-weight-bold);
416
+ --track-color: var(--seed-color-palette-gray-500);
417
+ --range-color: var(--seed-color-fg-neutral);
418
+ }
419
+
420
+ .seed-action-button__text--variant_ghost {
421
+ --seed-box-color: var(--seed-color-fg-neutral);
422
+ --seed-prefix-icon-color: var(--seed-box-color);
423
+ --seed-suffix-icon-color: var(--seed-box-color);
424
+ --seed-icon-color: var(--seed-box-color);
425
+ --seed-font-weight: var(--seed-font-weight-bold);
426
+ --track-color: var(--seed-color-palette-gray-500);
427
+ --range-color: var(--seed-color-fg-neutral);
428
+ color: var(--seed-box-color);
429
+ font-weight: var(--seed-font-weight);
430
+ }
431
+
432
+ .seed-action-button--variant_ghost:active {
433
+ background: var(--seed-color-bg-transparent-pressed);
434
+ }
435
+
436
+ .seed-action-button--variant_ghost.seed-action-button--disabled_true {
437
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
438
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
439
+ --seed-icon-color: var(--seed-color-fg-disabled);
440
+ background: #fff0;
441
+ }
442
+
443
+ .seed-action-button__text--variant_ghost.seed-action-button__text--disabled_true {
444
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
445
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
446
+ --seed-icon-color: var(--seed-color-fg-disabled);
447
+ }
448
+
449
+ .seed-action-button__text--variant_ghost.seed-action-button__text--disabled_true {
450
+ --seed-prefix-icon-color: var(--seed-color-fg-disabled);
451
+ --seed-suffix-icon-color: var(--seed-color-fg-disabled);
452
+ --seed-icon-color: var(--seed-color-fg-disabled);
453
+ color: var(--seed-color-fg-disabled);
454
+ }
455
+
456
+ .seed-action-button--variant_ghost.seed-action-button--loading_true {
457
+ background: var(--seed-color-bg-transparent-pressed);
458
+ }
459
+
460
+ .seed-action-button--size_xsmall {
461
+ height: var(--seed-dimension-x8);
462
+ border-radius: var(--seed-radius-full);
463
+ --size: 14px;
464
+ --thickness: 2px;
465
+ --seed-prefix-icon-size: var(--seed-dimension-x3_5);
466
+ --seed-suffix-icon-size: var(--seed-dimension-x3_5);
467
+ --seed-icon-size: var(--seed-dimension-x3_5);
468
+ }
469
+
470
+ .seed-action-button__text--size_xsmall {
471
+ --size: 14px;
472
+ --thickness: 2px;
473
+ --seed-prefix-icon-size: var(--seed-dimension-x3_5);
474
+ --seed-suffix-icon-size: var(--seed-dimension-x3_5);
475
+ --seed-icon-size: var(--seed-dimension-x3_5);
476
+ }
477
+
478
+ .seed-action-button__text--size_xsmall {
479
+ --size: 14px;
480
+ --thickness: 2px;
481
+ --seed-prefix-icon-size: var(--seed-dimension-x3_5);
482
+ --seed-suffix-icon-size: var(--seed-dimension-x3_5);
483
+ --seed-icon-size: var(--seed-dimension-x3_5);
484
+ }
485
+
486
+ .seed-action-button--size_small {
487
+ height: var(--seed-dimension-x9);
488
+ border-radius: var(--seed-radius-r2);
489
+ --size: 14px;
490
+ --thickness: 2px;
491
+ --seed-prefix-icon-size: var(--seed-dimension-x3_5);
492
+ --seed-suffix-icon-size: var(--seed-dimension-x3_5);
493
+ --seed-icon-size: var(--seed-dimension-x4);
494
+ }
495
+
496
+ .seed-action-button__text--size_small {
497
+ --size: 14px;
498
+ --thickness: 2px;
499
+ --seed-prefix-icon-size: var(--seed-dimension-x3_5);
500
+ --seed-suffix-icon-size: var(--seed-dimension-x3_5);
501
+ --seed-icon-size: var(--seed-dimension-x4);
502
+ }
503
+
504
+ .seed-action-button__text--size_small {
505
+ --size: 14px;
506
+ --thickness: 2px;
507
+ --seed-prefix-icon-size: var(--seed-dimension-x3_5);
508
+ --seed-suffix-icon-size: var(--seed-dimension-x3_5);
509
+ --seed-icon-size: var(--seed-dimension-x4);
510
+ }
511
+
512
+ .seed-action-button--size_medium {
513
+ height: var(--seed-dimension-x10);
514
+ border-radius: var(--seed-radius-r2);
515
+ --size: 16px;
516
+ --thickness: 2px;
517
+ --seed-prefix-icon-size: var(--seed-dimension-x4);
518
+ --seed-suffix-icon-size: var(--seed-dimension-x4);
519
+ --seed-icon-size: 18px;
520
+ }
521
+
522
+ .seed-action-button__text--size_medium {
523
+ --size: 16px;
524
+ --thickness: 2px;
525
+ --seed-prefix-icon-size: var(--seed-dimension-x4);
526
+ --seed-suffix-icon-size: var(--seed-dimension-x4);
527
+ --seed-icon-size: 18px;
528
+ }
529
+
530
+ .seed-action-button__text--size_medium {
531
+ --size: 16px;
532
+ --thickness: 2px;
533
+ --seed-prefix-icon-size: var(--seed-dimension-x4);
534
+ --seed-suffix-icon-size: var(--seed-dimension-x4);
535
+ --seed-icon-size: 18px;
536
+ }
537
+
538
+ .seed-action-button--size_large {
539
+ height: var(--seed-dimension-x13);
540
+ border-radius: var(--seed-radius-r3);
541
+ --size: 18px;
542
+ --thickness: 2px;
543
+ --seed-prefix-icon-size: 22px;
544
+ --seed-suffix-icon-size: 22px;
545
+ --seed-icon-size: 22px;
546
+ }
547
+
548
+ .seed-action-button__text--size_large {
549
+ --size: 18px;
550
+ --thickness: 2px;
551
+ --seed-prefix-icon-size: 22px;
552
+ --seed-suffix-icon-size: 22px;
553
+ --seed-icon-size: 22px;
554
+ }
555
+
556
+ .seed-action-button__text--size_large {
557
+ --size: 18px;
558
+ --thickness: 2px;
559
+ --seed-prefix-icon-size: 22px;
560
+ --seed-suffix-icon-size: 22px;
561
+ --seed-icon-size: 22px;
562
+ }
563
+
564
+ .seed-action-button--size_xsmall-layout_withText {
565
+ gap: var(--seed-dimension-x1);
566
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
567
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
568
+ --seed-box-padding-top: var(--seed-dimension-x1_5);
569
+ --seed-box-padding-bottom: var(--seed-dimension-x1_5);
570
+ }
571
+
572
+ .seed-action-button__text--size_xsmall-layout_withText {
573
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
574
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
575
+ --seed-box-padding-top: var(--seed-dimension-x1_5);
576
+ --seed-box-padding-bottom: var(--seed-dimension-x1_5);
577
+ }
578
+
579
+ .seed-action-button__text--size_xsmall-layout_withText {
580
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
581
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
582
+ --seed-box-padding-top: var(--seed-dimension-x1_5);
583
+ --seed-box-padding-bottom: var(--seed-dimension-x1_5);
584
+ font-size: var(--seed-font-size-t3);
585
+ line-height: var(--seed-line-height-t3);
586
+ }
587
+
588
+ .seed-action-button--size_xsmall-layout_iconOnly {
589
+ min-width: var(--seed-dimension-x8);
590
+ --seed-box-padding-left: var(--seed-dimension-x1_5);
591
+ --seed-box-padding-right: var(--seed-dimension-x1_5);
592
+ --seed-box-padding-top: var(--seed-dimension-x1_5);
593
+ --seed-box-padding-bottom: var(--seed-dimension-x1_5);
594
+ }
595
+
596
+ .seed-action-button__text--size_xsmall-layout_iconOnly {
597
+ --seed-box-padding-left: var(--seed-dimension-x1_5);
598
+ --seed-box-padding-right: var(--seed-dimension-x1_5);
599
+ --seed-box-padding-top: var(--seed-dimension-x1_5);
600
+ --seed-box-padding-bottom: var(--seed-dimension-x1_5);
601
+ }
602
+
603
+ .seed-action-button__text--size_xsmall-layout_iconOnly {
604
+ --seed-box-padding-left: var(--seed-dimension-x1_5);
605
+ --seed-box-padding-right: var(--seed-dimension-x1_5);
606
+ --seed-box-padding-top: var(--seed-dimension-x1_5);
607
+ --seed-box-padding-bottom: var(--seed-dimension-x1_5);
608
+ }
609
+
610
+ .seed-action-button--size_small-layout_withText {
611
+ gap: var(--seed-dimension-x1);
612
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
613
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
614
+ --seed-box-padding-top: var(--seed-dimension-x2);
615
+ --seed-box-padding-bottom: var(--seed-dimension-x2);
616
+ }
617
+
618
+ .seed-action-button__text--size_small-layout_withText {
619
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
620
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
621
+ --seed-box-padding-top: var(--seed-dimension-x2);
622
+ --seed-box-padding-bottom: var(--seed-dimension-x2);
623
+ }
624
+
625
+ .seed-action-button__text--size_small-layout_withText {
626
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
627
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
628
+ --seed-box-padding-top: var(--seed-dimension-x2);
629
+ --seed-box-padding-bottom: var(--seed-dimension-x2);
630
+ font-size: var(--seed-font-size-t4);
631
+ line-height: var(--seed-line-height-t4);
632
+ }
633
+
634
+ .seed-action-button--size_small-layout_iconOnly {
635
+ min-width: var(--seed-dimension-x9);
636
+ --seed-box-padding-left: var(--seed-dimension-x2);
637
+ --seed-box-padding-right: var(--seed-dimension-x2);
638
+ --seed-box-padding-top: var(--seed-dimension-x2);
639
+ --seed-box-padding-bottom: var(--seed-dimension-x2);
640
+ }
641
+
642
+ .seed-action-button__text--size_small-layout_iconOnly {
643
+ --seed-box-padding-left: var(--seed-dimension-x2);
644
+ --seed-box-padding-right: var(--seed-dimension-x2);
645
+ --seed-box-padding-top: var(--seed-dimension-x2);
646
+ --seed-box-padding-bottom: var(--seed-dimension-x2);
647
+ }
648
+
649
+ .seed-action-button__text--size_small-layout_iconOnly {
650
+ --seed-box-padding-left: var(--seed-dimension-x2);
651
+ --seed-box-padding-right: var(--seed-dimension-x2);
652
+ --seed-box-padding-top: var(--seed-dimension-x2);
653
+ --seed-box-padding-bottom: var(--seed-dimension-x2);
654
+ }
655
+
656
+ .seed-action-button--size_medium-layout_withText {
657
+ gap: var(--seed-dimension-x1_5);
658
+ --seed-box-padding-left: var(--seed-dimension-x4);
659
+ --seed-box-padding-right: var(--seed-dimension-x4);
660
+ --seed-box-padding-top: var(--seed-dimension-x2_5);
661
+ --seed-box-padding-bottom: var(--seed-dimension-x2_5);
662
+ }
663
+
664
+ .seed-action-button__text--size_medium-layout_withText {
665
+ --seed-box-padding-left: var(--seed-dimension-x4);
666
+ --seed-box-padding-right: var(--seed-dimension-x4);
667
+ --seed-box-padding-top: var(--seed-dimension-x2_5);
668
+ --seed-box-padding-bottom: var(--seed-dimension-x2_5);
669
+ }
670
+
671
+ .seed-action-button__text--size_medium-layout_withText {
672
+ --seed-box-padding-left: var(--seed-dimension-x4);
673
+ --seed-box-padding-right: var(--seed-dimension-x4);
674
+ --seed-box-padding-top: var(--seed-dimension-x2_5);
675
+ --seed-box-padding-bottom: var(--seed-dimension-x2_5);
676
+ font-size: var(--seed-font-size-t4);
677
+ line-height: var(--seed-line-height-t4);
678
+ }
679
+
680
+ .seed-action-button--size_medium-layout_iconOnly {
681
+ min-width: var(--seed-dimension-x10);
682
+ --seed-box-padding-left: var(--seed-dimension-x2_5);
683
+ --seed-box-padding-right: var(--seed-dimension-x2_5);
684
+ --seed-box-padding-top: var(--seed-dimension-x2_5);
685
+ --seed-box-padding-bottom: var(--seed-dimension-x2_5);
686
+ }
687
+
688
+ .seed-action-button__text--size_medium-layout_iconOnly {
689
+ --seed-box-padding-left: var(--seed-dimension-x2_5);
690
+ --seed-box-padding-right: var(--seed-dimension-x2_5);
691
+ --seed-box-padding-top: var(--seed-dimension-x2_5);
692
+ --seed-box-padding-bottom: var(--seed-dimension-x2_5);
693
+ }
694
+
695
+ .seed-action-button__text--size_medium-layout_iconOnly {
696
+ --seed-box-padding-left: var(--seed-dimension-x2_5);
697
+ --seed-box-padding-right: var(--seed-dimension-x2_5);
698
+ --seed-box-padding-top: var(--seed-dimension-x2_5);
699
+ --seed-box-padding-bottom: var(--seed-dimension-x2_5);
700
+ }
701
+
702
+ .seed-action-button--size_large-layout_withText {
703
+ gap: var(--seed-dimension-x2);
704
+ --seed-box-padding-left: var(--seed-dimension-x5);
705
+ --seed-box-padding-right: var(--seed-dimension-x5);
706
+ --seed-box-padding-top: var(--seed-dimension-x3_5);
707
+ --seed-box-padding-bottom: var(--seed-dimension-x3_5);
708
+ }
709
+
710
+ .seed-action-button__text--size_large-layout_withText {
711
+ --seed-box-padding-left: var(--seed-dimension-x5);
712
+ --seed-box-padding-right: var(--seed-dimension-x5);
713
+ --seed-box-padding-top: var(--seed-dimension-x3_5);
714
+ --seed-box-padding-bottom: var(--seed-dimension-x3_5);
715
+ }
716
+
717
+ .seed-action-button__text--size_large-layout_withText {
718
+ --seed-box-padding-left: var(--seed-dimension-x5);
719
+ --seed-box-padding-right: var(--seed-dimension-x5);
720
+ --seed-box-padding-top: var(--seed-dimension-x3_5);
721
+ --seed-box-padding-bottom: var(--seed-dimension-x3_5);
722
+ font-size: var(--seed-font-size-t6);
723
+ line-height: var(--seed-line-height-t6);
724
+ }
725
+
726
+ .seed-action-button--size_large-layout_iconOnly {
727
+ min-width: var(--seed-dimension-x13);
728
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
729
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
730
+ --seed-box-padding-top: var(--seed-dimension-x3_5);
731
+ --seed-box-padding-bottom: var(--seed-dimension-x3_5);
732
+ }
733
+
734
+ .seed-action-button__text--size_large-layout_iconOnly {
735
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
736
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
737
+ --seed-box-padding-top: var(--seed-dimension-x3_5);
738
+ --seed-box-padding-bottom: var(--seed-dimension-x3_5);
739
+ }
740
+
741
+ .seed-action-button__text--size_large-layout_iconOnly {
742
+ --seed-box-padding-left: var(--seed-dimension-x3_5);
743
+ --seed-box-padding-right: var(--seed-dimension-x3_5);
744
+ --seed-box-padding-top: var(--seed-dimension-x3_5);
745
+ --seed-box-padding-bottom: var(--seed-dimension-x3_5);
746
+ }
747
+ }