@fremtind/jokul 0.37.9 → 0.37.11

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 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:.75rem 1.5rem}.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-spacing-4);--padding-m:var(--jkl-spacing-12);--padding-l:var(--jkl-spacing-16);--padding-xl:var(--jkl-spacing-24);--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-spacing-8);--padding-m:var(--jkl-spacing-16);--padding-l:var(--jkl-spacing-24);--padding-xl:var(--jkl-spacing-32)}}.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:2px solid var(--jkl-color-border-action);outline-offset:2px}.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:.75rem 1.5rem}.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-spacing-4);--padding-m:var(--jkl-spacing-12);--padding-l:var(--jkl-spacing-16);--padding-xl:var(--jkl-spacing-24);--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-spacing-8);--padding-m:var(--jkl-spacing-16);--padding-l:var(--jkl-spacing-24);--padding-xl:var(--jkl-spacing-32)}}.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-uros1i4 {
+@keyframes jkl-checkbox-checked-uep3eup {
   0% {
     width: 0;
     height: 0;
@@ -46,7 +46,7 @@
     height: 58%;
   }
 }
-@keyframes jkl-checkbox-indeterminate-uros1iq {
+@keyframes jkl-checkbox-indeterminate-uep3ev9 {
   0% {
     width: 0;
   }
@@ -74,24 +74,26 @@
   top: -6px;
 }
 .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
-  animation: jkl-checkbox-checked-uros1i4 150ms ease-in-out forwards;
+  animation: jkl-checkbox-checked-uep3eup 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-uros1iq 150ms ease-in-out forwards;
+  animation: jkl-checkbox-indeterminate-uep3ev9 150ms 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 {
-  --background-color: var(--jkl-color-background-input-focus);
-  outline: 2px solid var(--jkl-color-border-action);
-  outline-offset: 2px;
+  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 {
   display: flex;
   min-width: 0;
@@ -102,9 +104,6 @@
 .jkl-checkbox__label:hover .jkl-checkbox__mark, .jkl-checkbox__label:active .jkl-checkbox__mark {
   outline: 1px solid var(--box-color);
 }
-.jkl-checkbox__label:active {
-  --background-color: var(--jkl-color-background-input-focus);
-}
 .jkl-checkbox__text {
   margin: calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-line-height)) * 0.5) 0;
   translate: 0 0.0625rem;

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-uros1i4{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-uros1iq{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{opacity:0;position:absolute;top:-6px}.jkl-checkbox__input:checked+.jkl-checkbox__label .jkl-checkbox__check-mark:after{animation:jkl-checkbox-checked-uros1i4 .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-uros1iq .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{--background-color:var(--jkl-color-background-input-focus);outline:2px solid var(--jkl-color-border-action);outline-offset:2px}.jkl-checkbox__input:disabled+.jkl-checkbox__label{color:var(--jkl-checkbox-disabled-color)}.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__label:active{--background-color:var(--jkl-color-background-input-focus)}.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{align-self:flex-start;background-color:var(--background-color);border:1px solid;border-color:var(--box-color);border-radius:0;box-sizing:border-box;flex-shrink:0;height:var(--jkl-checkbox-box-size);margin-block:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-box-size))*.5);margin-inline-end:var(--jkl-spacing-8);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__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:1.5rem}.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-uep3eup{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-uep3ev9{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{opacity:0;position:absolute;top:-6px}.jkl-checkbox__input:checked+.jkl-checkbox__label .jkl-checkbox__check-mark:after{animation:jkl-checkbox-checked-uep3eup .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-uep3ev9 .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{align-self:flex-start;background-color:var(--background-color);border:1px solid;border-color:var(--box-color);border-radius:0;box-sizing:border-box;flex-shrink:0;height:var(--jkl-checkbox-box-size);margin-block:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-box-size))*.5);margin-inline-end:var(--jkl-spacing-8);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__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:1.5rem}.jkl-checkbox--error{--background-color:var(--jkl-color-background-alert-error);--check-color:var(--jkl-color-text-on-alert)}

package/styles/components/checkbox/checkbox.scss

@@ -78,7 +78,6 @@ $_checkbox-indeterminate-animation-name: jkl-checkbox-indeterminate-#{string.uni
         // Position the hidden input so that Cypress can hit it without it being obscured by the visual checkbox
         top: -6px;
 
-        // Checked state:
         &:checked {
             + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
                 animation: $_checkbox-checked-animation-name
@@ -87,7 +86,6 @@ $_checkbox-indeterminate-animation-name: jkl-checkbox-indeterminate-#{string.uni
             }
         }
 
-        // Indeterminate state:
         &:indeterminate:not(:checked) {
             + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
                 animation: $_checkbox-indeterminate-animation-name
@@ -96,20 +94,21 @@ $_checkbox-indeterminate-animation-name: jkl-checkbox-indeterminate-#{string.uni
             }
         }
 
-        // Focused state:
         &:focus-visible + .jkl-checkbox__label {
             color: var(--jkl-checkbox-focus-color);
 
             & > .jkl-checkbox__mark {
-                --background-color: var(--jkl-color-background-input-focus);
                 @include jkl.focus-outline;
             }
         }
 
-        // Disabled state:
         &:disabled + .jkl-checkbox__label {
             color: var(--jkl-checkbox-disabled-color);
         }
+
+        &:active {
+            --background-color: var(--jkl-color-background-input-focus);
+        }
     }
 
     &__label {
@@ -125,10 +124,6 @@ $_checkbox-indeterminate-animation-name: jkl-checkbox-indeterminate-#{string.uni
                 outline: 1px solid var(--box-color);
             }
         }
