@empathyco/x-components 6.0.0-alpha.2 → 6.0.0-alpha.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 (343) hide show
  1. package/CHANGELOG.md +211 -1
  2. package/core/index.js +1 -0
  3. package/core/index.js.map +1 -1
  4. package/design-system/deprecated-full-theme.css +1419 -1419
  5. package/docs/API-reference/api/x-adapter-platform.md +9 -0
  6. package/docs/API-reference/api/x-adapter-platform.platformadapter.relatedprompts.md +11 -0
  7. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompt.md +22 -0
  8. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompt.nextqueries.md +11 -0
  9. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompt.suggestiontext.md +11 -0
  10. package/docs/API-reference/api/x-adapter-platform.platformrelatedprompt.type.md +11 -0
  11. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptsrequest.md +15 -0
  12. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptsresponse.data.md +13 -0
  13. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptsresponse.md +21 -0
  14. package/docs/API-reference/api/x-adapter-platform.platformrelatedpromptsresponse.status.md +11 -0
  15. package/docs/API-reference/api/x-adapter-platform.platformsearchresponse.catalog.md +6 -0
  16. package/docs/API-reference/api/x-adapter-platform.platformsearchresponse.md +1 -1
  17. package/docs/API-reference/api/x-adapter-platform.relatedpromptschema.md +13 -0
  18. package/docs/API-reference/api/x-adapter-platform.relatedpromptsendpointadapter.md +13 -0
  19. package/docs/API-reference/api/x-adapter-platform.relatedpromptsrequestmapper.md +13 -0
  20. package/docs/API-reference/api/x-adapter-platform.relatedpromptsrequestschema.md +13 -0
  21. package/docs/API-reference/api/x-adapter-platform.relatedpromptsresponsemapper.md +13 -0
  22. package/docs/API-reference/api/x-adapter-platform.relatedpromptsresponseschema.md +13 -0
  23. package/docs/API-reference/api/x-components.animationprop.md +6 -1
  24. package/docs/API-reference/api/x-components.bannerslist.md +3 -3
  25. package/docs/API-reference/api/x-components.basedropdown.md +5 -5
  26. package/docs/API-reference/api/x-components.baseeventsmodal.md +2 -2
  27. package/docs/API-reference/api/x-components.basegrid.md +3 -3
  28. package/docs/API-reference/api/x-components.baseheadertogglepanel.md +5 -5
  29. package/docs/API-reference/api/x-components.baseidmodal.md +2 -2
  30. package/docs/API-reference/api/x-components.baseidtogglepanel.md +5 -5
  31. package/docs/API-reference/api/x-components.basemodal.md +10 -10
  32. package/docs/API-reference/api/x-components.baseresultimage.md +9 -9
  33. package/docs/API-reference/api/x-components.baseslider.md +70 -0
  34. package/docs/API-reference/api/x-components.basesuggestions.md +3 -3
  35. package/docs/API-reference/api/x-components.basetabspanel.md +8 -8
  36. package/docs/API-reference/api/x-components.basetogglepanel.md +3 -3
  37. package/docs/API-reference/api/x-components.basevariablecolumngrid.md +3 -3
  38. package/docs/API-reference/api/x-components.cancelfetchandsaverelatedprompts.md +13 -0
  39. package/docs/API-reference/api/x-components.empathize.md +5 -5
  40. package/docs/API-reference/api/x-components.facets.md +3 -3
  41. package/docs/API-reference/api/x-components.fetchandsaverelatedprompts.md +13 -0
  42. package/docs/API-reference/api/x-components.fetchrelatedprompts.md +13 -0
  43. package/docs/API-reference/api/x-components.filterslist.md +3 -3
  44. package/docs/API-reference/api/x-components.globalxbus.md +6 -0
  45. package/docs/API-reference/api/x-components.hierarchicalfilter.md +5 -2
  46. package/docs/API-reference/api/x-components.identifierresults.md +3 -3
  47. package/docs/API-reference/api/x-components.installxoptions.domelement.md +1 -1
  48. package/docs/API-reference/api/x-components.installxoptions.md +1 -1
  49. package/docs/API-reference/api/x-components.itemslist.md +3 -3
  50. package/docs/API-reference/api/x-components.mainmodal.md +2 -2
  51. package/docs/API-reference/api/x-components.md +17 -0
  52. package/docs/API-reference/api/x-components.multicolumnmaxwidthlayout.md +5 -5
  53. package/docs/API-reference/api/x-components.myhistory.md +3 -3
  54. package/docs/API-reference/api/x-components.nextqueriesgroup.md +22 -0
  55. package/docs/API-reference/api/x-components.nextqueriesgroup.modelname.md +11 -0
  56. package/docs/API-reference/api/x-components.nextqueriesgroup.nextqueries.md +11 -0
  57. package/docs/API-reference/api/x-components.nextquerieslist.md +3 -3
  58. package/docs/API-reference/api/x-components.partialresultslist.md +3 -3
  59. package/docs/API-reference/api/x-components.promotedslist.md +3 -3
  60. package/docs/API-reference/api/x-components.querypreviewlist.md +3 -3
  61. package/docs/API-reference/api/x-components.recommendations.md +3 -3
  62. package/docs/API-reference/api/x-components.relatedprompt.md +38 -0
  63. package/docs/API-reference/api/x-components.relatedpromptrequest.md +13 -0
  64. package/docs/API-reference/api/x-components.relatedpromptsactioncontext.md +15 -0
  65. package/docs/API-reference/api/x-components.relatedpromptsactions.cancelfetchandsaverelatedprompts.md +17 -0
  66. package/docs/API-reference/api/x-components.relatedpromptsactions.fetchandsaverelatedprompts.md +24 -0
  67. package/docs/API-reference/api/x-components.relatedpromptsactions.fetchrelatedprompts.md +24 -0
  68. package/docs/API-reference/api/x-components.relatedpromptsactions.md +22 -0
  69. package/docs/API-reference/api/x-components.relatedpromptsgetters.md +20 -0
  70. package/docs/API-reference/api/x-components.relatedpromptsgetters.request.md +13 -0
  71. package/docs/API-reference/api/x-components.relatedpromptslist.md +72 -0
  72. package/docs/API-reference/api/x-components.relatedpromptsmutations.md +25 -0
  73. package/docs/API-reference/api/x-components.relatedpromptsmutations.resetrelatedpromptsstate.md +17 -0
  74. package/docs/API-reference/api/x-components.relatedpromptsmutations.setparams.md +24 -0
  75. package/docs/API-reference/api/x-components.relatedpromptsmutations.setrelatedpromptsproducts.md +24 -0
  76. package/docs/API-reference/api/x-components.relatedpromptsmutations.setselectedprompt.md +24 -0
  77. package/docs/API-reference/api/x-components.relatedpromptsmutations.setselectedquery.md +24 -0
  78. package/docs/API-reference/api/x-components.relatedpromptsstate.md +24 -0
  79. package/docs/API-reference/api/x-components.relatedpromptsstate.params.md +13 -0
  80. package/docs/API-reference/api/x-components.relatedpromptsstate.relatedprompts.md +13 -0
  81. package/docs/API-reference/api/x-components.relatedpromptsstate.selectedprompt.md +13 -0
  82. package/docs/API-reference/api/x-components.relatedpromptsstate.selectedquery.md +13 -0
  83. package/docs/API-reference/api/x-components.relatedpromptsxevents.md +22 -0
  84. package/docs/API-reference/api/x-components.relatedpromptsxevents.relatedpromptsrequestupdated.md +13 -0
  85. package/docs/API-reference/api/x-components.relatedpromptsxevents.userselectedarelatedprompt.md +13 -0
  86. package/docs/API-reference/api/x-components.relatedpromptsxevents.userselectedarelatedpromptquery.md +13 -0
  87. package/docs/API-reference/api/x-components.relatedpromptsxmodule.md +13 -0
  88. package/docs/API-reference/api/x-components.relatedpromptsxstoremodule.md +15 -0
  89. package/docs/API-reference/api/x-components.relatedtags.md +3 -3
  90. package/docs/API-reference/api/x-components.resultslist.md +3 -3
  91. package/docs/API-reference/api/x-components.scrolltotop.md +5 -5
  92. package/docs/API-reference/api/x-components.searchinputplaceholder.md +3 -3
  93. package/docs/API-reference/api/x-components.searchmutations.md +1 -0
  94. package/docs/API-reference/api/x-components.searchmutations.setstats.md +24 -0
  95. package/docs/API-reference/api/x-components.searchstate.md +1 -0
  96. package/docs/API-reference/api/x-components.searchstate.stats.md +13 -0
  97. package/docs/API-reference/api/x-components.selectedfilterslist.md +3 -3
  98. package/docs/API-reference/api/x-components.simplefilter.md +3 -0
  99. package/docs/API-reference/api/x-components.singlecolumnlayout.md +3 -3
  100. package/docs/API-reference/api/x-components.snippetcallbacks.md +3 -0
  101. package/docs/API-reference/api/x-components.snippetconfigextraparams.md +1 -1
  102. package/docs/API-reference/api/x-components.sortdropdown.md +1 -1
  103. package/docs/API-reference/api/x-components.tagging.md +17 -4
  104. package/docs/API-reference/api/x-components.usealiasapi.md +1 -0
  105. package/docs/API-reference/api/x-components.usealiasapi.pricestats.md +16 -0
  106. package/docs/API-reference/api/x-components.xeventstypes.md +3 -3
  107. package/docs/API-reference/api/x-components.xmodulestree.md +1 -0
  108. package/docs/API-reference/api/x-components.xmodulestree.relatedprompts.md +11 -0
  109. package/docs/API-reference/api/x-types.md +4 -0
  110. package/docs/API-reference/api/x-types.relatedprompt.md +23 -0
  111. package/docs/API-reference/api/x-types.relatedprompt.nextqueries.md +13 -0
  112. package/docs/API-reference/api/x-types.relatedprompt.suggestiontext.md +13 -0
  113. package/docs/API-reference/api/x-types.relatedprompt.type.md +13 -0
  114. package/docs/API-reference/api/x-types.relatedpromptsrequest.md +15 -0
  115. package/docs/API-reference/api/x-types.relatedpromptsresponse.md +20 -0
  116. package/docs/API-reference/api/x-types.relatedpromptsresponse.relatedprompts.md +11 -0
  117. package/docs/API-reference/api/x-types.searchresponse.md +1 -0
  118. package/docs/API-reference/api/x-types.searchresponse.stats.md +11 -0
  119. package/docs/API-reference/api/x-types.stats.md +22 -0
  120. package/docs/API-reference/api/x-types.stats.price.md +14 -0
  121. package/docs/API-reference/api/x-types.xcomponentsadapter.md +1 -0
  122. package/docs/API-reference/api/x-types.xcomponentsadapter.relatedprompts.md +11 -0
  123. package/docs/API-reference/components/common/result/x-components.base-result-image.md +2 -2
  124. package/docs/API-reference/components/common/x-components.base-slider.md +189 -0
  125. package/docs/API-reference/components/common/x-components.items-list.md +1 -1
  126. package/docs/API-reference/components/facets/x-components.facets/facets.md +1 -1
  127. package/docs/API-reference/components/facets/x-components.lists/selected-filters-list.md +1 -1
  128. package/docs/API-reference/components/related-prompts/x-components.related-prompt.md +29 -0
  129. package/docs/API-reference/components/related-prompts/x-components.related-prompts-list.md +196 -0
  130. package/docs/API-reference/components/search/x-components.results-list.md +1 -1
  131. package/docs/API-reference/components/tagging/x-components.tagging.md +2 -2
  132. package/js/components/base-grid.vue.js.map +1 -1
  133. package/js/components/base-grid.vue2.js.map +1 -1
  134. package/js/components/base-grid.vue3.js +1 -1
  135. package/js/components/base-slider.vue.js +66 -0
  136. package/js/components/base-slider.vue.js.map +1 -0
  137. package/js/components/base-slider.vue2.js +109 -0
  138. package/js/components/base-slider.vue2.js.map +1 -0
  139. package/js/components/base-slider.vue3.js +7 -0
  140. package/js/components/base-slider.vue3.js.map +1 -0
  141. package/js/components/icons/cross-tiny.vue.js +2 -2
  142. package/js/components/icons/plus.vue.js +2 -2
  143. package/js/components/items-list.vue.js.map +1 -1
  144. package/js/components/items-list.vue2.js +2 -2
  145. package/js/components/items-list.vue2.js.map +1 -1
  146. package/js/components/result/base-result-image.vue.js.map +1 -1
  147. package/js/components/result/base-result-image.vue2.js +3 -3
  148. package/js/components/result/base-result-image.vue2.js.map +1 -1
  149. package/js/components/scroll/use-scroll.js +1 -1
  150. package/js/components/scroll/use-scroll.js.map +1 -1
  151. package/js/components/sliding-panel.vue.js +2 -2
  152. package/js/composables/use-alias-api.js +3 -0
  153. package/js/composables/use-alias-api.js.map +1 -1
  154. package/js/index.js +10 -0
  155. package/js/index.js.map +1 -1
  156. package/js/types/animation-prop.js +5 -0
  157. package/js/types/animation-prop.js.map +1 -1
  158. package/js/x-installer/x-installer/x-installer.js +3 -3
  159. package/js/x-installer/x-installer/x-installer.js.map +1 -1
  160. package/js/x-modules/empathize/components/empathize.vue2.js +2 -0
  161. package/js/x-modules/empathize/components/empathize.vue2.js.map +1 -1
  162. package/js/x-modules/extra-params/components/snippet-config-extra-params.vue.js.map +1 -1
  163. package/js/x-modules/extra-params/components/snippet-config-extra-params.vue2.js +1 -1
  164. package/js/x-modules/extra-params/components/snippet-config-extra-params.vue2.js.map +1 -1
  165. package/js/x-modules/facets/components/facets/facets.vue.js.map +1 -1
  166. package/js/x-modules/facets/components/facets/facets.vue2.js +2 -2
  167. package/js/x-modules/facets/components/facets/facets.vue2.js.map +1 -1
  168. package/js/x-modules/facets/components/lists/selected-filters-list.vue.js.map +1 -1
  169. package/js/x-modules/facets/components/lists/selected-filters-list.vue2.js +2 -2
  170. package/js/x-modules/facets/components/lists/selected-filters-list.vue2.js.map +1 -1
  171. package/js/x-modules/queries-preview/components/query-preview-button.vue2.js +2 -0
  172. package/js/x-modules/queries-preview/components/query-preview-button.vue2.js.map +1 -1
  173. package/js/x-modules/queries-preview/components/query-preview-list.vue.js.map +1 -1
  174. package/js/x-modules/queries-preview/components/query-preview-list.vue2.js +15 -2
  175. package/js/x-modules/queries-preview/components/query-preview-list.vue2.js.map +1 -1
  176. package/js/x-modules/queries-preview/components/query-preview.vue.js.map +1 -1
  177. package/js/x-modules/queries-preview/components/query-preview.vue2.js +3 -1
  178. package/js/x-modules/queries-preview/components/query-preview.vue2.js.map +1 -1
  179. package/js/x-modules/queries-preview/store/actions/fetch-and-save-query-preview.action.js +2 -1
  180. package/js/x-modules/queries-preview/store/actions/fetch-and-save-query-preview.action.js.map +1 -1
  181. package/js/x-modules/queries-preview/store/module.js +1 -1
  182. package/js/x-modules/queries-preview/store/module.js.map +1 -1
  183. package/js/x-modules/queries-preview/utils/get-hash-from-query-preview.js +6 -4
  184. package/js/x-modules/queries-preview/utils/get-hash-from-query-preview.js.map +1 -1
  185. package/js/x-modules/related-prompts/components/related-prompt.vue.js +90 -0
  186. package/js/x-modules/related-prompts/components/related-prompt.vue.js.map +1 -0
  187. package/js/x-modules/related-prompts/components/related-prompt.vue2.js +54 -0
  188. package/js/x-modules/related-prompts/components/related-prompt.vue2.js.map +1 -0
  189. package/js/x-modules/related-prompts/components/related-prompt.vue3.js +7 -0
  190. package/js/x-modules/related-prompts/components/related-prompt.vue3.js.map +1 -0
  191. package/js/x-modules/related-prompts/components/related-prompts-list.vue.js +154 -0
  192. package/js/x-modules/related-prompts/components/related-prompts-list.vue.js.map +1 -0
  193. package/js/x-modules/related-prompts/components/related-prompts-list.vue2.js +6 -0
  194. package/js/x-modules/related-prompts/components/related-prompts-list.vue2.js.map +1 -0
  195. package/js/x-modules/related-prompts/store/actions/fetch-and-save-related-prompts.action.js +29 -0
  196. package/js/x-modules/related-prompts/store/actions/fetch-and-save-related-prompts.action.js.map +1 -0
  197. package/js/x-modules/related-prompts/store/actions/fetch-related-prompts.action.js +20 -0
  198. package/js/x-modules/related-prompts/store/actions/fetch-related-prompts.action.js.map +1 -0
  199. package/js/x-modules/related-prompts/store/emitters.js +14 -0
  200. package/js/x-modules/related-prompts/store/emitters.js.map +1 -0
  201. package/js/x-modules/related-prompts/store/getters/request.getter.js +16 -0
  202. package/js/x-modules/related-prompts/store/getters/request.getter.js.map +1 -0
  203. package/js/x-modules/related-prompts/store/module.js +53 -0
  204. package/js/x-modules/related-prompts/store/module.js.map +1 -0
  205. package/js/x-modules/related-prompts/wiring.js +88 -0
  206. package/js/x-modules/related-prompts/wiring.js.map +1 -0
  207. package/js/x-modules/related-prompts/x-module.js +21 -0
  208. package/js/x-modules/related-prompts/x-module.js.map +1 -0
  209. package/js/x-modules/scroll/components/scroll-to-top.vue2.js +2 -0
  210. package/js/x-modules/scroll/components/scroll-to-top.vue2.js.map +1 -1
  211. package/js/x-modules/search/components/results-list.vue.js +2 -2
  212. package/js/x-modules/search/components/results-list.vue.js.map +1 -1
  213. package/js/x-modules/search/store/actions/save-search-response.action.js +2 -1
  214. package/js/x-modules/search/store/actions/save-search-response.action.js.map +1 -1
  215. package/js/x-modules/search/store/module.js +5 -1
  216. package/js/x-modules/search/store/module.js.map +1 -1
  217. package/js/x-modules/tagging/components/tagging.vue.js +8 -2
  218. package/js/x-modules/tagging/components/tagging.vue.js.map +1 -1
  219. package/package.json +7 -6
  220. package/related-prompts/index.d.ts +1 -0
  221. package/related-prompts/index.js +9 -0
  222. package/report/x-adapter-platform.api.json +575 -1
  223. package/report/x-components.api.json +4235 -7898
  224. package/report/x-components.api.md +447 -157
  225. package/report/x-types.api.json +334 -0
  226. package/tools/inject-css.js +5 -3
  227. package/types/adapter/e2e-adapter.d.ts.map +1 -1
  228. package/types/adapter/mocked-responses.d.ts +3 -0
  229. package/types/adapter/mocked-responses.d.ts.map +1 -1
  230. package/types/components/base-dropdown.vue.d.ts +5 -5
  231. package/types/components/base-grid.vue.d.ts +3 -3
  232. package/types/components/base-slider.vue.d.ts +74 -0
  233. package/types/components/base-slider.vue.d.ts.map +1 -0
  234. package/types/components/base-variable-column-grid.vue.d.ts +3 -3
  235. package/types/components/global-x-bus.vue.d.ts +6 -0
  236. package/types/components/global-x-bus.vue.d.ts.map +1 -1
  237. package/types/components/index.d.ts +1 -0
  238. package/types/components/index.d.ts.map +1 -1
  239. package/types/components/items-list.vue.d.ts +3 -3
  240. package/types/components/layouts/multi-column-max-width-layout.vue.d.ts +5 -5
  241. package/types/components/layouts/single-column-layout.vue.d.ts +3 -3
  242. package/types/components/modals/base-events-modal.vue.d.ts +2 -2
  243. package/types/components/modals/base-id-modal.vue.d.ts +2 -2
  244. package/types/components/modals/base-modal.vue.d.ts +10 -10
  245. package/types/components/modals/main-modal.vue.d.ts +2 -2
  246. package/types/components/panels/base-header-toggle-panel.vue.d.ts +5 -5
  247. package/types/components/panels/base-id-toggle-panel.vue.d.ts +5 -5
  248. package/types/components/panels/base-tabs-panel.vue.d.ts +8 -8
  249. package/types/components/panels/base-toggle-panel.vue.d.ts +3 -3
  250. package/types/components/result/base-result-image.vue.d.ts +10 -10
  251. package/types/components/result/base-result-image.vue.d.ts.map +1 -1
  252. package/types/components/snippet-callbacks.vue.d.ts +3 -0
  253. package/types/components/snippet-callbacks.vue.d.ts.map +1 -1
  254. package/types/components/suggestions/base-suggestions.vue.d.ts +3 -3
  255. package/types/composables/use-alias-api.d.ts +5 -0
  256. package/types/composables/use-alias-api.d.ts.map +1 -1
  257. package/types/index.d.ts +1 -0
  258. package/types/index.d.ts.map +1 -1
  259. package/types/tailwind/plugin-options.d.ts +1 -2
  260. package/types/tailwind/plugin-options.d.ts.map +1 -1
  261. package/types/types/animation-prop.d.ts +6 -2
  262. package/types/types/animation-prop.d.ts.map +1 -1
  263. package/types/views/home/types.d.ts +3 -0
  264. package/types/views/home/types.d.ts.map +1 -1
  265. package/types/wiring/events.types.d.ts +3 -1
  266. package/types/wiring/events.types.d.ts.map +1 -1
  267. package/types/x-installer/x-installer/types.d.ts +1 -1
  268. package/types/x-installer/x-installer/types.d.ts.map +1 -1
  269. package/types/x-installer/x-installer/x-installer.d.ts +4 -4
  270. package/types/x-installer/x-installer/x-installer.d.ts.map +1 -1
  271. package/types/x-modules/empathize/components/empathize.vue.d.ts +5 -5
  272. package/types/x-modules/extra-params/components/snippet-config-extra-params.vue.d.ts +1 -1
  273. package/types/x-modules/facets/components/facets/facets.vue.d.ts +3 -3
  274. package/types/x-modules/facets/components/filters/hierarchical-filter.vue.d.ts +5 -2
  275. package/types/x-modules/facets/components/filters/hierarchical-filter.vue.d.ts.map +1 -1
  276. package/types/x-modules/facets/components/filters/simple-filter.vue.d.ts +3 -0
  277. package/types/x-modules/facets/components/filters/simple-filter.vue.d.ts.map +1 -1
  278. package/types/x-modules/facets/components/lists/filters-list.vue.d.ts +3 -3
  279. package/types/x-modules/facets/components/lists/selected-filters-list.vue.d.ts +3 -3
  280. package/types/x-modules/history-queries/components/my-history.vue.d.ts +3 -3
  281. package/types/x-modules/identifier-results/components/identifier-results.vue.d.ts +3 -3
  282. package/types/x-modules/next-queries/components/next-queries-list.vue.d.ts +3 -3
  283. package/types/x-modules/next-queries/index.d.ts +1 -0
  284. package/types/x-modules/next-queries/index.d.ts.map +1 -1
  285. package/types/x-modules/queries-preview/components/query-preview-list.vue.d.ts +3 -3
  286. package/types/x-modules/queries-preview/components/query-preview-list.vue.d.ts.map +1 -1
  287. package/types/x-modules/queries-preview/components/query-preview.vue.d.ts.map +1 -1
  288. package/types/x-modules/queries-preview/store/actions/fetch-and-save-query-preview.action.d.ts.map +1 -1
  289. package/types/x-modules/queries-preview/store/module.d.ts.map +1 -1
  290. package/types/x-modules/queries-preview/utils/get-hash-from-query-preview.d.ts +4 -2
  291. package/types/x-modules/queries-preview/utils/get-hash-from-query-preview.d.ts.map +1 -1
  292. package/types/x-modules/recommendations/components/recommendations.vue.d.ts +3 -3
  293. package/types/x-modules/related-prompts/components/index.d.ts +3 -0
  294. package/types/x-modules/related-prompts/components/index.d.ts.map +1 -0
  295. package/types/x-modules/related-prompts/components/related-prompt.vue.d.ts +37 -0
  296. package/types/x-modules/related-prompts/components/related-prompt.vue.d.ts.map +1 -0
  297. package/types/x-modules/related-prompts/components/related-prompts-list.vue.d.ts +106 -0
  298. package/types/x-modules/related-prompts/components/related-prompts-list.vue.d.ts.map +1 -0
  299. package/types/x-modules/related-prompts/events.types.d.ts +26 -0
  300. package/types/x-modules/related-prompts/events.types.d.ts.map +1 -0
  301. package/types/x-modules/related-prompts/index.d.ts +6 -0
  302. package/types/x-modules/related-prompts/index.d.ts.map +1 -0
  303. package/types/x-modules/related-prompts/store/actions/fetch-and-save-related-prompts.action.d.ts +17 -0
  304. package/types/x-modules/related-prompts/store/actions/fetch-and-save-related-prompts.action.d.ts.map +1 -0
  305. package/types/x-modules/related-prompts/store/actions/fetch-related-prompts.action.d.ts +13 -0
  306. package/types/x-modules/related-prompts/store/actions/fetch-related-prompts.action.d.ts.map +1 -0
  307. package/types/x-modules/related-prompts/store/emitters.d.ts +9 -0
  308. package/types/x-modules/related-prompts/store/emitters.d.ts.map +1 -0
  309. package/types/x-modules/related-prompts/store/getters/request.getter.d.ts +13 -0
  310. package/types/x-modules/related-prompts/store/getters/request.getter.d.ts.map +1 -0
  311. package/types/x-modules/related-prompts/store/index.d.ts +7 -0
  312. package/types/x-modules/related-prompts/store/index.d.ts.map +1 -0
  313. package/types/x-modules/related-prompts/store/module.d.ts +8 -0
  314. package/types/x-modules/related-prompts/store/module.d.ts.map +1 -0
  315. package/types/x-modules/related-prompts/store/types.d.ts +104 -0
  316. package/types/x-modules/related-prompts/store/types.d.ts.map +1 -0
  317. package/types/x-modules/related-prompts/types.d.ts +10 -0
  318. package/types/x-modules/related-prompts/types.d.ts.map +1 -0
  319. package/types/x-modules/related-prompts/wiring.d.ts +31 -0
  320. package/types/x-modules/related-prompts/wiring.d.ts.map +1 -0
  321. package/types/x-modules/related-prompts/x-module.d.ts +16 -0
  322. package/types/x-modules/related-prompts/x-module.d.ts.map +1 -0
  323. package/types/x-modules/related-tags/components/related-tags.vue.d.ts +3 -3
  324. package/types/x-modules/scroll/components/scroll-to-top.vue.d.ts +5 -5
  325. package/types/x-modules/search/components/banners-list.vue.d.ts +3 -3
  326. package/types/x-modules/search/components/partial-results-list.vue.d.ts +3 -3
  327. package/types/x-modules/search/components/promoteds-list.vue.d.ts +3 -3
  328. package/types/x-modules/search/components/results-list.vue.d.ts +3 -3
  329. package/types/x-modules/search/components/sort-dropdown.vue.d.ts +1 -1
  330. package/types/x-modules/search/store/actions/save-search-response.action.d.ts.map +1 -1
  331. package/types/x-modules/search/store/module.d.ts +2 -0
  332. package/types/x-modules/search/store/module.d.ts.map +1 -1
  333. package/types/x-modules/search/store/types.d.ts +9 -1
  334. package/types/x-modules/search/store/types.d.ts.map +1 -1
  335. package/types/x-modules/search-box/components/search-input-placeholder.vue.d.ts +3 -3
  336. package/types/x-modules/tagging/components/tagging.vue.d.ts +17 -4
  337. package/types/x-modules/tagging/components/tagging.vue.d.ts.map +1 -1
  338. package/types/x-modules/x-modules.types.d.ts +2 -0
  339. package/types/x-modules/x-modules.types.d.ts.map +1 -1
  340. package/js/utils/options-api.js +0 -4
  341. package/js/utils/options-api.js.map +0 -1
  342. package/types/utils/options-api.d.ts +0 -3
  343. package/types/utils/options-api.d.ts.map +0 -1
