@swisspost/design-system-styles 9.0.0-next.2 → 9.0.0-next.21

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 (321) hide show
  1. package/_svg-icon-map.scss +85 -23
  2. package/basics.css +1 -1
  3. package/basics.scss +2 -6
  4. package/cargo-external.css +7 -0
  5. package/cargo-external.scss +10 -0
  6. package/cargo-internal.css +7 -0
  7. package/cargo-internal.scss +10 -0
  8. package/cargo-tokens-external.css +1 -0
  9. package/cargo-tokens-external.scss +8 -0
  10. package/cargo-tokens-internal.css +1 -0
  11. package/cargo-tokens-internal.scss +8 -0
  12. package/components/_form-check.scss +166 -0
  13. package/components/_index.scss +21 -13
  14. package/components/appstore-badge.css +1 -0
  15. package/components/appstore-badge.scss +18 -0
  16. package/components/avatar.css +1 -0
  17. package/components/avatar.scss +41 -0
  18. package/components/badge.css +1 -1
  19. package/components/badge.scss +8 -2
  20. package/components/banner.css +1 -0
  21. package/components/banner.scss +105 -0
  22. package/components/blockquote.css +1 -0
  23. package/components/blockquote.scss +46 -0
  24. package/components/breadcrumb.css +1 -1
  25. package/components/breadcrumb.scss +4 -24
  26. package/components/breakpoints.css +1 -0
  27. package/components/breakpoints.scss +17 -0
  28. package/components/button-group.css +1 -1
  29. package/components/button-group.scss +7 -6
  30. package/components/button.css +1 -1
  31. package/components/button.scss +41 -228
  32. package/components/card-control.css +1 -1
  33. package/components/card-control.scss +33 -24
  34. package/components/card.css +1 -1
  35. package/components/card.scss +72 -68
  36. package/components/checkbox.css +1 -0
  37. package/components/checkbox.scss +127 -0
  38. package/components/chip.css +1 -1
  39. package/components/chip.scss +9 -8
  40. package/components/close.css +1 -1
  41. package/components/close.scss +0 -2
  42. package/components/datatable.css +1 -3
  43. package/components/datatable.scss +22 -17
  44. package/components/datepicker.css +1 -1
  45. package/components/datepicker.scss +6 -22
  46. package/components/dialog.css +1 -1
  47. package/components/dialog.scss +26 -38
  48. package/components/dropdown.css +1 -1
  49. package/components/dropdown.scss +9 -6
  50. package/components/fonts.css +1 -1
  51. package/components/fonts.scss +7 -45
  52. package/components/form-footer.css +1 -0
  53. package/components/form-footer.scss +18 -0
  54. package/components/form-hint.css +1 -0
  55. package/components/form-hint.scss +15 -0
  56. package/components/form-input.css +1 -0
  57. package/components/form-input.scss +301 -0
  58. package/components/form-range.css +1 -1
  59. package/components/form-range.scss +9 -9
  60. package/components/form-search-input.css +1 -0
  61. package/components/form-search-input.scss +97 -0
  62. package/components/form-select.css +1 -1
  63. package/components/form-select.scss +266 -55
  64. package/components/form-textarea.css +1 -1
  65. package/components/form-textarea.scss +172 -9
  66. package/components/globals/_index.scss +1 -0
  67. package/components/globals/post-footer.css +1 -0
  68. package/components/globals/post-footer.scss +113 -0
  69. package/components/header/_mixins.scss +48 -0
  70. package/components/header/index.css +1 -0
  71. package/components/header/index.scss +131 -0
  72. package/components/icon-button.css +1 -0
  73. package/components/icon-button.scss +19 -0
  74. package/components/icon-close-button.css +1 -0
  75. package/components/icon-close-button.scss +29 -0
  76. package/components/intranet-header/_icon.scss +1 -1
  77. package/components/intranet-header/_index.scss +0 -2
  78. package/components/intranet-header/_language-chooser.scss +3 -2
  79. package/components/intranet-header/_nav-overflow.scss +2 -2
  80. package/components/intranet-header/_scaffolding.scss +1 -1
  81. package/components/intranet-header/_searchbox.scss +1 -1
  82. package/components/intranet-header/_sidebar.scss +11 -11
  83. package/components/intranet-header/_top-navigation.scss +1 -1
  84. package/components/list-check.css +1 -0
  85. package/components/list-check.scss +79 -0
  86. package/components/list-group.css +1 -1
  87. package/components/list-group.scss +72 -127
  88. package/components/modal.css +2 -2
  89. package/components/modal.scss +2 -4
  90. package/components/offcanvas.css +1 -1
  91. package/components/offcanvas.scss +0 -2
  92. package/components/pagination.css +1 -1
  93. package/components/pagination.scss +10 -9
  94. package/components/popover.css +1 -1
  95. package/components/popover.scss +0 -2
  96. package/components/product-card.css +1 -1
  97. package/components/product-card.scss +11 -5
  98. package/components/progress.scss +0 -2
  99. package/components/radio-button.css +1 -0
  100. package/components/radio-button.scss +125 -0
  101. package/components/segmented-button.css +3 -0
  102. package/components/segmented-button.scss +207 -0
  103. package/components/skiplinks.css +1 -0
  104. package/components/skiplinks.scss +20 -0
  105. package/components/spinner.scss +0 -1
  106. package/components/stepper.css +1 -1
  107. package/components/stepper.scss +40 -33
  108. package/components/subnavigation.css +1 -1
  109. package/components/subnavigation.scss +17 -14
  110. package/components/switch.css +1 -0
  111. package/components/switch.scss +212 -0
  112. package/components/tables.css +1 -1
  113. package/components/tables.scss +0 -1
  114. package/components/tabs/_tab-title.scss +16 -55
  115. package/components/tabs/_tabs-wrapper.scss +3 -13
  116. package/components/tabs/index.css +1 -1
  117. package/components/tabs/index.scss +0 -2
  118. package/components/tag.css +1 -1
  119. package/components/tag.scss +1 -2
  120. package/components/teaser.css +1 -0
  121. package/components/teaser.scss +83 -0
  122. package/components/text-highlight.css +1 -1
  123. package/components/timepicker.css +1 -1
  124. package/components/timepicker.scss +13 -16
  125. package/components/toast.css +1 -1
  126. package/components/toast.scss +19 -16
  127. package/components/tooltip.css +1 -1
  128. package/components/tooltip.scss +0 -2
  129. package/components/transitions.scss +0 -2
  130. package/components/validation.css +1 -0
  131. package/components/validation.scss +120 -0
  132. package/elements/_index.scss +7 -1
  133. package/elements/anchor.css +1 -0
  134. package/elements/anchor.scss +33 -0
  135. package/elements/body.css +1 -1
  136. package/elements/body.scss +5 -1
  137. package/elements/fieldset-legend.css +1 -1
  138. package/elements/fieldset-legend.scss +7 -3
  139. package/elements/heading.css +1 -1
  140. package/elements/heading.scss +10 -12
  141. package/elements/list-bullet.css +1 -0
  142. package/elements/list-bullet.scss +43 -0
  143. package/elements/list-description.css +1 -0
  144. package/elements/list-description.scss +5 -0
  145. package/elements/list-number.css +1 -0
  146. package/elements/list-number.scss +33 -0
  147. package/elements/paragraph.css +1 -0
  148. package/elements/paragraph.scss +17 -0
  149. package/elements/reset.css +1 -1
  150. package/elements/reset.scss +16 -7
  151. package/elements.css +1 -0
  152. package/elements.scss +1 -0
  153. package/fonts.css +1 -1
  154. package/functions/_breakpoint.scss +26 -0
  155. package/functions/_forms.scss +46 -3
  156. package/functions/_icons.scss +2 -14
  157. package/helpers/_index.scss +4 -0
  158. package/helpers/clearfix.css +1 -0
  159. package/helpers/clearfix.scss +5 -0
  160. package/helpers/focus-ring.css +1 -0
  161. package/helpers/focus-ring.scss +5 -0
  162. package/helpers/text-truncation.css +1 -0
  163. package/helpers/text-truncation.scss +5 -0
  164. package/helpers/visually-hidden.css +1 -0
  165. package/helpers/visually-hidden.scss +5 -0
  166. package/index.css +3 -3
  167. package/index.scss +2 -5
  168. package/intranet.css +3 -3
  169. package/intranet.scss +2 -2
  170. package/layout/_containers.scss +32 -0
  171. package/layout/_section.scss +133 -0
  172. package/layout/grid/_index.scss +11 -0
  173. package/layout/grid/_mixins.scss +104 -0
  174. package/layout/grid/_variables.scss +2 -0
  175. package/layout/index.css +1 -0
  176. package/layout/index.scss +3 -0
  177. package/mixins/_button.scss +19 -15
  178. package/mixins/_form-checks.scss +1 -1
  179. package/mixins/_forms.scss +42 -33
  180. package/mixins/_icon-button.scss +27 -0
  181. package/mixins/_icons.scss +22 -32
  182. package/mixins/_index.scss +3 -2
  183. package/mixins/_layout.scss +26 -0
  184. package/mixins/_list.scss +112 -0
  185. package/mixins/_media.scss +58 -2
  186. package/mixins/_notification.scss +59 -53
  187. package/mixins/_utilities.scss +46 -25
  188. package/package.json +16 -16
  189. package/palettes/_mixins.scss +74 -0
  190. package/palettes/_utilities.scss +3 -0
  191. package/palettes/_variables.scss +2 -0
  192. package/palettes/cargo-palettes.css +1 -0
  193. package/palettes/cargo-palettes.scss +3 -0
  194. package/palettes/post-palettes.css +1 -0
  195. package/palettes/post-palettes.scss +3 -0
  196. package/placeholders/_button.scss +3 -6
  197. package/placeholders/_close.scss +2 -5
  198. package/placeholders/_schemes.scss +10 -0
  199. package/post-external.css +3 -3
  200. package/post-external.scss +7 -1
  201. package/post-internal.css +3 -3
  202. package/post-internal.scss +7 -1
  203. package/post-tokens-external.css +1 -1
  204. package/post-tokens-external.scss +1 -1
  205. package/post-tokens-internal.css +1 -1
  206. package/post-tokens-internal.scss +1 -1
  207. package/themes/bootstrap/_core.scss +0 -2
  208. package/themes/bootstrap/_forms.scss +0 -4
  209. package/themes/bootstrap/_overrides-variables.scss +0 -6
  210. package/themes/bootstrap/_utilities.scss +45 -1
  211. package/tokens/_cargo-theme.scss +8 -0
  212. package/tokens/_helpers.scss +1 -0
  213. package/tokens/_palettes.scss +9 -0
  214. package/tokens/_schemes.scss +11 -0
  215. package/tokens/_utilities_formatted.scss +1 -0
  216. package/tokens/temp/_channel.scss +4 -3
  217. package/tokens/temp/_components.scss +594 -503
  218. package/tokens/temp/_core.scss +49 -37
  219. package/tokens/temp/_device.scss +210 -239
  220. package/tokens/temp/_elements.scss +11 -11
  221. package/tokens/temp/_helpers.scss +13 -0
  222. package/tokens/temp/_index.scss +6 -4
  223. package/tokens/temp/_palettes.scss +19 -0
  224. package/tokens/temp/_scheme.scss +334 -0
  225. package/tokens/temp/_theme.scss +28 -9
  226. package/tokens/temp/_utilities-formatted.scss +128 -0
  227. package/tokens/temp/_utilities.scss +34 -58
  228. package/tokens/temp/palettes/_cargo-dark.scss +19 -0
  229. package/tokens/temp/palettes/_cargo-light.scss +19 -0
  230. package/tokens/temp/palettes/_post-dark.scss +19 -0
  231. package/tokens/temp/palettes/_post-light.scss +19 -0
  232. package/utilities/_not-defined.scss +44 -0
  233. package/utilities/_variables.scss +304 -22
  234. package/utilities/index.css +1 -0
  235. package/utilities/{_index.scss → index.scss} +1 -2
  236. package/variables/_animation.scss +10 -6
  237. package/variables/_breakpoints.scss +9 -5
  238. package/variables/_color.scss +0 -61
  239. package/variables/_commons.scss +1 -0
  240. package/variables/_elevation.scss +16 -22
  241. package/variables/_grid.scss +2 -12
  242. package/variables/_icons.scss +19 -696
  243. package/variables/_index.scss +1 -1
  244. package/variables/_sizing.scss +17 -0
  245. package/variables/_spacing.scss +0 -152
  246. package/variables/_type.scss +17 -27
  247. package/variables/components/_accordion.scss +0 -47
  248. package/variables/components/_badge.scss +9 -5
  249. package/variables/components/_button.scss +61 -113
  250. package/variables/components/_card.scss +7 -4
  251. package/variables/components/_chip.scss +13 -7
  252. package/variables/components/_close.scss +14 -8
  253. package/variables/components/_code.scss +1 -1
  254. package/variables/components/_datatable.scss +12 -8
  255. package/variables/components/_dropdowns.scss +1 -1
  256. package/variables/components/_form-check.scss +9 -46
  257. package/variables/components/_forms.scss +8 -101
  258. package/variables/components/_index.scss +0 -5
  259. package/variables/components/_modal.scss +17 -12
  260. package/variables/components/_nav.scss +3 -3
  261. package/variables/components/_navbar.scss +7 -4
  262. package/variables/components/_notification.scss +48 -37
  263. package/variables/components/_pagination.scss +14 -6
  264. package/variables/components/_spinners.scss +7 -2
  265. package/variables/components/_stepper.scss +15 -10
  266. package/variables/components/_subnavigation.scss +11 -9
  267. package/variables/components/_tables.scss +11 -6
  268. package/variables/components/_tag.scss +10 -7
  269. package/components/accordion.css +0 -1
  270. package/components/accordion.scss +0 -100
  271. package/components/alert.css +0 -1
  272. package/components/alert.scss +0 -137
  273. package/components/carousel.css +0 -1
  274. package/components/carousel.scss +0 -178
  275. package/components/elevation.css +0 -1
  276. package/components/elevation.scss +0 -8
  277. package/components/floating-label.css +0 -1
  278. package/components/floating-label.scss +0 -353
  279. package/components/form-check.css +0 -1
  280. package/components/form-check.scss +0 -297
  281. package/components/form-validation.css +0 -1
  282. package/components/form-validation.scss +0 -148
  283. package/components/forms.css +0 -1
  284. package/components/forms.scss +0 -215
  285. package/components/grid.css +0 -1
  286. package/components/grid.scss +0 -170
  287. package/components/icons.css +0 -1
  288. package/components/icons.scss +0 -60
  289. package/components/sizing.css +0 -1
  290. package/components/sizing.scss +0 -85
  291. package/components/topic-teaser.css +0 -1
  292. package/components/topic-teaser.scss +0 -196
  293. package/layouts/portal/_grid.scss +0 -85
  294. package/layouts/portal/_index.scss +0 -2
  295. package/layouts/portal/_subnavigation.scss +0 -5
  296. package/layouts/portal/_variables.scss +0 -8
  297. package/mixins/_accordion.scss +0 -16
  298. package/mixins/_elevation.scss +0 -6
  299. package/mixins/_focus.scss +0 -9
  300. package/mixins/_form-validation.scss +0 -5
  301. package/mixins/_size.scss +0 -65
  302. package/placeholders/_modes.scss +0 -10
  303. package/themes/bootstrap/_carousel.scss +0 -2
  304. package/themes/bootstrap/_containers.scss +0 -2
  305. package/themes/bootstrap/_grid.scss +0 -2
  306. package/themes/bootstrap/_overrides-mixins.scss +0 -33
  307. package/themes/bootstrap/forms/_floating-labels.scss +0 -2
  308. package/themes/bootstrap/forms/_form-control.scss +0 -2
  309. package/themes/bootstrap/forms/_form-select.scss +0 -2
  310. package/themes/bootstrap/forms/_form-text.scss +0 -2
  311. package/tokens/_modes.scss +0 -11
  312. package/tokens/temp/_mode.scss +0 -299
  313. package/utilities/_functions.scss +0 -35
  314. package/utilities/temp/_legacy.scss +0 -95
  315. package/variables/_options.scss +0 -5
  316. package/variables/components/_carousel.scss +0 -27
  317. package/variables/components/_figures.scss +0 -6
  318. package/variables/components/_form-select.scss +0 -13
  319. package/variables/components/_form-validation.scss +0 -38
  320. package/variables/components/_list-group.scss +0 -29
  321. package/variables/components/_topic-teaser.scss +0 -32
