@fremtind/jokul 6.1.0-next.4 → 6.1.0-next.5

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 (215) hide show
  1. package/build/build-stats.html +1 -1
  2. package/build/cjs/components/checkbox/types.d.cts +2 -2
  3. package/build/cjs/components/combobox/Combobox.cjs +1 -1
  4. package/build/cjs/components/combobox/Combobox.cjs.map +1 -1
  5. package/build/cjs/components/combobox/types.d.cts +2 -1
  6. package/build/cjs/components/date-input/DateInput.d.cts +1 -1
  7. package/build/cjs/components/date-input/types.d.cts +2 -2
  8. package/build/cjs/components/input-group/InputGroup.cjs +1 -1
  9. package/build/cjs/components/input-group/InputGroup.cjs.map +1 -1
  10. package/build/cjs/components/input-group/types.d.cts +2 -2
  11. package/build/cjs/components/input-panel/InputPanel.d.cts +1 -1
  12. package/build/cjs/components/input-panel/types.d.cts +2 -2
  13. package/build/cjs/components/message/Message.cjs +1 -1
  14. package/build/cjs/components/message/Message.cjs.map +1 -1
  15. package/build/cjs/components/message/types.d.cts +5 -1
  16. package/build/cjs/components/notification-badge/NotificationBadge.cjs +2 -0
  17. package/build/cjs/components/notification-badge/NotificationBadge.cjs.map +1 -0
  18. package/build/cjs/components/notification-badge/NotificationBadge.d.cts +3 -0
  19. package/build/cjs/components/notification-badge/index.cjs +2 -0
  20. package/build/cjs/components/notification-badge/index.cjs.map +1 -0
  21. package/build/cjs/components/notification-badge/index.d.cts +2 -0
  22. package/build/cjs/components/notification-badge/types.cjs +2 -0
  23. package/build/cjs/components/notification-badge/types.cjs.map +1 -0
  24. package/build/cjs/components/notification-badge/types.d.cts +40 -0
  25. package/build/cjs/components/number-input/NumberInput.d.cts +1 -1
  26. package/build/cjs/components/number-input/types.d.cts +2 -1
  27. package/build/cjs/components/radio-button/types.d.cts +2 -1
  28. package/build/cjs/components/search/Search.cjs +1 -1
  29. package/build/cjs/components/search/Search.cjs.map +1 -1
  30. package/build/cjs/components/search/types.d.cts +2 -1
  31. package/build/cjs/components/select/Option.d.cts +1 -1
  32. package/build/cjs/components/select/Select.cjs.map +1 -1
  33. package/build/cjs/components/select/Select.d.cts +2 -2
  34. package/build/cjs/components/system-message/SystemMessage.cjs +1 -1
  35. package/build/cjs/components/system-message/SystemMessage.cjs.map +1 -1
  36. package/build/cjs/components/tag/Tag.cjs +1 -1
  37. package/build/cjs/components/tag/Tag.cjs.map +1 -1
  38. package/build/cjs/components/text-area/types.d.cts +2 -1
  39. package/build/cjs/components/text-input/types.d.cts +3 -2
  40. package/build/cjs/components/toast/Toast.cjs +1 -1
  41. package/build/cjs/components/toast/Toast.cjs.map +1 -1
  42. package/build/cjs/components/toggle-switch/ToggleSwitch.d.cts +1 -1
  43. package/build/cjs/components/toggle-switch/types.d.cts +2 -2
  44. package/build/cjs/tokens.cjs +1 -1
  45. package/build/cjs/tokens.cjs.map +1 -1
  46. package/build/cjs/tokens.d.cts +3 -0
  47. package/build/cjs/utilities/index.cjs +1 -1
  48. package/build/cjs/utilities/types.cjs +1 -1
  49. package/build/cjs/utilities/types.cjs.map +1 -1
  50. package/build/cjs/utilities/types.d.cts +36 -2
  51. package/build/es/components/checkbox/types.d.ts +2 -2
  52. package/build/es/components/combobox/Combobox.js +1 -1
  53. package/build/es/components/combobox/Combobox.js.map +1 -1
  54. package/build/es/components/combobox/types.d.ts +2 -1
  55. package/build/es/components/date-input/DateInput.d.ts +1 -1
  56. package/build/es/components/date-input/types.d.ts +2 -2
  57. package/build/es/components/input-group/InputGroup.js +1 -1
  58. package/build/es/components/input-group/InputGroup.js.map +1 -1
  59. package/build/es/components/input-group/types.d.ts +2 -2
  60. package/build/es/components/input-panel/InputPanel.d.ts +1 -1
  61. package/build/es/components/input-panel/types.d.ts +2 -2
  62. package/build/es/components/message/Message.js +1 -1
  63. package/build/es/components/message/Message.js.map +1 -1
  64. package/build/es/components/message/types.d.ts +5 -1
  65. package/build/es/components/notification-badge/NotificationBadge.d.ts +3 -0
  66. package/build/es/components/notification-badge/NotificationBadge.js +2 -0
  67. package/build/es/components/notification-badge/NotificationBadge.js.map +1 -0
  68. package/build/es/components/notification-badge/index.d.ts +2 -0
  69. package/build/es/components/notification-badge/index.js +2 -0
  70. package/build/es/components/notification-badge/index.js.map +1 -0
  71. package/build/es/components/notification-badge/types.d.ts +40 -0
  72. package/build/es/components/notification-badge/types.js +2 -0
  73. package/build/es/components/notification-badge/types.js.map +1 -0
  74. package/build/es/components/number-input/NumberInput.d.ts +1 -1
  75. package/build/es/components/number-input/types.d.ts +2 -1
  76. package/build/es/components/radio-button/types.d.ts +2 -1
  77. package/build/es/components/search/Search.js +1 -1
  78. package/build/es/components/search/Search.js.map +1 -1
  79. package/build/es/components/search/types.d.ts +2 -1
  80. package/build/es/components/select/Option.d.ts +1 -1
  81. package/build/es/components/select/Select.d.ts +2 -2
  82. package/build/es/components/select/Select.js.map +1 -1
  83. package/build/es/components/system-message/SystemMessage.js +1 -1
  84. package/build/es/components/system-message/SystemMessage.js.map +1 -1
  85. package/build/es/components/tag/Tag.js +1 -1
  86. package/build/es/components/tag/Tag.js.map +1 -1
  87. package/build/es/components/text-area/types.d.ts +2 -1
  88. package/build/es/components/text-input/types.d.ts +3 -2
  89. package/build/es/components/toast/Toast.js +1 -1
  90. package/build/es/components/toast/Toast.js.map +1 -1
  91. package/build/es/components/toggle-switch/ToggleSwitch.d.ts +1 -1
  92. package/build/es/components/toggle-switch/types.d.ts +2 -2
  93. package/build/es/tokens.d.ts +3 -0
  94. package/build/es/tokens.js +1 -1
  95. package/build/es/tokens.js.map +1 -1
  96. package/build/es/utilities/index.js +1 -1
  97. package/build/es/utilities/types.d.ts +36 -2
  98. package/build/es/utilities/types.js +1 -1
  99. package/build/es/utilities/types.js.map +1 -1
  100. package/package.json +1 -1
  101. package/styles/base.css +194 -116
  102. package/styles/base.min.css +1 -1
  103. package/styles/components/button/button.css +2 -1
  104. package/styles/components/button/button.min.css +1 -1
  105. package/styles/components/button/button.scss +2 -3
  106. package/styles/components/checkbox/checkbox.css +15 -0
  107. package/styles/components/checkbox/checkbox.min.css +1 -1
  108. package/styles/components/checkbox/checkbox.scss +4 -0
  109. package/styles/components/checkbox-panel/checkbox-panel.css +32 -0
  110. package/styles/components/checkbox-panel/checkbox-panel.min.css +1 -1
  111. package/styles/components/chip/chip.css +6 -13
  112. package/styles/components/chip/chip.min.css +1 -1
  113. package/styles/components/chip/chip.scss +4 -14
  114. package/styles/components/combobox/combobox.css +45 -0
  115. package/styles/components/combobox/combobox.min.css +1 -1
  116. package/styles/components/combobox/combobox.scss +11 -0
  117. package/styles/components/countdown/countdown.css +2 -2
  118. package/styles/components/countdown/countdown.min.css +1 -1
  119. package/styles/components/date-input/calendar/calendar.css +15 -4
  120. package/styles/components/date-input/calendar/calendar.min.css +1 -1
  121. package/styles/components/date-input/calendar/calendar.scss +6 -10
  122. package/styles/components/date-input/date-input.css +25 -0
  123. package/styles/components/date-input/date-input.min.css +1 -1
  124. package/styles/components/expander/expandable.css +1 -1
  125. package/styles/components/expander/expandable.min.css +1 -1
  126. package/styles/components/expander/expandable.scss +2 -2
  127. package/styles/components/feedback/feedback.css +2 -2
  128. package/styles/components/feedback/feedback.min.css +1 -1
  129. package/styles/components/file-input/file-input.css +26 -10
  130. package/styles/components/file-input/file-input.min.css +1 -1
  131. package/styles/components/file-input/file-input.scss +6 -0
  132. package/styles/components/input-group/_labels.scss +29 -0
  133. package/styles/components/input-group/input-group.css +32 -2
  134. package/styles/components/input-group/input-group.min.css +1 -1
  135. package/styles/components/input-panel/input-panel.css +17 -0
  136. package/styles/components/input-panel/input-panel.min.css +1 -1
  137. package/styles/components/input-panel/input-panel.scss +7 -0
  138. package/styles/components/link-list/link-list.css +1 -1
  139. package/styles/components/link-list/link-list.min.css +1 -1
  140. package/styles/components/link-list/link-list.scss +1 -1
  141. package/styles/components/loader/loader.css +6 -6
  142. package/styles/components/loader/loader.min.css +1 -1
  143. package/styles/components/loader/skeleton-loader.css +3 -3
  144. package/styles/components/loader/skeleton-loader.min.css +1 -1
  145. package/styles/components/menu/_menu-item.scss +1 -1
  146. package/styles/components/menu/menu.css +1 -1
  147. package/styles/components/menu/menu.min.css +1 -1
  148. package/styles/components/message/message.css +5 -25
  149. package/styles/components/message/message.min.css +1 -1
  150. package/styles/components/message/message.scss +3 -27
  151. package/styles/components/notification-badge/_index.scss +1 -0
  152. package/styles/components/notification-badge/notification-badge.css +45 -0
  153. package/styles/components/notification-badge/notification-badge.min.css +3 -0
  154. package/styles/components/notification-badge/notification-badge.scss +58 -0
  155. package/styles/components/number-input/number-input.css +37 -1
  156. package/styles/components/number-input/number-input.min.css +1 -1
  157. package/styles/components/number-input/number-input.scss +1 -2
  158. package/styles/components/progress-bar/progress-bar.css +1 -1
  159. package/styles/components/progress-bar/progress-bar.min.css +1 -1
  160. package/styles/components/radio-button/radio-button.css +15 -0
  161. package/styles/components/radio-button/radio-button.min.css +1 -1
  162. package/styles/components/radio-button/radio-button.scss +4 -0
  163. package/styles/components/radio-panel/radio-panel.css +17 -0
  164. package/styles/components/radio-panel/radio-panel.min.css +1 -1
  165. package/styles/components/search/search-with-submit-button.css +29 -43
  166. package/styles/components/search/search-with-submit-button.min.css +1 -1
  167. package/styles/components/search/search-with-submit-button.scss +9 -24
  168. package/styles/components/search/search.css +246 -125
  169. package/styles/components/search/search.min.css +1 -1
  170. package/styles/components/search/search.scss +98 -103
  171. package/styles/components/segmented-control/segmented-control.css +63 -2
  172. package/styles/components/segmented-control/segmented-control.min.css +1 -1
  173. package/styles/components/segmented-control/segmented-control.scss +6 -0
  174. package/styles/components/select/option.css +17 -2
  175. package/styles/components/select/option.min.css +1 -1
  176. package/styles/components/select/option.scss +6 -3
  177. package/styles/components/select/select.css +17 -0
  178. package/styles/components/select/select.min.css +1 -1
  179. package/styles/components/select/select.scss +7 -0
  180. package/styles/components/system-message/system-message.css +5 -25
  181. package/styles/components/system-message/system-message.min.css +1 -1
  182. package/styles/components/system-message/system-message.scss +3 -27
  183. package/styles/components/table/_table-row.scss +2 -2
  184. package/styles/components/table/table.css +2 -2
  185. package/styles/components/table/table.min.css +1 -1
  186. package/styles/components/tabs/tabs.css +2 -0
  187. package/styles/components/tabs/tabs.min.css +1 -1
  188. package/styles/components/tabs/tabs.scss +2 -0
  189. package/styles/components/tag/tag.css +4 -24
  190. package/styles/components/tag/tag.min.css +1 -1
  191. package/styles/components/tag/tag.scss +4 -28
  192. package/styles/components/text-area/text-area.css +25 -0
  193. package/styles/components/text-area/text-area.min.css +1 -1
  194. package/styles/components/text-input/text-input.css +25 -0
  195. package/styles/components/text-input/text-input.min.css +1 -1
  196. package/styles/components/toast/toast.css +12 -52
  197. package/styles/components/toast/toast.min.css +1 -1
  198. package/styles/components/toast/toast.scss +6 -60
  199. package/styles/components/toggle-switch/toggle-switch.css +12 -7
  200. package/styles/components/toggle-switch/toggle-switch.min.css +1 -1
  201. package/styles/components/toggle-switch/toggle-switch.scss +1 -11
  202. package/styles/components.css +726 -368
  203. package/styles/components.min.css +4 -2
  204. package/styles/components.scss +1 -0
  205. package/styles/jkl/_index.scss +1 -0
  206. package/styles/jkl/_ornaments.scss +8 -0
  207. package/styles/jkl/_states.scss +45 -0
  208. package/styles/jkl/_tokens.scss +4 -0
  209. package/styles/shared/input/shared-input-styles.scss +21 -0
  210. package/styles/theme/_color-mode.scss +62 -0
  211. package/styles/theme/_color-scheme.scss +60 -57
  212. package/styles/theme/_data-theme.scss +21 -0
  213. package/styles/theme/_index.scss +2 -0
  214. package/styles/theme/_tokens.scss +2 -2
  215. package/styles/theme/brands/dnb/_color-scheme.scss +60 -57
@@ -1,2 +1,2 @@
1
1
  @layer jokul{@layer resets, theme, global, components, utility}