@@ -14,7 +14,6 @@
14
14
  .x-normal-case {
15
15
  text-transform: none;
16
16
  }
17
-
18
17
  .x-static {
19
18
  position: static !important;
20
19
  }
@@ -34,6 +33,25 @@
34
33
  .x-sticky {
35
34
  position: sticky !important;
36
35
  }
36
+ .x-underline {
37
+ -webkit-text-decoration-line: underline;
38
+ text-decoration-line: underline;
39
+ }
40
+
41
+ .x-overline {
42
+ -webkit-text-decoration-line: overline;
43
+ text-decoration-line: overline;
44
+ }
45
+
46
+ .x-line-through {
47
+ -webkit-text-decoration-line: line-through;
48
+ text-decoration-line: line-through;
49
+ }
50
+
51
+ .x-no-underline {
52
+ -webkit-text-decoration-line: none;
53
+ text-decoration-line: none;
54
+ }
37
55
  .x-padding--00 {
38
56
  padding: 0 !important;
39
57
  }
@@ -475,25 +493,6 @@
475
493
  [dir="rtl"] .x-padding--left-20 {
476
494
  padding-right: var(--x-size-base-20) !important;
477
495
  }
478
- .x-underline {
479
- -webkit-text-decoration-line: underline;
480
- text-decoration-line: underline;
481
- }
482
-
483
- .x-overline {
484
- -webkit-text-decoration-line: overline;
485
- text-decoration-line: overline;
486
- }
487
-
488
- .x-line-through {
489
- -webkit-text-decoration-line: line-through;
490
- text-decoration-line: line-through;
491
- }
492
-
493
- .x-no-underline {
494
- -webkit-text-decoration-line: none;
495
- text-decoration-line: none;
496
- }
497
496
  .x-margin--auto {
498
497
  margin: auto !important;
499
498
  }
@@ -1145,49 +1144,6 @@
1145
1144
  .x-font-color--transparent {
1146
1145
  color: var(--x-color-base-transparent) !important;
1147
1146
  }
1148
- .x-flex-1 {
1149
- flex: 1 1 0% !important;
1150
- }
1151
-
1152
- .x-flex-auto {
1153
- flex: 1 1 auto !important;
1154
- }
1155
-
1156
- .x-flex-initial {
1157
- flex: 0 1 auto !important;
1158
- }
1159
-
1160
- .x-flex-no-shrink {
1161
- flex: 1 0 auto !important;
1162
- }
1163
-
1164
- .x-flex-none {
1165
- flex: none !important;
1166
- }
1167
-
1168
- .x-self-auto {
1169
- align-self: auto !important;
1170
- }
1171
-
1172
- .x-self-start {
1173
- align-self: flex-start !important;
1174
- }
1175
-
1176
- .x-self-end {
1177
- align-self: flex-end !important;
1178
- }
1179
-
1180
- .x-self-center {
1181
- align-self: center !important;
1182
- }
1183
-
1184
- .x-self-stretch {
1185
- align-self: stretch !important;
1186
- }
1187
-
1188
- .x-self-baseline {
1189
- align-self: baseline !important;
1190
- }
1191
1147
  .x-fill--lead {
1192
1148
  fill: var(--x-color-base-lead) !important;
1193
1149
  }
@@ -1231,73 +1187,48 @@
1231
1187
  .x-fill--transparent {
1232
1188
  fill: var(--x-color-base-transparent) !important;
1233
1189
  }
1234
- /* Material Elevations extracted from:
1235
- https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
1236
- */
1237
- :root {
1238
- /* Shadow none */
1239
- --x-string-box-shadow-00: none;
1240
- /* Shadow 1dp */
1241
- --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
1242
- 0 1px 3px 0 rgba(0, 0, 0, 0.2);
1243
- /* Shadow 2dp */
1244
- --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
1245
- 0 1px 5px 0 rgba(0, 0, 0, 0.2);
1246
- /* Shadow 3dp */
1247
- --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
1248
- 0 1px 8px 0 rgba(0, 0, 0, 0.2);
1249
- /* Shadow 4dp */
1250
- --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
1251
- 0 2px 4px -1px rgba(0, 0, 0, 0.2);
1252
- /* Shadow 6dp */
1253
- --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
1254
- 0 3px 5px -1px rgba(0, 0, 0, 0.2);
1255
- /* Shadow 8dp */
1256
- --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
1257
- 0 5px 5px -3px rgba(0, 0, 0, 0.2);
1258
- /* Shadow 9dp */
1259
- --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
1260
- 0 5px 6px -3px rgba(0, 0, 0, 0.2);
1261
- /* Shadow 12dp */
1262
- --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
1263
- 0 7px 8px -4px rgba(0, 0, 0, 0.2);
1264
- /* Shadow 16dp */
1265
- --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
1266
- 0 8px 10px -5px rgba(0, 0, 0, 0.2);
1267
- /* Shadow 24dp */
1268
- --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
1269
- 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1270
- /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
1271
- /* Shadow 1dp */
1272
- --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
1273
- 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
1274
- /* Shadow 2dp */
1275
- --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
1276
- 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
1277
- /* Shadow 3dp */
1278
- --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
1279
- 0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
1280
- /* Shadow 4dp */
1281
- --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
1282
- 0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
1283
- /* Shadow 6dp */
1284
- --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
1285
- 0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
1286
- /* Shadow 8dp */
1287
- --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
1288
- 0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
1289
- /* Shadow 9dp */
1290
- --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
1291
- 0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
1292
- /* Shadow 12dp */
1293
- --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
1294
- 0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
1295
- /* Shadow 16dp */
1296
- --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
1297
- 0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
1298
- /* Shadow 24dp */
1299
- --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1300
- 0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1190
+ .x-flex-1 {
1191
+ flex: 1 1 0% !important;
1192
+ }
1193
+
1194
+ .x-flex-auto {
1195
+ flex: 1 1 auto !important;
1196
+ }
1197
+
1198
+ .x-flex-initial {
1199
+ flex: 0 1 auto !important;
1200
+ }
1201
+
1202
+ .x-flex-no-shrink {
1203
+ flex: 1 0 auto !important;
1204
+ }
1205
+
1206
+ .x-flex-none {
1207
+ flex: none !important;
1208
+ }
1209
+
1210
+ .x-self-auto {
1211
+ align-self: auto !important;
1212
+ }
1213
+
1214
+ .x-self-start {
1215
+ align-self: flex-start !important;
1216
+ }
1217
+
1218
+ .x-self-end {
1219
+ align-self: flex-end !important;
1220
+ }
1221
+
1222
+ .x-self-center {
1223
+ align-self: center !important;
1224
+ }
1225
+
1226
+ .x-self-stretch {
1227
+ align-self: stretch !important;
1228
+ }
1229
+
1230
+ .x-self-baseline {
1231
+ align-self: baseline !important;
1301
1232
  }
1302
1233
  /* Material Elevations extracted from:
1303
1234
  https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
@@ -1367,71 +1298,6 @@
1367
1298
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
1368
1299
  0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
1369
1300
  }
1370
-
1371
- .x-shadow--none {
1372
- box-shadow: none !important;
1373
- }
1374
-
1375
- .x-shadow--01 {
1376
- box-shadow: var(--x-string-box-shadow-01) !important;
1377
- }
1378
- .x-shadow--bottom-01 {
1379
- box-shadow: var(--x-string-box-shadow-bottom-01) !important;
1380
- }
1381
- .x-shadow--02 {
1382
- box-shadow: var(--x-string-box-shadow-02) !important;
1383
- }
1384
- .x-shadow--bottom-02 {
1385
- box-shadow: var(--x-string-box-shadow-bottom-02) !important;
1386
- }
1387
- .x-shadow--03 {
1388
- box-shadow: var(--x-string-box-shadow-03) !important;
1389
- }
1390
- .x-shadow--bottom-03 {
1391
- box-shadow: var(--x-string-box-shadow-bottom-03) !important;
1392
- }
1393
- .x-shadow--04 {
1394
- box-shadow: var(--x-string-box-shadow-04) !important;
1395
- }
1396
- .x-shadow--bottom-04 {
1397
- box-shadow: var(--x-string-box-shadow-bottom-04) !important;
1398
- }
1399
- .x-shadow--05 {
1400
- box-shadow: var(--x-string-box-shadow-05) !important;
1401
- }
1402
- .x-shadow--bottom-05 {
1403
- box-shadow: var(--x-string-box-shadow-bottom-05) !important;
1404
- }
1405
- .x-shadow--06 {
1406
- box-shadow: var(--x-string-box-shadow-06) !important;
1407
- }
1408
- .x-shadow--bottom-06 {
1409
- box-shadow: var(--x-string-box-shadow-bottom-06) !important;
1410
- }
1411
- .x-shadow--07 {
1412
- box-shadow: var(--x-string-box-shadow-07) !important;
1413
- }
1414
- .x-shadow--bottom-07 {
1415
- box-shadow: var(--x-string-box-shadow-bottom-07) !important;
1416
- }
1417
- .x-shadow--08 {
1418
- box-shadow: var(--x-string-box-shadow-08) !important;
1419
- }
1420
- .x-shadow--bottom-08 {
1421
- box-shadow: var(--x-string-box-shadow-bottom-08) !important;
1422
- }
1423
- .x-shadow--09 {
1424
- box-shadow: var(--x-string-box-shadow-09) !important;
1425
- }
1426
- .x-shadow--bottom-09 {
1427
- box-shadow: var(--x-string-box-shadow-bottom-09) !important;
1428
- }
1429
- .x-shadow--10 {
1430
- box-shadow: var(--x-string-box-shadow-10) !important;
1431
- }
1432
- .x-shadow--bottom-10 {
1433
- box-shadow: var(--x-string-box-shadow-bottom-10) !important;
1434
- }
1435
1301
  *[class*=x-border-width--] {
1436
1302
  border-width: 0;
1437
1303
  }
@@ -3274,6 +3140,22 @@
3274
3140
  [dir="rtl"] .x-border-radius--bottom-right-20 {
3275
3141
  border-bottom-left-radius: var(--x-size-base-20) !important;
3276
3142
  }
3143
+
3144
+ .x-text--stroke.x-text {
3145
+ --x-string-text-decoration: line-through;
3146
+ }
3147
+ .x-text--stroke.x-title1 {
3148
+ --x-string-text-decoration-title1: line-through;
3149
+ }
3150
+ .x-text--stroke.x-title2 {
3151
+ --x-string-text-decoration-title2: line-through;
3152
+ }
3153
+ .x-text--stroke.x-title3 {
3154
+ --x-string-text-decoration-title3: line-through;
3155
+ }
3156
+ .x-text--stroke.x-small {
3157
+ --x-string-text-decoration-small: line-through;
3158
+ }
3277
3159
  .x-background--lead {
3278
3160
  background-color: var(--x-color-base-lead) !important;
3279
3161
  }
@@ -3317,69 +3199,23 @@
3317
3199
  .x-background--transparent {
3318
3200
  background-color: var(--x-color-base-transparent) !important;
3319
3201
  }
3320
- .x-border-color--lead {
3321
- border-color: var(--x-color-base-lead) !important;
3322
- }
3323
-
3324
- .x-border-color--auxiliary {
3325
- border-color: var(--x-color-base-auxiliary) !important;
3326
- }
3327
-
3328
- .x-border-color--neutral-10 {
3329
- border-color: var(--x-color-base-neutral-10) !important;
3330
- }
3331
-
3332
- .x-border-color--neutral-35 {
3333
- border-color: var(--x-color-base-neutral-35) !important;
3334
- }
3335
-
3336
- .x-border-color--neutral-70 {
3337
- border-color: var(--x-color-base-neutral-70) !important;
3338
- }
3339
-
3340
- .x-border-color--neutral-95 {
3341
- border-color: var(--x-color-base-neutral-95) !important;
3342
- }
3343
-
3344
- .x-border-color--neutral-100 {
3345
- border-color: var(--x-color-base-neutral-100) !important;
3346
- }
3347
-
3348
- .x-border-color--accent {
3349
- border-color: var(--x-color-base-accent) !important;
3350
- }
3351
-
3352
- .x-border-color--enable {
3353
- border-color: var(--x-color-base-enable) !important;
3354
- }
3355
-
3356
- .x-border-color--disable {
3357
- border-color: var(--x-color-base-disable) !important;
3358
- }
3359
-
3360
- .x-border-color--transparent {
3361
- border-color: var(--x-color-base-transparent) !important;
3362
- }
3363
- .x-text--stroke.x-text {
3364
- --x-string-text-decoration: line-through;
3365
- }
3366
- .x-text--stroke.x-title1 {
3367
- --x-string-text-decoration-title1: line-through;
3202
+ .x-text--secondary {
3203
+ --x-color-text-default: var(--x-color-text-secondary);
3368
3204
  }
3369
- .x-text--stroke.x-title2 {
3370
- --x-string-text-decoration-title2: line-through;
3205
+ .x-text--light.x-text {
3206
+ --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3371
3207
  }
3372
- .x-text--stroke.x-title3 {
3373
- --x-string-text-decoration-title3: line-through;
3208
+ .x-text--light.x-title1 {
3209
+ --x-number-font-weight-title1: var(--x-number-font-weight-base-light);
3374
3210
  }
3375
- .x-text--stroke.x-small {
3376
- --x-string-text-decoration-small: line-through;
3211
+ .x-text--light.x-title2 {
3212
+ --x-number-font-weight-title2: var(--x-number-font-weight-base-light);
3377
3213
  }
3378
- :root {
3379
- --x-color-text-secondary: var(--x-color-base-neutral-35);
3214
+ .x-text--light.x-title3 {
3215
+ --x-number-font-weight-title3: var(--x-number-font-weight-base-light);
3380
3216
  }
3381
- .x-text--secondary {
3382
- --x-color-text-default: var(--x-color-text-secondary);
3217
+ .x-text--light.x-small {
3218
+ --x-number-font-weight-small: var(--x-number-font-weight-base-light);
3383
3219
  }
3384
3220
  :root {
3385
3221
  --x-font-family-base: "Montserrat", sans-serif;
@@ -3421,21 +3257,6 @@
3421
3257
  --x-size-line-height-small: var(--x-size-line-height-base-s);
3422
3258
  --x-string-text-decoration-small: none;
3423
3259
  }
3424
- .x-text--light.x-text {
3425
- --x-number-font-weight-text: var(--x-number-font-weight-base-light);
3426
- }
3427
- .x-text--light.x-title1 {
3428
- --x-number-font-weight-title1: var(--x-number-font-weight-base-light);
3429
- }
3430
- .x-text--light.x-title2 {
3431
- --x-number-font-weight-title2: var(--x-number-font-weight-base-light);
3432
- }
3433
- .x-text--light.x-title3 {
3434
- --x-number-font-weight-title3: var(--x-number-font-weight-base-light);
3435
- }
3436
- .x-text--light.x-small {
3437
- --x-number-font-weight-small: var(--x-number-font-weight-base-light);
3438
- }
3439
3260
  :root {
3440
3261
  --x-font-family-base: "Montserrat", sans-serif;
3441
3262
  --x-size-font-base-xs: 12px;
@@ -3538,6 +3359,139 @@
3538
3359
  overflow: hidden;
3539
3360
  white-space: nowrap;
3540
3361
  }
3362
+ /* Material Elevations extracted from:
3363
+ https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
3364
+ */
3365
+ :root {
3366
+ /* Shadow none */
3367
+ --x-string-box-shadow-00: none;
3368
+ /* Shadow 1dp */
3369
+ --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
3370
+ 0 1px 3px 0 rgba(0, 0, 0, 0.2);
3371
+ /* Shadow 2dp */
3372
+ --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
3373
+ 0 1px 5px 0 rgba(0, 0, 0, 0.2);
3374
+ /* Shadow 3dp */
3375
+ --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
3376
+ 0 1px 8px 0 rgba(0, 0, 0, 0.2);
3377
+ /* Shadow 4dp */
3378
+ --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
3379
+ 0 2px 4px -1px rgba(0, 0, 0, 0.2);
3380
+ /* Shadow 6dp */
3381
+ --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
3382
+ 0 3px 5px -1px rgba(0, 0, 0, 0.2);
3383
+ /* Shadow 8dp */
3384
+ --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
3385
+ 0 5px 5px -3px rgba(0, 0, 0, 0.2);
3386
+ /* Shadow 9dp */
3387
+ --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
3388
+ 0 5px 6px -3px rgba(0, 0, 0, 0.2);
3389
+ /* Shadow 12dp */
3390
+ --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
3391
+ 0 7px 8px -4px rgba(0, 0, 0, 0.2);
3392
+ /* Shadow 16dp */
3393
+ --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
3394
+ 0 8px 10px -5px rgba(0, 0, 0, 0.2);
3395
+ /* Shadow 24dp */
3396
+ --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
3397
+ 0 11px 15px -7px rgba(0, 0, 0, 0.2);
3398
+ /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
3399
+ /* Shadow 1dp */
3400
+ --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
3401
+ 0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
3402
+ /* Shadow 2dp */
3403
+ --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
3404
+ 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
3405
+ /* Shadow 3dp */
3406
+ --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
3407
+ 0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
3408
+ /* Shadow 4dp */
3409
+ --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
3410
+ 0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
3411
+ /* Shadow 6dp */
3412
+ --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
3413
+ 0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
3414
+ /* Shadow 8dp */
3415
+ --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
3416
+ 0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
3417
+ /* Shadow 9dp */
3418
+ --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
3419
+ 0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
3420
+ /* Shadow 12dp */
3421
+ --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
3422
+ 0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
3423
+ /* Shadow 16dp */
3424
+ --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
3425
+ 0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
3426
+ /* Shadow 24dp */
3427
+ --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
3428
+ 0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
3429
+ }
3430
+
3431
+ .x-shadow--none {
3432
+ box-shadow: none !important;
3433
+ }
3434
+
3435
+ .x-shadow--01 {
3436
+ box-shadow: var(--x-string-box-shadow-01) !important;
3437
+ }
3438
+ .x-shadow--bottom-01 {
3439
+ box-shadow: var(--x-string-box-shadow-bottom-01) !important;
3440
+ }
3441
+ .x-shadow--02 {
3442
+ box-shadow: var(--x-string-box-shadow-02) !important;
3443
+ }
3444
+ .x-shadow--bottom-02 {
3445
+ box-shadow: var(--x-string-box-shadow-bottom-02) !important;
3446
+ }
3447
+ .x-shadow--03 {
3448
+ box-shadow: var(--x-string-box-shadow-03) !important;
3449
+ }
3450
+ .x-shadow--bottom-03 {
3451
+ box-shadow: var(--x-string-box-shadow-bottom-03) !important;
3452
+ }
3453
+ .x-shadow--04 {
3454
+ box-shadow: var(--x-string-box-shadow-04) !important;
3455
+ }
3456
+ .x-shadow--bottom-04 {
3457
+ box-shadow: var(--x-string-box-shadow-bottom-04) !important;
3458
+ }
3459
+ .x-shadow--05 {
3460
+ box-shadow: var(--x-string-box-shadow-05) !important;
3461
+ }
3462
+ .x-shadow--bottom-05 {
3463
+ box-shadow: var(--x-string-box-shadow-bottom-05) !important;
3464
+ }
3465
+ .x-shadow--06 {
3466
+ box-shadow: var(--x-string-box-shadow-06) !important;
3467
+ }
3468
+ .x-shadow--bottom-06 {
3469
+ box-shadow: var(--x-string-box-shadow-bottom-06) !important;
3470
+ }
3471
+ .x-shadow--07 {
3472
+ box-shadow: var(--x-string-box-shadow-07) !important;
3473
+ }
3474
+ .x-shadow--bottom-07 {
3475
+ box-shadow: var(--x-string-box-shadow-bottom-07) !important;
3476
+ }
3477
+ .x-shadow--08 {
3478
+ box-shadow: var(--x-string-box-shadow-08) !important;
3479
+ }
3480
+ .x-shadow--bottom-08 {
3481
+ box-shadow: var(--x-string-box-shadow-bottom-08) !important;
3482
+ }
3483
+ .x-shadow--09 {
3484
+ box-shadow: var(--x-string-box-shadow-09) !important;
3485
+ }
3486
+ .x-shadow--bottom-09 {
3487
+ box-shadow: var(--x-string-box-shadow-bottom-09) !important;
3488
+ }
3489
+ .x-shadow--10 {
3490
+ box-shadow: var(--x-string-box-shadow-10) !important;
3491
+ }
3492
+ .x-shadow--bottom-10 {
3493
+ box-shadow: var(--x-string-box-shadow-bottom-10) !important;
3494
+ }
3541
3495
  .x-text--bold.x-text {
3542
3496
  --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
3543
3497
  }
@@ -3553,12 +3507,6 @@
3553
3507
  .x-text--bold.x-small {
3554
3508
  --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
3555
3509
  }
3556
- :root {
3557
- --x-color-text-accent: var(--x-color-base-accent);
3558
- }
3559
- .x-text--accent {
3560
- --x-color-text-default: var(--x-color-text-accent);
3561
- }
3562
3510
  :root {
3563
3511
  --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3564
3512
  --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
@@ -3566,23 +3514,11 @@
3566
3514
  --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3567
3515
  --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3568
3516
  }
3569
-
3570
- .x-tag--pill.x-tag,
3571
- .x-tag--pill .x-tag {
3572
- --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-pill);
3573
- --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-pill);
3574
- --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-pill);
3575
- --x-size-border-radius-bottom-right-tag-default: var(
3576
- --x-size-border-radius-bottom-right-tag-pill
3577
- );
3578
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-pill);
3579
- }
3580
- :root {
3581
- --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3582
- --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
3583
- --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
3584
- --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3585
- --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3517
+ :root {
3518
+ --x-color-text-secondary: var(--x-color-base-neutral-35);
3519
+ }
3520
+ .x-text--accent {
3521
+ --x-color-text-default: var(--x-color-text-accent);
3586
3522
  }
3587
3523
  :root {
3588
3524
  --x-color-background-tag-ghost: transparent;
@@ -3627,225 +3563,7 @@
3627
3563
  );
3628
3564
  }