package/tokens/temp/_components.scss CHANGED
@@ -1,21 +1,64 @@
1
- // Do not edit manually!
2
- // This file was generated on:
3
- // Mon, 14 Oct 2024 18:07:38 GMT by the @swisspost/design-system-tokens package build command
1
+
2
+ // Do not edit manually
3
+ // This file was generated by the swisspost/design-system-tokens package
4
+ // Mon, 24 Feb 2025 16:19:02 GMT
5
+
6
+ $post-accordion: (
7
+ post-accordion-header-padding-block-closed: var(--post-device-spacing-padding-19),
8
+ post-accordion-header-padding-block-open: var(--post-device-spacing-padding-19),
9
+ post-accordion-header-padding-inline: var(--post-device-spacing-padding-5),
10
+ post-accordion-header-content-gap-inline: var(--post-device-spacing-gap-7),
11
+ post-accordion-header-logo-size: var(--post-device-sizing-logo-1),
12
+ post-accordion-header-font-size: var(--post-device-font-size-5),
13
+ post-accordion-header-border-open: var(--post-core-color-colorless),
14
+ post-accordion-border-bottom-style: var(--post-core-border-style-solid),
15
+ post-accordion-border-bottom-width: var(--post-device-border-width-default),
16
+ post-accordion-border-top-style: var(--post-core-border-style-solid),
17
+ post-accordion-group-border-top-width: var(--post-device-border-width-default),
18
+ post-accordion-content-padding-block-start: var(--post-device-spacing-padding-15),
19
+ post-accordion-content-padding-block-end: var(--post-device-spacing-padding-block-25),
20
+ post-accordion-content-padding-inline: var(--post-device-spacing-padding-5),
21
+ post-accordion-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
22
+ post-accordion-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
23
+ post-accordion-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
24
+ post-accordion-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
25
+ post-accordion-icon-size: var(--post-core-dimension-24),
26
+ );
4
27
 
5
28
  $post-app-store-badge: (
6
29
  post-app-store-google-width: var(--post-device-sizing-interactive-button-appstore-width-google),
7
30
  post-app-store-apple-width: var(--post-device-sizing-interactive-button-appstore-width-apple),
8
31
  post-app-store-height: var(--post-device-sizing-interactive-button-height-5),
9
- post-app-store-focus-outline-offset: var(--post-device-spacing-padding-2),
10
- post-app-store-focus-outline-color: var(--post-mode-color-interactive-focus-stroke),
11
- post-app-store-focus-outline-width: var(--post-device-border-width-focus),
12
32
  post-app-store-border-radius: var(--post-device-border-radius-1),
13
33
  );
14
34
 
35
+ $post-assist: (
36
+ post-assist-gap: var(--post-device-spacing-gap-1),
37
+ post-assist-padding-block: var(--post-device-spacing-padding-block-5),
38
+ post-assist-padding-inline: var(--post-device-spacing-padding-2),
39
+ post-assist-font-size: var(--post-device-font-size-9),
40
+ post-assist-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
41
+ post-assist-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
42
+ post-hint-spacing-block: var(--post-core-dimension-6),
43
+ );
44
+
45
+ $post-avatar: (
46
+ post-avatar-size: var(--post-device-sizing-interactive-icon-size3),
47
+ post-avatar-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg2),
48
+ post-avatar-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg3),
49
+ post-avatar-border-width: var(--post-device-border-width-default),
50
+ post-avatar-border-radius: var(--post-device-border-radius-round),
51
+ post-avatar-font-size: var(--post-device-font-size-8),
52
+ post-avatar-image-hover-opacity: var(--post-core-color-sandgrey-alpha-lightsand-50),
53
+ post-avatar-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
54
+ post-avatar-border-color: var(--post-scheme-color-interactive-primary-enabled-stroke3),
55
+ post-avatar-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg3),
56
+ );
57
+
15
58
  $post-badge: (
16
- post-badge-bg: var(--post-mode-color-notification-badge-bg),
17
- post-badge-fg: var(--post-mode-color-notification-badge-fg),
18
- post-badge-stroke: var(--post-mode-color-notification-badge-stroke),
59
+ post-badge-bg: var(--post-scheme-color-notification-badge-bg),
60
+ post-badge-fg: var(--post-scheme-color-notification-badge-fg),
61
+ post-badge-stroke: var(--post-scheme-color-notification-badge-stroke),
19
62
  post-badge-height-l: var(--post-device-sizing-notification-1),
20
63
  post-badge-height-m: var(--post-device-sizing-notification-2),
21
64
  post-badge-height-s: var(--post-device-sizing-notification-3),
@@ -24,97 +67,70 @@ $post-badge: (
24
67
  );
25
68
 
26
69
  $post-banner: (
27
- post-banner-spacing-padding-outer: var(--post-device-spacing-padding-10),
28
- post-banner-spacing-padding-action: var(--post-device-spacing-padding-block-10),
29
- post-banner-spacing-gap-outer: var(--post-device-spacing-gap-inline-6),
30
- post-banner-spacing-gap-inner: var(--post-device-spacing-gap-block-1),
31
- post-banner-spacing-gap-action: var(--post-device-spacing-gap-1),
32
- post-banner-sizing-icon: var(--post-device-sizing-notification-icon-2),
33
- post-banner-color-info-bg: var(--post-mode-color-interactive-notification-info-bg),
34
- post-banner-color-info-fg: var(--post-mode-color-interactive-notification-info-fg),
35
- post-banner-color-info-stroke: var(--post-mode-color-interactive-notification-info-stroke),
36
- post-banner-color-info-icon: var(--post-mode-color-interactive-notification-info-icon),
37
- post-banner-color-success-bg: var(--post-mode-color-interactive-notification-success-bg),
38
- post-banner-color-success-fg: var(--post-mode-color-interactive-notification-success-fg),
39
- post-banner-color-success-stroke: var(--post-mode-color-interactive-notification-success-stroke),
40
- post-banner-color-success-icon: var(--post-mode-color-interactive-notification-success-icon),
41
- post-banner-color-warning-bg: var(--post-mode-color-interactive-notification-warning-bg),
42
- post-banner-color-warning-fg: var(--post-mode-color-interactive-notification-warning-fg),
43
- post-banner-color-warning-stroke: var(--post-mode-color-interactive-notification-warning-stroke),
44
- post-banner-color-warning-icon: var(--post-mode-color-interactive-notification-warning-icon),
45
- post-banner-color-error-bg: var(--post-mode-color-interactive-notification-error-bg),
46
- post-banner-color-error-fg: var(--post-mode-color-interactive-notification-error-fg),
47
- post-banner-color-error-stroke: var(--post-mode-color-interactive-notification-error-stroke),
48
- post-banner-color-error-icon: var(--post-mode-color-interactive-notification-error-icon),
70
+ post-banner-padding: var(--post-device-spacing-padding-10),
71
+ post-banner-actions-margin-top: var(--post-device-spacing-padding-block-10),
72
+ post-banner-actions-gap: var(--post-device-spacing-gap-1),
73
+ post-banner-gap: var(--post-device-spacing-gap-inline-6),
74
+ post-banner-content-gap: var(--post-device-spacing-gap-block-1),
75
+ post-banner-icon-size: var(--post-device-sizing-notification-icon-2),
76
+ post-banner-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
77
+ post-banner-info-border-color: var(--post-scheme-color-interactive-notification-info-stroke),
78
+ post-banner-info-icon-color: var(--post-scheme-color-interactive-notification-info-icon),
79
+ post-banner-info-bg-scheme: var(--post-core-bg-scheme-light),
80
+ post-banner-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
81
+ post-banner-success-border-color: var(--post-scheme-color-interactive-notification-success-stroke),
82
+ post-banner-success-icon-color: var(--post-scheme-color-interactive-notification-success-icon),
83
+ post-banner-success-bg-scheme: var(--post-core-bg-scheme-light),
84
+ post-banner-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
85
+ post-banner-warning-border-color: var(--post-scheme-color-interactive-notification-warning-stroke),
86
+ post-banner-warning-icon-color: var(--post-scheme-color-interactive-notification-warning-icon),
87
+ post-banner-warning-bg-scheme: var(--post-core-bg-scheme-light),
88
+ post-banner-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
89
+ post-banner-error-border-color: var(--post-scheme-color-interactive-notification-error-stroke),
90
+ post-banner-error-icon-color: var(--post-scheme-color-interactive-notification-error-icon),
91
+ post-banner-error-bg-scheme: var(--post-core-bg-scheme-light),
92
+ post-banner-border-width: var(--post-device-border-width-default),
93
+ post-banner-border-radius: var(--post-device-border-radius-2),
94
+ post-banner-neutral-bg: var(--post-scheme-color-signal-neutral),
95
+ post-banner-neutral-border-color: var(--post-scheme-color-signal-neutral-dark),
96
+ post-banner-neutral-icon-color: var(--post-scheme-color-signal-neutral-dark),
97
+ post-banner-neutral-bg-scheme: var(--post-core-bg-scheme-light),
98
+ post-banner-border-style: var(--post-core-border-style-solid),
99
+ post-banner-elevation: var(--post-device-elevation-100),
100
+ );
101
+
102
+ $post-blockquote: (
103
+ post-blockquote-border-width-left: var(--post-device-border-width-quote),
104
+ post-blockquote-border-left-color: var(--post-scheme-color-surface-default-stroke),
105
+ post-blockquote-border-left-style: var(--post-core-border-style-solid),
106
+ post-blockquote-margin-block: var(--post-device-spacing-margin-5),
107
+ post-blockquote-margin-inline: var(--post-device-spacing-margin-6),
108
+ post-blockquote-padding-inline-start: var(--post-core-dimension-20),
109
+ post-blockquote-padding-inline-end: var(--post-core-dimension-24),
110
+ post-blockquote-gap-inline: var(--post-core-dimension-16),
111
+ post-blockquote-font-weight: var(--post-device-font-weight-bold),
112
+ post-blockquote-font-size: var(--post-device-font-size-5),
49
113
  );
50
114
 
51
115
  $post-breadcrumb: (
52
- post-breadcrumb-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
53
- post-breadcrumb-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
54
- post-breadcrumb-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
55
- post-breadcrumb-focus-outline: var(--post-mode-color-interactive-focus-stroke),
56
- post-breadcrumb-focus-outline-width: var(--post-device-border-width-focus),
57
- post-breadcrumb-focus-padding-outline: var(--post-device-spacing-padding-2),
58
- post-breadcrumb-focus-outline-radius: var(--post-device-border-radius-focus),
116
+ post-breadcrumb-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
117
+ post-breadcrumb-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
118
+ post-breadcrumb-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg1),
59
119
  post-breadcrumb-padding-block-text: var(--post-device-spacing-padding-block-7),
60
- post-breadcrumb-padding-block-icon: var(--post-device-spacing-padding-4),
61
- post-breadcrumb-padding-inline-icon: var(--post-device-spacing-padding-4),
120
+ post-breadcrumb-padding-block-icon-home: var(--post-device-spacing-padding-4),
121
+ post-breadcrumb-padding-block-icon-link: var(--post-core-dimension-4),
122
+ post-breadcrumb-padding-inline-icon-home: var(--post-device-spacing-padding-4),
123
+ post-breadcrumb-padding-inline-icon-link: var(--post-core-dimension-4),
62
124
  post-breadcrumb-gap-inline-outer: var(--post-device-spacing-gap-inline-4),
63
125
  post-breadcrumb-gap-inline-inner: var(--post-device-spacing-gap-inline-5),
64
126
  post-breadcrumb-selected-font-weight: var(--post-device-font-weight-bold),
65
127
  post-breadcrumb-link-enabled-text-decoration: var(--post-core-text-decoration-none),
128
+ post-breadcrumb-link-hover-text-decoration: var(--post-core-text-decoration-underline),
66
129
  post-breadcrumb-link-selected-text-decoration: var(--post-core-text-decoration-none),
67
- );
68
-
69
- $post-button_old: (
70
- post-button-color-primary-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
71
- post-button-color-primary-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
72
- post-button-color-primary-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
73
- post-button-color-primary-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
74
- post-button-color-primary-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg),
75
- post-button-color-primary-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
76
- post-button-color-primary-selected-bg: var(--post-mode-color-interactive-primary-selected-bg1),
77
- post-button-color-primary-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
78
- post-button-color-primary-helptext-fg: var(--post-mode-color-interactive-primary-enabled-fg2),
79
- post-button-color-primary-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
80
- post-button-color-primary-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
81
- post-button-color-primary-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke),
82
- post-button-color-primary-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke1),
83
- post-button-color-signal-error: var(--post-mode-color-signal-error-dark),
84
- post-button-color-signal-success: var(--post-mode-color-signal-success-dark),
85
- post-button-color-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
86
- post-button-color-focus-stroke-inverted: var(--post-mode-color-interactive-focus-stroke-inverted),
87
- post-button-spacing-gap-block-1: var(--post-device-spacing-gap-4),
88
- post-button-spacing-gap-block-2: var(--post-device-spacing-gap-block-2),
89
- post-button-spacing-gap-inline-1: var(--post-device-spacing-gap-inline-1),
90
- post-button-spacing-gap-inline-switch: var(--post-device-spacing-gap-inline-3),
91
- post-button-spacing-padding-block-icon-inner: var(--post-device-spacing-padding-1),
92
- post-button-spacing-padding-inline-icon-inner: var(--post-device-spacing-padding-1),
93
- post-button-sizing-icon-width-inner: var(--post-device-sizing-interactive-icon-width),
94
- post-button-sizing-icon-height-inner: var(--post-device-sizing-interactive-icon-height),
95
- post-button-segmented-sizing-height: var(--post-device-sizing-interactive-button-height-1),
96
- post-button-segmented-spacing-padding-inline: var(--post-device-spacing-padding-11),
97
- post-button-small-sizing-height: var(--post-device-sizing-interactive-button-height-1),
98
- post-button-small-spacing-gap: var(--post-device-spacing-gap-inline-9),
99
- post-button-small-spacing-padding: var(--post-device-spacing-padding-14),
100
- post-button-large-sizing-height: var(--post-device-sizing-interactive-button-height-2),
101
- post-button-large-spacing-gap: var(--post-device-spacing-gap-inline-8),
102
- post-button-large-spacing-padding: var(--post-device-spacing-padding-13),
103
- post-button-appstore-sizing-height: var(--post-device-sizing-interactive-button-height-2),
104
- post-button-appstore-sizing-width-google: var(--post-device-sizing-interactive-button-appstore-width-google),
105
- post-button-appstore-sizing-width-apple: var(--post-device-sizing-interactive-button-appstore-width-apple),
106
- post-button-socialmedia-sizing-large: var(--post-device-sizing-interactive-button-height-1),
107
- post-button-socialmedia-sizing-small: var(--post-device-sizing-interactive-button-height-3),
108
- post-button-socialmedia-sizing-icon-large: var(--post-device-sizing-interactive-button-icon-1),
109
- post-button-socialmedia-sizing-icon-small: var(--post-device-sizing-interactive-button-icon-2),
110
- post-button-border-radius-round: var(--post-device-border-radius-round),
130
+ post-breadcrumb-icon-size: var(--post-core-dimension-24),
111
131
  );