2
- /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */@layer jokul.resets{html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}h1,h2,h3,h4,h5,h6,p{margin:0}fieldset{margin:0;border:0;padding:0;display:block;line-height:1}table{border-collapse:collapse}table,tbody,td,th,thead,tr{margin:0;padding:0}}@layer jokul.resets{.jkl [hidden]{display:none!important}}@layer jokul.theme{@font-face{font-family:Jokul;font-display:fallback;font-weight:100 900;font-style:normal;src:url(/fonts/InterVariable.woff2) format("woff2")}@font-face{font-family:Jokul Display;font-display:fallback;font-weight:400;font-style:normal;src:url(/fonts/InterVariable.woff2) format("woff2")}@font-face{font-family:Jokul Icons;font-weight:300 400;font-style:normal;src:url(/fonts/Jokul-Icons.woff2) format("woff2")}@font-face{font-family:Adjusted Arial Fallback;font-weight:400;font-style:normal;src:local(arial);size-adjust:104%;ascent-override:82%;descent-override:normal;line-gap-override:32%}@font-face{font-family:Adjusted Arial Fallback;font-weight:700;font-style:normal;src:local(arial);size-adjust:108%;ascent-override:83%;descent-override:normal;line-gap-override:28%}@font-face{font-family:Adjusted Arial Display Fallback;font-weight:400;font-style:normal;src:local(arial);size-adjust:102%;ascent-override:76%;descent-override:normal;line-gap-override:40%}@font-face{font-family:Adjusted Courier New Fallback;font-weight:400;font-style:normal;src:local(courier new);size-adjust:100%;ascent-override:83%;descent-override:normal;line-gap-override:27%}@font-face{font-family:Jokul Icons Fallback;src:local(courier new);font-weight:300 400;font-style:normal;size-adjust:0%}}@layer jokul.theme{:root{--jkl-spacing-16-24:var(--jkl-spacing-16);--jkl-spacing-24-40:var(--jkl-spacing-24);--jkl-spacing-24-32:var(--jkl-spacing-24);--jkl-spacing-32-40:var(--jkl-spacing-32);--jkl-spacing-40-64:var(--jkl-spacing-40);--jkl-spacing-64-104:var(--jkl-spacing-64);--jkl-spacing-104-168:var(--jkl-spacing-104);--jkl-spacing-16-16-24:var(--jkl-spacing-16);--jkl-spacing-16-24-32:var(--jkl-spacing-16);--jkl-spacing-16-24-40:var(--jkl-spacing-16);--jkl-spacing-24-24-32:var(--jkl-spacing-24);--jkl-spacing-24-24-40:var(--jkl-spacing-24);--jkl-spacing-24-32-40:var(--jkl-spacing-24);--jkl-spacing-32-32-40:var(--jkl-spacing-32);--jkl-spacing-32-40-64:var(--jkl-spacing-32);--jkl-spacing-40-40-64:var(--jkl-spacing-40);--jkl-spacing-40-64-104:var(--jkl-spacing-40);--jkl-spacing-64-64-104:var(--jkl-spacing-64);--jkl-spacing-64-104-168:var(--jkl-spacing-64);--jkl-spacing-104-104-168:var(--jkl-spacing-104)}@media (min-width:680px){:root{--jkl-spacing-16-24:var(--jkl-spacing-24);--jkl-spacing-24-40:var(--jkl-spacing-40);--jkl-spacing-24-32:var(--jkl-spacing-32);--jkl-spacing-32-40:var(--jkl-spacing-40);--jkl-spacing-40-64:var(--jkl-spacing-64);--jkl-spacing-64-104:var(--jkl-spacing-104);--jkl-spacing-104-168:var(--jkl-spacing-168);--jkl-spacing-16-16-24:var(--jkl-spacing-16);--jkl-spacing-16-24-32:var(--jkl-spacing-24);--jkl-spacing-16-24-40:var(--jkl-spacing-24);--jkl-spacing-24-24-32:var(--jkl-spacing-24);--jkl-spacing-24-24-40:var(--jkl-spacing-24);--jkl-spacing-24-32-40:var(--jkl-spacing-32);--jkl-spacing-32-32-40:var(--jkl-spacing-32);--jkl-spacing-32-40-64:var(--jkl-spacing-40);--jkl-spacing-40-40-64:var(--jkl-spacing-40);--jkl-spacing-40-64-104:var(--jkl-spacing-64);--jkl-spacing-64-64-104:var(--jkl-spacing-64);--jkl-spacing-64-104-168:var(--jkl-spacing-104);--jkl-spacing-104-104-168:var(--jkl-spacing-104)}}@media (min-width:1200px){:root{--jkl-spacing-16-16-24:var(--jkl-spacing-24);--jkl-spacing-16-24-32:var(--jkl-spacing-32);--jkl-spacing-16-24-40:var(--jkl-spacing-40);--jkl-spacing-24-24-32:var(--jkl-spacing-32);--jkl-spacing-24-24-40:var(--jkl-spacing-40);--jkl-spacing-24-32-40:var(--jkl-spacing-40);--jkl-spacing-32-32-40:var(--jkl-spacing-40);--jkl-spacing-32-40-64:var(--jkl-spacing-64);--jkl-spacing-40-40-64:var(--jkl-spacing-64);--jkl-spacing-40-64-104:var(--jkl-spacing-104);--jkl-spacing-64-64-104:var(--jkl-spacing-104);--jkl-spacing-64-104-168:var(--jkl-spacing-168);--jkl-spacing-104-104-168:var(--jkl-spacing-168)}}}@layer jokul.theme{:root{color-scheme:light dark;--jkl-color-background-page:#f3f0ed;--jkl-color-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-background-container:#fff;--jkl-color-background-container:light-dark(#fff, #262221);--jkl-color-background-container-accent:#e4dfd8;--jkl-color-background-container-accent:light-dark(#e4dfd8, #3c3434);--jkl-color-background-contrast:#262221;--jkl-color-background-contrast:light-dark(#262221, #f3f0ed);--jkl-color-text-default:#0e0d0c;--jkl-color-text-default:light-dark(#0e0d0c, #fff);--jkl-color-text-subdued:#636060;--jkl-color-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-text-accent:#0e0d0c;--jkl-color-text-accent:light-dark(#0e0d0c, #fff);--jkl-color-text-on-contrast:#fff;--jkl-color-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-border-default:#636060;--jkl-color-border-default:light-dark(#636060, #c8c5c3);--jkl-color-border-subdued:#c8c5c3;--jkl-color-border-subdued:light-dark(#c8c5c3, #636060);--jkl-color-border-strong:#0e0d0c;--jkl-color-border-strong:light-dark(#0e0d0c, #fff);--jkl-color-warning-background-page:#f3f0ed;--jkl-color-warning-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-warning-background-container:#eed9c3;--jkl-color-warning-background-container:light-dark(#eed9c3, #48351e);--jkl-color-warning-background-container-accent:#e4bc8a;--jkl-color-warning-background-container-accent:light-dark(#e4bc8a, #61492d);--jkl-color-warning-background-contrast:#d3770b;--jkl-color-warning-background-contrast:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-default:#522e04;--jkl-color-warning-text-default:light-dark(#522e04, #fdecd8);--jkl-color-warning-text-subdued:#636060;--jkl-color-warning-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-warning-text-accent:#d3770b;--jkl-color-warning-text-accent:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-on-contrast:#fff;--jkl-color-warning-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-warning-border-default:#d3770b;--jkl-color-warning-border-default:light-dark(#d3770b, #eaa858);--jkl-color-warning-border-subdued:#e4bc8a;--jkl-color-warning-border-subdued:light-dark(#e4bc8a, #61492d);--jkl-color-warning-border-strong:#522e04;--jkl-color-warning-border-strong:light-dark(#522e04, #fdecd8);--jkl-color-success-background-page:#f3f0ed;--jkl-color-success-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-success-background-container:#d2e9cb;--jkl-color-success-background-container:light-dark(#d2e9cb, #334d34);--jkl-color-success-background-container-accent:#b7cfaf;--jkl-color-success-background-container-accent:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-background-contrast:#24753a;--jkl-color-success-background-contrast:light-dark(#24753a, #81e49c);--jkl-color-success-text-default:#0a430d;--jkl-color-success-text-default:light-dark(#0a430d, #dcf9e0);--jkl-color-success-text-subdued:#636060;--jkl-color-success-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-success-text-accent:#24753a;--jkl-color-success-text-accent:light-dark(#24753a, #81e49c);--jkl-color-success-text-on-contrast:#fff;--jkl-color-success-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-success-border-default:#24753a;--jkl-color-success-border-default:light-dark(#24753a, #81e49c);--jkl-color-success-border-subdued:#b7cfaf;--jkl-color-success-border-subdued:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-border-strong:#0a430d;--jkl-color-success-border-strong:light-dark(#0a430d, #dcf9e0);--jkl-color-info-background-page:#f3f0ed;--jkl-color-info-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-info-background-container:#d3d3f6;--jkl-color-info-background-container:light-dark(#d3d3f6, #35355b);--jkl-color-info-background-container-accent:#b5b5eb;--jkl-color-info-background-container-accent:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-background-contrast:#4646d1;--jkl-color-info-background-contrast:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-default:#111145;--jkl-color-info-text-default:light-dark(#111145, #d8d8fd);--jkl-color-info-text-subdued:#636060;--jkl-color-info-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-info-text-accent:#4646d1;--jkl-color-info-text-accent:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-on-contrast:#fff;--jkl-color-info-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-info-border-default:#4646d1;--jkl-color-info-border-default:light-dark(#4646d1, #9a9aeb);--jkl-color-info-border-subdued:#b5b5eb;--jkl-color-info-border-subdued:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-border-strong:#111145;--jkl-color-info-border-strong:light-dark(#111145, #d8d8fd);--jkl-color-error-background-page:#f3f0ed;--jkl-color-error-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-error-background-container:#f0d6d6;--jkl-color-error-background-container:light-dark(#f0d6d6, #4c2a28);--jkl-color-error-background-container-accent:#e4b7b6;--jkl-color-error-background-container-accent:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-background-contrast:#b32424;--jkl-color-error-background-contrast:light-dark(#b32424, #f38c8c);--jkl-color-error-text-default:#4a0d0d;--jkl-color-error-text-default:light-dark(#4a0d0d, #fcd9d9);--jkl-color-error-text-subdued:#636060;--jkl-color-error-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-error-text-accent:#b32424;--jkl-color-error-text-accent:light-dark(#b32424, #f38c8c);--jkl-color-error-text-on-contrast:#fff;--jkl-color-error-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-error-border-default:#b32424;--jkl-color-error-border-default:light-dark(#b32424, #f38c8c);--jkl-color-error-border-subdued:#e4b7b6;--jkl-color-error-border-subdued:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-border-strong:#4a0d0d;--jkl-color-error-border-strong:light-dark(#4a0d0d, #fcd9d9)}[data-theme=light]{color-scheme:light}[data-theme=dark]{color-scheme:dark}}@layer jokul.theme{:root,[data-size=medium],[data-size]{--jkl-unit-10:8px;--jkl-unit-base:8px;--jkl-font-size-1:14px;--jkl-font-size-2:16px;--jkl-font-size-3:18px;--jkl-font-size-4:21px;--jkl-font-size-5:26px;--jkl-font-size-6:32px;--jkl-font-size-7:40px;--jkl-font-size-8:44px;--jkl-font-size-9:46px;--jkl-font-size-10:48px}[data-size=small]{--jkl-unit-10:5px;--jkl-unit-base:5px;--jkl-font-size-1:12px;--jkl-font-size-2:14px;--jkl-font-size-3:16px;--jkl-font-size-4:18px;--jkl-font-size-5:21px;--jkl-font-size-6:26px;--jkl-font-size-7:32px;--jkl-font-size-8:40px;--jkl-font-size-9:44px;--jkl-font-size-10:46px}[data-size=large]{--jkl-unit-10:11px;--jkl-unit-base:11px;--jkl-font-size-1:14px;--jkl-font-size-2:16px;--jkl-font-size-3:18px;--jkl-font-size-4:21px;--jkl-font-size-5:26px;--jkl-font-size-6:32px;--jkl-font-size-7:40px;--jkl-font-size-8:44px;--jkl-font-size-9:46px;--jkl-font-size-10:48px}}@layer jokul.theme{:root,[data-brand],[data-size],[data-theme]{--jkl-unit-0:0;--jkl-spacing-0:0rem;--jkl-spacing-2:0.125rem;--jkl-spacing-4:0.25rem;--jkl-spacing-8:0.5rem;--jkl-spacing-12:0.75rem;--jkl-spacing-16:1rem;--jkl-spacing-24:1.5rem;--jkl-spacing-32:2rem;--jkl-spacing-40:2.5rem;--jkl-spacing-64:4rem;--jkl-spacing-104:6.5rem;--jkl-spacing-168:10.5rem;--jkl-spacing-none:0;--jkl-border-width-1:0.0625rem;--jkl-border-width-2:0.125rem;--jkl-border-width-3:0.1875rem;--jkl-border-radius-none:0;--jkl-border-radius-xs:0.25rem;--jkl-border-radius-s:0.5rem;--jkl-border-radius-m:0.75rem;--jkl-border-radius-l:1rem;--jkl-border-radius-full:9999px;--jkl-breakpoint-small:0;--jkl-breakpoint-medium:680px;--jkl-breakpoint-large:1200px;--jkl-breakpoint-xl:1600px;--jkl-motion-timing-energetic:75ms;--jkl-motion-timing-snappy:100ms;--jkl-motion-timing-productive:150ms;--jkl-motion-timing-polite:200ms;--jkl-motion-timing-expressive:250ms;--jkl-motion-timing-lazy:400ms;--jkl-motion-easing-standard:ease;--jkl-motion-easing-entrance:ease-out;--jkl-motion-easing-exit:ease-in;--jkl-motion-easing-ease-in-bounce-out:cubic-bezier(0, 0, 0.375, 1.17);--jkl-motion-easing-focus:cubic-bezier(0.6, 0.2, 0.35, 1);--jkl-font-weight-normal:400;--jkl-font-weight-bold:600;--jkl-font-family-regular:"Jokul", "Adjusted Arial Fallback", arial, sans-serif;--jkl-font-family-display:"Jokul Display", "Adjusted Arial Display Fallback", arial, sans-serif;--jkl-font-family-mono:monospace;--jkl-font-family-icons:"Jokul Icons", "Jokul Icons Fallback", monospace;--jkl-line-height-flush:1;--jkl-line-height-tight:1.3;--jkl-line-height-relaxed:1.6;--jkl-unit-15:calc(var(--jkl-unit-base)*1.5);--jkl-unit-20:calc(var(--jkl-unit-base)*2);--jkl-unit-25:calc(var(--jkl-unit-base)*2.5);--jkl-unit-30:calc(var(--jkl-unit-base)*3);--jkl-unit-35:calc(var(--jkl-unit-base)*3.5);--jkl-unit-40:calc(var(--jkl-unit-base)*4);--jkl-unit-50:calc(var(--jkl-unit-base)*5);--jkl-unit-60:calc(var(--jkl-unit-base)*6);--jkl-unit-70:calc(var(--jkl-unit-base)*7);--jkl-unit-80:calc(var(--jkl-unit-base)*8);--jkl-unit-90:calc(var(--jkl-unit-base)*9);--jkl-unit-100:calc(var(--jkl-unit-base)*10);--jkl-unit-130:calc(var(--jkl-unit-base)*13);--jkl-unit-210:calc(var(--jkl-unit-base)*21);--jkl-unit-02:calc(var(--jkl-unit-base)*0.25);--jkl-unit-05:calc(var(--jkl-unit-base)*0.5);--jkl-spacing-2xs:var(--jkl-spacing-4);--jkl-spacing-xs:var(--jkl-spacing-8);--jkl-spacing-s:var(--jkl-spacing-16);--jkl-spacing-m:var(--jkl-spacing-24);--jkl-spacing-l:var(--jkl-spacing-40);--jkl-spacing-xl:var(--jkl-spacing-64);--jkl-spacing-2xl:var(--jkl-spacing-104);--jkl-text-style-title:var(--jkl-font-weight-normal) var(--jkl-font-size-7)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-title-small:var(--jkl-font-weight-normal) var(--jkl-font-size-6)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-1:var(--jkl-font-weight-normal) var(--jkl-font-size-7)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-2:var(--jkl-font-weight-normal) var(--jkl-font-size-6)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-3:var(--jkl-font-weight-normal) var(--jkl-font-size-5)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-4:var(--jkl-font-weight-bold) var(--jkl-font-size-4)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-5:var(--jkl-font-weight-bold) var(--jkl-font-size-3)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-paragraph-large:var(--jkl-font-weight-normal) var(--jkl-font-size-4)/var(--jkl-line-height-relaxed) var(--jkl-font-family-regular);--jkl-text-style-paragraph-medium:var(--jkl-font-weight-normal) var(--jkl-font-size-3)/var(--jkl-line-height-relaxed) var(--jkl-font-family-regular);--jkl-text-style-paragraph-small:var(--jkl-font-weight-normal) var(--jkl-font-size-2)/var(--jkl-line-height-relaxed) var(--jkl-font-family-regular);--jkl-text-style-text-large:var(--jkl-font-weight-normal) var(--jkl-font-size-4)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-text-medium:var(--jkl-font-weight-normal) var(--jkl-font-size-3)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-text-small:var(--jkl-font-weight-normal) var(--jkl-font-size-2)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-text-micro:var(--jkl-font-weight-normal) var(--jkl-font-size-1)/var(--jkl-line-height-tight) var(--jkl-font-family-regular)}}@layer jokul.theme{[data-brand=dnb]{--jkl-color-background-page:#f8f8f8;--jkl-color-background-page:light-dark(#f8f8f8, #000);--jkl-color-background-container:#fff;--jkl-color-background-container:light-dark(#fff, #2c2c2e);--jkl-color-background-container-accent:#d8f3ec;--jkl-color-background-container-accent:light-dark(#d8f3ec, #023939);--jkl-color-background-contrast:#007272;--jkl-color-background-contrast:light-dark(#007272, #a5e1d2);--jkl-color-text-default:#333;--jkl-color-text-default:light-dark(#333, #fff);--jkl-color-text-subdued:#6b6b6b;--jkl-color-text-subdued:light-dark(#6b6b6b, #9a9aa0);--jkl-color-text-accent:#14555a;--jkl-color-text-accent:light-dark(#14555a, #a5e1d2);--jkl-color-text-on-contrast:#fff;--jkl-color-text-on-contrast:light-dark(#fff, #023939);--jkl-color-border-default:#007272;--jkl-color-border-default:light-dark(#007272, #a5e1d2);--jkl-color-border-subdued:#ccc;--jkl-color-border-subdued:light-dark(#ccc, #48484a);--jkl-color-border-strong:#007272;--jkl-color-border-strong:light-dark(#007272, #a5e1d2);--jkl-color-warning-background-page:#f3f0ed;--jkl-color-warning-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-warning-background-container:#eed9c3;--jkl-color-warning-background-container:light-dark(#eed9c3, #48351e);--jkl-color-warning-background-container-accent:#e4bc8a;--jkl-color-warning-background-container-accent:light-dark(#e4bc8a, #61492d);--jkl-color-warning-background-contrast:#d3770b;--jkl-color-warning-background-contrast:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-default:#522e04;--jkl-color-warning-text-default:light-dark(#522e04, #fdecd8);--jkl-color-warning-text-subdued:#636060;--jkl-color-warning-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-warning-text-accent:#d3770b;--jkl-color-warning-text-accent:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-on-contrast:#fff;--jkl-color-warning-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-warning-border-default:#d3770b;--jkl-color-warning-border-default:light-dark(#d3770b, #eaa858);--jkl-color-warning-border-subdued:#e4bc8a;--jkl-color-warning-border-subdued:light-dark(#e4bc8a, #61492d);--jkl-color-warning-border-strong:#522e04;--jkl-color-warning-border-strong:light-dark(#522e04, #fdecd8);--jkl-color-success-background-page:#f3f0ed;--jkl-color-success-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-success-background-container:#d2e9cb;--jkl-color-success-background-container:light-dark(#d2e9cb, #334d34);--jkl-color-success-background-container-accent:#b7cfaf;--jkl-color-success-background-container-accent:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-background-contrast:#24753a;--jkl-color-success-background-contrast:light-dark(#24753a, #81e49c);--jkl-color-success-text-default:#0a430d;--jkl-color-success-text-default:light-dark(#0a430d, #dcf9e0);--jkl-color-success-text-subdued:#636060;--jkl-color-success-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-success-text-accent:#24753a;--jkl-color-success-text-accent:light-dark(#24753a, #81e49c);--jkl-color-success-text-on-contrast:#fff;--jkl-color-success-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-success-border-default:#24753a;--jkl-color-success-border-default:light-dark(#24753a, #81e49c);--jkl-color-success-border-subdued:#b7cfaf;--jkl-color-success-border-subdued:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-border-strong:#0a430d;--jkl-color-success-border-strong:light-dark(#0a430d, #dcf9e0);--jkl-color-info-background-page:#f3f0ed;--jkl-color-info-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-info-background-container:#d3d3f6;--jkl-color-info-background-container:light-dark(#d3d3f6, #35355b);--jkl-color-info-background-container-accent:#b5b5eb;--jkl-color-info-background-container-accent:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-background-contrast:#4646d1;--jkl-color-info-background-contrast:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-default:#111145;--jkl-color-info-text-default:light-dark(#111145, #d8d8fd);--jkl-color-info-text-subdued:#636060;--jkl-color-info-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-info-text-accent:#4646d1;--jkl-color-info-text-accent:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-on-contrast:#fff;--jkl-color-info-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-info-border-default:#4646d1;--jkl-color-info-border-default:light-dark(#4646d1, #9a9aeb);--jkl-color-info-border-subdued:#b5b5eb;--jkl-color-info-border-subdued:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-border-strong:#111145;--jkl-color-info-border-strong:light-dark(#111145, #d8d8fd);--jkl-color-error-background-page:#f3f0ed;--jkl-color-error-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-error-background-container:#f0d6d6;--jkl-color-error-background-container:light-dark(#f0d6d6, #4c2a28);--jkl-color-error-background-container-accent:#e4b7b6;--jkl-color-error-background-container-accent:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-background-contrast:#b32424;--jkl-color-error-background-contrast:light-dark(#b32424, #f38c8c);--jkl-color-error-text-default:#4a0d0d;--jkl-color-error-text-default:light-dark(#4a0d0d, #fcd9d9);--jkl-color-error-text-subdued:#636060;--jkl-color-error-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-error-text-accent:#b32424;--jkl-color-error-text-accent:light-dark(#b32424, #f38c8c);--jkl-color-error-text-on-contrast:#fff;--jkl-color-error-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-error-border-default:#b32424;--jkl-color-error-border-default:light-dark(#b32424, #f38c8c);--jkl-color-error-border-subdued:#e4b7b6;--jkl-color-error-border-subdued:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-border-strong:#4a0d0d;--jkl-color-error-border-strong:light-dark(#4a0d0d, #fcd9d9)}}@layer jokul.theme{@font-face{font-family:DNB Sans;font-display:fallback;font-weight:400;font-style:normal;src:url(/fonts/brands/dnb/DNB-Regular.woff2) format("woff2")}@font-face{font-family:DNB Sans;font-display:fallback;font-weight:500;font-style:normal;src:url(/fonts/brands/dnb/DNB-Medium.woff2) format("woff2")}@font-face{font-family:DNB Mono;font-display:fallback;font-weight:400;font-style:normal;src:url(/fonts/brands/dnb/DNBMono-Regular.woff2) format("woff2")}[data-brand=dnb]{--jkl-font-family-regular:"DNB Sans", sans-serif;--jkl-font-family-display:"DNB Sans", sans-serif;--jkl-font-family-mono:"DNB Mono", "Adjusted Courier New Fallback", -apple-system, blinkmacsystemfont, monospace;--jkl-font-family-icons:"Jokul Icons", "Jokul Icons Fallback", monospace;--jkl-font-weight-normal:400;--jkl-font-weight-bold:500}}@layer jokul.global{@supports (font:-apple-system-body){@media (pointer:coarse){:root{font:-apple-system-body}}}.jkl{--jkl-background-color:var(--jkl-color-background-page);--jkl-color:var(--jkl-color-text-default);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--jkl-background-color);color:var(--jkl-color);font-family:var(--jkl-font-family-regular);font-weight:var(--jkl-font-weight-normal)}.jkl strong{font-weight:var(--jkl-font-weight-bold)}.jkl a,.jkl button:not(:disabled){cursor:pointer}@media screen and (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:0s!important;animation-delay:0s!important;transition:none!important}}}@layer jokul.global{[popover]{opacity:0}@supports (overlay:auto){[popover]{transition:opacity,overlay allow-discrete,display allow-discrete;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive)}}[popover]:popover-open{opacity:1}@starting-style{[popover]:popover-open{opacity:0}}@supports not (overlay:auto){[popover]:popover-open{transition:opacity;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive)}}}@layer jokul.utility{.jkl-body,.jkl-bold{font:var(--jkl-text-style-paragraph-medium)}.jkl-bold{font-weight:var(--jkl-font-weight-bold)}.jkl-small{font:var(--jkl-text-style-paragraph-small)}.jkl-title{font:var(--jkl-text-style-title)}.jkl-title-small{font:var(--jkl-text-style-title-small)}.jkl-heading-1{font:var(--jkl-text-style-heading-1)}.jkl-heading-2{font:var(--jkl-text-style-heading-2)}.jkl-heading-3{font:var(--jkl-text-style-heading-3)}.jkl-heading-4{font:var(--jkl-text-style-heading-4)}.jkl-heading-5{font:var(--jkl-text-style-heading-5)}.jkl-paragraph-large{font:var(--jkl-text-style-paragraph-large)}.jkl-paragraph-medium{font:var(--jkl-text-style-paragraph-medium)}.jkl-paragraph-small{font:var(--jkl-text-style-paragraph-small)}.jkl-text-large{font:var(--jkl-text-style-text-large)}.jkl-text-medium{font:var(--jkl-text-style-text-medium)}.jkl-text-small{font:var(--jkl-text-style-text-small)}.jkl-text-micro{font:var(--jkl-text-style-text-micro)}.jkl-sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important;white-space:nowrap!important}}@layer jokul.utility{.jkl-sr-only--focusable:active,.jkl-sr-only--focusable:focus{clip:auto!important;-webkit-clip-path:none!important;clip-path:none!important;height:auto!important;margin:auto!important;overflow:visible!important;width:auto!important;white-space:normal!important}}@layer jokul.utility{.jkl-spacing-2--all{margin:var(--jkl-spacing-2)}.jkl-spacing-2--top{margin-top:var(--jkl-spacing-2)}.jkl-spacing-2--bottom{margin-bottom:var(--jkl-spacing-2)}.jkl-spacing-2--left{margin-left:var(--jkl-spacing-2)}.jkl-spacing-2--right{margin-right:var(--jkl-spacing-2)}.jkl-spacing-4--all{margin:var(--jkl-spacing-4)}.jkl-spacing-4--top{margin-top:var(--jkl-spacing-4)}.jkl-spacing-4--bottom{margin-bottom:var(--jkl-spacing-4)}.jkl-spacing-4--left{margin-left:var(--jkl-spacing-4)}.jkl-spacing-4--right{margin-right:var(--jkl-spacing-4)}.jkl-spacing-8--all{margin:var(--jkl-spacing-8)}.jkl-spacing-8--top{margin-top:var(--jkl-spacing-8)}.jkl-spacing-8--bottom{margin-bottom:var(--jkl-spacing-8)}.jkl-spacing-8--left{margin-left:var(--jkl-spacing-8)}.jkl-spacing-8--right{margin-right:var(--jkl-spacing-8)}.jkl-spacing-12--all{margin:var(--jkl-spacing-12)}.jkl-spacing-12--top{margin-top:var(--jkl-spacing-12)}.jkl-spacing-12--bottom{margin-bottom:var(--jkl-spacing-12)}.jkl-spacing-12--left{margin-left:var(--jkl-spacing-12)}.jkl-spacing-12--right{margin-right:var(--jkl-spacing-12)}.jkl-spacing-16--all{margin:var(--jkl-spacing-16)}.jkl-spacing-16--top{margin-top:var(--jkl-spacing-16)}.jkl-spacing-16--bottom{margin-bottom:var(--jkl-spacing-16)}.jkl-spacing-16--left{margin-left:var(--jkl-spacing-16)}.jkl-spacing-16--right{margin-right:var(--jkl-spacing-16)}.jkl-spacing-24--all{margin:var(--jkl-spacing-24)}.jkl-spacing-24--top{margin-top:var(--jkl-spacing-24)}.jkl-spacing-24--bottom{margin-bottom:var(--jkl-spacing-24)}.jkl-spacing-24--left{margin-left:var(--jkl-spacing-24)}.jkl-spacing-24--right{margin-right:var(--jkl-spacing-24)}.jkl-spacing-32--all{margin:var(--jkl-spacing-32)}.jkl-spacing-32--top{margin-top:var(--jkl-spacing-32)}.jkl-spacing-32--bottom{margin-bottom:var(--jkl-spacing-32)}.jkl-spacing-32--left{margin-left:var(--jkl-spacing-32)}.jkl-spacing-32--right{margin-right:var(--jkl-spacing-32)}.jkl-spacing-40--all{margin:var(--jkl-spacing-40)}.jkl-spacing-40--top{margin-top:var(--jkl-spacing-40)}.jkl-spacing-40--bottom{margin-bottom:var(--jkl-spacing-40)}.jkl-spacing-40--left{margin-left:var(--jkl-spacing-40)}.jkl-spacing-40--right{margin-right:var(--jkl-spacing-40)}.jkl-spacing-64--all{margin:var(--jkl-spacing-64)}.jkl-spacing-64--top{margin-top:var(--jkl-spacing-64)}.jkl-spacing-64--bottom{margin-bottom:var(--jkl-spacing-64)}.jkl-spacing-64--left{margin-left:var(--jkl-spacing-64)}.jkl-spacing-64--right{margin-right:var(--jkl-spacing-64)}.jkl-spacing-104--all{margin:var(--jkl-spacing-104)}.jkl-spacing-104--top{margin-top:var(--jkl-spacing-104)}.jkl-spacing-104--bottom{margin-bottom:var(--jkl-spacing-104)}.jkl-spacing-104--left{margin-left:var(--jkl-spacing-104)}.jkl-spacing-104--right{margin-right:var(--jkl-spacing-104)}.jkl-spacing-168--all{margin:var(--jkl-spacing-168)}.jkl-spacing-168--top{margin-top:var(--jkl-spacing-168)}.jkl-spacing-168--bottom{margin-bottom:var(--jkl-spacing-168)}.jkl-spacing-168--left{margin-left:var(--jkl-spacing-168)}.jkl-spacing-168--right{margin-right:var(--jkl-spacing-168)}.jkl-spacing-16-24--all{margin:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--top{margin-top:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--bottom{margin-bottom:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--left{margin-left:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--right{margin-right:var(--jkl-spacing-16-24)}.jkl-spacing-24-40--all{margin:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--top{margin-top:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--bottom{margin-bottom:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--left{margin-left:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--right{margin-right:var(--jkl-spacing-24-40)}.jkl-spacing-24-32--all{margin:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--top{margin-top:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--bottom{margin-bottom:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--left{margin-left:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--right{margin-right:var(--jkl-spacing-24-32)}.jkl-spacing-32-40--all{margin:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--top{margin-top:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--bottom{margin-bottom:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--left{margin-left:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--right{margin-right:var(--jkl-spacing-32-40)}.jkl-spacing-40-64--all{margin:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--top{margin-top:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--bottom{margin-bottom:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--left{margin-left:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--right{margin-right:var(--jkl-spacing-40-64)}.jkl-spacing-64-104--all{margin:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--top{margin-top:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--bottom{margin-bottom:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--left{margin-left:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--right{margin-right:var(--jkl-spacing-64-104)}.jkl-spacing-104-168--all{margin:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--top{margin-top:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--bottom{margin-bottom:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--left{margin-left:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--right{margin-right:var(--jkl-spacing-104-168)}.jkl-spacing-16-16-24--all{margin:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--top{margin-top:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--bottom{margin-bottom:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--left{margin-left:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--right{margin-right:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-24-32--all{margin:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--top{margin-top:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--bottom{margin-bottom:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--left{margin-left:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--right{margin-right:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-40--all{margin:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--top{margin-top:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--bottom{margin-bottom:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--left{margin-left:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--right{margin-right:var(--jkl-spacing-16-24-40)}.jkl-spacing-24-24-32--all{margin:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--top{margin-top:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--bottom{margin-bottom:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--left{margin-left:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--right{margin-right:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-40--all{margin:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--top{margin-top:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--bottom{margin-bottom:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--left{margin-left:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--right{margin-right:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-32-40--all{margin:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--top{margin-top:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--bottom{margin-bottom:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--left{margin-left:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--right{margin-right:var(--jkl-spacing-24-32-40)}.jkl-spacing-32-32-40--all{margin:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--top{margin-top:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--bottom{margin-bottom:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--left{margin-left:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--right{margin-right:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-40-64--all{margin:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--top{margin-top:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--bottom{margin-bottom:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--left{margin-left:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--right{margin-right:var(--jkl-spacing-32-40-64)}.jkl-spacing-40-40-64--all{margin:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--top{margin-top:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--bottom{margin-bottom:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--left{margin-left:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--right{margin-right:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-64-104--all{margin:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--top{margin-top:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--bottom{margin-bottom:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--left{margin-left:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--right{margin-right:var(--jkl-spacing-40-64-104)}.jkl-spacing-64-64-104--all{margin:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--top{margin-top:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--bottom{margin-bottom:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--left{margin-left:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--right{margin-right:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-104-168--all{margin:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--top{margin-top:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--bottom{margin-bottom:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--left{margin-left:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--right{margin-right:var(--jkl-spacing-64-104-168)}.jkl-spacing-104-104-168--all{margin:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--top{margin-top:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--bottom{margin-bottom:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--left{margin-left:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--right{margin-right:var(--jkl-spacing-104-104-168)}.jkl-spacing-0--all{margin:var(--jkl-spacing-0)}.jkl-spacing-0--top{margin-top:var(--jkl-spacing-0)}.jkl-spacing-0--bottom{margin-bottom:var(--jkl-spacing-0)}.jkl-spacing-0--left{margin-left:var(--jkl-spacing-0)}.jkl-spacing-0--right{margin-right:var(--jkl-spacing-0)}.jkl-spacing-none--all{margin:var(--jkl-spacing-none)}.jkl-spacing-none--top{margin-top:var(--jkl-spacing-none)}.jkl-spacing-none--bottom{margin-bottom:var(--jkl-spacing-none)}.jkl-spacing-none--left{margin-left:var(--jkl-spacing-none)}.jkl-spacing-none--right{margin-right:var(--jkl-spacing-none)}.jkl-spacing-2xs--all{margin:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--top{margin-top:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--bottom{margin-bottom:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--left{margin-left:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--right{margin-right:var(--jkl-spacing-2xs)}.jkl-spacing-xs--all{margin:var(--jkl-spacing-xs)}.jkl-spacing-xs--top{margin-top:var(--jkl-spacing-xs)}.jkl-spacing-xs--bottom{margin-bottom:var(--jkl-spacing-xs)}.jkl-spacing-xs--left{margin-left:var(--jkl-spacing-xs)}.jkl-spacing-xs--right{margin-right:var(--jkl-spacing-xs)}.jkl-spacing-s--all{margin:var(--jkl-spacing-s)}.jkl-spacing-s--top{margin-top:var(--jkl-spacing-s)}.jkl-spacing-s--bottom{margin-bottom:var(--jkl-spacing-s)}.jkl-spacing-s--left{margin-left:var(--jkl-spacing-s)}.jkl-spacing-s--right{margin-right:var(--jkl-spacing-s)}.jkl-spacing-m--all{margin:var(--jkl-spacing-m)}.jkl-spacing-m--top{margin-top:var(--jkl-spacing-m)}.jkl-spacing-m--bottom{margin-bottom:var(--jkl-spacing-m)}.jkl-spacing-m--left{margin-left:var(--jkl-spacing-m)}.jkl-spacing-m--right{margin-right:var(--jkl-spacing-m)}.jkl-spacing-l--all{margin:var(--jkl-spacing-l)}.jkl-spacing-l--top{margin-top:var(--jkl-spacing-l)}.jkl-spacing-l--bottom{margin-bottom:var(--jkl-spacing-l)}.jkl-spacing-l--left{margin-left:var(--jkl-spacing-l)}.jkl-spacing-l--right{margin-right:var(--jkl-spacing-l)}.jkl-spacing-xl--all{margin:var(--jkl-spacing-xl)}.jkl-spacing-xl--top{margin-top:var(--jkl-spacing-xl)}.jkl-spacing-xl--bottom{margin-bottom:var(--jkl-spacing-xl)}.jkl-spacing-xl--left{margin-left:var(--jkl-spacing-xl)}.jkl-spacing-xl--right{margin-right:var(--jkl-spacing-xl)}.jkl-spacing-2xl--all{margin:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--top{margin-top:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--bottom{margin-bottom:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--left{margin-left:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--right{margin-right:var(--jkl-spacing-2xl)}}@layer jokul.utility{:is(ul,ol):is(.jkl-list-reset){list-style-type:none;margin:0;padding:0}}
2
+ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */@layer jokul.resets{html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}h1,h2,h3,h4,h5,h6,p{margin:0}fieldset{margin:0;border:0;padding:0;display:block;line-height:1}table{border-collapse:collapse}table,tbody,td,th,thead,tr{margin:0;padding:0}}@layer jokul.resets{.jkl [hidden]{display:none!important}}@layer jokul.theme{@font-face{font-family:Jokul;font-display:fallback;font-weight:100 900;font-style:normal;src:url(/fonts/InterVariable.woff2) format("woff2")}@font-face{font-family:Jokul Display;font-display:fallback;font-weight:400;font-style:normal;src:url(/fonts/InterVariable.woff2) format("woff2")}@font-face{font-family:Jokul Icons;font-weight:300 400;font-style:normal;src:url(/fonts/Jokul-Icons.woff2) format("woff2")}@font-face{font-family:Adjusted Arial Fallback;font-weight:400;font-style:normal;src:local(arial);size-adjust:104%;ascent-override:82%;descent-override:normal;line-gap-override:32%}@font-face{font-family:Adjusted Arial Fallback;font-weight:700;font-style:normal;src:local(arial);size-adjust:108%;ascent-override:83%;descent-override:normal;line-gap-override:28%}@font-face{font-family:Adjusted Arial Display Fallback;font-weight:400;font-style:normal;src:local(arial);size-adjust:102%;ascent-override:76%;descent-override:normal;line-gap-override:40%}@font-face{font-family:Adjusted Courier New Fallback;font-weight:400;font-style:normal;src:local(courier new);size-adjust:100%;ascent-override:83%;descent-override:normal;line-gap-override:27%}@font-face{font-family:Jokul Icons Fallback;src:local(courier new);font-weight:300 400;font-style:normal;size-adjust:0%}}@layer jokul.theme{:root{--jkl-spacing-16-24:var(--jkl-spacing-16);--jkl-spacing-24-40:var(--jkl-spacing-24);--jkl-spacing-24-32:var(--jkl-spacing-24);--jkl-spacing-32-40:var(--jkl-spacing-32);--jkl-spacing-40-64:var(--jkl-spacing-40);--jkl-spacing-64-104:var(--jkl-spacing-64);--jkl-spacing-104-168:var(--jkl-spacing-104);--jkl-spacing-16-16-24:var(--jkl-spacing-16);--jkl-spacing-16-24-32:var(--jkl-spacing-16);--jkl-spacing-16-24-40:var(--jkl-spacing-16);--jkl-spacing-24-24-32:var(--jkl-spacing-24);--jkl-spacing-24-24-40:var(--jkl-spacing-24);--jkl-spacing-24-32-40:var(--jkl-spacing-24);--jkl-spacing-32-32-40:var(--jkl-spacing-32);--jkl-spacing-32-40-64:var(--jkl-spacing-32);--jkl-spacing-40-40-64:var(--jkl-spacing-40);--jkl-spacing-40-64-104:var(--jkl-spacing-40);--jkl-spacing-64-64-104:var(--jkl-spacing-64);--jkl-spacing-64-104-168:var(--jkl-spacing-64);--jkl-spacing-104-104-168:var(--jkl-spacing-104)}@media (min-width:680px){:root{--jkl-spacing-16-24:var(--jkl-spacing-24);--jkl-spacing-24-40:var(--jkl-spacing-40);--jkl-spacing-24-32:var(--jkl-spacing-32);--jkl-spacing-32-40:var(--jkl-spacing-40);--jkl-spacing-40-64:var(--jkl-spacing-64);--jkl-spacing-64-104:var(--jkl-spacing-104);--jkl-spacing-104-168:var(--jkl-spacing-168);--jkl-spacing-16-16-24:var(--jkl-spacing-16);--jkl-spacing-16-24-32:var(--jkl-spacing-24);--jkl-spacing-16-24-40:var(--jkl-spacing-24);--jkl-spacing-24-24-32:var(--jkl-spacing-24);--jkl-spacing-24-24-40:var(--jkl-spacing-24);--jkl-spacing-24-32-40:var(--jkl-spacing-32);--jkl-spacing-32-32-40:var(--jkl-spacing-32);--jkl-spacing-32-40-64:var(--jkl-spacing-40);--jkl-spacing-40-40-64:var(--jkl-spacing-40);--jkl-spacing-40-64-104:var(--jkl-spacing-64);--jkl-spacing-64-64-104:var(--jkl-spacing-64);--jkl-spacing-64-104-168:var(--jkl-spacing-104);--jkl-spacing-104-104-168:var(--jkl-spacing-104)}}@media (min-width:1200px){:root{--jkl-spacing-16-16-24:var(--jkl-spacing-24);--jkl-spacing-16-24-32:var(--jkl-spacing-32);--jkl-spacing-16-24-40:var(--jkl-spacing-40);--jkl-spacing-24-24-32:var(--jkl-spacing-32);--jkl-spacing-24-24-40:var(--jkl-spacing-40);--jkl-spacing-24-32-40:var(--jkl-spacing-40);--jkl-spacing-32-32-40:var(--jkl-spacing-40);--jkl-spacing-32-40-64:var(--jkl-spacing-64);--jkl-spacing-40-40-64:var(--jkl-spacing-64);--jkl-spacing-40-64-104:var(--jkl-spacing-104);--jkl-spacing-64-64-104:var(--jkl-spacing-104);--jkl-spacing-64-104-168:var(--jkl-spacing-168);--jkl-spacing-104-104-168:var(--jkl-spacing-168)}}}@layer jokul.theme{:root{color-scheme:light dark;--jkl-color-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-background-container:light-dark(#fff, #262221);--jkl-color-background-container-accent:light-dark(#e4dfd8, #3c3434);--jkl-color-background-contrast:light-dark(#262221, #f3f0ed);--jkl-color-text-default:light-dark(#0e0d0c, #fff);--jkl-color-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-text-accent:light-dark(#0e0d0c, #fff);--jkl-color-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-border-default:light-dark(#636060, #c8c5c3);--jkl-color-border-subdued:light-dark(#c8c5c3, #636060);--jkl-color-border-strong:light-dark(#0e0d0c, #fff);--jkl-color-warning-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-warning-background-container:light-dark(#eed9c3, #48351e);--jkl-color-warning-background-container-accent:light-dark(#e4bc8a, #61492d);--jkl-color-warning-background-contrast:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-default:light-dark(#522e04, #fdecd8);--jkl-color-warning-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-warning-text-accent:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-warning-border-default:light-dark(#d3770b, #eaa858);--jkl-color-warning-border-subdued:light-dark(#e4bc8a, #61492d);--jkl-color-warning-border-strong:light-dark(#522e04, #fdecd8);--jkl-color-success-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-success-background-container:light-dark(#d2e9cb, #334d34);--jkl-color-success-background-container-accent:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-background-contrast:light-dark(#24753a, #81e49c);--jkl-color-success-text-default:light-dark(#0a430d, #dcf9e0);--jkl-color-success-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-success-text-accent:light-dark(#24753a, #81e49c);--jkl-color-success-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-success-border-default:light-dark(#24753a, #81e49c);--jkl-color-success-border-subdued:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-border-strong:light-dark(#0a430d, #dcf9e0);--jkl-color-info-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-info-background-container:light-dark(#d3d3f6, #35355b);--jkl-color-info-background-container-accent:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-background-contrast:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-default:light-dark(#111145, #d8d8fd);--jkl-color-info-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-info-text-accent:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-info-border-default:light-dark(#4646d1, #9a9aeb);--jkl-color-info-border-subdued:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-border-strong:light-dark(#111145, #d8d8fd);--jkl-color-error-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-error-background-container:light-dark(#f0d6d6, #4c2a28);--jkl-color-error-background-container-accent:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-background-contrast:light-dark(#b32424, #f38c8c);--jkl-color-error-text-default:light-dark(#4a0d0d, #fcd9d9);--jkl-color-error-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-error-text-accent:light-dark(#b32424, #f38c8c);--jkl-color-error-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-error-border-default:light-dark(#b32424, #f38c8c);--jkl-color-error-border-subdued:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-border-strong:light-dark(#4a0d0d, #fcd9d9)}[data-theme=light]{color-scheme:light}[data-theme=dark]{color-scheme:dark}@supports not (color:light-dark(#000,#fff)){:root{--jkl-color-background-page:#f3f0ed;--jkl-color-background-container:#fff;--jkl-color-background-container-accent:#e4dfd8;--jkl-color-background-contrast:#262221;--jkl-color-text-default:#0e0d0c;--jkl-color-text-subdued:#636060;--jkl-color-text-accent:#0e0d0c;--jkl-color-text-on-contrast:#fff;--jkl-color-border-default:#636060;--jkl-color-border-subdued:#c8c5c3;--jkl-color-border-strong:#0e0d0c;--jkl-color-warning-background-page:#f3f0ed;--jkl-color-warning-background-container:#eed9c3;--jkl-color-warning-background-container-accent:#e4bc8a;--jkl-color-warning-background-contrast:#d3770b;--jkl-color-warning-text-default:#522e04;--jkl-color-warning-text-subdued:#636060;--jkl-color-warning-text-accent:#d3770b;--jkl-color-warning-text-on-contrast:#fff;--jkl-color-warning-border-default:#d3770b;--jkl-color-warning-border-subdued:#e4bc8a;--jkl-color-warning-border-strong:#522e04;--jkl-color-success-background-page:#f3f0ed;--jkl-color-success-background-container:#d2e9cb;--jkl-color-success-background-container-accent:#b7cfaf;--jkl-color-success-background-contrast:#24753a;--jkl-color-success-text-default:#0a430d;--jkl-color-success-text-subdued:#636060;--jkl-color-success-text-accent:#24753a;--jkl-color-success-text-on-contrast:#fff;--jkl-color-success-border-default:#24753a;--jkl-color-success-border-subdued:#b7cfaf;--jkl-color-success-border-strong:#0a430d;--jkl-color-info-background-page:#f3f0ed;--jkl-color-info-background-container:#d3d3f6;--jkl-color-info-background-container-accent:#b5b5eb;--jkl-color-info-background-contrast:#4646d1;--jkl-color-info-text-default:#111145;--jkl-color-info-text-subdued:#636060;--jkl-color-info-text-accent:#4646d1;--jkl-color-info-text-on-contrast:#fff;--jkl-color-info-border-default:#4646d1;--jkl-color-info-border-subdued:#b5b5eb;--jkl-color-info-border-strong:#111145;--jkl-color-error-background-page:#f3f0ed;--jkl-color-error-background-container:#f0d6d6;--jkl-color-error-background-container-accent:#e4b7b6;--jkl-color-error-background-contrast:#b32424;--jkl-color-error-text-default:#4a0d0d;--jkl-color-error-text-subdued:#636060;--jkl-color-error-text-accent:#b32424;--jkl-color-error-text-on-contrast:#fff;--jkl-color-error-border-default:#b32424;--jkl-color-error-border-subdued:#e4b7b6;--jkl-color-error-border-strong:#4a0d0d}}}@layer jokul.theme{[data-color=warning]{--jkl-color-background-page:var(--jkl-color-warning-background-page);--jkl-color-background-container:var(--jkl-color-warning-background-container);--jkl-color-background-container-accent:var(--jkl-color-warning-background-container-accent);--jkl-color-background-contrast:var(--jkl-color-warning-background-contrast);--jkl-color-text-default:var(--jkl-color-warning-text-default);--jkl-color-text-subdued:var(--jkl-color-warning-text-subdued);--jkl-color-text-accent:var(--jkl-color-warning-text-accent);--jkl-color-text-on-contrast:var(--jkl-color-warning-text-on-contrast);--jkl-color-border-default:var(--jkl-color-warning-border-default);--jkl-color-border-subdued:var(--jkl-color-warning-border-subdued);--jkl-color-border-strong:var(--jkl-color-warning-border-strong)}[data-color=success]{--jkl-color-background-page:var(--jkl-color-success-background-page);--jkl-color-background-container:var(--jkl-color-success-background-container);--jkl-color-background-container-accent:var(--jkl-color-success-background-container-accent);--jkl-color-background-contrast:var(--jkl-color-success-background-contrast);--jkl-color-text-default:var(--jkl-color-success-text-default);--jkl-color-text-subdued:var(--jkl-color-success-text-subdued);--jkl-color-text-accent:var(--jkl-color-success-text-accent);--jkl-color-text-on-contrast:var(--jkl-color-success-text-on-contrast);--jkl-color-border-default:var(--jkl-color-success-border-default);--jkl-color-border-subdued:var(--jkl-color-success-border-subdued);--jkl-color-border-strong:var(--jkl-color-success-border-strong)}[data-color=info]{--jkl-color-background-page:var(--jkl-color-info-background-page);--jkl-color-background-container:var(--jkl-color-info-background-container);--jkl-color-background-container-accent:var(--jkl-color-info-background-container-accent);--jkl-color-background-contrast:var(--jkl-color-info-background-contrast);--jkl-color-text-default:var(--jkl-color-info-text-default);--jkl-color-text-subdued:var(--jkl-color-info-text-subdued);--jkl-color-text-accent:var(--jkl-color-info-text-accent);--jkl-color-text-on-contrast:var(--jkl-color-info-text-on-contrast);--jkl-color-border-default:var(--jkl-color-info-border-default);--jkl-color-border-subdued:var(--jkl-color-info-border-subdued);--jkl-color-border-strong:var(--jkl-color-info-border-strong)}[data-color=error]{--jkl-color-background-page:var(--jkl-color-error-background-page);--jkl-color-background-container:var(--jkl-color-error-background-container);--jkl-color-background-container-accent:var(--jkl-color-error-background-container-accent);--jkl-color-background-contrast:var(--jkl-color-error-background-contrast);--jkl-color-text-default:var(--jkl-color-error-text-default);--jkl-color-text-subdued:var(--jkl-color-error-text-subdued);--jkl-color-text-accent:var(--jkl-color-error-text-accent);--jkl-color-text-on-contrast:var(--jkl-color-error-text-on-contrast);--jkl-color-border-default:var(--jkl-color-error-border-default);--jkl-color-border-subdued:var(--jkl-color-error-border-subdued);--jkl-color-border-strong:var(--jkl-color-error-border-strong)}}@layer jokul.theme{:root,[data-size=medium],[data-size]{--jkl-unit-10:8px;--jkl-unit-base:8px;--jkl-font-size-1:14px;--jkl-font-size-2:16px;--jkl-font-size-3:18px;--jkl-font-size-4:21px;--jkl-font-size-5:26px;--jkl-font-size-6:32px;--jkl-font-size-7:40px;--jkl-font-size-8:44px;--jkl-font-size-9:46px;--jkl-font-size-10:48px}[data-size=small]{--jkl-unit-10:5px;--jkl-unit-base:5px;--jkl-font-size-1:12px;--jkl-font-size-2:14px;--jkl-font-size-3:16px;--jkl-font-size-4:18px;--jkl-font-size-5:21px;--jkl-font-size-6:26px;--jkl-font-size-7:32px;--jkl-font-size-8:40px;--jkl-font-size-9:44px;--jkl-font-size-10:46px}[data-size=large]{--jkl-unit-10:11px;--jkl-unit-base:11px;--jkl-font-size-1:14px;--jkl-font-size-2:16px;--jkl-font-size-3:18px;--jkl-font-size-4:21px;--jkl-font-size-5:26px;--jkl-font-size-6:32px;--jkl-font-size-7:40px;--jkl-font-size-8:44px;--jkl-font-size-9:46px;--jkl-font-size-10:48px}}@layer jokul.theme{:root,[data-theme=light]{--jkl-opacity-hover:10%}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--jkl-opacity-hover:15%}}[data-theme=dark]{--jkl-opacity-hover:15%}}@layer jokul.theme{:root,[data-brand],[data-size],[data-theme]{--jkl-unit-0:0;--jkl-spacing-0:0rem;--jkl-spacing-2:0.125rem;--jkl-spacing-4:0.25rem;--jkl-spacing-8:0.5rem;--jkl-spacing-12:0.75rem;--jkl-spacing-16:1rem;--jkl-spacing-24:1.5rem;--jkl-spacing-32:2rem;--jkl-spacing-40:2.5rem;--jkl-spacing-64:4rem;--jkl-spacing-104:6.5rem;--jkl-spacing-168:10.5rem;--jkl-spacing-none:0;--jkl-border-width-1:0.0625rem;--jkl-border-width-2:0.125rem;--jkl-border-width-3:0.1875rem;--jkl-border-radius-none:0;--jkl-border-radius-xs:0.25rem;--jkl-border-radius-s:0.5rem;--jkl-border-radius-m:0.75rem;--jkl-border-radius-l:1rem;--jkl-border-radius-full:9999px;--jkl-breakpoint-small:0;--jkl-breakpoint-medium:680px;--jkl-breakpoint-large:1200px;--jkl-breakpoint-xl:1600px;--jkl-motion-timing-energetic:75ms;--jkl-motion-timing-snappy:100ms;--jkl-motion-timing-productive:150ms;--jkl-motion-timing-polite:200ms;--jkl-motion-timing-expressive:250ms;--jkl-motion-timing-lazy:400ms;--jkl-motion-easing-standard:ease;--jkl-motion-easing-entrance:ease-out;--jkl-motion-easing-exit:ease-in;--jkl-motion-easing-ease-in-bounce-out:cubic-bezier(0, 0, 0.375, 1.17);--jkl-motion-easing-focus:cubic-bezier(0.6, 0.2, 0.35, 1);--jkl-font-weight-normal:400;--jkl-font-weight-bold:600;--jkl-font-family-regular:"Jokul", "Adjusted Arial Fallback", arial, sans-serif;--jkl-font-family-display:"Jokul Display", "Adjusted Arial Display Fallback", arial, sans-serif;--jkl-font-family-mono:monospace;--jkl-font-family-icons:"Jokul Icons", "Jokul Icons Fallback", monospace;--jkl-line-height-flush:1;--jkl-line-height-tight:1.3;--jkl-line-height-relaxed:1.6;--jkl-unit-15:calc(var(--jkl-unit-base)*1.5);--jkl-unit-20:calc(var(--jkl-unit-base)*2);--jkl-unit-25:calc(var(--jkl-unit-base)*2.5);--jkl-unit-30:calc(var(--jkl-unit-base)*3);--jkl-unit-35:calc(var(--jkl-unit-base)*3.5);--jkl-unit-40:calc(var(--jkl-unit-base)*4);--jkl-unit-50:calc(var(--jkl-unit-base)*5);--jkl-unit-60:calc(var(--jkl-unit-base)*6);--jkl-unit-70:calc(var(--jkl-unit-base)*7);--jkl-unit-80:calc(var(--jkl-unit-base)*8);--jkl-unit-90:calc(var(--jkl-unit-base)*9);--jkl-unit-100:calc(var(--jkl-unit-base)*10);--jkl-unit-130:calc(var(--jkl-unit-base)*13);--jkl-unit-210:calc(var(--jkl-unit-base)*21);--jkl-unit-02:calc(var(--jkl-unit-base)*0.25);--jkl-unit-05:calc(var(--jkl-unit-base)*0.5);--jkl-spacing-2xs:var(--jkl-spacing-4);--jkl-spacing-xs:var(--jkl-spacing-8);--jkl-spacing-s:var(--jkl-spacing-16);--jkl-spacing-m:var(--jkl-spacing-24);--jkl-spacing-l:var(--jkl-spacing-40);--jkl-spacing-xl:var(--jkl-spacing-64);--jkl-spacing-2xl:var(--jkl-spacing-104);--jkl-text-style-title:var(--jkl-font-weight-normal) var(--jkl-font-size-7)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-title-small:var(--jkl-font-weight-normal) var(--jkl-font-size-6)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-1:var(--jkl-font-weight-normal) var(--jkl-font-size-7)/var(--jkl-line-height-tight) var(--jkl-font-family-display);--jkl-text-style-heading-2:var(--jkl-font-weight-normal) var(--jkl-font-size-6)/var(--jkl-line-height-tight) var(--jkl-font-family-display);--jkl-text-style-heading-3:var(--jkl-font-weight-normal) var(--jkl-font-size-5)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-4:var(--jkl-font-weight-bold) var(--jkl-font-size-4)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-heading-5:var(--jkl-font-weight-bold) var(--jkl-font-size-3)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-paragraph-large:var(--jkl-font-weight-normal) var(--jkl-font-size-4)/var(--jkl-line-height-relaxed) var(--jkl-font-family-regular);--jkl-text-style-paragraph-medium:var(--jkl-font-weight-normal) var(--jkl-font-size-3)/var(--jkl-line-height-relaxed) var(--jkl-font-family-regular);--jkl-text-style-paragraph-small:var(--jkl-font-weight-normal) var(--jkl-font-size-2)/var(--jkl-line-height-relaxed) var(--jkl-font-family-regular);--jkl-text-style-text-large:var(--jkl-font-weight-normal) var(--jkl-font-size-4)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-text-medium:var(--jkl-font-weight-normal) var(--jkl-font-size-3)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-text-small:var(--jkl-font-weight-normal) var(--jkl-font-size-2)/var(--jkl-line-height-tight) var(--jkl-font-family-regular);--jkl-text-style-text-micro:var(--jkl-font-weight-normal) var(--jkl-font-size-1)/var(--jkl-line-height-tight) var(--jkl-font-family-regular)}}@layer jokul.theme{[data-brand=dnb]{--jkl-color-background-page:light-dark(#f8f8f8, #000);--jkl-color-background-container:light-dark(#fff, #2c2c2e);--jkl-color-background-container-accent:light-dark(#d8f3ec, #023939);--jkl-color-background-contrast:light-dark(#007272, #a5e1d2);--jkl-color-text-default:light-dark(#333, #fff);--jkl-color-text-subdued:light-dark(#6b6b6b, #9a9aa0);--jkl-color-text-accent:light-dark(#14555a, #a5e1d2);--jkl-color-text-on-contrast:light-dark(#fff, #023939);--jkl-color-border-default:light-dark(#007272, #a5e1d2);--jkl-color-border-subdued:light-dark(#ccc, #48484a);--jkl-color-border-strong:light-dark(#007272, #a5e1d2);--jkl-color-warning-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-warning-background-container:light-dark(#eed9c3, #48351e);--jkl-color-warning-background-container-accent:light-dark(#e4bc8a, #61492d);--jkl-color-warning-background-contrast:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-default:light-dark(#522e04, #fdecd8);--jkl-color-warning-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-warning-text-accent:light-dark(#d3770b, #eaa858);--jkl-color-warning-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-warning-border-default:light-dark(#d3770b, #eaa858);--jkl-color-warning-border-subdued:light-dark(#e4bc8a, #61492d);--jkl-color-warning-border-strong:light-dark(#522e04, #fdecd8);--jkl-color-success-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-success-background-container:light-dark(#d2e9cb, #334d34);--jkl-color-success-background-container-accent:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-background-contrast:light-dark(#24753a, #81e49c);--jkl-color-success-text-default:light-dark(#0a430d, #dcf9e0);--jkl-color-success-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-success-text-accent:light-dark(#24753a, #81e49c);--jkl-color-success-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-success-border-default:light-dark(#24753a, #81e49c);--jkl-color-success-border-subdued:light-dark(#b7cfaf, #3f5f41);--jkl-color-success-border-strong:light-dark(#0a430d, #dcf9e0);--jkl-color-info-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-info-background-container:light-dark(#d3d3f6, #35355b);--jkl-color-info-background-container-accent:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-background-contrast:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-default:light-dark(#111145, #d8d8fd);--jkl-color-info-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-info-text-accent:light-dark(#4646d1, #9a9aeb);--jkl-color-info-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-info-border-default:light-dark(#4646d1, #9a9aeb);--jkl-color-info-border-subdued:light-dark(#b5b5eb, #4b4b89);--jkl-color-info-border-strong:light-dark(#111145, #d8d8fd);--jkl-color-error-background-page:light-dark(#f3f0ed, #0e0d0c);--jkl-color-error-background-container:light-dark(#f0d6d6, #4c2a28);--jkl-color-error-background-container-accent:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-background-contrast:light-dark(#b32424, #f38c8c);--jkl-color-error-text-default:light-dark(#4a0d0d, #fcd9d9);--jkl-color-error-text-subdued:light-dark(#636060, #c8c5c3);--jkl-color-error-text-accent:light-dark(#b32424, #f38c8c);--jkl-color-error-text-on-contrast:light-dark(#fff, #0e0d0c);--jkl-color-error-border-default:light-dark(#b32424, #f38c8c);--jkl-color-error-border-subdued:light-dark(#e4b7b6, #6a3c39);--jkl-color-error-border-strong:light-dark(#4a0d0d, #fcd9d9)}@supports not (color:light-dark(#000,#fff)){[data-brand=dnb]{--jkl-color-background-page:#f8f8f8;--jkl-color-background-container:#fff;--jkl-color-background-container-accent:#d8f3ec;--jkl-color-background-contrast:#007272;--jkl-color-text-default:#333;--jkl-color-text-subdued:#6b6b6b;--jkl-color-text-accent:#14555a;--jkl-color-text-on-contrast:#fff;--jkl-color-border-default:#007272;--jkl-color-border-subdued:#ccc;--jkl-color-border-strong:#007272;--jkl-color-warning-background-page:#f3f0ed;--jkl-color-warning-background-container:#eed9c3;--jkl-color-warning-background-container-accent:#e4bc8a;--jkl-color-warning-background-contrast:#d3770b;--jkl-color-warning-text-default:#522e04;--jkl-color-warning-text-subdued:#636060;--jkl-color-warning-text-accent:#d3770b;--jkl-color-warning-text-on-contrast:#fff;--jkl-color-warning-border-default:#d3770b;--jkl-color-warning-border-subdued:#e4bc8a;--jkl-color-warning-border-strong:#522e04;--jkl-color-success-background-page:#f3f0ed;--jkl-color-success-background-container:#d2e9cb;--jkl-color-success-background-container-accent:#b7cfaf;--jkl-color-success-background-contrast:#24753a;--jkl-color-success-text-default:#0a430d;--jkl-color-success-text-subdued:#636060;--jkl-color-success-text-accent:#24753a;--jkl-color-success-text-on-contrast:#fff;--jkl-color-success-border-default:#24753a;--jkl-color-success-border-subdued:#b7cfaf;--jkl-color-success-border-strong:#0a430d;--jkl-color-info-background-page:#f3f0ed;--jkl-color-info-background-container:#d3d3f6;--jkl-color-info-background-container-accent:#b5b5eb;--jkl-color-info-background-contrast:#4646d1;--jkl-color-info-text-default:#111145;--jkl-color-info-text-subdued:#636060;--jkl-color-info-text-accent:#4646d1;--jkl-color-info-text-on-contrast:#fff;--jkl-color-info-border-default:#4646d1;--jkl-color-info-border-subdued:#b5b5eb;--jkl-color-info-border-strong:#111145;--jkl-color-error-background-page:#f3f0ed;--jkl-color-error-background-container:#f0d6d6;--jkl-color-error-background-container-accent:#e4b7b6;--jkl-color-error-background-contrast:#b32424;--jkl-color-error-text-default:#4a0d0d;--jkl-color-error-text-subdued:#636060;--jkl-color-error-text-accent:#b32424;--jkl-color-error-text-on-contrast:#fff;--jkl-color-error-border-default:#b32424;--jkl-color-error-border-subdued:#e4b7b6;--jkl-color-error-border-strong:#4a0d0d}}}@layer jokul.theme{@font-face{font-family:DNB Sans;font-display:fallback;font-weight:400;font-style:normal;src:url(/fonts/brands/dnb/DNB-Regular.woff2) format("woff2")}@font-face{font-family:DNB Sans;font-display:fallback;font-weight:500;font-style:normal;src:url(/fonts/brands/dnb/DNB-Medium.woff2) format("woff2")}@font-face{font-family:DNB Mono;font-display:fallback;font-weight:400;font-style:normal;src:url(/fonts/brands/dnb/DNBMono-Regular.woff2) format("woff2")}[data-brand=dnb]{--jkl-font-family-regular:"DNB Sans", sans-serif;--jkl-font-family-display:"DNB Sans", sans-serif;--jkl-font-family-mono:"DNB Mono", "Adjusted Courier New Fallback", -apple-system, blinkmacsystemfont, monospace;--jkl-font-family-icons:"Jokul Icons", "Jokul Icons Fallback", monospace;--jkl-font-weight-normal:400;--jkl-font-weight-bold:500}}@layer jokul.global{@supports (font:-apple-system-body){@media (pointer:coarse){:root{font:-apple-system-body}}}.jkl{--jkl-background-color:var(--jkl-color-background-page);--jkl-color:var(--jkl-color-text-default);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--jkl-background-color);color:var(--jkl-color);font-family:var(--jkl-font-family-regular);font-weight:var(--jkl-font-weight-normal)}.jkl strong{font-weight:var(--jkl-font-weight-bold)}.jkl a,.jkl button:not(:disabled){cursor:pointer}@media screen and (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:0s!important;animation-delay:0s!important;transition:none!important}}}@layer jokul.global{[popover]{opacity:0}@supports (overlay:auto){[popover]{transition:opacity,overlay allow-discrete,display allow-discrete;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive)}}[popover]:popover-open{opacity:1}@starting-style{[popover]:popover-open{opacity:0}}@supports not (overlay:auto){[popover]:popover-open{transition:opacity;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive)}}}@layer jokul.utility{.jkl-body,.jkl-bold{font:var(--jkl-text-style-paragraph-medium)}.jkl-bold{font-weight:var(--jkl-font-weight-bold)}.jkl-small{font:var(--jkl-text-style-paragraph-small)}.jkl-title{font:var(--jkl-text-style-title)}.jkl-title-small{font:var(--jkl-text-style-title-small)}.jkl-heading-1{font:var(--jkl-text-style-heading-1)}.jkl-heading-2{font:var(--jkl-text-style-heading-2)}.jkl-heading-3{font:var(--jkl-text-style-heading-3)}.jkl-heading-4{font:var(--jkl-text-style-heading-4)}.jkl-heading-5{font:var(--jkl-text-style-heading-5)}.jkl-paragraph-large{font:var(--jkl-text-style-paragraph-large)}.jkl-paragraph-medium{font:var(--jkl-text-style-paragraph-medium)}.jkl-paragraph-small{font:var(--jkl-text-style-paragraph-small)}.jkl-text-large{font:var(--jkl-text-style-text-large)}.jkl-text-medium{font:var(--jkl-text-style-text-medium)}.jkl-text-small{font:var(--jkl-text-style-text-small)}.jkl-text-micro{font:var(--jkl-text-style-text-micro)}.jkl-sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important;white-space:nowrap!important}}@layer jokul.utility{.jkl-sr-only--focusable:active,.jkl-sr-only--focusable:focus{clip:auto!important;-webkit-clip-path:none!important;clip-path:none!important;height:auto!important;margin:auto!important;overflow:visible!important;width:auto!important;white-space:normal!important}}@layer jokul.utility{.jkl-spacing-2--all{margin:var(--jkl-spacing-2)}.jkl-spacing-2--top{margin-top:var(--jkl-spacing-2)}.jkl-spacing-2--bottom{margin-bottom:var(--jkl-spacing-2)}.jkl-spacing-2--left{margin-left:var(--jkl-spacing-2)}.jkl-spacing-2--right{margin-right:var(--jkl-spacing-2)}.jkl-spacing-4--all{margin:var(--jkl-spacing-4)}.jkl-spacing-4--top{margin-top:var(--jkl-spacing-4)}.jkl-spacing-4--bottom{margin-bottom:var(--jkl-spacing-4)}.jkl-spacing-4--left{margin-left:var(--jkl-spacing-4)}.jkl-spacing-4--right{margin-right:var(--jkl-spacing-4)}.jkl-spacing-8--all{margin:var(--jkl-spacing-8)}.jkl-spacing-8--top{margin-top:var(--jkl-spacing-8)}.jkl-spacing-8--bottom{margin-bottom:var(--jkl-spacing-8)}.jkl-spacing-8--left{margin-left:var(--jkl-spacing-8)}.jkl-spacing-8--right{margin-right:var(--jkl-spacing-8)}.jkl-spacing-12--all{margin:var(--jkl-spacing-12)}.jkl-spacing-12--top{margin-top:var(--jkl-spacing-12)}.jkl-spacing-12--bottom{margin-bottom:var(--jkl-spacing-12)}.jkl-spacing-12--left{margin-left:var(--jkl-spacing-12)}.jkl-spacing-12--right{margin-right:var(--jkl-spacing-12)}.jkl-spacing-16--all{margin:var(--jkl-spacing-16)}.jkl-spacing-16--top{margin-top:var(--jkl-spacing-16)}.jkl-spacing-16--bottom{margin-bottom:var(--jkl-spacing-16)}.jkl-spacing-16--left{margin-left:var(--jkl-spacing-16)}.jkl-spacing-16--right{margin-right:var(--jkl-spacing-16)}.jkl-spacing-24--all{margin:var(--jkl-spacing-24)}.jkl-spacing-24--top{margin-top:var(--jkl-spacing-24)}.jkl-spacing-24--bottom{margin-bottom:var(--jkl-spacing-24)}.jkl-spacing-24--left{margin-left:var(--jkl-spacing-24)}.jkl-spacing-24--right{margin-right:var(--jkl-spacing-24)}.jkl-spacing-32--all{margin:var(--jkl-spacing-32)}.jkl-spacing-32--top{margin-top:var(--jkl-spacing-32)}.jkl-spacing-32--bottom{margin-bottom:var(--jkl-spacing-32)}.jkl-spacing-32--left{margin-left:var(--jkl-spacing-32)}.jkl-spacing-32--right{margin-right:var(--jkl-spacing-32)}.jkl-spacing-40--all{margin:var(--jkl-spacing-40)}.jkl-spacing-40--top{margin-top:var(--jkl-spacing-40)}.jkl-spacing-40--bottom{margin-bottom:var(--jkl-spacing-40)}.jkl-spacing-40--left{margin-left:var(--jkl-spacing-40)}.jkl-spacing-40--right{margin-right:var(--jkl-spacing-40)}.jkl-spacing-64--all{margin:var(--jkl-spacing-64)}.jkl-spacing-64--top{margin-top:var(--jkl-spacing-64)}.jkl-spacing-64--bottom{margin-bottom:var(--jkl-spacing-64)}.jkl-spacing-64--left{margin-left:var(--jkl-spacing-64)}.jkl-spacing-64--right{margin-right:var(--jkl-spacing-64)}.jkl-spacing-104--all{margin:var(--jkl-spacing-104)}.jkl-spacing-104--top{margin-top:var(--jkl-spacing-104)}.jkl-spacing-104--bottom{margin-bottom:var(--jkl-spacing-104)}.jkl-spacing-104--left{margin-left:var(--jkl-spacing-104)}.jkl-spacing-104--right{margin-right:var(--jkl-spacing-104)}.jkl-spacing-168--all{margin:var(--jkl-spacing-168)}.jkl-spacing-168--top{margin-top:var(--jkl-spacing-168)}.jkl-spacing-168--bottom{margin-bottom:var(--jkl-spacing-168)}.jkl-spacing-168--left{margin-left:var(--jkl-spacing-168)}.jkl-spacing-168--right{margin-right:var(--jkl-spacing-168)}.jkl-spacing-16-24--all{margin:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--top{margin-top:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--bottom{margin-bottom:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--left{margin-left:var(--jkl-spacing-16-24)}.jkl-spacing-16-24--right{margin-right:var(--jkl-spacing-16-24)}.jkl-spacing-24-40--all{margin:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--top{margin-top:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--bottom{margin-bottom:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--left{margin-left:var(--jkl-spacing-24-40)}.jkl-spacing-24-40--right{margin-right:var(--jkl-spacing-24-40)}.jkl-spacing-24-32--all{margin:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--top{margin-top:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--bottom{margin-bottom:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--left{margin-left:var(--jkl-spacing-24-32)}.jkl-spacing-24-32--right{margin-right:var(--jkl-spacing-24-32)}.jkl-spacing-32-40--all{margin:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--top{margin-top:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--bottom{margin-bottom:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--left{margin-left:var(--jkl-spacing-32-40)}.jkl-spacing-32-40--right{margin-right:var(--jkl-spacing-32-40)}.jkl-spacing-40-64--all{margin:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--top{margin-top:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--bottom{margin-bottom:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--left{margin-left:var(--jkl-spacing-40-64)}.jkl-spacing-40-64--right{margin-right:var(--jkl-spacing-40-64)}.jkl-spacing-64-104--all{margin:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--top{margin-top:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--bottom{margin-bottom:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--left{margin-left:var(--jkl-spacing-64-104)}.jkl-spacing-64-104--right{margin-right:var(--jkl-spacing-64-104)}.jkl-spacing-104-168--all{margin:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--top{margin-top:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--bottom{margin-bottom:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--left{margin-left:var(--jkl-spacing-104-168)}.jkl-spacing-104-168--right{margin-right:var(--jkl-spacing-104-168)}.jkl-spacing-16-16-24--all{margin:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--top{margin-top:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--bottom{margin-bottom:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--left{margin-left:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-16-24--right{margin-right:var(--jkl-spacing-16-16-24)}.jkl-spacing-16-24-32--all{margin:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--top{margin-top:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--bottom{margin-bottom:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--left{margin-left:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-32--right{margin-right:var(--jkl-spacing-16-24-32)}.jkl-spacing-16-24-40--all{margin:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--top{margin-top:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--bottom{margin-bottom:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--left{margin-left:var(--jkl-spacing-16-24-40)}.jkl-spacing-16-24-40--right{margin-right:var(--jkl-spacing-16-24-40)}.jkl-spacing-24-24-32--all{margin:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--top{margin-top:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--bottom{margin-bottom:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--left{margin-left:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-32--right{margin-right:var(--jkl-spacing-24-24-32)}.jkl-spacing-24-24-40--all{margin:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--top{margin-top:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--bottom{margin-bottom:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--left{margin-left:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-24-40--right{margin-right:var(--jkl-spacing-24-24-40)}.jkl-spacing-24-32-40--all{margin:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--top{margin-top:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--bottom{margin-bottom:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--left{margin-left:var(--jkl-spacing-24-32-40)}.jkl-spacing-24-32-40--right{margin-right:var(--jkl-spacing-24-32-40)}.jkl-spacing-32-32-40--all{margin:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--top{margin-top:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--bottom{margin-bottom:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--left{margin-left:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-32-40--right{margin-right:var(--jkl-spacing-32-32-40)}.jkl-spacing-32-40-64--all{margin:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--top{margin-top:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--bottom{margin-bottom:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--left{margin-left:var(--jkl-spacing-32-40-64)}.jkl-spacing-32-40-64--right{margin-right:var(--jkl-spacing-32-40-64)}.jkl-spacing-40-40-64--all{margin:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--top{margin-top:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--bottom{margin-bottom:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--left{margin-left:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-40-64--right{margin-right:var(--jkl-spacing-40-40-64)}.jkl-spacing-40-64-104--all{margin:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--top{margin-top:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--bottom{margin-bottom:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--left{margin-left:var(--jkl-spacing-40-64-104)}.jkl-spacing-40-64-104--right{margin-right:var(--jkl-spacing-40-64-104)}.jkl-spacing-64-64-104--all{margin:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--top{margin-top:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--bottom{margin-bottom:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--left{margin-left:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-64-104--right{margin-right:var(--jkl-spacing-64-64-104)}.jkl-spacing-64-104-168--all{margin:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--top{margin-top:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--bottom{margin-bottom:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--left{margin-left:var(--jkl-spacing-64-104-168)}.jkl-spacing-64-104-168--right{margin-right:var(--jkl-spacing-64-104-168)}.jkl-spacing-104-104-168--all{margin:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--top{margin-top:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--bottom{margin-bottom:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--left{margin-left:var(--jkl-spacing-104-104-168)}.jkl-spacing-104-104-168--right{margin-right:var(--jkl-spacing-104-104-168)}.jkl-spacing-0--all{margin:var(--jkl-spacing-0)}.jkl-spacing-0--top{margin-top:var(--jkl-spacing-0)}.jkl-spacing-0--bottom{margin-bottom:var(--jkl-spacing-0)}.jkl-spacing-0--left{margin-left:var(--jkl-spacing-0)}.jkl-spacing-0--right{margin-right:var(--jkl-spacing-0)}.jkl-spacing-none--all{margin:var(--jkl-spacing-none)}.jkl-spacing-none--top{margin-top:var(--jkl-spacing-none)}.jkl-spacing-none--bottom{margin-bottom:var(--jkl-spacing-none)}.jkl-spacing-none--left{margin-left:var(--jkl-spacing-none)}.jkl-spacing-none--right{margin-right:var(--jkl-spacing-none)}.jkl-spacing-2xs--all{margin:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--top{margin-top:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--bottom{margin-bottom:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--left{margin-left:var(--jkl-spacing-2xs)}.jkl-spacing-2xs--right{margin-right:var(--jkl-spacing-2xs)}.jkl-spacing-xs--all{margin:var(--jkl-spacing-xs)}.jkl-spacing-xs--top{margin-top:var(--jkl-spacing-xs)}.jkl-spacing-xs--bottom{margin-bottom:var(--jkl-spacing-xs)}.jkl-spacing-xs--left{margin-left:var(--jkl-spacing-xs)}.jkl-spacing-xs--right{margin-right:var(--jkl-spacing-xs)}.jkl-spacing-s--all{margin:var(--jkl-spacing-s)}.jkl-spacing-s--top{margin-top:var(--jkl-spacing-s)}.jkl-spacing-s--bottom{margin-bottom:var(--jkl-spacing-s)}.jkl-spacing-s--left{margin-left:var(--jkl-spacing-s)}.jkl-spacing-s--right{margin-right:var(--jkl-spacing-s)}.jkl-spacing-m--all{margin:var(--jkl-spacing-m)}.jkl-spacing-m--top{margin-top:var(--jkl-spacing-m)}.jkl-spacing-m--bottom{margin-bottom:var(--jkl-spacing-m)}.jkl-spacing-m--left{margin-left:var(--jkl-spacing-m)}.jkl-spacing-m--right{margin-right:var(--jkl-spacing-m)}.jkl-spacing-l--all{margin:var(--jkl-spacing-l)}.jkl-spacing-l--top{margin-top:var(--jkl-spacing-l)}.jkl-spacing-l--bottom{margin-bottom:var(--jkl-spacing-l)}.jkl-spacing-l--left{margin-left:var(--jkl-spacing-l)}.jkl-spacing-l--right{margin-right:var(--jkl-spacing-l)}.jkl-spacing-xl--all{margin:var(--jkl-spacing-xl)}.jkl-spacing-xl--top{margin-top:var(--jkl-spacing-xl)}.jkl-spacing-xl--bottom{margin-bottom:var(--jkl-spacing-xl)}.jkl-spacing-xl--left{margin-left:var(--jkl-spacing-xl)}.jkl-spacing-xl--right{margin-right:var(--jkl-spacing-xl)}.jkl-spacing-2xl--all{margin:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--top{margin-top:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--bottom{margin-bottom:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--left{margin-left:var(--jkl-spacing-2xl)}.jkl-spacing-2xl--right{margin-right:var(--jkl-spacing-2xl)}}@layer jokul.utility{:is(ul,ol):is(.jkl-list-reset){list-style-type:none;margin:0;padding:0}}
@@ -97,7 +97,7 @@
97
97
  outline-offset: 3px;
98
98
  }
99
99
  .jkl-button:hover {
100
- background-color: color-mix(in srgb, var(--background-color), var(--text-color) 15%);
100
+ background-color: color-mix(in srgb, var(--background-color, transparent), var(--hover-accent-color, var(--jkl-color-background-contrast)) var(--jkl-opacity-hover, 10%));
101
101
  }
102
102
  @media (forced-colors: active) {
103
103
  .jkl-button:hover {
@@ -111,6 +111,7 @@
111
111
  .jkl-button--primary {
112
112
  --background-color: var(--jkl-color-background-contrast);
113
113
  --text-color: var(--jkl-color-text-on-contrast);
114
+ --hover-accent-color: var(--jkl-color-text-on-contrast);
114
115
  }
115
116
  @media (forced-colors: active) {
116
117
  .jkl-button--primary {
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-button{--jkl-button-font-size:var(--jkl-typography-body-base-font-size);--jkl-button-line-height:var(--jkl-typography-body-base-line-height);--jkl-button-padding-block:var(--jkl-unit-10);--jkl-button-padding-text:var(--jkl-unit-30);--jkl-button-padding-icon:var(--jkl-unit-20);--jkl-button-padding-icon-button:var(--jkl-unit-10);--jkl-button-tertiary-padding-icon:var(--jkl-unit-05);--jkl-button-text-ink-offset:0.1em;--jkl-icon-weight:var(--jkl-icon-weight-bold);--text-color:var(--jkl-color-text-default);--background-color:transparent;--border-radius:0;--border-width:0.0625rem;display:inline-block;font:var(--jkl-text-style-text-medium);font-weight:var(--jkl-font-weight-bold);-webkit-user-select:none;user-select:none;background:var(--background-color);color:var(--text-color);border:unset;text-decoration:none;-webkit-tap-highlight-color:transparent;border-radius:var(--border-radius);padding-inline:var(--jkl-button-padding-text);padding-block:var(--jkl-button-padding-block);position:relative;overflow:hidden;max-width:100%;animation:a .3s linear;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:background-color}.jkl-button:has(.jkl-button__text){min-width:var(--button-min-width,9ch)}.jkl-button:has(.jkl-button__text):has(.jkl-icon){min-width:auto}.jkl-button:has(.jkl-icon:first-child){-webkit-padding-start:var(--jkl-button-padding-icon);padding-inline-start:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:last-child){-webkit-padding-end:var(--jkl-button-padding-icon);padding-inline-end:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:first-child):has(.jkl-icon:last-child){padding-inline:var(--jkl-button-padding-icon-button)}.jkl-button__label{transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-expressive);transition-property:translate;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--jkl-unit-02);pointer-events:none}.jkl-button__loader{transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-expressive);transition-property:opacity,translate;position:absolute;top:50%;left:50%;translate:-50% 350%;opacity:0;pointer-events:none}.jkl-button__text{display:block;min-width:0;max-width:100%;-webkit-padding-before:var(--jkl-button-text-ink-offset);padding-block-start:var(--jkl-button-text-ink-offset);-webkit-margin-before:calc(var(--jkl-button-text-ink-offset)*-1);margin-block-start:calc(var(--jkl-button-text-ink-offset)*-1);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.jkl-button[data-loading=true] .jkl-button__label{--button-loading-offset:calc(-100% - var(--jkl-button-padding-block)*2 - var(--jkl-button-text-ink-offset));translate:0 var(--button-loading-offset)}.jkl-button[data-loading=true] .jkl-button__loader{translate:-50% -50%;opacity:1}.jkl-button:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-button:hover{background-color:color-mix(in srgb,var(--background-color),var(--text-color) 15%)}@media (forced-colors:active){.jkl-button:hover{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}}.jkl-button--ghost,.jkl-button--primary,.jkl-button--secondary{--border-radius:999px}.jkl-button--primary{--background-color:var(--jkl-color-background-contrast);--text-color:var(--jkl-color-text-on-contrast)}@media (forced-colors:active){.jkl-button--primary{border:calc(var(--border-width)*2) solid Highlight}}.jkl-button--secondary{border:var(--border-width) solid var(--text-color)}.jkl-button--tertiary{border-bottom:var(--border-width) solid var(--text-color);padding-inline:var(--jkl-button-tertiary-padding-icon)}.jkl-button--tertiary:has(.jkl-icon:first-child){padding-inline:var(--jkl-button-tertiary-padding-icon) calc(var(--jkl-button-tertiary-padding-icon)*2)}.jkl-button--tertiary:has(.jkl-icon:last-child){padding-inline:calc(var(--jkl-button-tertiary-padding-icon)*2) var(--jkl-button-tertiary-padding-icon)}}
1
+ @layer jokul.components{.jkl-button{--jkl-button-font-size:var(--jkl-typography-body-base-font-size);--jkl-button-line-height:var(--jkl-typography-body-base-line-height);--jkl-button-padding-block:var(--jkl-unit-10);--jkl-button-padding-text:var(--jkl-unit-30);--jkl-button-padding-icon:var(--jkl-unit-20);--jkl-button-padding-icon-button:var(--jkl-unit-10);--jkl-button-tertiary-padding-icon:var(--jkl-unit-05);--jkl-button-text-ink-offset:0.1em;--jkl-icon-weight:var(--jkl-icon-weight-bold);--text-color:var(--jkl-color-text-default);--background-color:transparent;--border-radius:0;--border-width:0.0625rem;display:inline-block;font:var(--jkl-text-style-text-medium);font-weight:var(--jkl-font-weight-bold);-webkit-user-select:none;user-select:none;background:var(--background-color);color:var(--text-color);border:unset;text-decoration:none;-webkit-tap-highlight-color:transparent;border-radius:var(--border-radius);padding-inline:var(--jkl-button-padding-text);padding-block:var(--jkl-button-padding-block);position:relative;overflow:hidden;max-width:100%;animation:a .3s linear;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:background-color}.jkl-button:has(.jkl-button__text){min-width:var(--button-min-width,9ch)}.jkl-button:has(.jkl-button__text):has(.jkl-icon){min-width:auto}.jkl-button:has(.jkl-icon:first-child){-webkit-padding-start:var(--jkl-button-padding-icon);padding-inline-start:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:last-child){-webkit-padding-end:var(--jkl-button-padding-icon);padding-inline-end:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:first-child):has(.jkl-icon:last-child){padding-inline:var(--jkl-button-padding-icon-button)}.jkl-button__label{transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-expressive);transition-property:translate;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--jkl-unit-02);pointer-events:none}.jkl-button__loader{transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-expressive);transition-property:opacity,translate;position:absolute;top:50%;left:50%;translate:-50% 350%;opacity:0;pointer-events:none}.jkl-button__text{display:block;min-width:0;max-width:100%;-webkit-padding-before:var(--jkl-button-text-ink-offset);padding-block-start:var(--jkl-button-text-ink-offset);-webkit-margin-before:calc(var(--jkl-button-text-ink-offset)*-1);margin-block-start:calc(var(--jkl-button-text-ink-offset)*-1);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.jkl-button[data-loading=true] .jkl-button__label{--button-loading-offset:calc(-100% - var(--jkl-button-padding-block)*2 - var(--jkl-button-text-ink-offset));translate:0 var(--button-loading-offset)}.jkl-button[data-loading=true] .jkl-button__loader{translate:-50% -50%;opacity:1}.jkl-button:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-button:hover{background-color:color-mix(in srgb,var(--background-color,transparent),var(--hover-accent-color,var(--jkl-color-background-contrast)) var(--jkl-opacity-hover,10%))}@media (forced-colors:active){.jkl-button:hover{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}}.jkl-button--ghost,.jkl-button--primary,.jkl-button--secondary{--border-radius:999px}.jkl-button--primary{--background-color:var(--jkl-color-background-contrast);--text-color:var(--jkl-color-text-on-contrast);--hover-accent-color:var(--jkl-color-text-on-contrast)}@media (forced-colors:active){.jkl-button--primary{border:calc(var(--border-width)*2) solid Highlight}}.jkl-button--secondary{border:var(--border-width) solid var(--text-color)}.jkl-button--tertiary{border-bottom:var(--border-width) solid var(--text-color);padding-inline:var(--jkl-button-tertiary-padding-icon)}.jkl-button--tertiary:has(.jkl-icon:first-child){padding-inline:var(--jkl-button-tertiary-padding-icon) calc(var(--jkl-button-tertiary-padding-icon)*2)}.jkl-button--tertiary:has(.jkl-icon:last-child){padding-inline:calc(var(--jkl-button-tertiary-padding-icon)*2) var(--jkl-button-tertiary-padding-icon)}}
@@ -115,9 +115,7 @@
115
115
  }
116
116
 
117
117
  &:hover {
118
- background-color: color-mix(in srgb,
119
- var(--background-color),
120
- var(--text-color) 15%);
118
+ @include jkl.hover-bg;
121
119
 
122
120
  @media (forced-colors: active) {
123
121
  @include jkl.focus-outline;
@@ -133,6 +131,7 @@
133
131
  &--primary {
134
132
  --background-color: var(--jkl-color-background-contrast);
135
133
  --text-color: var(--jkl-color-text-on-contrast);
134
+ --hover-accent-color: var(--jkl-color-text-on-contrast);
136
135
 
137
136
  @media (forced-colors: active) {
138
137
  border: calc(var(--border-width) * 2) solid Highlight;
@@ -99,4 +99,19 @@
99
99
  .jkl-checkbox--inline:not(:last-of-type) {
100
100
  margin-right: var(--jkl-unit-30);
101
101
  }
102
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) {
103
+ opacity: var(--jkl-nested-disabled-opacity, 0.5);
104
+ cursor: not-allowed;
105
+ }
106
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) * {
107
+ --jkl-nested-disabled-opacity: 1;
108
+ cursor: not-allowed;
109
+ }
110
+ @media screen and (forced-colors: active) {
111
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) {
112
+ opacity: 1;
113
+ color: GrayText;
114
+ border-color: GrayText;
115
+ }
116
+ }
102
117
  }
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-checkbox{--text-color:var(--jkl-color-text-default);--icon-color:var(--jkl-color-background-contrast);--background-color:transparent;font:var(--jkl-text-style-text-medium);display:flex;flex-wrap:wrap;color:var(--text-color);position:relative}.jkl-checkbox__input{position:absolute;inset-block-start:0;inset-inline-start:0;block-size:1lh;inline-size:1lh;margin:0;padding:0;cursor:pointer;z-index:1;-webkit-appearance:none;appearance:none;background:transparent;border:0;outline:0;border-style:none;outline-style:none}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-checkbox__input{outline:revert;border-style:revert;outline-style:revert}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:revert;outline-style:revert}}.jkl-checkbox__label{color:var(--text-color);cursor:pointer;display:flex;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:color}.jkl-checkbox__label:before{color:var(--icon-color);content:"check_box_outline_blank"/"";-webkit-margin-end:.25em;margin-inline-end:.25em;font-family:var(--jkl-font-family-icons);font-variation-settings:"FILL" var(--jkl-icon-fill,0);font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:1.3em;font-weight:400;line-height:1;display:inline-block;flex-shrink:0;-webkit-font-smoothing:antialiased;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-energetic);transition-property:font-variation-settings,transform}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label:before{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-checkbox__input:is(:hover,:active)+.jkl-checkbox__label,.jkl-checkbox__label:active,.jkl-checkbox__label:hover{--jkl-icon-weight:var(--jkl-font-weight-bold)}.jkl-checkbox__input:checked+.jkl-checkbox__label:before{content:"check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label:before{content:"indeterminate_check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input[aria-invalid=true]+.jkl-checkbox__label:before{color:var(--jkl-color-error-background-contrast)}.jkl-checkbox+.jkl-checkbox{margin-top:.75em}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:var(--jkl-unit-30)}}
1
+ @layer jokul.components{.jkl-checkbox{--text-color:var(--jkl-color-text-default);--icon-color:var(--jkl-color-background-contrast);--background-color:transparent;font:var(--jkl-text-style-text-medium);display:flex;flex-wrap:wrap;color:var(--text-color);position:relative}.jkl-checkbox__input{position:absolute;inset-block-start:0;inset-inline-start:0;block-size:1lh;inline-size:1lh;margin:0;padding:0;cursor:pointer;z-index:1;-webkit-appearance:none;appearance:none;background:transparent;border:0;outline:0;border-style:none;outline-style:none}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-checkbox__input{outline:revert;border-style:revert;outline-style:revert}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:revert;outline-style:revert}}.jkl-checkbox__label{color:var(--text-color);cursor:pointer;display:flex;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:color}.jkl-checkbox__label:before{color:var(--icon-color);content:"check_box_outline_blank"/"";-webkit-margin-end:.25em;margin-inline-end:.25em;font-family:var(--jkl-font-family-icons);font-variation-settings:"FILL" var(--jkl-icon-fill,0);font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:1.3em;font-weight:400;line-height:1;display:inline-block;flex-shrink:0;-webkit-font-smoothing:antialiased;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-energetic);transition-property:font-variation-settings,transform}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label:before{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-checkbox__input:is(:hover,:active)+.jkl-checkbox__label,.jkl-checkbox__label:active,.jkl-checkbox__label:hover{--jkl-icon-weight:var(--jkl-font-weight-bold)}.jkl-checkbox__input:checked+.jkl-checkbox__label:before{content:"check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label:before{content:"indeterminate_check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input[aria-invalid=true]+.jkl-checkbox__label:before{color:var(--jkl-color-error-background-contrast)}.jkl-checkbox+.jkl-checkbox{margin-top:.75em}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:var(--jkl-unit-30)}.jkl-checkbox:has(>.jkl-checkbox__input:disabled){opacity:var(--jkl-nested-disabled-opacity,.5);cursor:not-allowed}.jkl-checkbox:has(>.jkl-checkbox__input:disabled) *{--jkl-nested-disabled-opacity:1;cursor:not-allowed}@media screen and (forced-colors:active){.jkl-checkbox:has(>.jkl-checkbox__input:disabled){opacity:1;color:GrayText;border-color:GrayText}}}
@@ -89,4 +89,8 @@
89
89
  }
