@fremtind/jokul 0.57.1 → 0.57.3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fremtind/jokul",
-    "version": "0.57.1",
+    "version": "0.57.3",
     "type": "module",
     "publishConfig": {
         "access": "public"
@@ -658,5 +658,5 @@
             "@babel/preset-react"
         ]
     },
-    "gitHead": "b4b793755b96a1d5415d31b2b34126ebcbf76f78"
+    "gitHead": "30adf2b5e3799e33466275505cf29923da89dd10"
 }

package/styles/components/accordion/accordion.min.css

@@ -4,4 +4,4 @@
             --jkl-spacing-12
         ) var(--jkl-spacing-12);--jkl-accordion-content-padding:var(--jkl-spacing-8) var(--jkl-spacing-12) var(--jkl-spacing-16) var(--jkl-spacing-12);--jkl-accordion-arrow-top:1.4375rem}}[data-density=compact],[data-layout-density=compact]{--jkl-accordion-title-padding:var(--jkl-spacing-8) 2rem var(
           --jkl-spacing-8
-      ) var(--jkl-spacing-8);--jkl-accordion-arrow-top:var(--jkl-spacing-8);--jkl-accordion-arrow-right:var(--jkl-spacing-4);--jkl-accordion-content-padding:var(--jkl-spacing-8);--jkl-accordion-icon-opsz:20;--jkl-accordion-icon-size:1.25rem;--title-font-size:var(--jkl-small-font-size);--title-line-height:var(--jkl-small-line-height);--title-font-weight:var(--jkl-small-font-weight);--content-font-size:var(--jkl-small-font-size);--content-line-height:var(--jkl-small-line-height);--content-font-weight:var(--jkl-small-font-weight)}.jkl-accordion{width:100%}.jkl-accordion-item{--background:#0000;--text-color:var(--jkl-color-text-default);--title-text-color:var(--jkl-color-text-interactive);--border-color:var(--jkl-color-border-separator);--jkl-icon-opsz:var(--jkl-accordion-icon-opsz);--jkl-icon-size:var(--jkl-accordion-icon-size);background-color:var(--background);border-bottom:.0625rem solid var(--border-color);color:var(--text-color);transition-duration:.1s;transition-property:border-color;transition-timing-function:ease}.jkl-accordion-item:hover{--border-color:var(--jkl-color-border-separator-hover)}.jkl-accordion-item:hover:not(:first-child){border-top:.0625rem solid var(--border-color)}.jkl-accordion-item:has(+:hover),.jkl-accordion-item:has(+[open]){border-bottom:none}.jkl-accordion-item[open]{--background:var(--jkl-color-background-container-high);border-top:.0625rem solid var(--border-color)}.jkl-accordion-item[open] .jkl-accordion-item__title{--jkl-icon-weight:500;font-weight:700;letter-spacing:-.014em}.jkl-accordion-item__title{background-color:initial;border-style:none;box-sizing:border-box;color:var(--title-text-color);cursor:pointer;font-size:var(--title-font-size);font-weight:var(--title-font-weight);line-height:var(--title-line-height);list-style:none;padding:var(--jkl-accordion-title-padding);position:relative;text-align:left;width:100%}.jkl-accordion-item__title,.jkl-accordion-item__title:active,.jkl-accordion-item__title:focus,.jkl-accordion-item__title:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-accordion-item__title{border-style:revert}.jkl-accordion-item__title,.jkl-accordion-item__title:active,.jkl-accordion-item__title:focus,.jkl-accordion-item__title:hover{outline:revert;outline-style:revert}}.jkl-accordion-item__title::-webkit-details-marker{display:none}.jkl-accordion-item__title:hover{--title-text-color:var(--jkl-color-text-interactive-hover)}.jkl-accordion-item__title:hover .jkl-accordion-item__arrow{translate:0 .25rem}.jkl-accordion-item__title:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:0}.jkl-accordion-item__arrow{pointer-events:none;position:absolute;right:var(--jkl-accordion-arrow-right);top:var(--jkl-accordion-arrow-top);transition-duration:.1s;transition-property:translate;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-accordion-item__arrow,.jkl-accordion-item__arrow path,.jkl-accordion-item__arrow svg{stroke:ButtonText;fill:ButtonText}}.jkl-accordion-item__content-wrapper{transition-duration:.15s;transition-property:height;transition-timing-function:ease}.jkl-accordion-item__content{font-size:var(--content-font-size);font-weight:var(--content-font-weight);height:auto;line-height:var(--content-line-height);padding:var(--jkl-accordion-content-padding)}@media screen and (forced-colors:active){.jkl-accordion-item:nth-child(n),.jkl-accordion-item:nth-child(n):hover,.jkl-accordion-item:nth-child(n):hover+.jkl-accordion-item{border-top:.125rem solid ButtonText}.jkl-accordion-item:last-child,.jkl-accordion-item:last-child:hover{border-bottom:.125rem solid ButtonText}.jkl-accordion-item__title{background-color:ButtonFace;outline:revert}}
+      ) var(--jkl-spacing-8);--jkl-accordion-arrow-top:var(--jkl-spacing-8);--jkl-accordion-arrow-right:var(--jkl-spacing-4);--jkl-accordion-content-padding:var(--jkl-spacing-8);--jkl-accordion-icon-opsz:20;--jkl-accordion-icon-size:1.25rem;--title-font-size:var(--jkl-small-font-size);--title-line-height:var(--jkl-small-line-height);--title-font-weight:var(--jkl-small-font-weight);--content-font-size:var(--jkl-small-font-size);--content-line-height:var(--jkl-small-line-height);--content-font-weight:var(--jkl-small-font-weight)}.jkl-accordion{width:100%}.jkl-accordion-item{--background:transparent;--text-color:var(--jkl-color-text-default);--title-text-color:var(--jkl-color-text-interactive);--border-color:var(--jkl-color-border-separator);--jkl-icon-opsz:var(--jkl-accordion-icon-opsz);--jkl-icon-size:var(--jkl-accordion-icon-size);background-color:var(--background);border-bottom:.0625rem solid var(--border-color);color:var(--text-color);transition-duration:.1s;transition-property:border-color;transition-timing-function:ease}.jkl-accordion-item:hover{--border-color:var(--jkl-color-border-separator-hover)}.jkl-accordion-item:hover:not(:first-child){border-top:.0625rem solid var(--border-color)}.jkl-accordion-item:has(+:hover),.jkl-accordion-item:has(+[open]){border-bottom:none}.jkl-accordion-item[open]{--background:var(--jkl-color-background-container-high);border-top:.0625rem solid var(--border-color)}.jkl-accordion-item[open] .jkl-accordion-item__title{--jkl-icon-weight:500;font-weight:700;letter-spacing:-.014em}.jkl-accordion-item__title{background-color:transparent;border-style:none;box-sizing:border-box;color:var(--title-text-color);cursor:pointer;font-size:var(--title-font-size);font-weight:var(--title-font-weight);line-height:var(--title-line-height);list-style:none;outline:0;outline-style:none;padding:var(--jkl-accordion-title-padding);position:relative;text-align:left;width:100%}.jkl-accordion-item__title:active,.jkl-accordion-item__title:focus,.jkl-accordion-item__title:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-accordion-item__title{border-style:revert;outline:revert;outline-style:revert}.jkl-accordion-item__title:active,.jkl-accordion-item__title:focus,.jkl-accordion-item__title:hover{outline:revert;outline-style:revert}}.jkl-accordion-item__title::-webkit-details-marker{display:none}.jkl-accordion-item__title:hover{--title-text-color:var(--jkl-color-text-interactive-hover)}.jkl-accordion-item__title:hover .jkl-accordion-item__arrow{translate:0 .25rem}.jkl-accordion-item__title:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:0}.jkl-accordion-item__arrow{pointer-events:none;position:absolute;right:var(--jkl-accordion-arrow-right);top:var(--jkl-accordion-arrow-top);transition-duration:.1s;transition-property:translate;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-accordion-item__arrow,.jkl-accordion-item__arrow path,.jkl-accordion-item__arrow svg{stroke:ButtonText;fill:ButtonText}}.jkl-accordion-item__content-wrapper{transition-duration:.15s;transition-property:height;transition-timing-function:ease}.jkl-accordion-item__content{font-size:var(--content-font-size);font-weight:var(--content-font-weight);height:auto;line-height:var(--content-line-height);padding:var(--jkl-accordion-content-padding)}@media screen and (forced-colors:active){.jkl-accordion-item:nth-child(n){border-top:.125rem solid ButtonText}.jkl-accordion-item:nth-child(n):hover{border-top:.125rem solid ButtonText}.jkl-accordion-item:nth-child(n):hover+.jkl-accordion-item{border-top:.125rem solid ButtonText}.jkl-accordion-item:last-child{border-bottom:.125rem solid ButtonText}.jkl-accordion-item:last-child:hover{border-bottom:.125rem solid ButtonText}.jkl-accordion-item__title{background-color:ButtonFace;outline:revert}}