112
132
 
113
133
  $post-button: (
114
- post-button-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
115
- post-button-focus-stroke-inverted: var(--post-mode-color-interactive-focus-stroke-inverted),
116
- post-button-focus-border-width: var(--post-device-border-width-focus),
117
- post-button-focus-outline-offset: var(--post-device-spacing-padding-2),
118
134
  post-button-gap-block-1: var(--post-device-spacing-gap-4),
119
135
  post-button-gap-block-2: var(--post-device-spacing-gap-block-2),
120
136
  post-button-gap-inline-switch: var(--post-device-spacing-gap-inline-3),
@@ -124,60 +140,60 @@ $post-button: (
124
140
  post-button-large-icon: var(--post-device-sizing-interactive-button-icon-3),
125
141
  post-button-padding-block-icon-inner: var(--post-device-spacing-padding-1),
126
142
  post-button-padding-inline-icon-inner: var(--post-device-spacing-padding-1),
127
- post-button-primary-enabled-fg: var(--post-mode-color-interactive-button-primary-enabled-fg),
128
- post-button-primary-enabled-bg: var(--post-mode-color-interactive-button-primary-enabled-bg),
129
- post-button-primary-enabled-stroke: var(--post-mode-color-interactive-button-primary-enabled-stroke),
130
- post-button-primary-hover-fg: var(--post-mode-color-interactive-button-primary-hover-fg),
131
- post-button-primary-hover-bg: var(--post-mode-color-interactive-button-primary-hover-bg),
132
- post-button-primary-hover-stroke: var(--post-mode-color-interactive-button-primary-hover-stroke),
133
- post-button-primary-disabled-fg: var(--post-mode-color-interactive-button-primary-disabled-fg),
134
- post-button-primary-disabled-bg: var(--post-mode-color-interactive-button-primary-disabled-bg),
135
- post-button-primary-disabled-stroke: var(--post-mode-color-interactive-button-primary-disabled-stroke),
136
- post-button-primary-inverted-enabled-fg: var(--post-mode-color-interactive-button-primary-enabled-fg-inverted),
137
- post-button-primary-inverted-enabled-bg: var(--post-mode-color-interactive-button-primary-enabled-bg-inverted),
138
- post-button-primary-inverted-enabled-stroke: var(--post-mode-color-interactive-button-primary-enabled-stroke-inverted),
139
- post-button-primary-inverted-hover-fg: var(--post-mode-color-interactive-button-primary-hover-fg-inverted),
140
- post-button-primary-inverted-hover-bg: var(--post-mode-color-interactive-button-primary-hover-bg-inverted),
141
- post-button-primary-inverted-hover-stroke: var(--post-mode-color-interactive-button-primary-hover-stroke-inverted),
142
- post-button-primary-inverted-disabled-fg: var(--post-mode-color-interactive-button-primary-disabled-fg-inverted),
143
- post-button-primary-inverted-disabled-bg: var(--post-mode-color-interactive-button-primary-disabled-bg-inverted),
144
- post-button-primary-inverted-disabled-stroke: var(--post-mode-color-interactive-button-primary-disabled-stroke-inverted),
145
- post-button-secondary-enabled-fg: var(--post-mode-color-interactive-button-secondary-enabled-fg),
146
- post-button-secondary-enabled-bg: var(--post-mode-color-interactive-button-secondary-enabled-bg),
147
- post-button-secondary-enabled-stroke: var(--post-mode-color-interactive-button-secondary-enabled-stroke),
148
- post-button-secondary-hover-fg: var(--post-mode-color-interactive-button-secondary-hover-fg),
149
- post-button-secondary-hover-bg: var(--post-mode-color-interactive-button-secondary-hover-bg),
150
- post-button-secondary-hover-stroke: var(--post-mode-color-interactive-button-secondary-hover-stroke),
151
- post-button-secondary-disabled-fg: var(--post-mode-color-interactive-button-secondary-disabled-fg),
152
- post-button-secondary-disabled-bg: var(--post-mode-color-interactive-button-secondary-disabled-bg),
153
- post-button-secondary-disabled-stroke: var(--post-mode-color-interactive-button-secondary-disabled-stroke),
154
- post-button-secondary-inverted-enabled-fg: var(--post-mode-color-interactive-button-secondary-enabled-fg-inverted),
155
- post-button-secondary-inverted-enabled-bg: var(--post-mode-color-interactive-button-secondary-enabled-bg-inverted),
156
- post-button-secondary-inverted-enabled-stroke: var(--post-mode-color-interactive-button-secondary-enabled-stroke-inverted),
157
- post-button-secondary-inverted-hover-fg: var(--post-mode-color-interactive-button-secondary-hover-fg-inverted),
158
- post-button-secondary-inverted-hover-bg: var(--post-mode-color-interactive-button-secondary-hover-bg-inverted),
159
- post-button-secondary-inverted-hover-stroke: var(--post-mode-color-interactive-button-secondary-hover-stroke-inverted),
160
- post-button-secondary-inverted-disabled-fg: var(--post-mode-color-interactive-button-secondary-disabled-fg-inverted),
161
- post-button-secondary-inverted-disabled-bg: var(--post-mode-color-interactive-button-secondary-disabled-bg-inverted),
162
- post-button-secondary-inverted-disabled-stroke: var(--post-mode-color-interactive-button-secondary-disabled-stroke-inverted),
163
- post-button-tertiary-enabled-fg: var(--post-mode-color-interactive-button-tertiary-enabled-fg),
164
- post-button-tertiary-enabled-bg: var(--post-mode-color-interactive-button-tertiary-enabled-bg),
165
- post-button-tertiary-enabled-stroke: var(--post-mode-color-interactive-button-tertiary-enabled-stroke),
166
- post-button-tertiary-hover-fg: var(--post-mode-color-interactive-button-tertiary-hover-fg),
167
- post-button-tertiary-hover-bg: var(--post-mode-color-interactive-button-tertiary-hover-bg),
168
- post-button-tertiary-hover-stroke: var(--post-mode-color-interactive-button-tertiary-hover-stroke),
169
- post-button-tertiary-disabled-fg: var(--post-mode-color-interactive-button-tertiary-disabled-fg),
170
- post-button-tertiary-disabled-bg: var(--post-mode-color-interactive-button-tertiary-disabled-bg),
171
- post-button-tertiary-disabled-stroke: var(--post-mode-color-interactive-button-tertiary-disabled-stroke),
172
- post-button-tertiary-inverted-enabled-fg: var(--post-mode-color-interactive-button-tertiary-enabled-fg-inverted),
173
- post-button-tertiary-inverted-enabled-bg: var(--post-mode-color-interactive-button-tertiary-enabled-bg-inverted),
174
- post-button-tertiary-inverted-enabled-stroke: var(--post-mode-color-interactive-button-tertiary-enabled-stroke-inverted),
175
- post-button-tertiary-inverted-hover-fg: var(--post-mode-color-interactive-button-tertiary-hover-fg-inverted),
176
- post-button-tertiary-inverted-hover-bg: var(--post-mode-color-interactive-button-tertiary-hover-bg-inverted),
177
- post-button-tertiary-inverted-hover-stroke: var(--post-mode-color-interactive-button-tertiary-hover-stroke-inverted),
178
- post-button-tertiary-inverted-disabled-fg: var(--post-mode-color-interactive-button-tertiary-disabled-fg-inverted),
179
- post-button-tertiary-inverted-disabled-bg: var(--post-mode-color-interactive-button-tertiary-disabled-bg-inverted),
180
- post-button-tertiary-inverted-disabled-stroke: var(--post-mode-color-interactive-button-tertiary-disabled-stroke-inverted),
143
+ post-button-primary-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg),
144
+ post-button-primary-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg),
145
+ post-button-primary-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke),
146
+ post-button-primary-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg),
147
+ post-button-primary-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg),
148
+ post-button-primary-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke),
149
+ post-button-primary-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg),
150
+ post-button-primary-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg),
151
+ post-button-primary-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke),
152
+ post-button-primary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg-inverted),
153
+ post-button-primary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg-inverted),
154
+ post-button-primary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke-inverted),
155
+ post-button-primary-inverted-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg-inverted),
156
+ post-button-primary-inverted-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg-inverted),
157
+ post-button-primary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke-inverted),
158
+ post-button-primary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg-inverted),
159
+ post-button-primary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg-inverted),
160
+ post-button-primary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke-inverted),
161
+ post-button-secondary-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg),
162
+ post-button-secondary-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg),
163
+ post-button-secondary-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke),
164
+ post-button-secondary-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg),
165
+ post-button-secondary-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg),
166
+ post-button-secondary-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke),
167
+ post-button-secondary-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg),
168
+ post-button-secondary-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg),
169
+ post-button-secondary-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke),
170
+ post-button-secondary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg-inverted),
171
+ post-button-secondary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg-inverted),
172
+ post-button-secondary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke-inverted),
173
+ post-button-secondary-inverted-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg-inverted),
174
+ post-button-secondary-inverted-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg-inverted),
175
+ post-button-secondary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke-inverted),
176
+ post-button-secondary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg-inverted),
177
+ post-button-secondary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg-inverted),
178
+ post-button-secondary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke-inverted),
179
+ post-button-tertiary-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg),
180
+ post-button-tertiary-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg),
181
+ post-button-tertiary-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke),
182
+ post-button-tertiary-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg),
183
+ post-button-tertiary-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg),
184
+ post-button-tertiary-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke),
185
+ post-button-tertiary-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg),
186
+ post-button-tertiary-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg),
187
+ post-button-tertiary-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke),
188
+ post-button-tertiary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg-inverted),
189
+ post-button-tertiary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg-inverted),
190
+ post-button-tertiary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke-inverted),
191
+ post-button-tertiary-inverted-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg-inverted),
192
+ post-button-tertiary-inverted-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg-inverted),
193
+ post-button-tertiary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke-inverted),
194
+ post-button-tertiary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg-inverted),
195
+ post-button-tertiary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg-inverted),
196
+ post-button-tertiary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke-inverted),
181
197
  post-button-medium-height: var(--post-device-sizing-interactive-button-height-1),
182
198
  post-button-medium-gap-inline: var(--post-device-spacing-gap-inline-10),
183
199
  post-button-medium-padding-inline: var(--post-device-spacing-padding-inline-6),
@@ -191,34 +207,34 @@ $post-button: (
191
207
  post-button-label-font-weight: var(--post-device-font-weight-bold),
192
208
  post-button-elevation: var(--post-device-elevation-100),
193
209
  post-button-border-style-disabled: var(--post-core-border-style-dash),
194
- post-button-test-cargo-bg: var(--post-theme-color-interactive-button-primary-enabled-bg),
195
- post-button-test-cargo-fg: var(--post-theme-color-interactive-button-primary-enabled-fg),
210
+ );
211
+
212
+ $post-cards: (
213
+ post-card-border-radius: var(--post-device-border-radius-2),
214
+ post-card-interactive-elevation: var(--post-device-elevation-200),
215
+ post-card-non-interactive-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke4),
216
+ post-card-enabled-bg1: var(--post-theme-color-palettes-alternate-bg),
217
+ post-card-enabled-bg2: var(--post-theme-color-palettes-default-bg),
218
+ post-card-hover-bg: var(--post-scheme-color-interactive-card-hover-bg),
219
+ post-card-hover-fg: var(--post-scheme-color-interactive-card-hover-fg),
196
220
  );
197
221
 