3629
3565
  :root {
3630
- --x-color-background-tag-default: var(--x-color-base-neutral-100);
3631
- --x-color-border-tag-default: var(--x-color-text-tag-default);
3632
- --x-color-text-tag-default: var(--x-color-text-default);
3633
- --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
3634
- --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
3635
- --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
3636
- --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
3637
- --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
3638
- --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
3639
- --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
3640
- --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
3641
- --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
3642
- --x-size-border-width-tag-default: var(--x-size-border-width-base);
3643
- --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
3644
- --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
3645
- --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
3646
- --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
3647
- --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
3648
- --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
3649
- --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
3650
- --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
3651
- --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
3652
- --x-size-height-tag-default: var(--x-size-base-07);
3653
- --x-size-padding-right-tag-default: var(--x-size-base-04);
3654
- --x-size-padding-left-tag-default: var(--x-size-base-04);
3655
- --x-size-gap-tag-default: var(--x-size-base-02);
3656
- --x-font-family-tag-default: var(--x-font-family-text);
3657
- --x-size-font-tag-default: var(--x-size-font-text);
3658
- --x-size-line-height-tag-default: var(--x-size-line-height-text);
3659
- --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
3660
- --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
3661
- --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
3662
- --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
3663
- --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
3664
- --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
3665
- --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
3666
- --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
3667
- --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
3668
- --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
3669
- --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
3670
- --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
3671
- --x-number-font-weight-tag-default-curated-selected: var(
3672
- --x-number-font-weight-tag-default-selected
3673
- );
3674
- }
3675
-
3676
- [dir="ltr"] .x-tag {
3677
- border-left-width: var(--x-size-border-width-left-tag-default);
3678
- }
3679
-
3680
- [dir="rtl"] .x-tag {
3681
- border-right-width: var(--x-size-border-width-left-tag-default);
3682
- }
3683
-
3684
- [dir="ltr"] .x-tag {
3685
- border-right-width: var(--x-size-border-width-right-tag-default);
3686
- }
3687
-
3688
- [dir="rtl"] .x-tag {
3689
- border-left-width: var(--x-size-border-width-right-tag-default);
3690
- }
3691
-
3692
- [dir="ltr"] .x-tag {
3693
- padding-left: var(--x-size-padding-left-tag-default);
3694
- }
3695
-
3696
- [dir="rtl"] .x-tag {
3697
- padding-right: var(--x-size-padding-left-tag-default);
3698
- }
3699
-
3700
- [dir="ltr"] .x-tag {
3701
- padding-right: var(--x-size-padding-right-tag-default);
3702
- }
3703
-
3704
- [dir="rtl"] .x-tag {
3705
- padding-left: var(--x-size-padding-right-tag-default);
3706
- }
3707
-
3708
- .x-tag {
3709
- display: flex;
3710
- align-items: center;
3711
- justify-content: center;
3712
- text-align: center;
3713
- box-sizing: border-box;
3714
- border-style: solid;
3715
- border-top-width: var(--x-size-border-width-top-tag-default);
3716
- border-bottom-width: var(--x-size-border-width-bottom-tag-default);
3717
- border-radius: var(--x-size-border-radius-top-left-tag-default) var(--x-size-border-radius-top-right-tag-default) var(--x-size-border-radius-bottom-right-tag-default) var(--x-size-border-radius-bottom-left-tag-default);
3718
- background-color: var(--x-color-background-tag-default);
3719
- border-color: var(--x-color-border-tag-default);
3720
- color: var(--x-color-text-tag-default);
3721
- line-height: var(--x-size-line-height-tag-default);
3722
- font-family: var(--x-font-family-tag-default);
3723
- font-size: var(--x-size-font-tag-default);
3724
- font-weight: var(--x-number-font-weight-tag-default);
3725
- gap: var(--x-size-gap-tag-default);
3726
- min-height: var(--x-size-height-tag-default);
3727
- min-width: calc(3 * var(--x-size-line-height-tag-default));
3728
- cursor: pointer;
3729
- }
3730
- @media not all and (min-resolution: 0.001dpcm) {
3731
- .x-tag {
3732
- gap: 0;
3733
- }
3734
- .x-tag > *:not(:last-child) {
3735
- margin-right: var(--x-size-gap-tag-default);
3736
- }
3737
- }
3738
- .x-tag.x-suggestion {
3739
- --x-color-background-suggestion-default: var(--x-color-background-tag-default);
3740
- --x-color-text-suggestion-default: var(--x-color-text-tag-default);
3741
- --x-color-border-suggestion-default: var(--x-color-border-tag-default);
3742
- --x-size-padding-top-suggestion-default: 0;
3743
- --x-size-padding-right-suggestion-default: var(--x-size-padding-right-tag-default);
3744
- --x-size-padding-bottom-suggestion-default: 0;
3745
- --x-size-padding-left-suggestion-default: var(--x-size-padding-left-tag-default);
3746
- --x-size-gap-suggestion-default: var(--x-size-gap-tag-default);
3747
- --x-size-border-width-suggestion-default: var(--x-size-border-width-tag-default);
3748
- --x-size-border-width-top-suggestion-default: var(--x-size-border-width-tag-default);
3749
- --x-size-border-width-right-suggestion-default: var(--x-size-border-width-tag-default);
3750
- --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-tag-default);
3751
- --x-size-border-width-left-suggestion-default: var(--x-size-border-width-tag-default);
3752
- --x-size-border-radius-bottom-right-suggestion-default: var(
3753
- --x-size-border-radius-bottom-right-tag-default
3754
- );
3755
- --x-size-border-radius-bottom-left-suggestion-default: var(
3756
- --x-size-border-radius-bottom-left-tag-default
3757
- );
3758
- --x-size-border-radius-top-right-suggestion-default: var(
3759
- --x-size-border-radius-top-right-tag-default
3760
- );
3761
- --x-size-border-radius-top-left-suggestion-default: var(
3762
- --x-size-border-radius-top-left-tag-default
3763
- );
3764
- --x-font-family-suggestion-default: var(--x-font-family-tag-default);
3765
- --x-size-font-suggestion-default: var(--x-size-font-tag-default);
3766
- --x-size-line-height-suggestion-default: var(--x-size-line-height-tag-default);
3767
- --x-number-font-weight-suggestion-default: var(--x-number-font-weight-tag-default);
3768
- }
3769
- .x-tag.x-suggestion-group {
3770
- --x-color-background-suggestion-group-default: var(--x-color-background-tag-default);
3771
- --x-color-text-suggestion-group-default: var(--x-color-text-tag-default);
3772
- --x-color-border-suggestion-group-default: var(--x-color-border-tag-default);
3773
- --x-size-padding-top-suggestion-group-default: 0;
3774
- --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-tag-default);
3775
- --x-size-padding-bottom-suggestion-group-default: 0;
3776
- --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-tag-default);
3777
- --x-size-gap-suggestion-group-default: var(--x-size-gap-tag-default);
3778
- --x-size-border-width-suggestion-group-default: var(--x-size-border-width-tag-default);
3779
- --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-tag-default);
3780
- --x-size-border-width-right-suggestion-group-default: var(--x-size-border-width-tag-default);
3781
- --x-size-border-width-bottom-suggestion-group-default: var(--x-size-border-width-tag-default);
3782
- --x-size-border-width-left-suggestion-group-default: var(--x-size-border-width-tag-default);
3783
- --x-size-border-radius-bottom-right-suggestion-group-default: var(
3784
- --x-size-border-radius-bottom-right-tag-default
3785
- );
3786
- --x-size-border-radius-bottom-left-suggestion-group-default: var(
3787
- --x-size-border-radius-bottom-left-tag-default
3788
- );
3789
- --x-size-border-radius-top-right-suggestion-group-default: var(
3790
- --x-size-border-radius-top-right-tag-default
3791
- );
3792
- --x-size-border-radius-top-left-suggestion-group-default: var(
3793
- --x-size-border-radius-top-left-tag-default
3794
- );
3795
- --x-font-family-suggestion-group-default: var(--x-font-family-tag-default);
3796
- --x-size-font-suggestion-group-default: var(--x-size-font-tag-default);
3797
- --x-size-line-height-suggestion-group-default: var(--x-size-line-height-tag-default);
3798
- --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-tag-default);
3799
- }
3800
- .x-tag.x-filter {
3801
- --x-color-background-filter-default: transparent;
3802
- --x-size-border-width-filter-default: 0;
3803
- --x-color-text-filter-default: var(--x-color-text-tag-default);
3804
- --x-size-padding-top-filter-default: 0;
3805
- --x-size-padding-right-filter-default: var(--x-size-padding-right-tag-default);
3806
- --x-size-padding-bottom-filter-default: 0;
3807
- --x-size-padding-left-filter-default: var(--x-size-padding-left-tag-default);
3808
- --x-size-gap-filter-default: var(--x-size-gap-tag-default);
3809
- --x-font-family-filter-default: var(--x-font-family-tag-default);
3810
- --x-size-font-filter-default: var(--x-size-font-tag-default);
3811
- --x-number-font-weight-filter-count-default: var(--x-number-font-weight-tag-default);
3812
- --x-size-line-height-filter-default: var(--x-size-line-height-tag-default);
3813
- }
3814
- .x-tag.x-tag.x-tag--is-curated {
3815
- background-color: var(--x-color-background-tag-default-curated);
3816
- border-color: var(--x-color-border-tag-default-curated);
3817
- color: var(--x-color-text-tag-default-curated);
3818
- line-height: var(--x-size-line-height-tag-default-curated);
3819
- font-family: var(--x-font-family-tag-default-curated);
3820
- font-size: var(--x-size-font-tag-default-curated);
3821
- font-weight: var(--x-number-font-weight-tag-default-curated);
3822
- }
3823
- .x-tag.x-tag.x-tag--is-selected {
3824
- background-color: var(--x-color-background-tag-default-selected);
3825
- border-color: var(--x-color-border-tag-default-selected);
3826
- color: var(--x-color-text-tag-default-selected);
3827
- line-height: var(--x-size-line-height-tag-default-selected);
3828
- font-family: var(--x-font-family-tag-default-selected);
3829
- font-size: var(--x-size-font-tag-default-selected);
3830
- font-weight: var(--x-number-font-weight-tag-default-selected);
3831
- }
3832
- .x-tag.x-tag.x-tag--is-selected.x-tag--is-curated {
3833
- background-color: var(--x-color-background-tag-default-curated-selected);
3834
- border-color: var(--x-color-border-tag-default-curated-selected);
3835
- color: var(--x-color-text-tag-default-curated-selected);
3836
- line-height: var(--x-size-line-height-tag-default-curated-selected);
3837
- font-family: var(--x-font-family-tag-default-curated-selected);
3838
- font-size: var(--x-size-font-tag-default-curated-selected);
3839
- font-weight: var(--x-number-font-weight-tag-default-curated-selected);
3840
- }
3841
- .x-tag.x-tag.x-tag--is-selected.x-filter {
3842
- --x-color-text-filter-default-selected: var(--x-color-text-tag-default-selected);
3843
- --x-font-family-filter-default-selected: var(--x-font-family-tag-default-selected);
3844
- --x-size-font-filter-default-selected: var(--x-size-font-tag-default-selected);
3845
- --x-number-font-weight-filter-count-default-selected: var(
3846
- --x-number-font-weight-tag-default-selected
3847
- );
3848
- --x-size-line-height-filter-default-selected: var(--x-size-line-height-tag-default-selected);
3566
+ --x-color-text-accent: var(--x-color-base-accent);
3849
3567
  }
3850
3568
  :root {
3851
3569
  --x-color-background-tag-default: var(--x-color-base-neutral-100);
@@ -4075,6 +3793,24 @@
4075
3793
  --x-size-padding-left-button-default: 0;
4076
3794
  border: none;
4077
3795
  }
3796
+ :root {
3797
+ --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
3798
+ --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
3799
+ --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
3800
+ --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
3801
+ --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
3802
+ }
3803
+
3804
+ .x-tag--pill.x-tag,
3805
+ .x-tag--pill .x-tag {
3806
+ --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-pill);
3807
+ --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-pill);
3808
+ --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-pill);
3809
+ --x-size-border-radius-bottom-right-tag-default: var(
3810
+ --x-size-border-radius-bottom-right-tag-pill
3811
+ );
3812
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-pill);
3813
+ }
4078
3814
  :root {
4079
3815
  --x-string-align-items-suggestion-default: center;
4080
3816
  --x-color-text-suggestion-default: var(--x-color-text-default);
@@ -4166,18 +3902,344 @@
4166
3902
  );
4167
3903
  }
