@fremtind/jokul 0.71.2 → 1.0.0

package/styles/components/card/card.css

@@ -1,255 +1,7 @@
-@charset "UTF-8";
 /**
  * Do not edit directly
  * Generated on Wed, 18 Dec 2024 12:25:37 GMT
  */
-:root,
-[data-layout-density=comfortable],
-[data-density=comfortable] {
-  --jkl-info-card-content-wrapper-gap: 1rem;
-  --jkl-info-card-title-font-size: var(--jkl-heading-2-font-size);
-  --jkl-info-card-title-line-height: var(--jkl-heading-2-line-height);
-  --jkl-info-card-title-font-weight: var(--jkl-heading-2-font-weight);
-  --jkl-info-card-content-font-size: var(--jkl-body-font-size);
-  --jkl-info-card-content-line-height: var(--jkl-body-line-height);
-  --jkl-info-card-content-font-weight: var(--jkl-body-font-weight);
-}
-
-[data-layout-density=compact],
-[data-density=compact] {
-  --jkl-info-card-content-wrapper-gap: 0.75rem;
-  --jkl-info-card-title-font-size: var(--jkl-heading-4-font-size);
-  --jkl-info-card-title-line-height: var(--jkl-heading-4-line-height);
-  --jkl-info-card-title-font-weight: 400;
-  --jkl-info-card-content-font-size: var(--jkl-small-font-size);
-  --jkl-info-card-content-line-height: var(--jkl-small-line-height);
-  --jkl-info-card-content-font-weight: var(--jkl-small-font-weight);
-}
-
-.jkl-info-card {
-  box-sizing: border-box;
-}
-.jkl-info-card__image {
-  width: 100%;
-  aspect-ratio: 3/2;
-}
-.jkl-info-card__title {
-  font-size: var(--jkl-info-card-title-font-size);
-  line-height: var(--jkl-info-card-title-line-height);
-  font-weight: var(--jkl-info-card-title-font-weight);
-}
-.jkl-info-card__content-wrapper {
-  font-size: var(--jkl-info-card-content-font-size);
-  line-height: var(--jkl-info-card-content-line-height);
-  font-weight: var(--jkl-info-card-content-font-weight);
-  gap: var(--jkl-info-card-content-wrapper-gap);
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-}
-@media screen and (forced-colors: active) {
-  .jkl-info-card {
-    border: 0.125rem solid CanvasText;
-  }
-}
-
-@media screen and (prefers-color-scheme: light) {
-  :root {
-    --jkl-nav-card-background: #ffffff;
-    --jkl-nav-card-shadow: 0 0.25rem 0.9375rem rgba(37, 42, 49, 0.1);
-    --jkl-nav-card-shadow--hover: 0 0.375rem 1.5625rem rgba(37, 42, 49, 0.12);
-    --jkl-nav-card-info-border-color: #c8c5c3;
-  }
-}
-[data-theme=light] {
-  --jkl-nav-card-background: #ffffff;
-  --jkl-nav-card-shadow: 0 0.25rem 0.9375rem rgba(37, 42, 49, 0.1);
-  --jkl-nav-card-shadow--hover: 0 0.375rem 1.5625rem rgba(37, 42, 49, 0.12);
-  --jkl-nav-card-info-border-color: #c8c5c3;
-}
-
-@media screen and (prefers-color-scheme: dark) {
-  :root {
-    --jkl-nav-card-background: #313030;
-    --jkl-nav-card-shadow: none;
-    --jkl-nav-card-shadow--hover: none;
-    --jkl-nav-card-info-border-color: #636060;
-  }
-}
-[data-theme=dark] {
-  --jkl-nav-card-background: #313030;
-  --jkl-nav-card-shadow: none;
-  --jkl-nav-card-shadow--hover: none;
-  --jkl-nav-card-info-border-color: #636060;
-}
-
-:root,
-[data-layout-density=comfortable],
-[data-density=comfortable] {
-  --jkl-nav-card-content-wrapper-gap: 1rem;
-  --jkl-nav-card-info-padding: 1.5rem 0 0 0;
-  --jkl-nav-card-link-font-size: var(--jkl-heading-2-font-size);
-  --jkl-nav-card-link-line-height: var(--jkl-heading-2-line-height);
-  --jkl-nav-card-link-font-weight: var(--jkl-heading-2-font-weight);
-  --jkl-nav-card-content-font-size: var(--jkl-body-font-size);
-  --jkl-nav-card-content-line-height: var(--jkl-body-line-height);
-  --jkl-nav-card-content-font-weight: var(--jkl-body-font-weight);
-}
-
-[data-layout-density=compact],
-[data-density=compact] {
-  --jkl-nav-card-info-padding: 0.75rem 0 0 0;
-  --jkl-nav-card-content-font-size: var(--jkl-small-font-size);
-  --jkl-nav-card-content-line-height: var(--jkl-small-line-height);
-  --jkl-nav-card-content-font-weight: var(--jkl-small-font-weight);
-}
-
-.jkl-nav-card {
-  display: block;
-  box-sizing: border-box;
-  transform: translate3d(0, 0, 0);
-  text-decoration: none;
-  color: var(--jkl-color);
-  outline: 0;
-  border-radius: 0.25rem;
-  overflow: hidden;
-  box-shadow: var(--jkl-nav-card-shadow);
-  background-color: var(--jkl-nav-card-background);
-  transition-timing-function: ease;
-  transition-duration: 150ms;
-  transition-property: box-shadow, transform;
-}
-.jkl-nav-card__image {
-  width: 100%;
-  aspect-ratio: 3/2;
-}
-.jkl-nav-card__content {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: var(--jkl-nav-card-content-wrapper-gap);
-  font-size: var(--jkl-nav-card-content-font-size);
-  line-height: var(--jkl-nav-card-content-line-height);
-  font-weight: var(--jkl-nav-card-content-font-weight);
-}
-.jkl-nav-card__link {
-  font-size: var(--jkl-nav-card-link-font-size);
-  line-height: var(--jkl-nav-card-link-line-height);
-  font-weight: var(--jkl-nav-card-link-font-weight);
-  box-sizing: border-box;
-  position: relative;
-}
-.jkl-nav-card__link::after {
-  content: "→";
-  content: "→"/"";
-  alt: " ";
-  display: inline;
-  margin-left: -0.2em;
-  padding-left: 0.35em;
-  padding-right: 0.35em;
-}
-.jkl-nav-card__link[target=_blank]::after, .jkl-nav-card__link--external::after {
-  content: "↗";
-  content: "↗"/"";
-  alt: " ";
-}
-.jkl-nav-card__description {
-  font-size: var(--jkl-nav-card-content-font-size);
-  line-height: var(--jkl-nav-card-content-line-height);
-  font-weight: var(--jkl-nav-card-content-font-weight);
-}
-.jkl-nav-card__info {
-  border-top: 0.0625rem solid var(--jkl-nav-card-info-border-color);
-  padding: var(--jkl-nav-card-info-padding);
-  font-size: 1rem;
-  line-height: 1.5rem;
-  font-weight: 400;
-  --jkl-icon-weight: 300;
-  --jkl-icon-size: 1.25rem;
-  --jkl-icon-opsz: 20;
-  width: 100%;
-}
-.jkl-nav-card__tag-wrapper {
-  display: flex;
-  gap: calc(var(--jkl-unit-10) * 1.5) calc(var(--jkl-unit-10) * 3);
-  flex-wrap: wrap;
-}
-.jkl-nav-card:hover {
-  box-shadow: var(--jkl-nav-card-shadow--hover);
-  transform: translate3d(0, -0.25rem, 0);
-}
-html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus {
-  outline: 0.125rem solid var(--jkl-color);
-}
-
-@media screen and (forced-colors: active) {
-  .jkl-nav-card {
-    outline: revert;
-    border: 0.125rem solid LinkText;
-  }
-}
-
-@media screen and (prefers-color-scheme: light) {
-  :root {
-    --jkl-task-card-background--highlighted: #ffffff;
-    --jkl-task-card-background--normal: #f9f9f9;
-    --jkl-task-card-background--subdued: #ece9e5;
-    --jkl-task-card-shadow: 0 0.25rem 0.75rem rgba(37, 42, 49, 0.03);
-  }
-}
-[data-theme=light] {
-  --jkl-task-card-background--highlighted: #ffffff;
-  --jkl-task-card-background--normal: #f9f9f9;
-  --jkl-task-card-background--subdued: #ece9e5;
-  --jkl-task-card-shadow: 0 0.25rem 0.75rem rgba(37, 42, 49, 0.03);
-}
-
-@media screen and (prefers-color-scheme: dark) {
-  :root {
-    --jkl-task-card-background--highlighted: #313030;
-    --jkl-task-card-background--normal: #313030;
-    --jkl-task-card-background--subdued: #000000;
-    --jkl-task-card-shadow: none;
-  }
-}
-[data-theme=dark] {
-  --jkl-task-card-background--highlighted: #313030;
-  --jkl-task-card-background--normal: #313030;
-  --jkl-task-card-background--subdued: #000000;
-  --jkl-task-card-shadow: none;
-}
-
-.jkl-task-card {
-  box-sizing: border-box;
-  border-radius: 0.25rem;
-  transition-timing-function: ease;
-  transition-duration: 150ms;
-  transition-property: background-color;
-}
-.jkl-task-card__content-wrapper {
-  display: block;
-}
-.jkl-task-card--hvit, .jkl-task-card--highlighted {
-  background-color: var(--jkl-task-card-background--highlighted);
-}
-.jkl-task-card--snohvit, .jkl-task-card--normal {
-  background-color: var(--jkl-task-card-background--normal);
-}
-.jkl-task-card--sand, .jkl-task-card--subdued {
-  background-color: var(--jkl-task-card-background--subdued);
-}
-.jkl-task-card--dis, .jkl-task-card--very-subdued {
-  background-color: var(--jkl-task-card-background--very-subdued);
-}
-.jkl-task-card--with-shadow {
-  box-shadow: var(--jkl-task-card-shadow);
-}
-@media screen and (forced-colors: active) {
-  .jkl-task-card {
-    border: 0.125rem solid CanvasText;
-  }
-}
-
 .jkl-card {
   --padding-s: var(--jkl-unit-05);
   --padding-m: var(--jkl-unit-15);

package/styles/components/card/card.min.css

@@ -1 +1 @@
-@charset "UTF-8";:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-info-card-content-wrapper-gap:1rem;--jkl-info-card-title-font-size:var(--jkl-heading-2-font-size);--jkl-info-card-title-line-height:var(--jkl-heading-2-line-height);--jkl-info-card-title-font-weight:var(--jkl-heading-2-font-weight);--jkl-info-card-content-font-size:var(--jkl-body-font-size);--jkl-info-card-content-line-height:var(--jkl-body-line-height);--jkl-info-card-content-font-weight:var(--jkl-body-font-weight)}[data-density=compact],[data-layout-density=compact]{--jkl-info-card-content-wrapper-gap:0.75rem;--jkl-info-card-title-font-size:var(--jkl-heading-4-font-size);--jkl-info-card-title-line-height:var(--jkl-heading-4-line-height);--jkl-info-card-title-font-weight:400;--jkl-info-card-content-font-size:var(--jkl-small-font-size);--jkl-info-card-content-line-height:var(--jkl-small-line-height);--jkl-info-card-content-font-weight:var(--jkl-small-font-weight)}.jkl-info-card{box-sizing:border-box}.jkl-info-card__image{aspect-ratio:3/2;width:100%}.jkl-info-card__title{font-size:var(--jkl-info-card-title-font-size);font-weight:var(--jkl-info-card-title-font-weight);line-height:var(--jkl-info-card-title-line-height)}.jkl-info-card__content-wrapper{align-items:flex-start;display:flex;flex-direction:column;font-size:var(--jkl-info-card-content-font-size);font-weight:var(--jkl-info-card-content-font-weight);gap:var(--jkl-info-card-content-wrapper-gap);line-height:var(--jkl-info-card-content-line-height)}@media screen and (forced-colors:active){.jkl-info-card{border:.125rem solid CanvasText}}@media screen and (prefers-color-scheme:light){:root{--jkl-nav-card-background:#fff;--jkl-nav-card-shadow:0 0.25rem 0.9375rem #252a311a;--jkl-nav-card-shadow--hover:0 0.375rem 1.5625rem #252a311f;--jkl-nav-card-info-border-color:#c8c5c3}}[data-theme=light]{--jkl-nav-card-background:#fff;--jkl-nav-card-shadow:0 0.25rem 0.9375rem #252a311a;--jkl-nav-card-shadow--hover:0 0.375rem 1.5625rem #252a311f;--jkl-nav-card-info-border-color:#c8c5c3}@media screen and (prefers-color-scheme:dark){:root{--jkl-nav-card-background:#313030;--jkl-nav-card-shadow:none;--jkl-nav-card-shadow--hover:none;--jkl-nav-card-info-border-color:#636060}}[data-theme=dark]{--jkl-nav-card-background:#313030;--jkl-nav-card-shadow:none;--jkl-nav-card-shadow--hover:none;--jkl-nav-card-info-border-color:#636060}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-nav-card-content-wrapper-gap:1rem;--jkl-nav-card-info-padding:1.5rem 0 0 0;--jkl-nav-card-link-font-size:var(--jkl-heading-2-font-size);--jkl-nav-card-link-line-height:var(--jkl-heading-2-line-height);--jkl-nav-card-link-font-weight:var(--jkl-heading-2-font-weight);--jkl-nav-card-content-font-size:var(--jkl-body-font-size);--jkl-nav-card-content-line-height:var(--jkl-body-line-height);--jkl-nav-card-content-font-weight:var(--jkl-body-font-weight)}[data-density=compact],[data-layout-density=compact]{--jkl-nav-card-info-padding:0.75rem 0 0 0;--jkl-nav-card-content-font-size:var(--jkl-small-font-size);--jkl-nav-card-content-line-height:var(--jkl-small-line-height);--jkl-nav-card-content-font-weight:var(--jkl-small-font-weight)}.jkl-nav-card{background-color:var(--jkl-nav-card-background);border-radius:.25rem;box-shadow:var(--jkl-nav-card-shadow);box-sizing:border-box;color:var(--jkl-color);display:block;outline:0;overflow:hidden;text-decoration:none;transform:translateZ(0);transition-duration:.15s;transition-property:box-shadow,transform;transition-timing-function:ease}.jkl-nav-card__image{aspect-ratio:3/2;width:100%}.jkl-nav-card__content{align-items:flex-start;display:flex;flex-direction:column;font-size:var(--jkl-nav-card-content-font-size);font-weight:var(--jkl-nav-card-content-font-weight);gap:var(--jkl-nav-card-content-wrapper-gap);line-height:var(--jkl-nav-card-content-line-height)}.jkl-nav-card__link{box-sizing:border-box;font-size:var(--jkl-nav-card-link-font-size);font-weight:var(--jkl-nav-card-link-font-weight);line-height:var(--jkl-nav-card-link-line-height);position:relative}.jkl-nav-card__link:after{content:"→";content:"→"/"";alt:" ";display:inline;margin-left:-.2em;padding-left:.35em;padding-right:.35em}.jkl-nav-card__link--external:after,.jkl-nav-card__link[target=_blank]:after{content:"↗";content:"↗"/"";alt:" "}.jkl-nav-card__description{font-size:var(--jkl-nav-card-content-font-size);font-weight:var(--jkl-nav-card-content-font-weight);line-height:var(--jkl-nav-card-content-line-height)}.jkl-nav-card__info{border-top:.0625rem solid var(--jkl-nav-card-info-border-color);font-size:1rem;font-weight:400;line-height:1.5rem;padding:var(--jkl-nav-card-info-padding);--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;width:100%}.jkl-nav-card__tag-wrapper{display:flex;flex-wrap:wrap;gap:calc(var(--jkl-unit-10)*1.5) calc(var(--jkl-unit-10)*3)}.jkl-nav-card:hover{box-shadow:var(--jkl-nav-card-shadow--hover);transform:translate3d(0,-.25rem,0)}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-nav-card:focus{outline:.125rem solid var(--jkl-color)}@media screen and (forced-colors:active){.jkl-nav-card{border:.125rem solid LinkText;outline:revert}}@media screen and (prefers-color-scheme:light){:root{--jkl-task-card-background--highlighted:#fff;--jkl-task-card-background--normal:#f9f9f9;--jkl-task-card-background--subdued:#ece9e5;--jkl-task-card-shadow:0 0.25rem 0.75rem #252a3108}}[data-theme=light]{--jkl-task-card-background--highlighted:#fff;--jkl-task-card-background--normal:#f9f9f9;--jkl-task-card-background--subdued:#ece9e5;--jkl-task-card-shadow:0 0.25rem 0.75rem #252a3108}@media screen and (prefers-color-scheme:dark){:root{--jkl-task-card-background--highlighted:#313030;--jkl-task-card-background--normal:#313030;--jkl-task-card-background--subdued:#000;--jkl-task-card-shadow:none}}[data-theme=dark]{--jkl-task-card-background--highlighted:#313030;--jkl-task-card-background--normal:#313030;--jkl-task-card-background--subdued:#000;--jkl-task-card-shadow:none}.jkl-task-card{border-radius:.25rem;box-sizing:border-box;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}.jkl-task-card__content-wrapper{display:block}.jkl-task-card--highlighted,.jkl-task-card--hvit{background-color:var(--jkl-task-card-background--highlighted)}.jkl-task-card--normal,.jkl-task-card--snohvit{background-color:var(--jkl-task-card-background--normal)}.jkl-task-card--sand,.jkl-task-card--subdued{background-color:var(--jkl-task-card-background--subdued)}.jkl-task-card--dis,.jkl-task-card--very-subdued{background-color:var(--jkl-task-card-background--very-subdued)}.jkl-task-card--with-shadow{box-shadow:var(--jkl-task-card-shadow)}@media screen and (forced-colors:active){.jkl-task-card{border:.125rem solid CanvasText}}.jkl-card{--padding-s:var(--jkl-unit-05);--padding-m:var(--jkl-unit-15);--padding-l:var(--jkl-unit-20);--padding-xl:var(--jkl-unit-30);--border-radius:0.25rem;--border-color:#0000;--border-width:0.0625rem;--background-color:#0000;background-color:var(--background-color);box-sizing:border-box;color:var(--jkl-color-text-default);display:block;overflow:hidden;padding:var(--padding,var(--padding-s));position:relative;text-decoration:none}.jkl-card,.jkl-card:after{border-radius:var(--border-radius)}.jkl-card:after{border:var(--border-width) solid var(--border-color);content:"";inset:0;pointer-events:none;position:absolute;transition-duration:.1s;transition-property:border-color,border-size;transition-timing-function:ease}@media (min-width:680px){.jkl-card{--padding-s:var(--jkl-unit-10);--padding-m:var(--jkl-unit-20);--padding-l:var(--jkl-unit-30);--padding-xl:var(--jkl-unit-40)}}.jkl-card[data-padding=s]{--padding:var(--padding-s)}.jkl-card[data-padding=m]{--padding:var(--padding-m)}.jkl-card[data-padding=l]{--padding:var(--padding-l)}.jkl-card[data-padding=xl]{--padding:var(--padding-xl)}.jkl-card--high{--background-color:var(--jkl-color-background-container-high)}.jkl-card--low{--background-color:var(--jkl-color-background-container-low)}.jkl-card--outlined{--border-color:var(--jkl-color-border-separator)}.jkl-card[data-clickable=true]{cursor:pointer}.jkl-card[data-clickable=true]:hover{--border-color:var(--jkl-color-border-separator-hover);--border-width:0.125rem}.jkl-card[data-clickable=true]:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-card-image{--margin:calc(var(--padding, 0)*-1);aspect-ratio:var(--image-aspect-ratio,3/2);margin-inline:var(--margin,0);width:calc(100% + var(--padding, 0)*2)}.jkl-card-image--top{margin-top:var(--margin,0)}.jkl-card-image--bottom{margin-bottom:var(--margin,0)}
+.jkl-card{--padding-s:var(--jkl-unit-05);--padding-m:var(--jkl-unit-15);--padding-l:var(--jkl-unit-20);--padding-xl:var(--jkl-unit-30);--border-radius:0.25rem;--border-color:#0000;--border-width:0.0625rem;--background-color:#0000;background-color:var(--background-color);box-sizing:border-box;color:var(--jkl-color-text-default);display:block;overflow:hidden;padding:var(--padding,var(--padding-s));position:relative;text-decoration:none}.jkl-card,.jkl-card:after{border-radius:var(--border-radius)}.jkl-card:after{border:var(--border-width) solid var(--border-color);content:"";inset:0;pointer-events:none;position:absolute;transition-duration:.1s;transition-property:border-color,border-size;transition-timing-function:ease}@media (min-width:680px){.jkl-card{--padding-s:var(--jkl-unit-10);--padding-m:var(--jkl-unit-20);--padding-l:var(--jkl-unit-30);--padding-xl:var(--jkl-unit-40)}}.jkl-card[data-padding=s]{--padding:var(--padding-s)}.jkl-card[data-padding=m]{--padding:var(--padding-m)}.jkl-card[data-padding=l]{--padding:var(--padding-l)}.jkl-card[data-padding=xl]{--padding:var(--padding-xl)}.jkl-card--high{--background-color:var(--jkl-color-background-container-high)}.jkl-card--low{--background-color:var(--jkl-color-background-container-low)}.jkl-card--outlined{--border-color:var(--jkl-color-border-separator)}.jkl-card[data-clickable=true]{cursor:pointer}.jkl-card[data-clickable=true]:hover{--border-color:var(--jkl-color-border-separator-hover);--border-width:0.125rem}.jkl-card[data-clickable=true]:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-card-image{--margin:calc(var(--padding, 0)*-1);aspect-ratio:var(--image-aspect-ratio,3/2);margin-inline:var(--margin,0);width:calc(100% + var(--padding, 0)*2)}.jkl-card-image--top{margin-top:var(--margin,0)}.jkl-card-image--bottom{margin-bottom:var(--margin,0)}

package/styles/components/card/card.scss

@@ -1,8 +1,5 @@
 @charset "UTF-8";
 @use "../../core/jkl";
-@use "info-card";
-@use "nav-card";
-@use "task-card";
 
 .jkl-card {
     --padding-s: var(--jkl-unit-05);

package/styles/components/checkbox/checkbox.css

@@ -32,7 +32,7 @@
   --jkl-checkbox-line-height: 1.5rem;
 }
 
-@keyframes jkl-checkbox-checked-un9pgtc {
+@keyframes jkl-checkbox-checked-uj4zi85 {
   0% {
     width: 0;
     height: 0;
@@ -46,7 +46,7 @@
     height: 58%;
   }
 }
-@keyframes jkl-checkbox-indeterminate-un9pgth {
+@keyframes jkl-checkbox-indeterminate-uj4zi8b {
   0% {
     width: 0;
   }
@@ -75,11 +75,11 @@
   left: calc(-0.5 * var(--jkl-checkbox-box-size));
 }
 .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
-  animation: jkl-checkbox-checked-un9pgtc 150ms ease-in-out forwards;
+  animation: jkl-checkbox-checked-uj4zi85 150ms ease-in-out forwards;
   opacity: 1;
 }
 .jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
-  animation: jkl-checkbox-indeterminate-un9pgth 150ms ease-in-out forwards;
+  animation: jkl-checkbox-indeterminate-uj4zi8b 150ms ease-in-out forwards;
   opacity: 1;
 }
 .jkl-checkbox__input:focus-visible + .jkl-checkbox__label {

package/styles/components/checkbox/checkbox.min.css

@@ -1 +1 @@
-:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-font-size:var(--jkl-body-font-size);--jkl-checkbox-line-height:var(--jkl-body-line-height);--jkl-checkbox-font-weight:var(--jkl-body-font-weight);--jkl-checkbox-height:3rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:2rem}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-height:2.5rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:1.75rem}}[data-density=compact],[data-layout-density=compact]{--jkl-checkbox-font-size:var(--jkl-small-font-size);--jkl-checkbox-line-height:var(--jkl-small-line-height);--jkl-checkbox-font-weight:var(--jkl-small-font-weight);--jkl-checkbox-height:1.75rem;--jkl-checkbox-box-size:1.125rem;--jkl-checkbox-line-height:1.5rem}@keyframes jkl-checkbox-checked-un9pgtc{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-un9pgth{0%{width:0}to{width:66%}}.jkl-checkbox{--box-color:var(--jkl-color-border-action);--check-color:var(--jkl-color-border-action);--text-color:var(--jkl-color-text-default);--background-color:#0000;color:var(--text-color);display:flex;flex-wrap:wrap;font-size:var(--jkl-checkbox-font-size);font-weight:var(--jkl-checkbox-font-weight);line-height:var(--jkl-checkbox-line-height);min-height:var(--jkl-checkbox-height);position:relative}.jkl-checkbox__input{left:calc(var(--jkl-checkbox-box-size)*-.5);opacity:0;position:absolute;top:var(--jkl-checkbox-box-size)}.jkl-checkbox__input:checked+.jkl-checkbox__label .jkl-checkbox__check-mark:after{animation:jkl-checkbox-checked-un9pgtc .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label .jkl-checkbox__indeterminate-mark:after{animation:jkl-checkbox-indeterminate-un9pgth .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label{color:var(--jkl-checkbox-focus-color)}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label>.jkl-checkbox__mark{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-checkbox__input:disabled+.jkl-checkbox__label{color:var(--jkl-checkbox-disabled-color)}.jkl-checkbox__input:active{--background-color:var(--jkl-color-background-input-focus)}.jkl-checkbox__label{cursor:pointer;display:flex;flex-shrink:0;max-width:100%;min-width:0}.jkl-checkbox__label:active .jkl-checkbox__mark,.jkl-checkbox__label:hover .jkl-checkbox__mark{outline:1px solid var(--box-color)}.jkl-checkbox__text{margin:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-line-height))*.5) 0;transition-duration:.15s;transition-property:color;transition-timing-function:ease;translate:0 .0625rem}.jkl-checkbox__mark{box-sizing:border-box;height:var(--jkl-checkbox-box-size);margin-block:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-box-size))*.5);position:relative;width:var(--jkl-checkbox-box-size);-webkit-margin-end:var(--jkl-unit-10);align-self:flex-start;background-color:var(--background-color);border:1px solid;border-color:var(--box-color);border-radius:0;flex-shrink:0;margin-inline-end:var(--jkl-unit-10);outline:none;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-checkbox__mark{border:1px solid ButtonText;outline:revert}}.jkl-checkbox__check-mark:after{border-bottom:.125rem solid var(--check-color);border-left-width:.125rem;border-left:0 solid var(--check-color);border-right:.125rem solid var(--check-color);border-top-width:.125rem;border-top:0 solid var(--check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox__check-mark:after{border-color:ButtonText}}.jkl-checkbox__indeterminate-mark:after{--width:66%;--thickness:0.125rem;border-bottom:solid var(--thickness) var(--check-color);bottom:calc(50% - var(--thickness)/2);content:"";display:block;left:calc((100% - var(--width))/2);opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:var(--width)}@media screen and (forced-colors:active){.jkl-checkbox__indeterminate-mark:after{border-color:ButtonText}}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:calc(var(--jkl-unit-10)*3)}.jkl-checkbox--error{--background-color:var(--jkl-color-background-alert-error);--check-color:var(--jkl-color-text-on-alert)}
+:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-font-size:var(--jkl-body-font-size);--jkl-checkbox-line-height:var(--jkl-body-line-height);--jkl-checkbox-font-weight:var(--jkl-body-font-weight);--jkl-checkbox-height:3rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:2rem}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-height:2.5rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:1.75rem}}[data-density=compact],[data-layout-density=compact]{--jkl-checkbox-font-size:var(--jkl-small-font-size);--jkl-checkbox-line-height:var(--jkl-small-line-height);--jkl-checkbox-font-weight:var(--jkl-small-font-weight);--jkl-checkbox-height:1.75rem;--jkl-checkbox-box-size:1.125rem;--jkl-checkbox-line-height:1.5rem}@keyframes jkl-checkbox-checked-uj4zi85{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-uj4zi8b{0%{width:0}to{width:66%}}.jkl-checkbox{--box-color:var(--jkl-color-border-action);--check-color:var(--jkl-color-border-action);--text-color:var(--jkl-color-text-default);--background-color:#0000;color:var(--text-color);display:flex;flex-wrap:wrap;font-size:var(--jkl-checkbox-font-size);font-weight:var(--jkl-checkbox-font-weight);line-height:var(--jkl-checkbox-line-height);min-height:var(--jkl-checkbox-height);position:relative}.jkl-checkbox__input{left:calc(var(--jkl-checkbox-box-size)*-.5);opacity:0;position:absolute;top:var(--jkl-checkbox-box-size)}.jkl-checkbox__input:checked+.jkl-checkbox__label .jkl-checkbox__check-mark:after{animation:jkl-checkbox-checked-uj4zi85 .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label .jkl-checkbox__indeterminate-mark:after{animation:jkl-checkbox-indeterminate-uj4zi8b .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label{color:var(--jkl-checkbox-focus-color)}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label>.jkl-checkbox__mark{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-checkbox__input:disabled+.jkl-checkbox__label{color:var(--jkl-checkbox-disabled-color)}.jkl-checkbox__input:active{--background-color:var(--jkl-color-background-input-focus)}.jkl-checkbox__label{cursor:pointer;display:flex;flex-shrink:0;max-width:100%;min-width:0}.jkl-checkbox__label:active .jkl-checkbox__mark,.jkl-checkbox__label:hover .jkl-checkbox__mark{outline:1px solid var(--box-color)}.jkl-checkbox__text{margin:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-line-height))*.5) 0;transition-duration:.15s;transition-property:color;transition-timing-function:ease;translate:0 .0625rem}.jkl-checkbox__mark{box-sizing:border-box;height:var(--jkl-checkbox-box-size);margin-block:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-box-size))*.5);position:relative;width:var(--jkl-checkbox-box-size);-webkit-margin-end:var(--jkl-unit-10);align-self:flex-start;background-color:var(--background-color);border:1px solid;border-color:var(--box-color);border-radius:0;flex-shrink:0;margin-inline-end:var(--jkl-unit-10);outline:none;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-checkbox__mark{border:1px solid ButtonText;outline:revert}}.jkl-checkbox__check-mark:after{border-bottom:.125rem solid var(--check-color);border-left-width:.125rem;border-left:0 solid var(--check-color);border-right:.125rem solid var(--check-color);border-top-width:.125rem;border-top:0 solid var(--check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox__check-mark:after{border-color:ButtonText}}.jkl-checkbox__indeterminate-mark:after{--width:66%;--thickness:0.125rem;border-bottom:solid var(--thickness) var(--check-color);bottom:calc(50% - var(--thickness)/2);content:"";display:block;left:calc((100% - var(--width))/2);opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:var(--width)}@media screen and (forced-colors:active){.jkl-checkbox__indeterminate-mark:after{border-color:ButtonText}}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:calc(var(--jkl-unit-10)*3)}.jkl-checkbox--error{--background-color:var(--jkl-color-background-alert-error);--check-color:var(--jkl-color-text-on-alert)}

package/styles/components/checkbox-panel/checkbox-panel.css

@@ -62,7 +62,7 @@
   --outer-border-thickness: 0.125rem;
 }
 
-@keyframes jkl-checkbox-checked-umq6a58 {
+@keyframes jkl-checkbox-checked-uo9x4nc {
   0% {
     width: 0;
     height: 0;
@@ -125,7 +125,7 @@
   }
 }
 .jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
-  animation: jkl-checkbox-checked-umq6a58 150ms ease-in-out forwards;
+  animation: jkl-checkbox-checked-uo9x4nc 150ms ease-in-out forwards;
   opacity: 1;
 }
 .jkl-checkbox-panel:has([aria-invalid=true]) {

package/styles/components/checkbox-panel/checkbox-panel.min.css

@@ -1 +1 @@
-.jkl-input-panel{--outer-border-color:var(--jkl-color-border-input);--outer-border-thickness:0.0625rem;--background-color:#0000;background-color:var(--background-color);border-radius:4px;box-shadow:inset 0 0 0 var(--outer-border-thickness) var(--outer-border-color);cursor:pointer;padding-left:1rem}.jkl-input-panel__input{opacity:0;position:absolute;top:-6px}.jkl-input-panel__label{align-items:center;cursor:pointer;display:grid;gap:.5rem;grid-template-columns:-webkit-min-content fit-content(30%) 1fr;grid-template-columns:min-content fit-content(30%) 1fr}.jkl-input-panel__main-label{padding-block:1.5rem}.jkl-input-panel__extra-label{align-self:stretch;margin-left:1rem;margin-right:1rem}.jkl-input-panel__extra-label>:first-child{padding-right:1rem}.jkl-input-panel__extra-label--text{align-items:center;display:flex;height:100%}.jkl-input-panel__content{cursor:default;height:0;overflow:hidden;padding-right:1.5rem}.jkl-input-panel:has([aria-expanded=true]) .jkl-input-panel__content,.jkl-input-panel__content[data-alwaysopen=true]{height:auto;padding-bottom:24px}.jkl-input-panel:has(:focus-visible){outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-input-panel:has(:checked){--background-color:var(--jkl-color-background-container-high)}.jkl-input-panel:hover{--outer-border-color:var(--jkl-color-border-separator-hover);--outer-border-thickness:0.125rem}@keyframes jkl-checkbox-checked-umq6a58{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}.jkl-checkbox-panel{--checkbox-background-color:#0000;--checkbox-box-color:var(--jkl-color-border-action);--checkbox-check-color:var(--jkl-color-border-action)}.jkl-checkbox-panel__decorator{background-color:var(--checkbox-background-color);border:1px solid;border-color:var(--checkbox-box-color);border-radius:0;box-sizing:border-box;height:var(--jkl-checkbox-box-size);outline:none;position:relative;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease;width:var(--jkl-checkbox-box-size)}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator{border:1px solid ButtonText;outline:revert}}.jkl-checkbox-panel__decorator:after{border-bottom:.125rem solid var(--checkbox-check-color);border-left-width:.125rem;border-left:0 solid var(--checkbox-check-color);border-right:.125rem solid var(--checkbox-check-color);border-top-width:.125rem;border-top:0 solid var(--checkbox-check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator:after{border-color:ButtonText}}.jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator:after{animation:jkl-checkbox-checked-umq6a58 .15s ease-in-out forwards;opacity:1}.jkl-checkbox-panel:has([aria-invalid=true]){--checkbox-background-color:var(--jkl-color-background-alert-error);--checkbox-check-color:var(--jkl-color-text-on-alert)}
+.jkl-input-panel{--outer-border-color:var(--jkl-color-border-input);--outer-border-thickness:0.0625rem;--background-color:#0000;background-color:var(--background-color);border-radius:4px;box-shadow:inset 0 0 0 var(--outer-border-thickness) var(--outer-border-color);cursor:pointer;padding-left:1rem}.jkl-input-panel__input{opacity:0;position:absolute;top:-6px}.jkl-input-panel__label{align-items:center;cursor:pointer;display:grid;gap:.5rem;grid-template-columns:-webkit-min-content fit-content(30%) 1fr;grid-template-columns:min-content fit-content(30%) 1fr}.jkl-input-panel__main-label{padding-block:1.5rem}.jkl-input-panel__extra-label{align-self:stretch;margin-left:1rem;margin-right:1rem}.jkl-input-panel__extra-label>:first-child{padding-right:1rem}.jkl-input-panel__extra-label--text{align-items:center;display:flex;height:100%}.jkl-input-panel__content{cursor:default;height:0;overflow:hidden;padding-right:1.5rem}.jkl-input-panel:has([aria-expanded=true]) .jkl-input-panel__content,.jkl-input-panel__content[data-alwaysopen=true]{height:auto;padding-bottom:24px}.jkl-input-panel:has(:focus-visible){outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-input-panel:has(:checked){--background-color:var(--jkl-color-background-container-high)}.jkl-input-panel:hover{--outer-border-color:var(--jkl-color-border-separator-hover);--outer-border-thickness:0.125rem}@keyframes jkl-checkbox-checked-uo9x4nc{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}.jkl-checkbox-panel{--checkbox-background-color:#0000;--checkbox-box-color:var(--jkl-color-border-action);--checkbox-check-color:var(--jkl-color-border-action)}.jkl-checkbox-panel__decorator{background-color:var(--checkbox-background-color);border:1px solid;border-color:var(--checkbox-box-color);border-radius:0;box-sizing:border-box;height:var(--jkl-checkbox-box-size);outline:none;position:relative;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease;width:var(--jkl-checkbox-box-size)}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator{border:1px solid ButtonText;outline:revert}}.jkl-checkbox-panel__decorator:after{border-bottom:.125rem solid var(--checkbox-check-color);border-left-width:.125rem;border-left:0 solid var(--checkbox-check-color);border-right:.125rem solid var(--checkbox-check-color);border-top-width:.125rem;border-top:0 solid var(--checkbox-check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator:after{border-color:ButtonText}}.jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator:after{animation:jkl-checkbox-checked-uo9x4nc .15s ease-in-out forwards;opacity:1}.jkl-checkbox-panel:has([aria-invalid=true]){--checkbox-background-color:var(--jkl-color-background-alert-error);--checkbox-check-color:var(--jkl-color-text-on-alert)}

package/styles/components/chip/chip.css

@@ -46,10 +46,11 @@
   border-radius: 99999px;
   display: inline-flex;
   align-items: center;
+  text-align: initial;
   white-space: nowrap;
   gap: var(--gap, var(--gap-s));
   padding: 0 var(--padding-inline, var(--padding-inline-s));
-  height: var(--height, var(--height-s));
+  min-height: var(--height, var(--height-s));
 }
 @media screen and (forced-colors: active) {
   .jkl-chip {
@@ -80,6 +81,13 @@
   --text-color: var(--jkl-color-text-on-action);
   --border-color: var(--text-color);
 }
+@media screen and (forced-colors: active) {
+  .jkl-chip--filter[aria-pressed=true] {
+    forced-color-adjust: none;
+    --background-color: CanvasText;
+    --text-color: Canvas;
+  }
+}
 .jkl-chip--small {
   --padding-inline: var(--padding-inline-s);
   --gap: var(--gap-s);

package/styles/components/chip/chip.min.css

@@ -1 +1 @@
-[data-density=compact],[data-layout-density=compact]{--padding-inline-s:0.5rem;--padding-inline-l:calc(var(--jkl-unit-10)*1.5);--padding-icon-s:calc(var(--jkl-unit-10)*0.5);--padding-icon-l:0.5rem;--height-l:calc(var(--jkl-unit-10)*4);--height-s:calc(var(--jkl-unit-10)*3);--gap-s:calc(var(--jkl-unit-10)*0.25);--gap-l:calc(var(--jkl-unit-10)*0.5)}:root,[data-density=comfortable],[data-layout-density=comfortable]{--padding-inline-s:calc(var(--jkl-unit-10)*1.5);--padding-inline-l:calc(var(--jkl-unit-10)*2);--padding-icon-s:0.5rem;--padding-icon-l:calc(var(--jkl-unit-10)*1.5);--height-l:calc(var(--jkl-unit-10)*5);--height-s:calc(var(--jkl-unit-10)*4);--gap-s:calc(var(--jkl-unit-10)*0.5);--gap-l:0.5rem}.jkl-chip{--text-color:var(--jkl-color-text-default);--border-color:var(--jkl-color-border-separator);--background-color:#0000;--border-width:0.0625rem;font-size:1rem;font-weight:700;line-height:1.5rem;--jkl-icon-weight:500;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;align-items:center;background-color:var(--background-color);border:var(--border-width) solid var(--border-color);border-radius:99999px;color:var(--text-color);cursor:pointer;display:inline-flex;gap:var(--gap,var(--gap-s));height:var(--height,var(--height-s));padding:0 var(--padding-inline,var(--padding-inline-s));position:relative;white-space:nowrap}@media screen and (forced-colors:active){.jkl-chip{border:2px CanvasText;border-style:none none dotted}}.jkl-chip:after{background-color:var(--text-color);border-radius:inherit;content:"";inset:0;opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity;transition-timing-function:ease}.jkl-chip:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-chip:hover:after{opacity:.15}.jkl-chip--filter[aria-pressed=true]{--background-color:var(--jkl-color-background-action);--text-color:var(--jkl-color-text-on-action);--border-color:var(--text-color)}.jkl-chip--small{--padding-inline:var(--padding-inline-s);--gap:var(--gap-s);--padding-icon:var(--padding-icon-s);--height:var(--height-s)}.jkl-chip--large{--padding-inline:var(--padding-inline-l);--gap:var(--gap-l);--padding-icon:var(--padding-icon-l);--height:var(--height-l)}.jkl-chip:has(.jkl-icon){-webkit-padding-end:var(--padding-icon);padding-inline-end:var(--padding-icon)}
+[data-density=compact],[data-layout-density=compact]{--padding-inline-s:0.5rem;--padding-inline-l:calc(var(--jkl-unit-10)*1.5);--padding-icon-s:calc(var(--jkl-unit-10)*0.5);--padding-icon-l:0.5rem;--height-l:calc(var(--jkl-unit-10)*4);--height-s:calc(var(--jkl-unit-10)*3);--gap-s:calc(var(--jkl-unit-10)*0.25);--gap-l:calc(var(--jkl-unit-10)*0.5)}:root,[data-density=comfortable],[data-layout-density=comfortable]{--padding-inline-s:calc(var(--jkl-unit-10)*1.5);--padding-inline-l:calc(var(--jkl-unit-10)*2);--padding-icon-s:0.5rem;--padding-icon-l:calc(var(--jkl-unit-10)*1.5);--height-l:calc(var(--jkl-unit-10)*5);--height-s:calc(var(--jkl-unit-10)*4);--gap-s:calc(var(--jkl-unit-10)*0.5);--gap-l:0.5rem}.jkl-chip{--text-color:var(--jkl-color-text-default);--border-color:var(--jkl-color-border-separator);--background-color:#0000;--border-width:0.0625rem;font-size:1rem;font-weight:700;line-height:1.5rem;--jkl-icon-weight:500;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;align-items:center;background-color:var(--background-color);border:var(--border-width) solid var(--border-color);border-radius:99999px;color:var(--text-color);cursor:pointer;display:inline-flex;gap:var(--gap,var(--gap-s));min-height:var(--height,var(--height-s));padding:0 var(--padding-inline,var(--padding-inline-s));position:relative;text-align:initial;white-space:nowrap}@media screen and (forced-colors:active){.jkl-chip{border:2px CanvasText;border-style:none none dotted}}.jkl-chip:after{background-color:var(--text-color);border-radius:inherit;content:"";inset:0;opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity;transition-timing-function:ease}.jkl-chip:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-chip:hover:after{opacity:.15}.jkl-chip--filter[aria-pressed=true]{--background-color:var(--jkl-color-background-action);--text-color:var(--jkl-color-text-on-action);--border-color:var(--text-color)}@media screen and (forced-colors:active){.jkl-chip--filter[aria-pressed=true]{forced-color-adjust:none;--background-color:CanvasText;--text-color:Canvas}}.jkl-chip--small{--padding-inline:var(--padding-inline-s);--gap:var(--gap-s);--padding-icon:var(--padding-icon-s);--height:var(--height-s)}.jkl-chip--large{--padding-inline:var(--padding-inline-l);--gap:var(--gap-l);--padding-icon:var(--padding-icon-l);--height:var(--height-l)}.jkl-chip:has(.jkl-icon){-webkit-padding-end:var(--padding-icon);padding-inline-end:var(--padding-icon)}

package/styles/components/chip/chip.scss

@@ -38,10 +38,11 @@
     border-radius: 99999px;
     display: inline-flex;
     align-items: center;
+    text-align: initial;
     white-space: nowrap;
     gap: var(--gap, var(--gap-s));
     padding: 0 var(--padding-inline, var(--padding-inline-s));
-    height: var(--height, var(--height-s));
+    min-height: var(--height, var(--height-s));
 
     @include jkl.forced-colors-mode {
         border: 2px none CanvasText;
@@ -74,6 +75,12 @@
             --background-color: var(--jkl-color-background-action);
             --text-color: var(--jkl-color-text-on-action);
             --border-color: var(--text-color);
+
+            @include jkl.forced-colors-mode {
+                forced-color-adjust: none;
+                --background-color: CanvasText;
+                --text-color: Canvas;
+            }
         }
     }
 

package/styles/components/combobox/combobox.css

@@ -1,4 +1,3 @@
-@charset "UTF-8";
 /**
  * Do not edit directly
  * Generated on Wed, 18 Dec 2024 12:25:37 GMT
@@ -83,13 +82,12 @@
   --jkl-combobox-font-size: var(--jkl-body-font-size);
   --jkl-combobox-line-height: var(--jkl-body-line-height);
   --jkl-combobox-font-weight: var(--jkl-body-font-weight);
-  --jkl-combobox-button-padding: 0.5rem 0.375rem 0.5rem
-      /* her har vi en random 6px verdi også*/ calc(var(--jkl-unit-10) * 1.5);
-  --jkl-combobox-button-active-value-padding: 0.5rem 0.375rem
-      0.5rem 0.5rem;
+  --jkl-combobox-button-padding: 0.5rem;
+  --jkl-combobox-button-active-value-padding: 0.5rem;
   --jkl-combobox-input-height: 3rem;
   --jkl-combobox-actions-right: 0.5rem;
-  --jkl-combobox-actions-top: 0.75rem;
+  --jkl-combobox-actions-top: 0.25rem;
+  --jkl-combobox-chips-gap: 4px;
   --jkl-combobox-search-input-padding: var(--jkl-combobox-button-padding);
   --jkl-combobox-native-padding: 0 calc(var(--jkl-unit-10) * 5) 0 0.5rem;
   --jkl-combobox-option-padding: 0.5rem calc(var(--jkl-unit-10) * 1.5);
@@ -110,13 +108,12 @@
   --jkl-combobox-font-size: var(--jkl-small-font-size);
   --jkl-combobox-line-height: var(--jkl-small-line-height);
   --jkl-combobox-font-weight: var(--jkl-small-font-weight);
-  --jkl-combobox-button-padding: calc(var(--jkl-unit-10) * 0.5) 1.875rem calc(var(--jkl-unit-10) * 0.5)
-      0.5rem;
-  --jkl-combobox-button-active-value-padding: calc(var(--jkl-unit-10) * 0.5) 1.875rem
-      calc(var(--jkl-unit-10) * 0.5) 0.5rem;
+  --jkl-combobox-button-padding: calc(var(--jkl-unit-10) * 0.5);
+  --jkl-combobox-button-active-value-padding: calc(var(--jkl-unit-10) * 0.5) 0.5rem;
   --jkl-combobox-input-height: 2rem;
   --jkl-combobox-actions-right: 0;
-  --jkl-combobox-actions-top: 0.375rem;
+  --jkl-combobox-actions-top: 0.0625rem;
+  --jkl-combobox-chips-gap: 1px;
   --jkl-combobox-search-input-padding: calc(var(--jkl-unit-10) * 0.5) 0.5rem;
   --jkl-combobox-native-padding: calc(var(--jkl-unit-10) * 3) calc(var(--jkl-unit-10) * 0.5) calc(var(--jkl-unit-10) * 0.5);
   --jkl-combobox-option-padding: calc(var(--jkl-unit-10) * 0.5) 0.5rem;
@@ -153,9 +150,10 @@
 }
 .jkl-combobox__wrapper {
   position: relative;
-  min-width: 7rem;
   max-width: 100%;
   display: flex;
+  gap: 1ch;
+  cursor: pointer;
   padding: var(--jkl-combobox-button-padding);
   border-radius: 0.1875rem;
   border: 0.0625rem solid var(--jkl-combobox-border-color);
@@ -208,7 +206,6 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
   align-self: end;
   flex: 1 1 1ch;
   max-height: var(--jkl-combobox-search-input-height);
-  padding-right: var(--jkl-combobox-input-padding);
 }
 .jkl-combobox__arrow {
   pointer-events: none;
@@ -288,20 +285,18 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
 }
 .jkl-combobox__actions {
   display: flex;
-  position: absolute;
-  right: var(--jkl-combobox-actions-right);
   gap: calc(var(--jkl-unit-10) * 0.5);
-  top: var(--jkl-combobox-actions-top);
+  margin-block-start: var(--jkl-combobox-actions-top);
 }
 .jkl-combobox__chips {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  margin-left: -4px;
+  gap: var(--jkl-combobox-chips-gap);
+  width: 100%;
 }
 .jkl-combobox__chips .jkl-chip {
-  margin: 1px 4px;
-  z-index: 1;
+  white-space: break-spaces;
 }
 .jkl-combobox__chips .jkl-chip__marked {
   border-radius: 6px;
@@ -330,4 +325,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrap
 }
 .jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions {
   transform: translateY(-0.1875rem);
+}
+.jkl-combobox--menu-open .jkl-combobox__search-input {
+  cursor: text;
 }

package/styles/components/combobox/combobox.min.css

@@ -1 +1 @@
-@media screen and (prefers-color-scheme:light){:root{--jkl-combobox-border-color:#636060;--jkl-combobox-text-color:#636060;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#1b1917;--jkl-combobox-open-background-color:#fff;--jkl-combobox-focus-color:#1b1917;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#1b1917;--jkl-combobox-hover-option-background-color:#f4f2ef;--jkl-combobox-option-description-color:#636060;--jkl-combobox-search-input-selection-color:#1b191733;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#1b1917;--jkl-combobox-marked-value-shadow:#f9f9f9}}[data-theme=light]{--jkl-combobox-border-color:#636060;--jkl-combobox-text-color:#636060;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#1b1917;--jkl-combobox-open-background-color:#fff;--jkl-combobox-focus-color:#1b1917;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#1b1917;--jkl-combobox-hover-option-background-color:#f4f2ef;--jkl-combobox-option-description-color:#636060;--jkl-combobox-search-input-selection-color:#1b191733;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#1b1917;--jkl-combobox-marked-value-shadow:#f9f9f9}@media screen and (prefers-color-scheme:dark){:root{--jkl-combobox-border-color:#c8c5c3;--jkl-combobox-text-color:#c8c5c3;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#f9f9f9;--jkl-combobox-open-background-color:#313030;--jkl-combobox-focus-color:#f9f9f9;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#f9f9f9;--jkl-combobox-hover-option-background-color:#444141;--jkl-combobox-option-description-color:#ece9e5;--jkl-combobox-search-input-selection-color:#f9f9f940;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#f9f9f9;--jkl-combobox-marked-value-shadow:#1b1917}}[data-theme=dark]{--jkl-combobox-border-color:#c8c5c3;--jkl-combobox-text-color:#c8c5c3;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#f9f9f9;--jkl-combobox-open-background-color:#313030;--jkl-combobox-focus-color:#f9f9f9;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#f9f9f9;--jkl-combobox-hover-option-background-color:#444141;--jkl-combobox-option-description-color:#ece9e5;--jkl-combobox-search-input-selection-color:#f9f9f940;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#f9f9f9;--jkl-combobox-marked-value-shadow:#1b1917}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-combobox-font-size:var(--jkl-body-font-size);--jkl-combobox-line-height:var(--jkl-body-line-height);--jkl-combobox-font-weight:var(--jkl-body-font-weight);--jkl-combobox-button-padding:0.5rem 0.375rem 0.5rem calc(var(--jkl-unit-10)*1.5);--jkl-combobox-button-active-value-padding:0.5rem 0.375rem 0.5rem 0.5rem;--jkl-combobox-input-height:3rem;--jkl-combobox-actions-right:0.5rem;--jkl-combobox-actions-top:0.75rem;--jkl-combobox-search-input-padding:var(--jkl-combobox-button-padding);--jkl-combobox-native-padding:0 calc(var(--jkl-unit-10)*5) 0 0.5rem;--jkl-combobox-option-padding:0.5rem calc(var(--jkl-unit-10)*1.5);--jkl-combobox-option-line-height:2rem;--jkl-combobox-input-padding:3.75rem;--jkl-combobox-search-input-height:1.75rem}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-combobox-input-height:2.75rem}}[data-density=compact],[data-layout-density=compact]{--jkl-combobox-font-size:var(--jkl-small-font-size);--jkl-combobox-line-height:var(--jkl-small-line-height);--jkl-combobox-font-weight:var(--jkl-small-font-weight);--jkl-combobox-button-padding:calc(var(--jkl-unit-10)*0.5) 1.875rem calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-button-active-value-padding:calc(var(--jkl-unit-10)*0.5) 1.875rem calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-input-height:2rem;--jkl-combobox-actions-right:0;--jkl-combobox-actions-top:0.375rem;--jkl-combobox-search-input-padding:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-native-padding:calc(var(--jkl-unit-10)*3) calc(var(--jkl-unit-10)*0.5) calc(var(--jkl-unit-10)*0.5);--jkl-combobox-option-padding:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-option-line-height:1.5rem;--jkl-combobox-input-padding:calc(var(--jkl-unit-10)*1.5);--jkl-combobox-search-input-height:1.25rem}.jkl-combobox{border-style:none;position:relative}.jkl-combobox,.jkl-combobox:active,.jkl-combobox:focus,.jkl-combobox:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-combobox{border-style:revert}.jkl-combobox,.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{border:.0625rem solid var(--jkl-combobox-border-color);border-radius:.1875rem;box-shadow:0 0 0 .0625rem #0000;display:flex;max-width:100%;min-width:7rem;padding:var(--jkl-combobox-button-padding);position:relative;transition-duration:.15s;transition-property:color,border-color,box-shadow;transition-timing-function:ease}.jkl-combobox__wrapper--active-value{padding:var(--jkl-combobox-button-active-value-padding)}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(:focus-visible){background-color:var(--jkl-combobox-open-background-color);outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-combobox__wrapper:has(.jkl-icon-button:focus-visible){outline:none}.jkl-combobox__wrapper:hover{border-color:var(--jkl-combobox-focus-color);box-shadow:0 0 0 .0625rem var(--jkl-combobox-focus-color)}.jkl-combobox__wrapper:hover~.jkl-combobox__arrow{transform:translateY(calc(-50% + .1875rem))}.jkl-combobox__button{padding:0}.jkl-combobox__button,.jkl-combobox__search-input{background-color:var(--jkl-combobox-background-color);color:var(--jkl-combobox-text-color);cursor:pointer;display:flex;font-size:var(--jkl-combobox-font-size);font-weight:var(--jkl-combobox-font-weight);line-height:var(--jkl-combobox-line-height);overflow:hidden;text-align:left;text-overflow:ellipsis;transition-duration:.15s;transition-property:color,border-color,box-shadow;transition-timing-function:ease;width:100%}.jkl-combobox__search-input{align-self:end;border:none;flex:1 1 1ch;max-height:var(--jkl-combobox-search-input-height);outline:none;padding-right:var(--jkl-combobox-input-padding)}.jkl-combobox__arrow{pointer-events:none;transform:translateY(-50%);transition-duration:.15s;transition-property:transform,color;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-combobox__arrow,.jkl-combobox__arrow path,.jkl-combobox__arrow svg{stroke:CanvasText;fill:CanvasText}}.jkl-combobox__menu{border:.125rem solid var(--jkl-combobox-focus-color);border-radius:0 0 .1875rem .1875rem;box-sizing:border-box;color:var(--jkl-combobox-text-color);left:-.0625rem;max-height:calc((var(--jkl-combobox-max-shown-options, 5) + .5)*var(--jkl-combobox-input-height));overflow-y:auto;position:absolute;right:-.0625rem;top:100%;transition-duration:.15s;transition-property:height;transition-timing-function:ease;z-index:7000}.jkl-combobox__menu,.jkl-combobox__option{background-color:var(--jkl-combobox-open-background-color)}.jkl-combobox__option{align-items:center;border:0;color:var(--jkl-combobox-open-color);cursor:pointer;display:flex;font-size:var(--jkl-combobox-text-font-size);font-weight:var(--jkl-combobox-text-font-weight);line-height:var(--jkl-combobox-text-line-height);line-height:var(--jkl-combobox-option-line-height);padding:var(--jkl-combobox-option-padding);text-align:left;transition-duration:.15s;transition-property:color,background-color;transition-timing-function:ease;width:100%}.jkl-combobox__option:focus,.jkl-combobox__option:hover{background-color:var(--jkl-combobox-hover-option-background-color);color:var(--jkl-combobox-hover-option-color)}.jkl-combobox__option-description{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;color:var(--jkl-combobox-option-description-color);display:block;width:100%}.jkl-combobox__option--selected{justify-content:space-between}.jkl-combobox__option--selected:hover{background-color:var(--jkl-combobox-hover-option-background-color)}.jkl-combobox__no-option{padding:var(--jkl-combobox-option-padding)}.jkl-combobox__actions{display:flex;gap:calc(var(--jkl-unit-10)*.5);position:absolute;right:var(--jkl-combobox-actions-right);top:var(--jkl-combobox-actions-top)}.jkl-combobox__chips{align-items:center;display:flex;flex-wrap:wrap;margin-left:-4px}.jkl-combobox__chips .jkl-chip{margin:1px 4px;z-index:1}.jkl-combobox__chips .jkl-chip__marked{border:1px solid var(--jkl-combobox-marked-value-border);border-radius:6px;box-shadow:0 0 0 2px var(--jkl-combobox-marked-value-shadow) inset;box-sizing:border-box;margin:4px}.jkl-combobox__chips .jkl-chip .jkl-tooltip-trigger{font-weight:700}.jkl-combobox--invalid .jkl-combobox__search-input,.jkl-combobox--invalid .jkl-combobox__wrapper{background-color:var(--jkl-combobox-error-background-color)}.jkl-combobox--invalid .jkl-combobox__button,.jkl-combobox--invalid .jkl-combobox__search-input,.jkl-combobox--invalid .jkl-combobox__wrapper{color:var(--jkl-combobox-error-text-color)}.jkl-combobox--menu-closed .jkl-combobox__search-input{background-color:initial;padding-right:0;position:absolute;width:94%}.jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions{transform:translateY(-.1875rem)}
+@media screen and (prefers-color-scheme:light){:root{--jkl-combobox-border-color:#636060;--jkl-combobox-text-color:#636060;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#1b1917;--jkl-combobox-open-background-color:#fff;--jkl-combobox-focus-color:#1b1917;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#1b1917;--jkl-combobox-hover-option-background-color:#f4f2ef;--jkl-combobox-option-description-color:#636060;--jkl-combobox-search-input-selection-color:#1b191733;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#1b1917;--jkl-combobox-marked-value-shadow:#f9f9f9}}[data-theme=light]{--jkl-combobox-border-color:#636060;--jkl-combobox-text-color:#636060;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#1b1917;--jkl-combobox-open-background-color:#fff;--jkl-combobox-focus-color:#1b1917;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#1b1917;--jkl-combobox-hover-option-background-color:#f4f2ef;--jkl-combobox-option-description-color:#636060;--jkl-combobox-search-input-selection-color:#1b191733;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#1b1917;--jkl-combobox-marked-value-shadow:#f9f9f9}@media screen and (prefers-color-scheme:dark){:root{--jkl-combobox-border-color:#c8c5c3;--jkl-combobox-text-color:#c8c5c3;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#f9f9f9;--jkl-combobox-open-background-color:#313030;--jkl-combobox-focus-color:#f9f9f9;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#f9f9f9;--jkl-combobox-hover-option-background-color:#444141;--jkl-combobox-option-description-color:#ece9e5;--jkl-combobox-search-input-selection-color:#f9f9f940;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#f9f9f9;--jkl-combobox-marked-value-shadow:#1b1917}}[data-theme=dark]{--jkl-combobox-border-color:#c8c5c3;--jkl-combobox-text-color:#c8c5c3;--jkl-combobox-background-color:#0000;--jkl-combobox-open-color:#f9f9f9;--jkl-combobox-open-background-color:#313030;--jkl-combobox-focus-color:#f9f9f9;--jkl-combobox-error-background-color:#f6b3b3;--jkl-combobox-error-text-color:#636060;--jkl-combobox-hover-option-color:#f9f9f9;--jkl-combobox-hover-option-background-color:#444141;--jkl-combobox-option-description-color:#ece9e5;--jkl-combobox-search-input-selection-color:#f9f9f940;--jkl-combobox-search-input-error-selection-color:#1b191733;--jkl-combobox-marked-value-border:#f9f9f9;--jkl-combobox-marked-value-shadow:#1b1917}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-combobox-font-size:var(--jkl-body-font-size);--jkl-combobox-line-height:var(--jkl-body-line-height);--jkl-combobox-font-weight:var(--jkl-body-font-weight);--jkl-combobox-button-padding:0.5rem;--jkl-combobox-button-active-value-padding:0.5rem;--jkl-combobox-input-height:3rem;--jkl-combobox-actions-right:0.5rem;--jkl-combobox-actions-top:0.25rem;--jkl-combobox-chips-gap:4px;--jkl-combobox-search-input-padding:var(--jkl-combobox-button-padding);--jkl-combobox-native-padding:0 calc(var(--jkl-unit-10)*5) 0 0.5rem;--jkl-combobox-option-padding:0.5rem calc(var(--jkl-unit-10)*1.5);--jkl-combobox-option-line-height:2rem;--jkl-combobox-input-padding:3.75rem;--jkl-combobox-search-input-height:1.75rem}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-combobox-input-height:2.75rem}}[data-density=compact],[data-layout-density=compact]{--jkl-combobox-font-size:var(--jkl-small-font-size);--jkl-combobox-line-height:var(--jkl-small-line-height);--jkl-combobox-font-weight:var(--jkl-small-font-weight);--jkl-combobox-button-padding:calc(var(--jkl-unit-10)*0.5);--jkl-combobox-button-active-value-padding:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-input-height:2rem;--jkl-combobox-actions-right:0;--jkl-combobox-actions-top:0.0625rem;--jkl-combobox-chips-gap:1px;--jkl-combobox-search-input-padding:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-native-padding:calc(var(--jkl-unit-10)*3) calc(var(--jkl-unit-10)*0.5) calc(var(--jkl-unit-10)*0.5);--jkl-combobox-option-padding:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-combobox-option-line-height:1.5rem;--jkl-combobox-input-padding:calc(var(--jkl-unit-10)*1.5);--jkl-combobox-search-input-height:1.25rem}.jkl-combobox{border-style:none;position:relative}.jkl-combobox,.jkl-combobox:active,.jkl-combobox:focus,.jkl-combobox:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-combobox{border-style:revert}.jkl-combobox,.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{border:.0625rem solid var(--jkl-combobox-border-color);border-radius:.1875rem;box-shadow:0 0 0 .0625rem #0000;cursor:pointer;display:flex;gap:1ch;max-width:100%;padding:var(--jkl-combobox-button-padding);position:relative;transition-duration:.15s;transition-property:color,border-color,box-shadow;transition-timing-function:ease}.jkl-combobox__wrapper--active-value{padding:var(--jkl-combobox-button-active-value-padding)}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-combobox__wrapper:has(:focus-visible){background-color:var(--jkl-combobox-open-background-color);outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-combobox__wrapper:has(.jkl-icon-button:focus-visible){outline:none}.jkl-combobox__wrapper:hover{border-color:var(--jkl-combobox-focus-color);box-shadow:0 0 0 .0625rem var(--jkl-combobox-focus-color)}.jkl-combobox__wrapper:hover~.jkl-combobox__arrow{transform:translateY(calc(-50% + .1875rem))}.jkl-combobox__button{padding:0}.jkl-combobox__button,.jkl-combobox__search-input{background-color:var(--jkl-combobox-background-color);color:var(--jkl-combobox-text-color);cursor:pointer;display:flex;font-size:var(--jkl-combobox-font-size);font-weight:var(--jkl-combobox-font-weight);line-height:var(--jkl-combobox-line-height);overflow:hidden;text-align:left;text-overflow:ellipsis;transition-duration:.15s;transition-property:color,border-color,box-shadow;transition-timing-function:ease;width:100%}.jkl-combobox__search-input{align-self:end;border:none;flex:1 1 1ch;max-height:var(--jkl-combobox-search-input-height);outline:none}.jkl-combobox__arrow{pointer-events:none;transform:translateY(-50%);transition-duration:.15s;transition-property:transform,color;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-combobox__arrow,.jkl-combobox__arrow path,.jkl-combobox__arrow svg{stroke:CanvasText;fill:CanvasText}}.jkl-combobox__menu{border:.125rem solid var(--jkl-combobox-focus-color);border-radius:0 0 .1875rem .1875rem;box-sizing:border-box;color:var(--jkl-combobox-text-color);left:-.0625rem;max-height:calc((var(--jkl-combobox-max-shown-options, 5) + .5)*var(--jkl-combobox-input-height));overflow-y:auto;position:absolute;right:-.0625rem;top:100%;transition-duration:.15s;transition-property:height;transition-timing-function:ease;z-index:7000}.jkl-combobox__menu,.jkl-combobox__option{background-color:var(--jkl-combobox-open-background-color)}.jkl-combobox__option{align-items:center;border:0;color:var(--jkl-combobox-open-color);cursor:pointer;display:flex;font-size:var(--jkl-combobox-text-font-size);font-weight:var(--jkl-combobox-text-font-weight);line-height:var(--jkl-combobox-text-line-height);line-height:var(--jkl-combobox-option-line-height);padding:var(--jkl-combobox-option-padding);text-align:left;transition-duration:.15s;transition-property:color,background-color;transition-timing-function:ease;width:100%}.jkl-combobox__option:focus,.jkl-combobox__option:hover{background-color:var(--jkl-combobox-hover-option-background-color);color:var(--jkl-combobox-hover-option-color)}.jkl-combobox__option-description{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;color:var(--jkl-combobox-option-description-color);display:block;width:100%}.jkl-combobox__option--selected{justify-content:space-between}.jkl-combobox__option--selected:hover{background-color:var(--jkl-combobox-hover-option-background-color)}.jkl-combobox__no-option{padding:var(--jkl-combobox-option-padding)}.jkl-combobox__actions{display:flex;gap:calc(var(--jkl-unit-10)*.5);-webkit-margin-before:var(--jkl-combobox-actions-top);margin-block-start:var(--jkl-combobox-actions-top)}.jkl-combobox__chips{align-items:center;display:flex;flex-wrap:wrap;gap:var(--jkl-combobox-chips-gap);width:100%}.jkl-combobox__chips .jkl-chip{white-space:break-spaces}.jkl-combobox__chips .jkl-chip__marked{border:1px solid var(--jkl-combobox-marked-value-border);border-radius:6px;box-shadow:0 0 0 2px var(--jkl-combobox-marked-value-shadow) inset;box-sizing:border-box;margin:4px}.jkl-combobox__chips .jkl-chip .jkl-tooltip-trigger{font-weight:700}.jkl-combobox--invalid .jkl-combobox__search-input,.jkl-combobox--invalid .jkl-combobox__wrapper{background-color:var(--jkl-combobox-error-background-color)}.jkl-combobox--invalid .jkl-combobox__button,.jkl-combobox--invalid .jkl-combobox__search-input,.jkl-combobox--invalid .jkl-combobox__wrapper{color:var(--jkl-combobox-error-text-color)}.jkl-combobox--menu-closed .jkl-combobox__search-input{background-color:initial;padding-right:0;position:absolute;width:94%}.jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions{transform:translateY(-.1875rem)}.jkl-combobox--menu-open .jkl-combobox__search-input{cursor:text}