198
222
  $post-checkbox: (
199
- post-checkbox-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
200
- post-checkbox-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
201
- post-checkbox-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
202
- post-checkbox-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
203
- post-checkbox-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg),
204
- post-checkbox-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
205
- post-checkbox-selected-bg: var(--post-mode-color-interactive-primary-selected-bg1),
206
- post-checkbox-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
207
- post-checkbox-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
208
- post-checkbox-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
209
- post-checkbox-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke1),
210
- post-checkbox-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke),
211
- post-checkbox-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
212
- post-checkbox-focus-border-width: var(--post-device-border-width-focus),
213
- post-checkbox-focus-outline-offset: var(--post-device-spacing-padding-2),
214
- post-checkbox-focus-border-radius: var(--post-device-border-radius-focus),
215
- post-checkbox-focus-border-style: var(--post-core-border-style-solid),
223
+ post-checkbox-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg3),
224
+ post-checkbox-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
225
+ post-checkbox-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg3),
226
+ post-checkbox-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
227
+ post-checkbox-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg6),
228
+ post-checkbox-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg4),
229
+ post-checkbox-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
230
+ post-checkbox-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
231
+ post-checkbox-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke4),
216
232
  post-checkbox-gap-block-group: var(--post-device-spacing-gap-4),
217
233
  post-checkbox-gap-inline-text-start: var(--post-device-spacing-gap-inline-12),
218
- post-checkbox-gap-inline-group: tbd,
219
234
  post-checkbox-icon-border-width: var(--post-device-border-width-default),
220
235
  post-checkbox-icon-size: var(--post-device-sizing-interactive-icon-size),
221
- post-checkbox-icon-padding-container: var(--post-device-spacing-padding-1),
236
+ post-checkbox-icon-padding-inner: var(--post-device-spacing-padding-1),
237
+ post-checkbox-icon-padding-container: var(--post-device-spacing-padding-block-18),
222
238
  post-checkbox-padding-block-single: var(--post-device-spacing-padding-block-19),
223
239
  post-checkbox-padding-block-group: var(--post-device-spacing-padding-block-8),
224
240
  post-checkbox-border-radius: var(--post-core-dimension-2),
@@ -228,12 +244,36 @@ $post-checkbox: (
228
244
  post-checkbox-label-padding-block: var(--post-device-spacing-padding-block-20),
229
245
  );
230
246
 
247
+ $post-close: (
248
+ post-close-size: var(--post-device-sizing-notification-1),
249
+ post-close-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg),
250
+ post-close-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg),
251
+ post-close-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg),
252
+ post-close-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg),
253
+ post-close-border-radius: var(--post-device-border-radius-round),
254
+ post-close-icon-size: var(--post-device-sizing-interactive-icon-size4),
255
+ );
256
+
257
+ $post-container: (
258
+ post-grid-gutter-xl: var(--post-core-dimension-24),
259
+ post-grid-gutter-lg: var(--post-core-dimension-24),
260
+ post-grid-gutter-md: var(--post-core-dimension-16),
261
+ post-grid-gutter-sm: var(--post-core-dimension-16),
262
+ post-grid-gutter-xs: var(--post-core-dimension-16),
263
+ post-grid-padding-xl: var(--post-core-dimension-40),
264
+ post-grid-padding-lg: var(--post-core-dimension-40),
265
+ post-grid-padding-md: var(--post-core-dimension-40),
266
+ post-grid-padding-sm: var(--post-core-dimension-16),
267
+ post-grid-padding-xs: var(--post-core-dimension-16),
268
+ post-grid-max-width: var(--post-core-dimension-1280),
269
+ );
270
+
231
271
  $post-dropdown: (
232
272
  post-dropdown-multi-select-menu-category-title-padding-block-outer: var(--post-device-spacing-padding-block-14),
233
273
  post-dropdown-multi-select-menu-category-title-padding-block-inner: var(--post-device-spacing-padding-block-15),
234
274
  post-dropdown-multi-select-menu-category-title-padding-inline-inner: var(--post-device-spacing-padding-inline-3),
235
- post-dropdown-multi-select-menu-category-title-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
236
- post-dropdown-multi-select-menu-category-title-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
275
+ post-dropdown-multi-select-menu-category-title-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
276
+ post-dropdown-multi-select-menu-category-title-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
237
277
  post-dropdown-multi-select-menu-category-title-font-weight: var(--post-device-font-weight-bold),
238
278
  post-dropdown-multi-select-menu-list-item-padding-inline-start: var(--post-device-spacing-padding-5),
239
279
  post-dropdown-multi-select-menu-list-item-padding-inline-end: var(--post-device-spacing-padding-inline-4),
@@ -241,24 +281,39 @@ $post-dropdown: (
241
281
  post-dropdown-multi-select-menu-list-item-padding-block-end: var(--post-device-spacing-padding-block-17),
242
282
  post-dropdown-multi-select-menu-list-item-gap-inline-text-start: var(--post-device-spacing-gap-4),
243
283
  post-dropdown-multi-select-menu-list-item-border-width-bottom: var(--post-device-border-width-alternative2),
244
- post-dropdown-multi-select-menu-list-item-border-width-focus: var(--post-device-border-width-focus),
245
284
  post-dropdown-multi-select-menu-list-item-icon-spacing-height-outer: var(--post-device-sizing-icon-2),
246
- post-dropdown-multi-select-menu-list-item-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
247
- post-dropdown-multi-select-menu-list-item-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
248
- post-dropdown-multi-select-menu-list-item-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
249
- post-dropdown-multi-select-menu-list-item-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
250
- post-dropdown-multi-select-menu-list-item-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
251
- post-dropdown-multi-select-menu-list-item-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
252
- post-dropdown-multi-select-menu-list-item-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke3),
285
+ post-dropdown-multi-select-menu-list-item-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
286
+ post-dropdown-multi-select-menu-list-item-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
287
+ post-dropdown-multi-select-menu-list-item-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg1),
288
+ post-dropdown-multi-select-menu-list-item-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg),
289
+ post-dropdown-multi-select-menu-list-item-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
290
+ post-dropdown-multi-select-menu-list-item-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke3),
253
291
  post-dropdown-multi-select-menu-padding-block: var(--post-device-spacing-padding-block-8),
254
292
  post-dropdown-multi-select-menu-border-radius: var(--post-device-border-radius-1),
255
293
  post-dropdown-multi-select-menu-elevation: var(--post-device-elevation-300),
256
294
  );
257
295
 
296
+ $post-floating-button: (
297
+ post-floating-button-position-right: var(--post-device-position-1),
298
+ post-floating-button-position-top: var(--post-device-position-1),
299
+ post-floating-button-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg),
300
+ post-floating-button-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg),
301
+ post-floating-button-enabled-border: var(--post-scheme-color-interactive-button-secondary-enabled-stroke),
302
+ post-floating-button-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg),
303
+ post-floating-button-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg),
304
+ post-floating-button-hover-border: var(--post-scheme-color-interactive-button-secondary-hover-stroke),
305
+ post-floating-button-size-outer: var(--post-device-sizing-interactive-button-height-2),
306
+ post-floating-button-size-icon: var(--post-device-sizing-interactive-button-icon-3),
307
+ post-floating-button-border-width: var(--post-device-border-width-default),
308
+ post-floating-button-border-radius-round: var(--post-device-border-radius-round),
309
+ post-floating-button-elevation: var(--post-device-elevation-300),
310
+ post-floating-button-translate-y: var(--post-core-dimension-112),
311
+ );
312
+
258
313
  $post-form-footer: (
259
314
  post-form-footer-border-block-start-width: var(--post-device-border-width-default),
260
315
  post-form-footer-border-block-start-style: var(--post-core-border-style-solid),
261
- post-form-footer-border-start-color: var(--post-mode-color-surface-default-stroke),
316
+ post-form-footer-border-start-color: var(--post-scheme-color-surface-default-stroke),
262
317
  post-form-footer-padding-block-start: var(--post-device-spacing-padding-block-21),
263
318
  post-form-footer-gap: var(--post-device-spacing-gap-4),
264
319
  );
@@ -270,66 +325,62 @@ $post-grid: (
270
325
  );
271
326
 
272
327
  $post-icon-button: (
273
- post-icon-button-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
274
- post-icon-button-focus-stroke-inverted: var(--post-mode-color-interactive-focus-stroke-inverted),
275
- post-icon-button-focus-border-width: var(--post-device-border-width-focus),
276
- post-icon-button-focus-outline-offset: var(--post-device-spacing-padding-2),
277
328
  post-icon-button-large-outer: var(--post-device-sizing-interactive-button-height-2),
278
329
  post-icon-button-large-icon: var(--post-device-sizing-interactive-button-icon-3),
279
- post-icon-button-primary-enabled-fg: var(--post-mode-color-interactive-button-primary-enabled-fg),
280
- post-icon-button-primary-enabled-bg: var(--post-mode-color-interactive-button-primary-enabled-bg),
281
- post-icon-button-primary-enabled-stroke: var(--post-mode-color-interactive-button-primary-enabled-stroke),
282
- post-icon-button-primary-hover-fg: var(--post-mode-color-interactive-button-primary-hover-fg),
283
- post-icon-button-primary-hover-bg: var(--post-mode-color-interactive-button-primary-hover-bg),
284
- post-icon-button-primary-hover-stroke: var(--post-mode-color-interactive-button-primary-hover-stroke),
285
- post-icon-button-primary-disabled-fg: var(--post-mode-color-interactive-button-primary-disabled-fg),
286
- post-icon-button-primary-disabled-bg: var(--post-mode-color-interactive-button-primary-disabled-bg),
287
- post-icon-button-primary-disabled-stroke: var(--post-mode-color-interactive-button-primary-disabled-stroke),
288
- post-icon-button-primary-inverted-enabled-fg: var(--post-mode-color-interactive-button-primary-enabled-fg-inverted),
289
- post-icon-button-primary-inverted-enabled-bg: var(--post-mode-color-interactive-button-primary-enabled-bg-inverted),
290
- post-icon-button-primary-inverted-enabled-stroke: var(--post-mode-color-interactive-button-primary-enabled-stroke-inverted),
291
- post-icon-button-primary-inverted-hover-fg: var(--post-mode-color-interactive-button-primary-hover-fg-inverted),
292
- post-icon-button-primary-inverted-hover-bg: var(--post-mode-color-interactive-button-primary-hover-bg-inverted),
293
- post-icon-button-primary-inverted-hover-stroke: var(--post-mode-color-interactive-button-primary-hover-stroke-inverted),
294
- post-icon-button-primary-inverted-disabled-fg: var(--post-mode-color-interactive-button-primary-disabled-fg-inverted),
295
- post-icon-button-primary-inverted-disabled-bg: var(--post-mode-color-interactive-button-primary-disabled-bg-inverted),
296
- post-icon-button-primary-inverted-disabled-stroke: var(--post-mode-color-interactive-button-primary-disabled-stroke-inverted),
297
- post-icon-button-secondary-enabled-fg: var(--post-mode-color-interactive-button-secondary-enabled-fg),
298
- post-icon-button-secondary-enabled-bg: var(--post-mode-color-interactive-button-secondary-enabled-bg),
299
- post-icon-button-secondary-enabled-stroke: var(--post-mode-color-interactive-button-secondary-enabled-stroke),
300
- post-icon-button-secondary-hover-fg: var(--post-mode-color-interactive-button-secondary-hover-fg),
301
- post-icon-button-secondary-hover-bg: var(--post-mode-color-interactive-button-secondary-hover-bg),
302
- post-icon-button-secondary-hover-stroke: var(--post-mode-color-interactive-button-secondary-hover-stroke),
303
- post-icon-button-secondary-disabled-fg: var(--post-mode-color-interactive-button-secondary-disabled-fg),
304
- post-icon-button-secondary-disabled-bg: var(--post-mode-color-interactive-button-secondary-disabled-bg),
305
- post-icon-button-secondary-disabled-stroke: var(--post-mode-color-interactive-button-secondary-disabled-stroke),
306
- post-icon-button-secondary-inverted-enabled-fg: var(--post-mode-color-interactive-button-secondary-enabled-fg-inverted),
307
- post-icon-button-secondary-inverted-enabled-bg: var(--post-mode-color-interactive-button-secondary-enabled-bg-inverted),
308
- post-icon-button-secondary-inverted-enabled-stroke: var(--post-mode-color-interactive-button-secondary-enabled-stroke-inverted),
309
- post-icon-button-secondary-inverted-hover-fg: var(--post-mode-color-interactive-button-secondary-hover-fg-inverted),
310
- post-icon-button-secondary-inverted-hover-bg: var(--post-mode-color-interactive-button-secondary-hover-bg-inverted),
311
- post-icon-button-secondary-inverted-hover-stroke: var(--post-mode-color-interactive-button-secondary-hover-stroke-inverted),
312
- post-icon-button-secondary-inverted-disabled-fg: var(--post-mode-color-interactive-button-secondary-disabled-fg-inverted),
313
- post-icon-button-secondary-inverted-disabled-bg: var(--post-mode-color-interactive-button-secondary-disabled-bg-inverted),
314
- post-icon-button-secondary-inverted-disabled-stroke: var(--post-mode-color-interactive-button-secondary-disabled-stroke-inverted),
315
- post-icon-button-tertiary-enabled-fg: var(--post-mode-color-interactive-button-tertiary-enabled-fg),
316
- post-icon-button-tertiary-enabled-bg: var(--post-mode-color-interactive-button-tertiary-enabled-bg),
317
- post-icon-button-tertiary-enabled-stroke: var(--post-mode-color-interactive-button-tertiary-enabled-stroke),
318
- post-icon-button-tertiary-hover-fg: var(--post-mode-color-interactive-button-tertiary-hover-fg),
319
- post-icon-button-tertiary-hover-bg: var(--post-mode-color-interactive-button-tertiary-hover-bg),
320
- post-icon-button-tertiary-hover-stroke: var(--post-mode-color-interactive-button-tertiary-hover-stroke),
321
- post-icon-button-tertiary-disabled-fg: var(--post-mode-color-interactive-button-tertiary-disabled-fg),
322
- post-icon-button-tertiary-disabled-bg: var(--post-mode-color-interactive-button-tertiary-disabled-bg),
323
- post-icon-button-tertiary-disabled-stroke: var(--post-mode-color-interactive-button-tertiary-disabled-stroke),
324
- post-icon-button-tertiary-inverted-enabled-fg: var(--post-mode-color-interactive-button-tertiary-enabled-fg-inverted),
325
- post-icon-button-tertiary-inverted-enabled-bg: var(--post-mode-color-interactive-button-tertiary-enabled-bg-inverted),
326
- post-icon-button-tertiary-inverted-enabled-stroke: var(--post-mode-color-interactive-button-tertiary-enabled-stroke-inverted),
327
- post-icon-button-tertiary-inverted-hover-fg: var(--post-mode-color-interactive-button-tertiary-hover-fg-inverted),
328
- post-icon-button-tertiary-inverted-hover-bg: var(--post-mode-color-interactive-button-tertiary-hover-bg-inverted),
329
- post-icon-button-tertiary-inverted-hover-stroke: var(--post-mode-color-interactive-button-tertiary-hover-stroke-inverted),
330
- post-icon-button-tertiary-inverted-disabled-fg: var(--post-mode-color-interactive-button-tertiary-disabled-fg-inverted),
331
- post-icon-button-tertiary-inverted-disabled-bg: var(--post-mode-color-interactive-button-tertiary-disabled-bg-inverted),
332
- post-icon-button-tertiary-inverted-disabled-stroke: var(--post-mode-color-interactive-button-tertiary-disabled-stroke-inverted),
330
+ post-icon-button-primary-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg),
331
+ post-icon-button-primary-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg),
332
+ post-icon-button-primary-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke),
333
+ post-icon-button-primary-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg),
334
+ post-icon-button-primary-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg),
335
+ post-icon-button-primary-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke),
336
+ post-icon-button-primary-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg),
337
+ post-icon-button-primary-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg),
338
+ post-icon-button-primary-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke),
339
+ post-icon-button-primary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-primary-enabled-fg-inverted),
340
+ post-icon-button-primary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-primary-enabled-bg-inverted),
341
+ post-icon-button-primary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-primary-enabled-stroke-inverted),
342
+ post-icon-button-primary-inverted-hover-fg: var(--post-scheme-color-interactive-button-primary-hover-fg-inverted),
343
+ post-icon-button-primary-inverted-hover-bg: var(--post-scheme-color-interactive-button-primary-hover-bg-inverted),
344
+ post-icon-button-primary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-primary-hover-stroke-inverted),
345
+ post-icon-button-primary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-primary-disabled-fg-inverted),
346
+ post-icon-button-primary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-primary-disabled-bg-inverted),
347
+ post-icon-button-primary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-primary-disabled-stroke-inverted),
348
+ post-icon-button-secondary-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg),
349
+ post-icon-button-secondary-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg),
350
+ post-icon-button-secondary-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke),
351
+ post-icon-button-secondary-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg),
352
+ post-icon-button-secondary-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg),
353
+ post-icon-button-secondary-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke),
354
+ post-icon-button-secondary-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg),
355
+ post-icon-button-secondary-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg),
356
+ post-icon-button-secondary-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke),
357
+ post-icon-button-secondary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-secondary-enabled-fg-inverted),
358
+ post-icon-button-secondary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-secondary-enabled-bg-inverted),
359
+ post-icon-button-secondary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-secondary-enabled-stroke-inverted),
360
+ post-icon-button-secondary-inverted-hover-fg: var(--post-scheme-color-interactive-button-secondary-hover-fg-inverted),
361
+ post-icon-button-secondary-inverted-hover-bg: var(--post-scheme-color-interactive-button-secondary-hover-bg-inverted),
362
+ post-icon-button-secondary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-secondary-hover-stroke-inverted),
363
+ post-icon-button-secondary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-secondary-disabled-fg-inverted),
364
+ post-icon-button-secondary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-secondary-disabled-bg-inverted),
365
+ post-icon-button-secondary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-secondary-disabled-stroke-inverted),
366
+ post-icon-button-tertiary-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg),
367
+ post-icon-button-tertiary-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg),
368
+ post-icon-button-tertiary-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke),
369
+ post-icon-button-tertiary-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg),
370
+ post-icon-button-tertiary-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg),
371
+ post-icon-button-tertiary-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke),
372
+ post-icon-button-tertiary-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg),
373
+ post-icon-button-tertiary-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg),
374
+ post-icon-button-tertiary-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke),
375
+ post-icon-button-tertiary-inverted-enabled-fg: var(--post-scheme-color-interactive-button-tertiary-enabled-fg-inverted),
376
+ post-icon-button-tertiary-inverted-enabled-bg: var(--post-scheme-color-interactive-button-tertiary-enabled-bg-inverted),
377
+ post-icon-button-tertiary-inverted-enabled-stroke: var(--post-scheme-color-interactive-button-tertiary-enabled-stroke-inverted),
378
+ post-icon-button-tertiary-inverted-hover-fg: var(--post-scheme-color-interactive-button-tertiary-hover-fg-inverted),
379
+ post-icon-button-tertiary-inverted-hover-bg: var(--post-scheme-color-interactive-button-tertiary-hover-bg-inverted),
380
+ post-icon-button-tertiary-inverted-hover-stroke: var(--post-scheme-color-interactive-button-tertiary-hover-stroke-inverted),
381
+ post-icon-button-tertiary-inverted-disabled-fg: var(--post-scheme-color-interactive-button-tertiary-disabled-fg-inverted),
382
+ post-icon-button-tertiary-inverted-disabled-bg: var(--post-scheme-color-interactive-button-tertiary-disabled-bg-inverted),
383
+ post-icon-button-tertiary-inverted-disabled-stroke: var(--post-scheme-color-interactive-button-tertiary-disabled-stroke-inverted),
333
384
  post-icon-button-medium-outer: var(--post-device-sizing-interactive-button-height-1),