4168
3904
  :root {
4169
- --x-string-align-items-suggestion-default: center;
4170
- --x-color-text-suggestion-default: var(--x-color-text-default);
4171
- --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
4172
- --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
4173
- --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
4174
- --x-color-background-suggestion-default: transparent;
4175
- --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
4176
- --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
4177
- --x-color-text-suggestion-matching-part-default-curated: var(
4178
- --x-color-text-suggestion-matching-part-default
4179
- );
4180
- --x-color-text-suggestion-default-matching-curated: var(
3905
+ --x-color-background-tag-default: var(--x-color-base-neutral-100);
3906
+ --x-color-border-tag-default: var(--x-color-text-tag-default);
3907
+ --x-color-text-tag-default: var(--x-color-text-default);
3908
+ --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
3909
+ --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
3910
+ --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
3911
+ --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
3912
+ --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
3913
+ --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
3914
+ --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
3915
+ --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
3916
+ --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
3917
+ --x-size-border-width-tag-default: var(--x-size-border-width-base);
3918
+ --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
3919
+ --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
3920
+ --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
3921
+ --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
3922
+ --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
3923
+ --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
3924
+ --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
3925
+ --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
3926
+ --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
3927
+ --x-size-height-tag-default: var(--x-size-base-07);
3928
+ --x-size-padding-right-tag-default: var(--x-size-base-04);
3929
+ --x-size-padding-left-tag-default: var(--x-size-base-04);
3930
+ --x-size-gap-tag-default: var(--x-size-base-02);
3931
+ --x-font-family-tag-default: var(--x-font-family-text);
3932
+ --x-size-font-tag-default: var(--x-size-font-text);
3933
+ --x-size-line-height-tag-default: var(--x-size-line-height-text);
3934
+ --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
3935
+ --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
3936
+ --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
3937
+ --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
3938
+ --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
3939
+ --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
3940
+ --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
3941
+ --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
3942
+ --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
3943
+ --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
3944
+ --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
3945
+ --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
3946
+ --x-number-font-weight-tag-default-curated-selected: var(
3947
+ --x-number-font-weight-tag-default-selected
3948
+ );
3949
+ }
3950
+
3951
+ [dir="ltr"] .x-tag {
3952
+ border-left-width: var(--x-size-border-width-left-tag-default);
3953
+ }
3954
+
3955
+ [dir="rtl"] .x-tag {
3956
+ border-right-width: var(--x-size-border-width-left-tag-default);
3957
+ }
3958
+
3959
+ [dir="ltr"] .x-tag {
3960
+ border-right-width: var(--x-size-border-width-right-tag-default);
3961
+ }
3962
+
3963
+ [dir="rtl"] .x-tag {
3964
+ border-left-width: var(--x-size-border-width-right-tag-default);
3965
+ }
3966
+
3967
+ [dir="ltr"] .x-tag {
3968
+ padding-left: var(--x-size-padding-left-tag-default);
3969
+ }
3970
+
3971
+ [dir="rtl"] .x-tag {
3972
+ padding-right: var(--x-size-padding-left-tag-default);
3973
+ }
3974
+
3975
+ [dir="ltr"] .x-tag {
3976
+ padding-right: var(--x-size-padding-right-tag-default);
3977
+ }
3978
+
3979
+ [dir="rtl"] .x-tag {
3980
+ padding-left: var(--x-size-padding-right-tag-default);
3981
+ }
3982
+
3983
+ .x-tag {
3984
+ display: flex;
3985
+ align-items: center;
3986
+ justify-content: center;
3987
+ text-align: center;
3988
+ box-sizing: border-box;
3989
+ border-style: solid;
3990
+ border-top-width: var(--x-size-border-width-top-tag-default);
3991
+ border-bottom-width: var(--x-size-border-width-bottom-tag-default);
3992
+ border-radius: var(--x-size-border-radius-top-left-tag-default) var(--x-size-border-radius-top-right-tag-default) var(--x-size-border-radius-bottom-right-tag-default) var(--x-size-border-radius-bottom-left-tag-default);
3993
+ background-color: var(--x-color-background-tag-default);
3994
+ border-color: var(--x-color-border-tag-default);
3995
+ color: var(--x-color-text-tag-default);
3996
+ line-height: var(--x-size-line-height-tag-default);
3997
+ font-family: var(--x-font-family-tag-default);
3998
+ font-size: var(--x-size-font-tag-default);
3999
+ font-weight: var(--x-number-font-weight-tag-default);
4000
+ gap: var(--x-size-gap-tag-default);
4001
+ min-height: var(--x-size-height-tag-default);
4002
+ min-width: calc(3 * var(--x-size-line-height-tag-default));
4003
+ cursor: pointer;
4004
+ }
4005
+ @media not all and (min-resolution: 0.001dpcm) {
4006
+ .x-tag {
4007
+ gap: 0;
4008
+ }
4009
+ .x-tag > *:not(:last-child) {
4010
+ margin-right: var(--x-size-gap-tag-default);
4011
+ }
4012
+ }
4013
+ .x-tag.x-suggestion {
4014
+ --x-color-background-suggestion-default: var(--x-color-background-tag-default);
4015
+ --x-color-text-suggestion-default: var(--x-color-text-tag-default);
4016
+ --x-color-border-suggestion-default: var(--x-color-border-tag-default);
4017
+ --x-size-padding-top-suggestion-default: 0;
4018
+ --x-size-padding-right-suggestion-default: var(--x-size-padding-right-tag-default);
4019
+ --x-size-padding-bottom-suggestion-default: 0;
4020
+ --x-size-padding-left-suggestion-default: var(--x-size-padding-left-tag-default);
4021
+ --x-size-gap-suggestion-default: var(--x-size-gap-tag-default);
4022
+ --x-size-border-width-suggestion-default: var(--x-size-border-width-tag-default);
4023
+ --x-size-border-width-top-suggestion-default: var(--x-size-border-width-tag-default);
4024
+ --x-size-border-width-right-suggestion-default: var(--x-size-border-width-tag-default);
4025
+ --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-tag-default);
4026
+ --x-size-border-width-left-suggestion-default: var(--x-size-border-width-tag-default);
4027
+ --x-size-border-radius-bottom-right-suggestion-default: var(
4028
+ --x-size-border-radius-bottom-right-tag-default
4029
+ );
4030
+ --x-size-border-radius-bottom-left-suggestion-default: var(
4031
+ --x-size-border-radius-bottom-left-tag-default
4032
+ );
4033
+ --x-size-border-radius-top-right-suggestion-default: var(
4034
+ --x-size-border-radius-top-right-tag-default
4035
+ );
4036
+ --x-size-border-radius-top-left-suggestion-default: var(
4037
+ --x-size-border-radius-top-left-tag-default
4038
+ );
4039
+ --x-font-family-suggestion-default: var(--x-font-family-tag-default);
4040
+ --x-size-font-suggestion-default: var(--x-size-font-tag-default);
4041
+ --x-size-line-height-suggestion-default: var(--x-size-line-height-tag-default);
4042
+ --x-number-font-weight-suggestion-default: var(--x-number-font-weight-tag-default);
4043
+ }
4044
+ .x-tag.x-suggestion-group {
4045
+ --x-color-background-suggestion-group-default: var(--x-color-background-tag-default);
4046
+ --x-color-text-suggestion-group-default: var(--x-color-text-tag-default);
4047
+ --x-color-border-suggestion-group-default: var(--x-color-border-tag-default);
4048
+ --x-size-padding-top-suggestion-group-default: 0;
4049
+ --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-tag-default);
4050
+ --x-size-padding-bottom-suggestion-group-default: 0;
4051
+ --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-tag-default);
4052
+ --x-size-gap-suggestion-group-default: var(--x-size-gap-tag-default);
4053
+ --x-size-border-width-suggestion-group-default: var(--x-size-border-width-tag-default);
4054
+ --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-tag-default);
4055
+ --x-size-border-width-right-suggestion-group-default: var(--x-size-border-width-tag-default);
4056
+ --x-size-border-width-bottom-suggestion-group-default: var(--x-size-border-width-tag-default);
4057
+ --x-size-border-width-left-suggestion-group-default: var(--x-size-border-width-tag-default);
4058
+ --x-size-border-radius-bottom-right-suggestion-group-default: var(
4059
+ --x-size-border-radius-bottom-right-tag-default
4060
+ );
4061
+ --x-size-border-radius-bottom-left-suggestion-group-default: var(
4062
+ --x-size-border-radius-bottom-left-tag-default
4063
+ );
4064
+ --x-size-border-radius-top-right-suggestion-group-default: var(
4065
+ --x-size-border-radius-top-right-tag-default
4066
+ );
4067
+ --x-size-border-radius-top-left-suggestion-group-default: var(
4068
+ --x-size-border-radius-top-left-tag-default
4069
+ );
4070
+ --x-font-family-suggestion-group-default: var(--x-font-family-tag-default);
4071
+ --x-size-font-suggestion-group-default: var(--x-size-font-tag-default);
4072
+ --x-size-line-height-suggestion-group-default: var(--x-size-line-height-tag-default);
4073
+ --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-tag-default);
4074
+ }
4075
+ .x-tag.x-filter {
4076
+ --x-color-background-filter-default: transparent;
4077
+ --x-size-border-width-filter-default: 0;
4078
+ --x-color-text-filter-default: var(--x-color-text-tag-default);
4079
+ --x-size-padding-top-filter-default: 0;
4080
+ --x-size-padding-right-filter-default: var(--x-size-padding-right-tag-default);
4081
+ --x-size-padding-bottom-filter-default: 0;
4082
+ --x-size-padding-left-filter-default: var(--x-size-padding-left-tag-default);
4083
+ --x-size-gap-filter-default: var(--x-size-gap-tag-default);
4084
+ --x-font-family-filter-default: var(--x-font-family-tag-default);
4085
+ --x-size-font-filter-default: var(--x-size-font-tag-default);
4086
+ --x-number-font-weight-filter-count-default: var(--x-number-font-weight-tag-default);
4087
+ --x-size-line-height-filter-default: var(--x-size-line-height-tag-default);
4088
+ }
4089
+ .x-tag.x-tag.x-tag--is-curated {
4090
+ background-color: var(--x-color-background-tag-default-curated);
4091
+ border-color: var(--x-color-border-tag-default-curated);
4092
+ color: var(--x-color-text-tag-default-curated);
4093
+ line-height: var(--x-size-line-height-tag-default-curated);
4094
+ font-family: var(--x-font-family-tag-default-curated);
4095
+ font-size: var(--x-size-font-tag-default-curated);
4096
+ font-weight: var(--x-number-font-weight-tag-default-curated);
4097
+ }
4098
+ .x-tag.x-tag.x-tag--is-selected {
4099
+ background-color: var(--x-color-background-tag-default-selected);
4100
+ border-color: var(--x-color-border-tag-default-selected);
4101
+ color: var(--x-color-text-tag-default-selected);
4102
+ line-height: var(--x-size-line-height-tag-default-selected);
4103
+ font-family: var(--x-font-family-tag-default-selected);
4104
+ font-size: var(--x-size-font-tag-default-selected);
4105
+ font-weight: var(--x-number-font-weight-tag-default-selected);
4106
+ }
4107
+ .x-tag.x-tag.x-tag--is-selected.x-tag--is-curated {
4108
+ background-color: var(--x-color-background-tag-default-curated-selected);
4109
+ border-color: var(--x-color-border-tag-default-curated-selected);
4110
+ color: var(--x-color-text-tag-default-curated-selected);
4111
+ line-height: var(--x-size-line-height-tag-default-curated-selected);
4112
+ font-family: var(--x-font-family-tag-default-curated-selected);
4113
+ font-size: var(--x-size-font-tag-default-curated-selected);
4114
+ font-weight: var(--x-number-font-weight-tag-default-curated-selected);
4115
+ }
4116
+ .x-tag.x-tag.x-tag--is-selected.x-filter {
4117
+ --x-color-text-filter-default-selected: var(--x-color-text-tag-default-selected);
4118
+ --x-font-family-filter-default-selected: var(--x-font-family-tag-default-selected);
4119
+ --x-size-font-filter-default-selected: var(--x-size-font-tag-default-selected);
4120
+ --x-number-font-weight-filter-count-default-selected: var(
4121
+ --x-number-font-weight-tag-default-selected
4122
+ );
4123
+ --x-size-line-height-filter-default-selected: var(--x-size-line-height-tag-default-selected);
4124
+ }
4125
+ .x-sliding-panel {
4126
+ z-index: 0;
4127
+ background-color: var(--x-color-background-sliding-panel);
4128
+ }
4129
+ .x-sliding-panel__button.x-button {
4130
+ --x-size-padding-button: var(--x-size-padding-sliding-panel-button);
4131
+ pointer-events: none;
4132
+ }
4133
+ .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel__button {
4134
+ pointer-events: all;
4135
+ }
4136
+ .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-left {
4137
+ transform: translateX(calc(-100% - var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4138
+ }
4139
+ .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-right {
4140
+ transform: translateX(calc(100% + var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4141
+ }
4142
+ .x-sliding-panel.x-sliding-panel--show-buttons-on-hover .x-sliding-panel__button {
4143
+ opacity: 0;
4144
+ }
4145
+ .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-start):hover .x-sliding-panel-button-left {
4146
+ opacity: 1;
4147
+ pointer-events: all;
4148
+ }
4149
+ .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-end):hover .x-sliding-panel-button-right {
4150
+ opacity: 1;
4151
+ pointer-events: all;
4152
+ }
4153
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient) .x-sliding-panel__scroll {
4154
+ mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient), rgba(0, 0, 0, 0.8) calc(100% - 0.67 * var(--x-size-width-sliding-panel-gradient)), transparent calc(100% - 0.43 * var(--x-size-width-sliding-panel-gradient)));
4155
+ }
4156
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start .x-sliding-panel__scroll {
4157
+ mask: linear-gradient(to left, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4158
+ }
4159
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-end .x-sliding-panel__scroll {
4160
+ mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4161
+ }
4162
+ .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start.x-sliding-panel-at-end .x-sliding-panel__scroll {
4163
+ mask: none;
4164
+ }
4165
+ .x-sliding-panel__scroll > * {
4166
+ flex: 0 0 auto;
4167
+ }
4168
+ .x-sliding-panel__scroll > .x-list {
4169
+ --x-string-flow-list: row nowrap;
4170
+ }
4171
+ .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-start) .x-sliding-panel-button-left {
4172
+ opacity: 1;
4173
+ pointer-events: all;
4174
+ }
4175
+ .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-end) .x-sliding-panel-button-right {
4176
+ opacity: 1;
4177
+ pointer-events: all;
4178
+ }
4179
+ :root {
4180
+ --x-color-background-sliding-panel: var(--x-color-base-neutral-100);
4181
+ --x-size-width-sliding-panel-gradient: var(--x-size-base-09);
4182
+ --x-size-padding-sliding-panel-button: var(--x-size-base-03);
4183
+ --x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
4184
+ }
4185
+ :root {
4186
+ --x-string-overflow-scroll: auto;
4187
+ --x-color-background-scroll-bar: transparent;
4188
+ --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
4189
+ --x-color-background-scroll-bar-hover: transparent;
4190
+ --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
4191
+ }
4192
+ :root {
4193
+ --x-string-overflow-scroll: auto;
4194
+ --x-color-background-scroll-bar: transparent;
4195
+ --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
4196
+ --x-color-background-scroll-bar-hover: transparent;
4197
+ --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
4198
+ }
4199
+
4200
+ .x-scroll {
4201
+ overflow-y: var(--x-string-overflow-scroll);
4202
+ }
4203
+ @media (hover: hover) {
4204
+ .x-scroll {
4205
+ scrollbar-width: auto;
4206
+ scrollbar-color: var(--x-color-thumb-scroll-bar) var(--x-color-background-scroll-bar);
4207
+ }
4208
+ .x-scroll::-webkit-scrollbar {
4209
+ width: 17px;
4210
+ }
4211
+ .x-scroll::-webkit-scrollbar-track {
4212
+ background: var(--x-color-background-scroll-bar);
4213
+ }
4214
+ .x-scroll::-webkit-scrollbar-thumb {
4215
+ width: 5px;
4216
+ border-radius: 15px;
4217
+ background: var(--x-color-thumb-scroll-bar);
4218
+ background-clip: content-box;
4219
+ border: solid 4px rgba(0, 0, 0, 0.00001);
4220
+ }
4221
+ .x-scroll:hover {
4222
+ --x-color-background-scroll-bar: var(--x-color-background-scroll-bar-hover);
4223
+ --x-color-thumb-scroll-bar: var(--x-color-thumb-scroll-bar-hover);
4224
+ }
4225
+ }
4226
+
4227
+ .x-base-scroll {
4228
+ overflow-y: var(--x-string-overflow-scroll, auto);
4229
+ }
4230
+ :root {
4231
+ --x-string-align-items-suggestion-default: center;
4232
+ --x-color-text-suggestion-default: var(--x-color-text-default);
4233
+ --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
4234
+ --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
4235
+ --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
4236
+ --x-color-background-suggestion-default: transparent;
4237
+ --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
4238
+ --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
4239
+ --x-color-text-suggestion-matching-part-default-curated: var(
4240
+ --x-color-text-suggestion-matching-part-default
4241
+ );
4242
+ --x-color-text-suggestion-default-matching-curated: var(
4181
4243
  --x-color-text-suggestion-default-matching
4182
4244
  );
4183
4245
  --x-color-background-suggestion-default-curated: var(--x-color-background-suggestion-default);
@@ -4387,134 +4449,6 @@
4387
4449
  --x-color-text-suggestion-default-matching-curated
4388
4450
  );
4389
4451
  }
4390
- .x-sliding-panel {
4391
- z-index: 0;
4392
- background-color: var(--x-color-background-sliding-panel);
4393
- }
4394
- .x-sliding-panel__button.x-button {
4395
- --x-size-padding-button: var(--x-size-padding-sliding-panel-button);
4396
- pointer-events: none;
4397
- }
4398
- .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel__button {
4399
- pointer-events: all;
4400
- }
4401
- .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-left {
4402
- transform: translateX(calc(-100% - var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4403
- }
4404
- .x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-right {
4405
- transform: translateX(calc(100% + var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
4406
- }
4407
- .x-sliding-panel.x-sliding-panel--show-buttons-on-hover .x-sliding-panel__button {
4408
- opacity: 0;
4409
- }
4410
- .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-start):hover .x-sliding-panel-button-left {
4411
- opacity: 1;
4412
- pointer-events: all;
4413
- }
4414
- .x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-end):hover .x-sliding-panel-button-right {
4415
- opacity: 1;
4416
- pointer-events: all;
4417
- }
4418
- .x-sliding-panel:not(.x-sliding-panel--no-gradient) .x-sliding-panel__scroll {
4419
- mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient), rgba(0, 0, 0, 0.8) calc(100% - 0.67 * var(--x-size-width-sliding-panel-gradient)), transparent calc(100% - 0.43 * var(--x-size-width-sliding-panel-gradient)));
4420
- }
4421
- .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start .x-sliding-panel__scroll {
4422
- mask: linear-gradient(to left, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4423
- }
4424
- .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-end .x-sliding-panel__scroll {
4425
- mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
4426
- }
4427
- .x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start.x-sliding-panel-at-end .x-sliding-panel__scroll {
4428
- mask: none;
4429
- }
4430
- .x-sliding-panel__scroll > * {
4431
- flex: 0 0 auto;
4432
- }
4433
- .x-sliding-panel__scroll > .x-list {
4434
- --x-string-flow-list: row nowrap;
4435
- }
4436
- .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-start) .x-sliding-panel-button-left {
4437
- opacity: 1;
4438
- pointer-events: all;
4439
- }
4440
- .x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-end) .x-sliding-panel-button-right {
4441
- opacity: 1;
4442
- pointer-events: all;
4443
- }
4444
- :root {
4445
- --x-string-overflow-scroll: auto;
4446
- --x-color-background-scroll-bar: transparent;
4447
- --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
4448
- --x-color-background-scroll-bar-hover: transparent;
4449
- --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
4450
- }
4451
- :root {
4452
- --x-string-overflow-scroll: auto;
4453
- --x-color-background-scroll-bar: transparent;
4454
- --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
4455
- --x-color-background-scroll-bar-hover: transparent;
4456
- --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
4457
- }
4458
-
4459
- .x-scroll {
4460
- overflow-y: var(--x-string-overflow-scroll);
4461
- }
4462
- @media (hover: hover) {
4463
- .x-scroll {
4464
- scrollbar-width: auto;
4465
- scrollbar-color: var(--x-color-thumb-scroll-bar) var(--x-color-background-scroll-bar);
4466
- }
4467
- .x-scroll::-webkit-scrollbar {
4468
- width: 17px;
4469
- }
4470
- .x-scroll::-webkit-scrollbar-track {
4471
- background: var(--x-color-background-scroll-bar);
4472
- }
4473
- .x-scroll::-webkit-scrollbar-thumb {
4474
- width: 5px;
4475
- border-radius: 15px;
4476
- background: var(--x-color-thumb-scroll-bar);
4477
- background-clip: content-box;
4478
- border: solid 4px rgba(0, 0, 0, 0.00001);
4479
- }
4480
- .x-scroll:hover {
4481
- --x-color-background-scroll-bar: var(--x-color-background-scroll-bar-hover);
4482
- --x-color-thumb-scroll-bar: var(--x-color-thumb-scroll-bar-hover);
4483
- }
4484
- }
4485
-
4486
- .x-base-scroll {
4487
- overflow-y: var(--x-string-overflow-scroll, auto);
4488
- }
4489
- /* @deprecated */
4490
- :root {
4491
- --x-size-padding-row-02: var(--x-size-base-02);
4492
- --x-size-padding-row-03: var(--x-size-base-03);
4493
- --x-size-padding-row-04: var(--x-size-base-04);
4494
- --x-size-padding-row-05: var(--x-size-base-05);
4495
- --x-size-padding-row-06: var(--x-size-base-06);
4496
- }
4497
-
4498
- /* @deprecated */
4499
- .x-row--padding-02 {
4500
- --x-size-padding-row: var(--x-size-padding-row-02);
4501
- }
4502
-
4503
- .x-row--padding-03 {
4504
- --x-size-padding-row: var(--x-size-padding-row-03);
4505
- }
4506
-
4507
- .x-row--padding-04 {
4508
- --x-size-padding-row: var(--x-size-padding-row-04);
4509
- }
4510
-
4511
- .x-row--padding-05 {
4512
- --x-size-padding-row: var(--x-size-padding-row-05);
4513
- }
4514
-
4515
- .x-row--padding-06 {
4516
- --x-size-padding-row: var(--x-size-padding-row-06);
4517
- }
4518
4452
  /* @deprecated */