-
-        &:active {
-            --background-color: var(--jkl-color-background-input-focus);
-        }
     }
 
     &__text {

package/styles/components/chip/chip.css

@@ -69,8 +69,8 @@
   transition-property: opacity;
 }
 .jkl-chip:focus-visible {
-  outline: 2px solid var(--jkl-color-border-action);
-  outline-offset: 2px;
+  outline: 3px solid var(--jkl-color-border-action);
+  outline-offset: 3px;
 }
 .jkl-chip:hover::after {
   opacity: 0.15;

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

@@ -1 +1 @@
-[data-density=compact],[data-layout-density=compact]{--padding-inline-s:0.5rem;--padding-inline-l:0.75rem;--padding-icon-s:0.25rem;--padding-icon-l:0.5rem;--height-l:2rem;--height-s:1.5rem;--gap-s:0.125rem;--gap-l:0.25rem}:root,[data-density=comfortable],[data-layout-density=comfortable]{--padding-inline-s:0.75rem;--padding-inline-l:1rem;--padding-icon-s:0.5rem;--padding-icon-l:0.75rem;--height-l:2.5rem;--height-s:2rem;--gap-s:0.25rem;--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:2px solid var(--jkl-color-border-action);outline-offset:2px}.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){padding-inline-end:var(--padding-icon)}
+[data-density=compact],[data-layout-density=compact]{--padding-inline-s:0.5rem;--padding-inline-l:0.75rem;--padding-icon-s:0.25rem;--padding-icon-l:0.5rem;--height-l:2rem;--height-s:1.5rem;--gap-s:0.125rem;--gap-l:0.25rem}:root,[data-density=comfortable],[data-layout-density=comfortable]{--padding-inline-s:0.75rem;--padding-inline-l:1rem;--padding-icon-s:0.5rem;--padding-icon-l:0.75rem;--height-l:2.5rem;--height-s:2rem;--gap-s:0.25rem;--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){padding-inline-end:var(--padding-icon)}

package/styles/components/combobox/combobox.css

@@ -164,12 +164,14 @@
 .jkl-combobox__wrapper--active-value {
   padding: var(--jkl-combobox-button-active-value-padding);
 }
-.jkl-combobox__wrapper:focus {
-  border-color: var(--jkl-combobox-focus-color);
-  color: var(--jkl-combobox-focus-color);
-  box-shadow: 0 0 0 0.0625rem var(--jkl-combobox-focus-color);
+.jkl-combobox__wrapper:has(:focus-visible) {
+  outline: 3px solid var(--jkl-color-border-action);
+  outline-offset: 3px;
   background-color: var(--jkl-combobox-open-background-color);
 }
+.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 0.0625rem var(--jkl-combobox-focus-color);
@@ -234,7 +236,6 @@
   right: -0.0625rem;
   background-color: var(--jkl-combobox-open-background-color);
   border: 0.125rem solid var(--jkl-combobox-focus-color);
-  border-top: none;
   border-radius: 0 0 0.1875rem 0.1875rem;
   box-sizing: border-box;
   max-height: calc((var(--jkl-combobox-max-shown-options, 5) + 0.5) * var(--jkl-combobox-input-height));
@@ -320,18 +321,12 @@
 .jkl-combobox--invalid .jkl-combobox__search-input::selection {
   background-color: var(--jkl-combobox-search-input-selection-color);
 }
-.jkl-combobox--menu-open .jkl-combobox__wrapper {
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-  border-color: var(--jkl-combobox-focus-color);
-  box-shadow: 0 0 0 0.0625rem var(--jkl-combobox-focus-color) inset;
-}
-.jkl-combobox--menu-open .jkl-combobox__wrapper:hover ~ .jkl-combobox__arrow {
-  transform: translateY(calc(-50% + -0.1875rem));
-}
 .jkl-combobox--menu-closed .jkl-combobox__search-input {
   position: absolute;
   background-color: transparent;
   width: 94%;
   padding-right: 0;
+}
+.jkl-combobox--menu-open .jkl-combobox__wrapper:hover .jkl-combobox__actions {
+  transform: translateY(-0.1875rem);
 }

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: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 0.75rem;--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 2.5rem 0 0.5rem;--jkl-combobox-option-padding:0.5rem 0.75rem;--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:0.25rem 1.875rem 0.25rem 0.5rem;--jkl-combobox-button-active-value-padding:0.25rem 1.875rem 0.25rem 0.5rem;--jkl-combobox-input-height:2rem;--jkl-combobox-actions-right:0;--jkl-combobox-actions-top:0.375rem;--jkl-combobox-search-input-padding:0.25rem 0.5rem;--jkl-combobox-native-padding:1.5rem 0.25rem 0.25rem;--jkl-combobox-option-padding:0.25rem 0.5rem;--jkl-combobox-option-line-height:1.5rem;--jkl-combobox-input-padding:0.75rem;--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)}.jkl-combobox__wrapper:focus{background-color:var(--jkl-combobox-open-background-color);border-color:var(--jkl-combobox-focus-color);box-shadow:0 0 0 .0625rem var(--jkl-combobox-focus-color);color:var(--jkl-combobox-focus-color)}.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;border-top:none;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:.25rem;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-open .jkl-combobox__wrapper{border-bottom-left-radius:0;border-bottom-right-radius:0;border-color:var(--jkl-combobox-focus-color);box-shadow:0 0 0 .0625rem var(--jkl-combobox-focus-color) inset}.jkl-combobox--menu-open .jkl-combobox__wrapper:hover~.jkl-combobox__arrow{transform:translateY(calc(-50% - .1875rem))}.jkl-combobox--menu-closed .jkl-combobox__search-input{background-color:transparent;padding-right:0;position:absolute;width:94%}
+@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 0.75rem;--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 2.5rem 0 0.5rem;--jkl-combobox-option-padding:0.5rem 0.75rem;--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:0.25rem 1.875rem 0.25rem 0.5rem;--jkl-combobox-button-active-value-padding:0.25rem 1.875rem 0.25rem 0.5rem;--jkl-combobox-input-height:2rem;--jkl-combobox-actions-right:0;--jkl-combobox-actions-top:0.375rem;--jkl-combobox-search-input-padding:0.25rem 0.5rem;--jkl-combobox-native-padding:1.5rem 0.25rem 0.25rem;--jkl-combobox-option-padding:0.25rem 0.5rem;--jkl-combobox-option-line-height:1.5rem;--jkl-combobox-input-padding:0.75rem;--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)}.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:.25rem;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/combobox/combobox.scss