334
385
  post-icon-button-medium-icon: var(--post-device-sizing-interactive-button-icon-4),
335
386
  post-icon-button-border-radius-round: var(--post-device-border-radius-round),
@@ -340,131 +391,109 @@ $post-icon-button: (
340
391
  post-icon-button-border-style-disabled: var(--post-core-border-style-dash),
341
392
  );
342
393
 
394
+ $post-inline-notification: (
395
+ post-inline-spacing-gap-outer: var(--post-device-spacing-gap-inline-7),
396
+ post-inline-spacing-gap-inner: var(--post-device-spacing-gap-1),
397
+ post-inline-spacing-padding-block: var(--post-device-spacing-padding-12),
398
+ post-inline-sizing-icon: var(--post-device-sizing-notification-icon-2),
399
+ post-inline-color-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
400
+ post-inline-color-info-fg: var(--post-scheme-color-interactive-notification-info-fg),
401
+ post-inline-color-info-stroke: var(--post-scheme-color-interactive-notification-info-stroke),
402
+ post-inline-color-info-icon: var(--post-scheme-color-interactive-notification-info-icon),
403
+ post-inline-color-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
404
+ post-inline-color-success-fg: var(--post-scheme-color-interactive-notification-success-fg),
405
+ post-inline-color-success-stroke: var(--post-scheme-color-interactive-notification-success-stroke),
406
+ post-inline-color-success-icon: var(--post-scheme-color-interactive-notification-success-icon),
407
+ post-inline-color-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
408
+ post-inline-color-warning-fg: var(--post-scheme-color-interactive-notification-warning-fg),
409
+ post-inline-color-warning-stroke: var(--post-scheme-color-interactive-notification-warning-stroke),
410
+ post-inline-color-warning-icon: var(--post-scheme-color-interactive-notification-warning-icon),
411
+ post-inline-color-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
412
+ post-inline-color-error-fg: var(--post-scheme-color-interactive-notification-error-fg),
413
+ post-inline-color-error-stroke: var(--post-scheme-color-interactive-notification-error-stroke),
414
+ post-inline-color-error-icon: var(--post-scheme-color-interactive-notification-error-icon),
415
+ post-inline-elevation: var(--post-device-elevation-300),
416
+ );
417
+
343
418
  $post-lead: (
344
419
  post-lead-font-size: var(--post-device-font-size-5),
345
420
  post-lead-font-weight: var(--post-device-font-weight-bold),
346
421
  );
347
422
 
348
423
  $post-list: (
349
- post-list-simple-checks-sizing-icon: var(--post-device-sizing-icon-1),
350
- post-list-simple-checks-padding-icon: var(--post-device-spacing-padding-16),
351
- post-list-simple-checks-padding-text: var(--post-device-spacing-padding-block-6),
352
- post-list-simple-checks-padding-block-outer: var(--post-device-spacing-padding-5),
353
- post-list-simple-checks-gap-inline-text: var(--post-device-spacing-gap-inline-2),
354
- post-list-simple-checks-gap-block-text: var(--post-device-spacing-gap-block-3),
355
- post-list-simple-checks-icon-container-inline: var(--post-device-spacing-padding-4),
356
- post-list-simple-checks-icon-container-block: var(--post-device-spacing-padding-18),
357
- post-list-simple-bullets-spacing-padding-text: var(--post-device-spacing-padding-block-6),
358
- post-list-simple-bullets-spacing-gap-inline-text: var(--post-device-spacing-gap-inline-10),
359
- post-list-checks-color-icon-bg: var(--post-mode-color-surface-accent4-bg),
360
- post-list-checks-color-icon-fg: var(--post-mode-color-surface-accent4-fg),
361
- post-list-checks-color-text-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
362
424
  post-list-item-padding-inline-start: var(--post-device-spacing-padding-5),
363
425
  post-list-item-padding-inline-end: var(--post-device-spacing-padding-inline-4),
364
426
  post-list-item-padding-block-start: var(--post-device-spacing-padding-block-22),
365
427
  post-list-item-padding-block-end: var(--post-device-spacing-padding-block-23),
366
428
  post-list-item-gap-inline: var(--post-device-spacing-gap-4),
367
- post-list-item-enabled-border: var(--post-mode-color-interactive-primary-enabled-stroke),
368
- post-list-item-hover-border: var(--post-mode-color-interactive-primary-hover-stroke),
369
- post-list-item-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
370
- post-list-item-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
371
- post-list-item-focus-outline-offset: var(--post-device-spacing-padding-2),
372
- post-list-item-focus-outline-color: var(--post-mode-color-interactive-focus-stroke),
373
- post-list-item-focus-outline-style: var(--post-core-border-style-solid),
374
- post-list-item-focus-outline-width: var(--post-device-border-width-focus),
375
- post-list-item-focus-outline-radius: var(--post-device-border-radius-focus),
429
+ post-list-item-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
430
+ post-list-item-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
431
+ post-list-item-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
432
+ post-list-item-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
376
433
  post-list-item-border-width: var(--post-device-border-width-alternative1),
377
434
  post-list-item-border-style: var(--post-core-border-style-solid),
378
435
  post-list-icon-container-padding-block: var(--post-device-spacing-padding-block-24),
379
436
  post-list-icon-container-padding-inline: var(--post-device-spacing-padding-4),
380
437
  post-list-icon-size: var(--post-device-sizing-interactive-icon-size2),
381
438
  post-list-switch-padding-block: var(--post-device-spacing-padding-block-18),
439
+ post-list-margin-block: var(--post-device-spacing-padding-block-8),
440
+ post-list-bg: var(--post-scheme-color-surface-default-bg),
382
441
  );
383
442
 