4519
4453
  :root {
4520
4454
  --x-size-padding-row-02: var(--x-size-base-02);
@@ -4523,34 +4457,6 @@
4523
4457
  --x-size-padding-row-05: var(--x-size-base-05);
4524
4458
  --x-size-padding-row-06: var(--x-size-base-06);
4525
4459
  }
4526
- :root {
4527
- --x-color-background-sliding-panel: var(--x-color-base-neutral-100);
4528
- --x-size-width-sliding-panel-gradient: var(--x-size-base-09);
4529
- --x-size-padding-sliding-panel-button: var(--x-size-base-03);
4530
- --x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
4531
- }
4532
- :root {
4533
- --x-size-gap-row-01: var(--x-size-base-01);
4534
- --x-size-gap-row-02: var(--x-size-base-02);
4535
- --x-size-gap-row-03: var(--x-size-base-03);
4536
- --x-size-gap-row-04: var(--x-size-base-04);
4537
- --x-size-gap-row-05: var(--x-size-base-05);
4538
- --x-size-gap-row-06: var(--x-size-base-06);
4539
- --x-size-gap-row-07: var(--x-size-base-07);
4540
- --x-size-gap-row-08: var(--x-size-base-08);
4541
- --x-size-gap-row-09: var(--x-size-base-09);
4542
- --x-size-gap-row-10: var(--x-size-base-10);
4543
- --x-size-gap-row-11: var(--x-size-base-11);
4544
- --x-size-gap-row-12: var(--x-size-base-12);
4545
- --x-size-gap-row-13: var(--x-size-base-13);
4546
- --x-size-gap-row-14: var(--x-size-base-14);
4547
- --x-size-gap-row-15: var(--x-size-base-15);
4548
- --x-size-gap-row-16: var(--x-size-base-16);
4549
- --x-size-gap-row-17: var(--x-size-base-17);
4550
- --x-size-gap-row-18: var(--x-size-base-18);
4551
- --x-size-gap-row-19: var(--x-size-base-19);
4552
- --x-size-gap-row-20: var(--x-size-base-20);
4553
- }
4554
4460
  :root {
4555
4461
  --x-size-gap-row-01: var(--x-size-base-01);
4556
4462
  --x-size-gap-row-02: var(--x-size-base-02);
@@ -4661,6 +4567,28 @@
4661
4567
  --x-size-span-row-item: 1;
4662
4568
  --x-size-start-row-item: 0;
4663
4569
  }
4570
+ :root {
4571
+ --x-size-gap-row-01: var(--x-size-base-01);
4572
+ --x-size-gap-row-02: var(--x-size-base-02);
4573
+ --x-size-gap-row-03: var(--x-size-base-03);
4574
+ --x-size-gap-row-04: var(--x-size-base-04);
4575
+ --x-size-gap-row-05: var(--x-size-base-05);
4576
+ --x-size-gap-row-06: var(--x-size-base-06);
4577
+ --x-size-gap-row-07: var(--x-size-base-07);
4578
+ --x-size-gap-row-08: var(--x-size-base-08);
4579
+ --x-size-gap-row-09: var(--x-size-base-09);
4580
+ --x-size-gap-row-10: var(--x-size-base-10);
4581
+ --x-size-gap-row-11: var(--x-size-base-11);
4582
+ --x-size-gap-row-12: var(--x-size-base-12);
4583
+ --x-size-gap-row-13: var(--x-size-base-13);
4584
+ --x-size-gap-row-14: var(--x-size-base-14);
4585
+ --x-size-gap-row-15: var(--x-size-base-15);
4586
+ --x-size-gap-row-16: var(--x-size-base-16);
4587
+ --x-size-gap-row-17: var(--x-size-base-17);
4588
+ --x-size-gap-row-18: var(--x-size-base-18);
4589
+ --x-size-gap-row-19: var(--x-size-base-19);
4590
+ --x-size-gap-row-20: var(--x-size-base-20);
4591
+ }
4664
4592
  :root {
4665
4593
  --x-size-gap-row: 0;
4666
4594
  --x-size-padding-row: 0;
@@ -4868,24 +4796,13 @@
4868
4796
  border-style: solid;
4869
4797
  border-width: var(--x-size-border-width-result-picture-default);
4870
4798
  }