package/styles/components/button/button.css

@@ -42,6 +42,31 @@
   }
 }
 
+@property --hover-opacity {
+  syntax: "<number>";
+  initial-value: 0;
+  inherits: false;
+}
+@property --jkl-button-flash-radius {
+  syntax: "<length-percentage>";
+  initial-value: 0%;
+  inherits: false;
+}
+@property --jkl-button-flash-opacity {
+  syntax: "<number>";
+  initial-value: 0;
+  inherits: false;
+}
+@keyframes button-fade-ucda7ew {
+  from {
+    --jkl-button-flash-opacity: 0.5;
+  }
+}
+@keyframes button-grow-ucda7ep {
+  to {
+    --jkl-button-flash-radius: 150%;
+  }
+}
 .jkl-button {
   --jkl-icon-weight: var(--jkl-button-icon-weight, initial);
   --text-color: var(--jkl-color-text-default);
@@ -54,7 +79,7 @@
   line-height: var(--jkl-button-line-height);
   cursor: pointer;
   user-select: none;
-  background-color: var(--background-color);
+  background: linear-gradient(color(from var(--text-color) sRGB r g b/var(--hover-opacity)) 100%, transparent 100%), radial-gradient(circle at var(--jkl-touch-xcoord, 50%) var(--jkl-touch-ycoord, 50%), color(from var(--text-color) sRGB r g b/var(--jkl-button-flash-opacity)) calc(var(--jkl-button-flash-radius) - 1px), transparent var(--jkl-button-flash-radius, 0%)), var(--background-color);
   color: var(--text-color);
   border: unset;
   text-decoration: none;
@@ -65,9 +90,10 @@
   position: relative;
   overflow: hidden;
   max-width: 100%;
+  animation: a 0.3s linear;
   transition-timing-function: ease;
   transition-duration: 150ms;
-  transition-property: scale;
+  transition-property: --hover-opacity;
 }
 .jkl-button:has(.jkl-icon:first-child) {
   padding-inline-start: var(--jkl-button-padding-icon);
@@ -118,37 +144,11 @@
   outline: 3px solid var(--jkl-color-border-action);
   outline-offset: 3px;
 }