384
- $post-notifications: (
385
- post-infobox-sizing-icon: var(--post-device-sizing-notification-icon-4),
386
- post-infobox-spacing-gap-inline: var(--post-device-spacing-gap-4),
387
- post-clickable-spacing-padding-icon: var(--post-device-spacing-padding-2),
388
- post-interactive-spacing-gap-inline-icon-end: var(--post-device-spacing-gap-inline-4),
389
- post-interactive-spacing-gap-inline-error: var(--post-device-spacing-gap-inline-10),
390
- post-notification-banner-elevation: var(--post-device-elevation-500),
391
- post-notification-toast-elevation: var(--post-device-elevation-300),
392
- post-notification-snackbar-elevation: var(--post-device-elevation-300),
393
- post-notification-color-info-bg: var(--post-mode-color-interactive-notification-info-bg),
394
- post-notification-color-info-fg: var(--post-mode-color-interactive-notification-info-fg),
395
- post-notification-color-info-stroke: var(--post-mode-color-interactive-notification-info-stroke),
396
- post-notification-color-info-icon: var(--post-mode-color-interactive-notification-info-icon),
397
- post-notification-color-success-bg: var(--post-mode-color-interactive-notification-success-bg),
398
- post-notification-color-success-fg: var(--post-mode-color-interactive-notification-success-fg),
399
- post-notification-color-success-stroke: var(--post-mode-color-interactive-notification-success-stroke),
400
- post-notification-color-success-icon: var(--post-mode-color-interactive-notification-success-icon),
401
- post-notification-color-warning-bg: var(--post-mode-color-interactive-notification-warning-bg),
402
- post-notification-color-warning-fg: var(--post-mode-color-interactive-notification-warning-fg),
403
- post-notification-color-warning-stroke: var(--post-mode-color-interactive-notification-warning-stroke),
404
- post-notification-color-warning-icon: var(--post-mode-color-interactive-notification-warning-icon),
405
- post-notification-color-error-bg: var(--post-mode-color-interactive-notification-error-bg),
406
- post-notification-color-error-fg: var(--post-mode-color-interactive-notification-error-fg),
407
- post-notification-color-error-stroke: var(--post-mode-color-interactive-notification-error-stroke),
408
- post-notification-color-error-icon: var(--post-mode-color-interactive-notification-error-icon),
409
- post-notification-popup-elevation: var(--post-device-elevation-300),
410
- post-test: var(--post-core-color-notification-green),
443
+ $post-listcheck: (
444
+ post-list-check-sizing-icon: var(--post-device-sizing-icon-1),
445
+ post-list-check-padding-icon: var(--post-device-spacing-padding-16),
446
+ post-list-check-text-padding: var(--post-device-spacing-padding-block-6),
447
+ post-list-check-icon-gap-inline: var(--post-device-spacing-gap-inline-2),
448
+ post-list-check-icon-container-inline: var(--post-device-spacing-padding-4),
449
+ post-list-check-icon-container-block: var(--post-device-spacing-padding-18),
450
+ post-list-check-item-gap-block-text: var(--post-device-spacing-gap-block-3),
451
+ post-list-check-margin-block: var(--post-device-spacing-padding-block-8),
452
+ post-list-check-color-icon-bg: var(--post-scheme-color-surface-accent-bg),
453
+ post-list-check-color-icon-fg: var(--post-scheme-color-surface-accent-fg),
454
+ post-list-check-color-text-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
411
455
  );
412
456
 
413
457
  $post-popover: (
414
- post-popover-close-button-focus-stroke: var(--post-mode-color-interactive-focus-stroke-inverted),
415
- post-popover-close-button-enabled-fg: var(--post-mode-color-surface-accent4-fg),
416
- post-popover-close-button-selected-fg: var(--post-mode-color-surface-accent4-fg),
417
- post-popover-close-button-hover-fg: var(--post-mode-color-surface-accent4-fg),
418
- post-popover-close-button-hover-bg: var(--post-mode-color-interactive-primary-hover-bg2),
458
+ post-popover-close-button-enabled-fg: var(--post-scheme-color-surface-accent-fg),
459
+ post-popover-close-button-selected-fg: var(--post-scheme-color-surface-accent-fg),
460
+ post-popover-close-button-hover-fg: var(--post-scheme-color-surface-accent-fg),
461
+ post-popover-close-button-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
419
462
  post-popover-close-button-outer: var(--post-device-sizing-notification-1),
420
- post-popover-link-focus-stroke: var(--post-mode-color-interactive-focus-stroke-inverted),
421
463
  post-popover-link-padding-block: var(--post-device-spacing-padding-block-9),
422
- post-popover-link-enabled-fg: var(--post-mode-color-surface-accent4-fg),
423
- post-popover-link-selected-fg: var(--post-mode-color-surface-accent4-fg),
424
- post-popover-link-hover-fg: var(--post-mode-color-notification-popover-hover),
464
+ post-popover-link-enabled-fg: var(--post-scheme-color-surface-accent-fg),
465
+ post-popover-link-selected-fg: var(--post-scheme-color-surface-accent-fg),
466
+ post-popover-link-hover-fg: var(--post-scheme-color-notification-popover-hover),
425
467
  post-popover-link-font-weight: var(--post-device-font-weight-bold),
426
468
  post-popover-link-font-size: var(--post-device-font-size-7),
427
- post-popover-link-focus-border-radius: var(--post-device-border-radius-focus2),
428
- post-popover-icon-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
429
- post-popover-icon-enabled-fg: var(--post-mode-color-surface-accent1-fg),
430
- post-popover-icon-selected-fg: var(--post-mode-color-surface-accent1-fg),
431
- post-popover-icon-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
432
- post-popover-surface-bg: var(--post-mode-color-surface-accent4-bg),
433
- post-popover-surface-fg: var(--post-mode-color-surface-accent4-fg),
469
+ post-popover-icon-enabled-fg: var(--post-scheme-color-surface-accent1-fg),
470
+ post-popover-icon-selected-fg: var(--post-scheme-color-surface-accent1-fg),
471
+ post-popover-icon-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
472
+ post-popover-surface-bg: var(--post-scheme-color-surface-accent-bg),
473
+ post-popover-surface-fg: var(--post-scheme-color-surface-accent-fg),
434
474
  post-popover-surface-border-radius: var(--post-device-border-radius-1),
435
475
  post-popover-surface-padding-block: var(--post-device-spacing-padding-5),
436
476
  post-popover-surface-padding-inline-start: var(--post-device-spacing-padding-5),
437
- post-popover-surface-padding-inline-end: var(--post-device-spacing-padding-6),
477
+ post-popover-surface-padding-inline-end: var(--post-core-dimension-4),
438
478
  post-popover-surface-gap-inline: var(--post-device-spacing-gap-inline-4),
439
- post-popover-text-selected-fg: var(--post-mode-color-surface-accent4-fg),
479
+ post-popover-text-selected-fg: var(--post-scheme-color-surface-accent-fg),
440
480
  post-popover-elevation: var(--post-device-elevation-300),
441
- post-popover-focus-border-width: var(--post-device-border-width-focus),
442
- post-popover-focus-padding: var(--post-device-spacing-padding-2),
443
481
  post-popover-paragraph-font-size: var(--post-device-font-size-7),
444
482
  post-popover-legend-font-size: var(--post-device-font-size-6),
445
483
  );
446
484
 
447
485
  $post-radio-button: (
448
- post-radio-button-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
449
- post-radio-button-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
450
- post-radio-button-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
451
- post-radio-button-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
452
- post-radio-button-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg),
453
- post-radio-button-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
454
- post-radio-button-selected-bg: var(--post-mode-color-interactive-primary-selected-bg1),
455
- post-radio-button-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
456
- post-radio-button-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
457
- post-radio-button-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
458
- post-radio-button-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke),
459
- post-radio-button-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke1),
460
- post-radio-button-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
461
- post-radio-button-focus-border-width: var(--post-device-border-width-focus),
462
- post-radio-button-focus-border-style: var(--post-core-border-style-solid),
463
- post-radio-button-focus-border-radius: var(--post-device-border-radius-1),
464
- post-radio-button-focus-outline-offset: var(--post-device-spacing-padding-2),
486
+ post-radio-button-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg3),
487
+ post-radio-button-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
488
+ post-radio-button-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg3),
489
+ post-radio-button-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
490
+ post-radio-button-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg6),
491
+ post-radio-button-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg4),
492
+ post-radio-button-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
493
+ post-radio-button-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
494
+ post-radio-button-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke4),
465
495
  post-radio-button-gap-block-group: var(--post-device-spacing-gap-4),
466
496
  post-radio-button-gap-inline-text-start: var(--post-device-spacing-gap-inline-12),
467
- post-radio-button-gap-inline-group: tbd,
468
497
  post-radio-button-icon-padding-block-inner: var(--post-device-spacing-padding-1),
469
498
  post-radio-button-icon-padding-block-container: var(--post-device-spacing-padding-block-18),
470
499
  post-radio-button-icon-padding-inline-inner: var(--post-device-spacing-padding-1),
@@ -480,37 +509,78 @@ $post-radio-button: (
480
509
  post-radio-button-label-padding-block: var(--post-device-spacing-padding-block-20),
481
510
  );
482
511
 
512
+ $post-search-input: (
513
+ post-input-search-empty-padding-inline-end: var(--post-core-dimension-48),
514
+ post-input-search-filled-padding-inline-end: var(--post-core-dimension-80),
515
+ post-input-search-filled-gap-icon: var(--post-core-dimension-8),
516
+ post-input-search-label-empty-padding-inline-end: var(--post-core-dimension-50),
517
+ post-input-search-label-filled-padding-inline-end: var(--post-core-dimension-82),
518
+ post-input-search-icon-border-radius: var(--post-device-border-radius-focus),
519
+ post-search-position-inline-end-icon: var(--post-core-dimension-14),
520
+ );
521
+
522
+ $post-segmented-button: (
523
+ post-button-segmented-horizontal-border-radius: var(--post-device-border-radius-round),
524
+ post-button-segmented-vertical-border-radius: var(--post-device-border-radius-2),
525
+ post-button-segmented-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg3),
526
+ post-button-segmented-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg4),
527
+ post-button-segmented-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
528
+ post-button-segmented-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg1),
529
+ post-button-segmented-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke),
530
+ post-button-segmented-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg1),
531
+ post-button-segmented-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg),
532
+ post-button-segmented-hover-border: var(--post-scheme-color-interactive-primary-hover-stroke),
533
+ post-button-segmented-border-width: var(--post-device-border-width-default),
534
+ post-button-segmented-elements-height: var(--post-device-sizing-interactive-button-height-2),
535
+ post-button-segmented-elements-enabled-border: var(--post-scheme-color-interactive-primary-enabled-stroke3),
536
+ post-button-segmented-padding-inline: var(--post-device-spacing-padding-11),
537
+ post-button-segmented-gap-inline: var(--post-device-spacing-gap-inline-13),
538
+ post-button-segmented-margin: var(--post-device-spacing-gap-6),
539
+ post-button-segmented-font-weight: var(--post-device-font-weight-bold),
540
+ post-button-segmented-selected-border: var(--post-scheme-color-interactive-primary-selected-stroke1),
541
+ post-button-segmented-elevation: var(--post-device-elevation-200),
542
+ );
543
+
483
544
  $post-select: (
484
- post-select-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
485
- post-select-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
486
- post-select-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
487
- post-select-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
488
- post-select-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg),
489
- post-select-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
490
- post-select-selected-bg: var(--post-mode-color-interactive-primary-selected-bg1),
491
- post-select-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
492
- post-select-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
493
- post-select-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
494
- post-select-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke),
495
- post-select-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke1),
496
- post-select-signal-error: var(--post-mode-color-signal-error-dark),
497
- post-select-signal-success: var(--post-mode-color-signal-success-dark),
498
- post-select-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
499
- post-select-focus-border-width: var(--post-device-border-width-focus),
500
- post-select-gap-inline-section: var(--post-device-spacing-gap-1),
501
- post-select-filled-gap-inline-value: var(--post-device-spacing-gap-inline-4),
502
- post-select-filled-padding-block-section: var(--post-device-spacing-padding-block-3),
503
- post-select-unfilled-padding-block-section: var(--post-device-spacing-padding-block-1),
504
- post-select-unfilled-padding-block-label: var(--post-device-spacing-padding-block-2),
505
- post-select-unfilled-focus-padding-block-section: var(--post-device-spacing-padding-block-4),
506
- post-select-padding-block-text-assist: var(--post-device-spacing-padding-block-5),
507
- post-select-padding-inline-section-start: var(--post-device-spacing-padding-inline-1),
508
- post-select-padding-inline-section-end: var(--post-device-spacing-padding-3),
509
- post-select-padding-inline-text-assist: var(--post-device-spacing-padding-2),
510
- post-select-icon-padding-droppdow-inner: var(--post-device-spacing-padding-15),
511
- post-select-icon-signal: var(--post-device-sizing-interactive-textfields-icon),
545
+ post-select-color-enabled-bg: var(--post-scheme-color-interactive-input-enabled-bg),
546
+ post-select-color-enabled-fg: var(--post-scheme-color-interactive-input-enabled-fg),
547
+ post-select-color-hover-bg: var(--post-scheme-color-interactive-input-hover-bg),
548
+ post-select-color-hover-fg: var(--post-scheme-color-interactive-input-hover-fg),
549
+ post-select-color-disabled-bg: var(--post-scheme-color-interactive-input-disabled-bg),
550
+ post-select-color-disabled-fg: var(--post-scheme-color-interactive-input-disabled-fg),
551
+ post-select-color-selected-bg: var(--post-scheme-color-interactive-input-enabled-bg),
552
+ post-select-color-selected-fg: var(--post-scheme-color-interactive-input-enabled-fg),
553
+ post-select-color-helptext-fg: var(--post-scheme-color-interactive-primary-enabled-fg2),
554
+ post-select-color-enabled-border: var(--post-scheme-color-interactive-input-enabled-border),
555
+ post-select-color-hover-border: var(--post-scheme-color-interactive-input-hover-border),
556
+ post-select-color-disabled-border: var(--post-scheme-color-interactive-input-disabled-border),
557
+ post-select-color-selected-border: var(--post-scheme-color-interactive-input-enabled-border),
558
+ post-select-color-signal-error: var(--post-scheme-color-signal-error-dark),
559
+ post-select-color-signal-success: var(--post-scheme-color-signal-success-dark),
560
+ post-select-gap-inline-icon: var(--post-device-spacing-gap-1),
561
+ post-select-padding-block-assist: var(--post-device-spacing-padding-block-5),
562
+ post-select-padding-block-start: var(--post-device-spacing-padding-block-29),
563
+ post-select-padding-block-end: var(--post-device-spacing-padding-block-3),
564
+ post-select-padding-inline-start: var(--post-device-spacing-padding-inline-1),
565
+ post-select-padding-inline-end: var(--post-core-dimension-48),
566
+ post-select-padding-inline-assist: var(--post-device-spacing-padding-2),
567
+ post-select-sizing-icon: var(--post-device-sizing-notification-1),
568
+ post-select-sizing-height: var(--post-device-sizing-interactive-button-height-6),
512
569
  post-select-border-radius: var(--post-device-border-radius-1),
513
570
  post-select-border-width: var(--post-device-border-width-default),
571
+ post-select-border-style-default: var(--post-core-border-style-solid),
572
+ post-select-border-style-disabled: var(--post-core-border-style-dash),
573
+ post-select-standalone-padding-block: var(--post-device-spacing-padding-block-1),
574
+ post-select-label-empty-padding-block-start: var(--post-device-spacing-padding-block-28),
575
+ post-select-label-empty-padding-inline-start: var(--post-device-spacing-padding-5),
576
+ post-select-label-empty-padding-inline-end: var(--post-core-dimension-50),
577
+ post-select-label-validated-padding-inline-end: var(--post-core-dimension-82),
578
+ post-select-label-filled-padding-block-start: var(--post-device-spacing-padding-block-30),
579
+ post-select-label-filled-font-size: var(--post-device-font-size-10),
580
+ post-select-validation-icon-position-inline-end: var(--post-device-position-3),
581
+ post-select-assist-font-size: var(--post-device-font-size-10),
582
+ post-select-validated-padding-inline-end: var(--post-core-dimension-80),
583
+ post-select-icon-position-inline-end: var(--post-device-position-2),
514
584
  );
515
585
 