4871
- .x-result:hover .x-result__overlay {
4872
- opacity: 1;
4873
- }
4874
- @media (hover: none) {
4875
- .x-result .x-result__overlay {
4876
- opacity: 1;
4877
- }
4878
- }
4879
- :root {
4880
- --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4881
- }
4882
- :root {
4883
- --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4884
- }
4885
-
4886
- .x-result.x-result--card {
4887
- overflow: hidden;
4888
- --x-size-border-radius-result-default: var(--x-size-border-radius-result-card);
4799
+ .x-result:hover .x-result__overlay {
4800
+ opacity: 1;
4801
+ }
4802
+ @media (hover: none) {
4803
+ .x-result .x-result__overlay {
4804
+ opacity: 1;
4805
+ }
4889
4806
  }
4890
4807
  :root {
4891
4808
  --x-size-height-progress-bar-line-default: var(--x-size-base-02);
@@ -4896,6 +4813,14 @@
4896
4813
  --x-size-border-radius-progress-bar-default: var(--x-size-border-radius-base-pill);
4897
4814
  --x-size-border-width-progress-bar-default: 0;
4898
4815
  }
4816
+ :root {
4817
+ --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
4818
+ }
4819
+
4820
+ .x-result.x-result--card {
4821
+ overflow: hidden;
4822
+ --x-size-border-radius-result-default: var(--x-size-border-radius-result-card);
4823
+ }
4899
4824
  :root {
4900
4825
  --x-size-height-progress-bar-line-default: var(--x-size-base-02);
4901
4826
  --x-size-width-progress-bar-line-default: var(--x-size-base-20);
@@ -4921,49 +4846,84 @@
4921
4846
  border-radius: var(--x-size-border-radius-progress-bar-default);
4922
4847
  background-color: var(--x-color-background-progress-bar-line-default);
4923
4848
  }
4849
+ /* @deprecated */
4924
4850
  :root {
4925
- --x-number-zoom-scale-picture: 1.1;
4926
- --x-number-zoom-duration-picture: 0.3s;
4851
+ --x-size-padding-row-02: var(--x-size-base-02);
4852
+ --x-size-padding-row-03: var(--x-size-base-03);
4853
+ --x-size-padding-row-04: var(--x-size-base-04);
4854
+ --x-size-padding-row-05: var(--x-size-base-05);
4855
+ --x-size-padding-row-06: var(--x-size-base-06);
4856
+ }
4857
+
4858
+ /* @deprecated */
4859
+ .x-row--padding-02 {
4860
+ --x-size-padding-row: var(--x-size-padding-row-02);
4861
+ }
4862
+
4863
+ .x-row--padding-03 {
4864
+ --x-size-padding-row: var(--x-size-padding-row-03);
4865
+ }
4866
+
4867
+ .x-row--padding-04 {
4868
+ --x-size-padding-row: var(--x-size-padding-row-04);
4869
+ }
4870
+
4871
+ .x-row--padding-05 {
4872
+ --x-size-padding-row: var(--x-size-padding-row-05);
4873
+ }
4874
+
4875
+ .x-row--padding-06 {
4876
+ --x-size-padding-row: var(--x-size-padding-row-06);
4927
4877
  }
4928
4878
  :root {
4929
4879
  --x-number-zoom-scale-picture: 1.1;
4930
4880
  --x-number-zoom-duration-picture: 0.3s;
4931
4881
  }
4882
+ .x-border-color--lead {
4883
+ border-color: var(--x-color-base-lead) !important;
4884
+ }
4932
4885
 
4933
- .x-picture--zoom .x-picture-image {
4934
- transition: transform var(--x-number-zoom-duration-picture) ease-out;
4886
+ .x-border-color--auxiliary {
4887
+ border-color: var(--x-color-base-auxiliary) !important;
4935
4888
  }
4936
- .x-picture--zoom .x-picture-image:hover {
4937
- transform: scale(var(--x-number-zoom-scale-picture));
4889
+
4890
+ .x-border-color--neutral-10 {
4891
+ border-color: var(--x-color-base-neutral-10) !important;
4938
4892
  }
4939
- :root {
4940
- --x-number-aspect-ratio-picture: 1;
4893
+
4894
+ .x-border-color--neutral-35 {
4895
+ border-color: var(--x-color-base-neutral-35) !important;
4941
4896
  }
4942
- :root {
4943
- --x-number-aspect-ratio-picture: 1;
4897
+
4898
+ .x-border-color--neutral-70 {
4899
+ border-color: var(--x-color-base-neutral-70) !important;
4944
4900
  }
4945
4901
 
4946
- .x-picture--fixed-ratio.x-picture {
4947
- aspect-ratio: var(--x-number-aspect-ratio-picture);
4948
- width: 100%;
4902
+ .x-border-color--neutral-95 {
4903
+ border-color: var(--x-color-base-neutral-95) !important;
4904
+ }
4905
+
4906
+ .x-border-color--neutral-100 {
4907
+ border-color: var(--x-color-base-neutral-100) !important;
4908
+ }
4909
+
4910
+ .x-border-color--accent {
4911
+ border-color: var(--x-color-base-accent) !important;
4912
+ }
4913
+
4914
+ .x-border-color--enable {
4915
+ border-color: var(--x-color-base-enable) !important;
4916
+ }
4917
+
4918
+ .x-border-color--disable {
4919
+ border-color: var(--x-color-base-disable) !important;
4920
+ }
4921
+
4922
+ .x-border-color--transparent {
4923
+ border-color: var(--x-color-base-transparent) !important;
4949
4924
  }
4950
4925
  :root {
4951
- --x-size-border-radius-picture-default: 0;
4952
- --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
4953
- --x-size-border-radius-right-picture-default: var(--x-size-border-radius-picture-default);
4954
- --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-picture-default);
4955
- --x-size-border-radius-left-picture-default: var(--x-size-border-radius-picture-default);
4956
- --x-color-background-picture-default: transparent;
4957
- --x-color-fill-picture-placeholder-path-default: var(--x-color-base-neutral-70);
4958
- --x-color-fill-picture-placeholder-rect-default: var(--x-color-base-neutral-95);
4959
- --x-color-fill-picture-fallback-path-default: var(--x-color-base-neutral-70);
4960
- --x-color-fill-picture-fallback-rect-default: var(--x-color-base-neutral-95);
4961
- --x-object-fit-picture-default: contain;
4962
- --x-object-fit-picture-fallback-default: var(--x-object-fit-picture-default);
4963
- --x-object-fit-picture-placeholder-default: var(--x-object-fit-picture-default);
4964
- --x-mix-blend-mode-picture-default: normal;
4965
- --x-mix-blend-mode-picture-fallback-default: var(--x-mix-blend-mode-picture-default);
4966
- --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
4926
+ --x-number-aspect-ratio-picture: 1;
4967
4927
  }
4968
4928
  :root {
4969
4929
  --x-size-border-radius-picture-default: 0;
@@ -5022,155 +4982,77 @@
5022
4982
  fill: var(--x-color-fill-picture-placeholder-path-default) !important;
5023
4983
  }
5024
4984
  :root {
5025
- --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5026
- --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5027
- }
5028
- :root {
5029
- --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5030
- --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5031
- }
5032
-
5033
- .x-picture--cover.x-picture {
5034
- position: relative;
4985
+ --x-number-aspect-ratio-picture: 1;
5035
4986
  }
5036
4987
 
5037
- .x-result:hover .x-picture--cover:after,
5038
- .x-picture--cover:hover:after {
5039
- content: "";
5040
- display: block;
5041
- position: absolute;
5042
- top: 0;
5043
- left: 0;
5044
- background: linear-gradient(to bottom, var(--x-color-background-picture-cover-hover-from) 50%, var(--x-color-background-picture-cover-hover-to) 100%);
4988
+ .x-picture--fixed-ratio.x-picture {
4989
+ aspect-ratio: var(--x-number-aspect-ratio-picture);
5045
4990
  width: 100%;
5046
- height: 100%;
5047
- }
5048
- :root {
5049
- --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5050
- --x-mix-blend-mode-picture-colored: multiply;
5051
- --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5052
- --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5053
- }
5054
- :root {
5055
- --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5056
- --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5057
- --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5058
- --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5059
- --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5060
- }
5061
- :root {
5062
- --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5063
- --x-mix-blend-mode-picture-colored: multiply;
5064
- --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5065
- --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5066
- }
5067
-
5068
- .x-picture--colored.x-picture {
5069
- --x-color-background-picture-default: var(--x-color-background-picture-colored);
5070
- }
5071
- .x-picture--colored.x-picture .x-picture-image {
5072
- --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-colored);
5073
- }
5074
- .x-picture--colored.x-picture .x-picture--fallback {
5075
- --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-fallback-colored);
5076
- }
5077
- .x-picture--colored.x-picture .x-picture--placeholder {
5078
- --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
5079
- }
5080
- :root {
5081
- --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5082
- --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5083
- --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5084
- --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5085
- --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5086
- }
5087
-
5088
- .x-picture--card.x-picture {
5089
- --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
5090
- --x-size-border-radius-top-picture-default: var(--x-size-border-radius-top-picture-card);
5091
- --x-size-border-radius-right-picture-default: var(--x-size-border-radius-right-picture-card);
5092
- --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
5093
- --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
5094
4991
  }
5095
4992
  :root {
5096
- --x-color-background-option-list-button-default: transparent;
5097
- --x-color-border-option-list-button-default: transparent;
5098
- --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
5099
- --x-color-background-option-list-button-default-hover: var(
5100
- --x-color-background-option-list-button-default
5101
- );
5102
- --x-color-border-option-list-button-default-hover: var(
5103
- --x-color-border-option-list-button-default
5104
- );
5105
- --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
5106
- --x-color-background-option-list-button-default-selected: var(
5107
- --x-color-background-option-list-button-default
5108
- );
5109
- --x-color-border-option-list-button-default-selected: var(
5110
- --x-color-border-option-list-button-default
5111
- );
5112
- --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
5113
- --x-color-background-option-list-button-default-selected-hover: var(
5114
- --x-color-background-option-list-button-default-selected
5115
- );
5116
- --x-color-border-option-list-button-default-selected-hover: var(
5117
- --x-color-border-option-list-button-default-selected
5118
- );
5119
- --x-color-text-option-list-button-default-selected-hover: var(
5120
- --x-color-text-option-list-button-default-selected
5121
- );
5122
- --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
5123
- --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
5124
- --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
5125
- --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
5126
- --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
5127
- --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
5128
- --x-color-border-top-option-list-item-default-selected: var(
5129
- --x-color-border-option-list-item-default-selected
5130
- );
5131
- --x-color-border-right-option-list-item-default-selected: var(
5132
- --x-color-border-option-list-item-default-selected
5133
- );
5134
- --x-color-border-bottom-option-list-item-default-selected: var(
5135
- --x-color-border-option-list-item-default-selected
5136
- );
5137
- --x-color-border-left-option-list-item-default-selected: var(
5138
- --x-color-border-option-list-item-default-selected
5139
- );
5140
- --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
5141
- --x-size-border-width-top-option-list-item-default: 0;
5142
- --x-size-border-width-right-option-list-item-default: var(
5143
- --x-size-border-width-option-list-item-default
5144
- );
5145
- --x-size-border-width-bottom-option-list-item-default: 0;
5146
- --x-size-border-width-left-option-list-item-default: 0;
5147
- --x-size-border-width-top-option-list-item-default-selected: var(
5148
- --x-size-border-width-top-option-list-item-default
5149
- );
5150
- --x-size-border-width-right-option-list-item-default-selected: var(
5151
- --x-size-border-width-right-option-list-item-default
5152
- );
5153
- --x-size-border-width-bottom-option-list-item-default-selected: var(
5154
- --x-size-border-width-bottom-option-list-item-default
5155
- );
5156
- --x-size-border-width-left-option-list-item-default-selected: var(
5157
- --x-size-border-width-left-option-list-item-default
5158
- );
5159
- --x-size-padding-option-list-button-default: var(--x-size-base-02);
5160
- --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
5161
- --x-size-padding-right-option-list-button-default: var(
5162
- --x-size-padding-option-list-button-default
5163
- );
5164
- --x-size-padding-bottom-option-list-button-default: var(
5165
- --x-size-padding-option-list-button-default
5166
- );
5167
- --x-size-padding-left-option-list-button-default: var(
5168
- --x-size-padding-option-list-button-default
5169
- );
5170
- --x-font-decoration-option-list-button-default-hover: underline;
5171
- --x-size-font-option-list-button-default: var(--x-size-font-text);
5172
- --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5173
- --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
4993
+ --x-size-border-radius-picture-default: 0;
4994
+ --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
4995
+ --x-size-border-radius-right-picture-default: var(--x-size-border-radius-picture-default);
4996
+ --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-picture-default);
4997
+ --x-size-border-radius-left-picture-default: var(--x-size-border-radius-picture-default);
4998
+ --x-color-background-picture-default: transparent;
4999
+ --x-color-fill-picture-placeholder-path-default: var(--x-color-base-neutral-70);
5000
+ --x-color-fill-picture-placeholder-rect-default: var(--x-color-base-neutral-95);
5001
+ --x-color-fill-picture-fallback-path-default: var(--x-color-base-neutral-70);
5002
+ --x-color-fill-picture-fallback-rect-default: var(--x-color-base-neutral-95);
5003
+ --x-object-fit-picture-default: contain;
5004
+ --x-object-fit-picture-fallback-default: var(--x-object-fit-picture-default);
5005
+ --x-object-fit-picture-placeholder-default: var(--x-object-fit-picture-default);
5006
+ --x-mix-blend-mode-picture-default: normal;
5007
+ --x-mix-blend-mode-picture-fallback-default: var(--x-mix-blend-mode-picture-default);
5008
+ --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
5009
+ }
5010
+ :root {
5011
+ --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5012
+ --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5013
+ }
5014
+
5015
+ .x-picture--cover.x-picture {
5016
+ position: relative;
5017
+ }
5018
+
5019
+ .x-result:hover .x-picture--cover:after,
5020
+ .x-picture--cover:hover:after {
5021
+ content: "";
5022
+ display: block;
5023
+ position: absolute;
5024
+ top: 0;
5025
+ left: 0;
5026
+ background: linear-gradient(to bottom, var(--x-color-background-picture-cover-hover-from) 50%, var(--x-color-background-picture-cover-hover-to) 100%);
5027
+ width: 100%;
5028
+ height: 100%;
5029
+ }
5030
+ :root {
5031
+ --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
5032
+ }
5033
+ :root {
5034
+ --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5035
+ --x-mix-blend-mode-picture-colored: multiply;
5036
+ --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5037
+ --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5038
+ }
5039
+ :root {
5040
+ --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5041
+ --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5042
+ --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5043
+ --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5044
+ --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5045
+ }
5046
+ :root {
5047
+ --x-number-zoom-scale-picture: 1.1;
5048
+ --x-number-zoom-duration-picture: 0.3s;
5049
+ }
5050
+
5051
+ .x-picture--zoom .x-picture-image {
5052
+ transition: transform var(--x-number-zoom-duration-picture) ease-out;
5053
+ }
5054
+ .x-picture--zoom .x-picture-image:hover {
5055
+ transform: scale(var(--x-number-zoom-scale-picture));
5174
5056
  }
5175
5057
  :root {
5176
5058
  --x-color-background-option-list-button-default: transparent;
@@ -5252,117 +5134,20 @@
5252
5134
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
5253
5135
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
5254
5136
  }
5255
-
5256
- .x-option-list {
5257
- display: inline-flex;
5258
- flex-flow: row nowrap;
5259
- align-items: center;
5260
- box-sizing: border-box;
5261
- list-style-type: none;
5262
- margin: 0;
5263
- padding: 0;
5264
- }
5265
- [dir="ltr"] .x-option-list__item {
5266
- border-right-width: var(--x-size-border-width-right-option-list-item-default);
5267
- }
5268
- [dir="rtl"] .x-option-list__item {
5269
- border-left-width: var(--x-size-border-width-right-option-list-item-default);
5270
- }
5271
- [dir="ltr"] .x-option-list__item {
5272
- border-left-width: var(--x-size-border-width-left-option-list-item-default);
5273
- }
5274
- [dir="rtl"] .x-option-list__item {
5275
- border-right-width: var(--x-size-border-width-left-option-list-item-default);
5276
- }
5277
- .x-option-list__item {
5278
- border-top-color: var(--x-color-border-top-option-list-item-default);
5279
- border-right-color: var(--x-color-border-right-option-list-item-default);
5280
- border-bottom-color: var(--x-color-border-bottom-option-list-item-default);
5281
- border-left-color: var(--x-color-border-left-option-list-item-default);
5282
- border-style: solid;
5283
- border-top-width: var(--x-size-border-width-top-option-list-item-default);
5284
- border-bottom-width: var(--x-size-border-width-bottom-option-list-item-default);
5285
- }
5286
- .x-option-list__item.x-option-list__item--is-selected {
5287
- --x-color-border-option-list-item-default: var(
5288
- --x-color-border-option-list-item-default-selected
5289
- );
5290
- --x-color-border-top-option-list-item-default: var(
5291
- --x-color-border-top-option-list-item-default-selected
5292
- );
5293
- --x-color-border-right-option-list-item-default: var(
5294
- --x-color-border-right-option-list-item-default-selected
5295
- );
5296
- --x-color-border-bottom-option-list-item-default: var(
5297
- --x-color-border-bottom-option-list-item-default-selected
5298
- );
5299
- --x-color-border-left-option-list-item-default: var(
5300
- --x-color-border-left-option-list-item-default-selected
5301
- );
5302
- --x-size-border-width-top-option-list-item-default: var(
5303
- --x-size-border-width-top-option-list-item-default-selected
5304
- );
5305
- --x-size-border-width-right-option-list-item-default: var(
5306
- --x-size-border-width-right-option-list-item-default-selected
5307
- );
5308
- --x-size-border-width-bottom-option-list-item-default: var(
5309
- --x-size-border-width-bottom-option-list-item-default-selected
5310
- );
5311
- --x-size-border-width-left-option-list-item-default: var(
5312
- --x-size-border-width-left-option-list-item-default-selected
5313
- );
5314
- }
5315
- .x-option-list__item.x-option-list__item--is-selected .x-button {
5316
- --x-color-background-button-default: var(
5317
- --x-color-background-option-list-button-default-selected
5318
- );
5319
- --x-color-border-button-default: var(--x-color-border-option-list-button-default-selected);
5320
- --x-color-text-button-default: var(--x-color-text-option-list-button-default-selected);
5321
- --x-number-font-weight-option-list-button-default: var(
5322
- --x-number-font-weight-option-list-button-default-selected
5323
- );
5324
- }
5325
- .x-option-list__item.x-option-list__item--is-selected .x-button:hover {
5326
- --x-color-background-button-default: var(
5327
- --x-color-background-option-list-button-default-selected-hover
5328
- );
5329
- --x-color-border-button-default: var(
5330
- --x-color-border-option-list-button-default-selected-hover
5331
- );
5332
- --x-color-text-button-default: var(
5333
- --x-color-text-option-list-button-default-selected-hover
5334
- );
5335
- }
5336
- .x-option-list__item:last-child {
5337
- --x-size-border-width-option-list-item-default: 0;
5338
- --x-size-border-width-top-option-list-item-default: 0;
5339
- --x-size-border-width-right-option-list-item-default: 0;
5340
- --x-size-border-width-bottom-option-list-item-default: 0;
5341
- --x-size-border-width-left-option-list-item-default: 0;
5342
- }
5343
- .x-option-list__item .x-button {
5344
- --x-color-background-button-default: var(--x-color-background-option-list-button-default);
5345
- --x-color-border-button-default: var(--x-color-border-option-list-button-default);
5346
- --x-color-text-button-default: var(--x-color-text-option-list-button-default);
5347
- min-height: auto;
5348
- --x-size-padding-button-default: var(--x-size-padding-option-list-button-default);
5349
- --x-size-padding-top-button-default: var(--x-size-padding-top-option-list-button-default);
5350
- --x-size-padding-right-button-default: var(--x-size-padding-right-option-list-button-default);
5351
- --x-size-padding-bottom-button-default: var(
5352
- --x-size-padding-bottom-option-list-button-default
5353
- );
5354
- --x-size-padding-left-button-default: var(--x-size-padding-left-option-list-button-default);
5355
- --x-number-font-weight-button-default: var(--x-number-font-weight-option-list-button-default);
5356
- --x-size-font-button-default: var(--x-size-font-option-list-button-default);
5137
+ :root {
5138
+ --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
5139
+ --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
5140
+ --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
5141
+ --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
5142
+ --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
5357
5143
  }
5358
- .x-option-list__item .x-button:hover {
5359
- --x-color-background-button-default: var(
5360
- --x-color-background-option-list-button-default-hover
5361
- );
5362
- --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
5363
- --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
5364
- -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5365
- text-decoration: var(--x-font-decoration-option-list-button-default-hover);
5144
+
5145
+ .x-picture--card.x-picture {
5146
+ --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
5147
+ --x-size-border-radius-top-picture-default: var(--x-size-border-radius-top-picture-card);
5148
+ --x-size-border-radius-right-picture-default: var(--x-size-border-radius-right-picture-card);
5149
+ --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
5150
+ --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
5366
5151
  }
5367
5152
  :root {
5368
5153
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
@@ -5409,6 +5194,25 @@
5409
5194
  --x-number-font-weight-base-regular
5410
5195
  );
5411
5196
  }
5197
+ :root {
5198
+ --x-color-background-picture-colored: var(--x-color-base-neutral-95);
5199
+ --x-mix-blend-mode-picture-colored: multiply;
5200
+ --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
5201
+ --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
5202
+ }
5203
+
5204
+ .x-picture--colored.x-picture {
5205
+ --x-color-background-picture-default: var(--x-color-background-picture-colored);
5206
+ }
5207
+ .x-picture--colored.x-picture .x-picture-image {
5208
+ --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-colored);
5209
+ }
5210
+ .x-picture--colored.x-picture .x-picture--fallback {
5211
+ --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-fallback-colored);
5212
+ }
5213
+ .x-picture--colored.x-picture .x-picture--placeholder {
5214
+ --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
5215
+ }
5412
5216
  :root {
5413
5217
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
5414
5218
  --x-color-text-option-list-button-bottom-selected-hover: var(
@@ -5541,8 +5345,8 @@
5541
5345
  --x-size-border-width-left-option-list-item-default: inherit;
5542
5346
  }
5543
5347
  :root {
5544
- --x-modal-overlay-color: rgb(0, 0, 0);
5545
- --x-modal-overlay-opacity: 0.7;
5348
+ --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
5349
+ --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
5546
5350
  }
5547
5351
  :root {
5548
5352
  --x-modal-overlay-color: rgb(0, 0, 0);
@@ -5574,27 +5378,6 @@
5574
5378
  --x-size-font-message-default: var(--x-size-font-title3);
5575
5379
  --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5576
5380
  }
5577
- :root {
5578
- --x-string-justify-message-default: center;
5579
- --x-size-gap-message-default: var(--x-size-base-03);
5580
- --x-size-padding-message-default: var(--x-size-base-06);
5581
- --x-color-background-message-default: var(--x-color-base-neutral-95);
5582
- --x-color-border-message-default: var(--x-color-background-message-default);
5583
- --x-color-text-message-default: var(--x-color-text-default);
5584
- --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
5585
- --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
5586
- --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
5587
- --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
5588
- --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
5589
- --x-size-border-width-message-default: var(--x-size-border-width-base);
5590
- --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
5591
- --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
5592
- --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
5593
- --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
5594
- --x-font-family-message-default: var(--x-font-family-title3);
5595
- --x-size-font-message-default: var(--x-size-font-title3);
5596
- --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
5597
- }
5598
5381
 
5599
5382
  [dir="ltr"] .x-message {
5600
5383
  border-left-width: var(--x-size-border-width-left-message-default);
@@ -5645,6 +5428,10 @@
5645
5428
  .x-message > p {
5646
5429
  margin: 0;
5647
5430
  }
5431
+ :root {
5432
+ --x-modal-overlay-color: rgb(0, 0, 0);
5433
+ --x-modal-overlay-opacity: 0.7;
5434
+ }
5648
5435
  /* @deprecated */
5649
5436
  :root {
5650
5437
  --x-size-padding-list-01: var(--x-size-base-01);
@@ -5999,29 +5786,7 @@
5999
5786
  --x-size-padding-list-10: var(--x-size-base-10);
6000
5787
  --x-size-padding-list-11: var(--x-size-base-11);
6001
5788
  --x-size-padding-list-12: var(--x-size-base-12);
6002
- --x-size-padding-list-13: var(--x-size-base-13);
6003
- }
6004
- :root {
6005
- --x-size-gap-list-01: var(--x-size-base-01);
6006
- --x-size-gap-list-02: var(--x-size-base-02);
6007
- --x-size-gap-list-03: var(--x-size-base-03);
6008
- --x-size-gap-list-04: var(--x-size-base-04);
6009
- --x-size-gap-list-05: var(--x-size-base-05);
6010
- --x-size-gap-list-06: var(--x-size-base-06);
6011
- --x-size-gap-list-07: var(--x-size-base-07);
6012
- --x-size-gap-list-08: var(--x-size-base-08);
6013
- --x-size-gap-list-09: var(--x-size-base-09);
6014
- --x-size-gap-list-10: var(--x-size-base-10);
6015
- --x-size-gap-list-11: var(--x-size-base-11);
6016
- --x-size-gap-list-12: var(--x-size-base-12);
6017
- --x-size-gap-list-13: var(--x-size-base-13);
6018
- --x-size-gap-list-14: var(--x-size-base-14);
6019
- --x-size-gap-list-15: var(--x-size-base-15);
6020
- --x-size-gap-list-16: var(--x-size-base-16);
6021
- --x-size-gap-list-17: var(--x-size-base-17);
6022
- --x-size-gap-list-18: var(--x-size-base-18);
6023
- --x-size-gap-list-19: var(--x-size-base-19);
6024
- --x-size-gap-list-20: var(--x-size-base-20);
5789
+ --x-size-padding-list-13: var(--x-size-base-13);
6025
5790
  }
6026
5791
  :root {
6027
5792
  --x-size-gap-list-01: var(--x-size-base-01);
@@ -6553,14 +6318,6 @@
6553
6318
  --x-size-align-list: stretch;
6554
6319
  --x-size-align-list-stretch: stretch;
6555
6320
  }
6556
- :root {
6557
- --x-string-flow-list: column nowrap;
6558
- --x-size-padding-list: 0;
6559
- --x-size-gap-list: 0;
6560
- --x-size-justify-list: stretch;
6561
- --x-size-align-list: stretch;
6562
- --x-size-align-list-stretch: stretch;
6563
- }
6564
6321
 
6565
6322
  .x-list {
6566
6323
  display: flex;
@@ -6702,13 +6459,239 @@
6702
6459
  flex: 12 1 auto;
6703
6460
  }
6704
6461
  :root {
6705
- --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6706
- --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6707
- --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6708
- --x-size-border-radius-bottom-right-input-group-pill: var(
6709
- --x-size-border-radius-input-group-pill
6462
+ --x-color-background-option-list-button-default: transparent;
6463
+ --x-color-border-option-list-button-default: transparent;
6464
+ --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
6465
+ --x-color-background-option-list-button-default-hover: var(
6466
+ --x-color-background-option-list-button-default
6710
6467
  );
6711
- --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6468
+ --x-color-border-option-list-button-default-hover: var(
6469
+ --x-color-border-option-list-button-default
6470
+ );
6471
+ --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
6472
+ --x-color-background-option-list-button-default-selected: var(
6473
+ --x-color-background-option-list-button-default
6474
+ );
6475
+ --x-color-border-option-list-button-default-selected: var(
6476
+ --x-color-border-option-list-button-default
6477
+ );
6478
+ --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
6479
+ --x-color-background-option-list-button-default-selected-hover: var(
6480
+ --x-color-background-option-list-button-default-selected
6481
+ );
6482
+ --x-color-border-option-list-button-default-selected-hover: var(
6483
+ --x-color-border-option-list-button-default-selected
6484
+ );
6485
+ --x-color-text-option-list-button-default-selected-hover: var(
6486
+ --x-color-text-option-list-button-default-selected
6487
+ );
6488
+ --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
6489
+ --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
6490
+ --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
6491
+ --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
6492
+ --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
6493
+ --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
6494
+ --x-color-border-top-option-list-item-default-selected: var(
6495
+ --x-color-border-option-list-item-default-selected
6496
+ );
6497
+ --x-color-border-right-option-list-item-default-selected: var(
6498
+ --x-color-border-option-list-item-default-selected
6499
+ );
6500
+ --x-color-border-bottom-option-list-item-default-selected: var(
6501
+ --x-color-border-option-list-item-default-selected
6502
+ );
6503
+ --x-color-border-left-option-list-item-default-selected: var(
6504
+ --x-color-border-option-list-item-default-selected
6505
+ );
6506
+ --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
6507
+ --x-size-border-width-top-option-list-item-default: 0;
6508
+ --x-size-border-width-right-option-list-item-default: var(
6509
+ --x-size-border-width-option-list-item-default
6510
+ );
6511
+ --x-size-border-width-bottom-option-list-item-default: 0;
6512
+ --x-size-border-width-left-option-list-item-default: 0;
6513
+ --x-size-border-width-top-option-list-item-default-selected: var(
6514
+ --x-size-border-width-top-option-list-item-default
6515
+ );
6516
+ --x-size-border-width-right-option-list-item-default-selected: var(
6517
+ --x-size-border-width-right-option-list-item-default
6518
+ );
6519
+ --x-size-border-width-bottom-option-list-item-default-selected: var(
6520
+ --x-size-border-width-bottom-option-list-item-default
6521
+ );
6522
+ --x-size-border-width-left-option-list-item-default-selected: var(
6523
+ --x-size-border-width-left-option-list-item-default
6524
+ );
6525
+ --x-size-padding-option-list-button-default: var(--x-size-base-02);
6526
+ --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
6527
+ --x-size-padding-right-option-list-button-default: var(
6528
+ --x-size-padding-option-list-button-default
6529
+ );
6530
+ --x-size-padding-bottom-option-list-button-default: var(
6531
+ --x-size-padding-option-list-button-default
6532
+ );
6533
+ --x-size-padding-left-option-list-button-default: var(
6534
+ --x-size-padding-option-list-button-default
6535
+ );
6536
+ --x-font-decoration-option-list-button-default-hover: underline;
6537
+ --x-size-font-option-list-button-default: var(--x-size-font-text);
6538
+ --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
6539
+ --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
6540
+ }
6541
+
6542
+ .x-option-list {
6543
+ display: inline-flex;
6544
+ flex-flow: row nowrap;
6545
+ align-items: center;
6546
+ box-sizing: border-box;
6547
+ list-style-type: none;
6548
+ margin: 0;
6549
+ padding: 0;
6550
+ }
6551
+ [dir="ltr"] .x-option-list__item {
6552
+ border-right-width: var(--x-size-border-width-right-option-list-item-default);
6553
+ }
6554
+ [dir="rtl"] .x-option-list__item {
6555
+ border-left-width: var(--x-size-border-width-right-option-list-item-default);
6556
+ }
6557
+ [dir="ltr"] .x-option-list__item {
6558
+ border-left-width: var(--x-size-border-width-left-option-list-item-default);
6559
+ }
6560
+ [dir="rtl"] .x-option-list__item {
6561
+ border-right-width: var(--x-size-border-width-left-option-list-item-default);
6562
+ }
6563
+ .x-option-list__item {
6564
+ border-top-color: var(--x-color-border-top-option-list-item-default);
6565
+ border-right-color: var(--x-color-border-right-option-list-item-default);
6566
+ border-bottom-color: var(--x-color-border-bottom-option-list-item-default);
6567
+ border-left-color: var(--x-color-border-left-option-list-item-default);
6568
+ border-style: solid;
6569
+ border-top-width: var(--x-size-border-width-top-option-list-item-default);
6570
+ border-bottom-width: var(--x-size-border-width-bottom-option-list-item-default);
6571
+ }
6572
+ .x-option-list__item.x-option-list__item--is-selected {
6573
+ --x-color-border-option-list-item-default: var(
6574
+ --x-color-border-option-list-item-default-selected
6575
+ );
6576
+ --x-color-border-top-option-list-item-default: var(
6577
+ --x-color-border-top-option-list-item-default-selected
6578
+ );
6579
+ --x-color-border-right-option-list-item-default: var(
6580
+ --x-color-border-right-option-list-item-default-selected
6581
+ );
6582
+ --x-color-border-bottom-option-list-item-default: var(
6583
+ --x-color-border-bottom-option-list-item-default-selected
6584
+ );
6585
+ --x-color-border-left-option-list-item-default: var(
6586
+ --x-color-border-left-option-list-item-default-selected
6587
+ );
6588
+ --x-size-border-width-top-option-list-item-default: var(
6589
+ --x-size-border-width-top-option-list-item-default-selected
6590
+ );
6591
+ --x-size-border-width-right-option-list-item-default: var(
6592
+ --x-size-border-width-right-option-list-item-default-selected
6593
+ );
6594
+ --x-size-border-width-bottom-option-list-item-default: var(
6595
+ --x-size-border-width-bottom-option-list-item-default-selected
6596
+ );
6597
+ --x-size-border-width-left-option-list-item-default: var(
6598
+ --x-size-border-width-left-option-list-item-default-selected
6599
+ );
6600
+ }
6601
+ .x-option-list__item.x-option-list__item--is-selected .x-button {
6602
+ --x-color-background-button-default: var(
6603
+ --x-color-background-option-list-button-default-selected
6604
+ );
6605
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default-selected);
6606
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default-selected);
6607
+ --x-number-font-weight-option-list-button-default: var(
6608
+ --x-number-font-weight-option-list-button-default-selected
6609
+ );
6610
+ }
6611
+ .x-option-list__item.x-option-list__item--is-selected .x-button:hover {
6612
+ --x-color-background-button-default: var(
6613
+ --x-color-background-option-list-button-default-selected-hover
6614
+ );
6615
+ --x-color-border-button-default: var(
6616
+ --x-color-border-option-list-button-default-selected-hover
6617
+ );
6618
+ --x-color-text-button-default: var(
6619
+ --x-color-text-option-list-button-default-selected-hover
6620
+ );
6621
+ }
6622
+ .x-option-list__item:last-child {
6623
+ --x-size-border-width-option-list-item-default: 0;
6624
+ --x-size-border-width-top-option-list-item-default: 0;
6625
+ --x-size-border-width-right-option-list-item-default: 0;
6626
+ --x-size-border-width-bottom-option-list-item-default: 0;
6627
+ --x-size-border-width-left-option-list-item-default: 0;
6628
+ }
6629
+ .x-option-list__item .x-button {
6630
+ --x-color-background-button-default: var(--x-color-background-option-list-button-default);
6631
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default);
6632
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default);
6633
+ min-height: auto;
6634
+ --x-size-padding-button-default: var(--x-size-padding-option-list-button-default);
6635
+ --x-size-padding-top-button-default: var(--x-size-padding-top-option-list-button-default);
6636
+ --x-size-padding-right-button-default: var(--x-size-padding-right-option-list-button-default);
6637
+ --x-size-padding-bottom-button-default: var(
6638
+ --x-size-padding-bottom-option-list-button-default
6639
+ );
6640
+ --x-size-padding-left-button-default: var(--x-size-padding-left-option-list-button-default);
6641
+ --x-number-font-weight-button-default: var(--x-number-font-weight-option-list-button-default);
6642
+ --x-size-font-button-default: var(--x-size-font-option-list-button-default);
6643
+ }
6644
+ .x-option-list__item .x-button:hover {
6645
+ --x-color-background-button-default: var(
6646
+ --x-color-background-option-list-button-default-hover
6647
+ );
6648
+ --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
6649
+ --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
6650
+ -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
6651
+ text-decoration: var(--x-font-decoration-option-list-button-default-hover);
6652
+ }
6653
+ :root {
6654
+ --x-size-gap-list-01: var(--x-size-base-01);
6655
+ --x-size-gap-list-02: var(--x-size-base-02);
6656
+ --x-size-gap-list-03: var(--x-size-base-03);
6657
+ --x-size-gap-list-04: var(--x-size-base-04);
6658
+ --x-size-gap-list-05: var(--x-size-base-05);
6659
+ --x-size-gap-list-06: var(--x-size-base-06);
6660
+ --x-size-gap-list-07: var(--x-size-base-07);
6661
+ --x-size-gap-list-08: var(--x-size-base-08);
6662
+ --x-size-gap-list-09: var(--x-size-base-09);
6663
+ --x-size-gap-list-10: var(--x-size-base-10);
6664
+ --x-size-gap-list-11: var(--x-size-base-11);
6665
+ --x-size-gap-list-12: var(--x-size-base-12);
6666
+ --x-size-gap-list-13: var(--x-size-base-13);
6667
+ --x-size-gap-list-14: var(--x-size-base-14);
6668
+ --x-size-gap-list-15: var(--x-size-base-15);
6669
+ --x-size-gap-list-16: var(--x-size-base-16);
6670
+ --x-size-gap-list-17: var(--x-size-base-17);
6671
+ --x-size-gap-list-18: var(--x-size-base-18);
6672
+ --x-size-gap-list-19: var(--x-size-base-19);
6673
+ --x-size-gap-list-20: var(--x-size-base-20);
6674
+ }
6675
+ :root {
6676
+ --x-string-justify-message-default: center;
6677
+ --x-size-gap-message-default: var(--x-size-base-03);
6678
+ --x-size-padding-message-default: var(--x-size-base-06);
6679
+ --x-color-background-message-default: var(--x-color-base-neutral-95);
6680
+ --x-color-border-message-default: var(--x-color-background-message-default);
6681
+ --x-color-text-message-default: var(--x-color-text-default);
6682
+ --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
6683
+ --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
6684
+ --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
6685
+ --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
6686
+ --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
6687
+ --x-size-border-width-message-default: var(--x-size-border-width-base);
6688
+ --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
6689
+ --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
6690
+ --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
6691
+ --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
6692
+ --x-font-family-message-default: var(--x-font-family-title3);
6693
+ --x-size-font-message-default: var(--x-size-font-title3);
6694
+ --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
6712
6695
  }
6713
6696
  :root {
6714
6697
  --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
@@ -6745,6 +6728,15 @@
6745
6728
  --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6746
6729
  --x-size-border-width-left-input-group-line: 0;
6747
6730
  }
6731
+ :root {
6732
+ --x-size-padding-left-input-group-line: 0;
6733
+ --x-size-padding-right-input-group-line: 0;
6734
+ --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
6735
+ --x-size-border-width-top-input-group-line: 0;
6736
+ --x-size-border-width-right-input-group-line: 0;
6737
+ --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6738
+ --x-size-border-width-left-input-group-line: 0;
6739
+ }
6748
6740
 
6749
6741
  .x-input-group--line .x-input-group,
6750
6742
  .x-input-group--line.x-input-group {
@@ -6783,15 +6775,6 @@
6783
6775
  margin-top: calc(var(--x-size-border-width-top-input-group-line) * -1) !important;
6784
6776
  margin-bottom: calc(var(--x-size-border-width-bottom-input-group-line) * -1) !important;
6785
6777
  }
6786
- :root {
6787
- --x-size-padding-left-input-group-line: 0;
6788
- --x-size-padding-right-input-group-line: 0;
6789
- --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
6790
- --x-size-border-width-top-input-group-line: 0;
6791
- --x-size-border-width-right-input-group-line: 0;
6792
- --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
6793
- --x-size-border-width-left-input-group-line: 0;
6794
- }
6795
6778
  :root {
6796
6779
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6797
6780
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -6835,6 +6818,48 @@
6835
6818
  );
6836
6819
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
6837
6820
  }