-.jkl-button::before {
-  content: "";
-  pointer-events: none;
-  display: block;
-  position: absolute;
-  left: var(--jkl-touch-xcoord, 50%);
-  top: var(--jkl-touch-ycoord, 50%);
-  translate: -100%, -100%;
-  transform-origin: center;
-  border-radius: 9999px;
-  background-color: var(--text-color);
-  opacity: 0;
-  width: 1rem;
-  height: 1rem;
-}
-.jkl-button::after {
-  content: "";
-  opacity: 0;
-  position: absolute;
-  inset: 0;
-  border-radius: inherit;
-  background-color: var(--text-color);
-  transition-timing-function: ease;
-  transition-duration: 150ms;
-  transition-property: opacity;
-}
-.jkl-button:hover::after {
-  opacity: 0.15;
+.jkl-button:hover {
+  --hover-opacity: 0.15;
 }
-html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
-  animation: cubic-bezier(0.6, 0.2, 0.35, 1) 250ms jkl-tertiary-flash-unvbxgx;
+.jkl-button.jkl-button--pressed {
+  animation-name: button-fade-ucda7ew, button-grow-ucda7ep;
 }
 .jkl-button--primary, .jkl-button--secondary, .jkl-button--ghost {
   --border-radius: 999px;
@@ -160,43 +160,13 @@ html[data-touchnavigation] .jkl-button.jkl-button--pressed::before {
 .jkl-button--secondary {
   border: var(--border-width) solid var(--text-color);
 }
-.jkl-button--secondary::after {
-  content: "";
-  position: absolute;
-  inset: 0;
-}
 .jkl-button--tertiary {
   border-bottom: var(--border-width) solid var(--text-color);
   padding-inline: var(--jkl-button-teritary-padding-icon);
 }
-.jkl-button--tertiary::after {
-  content: "";
-  position: absolute;
-  inset: 0;
-  border-radius: var(--border-radius);
-}
 .jkl-button--tertiary:has(.jkl-icon:first-child) {
   padding-inline: var(--jkl-button-teritary-padding-icon) calc(var(--jkl-button-teritary-padding-icon) * 2);
 }
 .jkl-button--tertiary:has(.jkl-icon:last-child) {
   padding-inline: calc(var(--jkl-button-teritary-padding-icon) * 2) var(--jkl-button-teritary-padding-icon);
-}
-.jkl-button--ghost, .jkl-button--ghost:has(.jkl-icon:first-child), .jkl-button--ghost:has(.jkl-icon:last-child) {
-  transition-timing-function: ease;
-  transition-duration: 150ms;
-  transition-property: background-color;
-}
-.jkl-button--ghost:hover, .jkl-button--ghost:has(.jkl-icon:first-child):hover, .jkl-button--ghost:has(.jkl-icon:last-child):hover {
-  --background-color: var(--jkl-color-background-interactive-hover);
-}
-
-@keyframes jkl-tertiary-flash-unvbxgx {
-  0% {
-    opacity: 0.5;
-    scale: 1;
-  }
-  100% {
-    opacity: 0;
-    scale: 8;
-  }
 }

package/styles/components/button/button.min.css

@@ -1 +1 @@
-:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-padding-block:0.5rem;--jkl-button-padding-text:calc(var(--jkl-unit-10)*3);--jkl-button-padding-icon:calc(var(--jkl-unit-10)*2);--jkl-button-padding-icon-button:0.5rem;--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1.125rem;--jkl-button-line-height:1.75rem}@media (min-width:680px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-font-size:1.25rem;--jkl-button-line-height:2rem}}[data-density=compact],[data-layout-density=compact]{--jkl-button-padding-block:calc(var(--jkl-unit-10)*0.5);--jkl-button-padding-text:calc(var(--jkl-unit-10)*1.5);--jkl-button-padding-icon:0.5rem;--jkl-button-padding-icon-button:calc(var(--jkl-unit-10)*0.5);--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.25);--jkl-button-padding-ghost-inline:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem}@media (min-width:680px){[data-density=compact],[data-layout-density=compact]{--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem;--jkl-button-icon-weight:500}}.jkl-button{--jkl-icon-weight:var(--jkl-button-icon-weight,initial);--text-color:var(--jkl-color-text-default);--background-color:#0000;--border-radius:0;--border-width:0.0625rem;background-color:var(--background-color);border:unset;color:var(--text-color);cursor:pointer;display:inline-block;font-size:var(--jkl-button-font-size);font-weight:700;line-height:var(--jkl-button-line-height);text-decoration:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:var(--border-radius);max-width:100%;overflow:hidden;padding-block:var(--jkl-button-padding-block);padding-inline:var(--jkl-button-padding-text);position:relative;transition-duration:.15s;transition-property:scale;transition-timing-function:ease}.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{align-items:center;display:flex;flex-direction:row;gap:calc(var(--jkl-unit-10)*.25);pointer-events:none;transition-duration:.25s;transition-property:translate;transition-timing-function:ease;width:100%}.jkl-button__loader{left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition-duration:.25s;transition-property:opacity,translate;transition-timing-function:ease;translate:-50% 350%}.jkl-button__text{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.jkl-button[data-loading=true] .jkl-button__label{translate:0 -120%}.jkl-button[data-loading=true] .jkl-button__loader{opacity:1;translate:-50% -50%}.jkl-button:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-button:before{border-radius:9999px;display:block;height:1rem;left:var(--jkl-touch-xcoord,50%);pointer-events:none;top:var(--jkl-touch-ycoord,50%);transform-origin:center;translate:-100%,-100%;width:1rem}.jkl-button:after,.jkl-button:before{background-color:var(--text-color);content:"";opacity:0;position:absolute}.jkl-button:after{border-radius:inherit;inset:0;transition-duration:.15s;transition-property:opacity;transition-timing-function:ease}.jkl-button:hover:after{opacity:.15}html[data-touchnavigation] .jkl-button.jkl-button--pressed:before{animation:jkl-tertiary-flash-unvbxgx .25s cubic-bezier(.6,.2,.35,1)}.jkl-button--ghost,.jkl-button--primary,.jkl-button--secondary{--border-radius:999px}.jkl-button--primary{--background-color:var(--jkl-color-background-action);--text-color:var(--jkl-color-text-on-action)}.jkl-button--secondary{border:var(--border-width) solid var(--text-color)}.jkl-button--secondary:after{content:"";inset:0;position:absolute}.jkl-button--tertiary{border-bottom:var(--border-width) solid var(--text-color);padding-inline:var(--jkl-button-teritary-padding-icon)}.jkl-button--tertiary:after{border-radius:var(--border-radius);content:"";inset:0;position:absolute}.jkl-button--tertiary:has(.jkl-icon:first-child){padding-inline:var(--jkl-button-teritary-padding-icon) calc(var(--jkl-button-teritary-padding-icon)*2)}.jkl-button--tertiary:has(.jkl-icon:last-child){padding-inline:calc(var(--jkl-button-teritary-padding-icon)*2) var(--jkl-button-teritary-padding-icon)}.jkl-button--ghost,.jkl-button--ghost:has(.jkl-icon:first-child),.jkl-button--ghost:has(.jkl-icon:last-child){transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}.jkl-button--ghost:has(.jkl-icon:first-child):hover,.jkl-button--ghost:has(.jkl-icon:last-child):hover,.jkl-button--ghost:hover{--background-color:var(--jkl-color-background-interactive-hover)}@keyframes jkl-tertiary-flash-unvbxgx{0%{opacity:.5;scale:1}to{opacity:0;scale:8}}
+:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-padding-block:0.5rem;--jkl-button-padding-text:calc(var(--jkl-unit-10)*3);--jkl-button-padding-icon:calc(var(--jkl-unit-10)*2);--jkl-button-padding-icon-button:0.5rem;--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1.125rem;--jkl-button-line-height:1.75rem}@media (min-width:680px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-font-size:1.25rem;--jkl-button-line-height:2rem}}[data-density=compact],[data-layout-density=compact]{--jkl-button-padding-block:calc(var(--jkl-unit-10)*0.5);--jkl-button-padding-text:calc(var(--jkl-unit-10)*1.5);--jkl-button-padding-icon:0.5rem;--jkl-button-padding-icon-button:calc(var(--jkl-unit-10)*0.5);--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.25);--jkl-button-padding-ghost-inline:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem}@media (min-width:680px){[data-density=compact],[data-layout-density=compact]{--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem;--jkl-button-icon-weight:500}}@property --hover-opacity{syntax:"<number>";initial-value:0;inherits:false}@property --jkl-button-flash-radius{syntax:"<length-percentage>";initial-value:0;inherits:false}@property --jkl-button-flash-opacity{syntax:"<number>";initial-value:0;inherits:false}@keyframes button-fade-ucda7ew{0%{--jkl-button-flash-opacity:0.5}}@keyframes button-grow-ucda7ep{to{--jkl-button-flash-radius:150%}}.jkl-button{--jkl-icon-weight:var(--jkl-button-icon-weight,initial);--text-color:var(--jkl-color-text-default);--background-color:transparent;--border-radius:0;--border-width:0.0625rem;background:linear-gradient(color(from var(--text-color) sRGB r g b/var(--hover-opacity)) 100%,transparent 100%),radial-gradient(circle at var(--jkl-touch-xcoord,50%) var(--jkl-touch-ycoord,50%),color(from var(--text-color) sRGB r g b/var(--jkl-button-flash-opacity)) calc(var(--jkl-button-flash-radius) - 1px),transparent var(--jkl-button-flash-radius,0)),var(--background-color);border:unset;color:var(--text-color);cursor:pointer;display:inline-block;font-size:var(--jkl-button-font-size);font-weight:700;line-height:var(--jkl-button-line-height);text-decoration:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;animation:a .3s linear;border-radius:var(--border-radius);max-width:100%;overflow:hidden;padding-block:var(--jkl-button-padding-block);padding-inline:var(--jkl-button-padding-text);position:relative;transition-duration:.15s;transition-property:--hover-opacity;transition-timing-function:ease}.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{align-items:center;display:flex;flex-direction:row;gap:calc(var(--jkl-unit-10)*.25);pointer-events:none;transition-duration:.25s;transition-property:translate;transition-timing-function:ease;width:100%}.jkl-button__loader{left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition-duration:.25s;transition-property:opacity,translate;transition-timing-function:ease;translate:-50% 350%}.jkl-button__text{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.jkl-button[data-loading=true] .jkl-button__label{translate:0 -120%}.jkl-button[data-loading=true] .jkl-button__loader{opacity:1;translate:-50% -50%}.jkl-button:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-button:hover{--hover-opacity:0.15}.jkl-button.jkl-button--pressed{animation-name:button-fade-ucda7ew,button-grow-ucda7ep}.jkl-button--ghost,.jkl-button--primary,.jkl-button--secondary{--border-radius:999px}.jkl-button--primary{--background-color:var(--jkl-color-background-action);--text-color:var(--jkl-color-text-on-action)}.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-teritary-padding-icon)}.jkl-button--tertiary:has(.jkl-icon:first-child){padding-inline:var(--jkl-button-teritary-padding-icon) calc(var(--jkl-button-teritary-padding-icon)*2)}.jkl-button--tertiary:has(.jkl-icon:last-child){padding-inline:calc(var(--jkl-button-teritary-padding-icon)*2) var(--jkl-button-teritary-padding-icon)}