@@ -118,13 +118,15 @@ $_combobox-search-input-selection-color--inverted: color.scale(
             padding: var(--jkl-combobox-button-active-value-padding);
         }
 
-        &:focus {
-            border-color: var(--jkl-combobox-focus-color);
-            color: var(--jkl-combobox-focus-color);
-            box-shadow: 0 0 0 jkl.rem(1px) var(--jkl-combobox-focus-color);
+        &:has(:focus-visible) {
+            @include jkl.focus-outline;
             background-color: var(--jkl-combobox-open-background-color);
         }
 
+        &:has(.jkl-icon-button:focus-visible) {
+            outline: none;
+        }
+
         &:hover {
             border-color: var(--jkl-combobox-focus-color);
             box-shadow: 0 0 0 jkl.rem(1px) var(--jkl-combobox-focus-color);
@@ -190,7 +192,6 @@ $_combobox-search-input-selection-color--inverted: color.scale(
         right: jkl.rem(-1px);
         background-color: var(--jkl-combobox-open-background-color);
         border: jkl.rem(2px) solid var(--jkl-combobox-focus-color);
-        border-top: none;
         border-radius: 0 0 jkl.rem(3px) jkl.rem(3px);
         box-sizing: border-box;
         max-height: calc(
@@ -290,19 +291,6 @@ $_combobox-search-input-selection-color--inverted: color.scale(
         }
     }
 
-    &--menu-open {
-        .jkl-combobox__wrapper {
-            border-bottom-left-radius: 0;
-            border-bottom-right-radius: 0;
-            border-color: var(--jkl-combobox-focus-color);
-            box-shadow: 0 0 0 jkl.rem(1px) var(--jkl-combobox-focus-color) inset;
-
-            &:hover ~ .jkl-combobox__arrow {
-                transform: translateY(calc(-50% + #{jkl.rem(-3px)}));
-            }
-        }
-    }
-
     &--menu-closed {
         .jkl-combobox__search-input {
             position: absolute;
@@ -311,4 +299,10 @@ $_combobox-search-input-selection-color--inverted: color.scale(
             padding-right: 0;
         }
     }
+
+    &--menu-open {
+        .jkl-combobox__wrapper:hover .jkl-combobox__actions {
+            transform: translateY(#{jkl.rem(-3px)});
+        }
+    }
 }

package/styles/components/datepicker/_calendar-date-button.scss

@@ -49,7 +49,7 @@
     width: var(--jkl-calendar-date-size);
     border-radius: 50%;
     background-color: transparent;
-    color: var(--jkl-calendar-text-color);
+    color: var(--jkl-color);
 
     margin: var(--jkl-calendar-date-margin);
 
@@ -83,7 +83,7 @@
         cursor: pointer;
 
         &:hover {
-            color: var(--jkl-calendar-text-color);
+            color: var(--jkl-color);
         }
     }
 
@@ -91,10 +91,7 @@
         color: var(--jkl-calendar-disabled-day-color);
     }
 
-    @include jkl.keyboard-navigation {
-        &:focus {
-            outline: jkl.rem(2px) solid var(--jkl-calendar-focus-color);
-            outline-offset: jkl.rem(2px);
-        }
+    &:focus-visible {
+        @include jkl.focus-outline;
     }
 }

package/styles/components/datepicker/_calendar-navigation-dropdown.scss

@@ -34,11 +34,8 @@
             background-color: var(--jkl-select-open-background-color);
         }
 
-        @include jkl.keyboard-navigation {
-            &:focus {
-                outline: jkl.rem(2px) solid var(--jkl-calendar-focus-color);
-                outline-offset: 1px;
-            }
+        &:focus-visible {
+            @include jkl.focus-outline;
         }
     }
 

package/styles/components/datepicker/_calendar-navigation.scss

@@ -30,7 +30,7 @@
         justify-content: center;
         align-items: center;
         background-color: transparent;
-        color: var(--jkl-calendar-text-color);
+        color: var(--jkl-color);
         width: jkl.rem(40px);
         height: jkl.rem(40px);
 
@@ -40,11 +40,8 @@
             color: var(--jkl-calendar-navigation-arrow-focus-color);
         }
 
-        @include jkl.keyboard-navigation {
-            &:focus {
-                outline: jkl.rem(2px) solid var(--jkl-calendar-focus-color);
-                outline-offset: jkl.rem(-2px);
-            }
+        &:focus-visible {
+            @include jkl.focus-outline($offset: -2px);
         }
 
         &:disabled {

package/styles/components/datepicker/_calendar.scss

@@ -1,19 +1,5 @@
 @use "../../core/jkl";
 
-@include jkl.light-mode-variables {
-    --jkl-calendar-text-color: #{jkl.$color-granitt};
-    --jkl-calendar-background-color: #{jkl.$color-hvit};
-    --jkl-calendar-border-color: #{jkl.$color-granitt};
-    --jkl-calendar-focus-color: #{jkl.$color-granitt};
-}
-
-@include jkl.dark-mode-variables {
-    --jkl-calendar-text-color: #{jkl.$color-snohvit};
-    --jkl-calendar-background-color: #{jkl.$color-skifer};
-    --jkl-calendar-border-color: #{jkl.$color-snohvit};
-    --jkl-calendar-focus-color: #{jkl.$color-snohvit};
-}
-
 @include jkl.comfortable-density-variables {
     --jkl-calendar-padding: var(--jkl-spacing-12) var(--jkl-spacing-16)
         var(--jkl-spacing-16);
@@ -34,8 +20,8 @@
 
 .jkl-calendar {
     display: block;
-    background-color: var(--jkl-calendar-background-color);
-    color: var(--jkl-calendar-text-color);
+    background-color: var(--jkl-color-background-container-high);
+    color: var(--jkl-color);
 
     &__padding {
         display: flex;

package/styles/components/datepicker/datepicker.css

@@ -2,36 +2,6 @@
  * Do not edit directly
  * Generated on Mon, 28 Oct 2024 14:22:00 GMT
  */
-@media screen and (prefers-color-scheme: light) {
-  :root {
-    --jkl-calendar-text-color: #1b1917;
-    --jkl-calendar-background-color: #ffffff;
-    --jkl-calendar-border-color: #1b1917;
-    --jkl-calendar-focus-color: #1b1917;
-  }
-}
-[data-theme=light] {
-  --jkl-calendar-text-color: #1b1917;
-  --jkl-calendar-background-color: #ffffff;
-  --jkl-calendar-border-color: #1b1917;
-  --jkl-calendar-focus-color: #1b1917;
-}
-
-@media screen and (prefers-color-scheme: dark) {
-  :root {
-    --jkl-calendar-text-color: #f9f9f9;
-    --jkl-calendar-background-color: #313030;
-    --jkl-calendar-border-color: #f9f9f9;
-    --jkl-calendar-focus-color: #f9f9f9;
-  }
-}
-[data-theme=dark] {
-  --jkl-calendar-text-color: #f9f9f9;
-  --jkl-calendar-background-color: #313030;
-  --jkl-calendar-border-color: #f9f9f9;
-  --jkl-calendar-focus-color: #f9f9f9;
-}
-
 :root,
 [data-layout-density=comfortable],
 [data-density=comfortable] {
@@ -57,8 +27,8 @@
 
 .jkl-calendar {
   display: block;
-  background-color: var(--jkl-calendar-background-color);
-  color: var(--jkl-calendar-text-color);
+  background-color: var(--jkl-color-background-container-high);
+  color: var(--jkl-color);
 }
 .jkl-calendar__padding {
   display: flex;
@@ -114,7 +84,7 @@
   justify-content: center;
   align-items: center;
   background-color: transparent;
-  color: var(--jkl-calendar-text-color);
+  color: var(--jkl-color);
   width: 2.5rem;
   height: 2.5rem;
 }
@@ -141,11 +111,10 @@
 .jkl-calendar-navigation__arrow:hover {
   color: var(--jkl-calendar-navigation-arrow-focus-color);
 }
-html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navigation__arrow:focus {
-  outline: 0.125rem solid var(--jkl-calendar-focus-color);
-  outline-offset: -0.125rem;
+.jkl-calendar-navigation__arrow:focus-visible {
+  outline: 3px solid var(--jkl-color-border-action);
+  outline-offset: -2px;
 }
-
 .jkl-calendar-navigation__arrow:disabled {
   color: var(--jkl-calendar-disabled-day-color);
 }
@@ -202,11 +171,10 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navig
   color: var(--jkl-select-text-color);
   background-color: var(--jkl-select-open-background-color);
 }
-html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navigation-dropdown__select:focus {
-  outline: 0.125rem solid var(--jkl-calendar-focus-color);
-  outline-offset: 1px;
+.jkl-calendar-navigation-dropdown__select:focus-visible {
+  outline: 3px solid var(--jkl-color-border-action);
+  outline-offset: 3px;
 }
-
 .jkl-calendar-navigation-dropdown__chevron {
   margin-left: calc(var(--chevron-size) * -1);
   pointer-events: none;
@@ -317,7 +285,7 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navig
   width: var(--jkl-calendar-date-size);
   border-radius: 50%;
   background-color: transparent;
-  color: var(--jkl-calendar-text-color);
+  color: var(--jkl-color);
   margin: var(--jkl-calendar-date-margin);
   padding: 0;
   padding-top: 0.125rem;
@@ -368,14 +336,14 @@ html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navig
   cursor: pointer;
 }
 .jkl-calendar-date-button[aria-pressed=true]:hover {
-  color: var(--jkl-calendar-text-color);
+  color: var(--jkl-color);
 }
 .jkl-calendar-date-button:disabled {
   color: var(--jkl-calendar-disabled-day-color);
 }
-html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-date-button:focus {
-  outline: 0.125rem solid var(--jkl-calendar-focus-color);
-  outline-offset: 0.125rem;
+.jkl-calendar-date-button:focus-visible {
+  outline: 3px solid var(--jkl-color-border-action);
+  outline-offset: 3px;
 }
 
 @media screen and (prefers-color-scheme: light) {

package/styles/components/datepicker/datepicker.min.css

@@ -1 +1 @@
-@media screen and (prefers-color-scheme:light){:root{--jkl-calendar-text-color:#1b1917;--jkl-calendar-background-color:#fff;--jkl-calendar-border-color:#1b1917;--jkl-calendar-focus-color:#1b1917}}[data-theme=light]{--jkl-calendar-text-color:#1b1917;--jkl-calendar-background-color:#fff;--jkl-calendar-border-color:#1b1917;--jkl-calendar-focus-color:#1b1917}@media screen and (prefers-color-scheme:dark){:root{--jkl-calendar-text-color:#f9f9f9;--jkl-calendar-background-color:#313030;--jkl-calendar-border-color:#f9f9f9;--jkl-calendar-focus-color:#f9f9f9}}[data-theme=dark]{--jkl-calendar-text-color:#f9f9f9;--jkl-calendar-background-color:#313030;--jkl-calendar-border-color:#f9f9f9;--jkl-calendar-focus-color:#f9f9f9}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-padding:var(--jkl-spacing-12) var(--jkl-spacing-16) var(--jkl-spacing-16);--jkl-calendar-gap:var(--jkl-spacing-12)}@media (width >= 0) and (max-width:374px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-padding:var(--jkl-spacing-4) var(--jkl-spacing-8) var(--jkl-spacing-16)}}[data-density=compact],[data-layout-density=compact]{--jkl-calendar-padding:var(--jkl-spacing-4) var(--jkl-spacing-8) var(--jkl-spacing-16);--jkl-calendar-gap:0}.jkl-calendar{background-color:var(--jkl-calendar-background-color);color:var(--jkl-calendar-text-color);display:block}.jkl-calendar__padding{box-sizing:border-box;display:flex;flex-direction:column;gap:var(--jkl-calendar-gap)}@media screen and (forced-colors:active){.jkl-calendar__padding{border:1px solid CanvasText}}@media screen and (prefers-color-scheme:light){:root{--jkl-calendar-disabled-day-color:#c8c5c3;--jkl-calendar-navigation-arrow-focus-color:#636060}}[data-theme=light]{--jkl-calendar-navigation-arrow-focus-color:#636060}@media screen and (prefers-color-scheme:dark){:root{--jkl-calendar-disabled-day-color:#636060;--jkl-calendar-navigation-arrow-focus-color:#c8c5c3}}[data-theme=dark]{--jkl-calendar-navigation-arrow-focus-color:#c8c5c3}.jkl-calendar-navigation{align-items:center;border:0;box-sizing:border-box;display:flex;justify-content:space-between;margin:0;padding:0;width:100%}.jkl-calendar-navigation__arrow{align-items:center;background-color:transparent;border-style:none;color:var(--jkl-calendar-text-color);cursor:pointer;display:inline-flex;height:2.5rem;justify-content:center;margin:0 0 0 -.5rem;outline:0;outline-style:none;padding:0;position:relative;width:2.5rem}.jkl-calendar-navigation__arrow:active,.jkl-calendar-navigation__arrow:focus,.jkl-calendar-navigation__arrow:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-calendar-navigation__arrow{border-style:revert;outline:revert;outline-style:revert}.jkl-calendar-navigation__arrow:active,.jkl-calendar-navigation__arrow:focus,.jkl-calendar-navigation__arrow:hover{outline:revert;outline-style:revert}}.jkl-calendar-navigation__arrow:hover{color:var(--jkl-calendar-navigation-arrow-focus-color)}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navigation__arrow:focus{outline:.125rem solid var(--jkl-calendar-focus-color);outline-offset:-.125rem}.jkl-calendar-navigation__arrow:disabled{color:var(--jkl-calendar-disabled-day-color)}.jkl-calendar-navigation-dropdown{--chevron-size:1.5rem;align-items:center;display:inline-flex}.jkl-calendar-navigation-dropdown>*{cursor:pointer}.jkl-calendar-navigation-dropdown__select{-webkit-appearance:none;appearance:none;font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;background-color:transparent;border:none;border-radius:0;border-style:none;color:inherit;font-weight:700;height:2.5rem;margin:0;outline:0;outline-style:none;padding:0;padding-inline-end:var(--chevron-size);text-align:end;text-align-last:end}.jkl-calendar-navigation-dropdown__select:active,.jkl-calendar-navigation-dropdown__select:focus,.jkl-calendar-navigation-dropdown__select:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-calendar-navigation-dropdown__select{border-style:revert;outline:revert;outline-style:revert}.jkl-calendar-navigation-dropdown__select:active,.jkl-calendar-navigation-dropdown__select:focus,.jkl-calendar-navigation-dropdown__select:hover{outline:revert;outline-style:revert}}.jkl-calendar-navigation-dropdown__select option{background-color:var(--jkl-select-open-background-color);color:var(--jkl-select-text-color)}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-navigation-dropdown__select:focus{outline:.125rem solid var(--jkl-calendar-focus-color);outline-offset:1px}.jkl-calendar-navigation-dropdown__chevron{margin-left:calc(var(--chevron-size)*-1);pointer-events:none}.jkl-calendar-navigation-dropdown+.jkl-calendar-navigation-dropdown{margin-inline-start:var(--jkl-spacing-8)}.jkl-calendar-table th{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;padding-bottom:var(--jkl-spacing-8)}.jkl-calendar-table td{text-align:center}.jkl-calendar-table td+td,.jkl-calendar-table th+th{padding-left:.25rem}.jkl-calendar-table tr+tr>td{padding-top:.25rem}@media screen and (prefers-color-scheme:light){:root{--jkl-calendar-adjacent-month-color:#636060;--jkl-calendar-disabled-day-color:#c8c5c3;--jkl-calendar-active-day-color:#fff;--jkl-calendar-hover-date-background-color:#ece9e5;--jkl-calendar-selected-date-background-color:#1b1917}}[data-theme=light]{--jkl-calendar-adjacent-month-color:#636060;--jkl-calendar-disabled-day-color:#c8c5c3;--jkl-calendar-active-day-color:#fff;--jkl-calendar-hover-date-background-color:#ece9e5;--jkl-calendar-selected-date-background-color:#1b1917}@media screen and (prefers-color-scheme:dark){:root{--jkl-calendar-adjacent-month-color:#c8c5c3;--jkl-calendar-disabled-day-color:#636060;--jkl-calendar-active-day-color:#000;--jkl-calendar-hover-date-background-color:#636060;--jkl-calendar-selected-date-background-color:#f9f9f9}}[data-theme=dark]{--jkl-calendar-adjacent-month-color:#c8c5c3;--jkl-calendar-disabled-day-color:#636060;--jkl-calendar-active-day-color:#000;--jkl-calendar-hover-date-background-color:#636060;--jkl-calendar-selected-date-background-color:#f9f9f9}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-date-size:2.375rem;--jkl-calendar-date-font-size:var(--jkl-body-font-size);--jkl-calendar-date-line-height:var(--jkl-body-line-height);--jkl-calendar-date-font-weight:var(--jkl-body-font-weight)}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-date-size:2.25rem;--jkl-calendar-date-font-size:var(--jkl-small-font-size);--jkl-calendar-date-line-height:var(--jkl-small-line-height);--jkl-calendar-date-font-weight:var(--jkl-small-font-weight)}}@media (width >= 0) and (max-width:374px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-date-size:2rem}}[data-density=compact],[data-layout-density=compact]{--jkl-calendar-date-size:2rem;--jkl-calendar-date-font-size:var(--jkl-small-font-size);--jkl-calendar-date-line-height:var(--jkl-small-line-height);--jkl-calendar-date-font-weight:var(--jkl-small-font-weight)}.jkl-calendar-date-button{align-items:center;-webkit-appearance:none;appearance:none;background-color:transparent;border-radius:50%;border-style:none;box-sizing:border-box;color:var(--jkl-calendar-text-color);display:inline-flex;font-size:var(--jkl-calendar-date-font-size);font-weight:var(--jkl-calendar-date-font-weight);height:var(--jkl-calendar-date-size);justify-content:center;line-height:var(--jkl-calendar-date-line-height);margin:var(--jkl-calendar-date-margin);outline:0;outline-style:none;padding:.125rem 0 0;position:relative;transition-duration:75ms;transition-property:color,background-color,box-shadow;transition-timing-function:ease-out;width:var(--jkl-calendar-date-size)}.jkl-calendar-date-button:active,.jkl-calendar-date-button:focus,.jkl-calendar-date-button:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-calendar-date-button{border-style:revert;outline:revert;outline-style:revert}.jkl-calendar-date-button:active,.jkl-calendar-date-button:focus,.jkl-calendar-date-button:hover{outline:revert;outline-style:revert}}.jkl-calendar-date-button[data-adjacent=true]{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-calendar-adjacent-month-color);padding:0}.jkl-calendar-date-button[aria-current=date]{font-weight:700}.jkl-calendar-date-button:hover:not(:disabled){background-color:var(--jkl-calendar-hover-date-background-color);cursor:pointer}.jkl-calendar-date-button[aria-pressed=true]{background-color:var(--jkl-calendar-selected-date-background-color);color:var(--jkl-calendar-active-day-color);cursor:pointer}.jkl-calendar-date-button[aria-pressed=true]:hover{color:var(--jkl-calendar-text-color)}.jkl-calendar-date-button:disabled{color:var(--jkl-calendar-disabled-day-color)}html:not([data-mousenavigation]):not([data-touchnavigation]) .jkl-calendar-date-button:focus{outline:.125rem solid var(--jkl-calendar-focus-color);outline-offset:.125rem}@media screen and (prefers-color-scheme:light){:root{--jkl-datepicker-focus-color:#1b1917}}[data-theme=light]{--jkl-datepicker-focus-color:#1b1917}@media screen and (prefers-color-scheme:dark){:root{--jkl-datepicker-focus-color:#f9f9f9}}[data-theme=dark]{--jkl-datepicker-focus-color:#f9f9f9}.jkl-datepicker{align-items:flex-start;border-style:none;display:flex;flex-direction:column;outline:0;outline-style:none;position:relative}.jkl-datepicker:active,.jkl-datepicker:focus,.jkl-datepicker:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-datepicker{border-style:revert;outline:revert;outline-style:revert}.jkl-datepicker:active,.jkl-datepicker:focus,.jkl-datepicker:hover{outline:revert;outline-style:revert}}.jkl-datepicker__input-wrapper{display:contents;position:relative}.jkl-datepicker .jkl-datepicker__input{padding-bottom:calc(var(--jkl-text-input-vertical-padding) - .08em);padding-top:calc(var(--jkl-text-input-vertical-padding) + .08em)}.jkl-datepicker__calendar-wrapper{left:0;position:absolute;top:calc(100% + .875rem);z-index:7000}.jkl-datepicker--open .jkl-text-input-wrapper{border-color:var(--jkl-text-input-focus-color);box-shadow:inset 0 0 0 .0625rem var(--jkl-text-input-focus-color),0 0 0 .0625rem var(--jkl-text-input-focus-color)}@media (width >= 0) and (max-width:679px){.jkl-datepicker__calendar-wrapper{left:-1.15rem}}@media (width >= 0) and (max-width:374px){.jkl-datepicker__calendar-wrapper{left:-2.5rem}}
+:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-padding:var(--jkl-spacing-12) var(--jkl-spacing-16) var(--jkl-spacing-16);--jkl-calendar-gap:var(--jkl-spacing-12)}@media (width >= 0) and (max-width:374px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-padding:var(--jkl-spacing-4) var(--jkl-spacing-8) var(--jkl-spacing-16)}}[data-density=compact],[data-layout-density=compact]{--jkl-calendar-padding:var(--jkl-spacing-4) var(--jkl-spacing-8) var(--jkl-spacing-16);--jkl-calendar-gap:0}.jkl-calendar{background-color:var(--jkl-color-background-container-high);color:var(--jkl-color);display:block}.jkl-calendar__padding{box-sizing:border-box;display:flex;flex-direction:column;gap:var(--jkl-calendar-gap)}@media screen and (forced-colors:active){.jkl-calendar__padding{border:1px solid CanvasText}}@media screen and (prefers-color-scheme:light){:root{--jkl-calendar-disabled-day-color:#c8c5c3;--jkl-calendar-navigation-arrow-focus-color:#636060}}[data-theme=light]{--jkl-calendar-navigation-arrow-focus-color:#636060}@media screen and (prefers-color-scheme:dark){:root{--jkl-calendar-disabled-day-color:#636060;--jkl-calendar-navigation-arrow-focus-color:#c8c5c3}}[data-theme=dark]{--jkl-calendar-navigation-arrow-focus-color:#c8c5c3}.jkl-calendar-navigation{align-items:center;border:0;box-sizing:border-box;display:flex;justify-content:space-between;margin:0;padding:0;width:100%}.jkl-calendar-navigation__arrow{align-items:center;background-color:transparent;border-style:none;color:var(--jkl-color);cursor:pointer;display:inline-flex;height:2.5rem;justify-content:center;margin:0 0 0 -.5rem;outline:0;outline-style:none;padding:0;position:relative;width:2.5rem}.jkl-calendar-navigation__arrow:active,.jkl-calendar-navigation__arrow:focus,.jkl-calendar-navigation__arrow:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-calendar-navigation__arrow{border-style:revert;outline:revert;outline-style:revert}.jkl-calendar-navigation__arrow:active,.jkl-calendar-navigation__arrow:focus,.jkl-calendar-navigation__arrow:hover{outline:revert;outline-style:revert}}.jkl-calendar-navigation__arrow:hover{color:var(--jkl-calendar-navigation-arrow-focus-color)}.jkl-calendar-navigation__arrow:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:-2px}.jkl-calendar-navigation__arrow:disabled{color:var(--jkl-calendar-disabled-day-color)}.jkl-calendar-navigation-dropdown{--chevron-size:1.5rem;align-items:center;display:inline-flex}.jkl-calendar-navigation-dropdown>*{cursor:pointer}.jkl-calendar-navigation-dropdown__select{-webkit-appearance:none;appearance:none;font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;background-color:transparent;border:none;border-radius:0;border-style:none;color:inherit;font-weight:700;height:2.5rem;margin:0;outline:0;outline-style:none;padding:0;padding-inline-end:var(--chevron-size);text-align:end;text-align-last:end}.jkl-calendar-navigation-dropdown__select:active,.jkl-calendar-navigation-dropdown__select:focus,.jkl-calendar-navigation-dropdown__select:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-calendar-navigation-dropdown__select{border-style:revert;outline:revert;outline-style:revert}.jkl-calendar-navigation-dropdown__select:active,.jkl-calendar-navigation-dropdown__select:focus,.jkl-calendar-navigation-dropdown__select:hover{outline:revert;outline-style:revert}}.jkl-calendar-navigation-dropdown__select option{background-color:var(--jkl-select-open-background-color);color:var(--jkl-select-text-color)}.jkl-calendar-navigation-dropdown__select:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-calendar-navigation-dropdown__chevron{margin-left:calc(var(--chevron-size)*-1);pointer-events:none}.jkl-calendar-navigation-dropdown+.jkl-calendar-navigation-dropdown{margin-inline-start:var(--jkl-spacing-8)}.jkl-calendar-table th{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;padding-bottom:var(--jkl-spacing-8)}.jkl-calendar-table td{text-align:center}.jkl-calendar-table td+td,.jkl-calendar-table th+th{padding-left:.25rem}.jkl-calendar-table tr+tr>td{padding-top:.25rem}@media screen and (prefers-color-scheme:light){:root{--jkl-calendar-adjacent-month-color:#636060;--jkl-calendar-disabled-day-color:#c8c5c3;--jkl-calendar-active-day-color:#fff;--jkl-calendar-hover-date-background-color:#ece9e5;--jkl-calendar-selected-date-background-color:#1b1917}}[data-theme=light]{--jkl-calendar-adjacent-month-color:#636060;--jkl-calendar-disabled-day-color:#c8c5c3;--jkl-calendar-active-day-color:#fff;--jkl-calendar-hover-date-background-color:#ece9e5;--jkl-calendar-selected-date-background-color:#1b1917}@media screen and (prefers-color-scheme:dark){:root{--jkl-calendar-adjacent-month-color:#c8c5c3;--jkl-calendar-disabled-day-color:#636060;--jkl-calendar-active-day-color:#000;--jkl-calendar-hover-date-background-color:#636060;--jkl-calendar-selected-date-background-color:#f9f9f9}}[data-theme=dark]{--jkl-calendar-adjacent-month-color:#c8c5c3;--jkl-calendar-disabled-day-color:#636060;--jkl-calendar-active-day-color:#000;--jkl-calendar-hover-date-background-color:#636060;--jkl-calendar-selected-date-background-color:#f9f9f9}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-date-size:2.375rem;--jkl-calendar-date-font-size:var(--jkl-body-font-size);--jkl-calendar-date-line-height:var(--jkl-body-line-height);--jkl-calendar-date-font-weight:var(--jkl-body-font-weight)}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-date-size:2.25rem;--jkl-calendar-date-font-size:var(--jkl-small-font-size);--jkl-calendar-date-line-height:var(--jkl-small-line-height);--jkl-calendar-date-font-weight:var(--jkl-small-font-weight)}}@media (width >= 0) and (max-width:374px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-calendar-date-size:2rem}}[data-density=compact],[data-layout-density=compact]{--jkl-calendar-date-size:2rem;--jkl-calendar-date-font-size:var(--jkl-small-font-size);--jkl-calendar-date-line-height:var(--jkl-small-line-height);--jkl-calendar-date-font-weight:var(--jkl-small-font-weight)}.jkl-calendar-date-button{align-items:center;-webkit-appearance:none;appearance:none;background-color:transparent;border-radius:50%;border-style:none;box-sizing:border-box;color:var(--jkl-color);display:inline-flex;font-size:var(--jkl-calendar-date-font-size);font-weight:var(--jkl-calendar-date-font-weight);height:var(--jkl-calendar-date-size);justify-content:center;line-height:var(--jkl-calendar-date-line-height);margin:var(--jkl-calendar-date-margin);outline:0;outline-style:none;padding:.125rem 0 0;position:relative;transition-duration:75ms;transition-property:color,background-color,box-shadow;transition-timing-function:ease-out;width:var(--jkl-calendar-date-size)}.jkl-calendar-date-button:active,.jkl-calendar-date-button:focus,.jkl-calendar-date-button:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-calendar-date-button{border-style:revert;outline:revert;outline-style:revert}.jkl-calendar-date-button:active,.jkl-calendar-date-button:focus,.jkl-calendar-date-button:hover{outline:revert;outline-style:revert}}.jkl-calendar-date-button[data-adjacent=true]{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-calendar-adjacent-month-color);padding:0}.jkl-calendar-date-button[aria-current=date]{font-weight:700}.jkl-calendar-date-button:hover:not(:disabled){background-color:var(--jkl-calendar-hover-date-background-color);cursor:pointer}.jkl-calendar-date-button[aria-pressed=true]{background-color:var(--jkl-calendar-selected-date-background-color);color:var(--jkl-calendar-active-day-color);cursor:pointer}.jkl-calendar-date-button[aria-pressed=true]:hover{color:var(--jkl-color)}.jkl-calendar-date-button:disabled{color:var(--jkl-calendar-disabled-day-color)}.jkl-calendar-date-button:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}@media screen and (prefers-color-scheme:light){:root{--jkl-datepicker-focus-color:#1b1917}}[data-theme=light]{--jkl-datepicker-focus-color:#1b1917}@media screen and (prefers-color-scheme:dark){:root{--jkl-datepicker-focus-color:#f9f9f9}}[data-theme=dark]{--jkl-datepicker-focus-color:#f9f9f9}.jkl-datepicker{align-items:flex-start;border-style:none;display:flex;flex-direction:column;outline:0;outline-style:none;position:relative}.jkl-datepicker:active,.jkl-datepicker:focus,.jkl-datepicker:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-datepicker{border-style:revert;outline:revert;outline-style:revert}.jkl-datepicker:active,.jkl-datepicker:focus,.jkl-datepicker:hover{outline:revert;outline-style:revert}}.jkl-datepicker__input-wrapper{display:contents;position:relative}.jkl-datepicker .jkl-datepicker__input{padding-bottom:calc(var(--jkl-text-input-vertical-padding) - .08em);padding-top:calc(var(--jkl-text-input-vertical-padding) + .08em)}.jkl-datepicker__calendar-wrapper{left:0;position:absolute;top:calc(100% + .875rem);z-index:7000}.jkl-datepicker--open .jkl-text-input-wrapper{border-color:var(--jkl-text-input-focus-color);box-shadow:inset 0 0 0 .0625rem var(--jkl-text-input-focus-color),0 0 0 .0625rem var(--jkl-text-input-focus-color)}@media (width >= 0) and (max-width:679px){.jkl-datepicker__calendar-wrapper{left:-1.15rem}}@media (width >= 0) and (max-width:374px){.jkl-datepicker__calendar-wrapper{left:-2.5rem}}

package/styles/components/expander/deprecated/expander.css

@@ -38,8 +38,8 @@
 }
 .jkl-old-expander:focus-visible {
   border: none;
-  outline: 2px solid var(--jkl-color-border-action);
-  outline-offset: 2px;
+  outline: 3px solid var(--jkl-color-border-action);
+  outline-offset: 3px;
 }
 .jkl-old-expander:focus-visible .jkl-old-expander__arrow {
   transform: translateY(0.1875rem);

package/styles/components/expander/deprecated/expander.min.css

@@ -1 +1 @@
-.jkl-old-expander{--color:var(--jkl-color-text-interactive);background-color:transparent;border-style:none;color:var(--color);cursor:pointer;list-style:none;min-width:unset;outline:0;outline-style:none;padding:0;position:relative;transition:transform .1s cubic-bezier(.6,.2,.35,1),border .1s cubic-bezier(.6,.2,.35,1)}.jkl-old-expander:active,.jkl-old-expander:focus,.jkl-old-expander:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-old-expander{border-style:revert;outline:revert;outline-style:revert}.jkl-old-expander:active,.jkl-old-expander:focus,.jkl-old-expander:hover{outline:revert;outline-style:revert}}.jkl-old-expander::-webkit-details-marker{display:none}.jkl-old-expander:focus-visible{border:none;outline:2px solid var(--jkl-color-border-action);outline-offset:2px}.jkl-old-expander:focus-visible .jkl-old-expander__arrow{transform:translateY(.1875rem)}.jkl-old-expander:focus-visible,.jkl-old-expander:hover{--color:var(--jkl-color-text-interactive-hover)}.jkl-old-expander--expanded{--jkl-icon-weight:500;font-weight:700;letter-spacing:-.014em}.jkl-old-expander--icon-only .jkl-old-expander__arrow{margin:.25rem .5rem}.jkl-old-expander .jkl-old-expander__arrow{display:inline-block;margin-bottom:-.15em;margin-left:.125rem;transition-duration:.15s;transition-property:transform;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-old-expander,.jkl-old-expander:after{border-left-style:none;border-right-style:none;border-top-style:none}}.jkl-expand-section__content-wrapper{transition-duration:.15s;transition-property:height;transition-timing-function:ease}.jkl-expand-section__content{height:auto;padding:1rem 0 2.5rem}
+.jkl-old-expander{--color:var(--jkl-color-text-interactive);background-color:transparent;border-style:none;color:var(--color);cursor:pointer;list-style:none;min-width:unset;outline:0;outline-style:none;padding:0;position:relative;transition:transform .1s cubic-bezier(.6,.2,.35,1),border .1s cubic-bezier(.6,.2,.35,1)}.jkl-old-expander:active,.jkl-old-expander:focus,.jkl-old-expander:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-old-expander{border-style:revert;outline:revert;outline-style:revert}.jkl-old-expander:active,.jkl-old-expander:focus,.jkl-old-expander:hover{outline:revert;outline-style:revert}}.jkl-old-expander::-webkit-details-marker{display:none}.jkl-old-expander:focus-visible{border:none;outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-old-expander:focus-visible .jkl-old-expander__arrow{transform:translateY(.1875rem)}.jkl-old-expander:focus-visible,.jkl-old-expander:hover{--color:var(--jkl-color-text-interactive-hover)}.jkl-old-expander--expanded{--jkl-icon-weight:500;font-weight:700;letter-spacing:-.014em}.jkl-old-expander--icon-only .jkl-old-expander__arrow{margin:.25rem .5rem}.jkl-old-expander .jkl-old-expander__arrow{display:inline-block;margin-bottom:-.15em;margin-left:.125rem;transition-duration:.15s;transition-property:transform;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-old-expander,.jkl-old-expander:after{border-left-style:none;border-right-style:none;border-top-style:none}}.jkl-expand-section__content-wrapper{transition-duration:.15s;transition-property:height;transition-timing-function:ease}.jkl-expand-section__content{height:auto;padding:1rem 0 2.5rem}