6821
+ :root {
6822
+ --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
6823
+ --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6824
+ --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
6825
+ --x-size-border-radius-bottom-right-input-group-pill: var(
6826
+ --x-size-border-radius-input-group-pill
6827
+ );
6828
+ --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
6829
+ }
6830
+ :root {
6831
+ --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6832
+ --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
6833
+ --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
6834
+ --x-size-border-radius-bottom-right-input-group-card: var(
6835
+ --x-size-border-radius-input-group-card
6836
+ );
6837
+ --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6838
+ }
6839
+ :root {
6840
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
6841
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
6842
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
6843
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
6844
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
6845
+ }
6846
+
6847
+ .x-input--pill.x-input,
6848
+ .x-input--pill .x-input {
6849
+ --x-size-border-radius-input-default: var(--x-size-border-radius-input-pill);
6850
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-pill);
6851
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-pill);
6852
+ --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-pill);
6853
+ --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
6854
+ }
6855
+ :root {
6856
+ --x-string-flow-list: column nowrap;
6857
+ --x-size-padding-list: 0;
6858
+ --x-size-gap-list: 0;
6859
+ --x-size-justify-list: stretch;
6860
+ --x-size-align-list: stretch;
6861
+ --x-size-align-list-stretch: stretch;
6862
+ }
6838
6863
  :root {
6839
6864
  --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
6840
6865
  --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
@@ -6844,6 +6869,71 @@
6844
6869
  );
6845
6870
  --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
6846
6871
  }
6872
+
6873
+ .x-input-group--card.x-input-group,
6874
+ .x-input-group--card .x-input-group {
6875
+ --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
6876
+ --x-size-border-radius-top-left-input-group-default: var(
6877
+ --x-size-border-radius-top-left-input-group-card
6878
+ );
6879
+ --x-size-border-radius-top-right-input-group-default: var(
6880
+ --x-size-border-radius-top-right-input-group-card
6881
+ );
6882
+ --x-size-border-radius-bottom-right-input-group-default: var(
6883
+ --x-size-border-radius-bottom-right-input-group-card
6884
+ );
6885
+ --x-size-border-radius-bottom-left-input-group-default: var(
6886
+ --x-size-border-radius-bottom-left-input-group-card
6887
+ );
6888
+ }
6889
+ .x-input-group--card.x-input-group__action:first-child,
6890
+ .x-input-group--card .x-input-group__action:first-child {
6891
+ --x-size-border-radius-top-right-input-group-default: 0;
6892
+ --x-size-border-radius-bottom-right-input-group-default: 0;
6893
+ }
6894
+ .x-input-group--card.x-input-group__action:last-child,
6895
+ .x-input-group--card .x-input-group__action:last-child {
6896
+ --x-size-border-radius-top-left-input-group-default: 0;
6897
+ --x-size-border-radius-bottom-left-input-group-default: 0;
6898
+ }
6899
+ :root {
6900
+ --x-size-padding-top-input-line: var(--x-size-base-03);
6901
+ --x-size-padding-right-input-line: 0;
6902
+ --x-size-padding-bottom-input-line: var(--x-size-base-03);
6903
+ --x-size-padding-left-input-line: 0;
6904
+ --x-size-border-width-top-input-line: 0;
6905
+ --x-size-border-width-right-input-line: 0;
6906
+ --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
6907
+ --x-size-border-width-left-input-line: 0;
6908
+ }
6909
+ :root {
6910
+ --x-color-background-input-default: var(--x-color-base-neutral-100);
6911
+ --x-color-border-input-default: var(--x-color-base-neutral-70);
6912
+ --x-color-border-input-default-focus: var(--x-color-base-lead);
6913
+ --x-color-text-input-default: var(--x-color-text-default);
6914
+ --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
6915
+ --x-size-border-width-input-default: var(--x-size-border-width-base);
6916
+ --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
6917
+ --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
6918
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
6919
+ --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
6920
+ --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
6921
+ --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
6922
+ --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
6923
+ --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
6924
+ --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
6925
+ --x-size-height-input-default: var(--x-size-base-07);
6926
+ --x-size-padding-right-input-default: var(--x-size-base-04);
6927
+ --x-size-padding-left-input-default: var(--x-size-base-04);
6928
+ --x-font-family-input-default: var(--x-font-family-text);
6929
+ --x-size-font-input-default: var(--x-size-font-text);
6930
+ --x-size-line-height-input-default: var(--x-size-line-height-text);
6931
+ --x-number-font-weight-input-default: var(--x-number-font-weight-text);
6932
+ --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
6933
+ --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
6934
+ --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
6935
+ --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
6936
+ }
6847
6937
  :root {
6848
6938
  --x-color-background-input-group-default: var(--x-color-background-input-default);
6849
6939
  --x-color-border-input-group-default: var(--x-color-border-input-default);
@@ -7021,125 +7111,6 @@
7021
7111
  [dir="rtl"] .x-input-group > .x-input-group__action:last-child {
7022
7112
  margin-left: calc(var(--x-size-border-width-right-input-group-default) * -1);
7023
7113
  }
7024
- :root {
7025
- --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
7026
- --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
7027
- --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
7028
- --x-size-border-radius-bottom-right-input-group-card: var(
7029
- --x-size-border-radius-input-group-card
7030
- );
7031
- --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
7032
- }
7033
-
7034
- .x-input-group--card.x-input-group,
7035
- .x-input-group--card .x-input-group {
7036
- --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
7037
- --x-size-border-radius-top-left-input-group-default: var(
7038
- --x-size-border-radius-top-left-input-group-card
7039
- );
7040
- --x-size-border-radius-top-right-input-group-default: var(
7041
- --x-size-border-radius-top-right-input-group-card
7042
- );
7043
- --x-size-border-radius-bottom-right-input-group-default: var(
7044
- --x-size-border-radius-bottom-right-input-group-card
7045
- );
7046
- --x-size-border-radius-bottom-left-input-group-default: var(
7047
- --x-size-border-radius-bottom-left-input-group-card
7048
- );
7049
- }
7050
- .x-input-group--card.x-input-group__action:first-child,
7051
- .x-input-group--card .x-input-group__action:first-child {
7052
- --x-size-border-radius-top-right-input-group-default: 0;
7053
- --x-size-border-radius-bottom-right-input-group-default: 0;
7054
- }
7055
- .x-input-group--card.x-input-group__action:last-child,
7056
- .x-input-group--card .x-input-group__action:last-child {
7057
- --x-size-border-radius-top-left-input-group-default: 0;
7058
- --x-size-border-radius-bottom-left-input-group-default: 0;
7059
- }
7060
- :root {
7061
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7062
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7063
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7064
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7065
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7066
- }
7067
- :root {
7068
- --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7069
- --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7070
- --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7071
- --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7072
- --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7073
- }
7074
-
7075
- .x-input--pill.x-input,
7076
- .x-input--pill .x-input {
7077
- --x-size-border-radius-input-default: var(--x-size-border-radius-input-pill);
7078
- --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-pill);
7079
- --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-pill);
7080
- --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-pill);
7081
- --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
7082
- }
7083
- :root {
7084
- --x-size-padding-top-input-line: var(--x-size-base-03);
7085
- --x-size-padding-right-input-line: 0;
7086
- --x-size-padding-bottom-input-line: var(--x-size-base-03);
7087
- --x-size-padding-left-input-line: 0;
7088
- --x-size-border-width-top-input-line: 0;
7089
- --x-size-border-width-right-input-line: 0;
7090
- --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7091
- --x-size-border-width-left-input-line: 0;
7092
- }
7093
- :root {
7094
- --x-size-padding-top-input-line: var(--x-size-base-03);
7095
- --x-size-padding-right-input-line: 0;
7096
- --x-size-padding-bottom-input-line: var(--x-size-base-03);
7097
- --x-size-padding-left-input-line: 0;
7098
- --x-size-border-width-top-input-line: 0;
7099
- --x-size-border-width-right-input-line: 0;
7100
- --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7101
- --x-size-border-width-left-input-line: 0;
7102
- }
7103
-
7104
- .x-input--line .x-input,
7105
- .x-input--line.x-input {
7106
- --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7107
- --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7108
- --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7109
- --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7110
- --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7111
- --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7112
- --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7113
- --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7114
- }
7115
- :root {
7116
- --x-color-background-input-default: var(--x-color-base-neutral-100);
7117
- --x-color-border-input-default: var(--x-color-base-neutral-70);
7118
- --x-color-border-input-default-focus: var(--x-color-base-lead);
7119
- --x-color-text-input-default: var(--x-color-text-default);
7120
- --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
7121
- --x-size-border-width-input-default: var(--x-size-border-width-base);
7122
- --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
7123
- --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
7124
- --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
7125
- --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
7126
- --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
7127
- --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
7128
- --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
7129
- --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
7130
- --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
7131
- --x-size-height-input-default: var(--x-size-base-07);
7132
- --x-size-padding-right-input-default: var(--x-size-base-04);
7133
- --x-size-padding-left-input-default: var(--x-size-base-04);
7134
- --x-font-family-input-default: var(--x-font-family-text);
7135
- --x-size-font-input-default: var(--x-size-font-text);
7136
- --x-size-line-height-input-default: var(--x-size-line-height-text);
7137
- --x-number-font-weight-input-default: var(--x-number-font-weight-text);
7138
- --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
7139
- --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
7140
- --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
7141
- --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
7142
- }
7143
7114
  :root {
7144
7115
  --x-color-background-input-default: var(--x-color-base-neutral-100);
7145
7116
  --x-color-border-input-default: var(--x-color-base-neutral-70);
@@ -7255,13 +7226,6 @@
7255
7226
  --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7256
7227
  --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7257
7228
  }
7258
- :root {
7259
- --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7260
- --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7261
- --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7262
- --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7263
- --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7264
- }
7265
7229
 
7266
7230
  .x-input--card.x-input,
7267
7231
  .x-input--card .x-input {
@@ -7276,8 +7240,11 @@
7276
7240
  );
7277
7241
  }
7278
7242
  :root {
7279
- --x-size-width-icon-xl: var(--x-size-base-07);
7280
- --x-size-height-icon-xl: var(--x-size-base-07);
7243
+ --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
7244
+ --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
7245
+ --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
7246
+ --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
7247
+ --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
7281
7248
  }
7282
7249
  :root {
7283
7250
  --x-size-width-icon-xl: var(--x-size-base-07);
@@ -7289,8 +7256,8 @@
7289
7256
  --x-size-height-icon-default: var(--x-size-height-icon-xl);
7290
7257
  }
7291
7258
  :root {
7292
- --x-size-width-icon-s: var(--x-size-base-03);
7293
- --x-size-height-icon-s: var(--x-size-base-03);
7259
+ --x-size-width-icon-xl: var(--x-size-base-07);
7260
+ --x-size-height-icon-xl: var(--x-size-base-07);
7294
7261
  }
7295
7262
  :root {
7296
7263
  --x-size-width-icon-s: var(--x-size-base-03);
@@ -7315,8 +7282,11 @@
7315
7282
  --x-size-height-icon-default: var(--x-size-height-icon-m);
7316
7283
  }
7317
7284
  :root {
7318
- --x-size-width-icon-l: var(--x-size-base-06);
7319
- --x-size-height-icon-l: var(--x-size-base-06);
7285
+ --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
7286
+ --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
7287
+ --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
7288
+ --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
7289
+ --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
7320
7290
  }
7321
7291
  :root {
7322
7292
  --x-size-width-icon-l: var(--x-size-base-06);
@@ -7328,13 +7298,8 @@
7328
7298
  --x-size-height-icon-default: var(--x-size-height-icon-l);
7329
7299
  }
7330
7300
  :root {
7331
- --x-color-stroke-icon-default: currentColor;
7332
- --x-color-fill-icon-default: none;
7333
- --x-size-width-icon-default: var(--x-size-width-icon-m);
7334
- --x-size-height-icon-default: var(--x-size-height-icon-m);
7335
- --x-string-stroke-linecap-icon-default: butt;
7336
- --x-string-stroke-linejoin-icon-default: mitter;
7337
- --x-size-stroke-width-icon-default: 1px;
7301
+ --x-size-width-icon-l: var(--x-size-base-06);
7302
+ --x-size-height-icon-l: var(--x-size-base-06);
7338
7303
  }
7339
7304
  :root {
7340
7305
  --x-color-stroke-icon-default: currentColor;
@@ -7366,11 +7331,39 @@
7366
7331
  stroke: none;
7367
7332
  fill: var(--x-color-stroke-icon-default);
7368
7333
  }
7334
+ :root {
7335
+ --x-size-padding-top-input-line: var(--x-size-base-03);
7336
+ --x-size-padding-right-input-line: 0;
7337
+ --x-size-padding-bottom-input-line: var(--x-size-base-03);
7338
+ --x-size-padding-left-input-line: 0;
7339
+ --x-size-border-width-top-input-line: 0;
7340
+ --x-size-border-width-right-input-line: 0;
7341
+ --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
7342
+ --x-size-border-width-left-input-line: 0;
7343
+ }
7344
+
7345
+ .x-input--line .x-input,
7346
+ .x-input--line.x-input {
7347
+ --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
7348
+ --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
7349
+ --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
7350
+ --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
7351
+ --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
7352
+ --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
7353
+ --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
7354
+ --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
7355
+ }
7369
7356
  :root {
7370
7357
  --x-size-padding-grid: 0;
7371
7358
  --x-size-gap-grid: var(--x-size-base-03);
7372
7359
  --x-size-min-width-grid-item: 150px;
7373
7360
  }
7361
+ .x-filter--justified.x-filter > *:last-child:not(.x-filter__label),
7362
+ .x-filter--justified.x-facet-filter > *:last-child:not(.x-filter__label),
7363
+ .x-filter--justified .x-filter > *:last-child:not(.x-filter__label),
7364
+ .x-filter--justified .x-facet-filter > *:last-child:not(.x-filter__label) {
7365
+ margin-left: auto;
7366
+ }
7374
7367
  :root {
7375
7368
  --x-size-padding-grid: 0;
7376
7369
  --x-size-gap-grid: var(--x-size-base-03);
@@ -7397,12 +7390,6 @@
7397
7390
  .x-grid-list--cols-auto .x-grid-list__item {
7398
7391
  min-width: var(--x-size-min-width-grid-item);
7399
7392
  }
7400
- .x-filter--justified.x-filter > *:last-child:not(.x-filter__label),
7401
- .x-filter--justified.x-facet-filter > *:last-child:not(.x-filter__label),
7402
- .x-filter--justified .x-filter > *:last-child:not(.x-filter__label),
7403
- .x-filter--justified .x-facet-filter > *:last-child:not(.x-filter__label) {
7404
- margin-left: auto;
7405
- }
7406
7393
  :root {
7407
7394
  --x-size-margin-filter-children: 0;
7408
7395
  --x-size-padding-top-filter-children: 0;
@@ -7410,6 +7397,10 @@
7410
7397
  --x-size-padding-bottom-filter-children: 0;
7411
7398
  --x-size-padding-left-filter-children: var(--x-size-base-05);
7412
7399
  }
7400
+ :root {
7401
+ --x-size-width-icon-s: var(--x-size-base-03);
7402
+ --x-size-height-icon-s: var(--x-size-base-03);
7403
+ }
7413
7404
  :root {
7414
7405
  --x-color-background-filter-default: transparent;
7415
7406
  --x-color-border-filter-default: var(--x-color-background-filter-default);
@@ -7442,38 +7433,6 @@
7442
7433
  );
7443
7434
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
7444
7435
  }
7445
- :root {
7446
- --x-size-margin-filter-children: 0;
7447
- --x-size-padding-top-filter-children: 0;
7448
- --x-size-padding-right-filter-children: 0;
7449
- --x-size-padding-bottom-filter-children: 0;
7450
- --x-size-padding-left-filter-children: var(--x-size-base-05);
7451
- }
7452
-
7453
- .x-hierarchical-filter-container {
7454
- list-style: none;
7455
- }
7456
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7457
- padding-left: var(--x-size-padding-left-filter-children);
7458
- }
7459
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7460
- padding-right: var(--x-size-padding-left-filter-children);
7461
- }
7462
- [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7463
- padding-right: var(--x-size-padding-right-filter-children);
7464
- }
7465
- [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7466
- padding-left: var(--x-size-padding-right-filter-children);
7467
- }
7468
- .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7469
- margin: var(--x-size-margin-filter-children);
7470
- padding-top: var(--x-size-padding-top-filter-children);
7471
- padding-bottom: var(--x-size-padding-bottom-filter-children);
7472
- }
7473
- .x-hierarchical-filter-container .x-hierarchical-filter-container,
7474
- .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7475
- width: 100%;
7476
- }
7477
7436
  :root {
7478
7437
  --x-color-background-filter-default: transparent;
7479
7438
  --x-color-border-filter-default: var(--x-color-background-filter-default);
@@ -7601,40 +7560,36 @@
7601
7560
  --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7602
7561
  }
7603
7562
  :root {
7604
- --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7605
- --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
7606
- --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
7607
- --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
7608
- --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
7609
- --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
7610
- --x-size-padding-facet-header-outlined: var(--x-size-base-03);
7611
- --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7612
- --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7613
- --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7614
- --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7563
+ --x-size-margin-filter-children: 0;
7564
+ --x-size-padding-top-filter-children: 0;
7565
+ --x-size-padding-right-filter-children: 0;
7566
+ --x-size-padding-bottom-filter-children: 0;
7567
+ --x-size-padding-left-filter-children: var(--x-size-base-05);
7615
7568
  }
7616
7569
 
7617
- .x-facet--outlined.x-facet,
7618
- .x-facet--outlined .x-facet {
7619
- --x-color-border-facet-default: var(--x-color-border-facet-outlined);
7620
- --x-size-border-width-facet-default: var(--x-size-border-width-facet-outlined);
7621
- --x-size-border-width-top-facet-default: var(--x-size-border-width-top-facet-outlined);
7622
- --x-size-border-width-right-facet-default: var(--x-size-border-width-right-facet-outlined);
7623
- --x-size-border-width-bottom-facet-default: var(--x-size-border-width-bottom-facet-outlined);
7624
- --x-size-border-width-left-facet-default: var(--x-size-border-width-left-facet-outlined);
7625
- --x-size-padding-facet-header-default: var(--x-size-padding-facet-header-outlined);
7626
- --x-size-padding-top-facet-header-default: var(--x-size-padding-top-facet-header-outlined);
7627
- --x-size-padding-right-facet-header-default: var(--x-size-padding-right-facet-header-outlined);
7628
- --x-size-padding-bottom-facet-header-default: var(--x-size-padding-bottom-facet-header-outlined);
7629
- --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-outlined);
7570
+ .x-hierarchical-filter-container {
7571
+ list-style: none;
7630
7572
  }