package/styles/components/button/button.scss

@@ -2,7 +2,8 @@
 @use "sass:string";
 @use "../../core/jkl";
 
-$_flash-animation-name: jkl-tertiary-flash-#{string.unique-id()};
+$_grow-animation-name: button-grow-#{string.unique-id()};
+$_fade-animation-name: button-fade-#{string.unique-id()};
 
 @include jkl.comfortable-density-variables {
     --jkl-button-padding-block: #{jkl.$unit-10};
@@ -36,6 +37,40 @@ $_flash-animation-name: jkl-tertiary-flash-#{string.unique-id()};
     }
 }
 
+// Custom variabler, definert slik at de kan animeres
+
+// Egenskap for hover-effekt
+@property --hover-opacity {
+    syntax: "<number>";
+    initial-value: 0;
+    inherits: false;
+}
+
+// Egenskaper for touch-effekt
+@property --jkl-button-flash-radius {
+    syntax: "<length-percentage>";
+    initial-value: 0%;
+    inherits: false;
+}
+@property --jkl-button-flash-opacity {
+    syntax: "<number>";
+    initial-value: 0;
+    inherits: false;
+}
+
+// Definer animasjoner for touch-effekt
+@keyframes #{$_fade-animation-name} {
+    from {
+        --jkl-button-flash-opacity: 0.5;
+    }
+}
+
+@keyframes #{$_grow-animation-name} {
+    to {
+        --jkl-button-flash-radius: 150%;
+    }
+}
+
 .jkl-button {
     --jkl-icon-weight: var(--jkl-button-icon-weight, initial);
     --text-color: var(--jkl-color-text-default);
@@ -49,10 +84,27 @@ $_flash-animation-name: jkl-tertiary-flash-#{string.unique-id()};
     font-size: var(--jkl-button-font-size);
     line-height: var(--jkl-button-line-height);
 
-    // button and link resets
     cursor: pointer;
     user-select: none;
-    background-color: var(--background-color);
+    background:
+        // Lag 1: heldekkende "gradient" for hovereffekt
+        linear-gradient(
+            color(from var(--text-color) sRGB r g b / var(--hover-opacity)) 100%,
+            transparent 100%
+        ),
+        // Lag 2: touch-effekt
+        radial-gradient(
+                circle at var(--jkl-touch-xcoord, 50%)
+                    var(--jkl-touch-ycoord, 50%),
+                color(
+                        from var(--text-color) sRGB r g b /
+                            var(--jkl-button-flash-opacity)
+                    )
+                    calc(var(--jkl-button-flash-radius) - 1px),
+                transparent var(--jkl-button-flash-radius, 0%)
+            ),
+        // Lag 3: faktisk bakgrunnsfarge
+        var(--background-color);
     color: var(--text-color);
     border: unset;
     text-decoration: none;
@@ -64,8 +116,9 @@ $_flash-animation-name: jkl-tertiary-flash-#{string.unique-id()};
     position: relative;
     overflow: hidden;
     max-width: 100%;
+    animation: a 0.3s linear;
 
-    @include jkl.motion("standard", "productive", scale);
+    @include jkl.motion("standard", "productive", --hover-opacity);
 
     &:has(.jkl-icon:first-child) {
         padding-inline-start: var(--jkl-button-padding-icon);
@@ -125,42 +178,12 @@ $_flash-animation-name: jkl-tertiary-flash-#{string.unique-id()};
         @include jkl.focus-outline;
     }
 
-    // Dette er elementet som viser touch-animasjon
-    &::before {
-        content: "";
-        pointer-events: none;
-        display: block;
-        position: absolute;
-        left: var(--jkl-touch-xcoord, 50%);
-        top: var(--jkl-touch-ycoord, 50%);
-        translate: -100%, -100%;
-        transform-origin: center;
-        border-radius: 9999px;
-        background-color: var(--text-color);
-        opacity: 0;
-        width: jkl.rem(16px);
-        height: jkl.rem(16px);
-    }
-
-    &::after {
-        content: "";
-        opacity: 0;
-        position: absolute;
-        inset: 0;
-        border-radius: inherit;
-        background-color: var(--text-color);
-        @include jkl.motion("standard", "productive", opacity);
-    }
-
     &:hover {
-        &::after {
-            opacity: 0.15;
-        }
+        --hover-opacity: 0.15;
     }
 
-    html[data-touchnavigation] &.jkl-button--pressed::before {
-        animation: jkl.easing("focus") jkl.timing("expressive")
-            $_flash-animation-name;
+    &.jkl-button--pressed {
+        animation-name: #{$_fade-animation-name}, #{$_grow-animation-name};
     }
 
     &--primary,
@@ -176,57 +199,20 @@ $_flash-animation-name: jkl-tertiary-flash-#{string.unique-id()};
 
     &--secondary {
         border: var(--border-width) solid var(--text-color);
-
-        &::after {
-            content: "";
-            position: absolute;
-            inset: 0;
-        }
     }
 
     &--tertiary {
         border-bottom: var(--border-width) solid var(--text-color);
         padding-inline: var(--jkl-button-teritary-padding-icon);
 
-        &::after {
-            content: "";
-            position: absolute;
-            inset: 0;
-            border-radius: var(--border-radius);
-        }
-
         &:has(.jkl-icon:first-child) {
-            padding-inline: var(--jkl-button-teritary-padding-icon) calc(
-                var(--jkl-button-teritary-padding-icon) * 2
-            );
+            padding-inline: var(--jkl-button-teritary-padding-icon)
+                calc(var(--jkl-button-teritary-padding-icon) * 2);
         }
 
         &:has(.jkl-icon:last-child) {
-            padding-inline: calc(
-                var(--jkl-button-teritary-padding-icon) * 2
-            ) var(--jkl-button-teritary-padding-icon);
-        }
-    }
-
-    &--ghost,
-    &--ghost:has(.jkl-icon:first-child),
-    &--ghost:has(.jkl-icon:last-child) {
-        @include jkl.motion("standard", "productive", background-color);
-
-        &:hover {
-            --background-color: var(--jkl-color-background-interactive-hover);
+            padding-inline: calc(var(--jkl-button-teritary-padding-icon) * 2)
+                var(--jkl-button-teritary-padding-icon);
         }
     }
 }
-
-@keyframes #{$_flash-animation-name} {
-    0% {
-        opacity: 0.5;
-        scale: 1;
-    }
-
-    100% {
-        opacity: 0;
-        scale: 8;
-    }
-}

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)}
+@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 rgba(37,42,49,.1);--jkl-nav-card-shadow--hover:0 0.375rem 1.5625rem rgba(37,42,49,.12);--jkl-nav-card-info-border-color:#c8c5c3}}[data-theme=light]{--jkl-nav-card-background:#fff;--jkl-nav-card-shadow:0 0.25rem 0.9375rem rgba(37,42,49,.1);--jkl-nav-card-shadow--hover:0 0.375rem 1.5625rem rgba(37,42,49,.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-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 rgba(37,42,49,.03)}}[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 rgba(37,42,49,.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:#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:transparent;--border-width:0.0625rem;--background-color:transparent;background-color:var(--background-color);border-radius:var(--border-radius);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:after{border:var(--border-width) solid var(--border-color);border-radius:var(--border-radius);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/checkbox/checkbox.css