516
586
  $post-snackbar: (
@@ -518,43 +588,42 @@ $post-snackbar: (
518
588
  post-snackbar-spacing-padding-inline: var(--post-device-spacing-padding-11),
519
589
  post-snackbar-spacing-padding-block: var(--post-device-spacing-padding-block-12),
520
590
  post-snackbar-sizing-icon: var(--post-device-sizing-notification-icon-3),
521
- post-snackbar-color-info-bg: var(--post-mode-color-interactive-notification-info-bg),
522
- post-snackbar-color-info-fg: var(--post-mode-color-interactive-notification-info-fg),
523
- post-snackbar-color-info-stroke: var(--post-mode-color-interactive-notification-info-stroke),
524
- post-snackbar-color-info-icon: var(--post-mode-color-interactive-notification-info-icon),
525
- post-snackbar-color-success-bg: var(--post-mode-color-interactive-notification-success-bg),
526
- post-snackbar-color-success-fg: var(--post-mode-color-interactive-notification-success-fg),
527
- post-snackbar-color-success-stroke: var(--post-mode-color-interactive-notification-success-stroke),
528
- post-snackbar-color-success-icon: var(--post-mode-color-interactive-notification-success-icon),
529
- post-snackbar-color-warning-bg: var(--post-mode-color-interactive-notification-warning-bg),
530
- post-snackbar-color-warning-fg: var(--post-mode-color-interactive-notification-warning-fg),
531
- post-snackbar-color-warning-stroke: var(--post-mode-color-interactive-notification-warning-stroke),
532
- post-snackbar-color-warning-icon: var(--post-mode-color-interactive-notification-warning-icon),
533
- post-snackbar-color-error-bg: var(--post-mode-color-interactive-notification-error-bg),
534
- post-snackbar-color-error-fg: var(--post-mode-color-interactive-notification-error-fg),
535
- post-snackbar-color-error-stroke: var(--post-mode-color-interactive-notification-error-stroke),
536
- post-snackbar-color-error-icon: var(--post-mode-color-interactive-notification-error-icon),
591
+ post-snackbar-color-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
592
+ post-snackbar-color-info-fg: var(--post-scheme-color-interactive-notification-info-fg),
593
+ post-snackbar-color-info-stroke: var(--post-scheme-color-interactive-notification-info-stroke),
594
+ post-snackbar-color-info-icon: var(--post-scheme-color-interactive-notification-info-icon),
595
+ post-snackbar-color-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
596
+ post-snackbar-color-success-fg: var(--post-scheme-color-interactive-notification-success-fg),
597
+ post-snackbar-color-success-stroke: var(--post-scheme-color-interactive-notification-success-stroke),
598
+ post-snackbar-color-success-icon: var(--post-scheme-color-interactive-notification-success-icon),
599
+ post-snackbar-color-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
600
+ post-snackbar-color-warning-fg: var(--post-scheme-color-interactive-notification-warning-fg),
601
+ post-snackbar-color-warning-stroke: var(--post-scheme-color-interactive-notification-warning-stroke),
602
+ post-snackbar-color-warning-icon: var(--post-scheme-color-interactive-notification-warning-icon),
603
+ post-snackbar-color-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
604
+ post-snackbar-color-error-fg: var(--post-scheme-color-interactive-notification-error-fg),
605
+ post-snackbar-color-error-stroke: var(--post-scheme-color-interactive-notification-error-stroke),
606
+ post-snackbar-color-error-icon: var(--post-scheme-color-interactive-notification-error-icon),
607
+ post-snackbar-elevation: var(--post-device-elevation-300),
537
608
  );
538
609
 
539
610
  $post-stepper: (
540
- post-stepper-text-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
541
- post-stepper-text-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
542
- post-stepper-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
543
- post-stepper-focus-border-width: var(--post-device-border-width-focus),
544
- post-stepper-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg2),
545
- post-stepper-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg3),
546
- post-stepper-completed-bg: var(--post-mode-color-interactive-primary-selected-bg2),
547
- post-stepper-hover-bg: var(--post-mode-color-interactive-primary-hover-bg2),
548
- post-stepper-hover-fg: var(--post-mode-color-interactive-primary-hover-fg3),
549
- post-stepper-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg4),
550
- post-stepper-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg3),
551
- post-stepper-connector-active: var(--post-mode-color-interactive-primary-enabled-fg1),
552
- post-stepper-connector-completed: var(--post-mode-color-interactive-primary-selected-bg2),
553
- post-stepper-connector-next: var(--post-mode-color-interactive-primary-disabled-bg4),
554
- post-stepper-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke3),
555
- post-stepper-completed-stroke: var(--post-mode-color-interactive-primary-selected-stroke3),
556
- post-stepper-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke3),
557
- post-stepper-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke3),
611
+ post-stepper-text-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
612
+ post-stepper-text-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
613
+ post-stepper-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg2),
614
+ post-stepper-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg3),
615
+ post-stepper-completed-bg: var(--post-scheme-color-interactive-primary-selected-bg2),
616
+ post-stepper-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
617
+ post-stepper-hover-fg: var(--post-scheme-color-interactive-primary-hover-fg3),
618
+ post-stepper-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg4),
619
+ post-stepper-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg3),
620
+ post-stepper-connector-active: var(--post-scheme-color-interactive-primary-enabled-fg1),
621
+ post-stepper-connector-completed: var(--post-scheme-color-interactive-primary-selected-bg2),
622
+ post-stepper-connector-next: var(--post-scheme-color-interactive-primary-disabled-bg4),
623
+ post-stepper-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke3),
624
+ post-stepper-completed-stroke: var(--post-scheme-color-interactive-primary-selected-stroke3),
625
+ post-stepper-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke3),
626
+ post-stepper-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke3),
558
627
  post-stepper-gap-text-start: var(--post-device-spacing-gap-1),
559
628
  post-stepper-padding-connector: var(--post-device-spacing-padding-9),
560
629
  post-stepper-border-radius-round: var(--post-device-border-radius-round),
@@ -565,38 +634,35 @@ $post-stepper: (
565
634
  );
566
635
 
567
636
  $post-switch: (
568
- post-switch-text-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
569
- post-switch-text-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
570
- post-switch-text-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
571
- post-switch-icon-success: var(--post-mode-color-signal-success-dark),
572
- post-switch-icon-disabled: var(--post-mode-color-interactive-primary-disabled-fg1),
573
- post-switch-icon-hover: var(--post-mode-color-interactive-primary-hover-fg1),
574
- post-switch-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
575
- post-switch-focus-border-width: var(--post-device-border-width-focus),
576
- post-switch-focus-outline-offset: var(--post-device-spacing-padding-2),
577
- post-switch-focus-border-radius: var(--post-device-border-radius-focus),
578
- post-switch-focus-border-style: var(--post-core-border-style-solid),
579
- post-switch-handle-enabled: var(--post-mode-color-interactive-primary-enabled-fg3),
580
- post-switch-handle-selected: var(--post-mode-color-interactive-primary-selected-fg3),
581
- post-switch-handle-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke3),
582
- post-switch-handle-hover: var(--post-mode-color-interactive-primary-hover-fg3),
583
- post-switch-handle-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke3),
584
- post-switch-handle-disabled: var(--post-mode-color-interactive-primary-disabled-fg3),
585
- post-switch-handle-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke2),
586
- post-switch-handle-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke3),
587
- post-switch-element-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg2),
588
- post-switch-element-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
589
- post-switch-element-selected-bg: var(--post-mode-color-interactive-primary-selected-bg2),
590
- post-switch-element-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke4),
591
- post-switch-element-hover-bg: var(--post-mode-color-interactive-primary-hover-bg2),
592
- post-switch-element-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
593
- post-switch-element-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg3),
594
- post-switch-element-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke2),
637
+ post-switch-text-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
638
+ post-switch-text-disabled-fg: var(--post-scheme-color-interactive-primary-disabled-fg1),
639
+ post-switch-text-selected-fg: var(--post-scheme-color-interactive-primary-selected-fg1),
640
+ post-switch-icon-success: var(--post-scheme-color-interactive-primary-selected-bg2),
641
+ post-switch-icon-disabled: var(--post-scheme-color-interactive-primary-disabled-fg1),
642
+ post-switch-icon-hover: var(--post-scheme-color-interactive-primary-hover-fg1),
643
+ post-switch-icon-padding-container: var(--post-device-spacing-padding-block-18),
644
+ post-switch-handle-enabled: var(--post-scheme-color-interactive-primary-enabled-fg3),
645
+ post-switch-handle-selected: var(--post-scheme-color-interactive-primary-selected-fg3),
646
+ post-switch-handle-selected-stroke: var(--post-scheme-color-interactive-primary-selected-stroke3),
647
+ post-switch-handle-hover: var(--post-scheme-color-interactive-primary-hover-fg3),
648
+ post-switch-handle-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke3),
649
+ post-switch-handle-disabled: var(--post-scheme-color-interactive-primary-disabled-fg3),
650
+ post-switch-handle-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke2),
651
+ post-switch-handle-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke3),
652
+ post-switch-element-enabled-bg: var(--post-scheme-color-interactive-primary-enabled-bg2),
653
+ post-switch-element-enabled-stroke: var(--post-scheme-color-interactive-primary-enabled-stroke),
654
+ post-switch-element-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg2),
655
+ post-switch-element-selected-stroke: var(--post-scheme-color-interactive-primary-selected-stroke4),
656
+ post-switch-element-hover-bg: var(--post-scheme-color-interactive-primary-hover-bg2),
657
+ post-switch-element-hover-stroke: var(--post-scheme-color-interactive-primary-hover-stroke),
658
+ post-switch-element-disabled-bg: var(--post-scheme-color-interactive-primary-disabled-bg5),
659
+ post-switch-element-disabled-stroke: var(--post-scheme-color-interactive-primary-disabled-stroke2),
595
660
  post-switch-element-width: var(--post-core-dimension-48),
596
661
  post-switch-element-height: var(--post-core-dimension-24),
597
662
  post-switch-element-handle: var(--post-core-dimension-18),
598
663
  post-switch-gap-inline-text: var(--post-device-spacing-gap-inline-3),
599
664
  post-switch-padding-block-text: var(--post-device-spacing-padding-block-7),
665
+ post-switch-padding-block-container-text: var(--post-device-spacing-padding-block-9),
600
666
  post-switch-padding-inline-handle: var(--post-core-dimension-4),
601
667
  post-switch-border-radius-round: var(--post-device-border-radius-round),
602
668
  post-switch-border-style-disabled: var(--post-core-border-style-dash),
@@ -604,69 +670,110 @@ $post-switch: (
604
670
  post-switch-border-width: var(--post-device-border-width-alternative1),
605
671
  );
606
672
 
673
+ $post-teaser: (
674
+ post-teaser-card-sm-image-height: var(--post-device-sizing-content-height-1),
675
+ post-teaser-card-sm-section-content-padding: var(--post-device-spacing-padding-5),
676
+ post-teaser-card-sm-section-content-gap: var(--post-device-spacing-gap-7),
677
+ post-teaser-card-sm-heading-font-size: var(--post-device-font-size-5),
678
+ post-teaser-card-sm-content-gap: var(--post-core-dimension-6),
679
+ post-teaser-card-lg-image-height: var(--post-device-sizing-content-height-2),
680
+ post-teaser-card-lg-section-content-padding: var(--post-device-spacing-padding-20),
681
+ post-teaser-card-lg-section-content-gap: var(--post-core-dimension-24),
682
+ post-teaser-card-lg-heading-font-size: var(--post-device-font-size-4),
683
+ post-teaser-card-lg-content-gap: var(--post-device-spacing-gap-block-3),
684
+ post-teaser-card-content-enabled-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
685
+ );
686
+
607
687
  $post-text-area: (
608
- post-textarea-color-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
609
- post-textarea-color-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
610
- post-textarea-color-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
611
- post-textarea-color-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
612
- post-textarea-color-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg),
613
- post-textarea-color-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
614
- post-textarea-color-selected-bg: var(--post-mode-color-interactive-primary-selected-bg1),
615
- post-textarea-color-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
616
- post-textarea-color-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
617
- post-textarea-color-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
618
- post-textarea-color-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke),
619
- post-textarea-color-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke1),
620
- post-textarea-color-signal-error: var(--post-mode-color-signal-error-dark),
621
- post-textarea-color-signal-success: var(--post-mode-color-signal-success-dark),
622
- post-textarea-color-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
623
- post-textarea-spacing-gap-inline-1: var(--post-device-spacing-gap-1),
624
- post-textarea-spacing-padding-block-text-assist: var(--post-device-spacing-padding-block-5),
625
- post-textarea-spacing-padding-block-text4: var(--post-device-spacing-padding-3),
626
- post-textarea-spacing-padding-block-textarea-top: var(--post-device-spacing-padding-8),
627
- post-textarea-spacing-padding-inline-text-start: var(--post-device-spacing-padding-inline-1),
628
- post-textarea-spacing-padding-inline-text-end: var(--post-device-spacing-padding-3),
629
- post-textarea-spacing-padding-inline-text-assist: var(--post-device-spacing-padding-2),
630
- post-textarea-sizing-icon: var(--post-device-sizing-interactive-textfields-icon),
631
- post-textarea-border-radius-surface: var(--post-device-border-radius-1),
688
+ post-textarea-enabled-bg: var(--post-scheme-color-interactive-input-enabled-bg),
689
+ post-textarea-enabled-fg: var(--post-scheme-color-interactive-input-enabled-fg),
690
+ post-textarea-hover-bg: var(--post-scheme-color-interactive-input-hover-bg),
691
+ post-textarea-hover-fg: var(--post-scheme-color-interactive-input-hover-fg),
692
+ post-textarea-disabled-bg: var(--post-scheme-color-interactive-input-disabled-bg),
693
+ post-textarea-disabled-fg: var(--post-scheme-color-interactive-input-disabled-fg),
694
+ post-textarea-enabled-border: var(--post-scheme-color-interactive-input-enabled-border),
695
+ post-textarea-hover-border: var(--post-scheme-color-interactive-input-hover-border),
696
+ post-textarea-disabled-border: var(--post-scheme-color-interactive-input-disabled-border),
697
+ post-textarea-gap-inline: var(--post-device-spacing-gap-1),
698
+ post-textarea-gap-assist: var(--post-device-spacing-gap-1),
699
+ post-textarea-padding-block-start: var(--post-device-spacing-padding-block-29),
700
+ post-textarea-padding-block-end: var(--post-device-spacing-padding-3),
701
+ post-textarea-padding-block-assist: var(--post-device-spacing-padding-block-5),
702
+ post-textarea-padding-inline-assist: var(--post-device-spacing-padding-2),
703
+ post-textarea-padding-inline-start: var(--post-device-spacing-padding-inline-1),
704
+ post-textarea-padding-inline-end: var(--post-core-dimension-26),
705
+ post-textarea-standalone-padding-block: var(--post-device-spacing-padding-3),
706
+ post-textarea-sizing-icon: var(--post-device-sizing-notification-1),
707
+ post-textarea-sizing-min-height: var(--post-core-dimension-88),
708
+ post-textarea-border-radius: var(--post-device-border-radius-1),
709
+ post-textarea-border-style-enabled: var(--post-core-border-style-solid),
710
+ post-textarea-border-style-disabled: var(--post-core-border-style-dash),
711
+ post-textarea-border-width: var(--post-device-border-width-default),
712
+ post-textarea-label-padding-inline-start: var(--post-device-spacing-padding-5),
713
+ post-textarea-label-padding-inline-end: var(--post-core-dimension-28),
714
+ post-textarea-label-padding-block-start: var(--post-device-spacing-padding-block-27),
715
+ post-textarea-label-validated-padding-inline-end: var(--post-core-dimension-58),
716
+ post-textarea-label-filled-font-size: var(--post-device-font-size-10),
717
+ post-textarea-label-filled-padding-block-start: var(--post-device-spacing-padding-block-30),
718
+ post-textarea-signal-error: var(--post-scheme-color-signal-error-dark),
719
+ post-textarea-signal-success: var(--post-scheme-color-signal-success-dark),
720
+ post-textarea-position-inline-end-resize: var(--post-core-dimension-6),
721
+ post-textarea-position-inline-end-validation: var(--post-core-dimension-28),
722
+ post-textarea-position-block-end-resize: var(--post-core-dimension-6),
723
+ post-textarea-position-block-start-validation: var(--post-core-dimension-12),
724
+ post-textarea-assist-font-size: var(--post-device-font-size-9),
725
+ post-textarea-validated-padding-inline-end: var(--post-core-dimension-56),
726
+ post-textarea-placeholder-fg: var(--post-scheme-color-interactive-primary-enabled-fg2),
632
727
  );