7631
- :root {
7632
- --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7633
- --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7634
- --x-size-border-width-top-facet-header-line: 0;
7635
- --x-size-border-width-right-facet-header-line: 0;
7636
- --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7637
- --x-size-border-width-left-facet-header-line: 0;
7573
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7574
+ padding-left: var(--x-size-padding-left-filter-children);
7575
+ }
7576
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7577
+ padding-right: var(--x-size-padding-left-filter-children);
7578
+ }
7579
+ [dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7580
+ padding-right: var(--x-size-padding-right-filter-children);
7581
+ }
7582
+ [dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7583
+ padding-left: var(--x-size-padding-right-filter-children);
7584
+ }
7585
+ .x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
7586
+ margin: var(--x-size-margin-filter-children);
7587
+ padding-top: var(--x-size-padding-top-filter-children);
7588
+ padding-bottom: var(--x-size-padding-bottom-filter-children);
7589
+ }
7590
+ .x-hierarchical-filter-container .x-hierarchical-filter-container,
7591
+ .x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
7592
+ width: 100%;
7638
7593
  }
7639
7594
  :root {
7640
7595
  --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
@@ -7644,22 +7599,6 @@
7644
7599
  --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7645
7600
  --x-size-border-width-left-facet-header-line: 0;
7646
7601
  }
7647
-
7648
- .x-facet--line.x-facet,
7649
- .x-facet--line .x-facet {
7650
- --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
7651
- --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
7652
- --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
7653
- --x-size-border-width-right-facet-header-default: var(
7654
- --x-size-border-width-right-facet-header-line
7655
- );
7656
- --x-size-border-width-bottom-facet-header-default: var(
7657
- --x-size-border-width-bottom-facet-header-line
7658
- );
7659
- --x-size-border-width-left-facet-header-default: var(
7660
- --x-size-border-width-left-facet-header-line
7661
- );
7662
- }
7663
7602
  :root {
7664
7603
  --x-color-background-facet-default: transparent;
7665
7604
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7693,6 +7632,15 @@
7693
7632
  --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
7694
7633
  --x-size-line-height-facet-default: var(--x-size-line-height-title3);
7695
7634
  }
7635
+ :root {
7636
+ --x-color-stroke-icon-default: currentColor;
7637
+ --x-color-fill-icon-default: none;
7638
+ --x-size-width-icon-default: var(--x-size-width-icon-m);
7639
+ --x-size-height-icon-default: var(--x-size-height-icon-m);
7640
+ --x-string-stroke-linecap-icon-default: butt;
7641
+ --x-string-stroke-linejoin-icon-default: mitter;
7642
+ --x-size-stroke-width-icon-default: 1px;
7643
+ }
7696
7644
  :root {
7697
7645
  --x-color-background-facet-default: transparent;
7698
7646
  --x-color-border-facet-default: var(--x-color-background-facet-default);
@@ -7821,16 +7769,28 @@
7821
7769
  margin-left: auto;
7822
7770
  }
7823
7771
  :root {
7824
- --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7825
- --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7826
- --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7827
- --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7828
- --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7829
- --x-size-padding-facet-header-card: var(--x-size-base-03);
7830
- --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7831
- --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7832
- --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7833
- --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7772
+ --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
7773
+ --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
7774
+ --x-size-border-width-top-facet-header-line: 0;
7775
+ --x-size-border-width-right-facet-header-line: 0;
7776
+ --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
7777
+ --x-size-border-width-left-facet-header-line: 0;
7778
+ }
7779
+
7780
+ .x-facet--line.x-facet,
7781
+ .x-facet--line .x-facet {
7782
+ --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
7783
+ --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
7784
+ --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
7785
+ --x-size-border-width-right-facet-header-default: var(
7786
+ --x-size-border-width-right-facet-header-line
7787
+ );
7788
+ --x-size-border-width-bottom-facet-header-default: var(
7789
+ --x-size-border-width-bottom-facet-header-line
7790
+ );
7791
+ --x-size-border-width-left-facet-header-default: var(
7792
+ --x-size-border-width-left-facet-header-line
7793
+ );
7834
7794
  }
7835
7795
  :root {
7836
7796
  --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
@@ -7861,22 +7821,52 @@
7861
7821
  :root {
7862
7822
  --x-size-width-dropdown-xl: 282px;
7863
7823
  }
7864
- :root {
7865
- --x-size-width-dropdown-xl: 282px;
7866
- }
7867
7824
 
7868
7825
  .x-dropdown.x-dropdown--xl {
7869
7826
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-xl);
7870
7827
  }
7871
7828
  :root {
7872
- --x-size-width-dropdown-s: 74px;
7829
+ --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
7830
+ --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
7831
+ --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
7832
+ --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
7833
+ --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
7834
+ --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
7835
+ --x-size-padding-facet-header-outlined: var(--x-size-base-03);
7836
+ --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7837
+ --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7838
+ --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7839
+ --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
7840
+ }
7841
+
7842
+ .x-facet--outlined.x-facet,
7843
+ .x-facet--outlined .x-facet {
7844
+ --x-color-border-facet-default: var(--x-color-border-facet-outlined);
7845
+ --x-size-border-width-facet-default: var(--x-size-border-width-facet-outlined);
7846
+ --x-size-border-width-top-facet-default: var(--x-size-border-width-top-facet-outlined);
7847
+ --x-size-border-width-right-facet-default: var(--x-size-border-width-right-facet-outlined);
7848
+ --x-size-border-width-bottom-facet-default: var(--x-size-border-width-bottom-facet-outlined);
7849
+ --x-size-border-width-left-facet-default: var(--x-size-border-width-left-facet-outlined);
7850
+ --x-size-padding-facet-header-default: var(--x-size-padding-facet-header-outlined);
7851
+ --x-size-padding-top-facet-header-default: var(--x-size-padding-top-facet-header-outlined);
7852
+ --x-size-padding-right-facet-header-default: var(--x-size-padding-right-facet-header-outlined);
7853
+ --x-size-padding-bottom-facet-header-default: var(--x-size-padding-bottom-facet-header-outlined);
7854
+ --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-outlined);
7873
7855
  }
7874
7856
  :root {
7875
7857
  --x-size-width-dropdown-s: 74px;
7876
7858
  }
7877
-
7878
- .x-dropdown.x-dropdown--s {
7879
- --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
7859
+ :root {
7860
+ --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
7861
+ --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
7862
+ --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
7863
+ --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
7864
+ --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
7865
+ --x-size-padding-facet-header-card: var(--x-size-base-03);
7866
+ --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
7867
+ --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
7868
+ --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
7869
+ --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
7880
7870
  }
7881
7871
  :root {
7882
7872
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
@@ -7930,14 +7920,38 @@
7930
7920
  );
7931
7921
  }
7932
7922
  :root {
7933
- --x-size-width-dropdown-m: 130px;
7934
- }
7935
- :root {
7936
- --x-size-width-dropdown-m: 130px;
7923
+ --x-size-width-dropdown-m: 130px;
7924
+ }
7925
+ :root {
7926
+ --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
7927
+ --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
7928
+ --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
7929
+ --x-size-padding-right-dropdown-item-line: 0;
7930
+ --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
7931
+ --x-size-padding-left-dropdown-item-line: 0;
7932
+ --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
7933
+ --x-size-padding-right-dropdown-toggle-line: 0;
7934
+ --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
7935
+ --x-size-padding-left-dropdown-toggle-line: 0;
7936
+ --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
7937
+ --x-size-border-width-top-dropdown-toggle-line: 0;
7938
+ --x-size-border-width-right-dropdown-toggle-line: 0;
7939
+ --x-size-border-width-bottom-dropdown-toggle-line: var(
7940
+ --x-size-border-width-dropdown-toggle-line
7941
+ );
7942
+ --x-size-border-width-left-dropdown-toggle-line: 0;
7943
+ --x-size-border-width-dropdown-list-line: 0;
7944
+ --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7945
+ --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7946
+ --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7947
+ --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
7948
+ }
7949
+ :root {
7950
+ --x-size-width-dropdown-s: 74px;
7937
7951
  }
7938
7952
 
7939
- .x-dropdown.x-dropdown--m {
7940
- --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
7953
+ .x-dropdown.x-dropdown--s {
7954
+ --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
7941
7955
  }
7942
7956
  :root {
7943
7957
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
@@ -8003,31 +8017,7 @@
8003
8017
  );
8004
8018
  }
8005
8019
  :root {
8006
- --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
8007
- --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
8008
- --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
8009
- --x-size-padding-right-dropdown-item-line: 0;
8010
- --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
8011
- --x-size-padding-left-dropdown-item-line: 0;
8012
- --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
8013
- --x-size-padding-right-dropdown-toggle-line: 0;
8014
- --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
8015
- --x-size-padding-left-dropdown-toggle-line: 0;
8016
- --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
8017
- --x-size-border-width-top-dropdown-toggle-line: 0;
8018
- --x-size-border-width-right-dropdown-toggle-line: 0;
8019
- --x-size-border-width-bottom-dropdown-toggle-line: var(
8020
- --x-size-border-width-dropdown-toggle-line
8021
- );
8022
- --x-size-border-width-left-dropdown-toggle-line: 0;
8023
- --x-size-border-width-dropdown-list-line: 0;
8024
- --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8025
- --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8026
- --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8027
- --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
8028
- }
8029
- :root {
8030
- --x-size-width-dropdown-l: 202px;
8020
+ --x-size-width-dropdown-xl: 282px;
8031
8021
  }
8032
8022
  :root {
8033
8023
  --x-size-width-dropdown-l: 202px;
@@ -8364,19 +8354,6 @@
8364
8354
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8365
8355
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8366
8356
  }
8367
- :root {
8368
- --x-size-gap-dropdown-card: var(--x-size-base-03);
8369
- --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8370
- --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8371
- --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8372
- --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8373
- --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8374
- --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8375
- --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8376
- --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8377
- --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8378
- --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8379
- }
8380
8357
 
8381
8358
  .x-dropdown--card {
8382
8359
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
@@ -8408,14 +8385,7 @@
8408
8385
  );
8409
8386
  }
8410
8387
  :root {
8411
- --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8412
- --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
8413
- --x-color-text-button-tertiary: var(--x-color-text-default);
8414
- --x-size-border-width-button-tertiary: var(--x-size-border-width-base);
8415
- --x-size-border-width-top-button-tertiary: var(--x-size-border-width-button-tertiary);
8416
- --x-size-border-width-right-button-tertiary: var(--x-size-border-width-button-tertiary);
8417
- --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8418
- --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8388
+ --x-size-width-dropdown-l: 202px;
8419
8389
  }
8420
8390
  :root {
8421
8391
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
@@ -8427,26 +8397,12 @@
8427
8397
  --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8428
8398
  --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8429
8399
  }
8430
-
8431
- .x-button--tertiary.x-button,
8432
- .x-button--tertiary .x-button {
8433
- --x-color-background-button-default: var(--x-color-background-button-tertiary);
8434
- --x-color-border-button-default: var(--x-color-border-button-tertiary);
8435
- --x-color-text-button-default: var(--x-color-text-button-tertiary);
8436
- --x-size-border-width-top-button-default: var(--x-size-border-width-top-button-tertiary);
8437
- --x-size-border-width-right-button-default: var(--x-size-border-width-right-button-tertiary);
8438
- --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-tertiary);
8439
- --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-tertiary);
8440
- }
8441
8400
  :root {
8442
- --x-color-background-button-secondary: transparent;
8443
- --x-color-border-button-secondary: var(--x-color-border-button-default);
8444
- --x-color-text-button-secondary: var(--x-color-border-button-default);
8445
- --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8446
- --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8447
- --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8448
- --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8449
- --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8401
+ --x-size-width-dropdown-m: 130px;
8402
+ }
8403
+
8404
+ .x-dropdown.x-dropdown--m {
8405
+ --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
8450
8406
  }
8451
8407
  :root {
8452
8408
  --x-color-background-button-secondary: transparent;
@@ -8470,11 +8426,14 @@
8470
8426
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
8471
8427
  }
8472
8428
  :root {
8473
- --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
8474
- --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
8475
- --x-size-border-radius-top-right-button-round: var(--x-size-border-radius-button-round);
8476
- --x-size-border-radius-bottom-right-button-round: var(--x-size-border-radius-button-round);
8477
- --x-size-border-radius-bottom-left-button-round: var(--x-size-border-radius-button-round);
8429
+ --x-color-background-button-secondary: transparent;
8430
+ --x-color-border-button-secondary: var(--x-color-border-button-default);
8431
+ --x-color-text-button-secondary: var(--x-color-border-button-default);
8432
+ --x-size-border-width-button-secondary: var(--x-size-border-width-base);
8433
+ --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
8434
+ --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
8435
+ --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
8436
+ --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
8478
8437
  }
8479
8438
  :root {
8480
8439
  --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
@@ -8511,6 +8470,27 @@
8511
8470
  --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
8512
8471
  --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
8513
8472
  }
8473
+ :root {
8474
+ --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
8475
+ --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
8476
+ --x-color-text-button-tertiary: var(--x-color-text-default);
8477
+ --x-size-border-width-button-tertiary: var(--x-size-border-width-base);
8478
+ --x-size-border-width-top-button-tertiary: var(--x-size-border-width-button-tertiary);
8479
+ --x-size-border-width-right-button-tertiary: var(--x-size-border-width-button-tertiary);
8480
+ --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
8481
+ --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
8482
+ }
8483
+
8484
+ .x-button--tertiary.x-button,
8485
+ .x-button--tertiary .x-button {
8486
+ --x-color-background-button-default: var(--x-color-background-button-tertiary);
8487
+ --x-color-border-button-default: var(--x-color-border-button-tertiary);
8488
+ --x-color-text-button-default: var(--x-color-text-button-tertiary);
8489
+ --x-size-border-width-top-button-default: var(--x-size-border-width-top-button-tertiary);
8490
+ --x-size-border-width-right-button-default: var(--x-size-border-width-right-button-tertiary);
8491
+ --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-tertiary);
8492
+ --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-tertiary);
8493
+ }
8514
8494
  :root {
8515
8495
  --x-color-background-button-primary: var(--x-color-background-button-default);
8516
8496
  --x-color-border-button-primary: var(--x-color-border-button-default);
@@ -8561,6 +8541,19 @@
8561
8541
  --x-size-border-radius-bottom-left-button-pill
8562
8542
  );
8563
8543
  }
8544
+ :root {
8545
+ --x-size-gap-dropdown-card: var(--x-size-base-03);
8546
+ --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
8547
+ --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8548
+ --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8549
+ --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
8550
+ --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
8551
+ --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
8552
+ --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8553
+ --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8554
+ --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8555
+ --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
8556
+ }
8564
8557
  :root {
8565
8558
  --x-color-background-button-ghost: transparent;
8566
8559
  --x-color-border-button-ghost: transparent;
@@ -8583,34 +8576,6 @@
8583
8576
  .x-button--ghost.x-button--ghost-end .x-button {
8584
8577
  --x-size-padding-right-button-default: 0;
8585
8578
  }
8586
- :root {
8587
- --x-color-background-button-ghost: transparent;
8588
- --x-color-border-button-ghost: transparent;
8589
- --x-color-text-button-ghost: var(--x-color-base-lead);
8590
- }
8591
- :root {
8592
- --x-color-background-button-default: var(--x-color-base-lead);
8593
- --x-color-border-button-default: var(--x-color-background-button-default);
8594
- --x-color-text-button-default: var(--x-color-base-neutral-100);
8595
- --x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
8596
- --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
8597
- --x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
8598
- --x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
8599
- --x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
8600
- --x-size-border-width-button-default: var(--x-size-border-width-base);
8601
- --x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
8602
- --x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
8603
- --x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
8604
- --x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
8605
- --x-size-height-button-default: var(--x-size-base-08);
8606
- --x-size-padding-right-button-default: var(--x-size-base-05);
8607
- --x-size-padding-left-button-default: var(--x-size-base-05);
8608
- --x-size-gap-button-default: var(--x-size-base-03);
8609
- --x-font-family-button-default: var(--x-font-family-text);
8610
- --x-size-font-button-default: var(--x-size-font-text);
8611
- --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8612
- --x-size-line-height-button-default: var(--x-size-line-height-text);
8613
- }
8614
8579
  :root {
8615
8580
  --x-color-background-button-default: var(--x-color-base-lead);
8616
8581
  --x-color-border-button-default: var(--x-color-background-button-default);
@@ -8697,11 +8662,27 @@
8697
8662
  }
8698
8663
  }
8699
8664
  :root {
8700
- --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8701
- --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8702
- --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8703
- --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8704
- --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8665
+ --x-color-background-button-default: var(--x-color-base-lead);
8666
+ --x-color-border-button-default: var(--x-color-background-button-default);
8667
+ --x-color-text-button-default: var(--x-color-base-neutral-100);
8668
+ --x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
8669
+ --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
8670
+ --x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
8671
+ --x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
8672
+ --x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
8673
+ --x-size-border-width-button-default: var(--x-size-border-width-base);
8674
+ --x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
8675
+ --x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
8676
+ --x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
8677
+ --x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
8678
+ --x-size-height-button-default: var(--x-size-base-08);
8679
+ --x-size-padding-right-button-default: var(--x-size-base-05);
8680
+ --x-size-padding-left-button-default: var(--x-size-base-05);
8681
+ --x-size-gap-button-default: var(--x-size-base-03);
8682
+ --x-font-family-button-default: var(--x-font-family-text);
8683
+ --x-size-font-button-default: var(--x-size-font-text);
8684
+ --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
8685
+ --x-size-line-height-button-default: var(--x-size-line-height-text);
8705
8686
  }
8706
8687
  :root {
8707
8688
  --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
@@ -8725,6 +8706,13 @@
8725
8706
  --x-size-border-radius-bottom-left-button-card
8726
8707
  );
8727
8708
  }
8709
+ :root {
8710
+ --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
8711
+ --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
8712
+ --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
8713
+ --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
8714
+ --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
8715
+ }
8728
8716
  :root {
8729
8717
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
8730
8718
  --x-color-text-badge-default: var(--x-color-base-neutral-100);
@@ -8775,27 +8763,11 @@
8775
8763
  position: relative;
8776
8764
  }
8777
8765
  :root {
8778
- --x-color-background-badge-default: var(--x-color-base-neutral-10);
8779
- --x-color-text-badge-default: var(--x-color-base-neutral-100);
8780
- --x-color-border-badge-default: var(--x-color-base-neutral-10);
8781
- --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8782
- --x-size-border-width-badge-default: 0;
8783
- --x-size-width-badge-default: 1.5em;
8784
- --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8785
- --x-size-font-badge-default: var(--x-size-font-base-xs);
8786
- }
8787
- :root {
8788
- --x-color-base-lead: #243d48;
8789
- --x-color-base-auxiliary: #bfe1ec;
8790
- --x-color-base-neutral-10: #1a1a1a;
8791
- --x-color-base-neutral-35: #595959;
8792
- --x-color-base-neutral-70: #b3b3b3;
8793
- --x-color-base-neutral-95: #f2f2f2;
8794
- --x-color-base-neutral-100: #ffffff;
8795
- --x-color-base-accent: #0086b2;
8796
- --x-color-base-enable: #00705c;
8797
- --x-color-base-disable: #e11f26;
8798
- --x-color-base-transparent: transparent;
8766
+ --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
8767
+ --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
8768
+ --x-size-border-radius-top-right-button-round: var(--x-size-border-radius-button-round);
8769
+ --x-size-border-radius-bottom-right-button-round: var(--x-size-border-radius-button-round);
8770
+ --x-size-border-radius-bottom-left-button-round: var(--x-size-border-radius-button-round);
8799
8771
  }
8800
8772
  :root {
8801
8773
  --x-size-base-01: 2px;
@@ -8825,4 +8797,32 @@
8825
8797
  --x-size-border-radius-base-m: var(--x-size-base-06);
8826
8798
  --x-size-border-radius-base-pill: 99999px;
8827
8799
  --x-size-border-width-base: 1px;
8800
+ }
8801
+ :root {
8802
+ --x-color-base-lead: #243d48;
8803
+ --x-color-base-auxiliary: #bfe1ec;
8804
+ --x-color-base-neutral-10: #1a1a1a;
8805
+ --x-color-base-neutral-35: #595959;
8806
+ --x-color-base-neutral-70: #b3b3b3;
8807
+ --x-color-base-neutral-95: #f2f2f2;
8808
+ --x-color-base-neutral-100: #ffffff;
8809
+ --x-color-base-accent: #0086b2;
8810
+ --x-color-base-enable: #00705c;
8811
+ --x-color-base-disable: #e11f26;
8812
+ --x-color-base-transparent: transparent;
8813
+ }
8814
+ :root {
8815
+ --x-color-background-button-ghost: transparent;
8816
+ --x-color-border-button-ghost: transparent;
8817
+ --x-color-text-button-ghost: var(--x-color-base-lead);
8818
+ }
8819
+ :root {
8820
+ --x-color-background-badge-default: var(--x-color-base-neutral-10);
8821
+ --x-color-text-badge-default: var(--x-color-base-neutral-100);
8822
+ --x-color-border-badge-default: var(--x-color-base-neutral-10);
8823
+ --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
8824
+ --x-size-border-width-badge-default: 0;
8825
+ --x-size-width-badge-default: 1.5em;
8826
+ --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
8827
+ --x-size-font-badge-default: var(--x-size-font-base-xs);
8828
8828
  }