@@ -32,7 +32,7 @@
   --jkl-checkbox-line-height: 1.5rem;
 }
 
-@keyframes jkl-checkbox-checked-uvv9ih8 {
+@keyframes jkl-checkbox-checked-urd0965 {
   0% {
     width: 0;
     height: 0;
@@ -46,7 +46,7 @@
     height: 58%;
   }
 }
-@keyframes jkl-checkbox-indeterminate-uvv9ii7 {
+@keyframes jkl-checkbox-indeterminate-urd096c {
   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-uvv9ih8 150ms ease-in-out forwards;
+  animation: jkl-checkbox-checked-urd0965 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-uvv9ii7 150ms ease-in-out forwards;
+  animation: jkl-checkbox-indeterminate-urd096c 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-uvv9ih8{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-uvv9ii7{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-uvv9ih8 .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-uvv9ii7 .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-urd0965{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-urd096c{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:transparent;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-urd0965 .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-urd096c .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-uexf4z5 {
+@keyframes jkl-checkbox-checked-uoic0kx {
   0% {
     width: 0;
     height: 0;
@@ -125,7 +125,7 @@
   }
 }
 .jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
-  animation: jkl-checkbox-checked-uexf4z5 150ms ease-in-out forwards;
+  animation: jkl-checkbox-checked-uoic0kx 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-uexf4z5{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-uexf4z5 .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:transparent;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-uoic0kx{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}.jkl-checkbox-panel{--checkbox-background-color:transparent;--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-uoic0kx .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.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:transparent;--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)}

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--invalid .jkl-combobox__search-input::selection{background-color:var(--jkl-combobox-search-input-selection-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:transparent;--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:rgba(27,25,23,.2);--jkl-combobox-search-input-error-selection-color:rgba(27,25,23,.2);--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:transparent;--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:rgba(27,25,23,.2);--jkl-combobox-search-input-error-selection-color:rgba(27,25,23,.2);--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:transparent;--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:hsla(0,0%,98%,.25);--jkl-combobox-search-input-error-selection-color:rgba(27,25,23,.2);--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:transparent;--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:hsla(0,0%,98%,.25);--jkl-combobox-search-input-error-selection-color:rgba(27,25,23,.2);--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;outline:0;outline-style:none;position:relative}.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;outline: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{border:.0625rem solid var(--jkl-combobox-border-color);border-radius:.1875rem;box-shadow:0 0 0 .0625rem transparent;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--invalid .jkl-combobox__search-input::selection{background-color:var(--jkl-combobox-search-input-selection-color)}.jkl-combobox--menu-closed .jkl-combobox__search-input{background-color:transparent;padding-right:0;position:absolute;width:94%}.jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions{transform:translateY(-.1875rem)}

package/styles/components/cookie-consent/cookie-consent.min.css

@@ -1 +1 @@
-.jkl-cookie-consent-modal{position:fixed;z-index:9000!important}.jkl-cookie-consent-modal[aria-hidden=true]{display:none}.jkl-cookie-consent-modal>.jkl-cookie-consent-modal__overlay{background:#0000004d;inset:0;position:fixed;transition:.2s}.jkl-cookie-consent-modal__info-text{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20}.jkl-cookie-consent-modal__checkbox{margin-bottom:.5rem;margin-top:calc(var(--jkl-unit-10)*3)}
+.jkl-cookie-consent-modal{position:fixed;z-index:9000!important}.jkl-cookie-consent-modal[aria-hidden=true]{display:none}.jkl-cookie-consent-modal>.jkl-cookie-consent-modal__overlay{background:rgba(0,0,0,.3);inset:0;position:fixed;transition:.2s}.jkl-cookie-consent-modal__info-text{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20}.jkl-cookie-consent-modal__checkbox{margin-bottom:.5rem;margin-top:calc(var(--jkl-unit-10)*3)}

package/styles/components/countdown/countdown.css

@@ -26,11 +26,11 @@
   }
 }
 .jkl-countdown__tracker {
-  animation: jkl-downcount-uho34ll var(--duration) linear forwards;
+  animation: jkl-downcount-udpbilw var(--duration) linear forwards;
   animation-play-state: var(--play-state, running);
 }
 
-@keyframes jkl-downcount-uho34ll {
+@keyframes jkl-downcount-udpbilw {
   from {
     width: 100%;
   }

package/styles/components/countdown/countdown.min.css

@@ -1 +1 @@
-.jkl-countdown{--track-color:var(--jkl-color-border-separator);--bar-color:var(--jkl-color-border-input-focus);--bar-height:0.25rem;background-color:var(--track-color);border-radius:6.25rem;height:var(--bar-height);overflow:hidden;width:100%}.jkl-countdown__tracker{background-color:var(--bar-color);display:block;height:var(--bar-height)}@media screen and (forced-colors:active){.jkl-countdown{background-color:Canvas}.jkl-countdown__tracker{background-color:CanvasText}}.jkl-countdown__tracker{animation:jkl-downcount-uho34ll var(--duration) linear forwards;animation-play-state:var(--play-state,running)}@keyframes jkl-downcount-uho34ll{0%{width:100%}to{width:0}}
+.jkl-countdown{--track-color:var(--jkl-color-border-separator);--bar-color:var(--jkl-color-border-input-focus);--bar-height:0.25rem;background-color:var(--track-color);border-radius:6.25rem;height:var(--bar-height);overflow:hidden;width:100%}.jkl-countdown__tracker{background-color:var(--bar-color);display:block;height:var(--bar-height)}@media screen and (forced-colors:active){.jkl-countdown{background-color:Canvas}.jkl-countdown__tracker{background-color:CanvasText}}.jkl-countdown__tracker{animation:jkl-downcount-udpbilw var(--duration) linear forwards;animation-play-state:var(--play-state,running)}@keyframes jkl-downcount-udpbilw{0%{width:100%}to{width:0}}