90
90
  }
91
91
  }
92
+
93
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) {
94
+ @include jkl.disabled-control;
95
+ }
92
96
  }
@@ -83,6 +83,23 @@
83
83
  --outer-border-thickness: 0.125rem;
84
84
  cursor: pointer;
85
85
  }
86
+ .jkl-input-panel:has(.jkl-input-panel__header input:disabled) {
87
+ --outer-border-color: var(--jkl-color-border-default);
88
+ --outer-border-thickness: 0.0625rem;
89
+ opacity: var(--jkl-nested-disabled-opacity, 0.5);
90
+ cursor: not-allowed;
91
+ }
92
+ .jkl-input-panel:has(.jkl-input-panel__header input:disabled) * {
93
+ --jkl-nested-disabled-opacity: 1;
94
+ cursor: not-allowed;
95
+ }
96
+ @media screen and (forced-colors: active) {
97
+ .jkl-input-panel:has(.jkl-input-panel__header input:disabled) {
98
+ opacity: 1;
99
+ color: GrayText;
100
+ border-color: GrayText;
101
+ }
102
+ }
86
103
  }
87
104
  @layer jokul.components {
88
105
  .jkl-checkbox {
@@ -182,6 +199,21 @@
182
199
  .jkl-checkbox--inline:not(:last-of-type) {
183
200
  margin-right: var(--jkl-unit-30);
184
201
  }
202
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) {
203
+ opacity: var(--jkl-nested-disabled-opacity, 0.5);
204
+ cursor: not-allowed;
205
+ }
206
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) * {
207
+ --jkl-nested-disabled-opacity: 1;
208
+ cursor: not-allowed;
209
+ }
210
+ @media screen and (forced-colors: active) {
211
+ .jkl-checkbox:has(> .jkl-checkbox__input:disabled) {
212
+ opacity: 1;
213
+ color: GrayText;
214
+ border-color: GrayText;
215
+ }
216
+ }
185
217
  }