633
728
 
634
729
  $post-text-highlighted: (
635
- post-text-highlighted-bg: var(--post-mode-color-signal-information-light),
636
- post-text-highlighted-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
730
+ post-text-highlighted-bg: var(--post-scheme-color-signal-information-light),
731
+ post-text-highlighted-fg: var(--post-scheme-color-interactive-primary-enabled-fg1),
637
732
  post-text-highlighted-padding-text: var(--post-device-spacing-padding-5),
638
733
  post-text-highlighted-height-space-bottom: var(--post-core-dimension-24),
639
734
  post-text-highlighted-border-radius: var(--post-device-border-radius-1),
640
735
  );
641
736
 
642
737
  $post-text-input: (
643
- post-input-color-enabled-bg: var(--post-mode-color-interactive-primary-enabled-bg1),
644
- post-input-color-enabled-fg: var(--post-mode-color-interactive-primary-enabled-fg1),
645
- post-input-color-hover-bg: var(--post-mode-color-interactive-primary-hover-bg),
646
- post-input-color-hover-fg: var(--post-mode-color-interactive-primary-hover-fg1),
647
- post-input-color-disabled-bg: var(--post-mode-color-interactive-primary-disabled-bg),
648
- post-input-color-disabled-fg: var(--post-mode-color-interactive-primary-disabled-fg1),
649
- post-input-color-selected-bg: var(--post-mode-color-interactive-primary-selected-bg1),
650
- post-input-color-selected-fg: var(--post-mode-color-interactive-primary-selected-fg1),
651
- post-input-color-helptext-fg: var(--post-mode-color-interactive-primary-enabled-fg2),
652
- post-input-color-enabled-stroke: var(--post-mode-color-interactive-primary-enabled-stroke),
653
- post-input-color-hover-stroke: var(--post-mode-color-interactive-primary-hover-stroke),
654
- post-input-color-disabled-stroke: var(--post-mode-color-interactive-primary-disabled-stroke),
655
- post-input-color-selected-stroke: var(--post-mode-color-interactive-primary-selected-stroke1),
656
- post-input-color-signal-error: var(--post-mode-color-signal-error-dark),
657
- post-input-color-signal-success: var(--post-mode-color-signal-success-dark),
658
- post-input-color-focus-stroke: var(--post-mode-color-interactive-focus-stroke),
659
- post-input-spacing-gap-inline-1: var(--post-device-spacing-gap-1),
660
- post-input-spacing-gap-inline-2: var(--post-device-spacing-gap-inline-4),
661
- post-input-spacing-padding-block-text1: var(--post-device-spacing-padding-block-1),
662
- post-input-spacing-padding-block-text2: var(--post-device-spacing-padding-block-3),
663
- post-input-spacing-padding-block-text-assist: var(--post-device-spacing-padding-block-5),
664
- post-input-spacing-padding-block-text5: var(--post-device-spacing-padding-block-2),
665
- post-input-spacing-padding-inline-text-start: var(--post-device-spacing-padding-inline-1),
666
- post-input-spacing-padding-inline-text-end: var(--post-device-spacing-padding-3),
667
- post-input-spacing-padding-inline-text-assist: var(--post-device-spacing-padding-2),
668
- post-input-sizing-icon: var(--post-device-sizing-interactive-textfields-icon),
738
+ post-input-color-enabled-bg: var(--post-scheme-color-interactive-input-enabled-bg),
739
+ post-input-color-enabled-fg: var(--post-scheme-color-interactive-input-enabled-fg),
740
+ post-input-color-hover-bg: var(--post-scheme-color-interactive-input-hover-bg),
741
+ post-input-color-hover-fg: var(--post-scheme-color-interactive-input-hover-fg),
742
+ post-input-color-disabled-bg: var(--post-scheme-color-interactive-input-disabled-bg),
743
+ post-input-color-disabled-fg: var(--post-scheme-color-interactive-input-disabled-fg),
744
+ post-input-color-selected-bg: var(--post-scheme-color-interactive-primary-selected-bg1),
745
+ post-input-color-selected-fg: var(--post-scheme-color-interactive-input-enabled-fg),
746
+ post-input-color-helptext-fg: var(--post-scheme-color-interactive-primary-enabled-fg2),
747
+ post-input-color-enabled-border: var(--post-scheme-color-interactive-input-enabled-border),
748
+ post-input-color-hover-border: var(--post-scheme-color-interactive-input-hover-border),
749
+ post-input-color-disabled-border: var(--post-scheme-color-interactive-input-disabled-border),
750
+ post-input-color-selected-border: var(--post-scheme-color-interactive-input-enabled-border),
751
+ post-input-color-signal-error: var(--post-scheme-color-signal-error-dark),
752
+ post-input-color-signal-success: var(--post-scheme-color-signal-success-dark),
753
+ post-input-gap-inline-1: var(--post-device-spacing-gap-1),
754
+ post-input-gap-inline-2: var(--post-device-spacing-gap-inline-4),
755
+ post-input-padding-block-assist: var(--post-device-spacing-padding-block-5),
756
+ post-input-padding-block-start: var(--post-device-spacing-padding-block-29),
757
+ post-input-padding-block-end: var(--post-device-spacing-padding-block-3),
758
+ post-input-padding-inline-start: var(--post-device-spacing-padding-inline-1),
759
+ post-input-padding-inline-end: var(--post-device-spacing-padding-3),
760
+ post-input-padding-inline-assist: var(--post-device-spacing-padding-2),
761
+ post-input-sizing-icon: var(--post-device-sizing-notification-1),
762
+ post-input-sizing-height: var(--post-device-sizing-interactive-button-height-6),
669
763
  post-input-border-radius-surface: var(--post-device-border-radius-1),
764
+ post-input-border-width: var(--post-device-border-width-default),
765
+ post-input-border-style-default: var(--post-core-border-style-solid),
766
+ post-input-border-style-disabled: var(--post-core-border-style-dash),
767
+ post-input-standalone-padding-block: var(--post-device-spacing-padding-block-1),
768
+ post-input-label-empty-padding-block-start: var(--post-device-spacing-padding-block-28),
769
+ post-input-label-empty-padding-inline-start: var(--post-device-spacing-padding-5),
770
+ post-input-label-empty-padding-inline-end: var(--post-device-spacing-padding-inline-4),
771
+ post-input-label-validated-padding-inline-end: var(--post-core-dimension-50),
772
+ post-input-label-filled-padding-block-start: var(--post-device-spacing-padding-block-30),
773
+ post-input-label-filled-font-size: var(--post-device-font-size-10),
774
+ post-input-validation-icon-position-inline-end: var(--post-device-position-2),
775
+ post-input-assist-font-size: var(--post-device-font-size-10),
776
+ post-input-validated-padding-inline-end: var(--post-core-dimension-48),
670
777
  );
671
778
 
672
779
  $post-toast: (
@@ -677,50 +784,34 @@ $post-toast: (
677
784
  post-toast-spacing-gap-outer: var(--post-device-spacing-gap-inline-2),
678
785
  post-toast-spacing-gap-inner: var(--post-device-spacing-gap-2),
679
786
  post-toast-sizing-icon: var(--post-device-sizing-notification-icon-3),
680
- post-toast-color-info-bg: var(--post-mode-color-interactive-notification-info-bg),
681
- post-toast-color-info-fg: var(--post-mode-color-interactive-notification-info-fg),
682
- post-toast-color-info-stroke: var(--post-mode-color-interactive-notification-info-stroke),
683
- post-toast-color-info-icon: var(--post-mode-color-interactive-notification-info-icon),
684
- post-toast-color-success-bg: var(--post-mode-color-interactive-notification-success-bg),
685
- post-toast-color-success-fg: var(--post-mode-color-interactive-notification-success-fg),
686
- post-toast-color-success-stroke: var(--post-mode-color-interactive-notification-success-stroke),
687
- post-toast-color-success-icon: var(--post-mode-color-interactive-notification-success-icon),
688
- post-toast-color-warning-bg: var(--post-mode-color-interactive-notification-warning-bg),
689
- post-toast-color-warning-fg: var(--post-mode-color-interactive-notification-warning-fg),
690
- post-toast-color-warning-stroke: var(--post-mode-color-interactive-notification-warning-stroke),
691
- post-toast-color-warning-icon: var(--post-mode-color-interactive-notification-warning-icon),
692
- post-toast-color-error-bg: var(--post-mode-color-interactive-notification-error-bg),
693
- post-toast-color-error-fg: var(--post-mode-color-interactive-notification-error-fg),
694
- post-toast-color-error-stroke: var(--post-mode-color-interactive-notification-error-stroke),
695
- post-toast-color-error-icon: var(--post-mode-color-interactive-notification-error-icon),
696
- );
697
-
698
- $post-inline-notification: (
699
- post-inline-spacing-gap-outer: var(--post-device-spacing-gap-inline-7),
700
- post-inline-spacing-gap-inner: var(--post-device-spacing-gap-1),
701
- post-inline-spacing-padding-block: var(--post-device-spacing-padding-12),
702
- post-inline-sizing-icon: var(--post-device-sizing-notification-icon-2),
703
- post-inline-color-info-bg: var(--post-mode-color-interactive-notification-info-bg),
704
- post-inline-color-info-fg: var(--post-mode-color-interactive-notification-info-fg),
705
- post-inline-color-info-stroke: var(--post-mode-color-interactive-notification-info-stroke),
706
- post-inline-color-info-icon: var(--post-mode-color-interactive-notification-info-icon),
707
- post-inline-color-success-bg: var(--post-mode-color-interactive-notification-success-bg),
708
- post-inline-color-success-fg: var(--post-mode-color-interactive-notification-success-fg),
709
- post-inline-color-success-stroke: var(--post-mode-color-interactive-notification-success-stroke),
710
- post-inline-color-success-icon: var(--post-mode-color-interactive-notification-success-icon),
711
- post-inline-color-warning-bg: var(--post-mode-color-interactive-notification-warning-bg),
712
- post-inline-color-warning-fg: var(--post-mode-color-interactive-notification-warning-fg),
713
- post-inline-color-warning-stroke: var(--post-mode-color-interactive-notification-warning-stroke),
714
- post-inline-color-warning-icon: var(--post-mode-color-interactive-notification-warning-icon),
715
- post-inline-color-error-bg: var(--post-mode-color-interactive-notification-error-bg),
716
- post-inline-color-error-fg: var(--post-mode-color-interactive-notification-error-fg),
717
- post-inline-color-error-stroke: var(--post-mode-color-interactive-notification-error-stroke),
718
- post-inline-color-error-icon: var(--post-mode-color-interactive-notification-error-icon),
787
+ post-toast-color-info-bg: var(--post-scheme-color-interactive-notification-info-bg),
788
+ post-toast-color-info-fg: var(--post-scheme-color-interactive-notification-info-fg),
789
+ post-toast-color-info-stroke: var(--post-scheme-color-interactive-notification-info-stroke),
790
+ post-toast-color-info-icon: var(--post-scheme-color-interactive-notification-info-icon),
791
+ post-toast-color-success-bg: var(--post-scheme-color-interactive-notification-success-bg),
792
+ post-toast-color-success-fg: var(--post-scheme-color-interactive-notification-success-fg),
793
+ post-toast-color-success-stroke: var(--post-scheme-color-interactive-notification-success-stroke),
794
+ post-toast-color-success-icon: var(--post-scheme-color-interactive-notification-success-icon),
795
+ post-toast-color-warning-bg: var(--post-scheme-color-interactive-notification-warning-bg),
796
+ post-toast-color-warning-fg: var(--post-scheme-color-interactive-notification-warning-fg),
797
+ post-toast-color-warning-stroke: var(--post-scheme-color-interactive-notification-warning-stroke),
798
+ post-toast-color-warning-icon: var(--post-scheme-color-interactive-notification-warning-icon),
799
+ post-toast-color-error-bg: var(--post-scheme-color-interactive-notification-error-bg),
800
+ post-toast-color-error-fg: var(--post-scheme-color-interactive-notification-error-fg),
801
+ post-toast-color-error-stroke: var(--post-scheme-color-interactive-notification-error-stroke),
802
+ post-toast-color-error-icon: var(--post-scheme-color-interactive-notification-error-icon),
803
+ post-toast-elevation: var(--post-device-elevation-300),
719
804
  );
720
805
 
721
806
  $post-validation: (
722
- post-validation-list-gap-inline: var(--post-device-spacing-gap-inline-10),
723
- post-validation-list-padding-block-text: var(--post-device-spacing-padding-12),
724
- post-validation-error: var(--post-mode-color-signal-error-dark),
725
- post-validation-success: var(--post-mode-color-signal-success-dark),
807
+ post-validation-group-gap-inline: var(--post-device-spacing-gap-inline-10),
808
+ post-validation-group-icon-size: var(--post-device-sizing-interactive-icon-size4),
809
+ post-validation-group-icon-block-start: var(--post-core-dimension-2),
810
+ post-validation-group-icon-block-end: var(--post-core-dimension-3),
811
+ post-validation-group-padding-inline-start: var(--post-core-dimension-4),
812
+ post-validation-error: var(--post-scheme-color-signal-error-solo),
813
+ post-validation-success: var(--post-scheme-color-signal-success-solo),
814
+ post-validation-input-padding-block: var(--post-device-spacing-padding-block-5),
815
+ post-validation-input-padding-inline: var(--post-device-spacing-padding-2),
816
+ post-validation-font-size: var(--post-device-font-size-9),
726
817
  );