186
218
  @layer jokul.components {
187
219
  .jkl-checkbox-panel .jkl-checkbox {
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-input-panel{--outer-border-color:var(--jkl-color-border-default);--outer-border-thickness:0.0625rem;--background-color:transparent;--padding-inline:var(--jkl-unit-25);box-shadow:inset 0 0 0 var(--outer-border-thickness) var(--outer-border-color);border-radius:var(--jkl-border-radius-s);background-color:var(--background-color);display:flex;flex-direction:column;interpolate-size:allow-keywords;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:box-shadow}.jkl-input-panel__header{display:grid;grid-template-columns:1fr -webkit-max-content;grid-template-columns:1fr max-content;align-items:center;gap:.5rem;cursor:pointer;position:relative;padding:var(--jkl-unit-20) var(--padding-inline)}.jkl-input-panel__header .jkl-checkbox,.jkl-input-panel__header .jkl-radio-button{grid-column:1/-1;grid-row:1}.jkl-input-panel__header label{inline-size:100%}.jkl-input-panel__header label:after{content:"";position:absolute;inset:0}.jkl-input-panel__header .jkl-checkbox,.jkl-input-panel__header .jkl-radio-button,.jkl-input-panel__header label{position:unset}.jkl-input-panel__header input[type=checkbox],.jkl-input-panel__header input[type=radio]{inset-block-start:var(--jkl-unit-20);inset-inline-start:var(--padding-inline)}.jkl-input-panel__header__amount{display:flex;height:100%;align-items:center;grid-column:2;grid-row:1;justify-self:end;pointer-events:none;position:relative;z-index:1;font:var(--jkl-text-style-text-medium);font-weight:var(--jkl-font-weight-bold)}.jkl-input-panel__description{padding-inline:var(--padding-inline);-webkit-padding-after:var(--jkl-unit-20);padding-block-end:var(--jkl-unit-20);line-height:normal;font:var(--jkl-text-style-paragraph-medium)}.jkl-input-panel:has(:focus-visible){outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-input-panel:has(:checked){--background-color:var(--jkl-color-background-container)}.jkl-input-panel:has(input[aria-invalid=true]){--outer-border-color:var(--jkl-color-error-border-default)}.jkl-input-panel:has(input:hover){--outer-border-color:var(--jkl-color-border-strong);--outer-border-thickness:0.125rem;cursor:pointer}}@layer jokul.components{.jkl-checkbox{--text-color:var(--jkl-color-text-default);--icon-color:var(--jkl-color-background-contrast);--background-color:transparent;font:var(--jkl-text-style-text-medium);display:flex;flex-wrap:wrap;color:var(--text-color);position:relative}.jkl-checkbox__input{position:absolute;inset-block-start:0;inset-inline-start:0;block-size:1lh;inline-size:1lh;margin:0;padding:0;cursor:pointer;z-index:1;-webkit-appearance:none;appearance:none;background:transparent;border:0;outline:0;border-style:none;outline-style:none}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-checkbox__input{outline:revert;border-style:revert;outline-style:revert}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:revert;outline-style:revert}}.jkl-checkbox__label{color:var(--text-color);cursor:pointer;display:flex;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:color}.jkl-checkbox__label:before{color:var(--icon-color);content:"check_box_outline_blank"/"";-webkit-margin-end:.25em;margin-inline-end:.25em;font-family:var(--jkl-font-family-icons);font-variation-settings:"FILL" var(--jkl-icon-fill,0);font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:1.3em;font-weight:400;line-height:1;display:inline-block;flex-shrink:0;-webkit-font-smoothing:antialiased;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-energetic);transition-property:font-variation-settings,transform}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label:before{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-checkbox__input:is(:hover,:active)+.jkl-checkbox__label,.jkl-checkbox__label:active,.jkl-checkbox__label:hover{--jkl-icon-weight:var(--jkl-font-weight-bold)}.jkl-checkbox__input:checked+.jkl-checkbox__label:before{content:"check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label:before{content:"indeterminate_check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input[aria-invalid=true]+.jkl-checkbox__label:before{color:var(--jkl-color-error-background-contrast)}.jkl-checkbox+.jkl-checkbox{margin-top:.75em}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:var(--jkl-unit-30)}}@layer jokul.components{.jkl-checkbox-panel .jkl-checkbox{-webkit-margin-start:-.1em;margin-inline-start:-.1em}.jkl-checkbox-panel .jkl-checkbox__input:focus-visible+.jkl-checkbox__label:before{outline:none}}
1
+ @layer jokul.components{.jkl-input-panel{--outer-border-color:var(--jkl-color-border-default);--outer-border-thickness:0.0625rem;--background-color:transparent;--padding-inline:var(--jkl-unit-25);box-shadow:inset 0 0 0 var(--outer-border-thickness) var(--outer-border-color);border-radius:var(--jkl-border-radius-s);background-color:var(--background-color);display:flex;flex-direction:column;interpolate-size:allow-keywords;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:box-shadow}.jkl-input-panel__header{display:grid;grid-template-columns:1fr -webkit-max-content;grid-template-columns:1fr max-content;align-items:center;gap:.5rem;cursor:pointer;position:relative;padding:var(--jkl-unit-20) var(--padding-inline)}.jkl-input-panel__header .jkl-checkbox,.jkl-input-panel__header .jkl-radio-button{grid-column:1/-1;grid-row:1}.jkl-input-panel__header label{inline-size:100%}.jkl-input-panel__header label:after{content:"";position:absolute;inset:0}.jkl-input-panel__header .jkl-checkbox,.jkl-input-panel__header .jkl-radio-button,.jkl-input-panel__header label{position:unset}.jkl-input-panel__header input[type=checkbox],.jkl-input-panel__header input[type=radio]{inset-block-start:var(--jkl-unit-20);inset-inline-start:var(--padding-inline)}.jkl-input-panel__header__amount{display:flex;height:100%;align-items:center;grid-column:2;grid-row:1;justify-self:end;pointer-events:none;position:relative;z-index:1;font:var(--jkl-text-style-text-medium);font-weight:var(--jkl-font-weight-bold)}.jkl-input-panel__description{padding-inline:var(--padding-inline);-webkit-padding-after:var(--jkl-unit-20);padding-block-end:var(--jkl-unit-20);line-height:normal;font:var(--jkl-text-style-paragraph-medium)}.jkl-input-panel:has(:focus-visible){outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-input-panel:has(:checked){--background-color:var(--jkl-color-background-container)}.jkl-input-panel:has(input[aria-invalid=true]){--outer-border-color:var(--jkl-color-error-border-default)}.jkl-input-panel:has(input:hover){--outer-border-color:var(--jkl-color-border-strong);--outer-border-thickness:0.125rem;cursor:pointer}.jkl-input-panel:has(.jkl-input-panel__header input:disabled){--outer-border-color:var(--jkl-color-border-default);--outer-border-thickness:0.0625rem;opacity:var(--jkl-nested-disabled-opacity,.5);cursor:not-allowed}.jkl-input-panel:has(.jkl-input-panel__header input:disabled) *{--jkl-nested-disabled-opacity:1;cursor:not-allowed}@media screen and (forced-colors:active){.jkl-input-panel:has(.jkl-input-panel__header input:disabled){opacity:1;color:GrayText;border-color:GrayText}}}@layer jokul.components{.jkl-checkbox{--text-color:var(--jkl-color-text-default);--icon-color:var(--jkl-color-background-contrast);--background-color:transparent;font:var(--jkl-text-style-text-medium);display:flex;flex-wrap:wrap;color:var(--text-color);position:relative}.jkl-checkbox__input{position:absolute;inset-block-start:0;inset-inline-start:0;block-size:1lh;inline-size:1lh;margin:0;padding:0;cursor:pointer;z-index:1;-webkit-appearance:none;appearance:none;background:transparent;border:0;outline:0;border-style:none;outline-style:none}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-checkbox__input{outline:revert;border-style:revert;outline-style:revert}.jkl-checkbox__input:active,.jkl-checkbox__input:focus,.jkl-checkbox__input:hover{outline:revert;outline-style:revert}}.jkl-checkbox__label{color:var(--text-color);cursor:pointer;display:flex;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:color}.jkl-checkbox__label:before{color:var(--icon-color);content:"check_box_outline_blank"/"";-webkit-margin-end:.25em;margin-inline-end:.25em;font-family:var(--jkl-font-family-icons);font-variation-settings:"FILL" var(--jkl-icon-fill,0);font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:1.3em;font-weight:400;line-height:1;display:inline-block;flex-shrink:0;-webkit-font-smoothing:antialiased;transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-energetic);transition-property:font-variation-settings,transform}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label:before{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-checkbox__input:is(:hover,:active)+.jkl-checkbox__label,.jkl-checkbox__label:active,.jkl-checkbox__label:hover{--jkl-icon-weight:var(--jkl-font-weight-bold)}.jkl-checkbox__input:checked+.jkl-checkbox__label:before{content:"check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label:before{content:"indeterminate_check_box"/"";--jkl-icon-fill:1}.jkl-checkbox__input[aria-invalid=true]+.jkl-checkbox__label:before{color:var(--jkl-color-error-background-contrast)}.jkl-checkbox+.jkl-checkbox{margin-top:.75em}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:var(--jkl-unit-30)}.jkl-checkbox:has(>.jkl-checkbox__input:disabled){opacity:var(--jkl-nested-disabled-opacity,.5);cursor:not-allowed}.jkl-checkbox:has(>.jkl-checkbox__input:disabled) *{--jkl-nested-disabled-opacity:1;cursor:not-allowed}@media screen and (forced-colors:active){.jkl-checkbox:has(>.jkl-checkbox__input:disabled){opacity:1;color:GrayText;border-color:GrayText}}}@layer jokul.components{.jkl-checkbox-panel .jkl-checkbox{-webkit-margin-start:-.1em;margin-inline-start:-.1em}.jkl-checkbox-panel .jkl-checkbox__input:focus-visible+.jkl-checkbox__label:before{outline:none}}
@@ -24,6 +24,9 @@
24
24
  gap: var(--gap);
25
25
  padding: 0 var(--padding-inline);
26
26
  min-height: var(--height);
27
+ transition-timing-function: var(--jkl-motion-easing-standard);
28
+ transition-duration: var(--jkl-motion-timing-productive);
29
+ transition-property: background-color;
27
30
  }
28
31
  @media screen and (forced-colors: active) {
29
32
  .jkl-chip {
@@ -31,27 +34,17 @@
31
34
  border-bottom-style: dotted;
32
35
  }
33
36
  }
34
- .jkl-chip::after {
35
- content: "";
36
- opacity: 0;
37
- position: absolute;
38
- inset: 0;
39
- border-radius: inherit;
40
- background-color: var(--text-color);
41
- transition-timing-function: var(--jkl-motion-easing-standard);
42
- transition-duration: var(--jkl-motion-timing-productive);
43
- transition-property: opacity;
44
- }
45
37
  .jkl-chip:focus-visible {
46
38
  outline: 3px solid var(--jkl-color-border-strong);
47
39
  outline-offset: 3px;
48
40
  }
49
- .jkl-chip:hover::after {
50
- opacity: 0.15;
41
+ .jkl-chip:hover {
42
+ background-color: color-mix(in srgb, var(--background-color, transparent), var(--hover-accent-color, var(--jkl-color-background-contrast)) var(--jkl-opacity-hover, 10%));
51
43
  }
52
44
  .jkl-chip--filter[aria-pressed=true] {
53
45
  --background-color: var(--jkl-color-background-contrast);
54
46
  --text-color: var(--jkl-color-text-on-contrast);
47
+ --hover-accent-color: var(--jkl-color-text-on-contrast);
55
48
  --border-color: var(--jkl-color-border-strong);
56
49
  }
57
50
  @media screen and (forced-colors: active) {
@@ -1 +1 @@
1
- .jkl-chip{--padding-inline:var(--jkl-unit-15);--padding-icon:var(--jkl-unit-10);--height:var(--jkl-unit-40);--gap:var(--jkl-unit-05);--text-color:var(--jkl-color-text-default);--border-color:var(--jkl-color-border-subdued);--background-color:var(--jkl-color-background-container);--border-width:0.0625rem;font:var(--jkl-text-style-text-small);font-weight:var(--jkl-font-weight-bold);position:relative;background-color:var(--background-color);color:var(--text-color);border:var(--border-width) solid var(--border-color);border-radius:99999px;display:inline-flex;align-items:center;text-align:initial;white-space:nowrap;gap:var(--gap);padding:0 var(--padding-inline);min-height:var(--height)}@media screen and (forced-colors:active){.jkl-chip{border:2px CanvasText;border-style:none none dotted}}.jkl-chip:after{content:"";opacity:0;position:absolute;inset:0;border-radius:inherit;background-color:var(--text-color);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:opacity}.jkl-chip:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-chip:hover:after{opacity:.15}.jkl-chip--filter[aria-pressed=true]{--background-color:var(--jkl-color-background-contrast);--text-color:var(--jkl-color-text-on-contrast);--border-color:var(--jkl-color-border-strong)}@media screen and (forced-colors:active){.jkl-chip--filter[aria-pressed=true]{forced-color-adjust:none;--background-color:CanvasText;--text-color:Canvas}}.jkl-chip:has(.jkl-icon){-webkit-padding-end:var(--padding-icon);padding-inline-end:var(--padding-icon)}
1
+ .jkl-chip{--padding-inline:var(--jkl-unit-15);--padding-icon:var(--jkl-unit-10);--height:var(--jkl-unit-40);--gap:var(--jkl-unit-05);--text-color:var(--jkl-color-text-default);--border-color:var(--jkl-color-border-subdued);--background-color:var(--jkl-color-background-container);--border-width:0.0625rem;font:var(--jkl-text-style-text-small);font-weight:var(--jkl-font-weight-bold);position:relative;background-color:var(--background-color);color:var(--text-color);border:var(--border-width) solid var(--border-color);border-radius:99999px;display:inline-flex;align-items:center;text-align:initial;white-space:nowrap;gap:var(--gap);padding:0 var(--padding-inline);min-height:var(--height);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:background-color}@media screen and (forced-colors:active){.jkl-chip{border:2px CanvasText;border-style:none none dotted}}.jkl-chip:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-chip:hover{background-color:color-mix(in srgb,var(--background-color,transparent),var(--hover-accent-color,var(--jkl-color-background-contrast)) var(--jkl-opacity-hover,10%))}.jkl-chip--filter[aria-pressed=true]{--background-color:var(--jkl-color-background-contrast);--text-color:var(--jkl-color-text-on-contrast);--hover-accent-color:var(--jkl-color-text-on-contrast);--border-color:var(--jkl-color-border-strong)}@media screen and (forced-colors:active){.jkl-chip--filter[aria-pressed=true]{forced-color-adjust:none;--background-color:CanvasText;--text-color:Canvas}}.jkl-chip:has(.jkl-icon){-webkit-padding-end:var(--padding-icon);padding-inline-end:var(--padding-icon)}
@@ -28,36 +28,26 @@
28
28
  padding: 0 var(--padding-inline);
29
29
  min-height: var(--height);
30
30
 
31
+ @include jkl.motion("standard", "productive", background-color);
32
+
31
33
  @include jkl.forced-colors-mode {
32
34
  border: 2px none CanvasText;
33
35
  border-bottom-style: dotted;
34
36
  }
35
37
 
36
- &::after {
37
- content: "";
38
- opacity: 0;
39
- position: absolute;
40
- inset: 0;
41
- border-radius: inherit;
42
- background-color: var(--text-color);
43
-
44
- @include jkl.motion("standard", "productive", opacity);
45
- }
46
-
47
38
  &:focus-visible {
48
39
  @include jkl.focus-outline;
49
40
  }
50
41
 
51
42
  &:hover {
52
- &::after {
53
- opacity: 0.15;
54
- }
43
+ @include jkl.hover-bg;
55
44
  }
56
45
 
57
46
  &--filter {
58
47
  &[aria-pressed="true"] {
59
48
  --background-color: var(--jkl-color-background-contrast);
60
49
  --text-color: var(--jkl-color-text-on-contrast);
50
+ --hover-accent-color: var(--jkl-color-text-on-contrast);
61
51
  --border-color: var(--jkl-color-border-strong);
62
52
 
63
53
  @include jkl.forced-colors-mode {
@@ -96,6 +96,31 @@
96
96
  border: 0.125rem solid ButtonText;
97
97
  }
98
98
  }
99
+ .jkl-combobox__wrapper:has(> :is(input, textarea):disabled) {
100
+ opacity: var(--jkl-nested-disabled-opacity, 0.5);
101
+ cursor: not-allowed;
102
+ }
103
+ .jkl-combobox__wrapper:has(> :is(input, textarea):disabled) * {
104
+ --jkl-nested-disabled-opacity: 1;
105
+ cursor: not-allowed;
106
+ }
107
+ @media screen and (forced-colors: active) {
108
+ .jkl-combobox__wrapper:has(> :is(input, textarea):disabled) {
109
+ opacity: 1;
110
+ color: GrayText;
111
+ border-color: GrayText;
112
+ }
113
+ }
114
+ .jkl-combobox__wrapper:has(> :is(input, textarea):read-only:not(:disabled)) {
115
+ --border-color: var(--jkl-color-border-subdued);
116
+ --background-color: transparent;
117
+ cursor: default;
118
+ }
119
+ .jkl-combobox__wrapper:has(> :is(input, textarea):read-only:not(:disabled)):hover, .jkl-combobox__wrapper:has(> :is(input, textarea):read-only:not(:disabled)):focus-within, .jkl-combobox__wrapper:has(> :is(input, textarea):read-only:not(:disabled)):has([data-focused=true]) {
120
+ --border-color: var(--jkl-color-border-subdued);
121
+ --background-color: transparent;
122
+ box-shadow: inset 0 0 0 0.0625rem var(--border-color), 0 0 0 0.0625rem transparent;
123
+ }
99
124
  html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(.jkl-text-input__input:focus-visible), html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(.jkl-text-area__text-area:focus-visible) {
100
125
  outline: 3px solid var(--jkl-color-border-strong);
101
126
  outline-offset: 3px;
@@ -154,6 +179,26 @@
154
179
  .jkl-combobox__wrapper:hover ~ .jkl-combobox__arrow {
155
180
  transform: translateY(calc(-50% + 0.1875rem));
156
181
  }
182
+ .jkl-combobox__wrapper:has(.jkl-combobox__search-input:disabled) {
183
+ opacity: var(--jkl-nested-disabled-opacity, 0.5);
184
+ cursor: not-allowed;
185
+ }
186
+ .jkl-combobox__wrapper:has(.jkl-combobox__search-input:disabled) * {
187
+ --jkl-nested-disabled-opacity: 1;
188
+ cursor: not-allowed;
189
+ }
190
+ @media screen and (forced-colors: active) {
191
+ .jkl-combobox__wrapper:has(.jkl-combobox__search-input:disabled) {
192
+ opacity: 1;
193
+ color: GrayText;
194
+ border-color: GrayText;
195
+ }
196
+ }
197
+ .jkl-combobox__wrapper:has(.jkl-combobox__search-input:read-only:not(:disabled)) {
198
+ --border-color: var(--jkl-color-border-subdued);
199
+ --background-color: transparent;
200
+ cursor: default;
201
+ }
157
202
  .jkl-combobox__search-input {
158
203
  border: none;
159
204
  outline: none;
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-combobox{--jkl-combobox-button-padding:var(--jkl-unit-10);--jkl-combobox-button-active-value-padding:var(--jkl-unit-10) var(--jkl-unit-05) var(--jkl-unit-5) var(--jkl-unit-10);--jkl-combobox-input-height:3rem;--jkl-combobox-actions-right:var(--jkl-unit-10);--jkl-combobox-actions-top:var(--jkl-unit-05);--jkl-combobox-chips-gap:var(--jkl-unit-05);--jkl-combobox-search-input-padding:var(--jkl-combobox-button-padding);--jkl-combobox-native-padding:0 var(--jkl-unit-50) 0 var(--jkl-unit-10);--jkl-combobox-option-padding:var(--jkl-unit-10);--jkl-combobox-option-height:min(var(--jkl-unit-60), 3rem);--jkl-combobox-search-input-height:1.75rem}@media (width >= 0) and (max-width:679px){.jkl-combobox{--jkl-combobox-input-height:2.75rem}}.jkl-combobox{position:relative;outline:0;border-style:none;outline-style:none}.jkl-combobox:active,.jkl-combobox:focus,.jkl-combobox:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-combobox{outline:revert;border-style:revert;outline-style:revert}.jkl-combobox:active,.jkl-combobox:focus,.jkl-combobox:hover{outline:revert;outline-style:revert}}.jkl-combobox .jkl-combobox__option:focus{outline:none}.jkl-combobox__wrapper{gap:1ch;cursor:pointer;--jkl-text-input-padding:var(--jkl-text-input-vertical-padding) var(--jkl-text-input-horizontal-padding);--jkl-text-input-vertical-padding:var(--jkl-unit-15);--jkl-text-input-horizontal-padding:var(--jkl-unit-15);--jkl-text-input-action-button-size:var(--jkl-unit-60);--jkl-text-input-action-button-icon-size:var(--jkl-unit-30);--jkl-text-input-action-button-padding:var(--jkl-unit-10) 0;--jkl-text-input-action-button-focus-position:var(--jkl-unit-05);--text-color:var(--jkl-color-text-default);--background-color:transparent;--border-color:var(--jkl-color-border-default);--placeholder-color:var(--jkl-color-text-subdued);border-radius:var(--jkl-border-radius-s);box-sizing:border-box;max-width:100%;position:relative;display:flex;align-items:center;font:var(--jkl-text-style-text-medium);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:color,box-shadow,background-color;background-color:var(--background-color);color:var(--text-color);box-shadow:inset 0 0 0 .0625rem var(--border-color),0 0 0 .0625rem transparent}.jkl-combobox__wrapper:focus-within,.jkl-combobox__wrapper:has([data-focused=true]){--background-color:var(--jkl-color-background-container)}.jkl-combobox__wrapper[data-invalid=true]:not(:focus-within):not(:has([data-focused=true])){--text-color:var(--jkl-color-error-text-default);--border-color:var(--jkl-color-error-border-default);--placeholder-color:var(--jkl-color-error-text-subdued)}.jkl-combobox__wrapper:focus-within,.jkl-combobox__wrapper:has([data-focused=true]),.jkl-combobox__wrapper:hover{--border-color:var(--jkl-color-border-strong);box-shadow:inset 0 0 0 .0625rem var(--border-color),0 0 0 .0625rem var(--border-color)}@media screen and (forced-colors:active){.jkl-combobox__wrapper:focus-within,.jkl-combobox__wrapper:has([data-focused=true]),.jkl-combobox__wrapper:hover{border:.125rem solid ButtonText}}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(.jkl-text-area__text-area:focus-visible),html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(.jkl-text-input__input:focus-visible){outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-combobox__wrapper>.jkl-icon-button:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:-8px}@media screen and (forced-colors:active){.jkl-combobox__wrapper>.jkl-icon-button:focus-visible{--border-color:ButtonText}}.jkl-combobox__wrapper>.jkl-text-input-action-button{flex-shrink:0;display:flex;box-sizing:border-box;align-items:center;justify-content:center;padding:var(--jkl-text-input-action-button-padding);height:var(--jkl-text-input-action-button-size);width:var(--jkl-text-input-action-button-size);-webkit-margin-start:calc(var(--jkl-text-input-horizontal-padding)*-1);margin-inline-start:calc(var(--jkl-text-input-horizontal-padding)*-1)}.jkl-combobox__wrapper>.jkl-text-input-action-button .jkl-icon-button__icon{height:var(--jkl-text-input-action-button-icon-size);width:var(--jkl-text-input-action-button-icon-size)}.jkl-combobox__wrapper>.jkl-text-input-action-button:hover{color:var(--jkl-color-text-subdued)}@media screen and (forced-colors:active){.jkl-combobox__wrapper>.jkl-text-input-action-button:hover{border:.125rem inset ButtonText}}@media screen and (forced-colors:active){.jkl-combobox__wrapper{border:.125rem inset ButtonText}}.jkl-combobox__wrapper--active-value .jkl-combobox__chips{padding:.46875rem}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(:focus-visible){outline:3px solid var(--jkl-color-border-strong);outline-offset:3px;background-color:var(--jkl-color-background-container)}.jkl-combobox__wrapper:has(.jkl-icon-button:focus-visible){outline:none}.jkl-combobox__wrapper:hover~.jkl-combobox__arrow{transform:translateY(calc(-50% + .1875rem))}.jkl-combobox__search-input{border:none;outline:none;padding:0;flex:1 1 1ch;min-width:0;max-height:var(--jkl-combobox-search-input-height);background:none;-webkit-appearance:none;color:inherit;font:var(--jkl-text-style-text-medium);outline:0;border-style:none;outline-style:none}.jkl-combobox__search-input:active,.jkl-combobox__search-input:focus,.jkl-combobox__search-input:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-combobox__search-input{outline:revert;border-style:revert;outline-style:revert}.jkl-combobox__search-input:active,.jkl-combobox__search-input:focus,.jkl-combobox__search-input:hover{outline:revert;outline-style:revert}}.jkl-combobox__search-input input[type=number]::-webkit-inner-spin-button,.jkl-combobox__search-input input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.jkl-combobox__search-input input[type=number]{-moz-appearance:textfield}@media screen and (forced-colors:active){.jkl-combobox__search-input{outline:none;border:none}.jkl-combobox__search-input:focus-visible{outline:none}}.jkl-combobox__search-input::placeholder{opacity:1;color:var(--placeholder-color)}.jkl-combobox__arrow{pointer-events:none;transform:translateY(-50%);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:transform,color}@media screen and (forced-colors:active){.jkl-combobox__arrow,.jkl-combobox__arrow path,.jkl-combobox__arrow svg{stroke:CanvasText;fill:CanvasText}}.jkl-combobox__menu{transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:height;top:calc(100% - 1px);overflow-y:auto;position:absolute;z-index:7000;left:-.0625rem;right:-.0625rem;background-color:var(--jkl-color-background-container);border:.125rem solid var(--jkl-color-border-strong);border-radius:0 0 .1875rem .1875rem;box-sizing:border-box;max-height:calc((var(--jkl-combobox-max-shown-options, 5) + .5)*var(--jkl-combobox-input-height))}.jkl-combobox__option{font:var(--jkl-text-style-text-small);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);display:flex;align-items:center;border:0;color:var(--jkl-color-text-default);background-color:transparent;transition-property:color,background-color;min-height:var(--jkl-combobox-option-height);padding:var(--jkl-combobox-option-padding);width:100%;text-align:left}.jkl-combobox__option:focus,.jkl-combobox__option:hover{background-color:var(--jkl-color-background-container-accent)}.jkl-combobox__option-description{font:var(--jkl-text-style-text-small);color:var(--jkl-color-text-subdued);display:block;width:100%}.jkl-combobox__option--selected{justify-content:space-between}.jkl-combobox__no-option{padding:var(--jkl-combobox-option-padding)}.jkl-combobox__chips{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;gap:var(--jkl-combobox-chips-gap);min-width:0;box-sizing:border-box;padding:var(--jkl-text-input-padding)}.jkl-combobox__chips .jkl-chip{white-space:break-spaces}.jkl-combobox__chips .jkl-chip .jkl-tooltip-trigger{font-weight:700}.jkl-combobox--invalid .jkl-combobox__button,.jkl-combobox--invalid .jkl-combobox__search-input,.jkl-combobox--invalid .jkl-combobox__wrapper{color:var(--jkl-color-error-text-default)}.jkl-combobox--menu-closed .jkl-combobox__search-input{position:absolute;background-color:transparent;width:94%;padding-right:0}.jkl-combobox--menu-open .jkl-combobox__wrapper{border-bottom-left-radius:0;border-bottom-right-radius:0}.jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions{transform:translateY(-.1875rem)}.jkl-combobox--menu-open .jkl-combobox__search-input{cursor:text}}
1
+ @layer jokul.components{.jkl-combobox{--jkl-combobox-button-padding:var(--jkl-unit-10);--jkl-combobox-button-active-value-padding:var(--jkl-unit-10) var(--jkl-unit-05) var(--jkl-unit-5) var(--jkl-unit-10);--jkl-combobox-input-height:3rem;--jkl-combobox-actions-right:var(--jkl-unit-10);--jkl-combobox-actions-top:var(--jkl-unit-05);--jkl-combobox-chips-gap:var(--jkl-unit-05);--jkl-combobox-search-input-padding:var(--jkl-combobox-button-padding);--jkl-combobox-native-padding:0 var(--jkl-unit-50) 0 var(--jkl-unit-10);--jkl-combobox-option-padding:var(--jkl-unit-10);--jkl-combobox-option-height:min(var(--jkl-unit-60), 3rem);--jkl-combobox-search-input-height:1.75rem}@media (width >= 0) and (max-width:679px){.jkl-combobox{--jkl-combobox-input-height:2.75rem}}.jkl-combobox{position:relative;outline:0;border-style:none;outline-style:none}.jkl-combobox:active,.jkl-combobox:focus,.jkl-combobox:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-combobox{outline:revert;border-style:revert;outline-style:revert}.jkl-combobox:active,.jkl-combobox:focus,.jkl-combobox:hover{outline:revert;outline-style:revert}}.jkl-combobox .jkl-combobox__option:focus{outline:none}.jkl-combobox__wrapper{gap:1ch;cursor:pointer;--jkl-text-input-padding:var(--jkl-text-input-vertical-padding) var(--jkl-text-input-horizontal-padding);--jkl-text-input-vertical-padding:var(--jkl-unit-15);--jkl-text-input-horizontal-padding:var(--jkl-unit-15);--jkl-text-input-action-button-size:var(--jkl-unit-60);--jkl-text-input-action-button-icon-size:var(--jkl-unit-30);--jkl-text-input-action-button-padding:var(--jkl-unit-10) 0;--jkl-text-input-action-button-focus-position:var(--jkl-unit-05);--text-color:var(--jkl-color-text-default);--background-color:transparent;--border-color:var(--jkl-color-border-default);--placeholder-color:var(--jkl-color-text-subdued);border-radius:var(--jkl-border-radius-s);box-sizing:border-box;max-width:100%;position:relative;display:flex;align-items:center;font:var(--jkl-text-style-text-medium);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:color,box-shadow,background-color;background-color:var(--background-color);color:var(--text-color);box-shadow:inset 0 0 0 .0625rem var(--border-color),0 0 0 .0625rem transparent}.jkl-combobox__wrapper:focus-within,.jkl-combobox__wrapper:has([data-focused=true]){--background-color:var(--jkl-color-background-container)}.jkl-combobox__wrapper[data-invalid=true]:not(:focus-within):not(:has([data-focused=true])){--text-color:var(--jkl-color-error-text-default);--border-color:var(--jkl-color-error-border-default);--placeholder-color:var(--jkl-color-error-text-subdued)}.jkl-combobox__wrapper:focus-within,.jkl-combobox__wrapper:has([data-focused=true]),.jkl-combobox__wrapper:hover{--border-color:var(--jkl-color-border-strong);box-shadow:inset 0 0 0 .0625rem var(--border-color),0 0 0 .0625rem var(--border-color)}@media screen and (forced-colors:active){.jkl-combobox__wrapper:focus-within,.jkl-combobox__wrapper:has([data-focused=true]),.jkl-combobox__wrapper:hover{border:.125rem solid ButtonText}}.jkl-combobox__wrapper:has(>:is(input,textarea):disabled){opacity:var(--jkl-nested-disabled-opacity,.5);cursor:not-allowed}.jkl-combobox__wrapper:has(>:is(input,textarea):disabled) *{--jkl-nested-disabled-opacity:1;cursor:not-allowed}@media screen and (forced-colors:active){.jkl-combobox__wrapper:has(>:is(input,textarea):disabled){opacity:1;color:GrayText;border-color:GrayText}}.jkl-combobox__wrapper:has(>:is(input,textarea):read-only:not(:disabled)){--border-color:var(--jkl-color-border-subdued);--background-color:transparent;cursor:default}.jkl-combobox__wrapper:has(>:is(input,textarea):read-only:not(:disabled)):focus-within,.jkl-combobox__wrapper:has(>:is(input,textarea):read-only:not(:disabled)):has([data-focused=true]),.jkl-combobox__wrapper:has(>:is(input,textarea):read-only:not(:disabled)):hover{--border-color:var(--jkl-color-border-subdued);--background-color:transparent;box-shadow:inset 0 0 0 .0625rem var(--border-color),0 0 0 .0625rem transparent}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(.jkl-text-area__text-area:focus-visible),html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(.jkl-text-input__input:focus-visible){outline:3px solid var(--jkl-color-border-strong);outline-offset:3px}.jkl-combobox__wrapper>.jkl-icon-button:focus-visible{outline:3px solid var(--jkl-color-border-strong);outline-offset:-8px}@media screen and (forced-colors:active){.jkl-combobox__wrapper>.jkl-icon-button:focus-visible{--border-color:ButtonText}}.jkl-combobox__wrapper>.jkl-text-input-action-button{flex-shrink:0;display:flex;box-sizing:border-box;align-items:center;justify-content:center;padding:var(--jkl-text-input-action-button-padding);height:var(--jkl-text-input-action-button-size);width:var(--jkl-text-input-action-button-size);-webkit-margin-start:calc(var(--jkl-text-input-horizontal-padding)*-1);margin-inline-start:calc(var(--jkl-text-input-horizontal-padding)*-1)}.jkl-combobox__wrapper>.jkl-text-input-action-button .jkl-icon-button__icon{height:var(--jkl-text-input-action-button-icon-size);width:var(--jkl-text-input-action-button-icon-size)}.jkl-combobox__wrapper>.jkl-text-input-action-button:hover{color:var(--jkl-color-text-subdued)}@media screen and (forced-colors:active){.jkl-combobox__wrapper>.jkl-text-input-action-button:hover{border:.125rem inset ButtonText}}@media screen and (forced-colors:active){.jkl-combobox__wrapper{border:.125rem inset ButtonText}}.jkl-combobox__wrapper--active-value .jkl-combobox__chips{padding:.46875rem}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(:focus-visible){outline:3px solid var(--jkl-color-border-strong);outline-offset:3px;background-color:var(--jkl-color-background-container)}.jkl-combobox__wrapper:has(.jkl-icon-button:focus-visible){outline:none}.jkl-combobox__wrapper:hover~.jkl-combobox__arrow{transform:translateY(calc(-50% + .1875rem))}.jkl-combobox__wrapper:has(.jkl-combobox__search-input:disabled){opacity:var(--jkl-nested-disabled-opacity,.5);cursor:not-allowed}.jkl-combobox__wrapper:has(.jkl-combobox__search-input:disabled) *{--jkl-nested-disabled-opacity:1;cursor:not-allowed}@media screen and (forced-colors:active){.jkl-combobox__wrapper:has(.jkl-combobox__search-input:disabled){opacity:1;color:GrayText;border-color:GrayText}}.jkl-combobox__wrapper:has(.jkl-combobox__search-input:read-only:not(:disabled)){--border-color:var(--jkl-color-border-subdued);--background-color:transparent;cursor:default}.jkl-combobox__search-input{border:none;outline:none;padding:0;flex:1 1 1ch;min-width:0;max-height:var(--jkl-combobox-search-input-height);background:none;-webkit-appearance:none;color:inherit;font:var(--jkl-text-style-text-medium);outline:0;border-style:none;outline-style:none}.jkl-combobox__search-input:active,.jkl-combobox__search-input:focus,.jkl-combobox__search-input:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-combobox__search-input{outline:revert;border-style:revert;outline-style:revert}.jkl-combobox__search-input:active,.jkl-combobox__search-input:focus,.jkl-combobox__search-input:hover{outline:revert;outline-style:revert}}.jkl-combobox__search-input input[type=number]::-webkit-inner-spin-button,.jkl-combobox__search-input input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.jkl-combobox__search-input input[type=number]{-moz-appearance:textfield}@media screen and (forced-colors:active){.jkl-combobox__search-input{outline:none;border:none}.jkl-combobox__search-input:focus-visible{outline:none}}.jkl-combobox__search-input::placeholder{opacity:1;color:var(--placeholder-color)}.jkl-combobox__arrow{pointer-events:none;transform:translateY(-50%);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:transform,color}@media screen and (forced-colors:active){.jkl-combobox__arrow,.jkl-combobox__arrow path,.jkl-combobox__arrow svg{stroke:CanvasText;fill:CanvasText}}.jkl-combobox__menu{transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);transition-property:height;top:calc(100% - 1px);overflow-y:auto;position:absolute;z-index:7000;left:-.0625rem;right:-.0625rem;background-color:var(--jkl-color-background-container);border:.125rem solid var(--jkl-color-border-strong);border-radius:0 0 .1875rem .1875rem;box-sizing:border-box;max-height:calc((var(--jkl-combobox-max-shown-options, 5) + .5)*var(--jkl-combobox-input-height))}.jkl-combobox__option{font:var(--jkl-text-style-text-small);transition-timing-function:var(--jkl-motion-easing-standard);transition-duration:var(--jkl-motion-timing-productive);display:flex;align-items:center;border:0;color:var(--jkl-color-text-default);background-color:transparent;transition-property:color,background-color;min-height:var(--jkl-combobox-option-height);padding:var(--jkl-combobox-option-padding);width:100%;text-align:left}.jkl-combobox__option:focus,.jkl-combobox__option:hover{background-color:var(--jkl-color-background-container-accent)}.jkl-combobox__option-description{font:var(--jkl-text-style-text-small);color:var(--jkl-color-text-subdued);display:block;width:100%}.jkl-combobox__option--selected{justify-content:space-between}.jkl-combobox__no-option{padding:var(--jkl-combobox-option-padding)}.jkl-combobox__chips{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;gap:var(--jkl-combobox-chips-gap);min-width:0;box-sizing:border-box;padding:var(--jkl-text-input-padding)}.jkl-combobox__chips .jkl-chip{white-space:break-spaces}.jkl-combobox__chips .jkl-chip .jkl-tooltip-trigger{font-weight:700}.jkl-combobox--invalid .jkl-combobox__button,.jkl-combobox--invalid .jkl-combobox__search-input,.jkl-combobox--invalid .jkl-combobox__wrapper{color:var(--jkl-color-error-text-default)}.jkl-combobox--menu-closed .jkl-combobox__search-input{position:absolute;background-color:transparent;width:94%;padding-right:0}.jkl-combobox--menu-open .jkl-combobox__wrapper{border-bottom-left-radius:0;border-bottom-right-radius:0}.jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions{transform:translateY(-.1875rem)}.jkl-combobox--menu-open .jkl-combobox__search-input{cursor:text}}
@@ -58,6 +58,17 @@
58
58
  &:hover ~ .jkl-combobox__arrow {
59
59
  transform: translateY(calc(-50% + #{jkl.rem(3px)}));
60
60
  }
61
+
62
+ // Søkefeltet ligger inne i __chips, så barnekombinatoren i `wrapper-styles`
63
+ // treffer ikke. Combobox må derfor koble på tilstandene selv.
64
+ &:has(.jkl-combobox__search-input:disabled) {
65
+ @include jkl.disabled-control;
66
+ }
67
+
68
+ // En disabled input er også `:read-only`, så den må ekskluderes eksplisitt.
69
+ &:has(.jkl-combobox__search-input:read-only:not(:disabled)) {
70
+ @include jkl.read-only-control;
71
+ }
61
72
  }
62
73
 
63
74
  &__search-input {
@@ -26,10 +26,10 @@
26
26
  }
27
27
  }
28
28
  .jkl-countdown__tracker {
29
- animation: jkl-downcount-uz28d5d var(--duration) linear forwards;
29
+ animation: jkl-downcount-uy563pg var(--duration) linear forwards;
30
30
  animation-play-state: var(--play-state, running);
31
31
  }
32
- @keyframes jkl-downcount-uz28d5d {
32
+ @keyframes jkl-downcount-uy563pg {
33
33
  from {
34
34
  width: 100%;
35
35
  }
@@ -1 +1 @@
1
- @layer jokul.components{.jkl-countdown{--track-color:var(--jkl-color-border-subdued);--bar-color:var(--jkl-color-border-strong);--bar-height:0.25rem;background-color:var(--track-color);border-radius:6.25rem;height:var(--bar-height);width:100%;overflow:hidden}.jkl-countdown__tracker{display:block;height:var(--bar-height);background-color:var(--bar-color)}@media screen and (forced-colors:active){.jkl-countdown{background-color:Canvas}.jkl-countdown__tracker{background-color:CanvasText}}.jkl-countdown__tracker{animation:jkl-downcount-uz28d5d var(--duration) linear forwards;animation-play-state:var(--play-state,running)}@keyframes jkl-downcount-uz28d5d{0%{width:100%}to{width:0}}}
1
+ @layer jokul.components{.jkl-countdown{--track-color:var(--jkl-color-border-subdued);--bar-color:var(--jkl-color-border-strong);--bar-height:0.25rem;background-color:var(--track-color);border-radius:6.25rem;height:var(--bar-height);width:100%;overflow:hidden}.jkl-countdown__tracker{display:block;height:var(--bar-height);background-color:var(--bar-color)}@media screen and (forced-colors:active){.jkl-countdown{background-color:Canvas}.jkl-countdown__tracker{background-color:CanvasText}}.jkl-countdown__tracker{animation:jkl-downcount-uy563pg var(--duration) linear forwards;animation-play-state:var(--play-state,running)}@keyframes jkl-downcount-uy563pg{0%{width:100%}to{width:0}}}