npm - @public-ui/themes - Versions diffs - 3.0.0-023e727fba43bcd74fd9f7ce52558eee4a3aa906.0 → 3.0.0-9da5848955ab6cd75fb6415b51b281e3e7c3ae3d.0 - Mend

@public-ui/themes 3.0.0-023e727fba43bcd74fd9f7ce52558eee4a3aa906.0 → 3.0.0-9da5848955ab6cd75fb6415b51b281e3e7c3ae3d.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (141) hide show

package/assets/fontawesome-free/LICENSE.txt +165 -0
package/assets/fontawesome-free/css/all.css +7831 -0
package/assets/fontawesome-free/css/all.min.css +6 -0
package/assets/fontawesome-free/css/brands.css +1432 -0
package/assets/fontawesome-free/css/brands.min.css +6 -0
package/assets/fontawesome-free/css/fontawesome.css +6338 -0
package/assets/fontawesome-free/css/fontawesome.min.css +6 -0
package/assets/fontawesome-free/css/regular.css +19 -0
package/assets/fontawesome-free/css/regular.min.css +6 -0
package/assets/fontawesome-free/css/solid.css +19 -0
package/assets/fontawesome-free/css/solid.min.css +6 -0
package/assets/fontawesome-free/css/svg-with-js.css +634 -0
package/assets/fontawesome-free/css/svg-with-js.min.css +6 -0
package/assets/fontawesome-free/css/v4-font-face.css +26 -0
package/assets/fontawesome-free/css/v4-font-face.min.css +6 -0
package/assets/fontawesome-free/css/v4-shims.css +2146 -0
package/assets/fontawesome-free/css/v4-shims.min.css +6 -0
package/assets/fontawesome-free/css/v5-font-face.css +22 -0
package/assets/fontawesome-free/css/v5-font-face.min.css +6 -0
package/assets/fontawesome-free/webfonts/fa-brands-400.ttf +0 -0
package/assets/fontawesome-free/webfonts/fa-brands-400.woff2 +0 -0
package/assets/fontawesome-free/webfonts/fa-regular-400.ttf +0 -0
package/assets/fontawesome-free/webfonts/fa-regular-400.woff2 +0 -0
package/assets/fontawesome-free/webfonts/fa-solid-900.ttf +0 -0
package/assets/fontawesome-free/webfonts/fa-solid-900.woff2 +0 -0
package/assets/fontawesome-free/webfonts/fa-v4compatibility.ttf +0 -0
package/assets/fontawesome-free/webfonts/fa-v4compatibility.woff2 +0 -0
package/assets/icofont/demo.html +18939 -0
package/assets/icofont/fonts/icofont.eot +0 -0
package/assets/icofont/fonts/icofont.svg +2105 -0
package/assets/icofont/fonts/icofont.ttf +0 -0
package/assets/icofont/fonts/icofont.woff +0 -0
package/assets/icofont/fonts/icofont.woff2 +0 -0
package/assets/icofont/icofont.css +10757 -0
package/assets/icofont/icofont.min.css +7 -0
package/assets/kreon/Kreon-VariableFont_wght.ttf +0 -0
package/assets/kreon/OFL.txt +93 -0
package/assets/kreon/README.txt +67 -0
package/assets/kreon/static/Kreon-Bold.ttf +0 -0
package/assets/kreon/static/Kreon-Light.ttf +0 -0
package/assets/kreon/static/Kreon-Medium.ttf +0 -0
package/assets/kreon/static/Kreon-Regular.ttf +0 -0
package/assets/kreon/static/Kreon-SemiBold.ttf +0 -0
package/assets/kreon/style.css +41 -0
package/assets/material-icons/LICENSE +202 -0
package/assets/material-icons/README.md +129 -0
package/assets/material-icons/_data/versions.json +2124 -0
package/assets/material-icons/css/_codepoints.scss +2279 -0
package/assets/material-icons/css/_mixins.scss +13 -0
package/assets/material-icons/css/_variables.scss +6 -0
package/assets/material-icons/css/material-icons.css +9208 -0
package/assets/material-icons/css/material-icons.min.css +1 -0
package/assets/material-icons/css/material-icons.scss +33 -0
package/assets/material-icons/iconfont/_mixins.scss +55 -0
package/assets/material-icons/iconfont/_variables.scss +3 -0
package/assets/material-icons/iconfont/filled.css +24 -0
package/assets/material-icons/iconfont/filled.scss +4 -0
package/assets/material-icons/iconfont/material-icons-outlined.woff +0 -0
package/assets/material-icons/iconfont/material-icons-outlined.woff2 +0 -0
package/assets/material-icons/iconfont/material-icons-round.woff +0 -0
package/assets/material-icons/iconfont/material-icons-round.woff2 +0 -0
package/assets/material-icons/iconfont/material-icons-sharp.woff +0 -0
package/assets/material-icons/iconfont/material-icons-sharp.woff2 +0 -0
package/assets/material-icons/iconfont/material-icons-two-tone.woff +0 -0
package/assets/material-icons/iconfont/material-icons-two-tone.woff2 +0 -0
package/assets/material-icons/iconfont/material-icons.css +124 -0
package/assets/material-icons/iconfont/material-icons.scss +5 -0
package/assets/material-icons/iconfont/material-icons.woff +0 -0
package/assets/material-icons/iconfont/material-icons.woff2 +0 -0
package/assets/material-icons/iconfont/outlined.css +24 -0
package/assets/material-icons/iconfont/outlined.scss +4 -0
package/assets/material-icons/iconfont/round.css +24 -0
package/assets/material-icons/iconfont/round.scss +4 -0
package/assets/material-icons/iconfont/sharp.css +24 -0
package/assets/material-icons/iconfont/sharp.scss +4 -0
package/assets/material-icons/iconfont/two-tone.css +24 -0
package/assets/material-icons/iconfont/two-tone.scss +4 -0
package/assets/material-icons/index.d.ts +2128 -0
package/assets/material-icons/package.json +52 -0
package/assets/material-symbols/LICENSE +202 -0
package/assets/material-symbols/README.md +114 -0
package/assets/material-symbols/_core.scss +46 -0
package/assets/material-symbols/index.css +74 -0
package/assets/material-symbols/index.d.ts +2809 -0
package/assets/material-symbols/index.scss +3 -0
package/assets/material-symbols/material-symbols-outlined.woff2 +0 -0
package/assets/material-symbols/material-symbols-rounded.woff2 +0 -0
package/assets/material-symbols/material-symbols-sharp.woff2 +0 -0
package/assets/material-symbols/outlined.css +24 -0
package/assets/material-symbols/outlined.scss +3 -0
package/assets/material-symbols/package.json +41 -0
package/assets/material-symbols/rounded.css +24 -0
package/assets/material-symbols/rounded.scss +3 -0
package/assets/material-symbols/sharp.css +24 -0
package/assets/material-symbols/sharp.scss +3 -0
package/assets/noto-sans/fonts/NotoSans-Black.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-BlackItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-Bold.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-BoldItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-ExtraBold.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-ExtraBoldItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-ExtraLight.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-ExtraLightItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-Italic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-Light.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-LightItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-Medium.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-MediumItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-Regular.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-SemiBold.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-SemiBoldItalic.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-Thin.ttf +0 -0
package/assets/noto-sans/fonts/NotoSans-ThinItalic.ttf +0 -0
package/assets/noto-sans/fonts/OFL.txt +93 -0
package/assets/noto-sans/noto-sans.css +11 -0
package/assets/roboto/LICENSE.txt +202 -0
package/assets/roboto/Roboto-Black.ttf +0 -0
package/assets/roboto/Roboto-BlackItalic.ttf +0 -0
package/assets/roboto/Roboto-Bold.ttf +0 -0
package/assets/roboto/Roboto-BoldItalic.ttf +0 -0
package/assets/roboto/Roboto-Italic.ttf +0 -0
package/assets/roboto/Roboto-Light.ttf +0 -0
package/assets/roboto/Roboto-LightItalic.ttf +0 -0
package/assets/roboto/Roboto-Medium.ttf +0 -0
package/assets/roboto/Roboto-MediumItalic.ttf +0 -0
package/assets/roboto/Roboto-Regular.ttf +0 -0
package/assets/roboto/Roboto-Thin.ttf +0 -0
package/assets/roboto/Roboto-ThinItalic.ttf +0 -0
package/assets/roboto/roboto.css +27 -0
package/assets/tabler-icons/fonts/tabler-icons.eot +0 -0
package/assets/tabler-icons/fonts/tabler-icons.ttf +0 -0
package/assets/tabler-icons/fonts/tabler-icons.woff +0 -0
package/assets/tabler-icons/fonts/tabler-icons.woff2 +0 -0
package/assets/tabler-icons/tabler-icons.css +16056 -0
package/assets/tabler-icons/tabler-icons.html +36226 -0
package/assets/tabler-icons/tabler-icons.min.css +4 -0
package/assets/tabler-icons/tabler-icons.png +0 -0
package/assets/tabler-icons/tabler-icons.scss +8058 -0
package/dist/index.cjs +9 -9
package/dist/index.mjs +9 -9
package/package.json +3 -3

package/dist/index.cjs CHANGED Viewed

@@ -625,7 +625,7 @@ BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Arzneimittel und Mediz
 BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Bevölkerungsforschung'], ['Bundesinstitut', 'für Bevölkerungsforschung']);
 BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Sportwissenschaft'], ['Bundesinstitut', 'für Sportwissenschaft']);
-var css_248z$25 = "@layer kol-theme-global {\n  :host {\n    --border-radius: var(--kolibri-border-radius, 5px);\n    --font-family: var(--kolibri-font-family, Verdana, Arial, Calibri, Helvetica, sans-serif);\n    --font-size: var(--kolibri-font-size, calc(16rem / var(--kolibri-root-font-size, 16)));\n    --spacing: var(--kolibri-spacing, calc(4rem / var(--kolibri-root-font-size, 16)));\n    --border-width: var(--kolibri-border-width, 1px);\n    --color-primary: var(--kolibri-color-primary, #004b76);\n    --color-primary-variant: var(--kolibri-color-primary-variant, #0077b6);\n    --color-danger: var(--kolibri-color-danger, #b4003c);\n    --color-warning: var(--kolibri-color-warning, #c44931);\n    --color-success: var(--kolibri-color-success, #005c45);\n    --color-subtle: var(--kolibri-color-subtle, #576164);\n    --color-light: var(--kolibri-color-light, #ffffff);\n    --color-text: var(--kolibri-color-text, #202020);\n    --color-mute: var(--kolibri-color-mute, #f2f3f4);\n    --color-mute-variant: var(--kolibri-color-mute-variant, #bec5c9);\n  }\n  * {\n    box-sizing: border-box;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n  *[tabindex]:focus,\n  .kol-input:not(.checkbox, .radio) .input:focus-within,\n  .kol-input:is(.checkbox, .radio) input:focus,\n  summary:focus {\n    cursor: pointer;\n    outline-color: var(--color-primary-variant);\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 3px;\n    transition: outline-offset 0.2s linear;\n  }\n  .kol-headline {\n    font-weight: 700;\n  }\n  .kol-tooltip__floating {\n    border: var(--border-width) solid var(--color-subtle);\n    border-radius: var(--border-radius);\n  }\n  .kol-tooltip__arrow {\n    background-color: var(--color-light);\n    border: var(--border-width) solid var(--color-subtle);\n  }\n  .kol-tooltip__content {\n    background-color: var(--color-light);\n    border-radius: var(--border-radius);\n    line-height: 1.5;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-span,\n  .kol-span__container {\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .badge-text-hint {\n    background-color: var(--color-mute-variant);\n    border-radius: 3px;\n    color: var(--color-text);\n    padding: 0 0.3em;\n  }\n  @keyframes spin {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n}";
+var css_248z$25 = "@layer kol-theme-global {\n  :host {\n    --border-radius: var(--kolibri-border-radius, 5px);\n    --font-family: var(--kolibri-font-family, Verdana, Arial, Calibri, Helvetica, sans-serif);\n    --font-size: var(--kolibri-font-size, calc(16rem / var(--kolibri-root-font-size, 16)));\n    --spacing: var(--kolibri-spacing, calc(4rem / var(--kolibri-root-font-size, 16)));\n    --border-width: var(--kolibri-border-width, 1px);\n    --color-primary: var(--kolibri-color-primary, #004b76);\n    --color-primary-variant: var(--kolibri-color-primary-variant, #0077b6);\n    --color-secondary: var(--kolibri-color-secondary, #ccebf7);\n    --color-danger: var(--kolibri-color-danger, #b4003c);\n    --color-warning: var(--kolibri-color-warning, #c44931);\n    --color-success: var(--kolibri-color-success, #005c45);\n    --color-subtle: var(--kolibri-color-subtle, #576164);\n    --color-light: var(--kolibri-color-light, #ffffff);\n    --color-text: var(--kolibri-color-text, #202020);\n    --color-mute: var(--kolibri-color-mute, #f2f3f4);\n    --color-mute-variant: var(--kolibri-color-mute-variant, #bec5c9);\n  }\n  * {\n    box-sizing: border-box;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n  *[tabindex]:focus,\n  .kol-input:not(.checkbox, .radio) .input:focus-within,\n  .kol-input:is(.checkbox, .radio) input:focus,\n  summary:focus {\n    cursor: pointer;\n    outline-color: var(--color-primary-variant);\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 3px;\n    transition: outline-offset 0.2s linear;\n  }\n  .kol-headline {\n    font-weight: 700;\n  }\n  .kol-tooltip__floating {\n    border: var(--border-width) solid var(--color-subtle);\n    border-radius: var(--border-radius);\n  }\n  .kol-tooltip__arrow {\n    background-color: var(--color-light);\n    border: var(--border-width) solid var(--color-subtle);\n  }\n  .kol-tooltip__content {\n    background-color: var(--color-light);\n    border-radius: var(--border-radius);\n    line-height: 1.5;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-span,\n  .kol-span__container {\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .badge-text-hint {\n    background-color: var(--color-mute-variant);\n    border-radius: 3px;\n    color: var(--color-text);\n    padding: 0 0.3em;\n  }\n  @keyframes spin {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n}";
 var css_248z$24 = "@layer kol-theme-component {\n  :host {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n    font-family: var(--font-family);\n  }\n  .kol-accordion {\n    width: 100%;\n    height: 100%;\n    display: grid;\n  }\n  .kol-accordion__content {\n    margin: 0;\n    padding-left: 2.25em;\n    padding-bottom: calc(12rem / var(--kolibri-root-font-size, 16));\n    padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-accordion__heading {\n    margin: 0;\n  }\n  .kol-accordion__heading-button {\n    display: flex;\n    border-radius: var(--border-radius);\n    min-height: calc(35.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-accordion__heading-button:focus-within {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n    cursor: pointer;\n  }\n  .kol-accordion__heading-button:focus-within .kol-button {\n    outline: 0;\n  }\n  .kol-accordion__heading-button .kol-span__container {\n    display: flex;\n    place-items: baseline center;\n    text-align: left;\n    gap: 0.5em;\n    font-weight: 700;\n    font-size: calc(18rem / var(--kolibri-root-font-size, 16));\n    line-height: 1.1;\n  }\n  .kol-accordion__heading-button .kol-button {\n    padding: calc(12rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-accordion__heading-button .kol-button :focus {\n    outline: none;\n  }\n  .kol-accordion__heading-button .kol-icon {\n    color: var(--color-primary);\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}";
@@ -637,7 +637,7 @@ var css_248z$21 = "@layer kol-theme-component {\n  .kol-badge {\n    font-family
 var css_248z$20 = "@layer kol-theme-component {\n  .kol-breadcrumb {\n    font-family: var(--font-family);\n  }\n  .kol-breadcrumb__list-element-span {\n    color: var(--color-subtle);\n  }\n  .kol-breadcrumb__link::part(icon) {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-breadcrumb__icon {\n    font-size: calc(12rem / var(--kolibri-root-font-size, 16));\n    color: var(--color-subtle);\n  }\n}";
-var css_248z$1$ = "@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary, .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n}";
+var css_248z$1$ = "@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--tertiary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n}";
 var css_248z$1_ = "@layer kol-theme-component {\n  .kol-button {\n    color: var(--color-primary);\n    font-style: normal;\n    font-weight: 400;\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button:visited {\n    color: var(--visited);\n  }\n  .kol-button:focus .kol-button__text {\n    border-radius: var(--border-radius);\n    outline: var(--border-width) solid;\n  }\n  .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n    text-decoration-thickness: 0.25em;\n  }\n  .kol-button {\n    color: var(--color-primary);\n    font-style: normal;\n    font-weight: 400;\n    font-size: inherit;\n  }\n  .kol-button:focus {\n    outline: none;\n    --text-border-radius: var(--border-radius);\n    --text-outline: calc(var(--border-width) * 2) solid;\n  }\n  .kol-button:visited {\n    color: var(--visited);\n  }\n  .kol-button:focus .kol-button__text {\n    border-radius: var(--text-border-radius);\n    outline: var(--text-outline);\n  }\n  .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n    text-decoration-thickness: 0.25em;\n  }\n}";
@@ -661,7 +661,7 @@ var css_248z$1R = "@layer kol-theme-component {\n  :host {\n    font-family: var
 var css_248z$1Q = "@layer kol-theme-component {\n  :host {\n    font-family: var(--font-family);\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field {\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field__hint {\n    font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n    font-style: italic;\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) {\n    border-left: 3px solid var(--color-danger);\n    padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n    color: var(--color-danger);\n    font-weight: 700;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field__msg {\n    order: 1;\n  }\n  .kol-form-field__label {\n    order: 2;\n  }\n  .kol-form-field__input {\n    order: 3;\n  }\n  .kol-form-field__hint {\n    order: 4;\n  }\n  .kol-input-container {\n    background-color: var(--color-light);\n    border-color: var(--color-subtle);\n    border-radius: var(--border-radius);\n    border-style: solid;\n    border-width: 2px;\n    padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n    gap: calc(6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment {\n    min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--start > .kol-icon {\n    margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--end > .kol-icon {\n    margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container--disabled {\n    background-color: var(--color-mute);\n    border-color: var(--color-mute-variant);\n    color: var(--color-text);\n    cursor: not-allowed;\n  }\n  .kol-input-container:not(.kol-input-container--disabled):hover {\n    border-color: var(--color-primary);\n  }\n  .kol-input-container:focus-within {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-input-container--error:focus-within {\n    outline-color: var(--color-danger);\n  }\n}\n@layer kol-theme-component {\n  .kol-input {\n    background-color: transparent;\n    border: none;\n  }\n  .kol-input::placeholder {\n    color: var(--color-subtle);\n  }\n}";
-var css_248z$1P = "@layer kol-theme-component {\n  :host {\n    font-family: var(--font-family);\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field {\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field__hint {\n    font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n    font-style: italic;\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) {\n    border-left: 3px solid var(--color-danger);\n    padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n    color: var(--color-danger);\n    font-weight: 700;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field__msg {\n    order: 1;\n  }\n  .kol-form-field__label {\n    order: 2;\n  }\n  .kol-form-field__input {\n    order: 3;\n  }\n  .kol-form-field__hint {\n    order: 4;\n  }\n  .kol-input-container {\n    background-color: var(--color-light);\n    border-color: var(--color-subtle);\n    border-radius: var(--border-radius);\n    border-style: solid;\n    border-width: 2px;\n    padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n    gap: calc(6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment {\n    min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--start > .kol-icon {\n    margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--end > .kol-icon {\n    margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container--disabled {\n    background-color: var(--color-mute);\n    border-color: var(--color-mute-variant);\n    color: var(--color-text);\n    cursor: not-allowed;\n  }\n  .kol-input-container:not(.kol-input-container--disabled):hover {\n    border-color: var(--color-primary);\n  }\n  .kol-input-container:focus-within {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-input-container--error:focus-within {\n    outline-color: var(--color-danger);\n  }\n}\n@layer kol-theme-component {\n  .kol-input {\n    background-color: transparent;\n    border: none;\n  }\n  .kol-input::placeholder {\n    color: var(--color-subtle);\n  }\n}\n@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary, .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-input-container {\n    gap: initial;\n  }\n  .kol-input-container__filename {\n    color: var(--color-subtle);\n  }\n  .kol-input-container--is-dragover {\n    border-color: var(--color-primary);\n  }\n  .kol-button__text {\n    border-top-right-radius: calc(var(--border-radius) - 2px);\n    border-bottom-right-radius: calc(var(--border-radius) - 2px);\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n    white-space: nowrap;\n  }\n  .kol-input {\n    padding-top: calc(0.5em + 2rem / var(--kolibri-root-font-size, 16));\n    background-color: transparent;\n  }\n}";
+var css_248z$1P = "@layer kol-theme-component {\n  :host {\n    font-family: var(--font-family);\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field {\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field__hint {\n    font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n    font-style: italic;\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) {\n    border-left: 3px solid var(--color-danger);\n    padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n    color: var(--color-danger);\n    font-weight: 700;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field__msg {\n    order: 1;\n  }\n  .kol-form-field__label {\n    order: 2;\n  }\n  .kol-form-field__input {\n    order: 3;\n  }\n  .kol-form-field__hint {\n    order: 4;\n  }\n  .kol-input-container {\n    background-color: var(--color-light);\n    border-color: var(--color-subtle);\n    border-radius: var(--border-radius);\n    border-style: solid;\n    border-width: 2px;\n    padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n    gap: calc(6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment {\n    min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--start > .kol-icon {\n    margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--end > .kol-icon {\n    margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container--disabled {\n    background-color: var(--color-mute);\n    border-color: var(--color-mute-variant);\n    color: var(--color-text);\n    cursor: not-allowed;\n  }\n  .kol-input-container:not(.kol-input-container--disabled):hover {\n    border-color: var(--color-primary);\n  }\n  .kol-input-container:focus-within {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-input-container--error:focus-within {\n    outline-color: var(--color-danger);\n  }\n}\n@layer kol-theme-component {\n  .kol-input {\n    background-color: transparent;\n    border: none;\n  }\n  .kol-input::placeholder {\n    color: var(--color-subtle);\n  }\n}\n@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--tertiary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-input-container {\n    gap: initial;\n  }\n  .kol-input-container__filename {\n    color: var(--color-subtle);\n  }\n  .kol-input-container--is-dragover {\n    border-color: var(--color-primary);\n  }\n  .kol-button__text {\n    border-top-right-radius: calc(var(--border-radius) - 2px);\n    border-bottom-right-radius: calc(var(--border-radius) - 2px);\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n    white-space: nowrap;\n  }\n  .kol-input {\n    padding-top: calc(0.5em + 2rem / var(--kolibri-root-font-size, 16));\n    background-color: transparent;\n  }\n}";
 var css_248z$1O = "@layer kol-theme-component {\n  :host {\n    font-family: var(--font-family);\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field {\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field__hint {\n    font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n    font-style: italic;\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) {\n    border-left: 3px solid var(--color-danger);\n    padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n    color: var(--color-danger);\n    font-weight: 700;\n  }\n  .kol-form-field--required .kol-form-field__label-text::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n    padding-left: 0.125em;\n  }\n  .kol-form-field__msg {\n    order: 1;\n  }\n  .kol-form-field__label {\n    order: 2;\n  }\n  .kol-form-field__input {\n    order: 3;\n  }\n  .kol-form-field__hint {\n    order: 4;\n  }\n  .kol-input-container {\n    background-color: var(--color-light);\n    border-color: var(--color-subtle);\n    border-radius: var(--border-radius);\n    border-style: solid;\n    border-width: 2px;\n    padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n    gap: calc(6rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment {\n    min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--start > .kol-icon {\n    margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container__adornment--end > .kol-icon {\n    margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-input-container--disabled {\n    background-color: var(--color-mute);\n    border-color: var(--color-mute-variant);\n    color: var(--color-text);\n    cursor: not-allowed;\n  }\n  .kol-input-container:not(.kol-input-container--disabled):hover {\n    border-color: var(--color-primary);\n  }\n  .kol-input-container:focus-within {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-input-container--error:focus-within {\n    outline-color: var(--color-danger);\n  }\n}\n@layer kol-theme-component {\n  .kol-input {\n    background-color: transparent;\n    border: none;\n  }\n  .kol-input::placeholder {\n    color: var(--color-subtle);\n  }\n}";
@@ -675,7 +675,7 @@ var css_248z$1K = "@layer kol-theme-component {\n  :host {\n    font-family: var
 var css_248z$1J = "@layer kol-theme-component {\n  .kol-kolibri {\n    font-family: var(--font-family);\n  }\n}";
-var css_248z$1I = "@layer kol-theme-component {\n  .kol-link {\n    font-family: var(--font-family);\n  }\n  .kol-link__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-link:focus {\n    outline: none;\n  }\n  .kol-link--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-link--secondary, .kol-link--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-link--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-link--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-link__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-link--hide-label .kol-link__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-link--hide-label .kol-link__text .kol-span__label {\n    display: none;\n  }\n  .kol-link:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-link:disabled:hover .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  :host {\n    font-family: var(--font-family);\n  }\n}";
+var css_248z$1I = "@layer kol-theme-component {\n  .kol-link {\n    font-family: var(--font-family);\n  }\n  .kol-link__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-link:focus {\n    outline: none;\n  }\n  .kol-link--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-link--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-link--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-link--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--tertiary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-link--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-link__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-link--hide-label .kol-link__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-link--hide-label .kol-link__text .kol-span__label {\n    display: none;\n  }\n  .kol-link:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-link:disabled:hover .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  :host {\n    font-family: var(--font-family);\n  }\n}";
 var css_248z$1H = "@layer kol-theme-component {\n  .kol-modal__card {\n    box-shadow: 0 0 4px var(--color-subtle);\n    border-radius: var(--border-radius);\n  }\n}";
@@ -685,7 +685,7 @@ var css_248z$1F = "@layer kol-theme-component {\n  .kol-nav {\n    font-family:
 var css_248z$1E = "@layer kol-theme-component {\n  :host {\n    font-family: var(--font-family);\n  }\n  .kol-pagination__button--selected .kol-button {\n    opacity: 1;\n  }\n  .kol-button__text {\n    background-color: var(--color-light);\n    border-radius: var(--border-radius);\n    border: 1px solid var(--color-primary);\n    color: var(--color-primary);\n    font-weight: 700;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-pagination__button--selected .kol-button__text {\n    background-color: var(--color-primary);\n    color: var(--color-light);\n    border: 0;\n  }\n  .kol-button:focus .kol-button__text {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:is(:active, :hover):not(:disabled) .kol-button__text {\n    background-color: var(--color-primary-variant);\n    border-color: var(--color-primary-variant);\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    color: var(--color-light);\n  }\n  .kol-button:active .kol-button__text {\n    color: var(--color-light);\n    outline: none;\n  }\n}";
-var css_248z$1D = "@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary, .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-popover-button__popover {\n    border: var(--border-width) solid var(--color-primary);\n    padding: var(--spacing);\n  }\n}";
+var css_248z$1D = "@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--tertiary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-popover-button__popover {\n    border: var(--border-width) solid var(--color-primary);\n    padding: var(--spacing);\n  }\n}";
 var css_248z$1C = "@layer kol-theme-component {\n  .kol-progress {\n    font-family: var(--font-family);\n  }\n  .kol-progress__bar-progress {\n    fill: var(--color-primary-variant);\n  }\n  .kol-progress__cycle-background {\n    stroke: var(--color-mute-variant);\n  }\n  .kol-progress__cycle-progress {\n    stroke: var(--color-primary-variant);\n  }\n}";
@@ -695,11 +695,11 @@ var css_248z$1A = "@layer kol-theme-component {\n  :host {\n    font-family: var
 var css_248z$1z = "@layer kol-theme-component {\n  .kol-skip-nav {\n    font-family: var(--font-family);\n  }\n  .kol-skip-nav .kol-link__text {\n    border-radius: var(--a11y-min-size);\n    border-style: solid;\n    border-width: var(--border-width);\n    gap: calc(var(--spacing) * 2);\n    line-height: 1;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--color-primary-variant);\n    border-color: var(--color-primary-variant);\n    color: var(--color-light);\n    cursor: pointer;\n  }\n}";
-var css_248z$1y = "@layer kol-theme-component {\n  .kol-split-button {\n    font-family: var(--font-family);\n    border-radius: var(--border-radius);\n    border-style: solid;\n    border-width: var(--border-width);\n    border-color: var(--color-primary);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  .kol-split-button__button .kol-button .kol-span {\n    border-top-left-radius: var(--border-radius);\n    border-bottom-left-radius: var(--border-radius);\n  }\n  .kol-split-button__horizontal-line {\n    background-color: var(--color-primary);\n    border-radius: 2px;\n    width: calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-split-button__secondary-button {\n    height: 100%;\n  }\n  .kol-split-button__secondary-button .kol-span {\n    border-top-right-radius: var(--border-radius);\n    border-bottom-right-radius: var(--border-radius);\n  }\n  .kol-split-button .kol-span {\n    font-weight: 700;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-split-button .kol-popover__content {\n    background-color: #fff;\n  }\n  .kol-split-button .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-split-button .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-split-button .kol-button:focus {\n    outline: none;\n  }\n  .kol-split-button .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-split-button .kol-button--secondary, .kol-split-button .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-split-button .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-split-button .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-split-button .kol-button--primary:not([disabled]):hover, .kol-split-button .kol-button--secondary:not([disabled]):hover, .kol-split-button .kol-button--normal:not([disabled]):hover, .kol-split-button .kol-button--danger:not([disabled]):hover, .kol-split-button .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-split-button .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-split-button .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-split-button .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-split-button .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-split-button .kol-button:disabled:hover .kol-split-button .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-split-button__button .kol-button__text {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  .kol-split-button__secondary-button .kol-button__text {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n  .kol-split-button .kol-button {\n    height: 100%;\n  }\n  .kol-split-button .kol-button__text {\n    height: 100%;\n    border: none;\n  }\n}";
+var css_248z$1y = "@layer kol-theme-component {\n  .kol-split-button {\n    font-family: var(--font-family);\n    border-radius: var(--border-radius);\n    border-style: solid;\n    border-width: var(--border-width);\n    border-color: var(--color-primary);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n  }\n  .kol-split-button__button .kol-button .kol-span {\n    border-top-left-radius: var(--border-radius);\n    border-bottom-left-radius: var(--border-radius);\n  }\n  .kol-split-button__horizontal-line {\n    background-color: var(--color-primary);\n    border-radius: 2px;\n    width: calc(1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-split-button__secondary-button {\n    height: 100%;\n  }\n  .kol-split-button__secondary-button .kol-span {\n    border-top-right-radius: var(--border-radius);\n    border-bottom-right-radius: var(--border-radius);\n  }\n  .kol-split-button .kol-span {\n    font-weight: 700;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-split-button .kol-popover__content {\n    background-color: #fff;\n  }\n  .kol-split-button .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-split-button .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-split-button .kol-button:focus {\n    outline: none;\n  }\n  .kol-split-button .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-split-button .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-split-button .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-split-button .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-split-button .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-split-button .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-split-button .kol-button--primary:not([disabled]):hover, .kol-split-button .kol-button--secondary:not([disabled]):hover, .kol-split-button .kol-button--tertiary:not([disabled]):hover, .kol-split-button .kol-button--normal:not([disabled]):hover, .kol-split-button .kol-button--danger:not([disabled]):hover, .kol-split-button .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-split-button .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-split-button .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-split-button .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-split-button .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-split-button .kol-button:disabled:hover .kol-split-button .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-split-button__button .kol-button__text {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n  .kol-split-button__secondary-button .kol-button__text {\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n  }\n  .kol-split-button .kol-button {\n    height: 100%;\n  }\n  .kol-split-button .kol-button__text {\n    height: 100%;\n    border: none;\n  }\n}";
-var css_248z$1x = "@layer kol-theme-component {\n  .kol-table-settings {\n    right: calc(8rem / var(--kolibri-root-font-size, 16));\n    top: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content {\n    padding: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-table-settings__content .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-table-settings__content .kol-button:focus {\n    outline: none;\n  }\n  .kol-table-settings__content .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--secondary, .kol-table-settings__content .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-table-settings__content .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-table-settings__content .kol-button--primary:not([disabled]):hover, .kol-table-settings__content .kol-button--secondary:not([disabled]):hover, .kol-table-settings__content .kol-button--normal:not([disabled]):hover, .kol-table-settings__content .kol-button--danger:not([disabled]):hover, .kol-table-settings__content .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-table-settings__content .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-table-settings__content .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-table-settings__content .kol-button:disabled:hover .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-table-settings__error-message {\n    display: block;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__columns {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__actions {\n    border-top: var(--border-width) solid var(--color-mute-variant);\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    justify-content: flex-end;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n    padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table {\n    font-family: var(--font-family);\n    line-height: var(--line-height);\n    word-break: break-word;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__table, .kol-table__caption {\n    border-width: 0;\n    border-bottom-width: calc(var(--border-width) * 2);\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__table {\n    width: 100%;\n    border-spacing: 0;\n  }\n  .kol-table__caption {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) var(--a11y-min-size) calc(8rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n    min-height: calc(var(--a11y-min-size) + 2px);\n  }\n  .kol-table__focus-element:focus {\n    outline-color: var(--color-primary-variant);\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 3px;\n    transition: outline-offset 0.2s linear;\n  }\n  .kol-table__cell {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__cell--header {\n    font-weight: normal;\n    color: var(--color-primary);\n    background-color: var(--color-light);\n  }\n  .kol-table__cell--ascending, .kol-table__cell--descending {\n    font-weight: 700;\n  }\n  .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n    font-weight: 700;\n  }\n  .kol-table__selection {\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    grid-template-columns: 1fr auto;\n    align-items: center;\n  }\n  .kol-table__spacer {\n    display: table-row;\n    height: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__spacer-line {\n    border-width: 0;\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__spacer-line--foot {\n    border-bottom-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__spacer-line--head {\n    border-top-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__row--body:nth-child(even) {\n    background-color: var(--color-mute);\n  }\n  .kol-table__selection-input:not(:disabled):hover {\n    border-color: var(--color-primary);\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n  }\n  .kol-table__selection-input:focus {\n    border-color: var(--color-primary);\n    outline-color: var(--color-primary-variant);\n    outline-style: solid;\n    outline-offset: 2px;\n    outline-width: 3px;\n  }\n  .kol-table__selection-input:focus:hover {\n    box-shadow: none;\n  }\n  .kol-table__selection-input--checkbox {\n    border-color: var(--color-subtle);\n    border-radius: 5px;\n  }\n  .kol-table__selection-input--checkbox:checked {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio {\n    display: flex;\n    border-color: var(--color-subtle);\n  }\n  .kol-table__selection-input--radio:checked {\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio:checked:before {\n    background-color: var(--color-primary);\n  }\n  .kol-table__selection--indeterminate .kol-table__selection-input {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-icon {\n    color: var(--color-light);\n  }\n  .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n    border-color: var(--color-primary);\n  }\n  .kol-table-stateful__pagination {\n    font-family: var(--font-family);\n    line-height: var(--line-height);\n    word-break: break-word;\n  }\n  @media (min-width: 1024px) {\n    .kol-table-stateful .kol-pagination {\n      display: flex;\n      align-items: center;\n    }\n  }\n}";
+var css_248z$1x = "@layer kol-theme-component {\n  .kol-table-settings {\n    right: calc(8rem / var(--kolibri-root-font-size, 16));\n    top: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content {\n    padding: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-table-settings__content .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-table-settings__content .kol-button:focus {\n    outline: none;\n  }\n  .kol-table-settings__content .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-table-settings__content .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-table-settings__content .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-table-settings__content .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-table-settings__content .kol-button--primary:not([disabled]):hover, .kol-table-settings__content .kol-button--secondary:not([disabled]):hover, .kol-table-settings__content .kol-button--tertiary:not([disabled]):hover, .kol-table-settings__content .kol-button--normal:not([disabled]):hover, .kol-table-settings__content .kol-button--danger:not([disabled]):hover, .kol-table-settings__content .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-table-settings__content .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-table-settings__content .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-table-settings__content .kol-button:disabled:hover .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-table-settings__error-message {\n    display: block;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__columns {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__actions {\n    border-top: var(--border-width) solid var(--color-mute-variant);\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    justify-content: flex-end;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n    padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table {\n    font-family: var(--font-family);\n    line-height: var(--line-height);\n    word-break: break-word;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__table, .kol-table__caption {\n    border-width: 0;\n    border-bottom-width: calc(var(--border-width) * 2);\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__table {\n    width: 100%;\n    border-spacing: 0;\n  }\n  .kol-table__caption {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) var(--a11y-min-size) calc(8rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n    min-height: calc(var(--a11y-min-size) + 2px);\n  }\n  .kol-table__focus-element:focus {\n    outline-color: var(--color-primary-variant);\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 3px;\n    transition: outline-offset 0.2s linear;\n  }\n  .kol-table__cell {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__cell--header {\n    font-weight: normal;\n    color: var(--color-primary);\n    background-color: var(--color-light);\n  }\n  .kol-table__cell--ascending, .kol-table__cell--descending {\n    font-weight: 700;\n  }\n  .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n    font-weight: 700;\n  }\n  .kol-table__selection {\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    grid-template-columns: 1fr auto;\n    align-items: center;\n  }\n  .kol-table__spacer {\n    display: table-row;\n    height: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__spacer-line {\n    border-width: 0;\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__spacer-line--foot {\n    border-bottom-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__spacer-line--head {\n    border-top-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__row--body:nth-child(even) {\n    background-color: var(--color-mute);\n  }\n  .kol-table__selection-input:not(:disabled):hover {\n    border-color: var(--color-primary);\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n  }\n  .kol-table__selection-input:focus {\n    border-color: var(--color-primary);\n    outline-color: var(--color-primary-variant);\n    outline-style: solid;\n    outline-offset: 2px;\n    outline-width: 3px;\n  }\n  .kol-table__selection-input:focus:hover {\n    box-shadow: none;\n  }\n  .kol-table__selection-input--checkbox {\n    border-color: var(--color-subtle);\n    border-radius: 5px;\n  }\n  .kol-table__selection-input--checkbox:checked {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio {\n    display: flex;\n    border-color: var(--color-subtle);\n  }\n  .kol-table__selection-input--radio:checked {\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio:checked:before {\n    background-color: var(--color-primary);\n  }\n  .kol-table__selection--indeterminate .kol-table__selection-input {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-icon {\n    color: var(--color-light);\n  }\n  .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n    border-color: var(--color-primary);\n  }\n  .kol-table-stateful__pagination {\n    font-family: var(--font-family);\n    line-height: var(--line-height);\n    word-break: break-word;\n  }\n  @media (min-width: 1024px) {\n    .kol-table-stateful .kol-pagination {\n      display: flex;\n      align-items: center;\n    }\n  }\n}";
-var css_248z$1w = "@layer kol-theme-component {\n  .kol-table-settings {\n    right: calc(8rem / var(--kolibri-root-font-size, 16));\n    top: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content {\n    padding: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-table-settings__content .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-table-settings__content .kol-button:focus {\n    outline: none;\n  }\n  .kol-table-settings__content .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--secondary, .kol-table-settings__content .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-table-settings__content .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-table-settings__content .kol-button--primary:not([disabled]):hover, .kol-table-settings__content .kol-button--secondary:not([disabled]):hover, .kol-table-settings__content .kol-button--normal:not([disabled]):hover, .kol-table-settings__content .kol-button--danger:not([disabled]):hover, .kol-table-settings__content .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-table-settings__content .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-table-settings__content .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-table-settings__content .kol-button:disabled:hover .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-table-settings__error-message {\n    display: block;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__columns {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__actions {\n    border-top: var(--border-width) solid var(--color-mute-variant);\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    justify-content: flex-end;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n    padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table {\n    font-family: var(--font-family);\n    line-height: var(--line-height);\n    word-break: break-word;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__table, .kol-table__caption {\n    border-width: 0;\n    border-bottom-width: calc(var(--border-width) * 2);\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__table {\n    width: 100%;\n    border-spacing: 0;\n  }\n  .kol-table__caption {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) var(--a11y-min-size) calc(8rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n    min-height: calc(var(--a11y-min-size) + 2px);\n  }\n  .kol-table__focus-element:focus {\n    outline-color: var(--color-primary-variant);\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 3px;\n    transition: outline-offset 0.2s linear;\n  }\n  .kol-table__cell {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__cell--header {\n    font-weight: normal;\n    color: var(--color-primary);\n    background-color: var(--color-light);\n  }\n  .kol-table__cell--ascending, .kol-table__cell--descending {\n    font-weight: 700;\n  }\n  .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n    font-weight: 700;\n  }\n  .kol-table__selection {\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    grid-template-columns: 1fr auto;\n    align-items: center;\n  }\n  .kol-table__spacer {\n    display: table-row;\n    height: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__spacer-line {\n    border-width: 0;\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__spacer-line--foot {\n    border-bottom-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__spacer-line--head {\n    border-top-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__row--body:nth-child(even) {\n    background-color: var(--color-mute);\n  }\n  .kol-table__selection-input:not(:disabled):hover {\n    border-color: var(--color-primary);\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n  }\n  .kol-table__selection-input:focus {\n    border-color: var(--color-primary);\n    outline-color: var(--color-primary-variant);\n    outline-style: solid;\n    outline-offset: 2px;\n    outline-width: 3px;\n  }\n  .kol-table__selection-input:focus:hover {\n    box-shadow: none;\n  }\n  .kol-table__selection-input--checkbox {\n    border-color: var(--color-subtle);\n    border-radius: 5px;\n  }\n  .kol-table__selection-input--checkbox:checked {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio {\n    display: flex;\n    border-color: var(--color-subtle);\n  }\n  .kol-table__selection-input--radio:checked {\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio:checked:before {\n    background-color: var(--color-primary);\n  }\n  .kol-table__selection--indeterminate .kol-table__selection-input {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-icon {\n    color: var(--color-light);\n  }\n  .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n    border-color: var(--color-primary);\n  }\n}";
+var css_248z$1w = "@layer kol-theme-component {\n  .kol-table-settings {\n    right: calc(8rem / var(--kolibri-root-font-size, 16));\n    top: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content {\n    padding: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__content .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-table-settings__content .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-table-settings__content .kol-button:focus {\n    outline: none;\n  }\n  .kol-table-settings__content .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-table-settings__content .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-table-settings__content .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-table-settings__content .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-table-settings__content .kol-button--primary:not([disabled]):hover, .kol-table-settings__content .kol-button--secondary:not([disabled]):hover, .kol-table-settings__content .kol-button--tertiary:not([disabled]):hover, .kol-table-settings__content .kol-button--normal:not([disabled]):hover, .kol-table-settings__content .kol-button--danger:not([disabled]):hover, .kol-table-settings__content .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-table-settings__content .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-table-settings__content .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-table-settings__content .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-table-settings__content .kol-button:disabled:hover .kol-table-settings__content .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-table-settings__error-message {\n    display: block;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__columns {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table-settings__actions {\n    border-top: var(--border-width) solid var(--color-mute-variant);\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    justify-content: flex-end;\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n    padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table {\n    font-family: var(--font-family);\n    line-height: var(--line-height);\n    word-break: break-word;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__table, .kol-table__caption {\n    border-width: 0;\n    border-bottom-width: calc(var(--border-width) * 2);\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__table {\n    width: 100%;\n    border-spacing: 0;\n  }\n  .kol-table__caption {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) var(--a11y-min-size) calc(8rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n    min-height: calc(var(--a11y-min-size) + 2px);\n  }\n  .kol-table__focus-element:focus {\n    outline-color: var(--color-primary-variant);\n    outline-offset: 2px;\n    outline-style: solid;\n    outline-width: 3px;\n    transition: outline-offset 0.2s linear;\n  }\n  .kol-table__cell {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__cell--header {\n    font-weight: normal;\n    color: var(--color-primary);\n    background-color: var(--color-light);\n  }\n  .kol-table__cell--ascending, .kol-table__cell--descending {\n    font-weight: 700;\n  }\n  .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n    font-weight: 700;\n  }\n  .kol-table__selection {\n    display: flex;\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n    grid-template-columns: 1fr auto;\n    align-items: center;\n  }\n  .kol-table__spacer {\n    display: table-row;\n    height: calc(24rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-table__spacer-line {\n    border-width: 0;\n    border-color: var(--color-primary-variant);\n    border-style: solid;\n  }\n  .kol-table__spacer-line--foot {\n    border-bottom-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__spacer-line--head {\n    border-top-width: calc(var(--border-width) * 2);\n  }\n  .kol-table__row--body:nth-child(even) {\n    background-color: var(--color-mute);\n  }\n  .kol-table__selection-input:not(:disabled):hover {\n    border-color: var(--color-primary);\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n  }\n  .kol-table__selection-input:focus {\n    border-color: var(--color-primary);\n    outline-color: var(--color-primary-variant);\n    outline-style: solid;\n    outline-offset: 2px;\n    outline-width: 3px;\n  }\n  .kol-table__selection-input:focus:hover {\n    box-shadow: none;\n  }\n  .kol-table__selection-input--checkbox {\n    border-color: var(--color-subtle);\n    border-radius: 5px;\n  }\n  .kol-table__selection-input--checkbox:checked {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio {\n    display: flex;\n    border-color: var(--color-subtle);\n  }\n  .kol-table__selection-input--radio:checked {\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-input--radio:checked:before {\n    background-color: var(--color-primary);\n  }\n  .kol-table__selection--indeterminate .kol-table__selection-input {\n    background-color: var(--color-primary);\n    border-color: var(--color-primary);\n  }\n  .kol-table__selection-icon {\n    color: var(--color-light);\n  }\n  .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n    border-color: var(--color-primary);\n  }\n}";
 var css_248z$1v = "@layer kol-theme-component {\n  .kol-tabs {\n    font-family: var(--font-family);\n    display: grid;\n    grid-template-rows: var(--grid-template-rows);\n    grid-template-columns: var(--grid-template-columns);\n  }\n  .kol-tabs--align-right {\n    --display: grid;\n    --grid-template-columns: 1fr auto;\n    --button-group-display: grid;\n    --button-group-order: 1;\n  }\n  .kol-tabs--align-left {\n    --display: grid;\n    --grid-template-columns: auto 1fr;\n    --button-group-order: 0;\n  }\n  .kol-tabs--align-bottom {\n    --display: flex;\n    --grid-template-rows: 1fr auto;\n    --button-group-gap: calc(32rem / var(--kolibri-root-font-size, 16));\n    --button-group-order: 1;\n  }\n  .kol-tabs--align-top {\n    --display: flex;\n    --grid-template-rows: auto 1fr;\n    --button-group-gap: calc(32rem / var(--kolibri-root-font-size, 16));\n    --button-group-order: 0;\n  }\n  .kol-tabs__button-group {\n    display: var(--display);\n    flex-wrap: wrap;\n    gap: var(--button-group-gap);\n    order: var(--button-group-order);\n  }\n  .kol-tabs .kol-button {\n    box-sizing: border-box;\n    background-color: transparent;\n    border: 0;\n    border-radius: var(--border-radius);\n    border: none;\n    font-style: normal;\n    font-weight: 700;\n    font-size: calc(18rem / var(--kolibri-root-font-size, 16));\n    line-height: 1.2;\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    color: var(--color-subtle);\n    padding: 0;\n  }\n  .kol-tabs .kol-button:hover {\n    color: var(--color-primary);\n  }\n  .kol-tabs .kol-button.primary, .kol-tabs .kol-button.selected {\n    color: var(--color-primary);\n  }\n  .kol-tabs .kol-button:not(.kol-tabs .kol-button.selected) .kol-span__container {\n    padding-bottom: 0.25em;\n  }\n  .kol-tabs .kol-button.selected .kol-span__container {\n    border-bottom: 0.25em solid;\n  }\n  .kol-tabs .kol-button .kol-span__container {\n    gap: calc(8rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tabs .kol-icon {\n    font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tabs__content {\n    padding: 0.25em 0;\n  }\n  .kol-tabs__panel {\n    height: 100%;\n  }\n  .kol-tabs .kol-button-wc {\n    width: 100%;\n  }\n}";
@@ -707,7 +707,7 @@ var css_248z$1u = "@layer kol-theme-component {\n  :host {\n    font-family: var
 var css_248z$1t = "@layer kol-theme-component {\n  .kol-alert {\n    font-family: var(--font-family);\n    display: flex;\n    width: 100%;\n    overflow: unset;\n    background-color: var(--color-light);\n  }\n  .kol-alert--msg {\n    align-items: start;\n  }\n  .kol-alert--card {\n    border-radius: var(--border-radius);\n    border: var(--border-width) solid var(--alert-accent-color);\n    filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n    flex-direction: column;\n  }\n  .kol-alert--default {\n    --alert-accent-color: var(--color-subtle);\n  }\n  .kol-alert--error {\n    --alert-accent-color: var(--color-danger);\n  }\n  .kol-alert--info {\n    --alert-accent-color: var(--color-primary);\n  }\n  .kol-alert--success {\n    --alert-accent-color: var(--color-success);\n  }\n  .kol-alert--warning {\n    --alert-accent-color: var(--color-warning);\n  }\n  .kol-alert__container {\n    display: flex;\n    gap: 0.5em;\n    place-items: center;\n  }\n  .kol-alert--card .kol-alert__container {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n    background-color: var(--alert-accent-color);\n  }\n  .kol-alert__container-content {\n    display: grid;\n    gap: calc(4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__container-content {\n    width: 100%;\n    min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert__close-button {\n    place-self: center;\n  }\n  .kol-alert__close-button .kol-button {\n    border-radius: 50%;\n    cursor: pointer;\n    height: var(--a11y-min-size);\n    width: var(--a11y-min-size);\n  }\n  .kol-alert--msg .kol-alert__close-button .kol-button {\n    color: var(--alert-accent-color);\n  }\n  .kol-alert--card .kol-alert__close-button .kol-button {\n    color: var(--color-light);\n  }\n  .kol-alert__close-button .kol-icon {\n    font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading {\n    color: var(--alert-accent-color);\n    padding-top: calc(--var-spacing / 2);\n  }\n  .kol-alert--card .kol-alert__heading {\n    width: 100%;\n    color: var(--color-light);\n    display: flex;\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n    line-height: 1;\n  }\n  .kol-alert__heading-icon {\n    color: var(--color-light);\n    padding: 0;\n  }\n  .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n    font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--msg .kol-alert__heading-icon {\n    color: var(--alert-accent-color);\n    place-items: baseline;\n  }\n  .kol-alert--card .kol-alert__heading-icon {\n    justify-self: right;\n    margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-alert--card .kol-alert__content {\n    padding: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n  :host {\n    top: calc(16rem / var(--kolibri-root-font-size, 16));\n    right: calc(16rem / var(--kolibri-root-font-size, 16));\n    width: calc(440rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-toast-item {\n    margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n  }\n}";
-var css_248z$1s = "@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary, .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-link {\n    font-family: var(--font-family);\n  }\n  .kol-link__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-link:focus {\n    outline: none;\n  }\n  .kol-link--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-link--secondary, .kol-link--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-link--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-link--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-link__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-link--hide-label .kol-link__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-link--hide-label .kol-link__text .kol-span__label {\n    display: none;\n  }\n  .kol-link:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-link:disabled:hover .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-toolbar {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    border-radius: var(--border-radius);\n    background-color: var(--color-light);\n    border-width: var(--border-width);\n    border-style: solid;\n  }\n  .kol-link {\n    text-decoration: none;\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n}";
+var css_248z$1s = "@layer kol-theme-component {\n  .kol-button {\n    font-family: var(--font-family);\n  }\n  .kol-button__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-button:focus {\n    outline: none;\n  }\n  .kol-button--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-button--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-button--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-button--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-button--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--tertiary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-button--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-button__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-button--hide-label .kol-button__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-button--hide-label .kol-button__text .kol-span__label {\n    display: none;\n  }\n  .kol-button:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-button:disabled:hover .kol-button__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-link {\n    font-family: var(--font-family);\n  }\n  .kol-link__text {\n    font-weight: 700;\n    border-style: solid;\n    border-width: var(--border-width);\n    border-radius: var(--border-radius);\n  }\n  .kol-link:focus {\n    outline: none;\n  }\n  .kol-link--primary {\n    --text-background-color: var(--color-primary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-light);\n  }\n  .kol-link--secondary {\n    --text-background-color: var(--color-secondary);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link--tertiary {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link--normal {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-text);\n    --text-color: var(--color-text);\n  }\n  .kol-link--danger {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n    --text-color: var(--color-light);\n  }\n  .kol-link--ghost {\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-light);\n    --text-color: var(--color-primary);\n    --text-box-shadow: none;\n  }\n  .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--tertiary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n  .kol-link--danger:not([disabled]):hover {\n    --text-background-color: var(--color-danger);\n    --text-border-color: var(--color-danger);\n  }\n  .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    min-height: var(--a11y-min-size);\n    min-width: var(--a11y-min-size);\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    text-align: center;\n    transition-duration: 0.5s;\n    transition-property: background-color, color, border-color;\n  }\n  .kol-link__text:hover {\n    box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n  }\n  .kol-link--hide-label .kol-link__text {\n    padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n    width: unset;\n  }\n  .kol-link--hide-label .kol-link__text .kol-span__label {\n    display: none;\n  }\n  .kol-link:focus {\n    border-radius: var(--border-radius);\n    outline-offset: 2px;\n    outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n    transition: 200ms outline-offset linear;\n  }\n  .kol-link:disabled:hover .kol-link__text {\n    background-color: var(--text-background-color);\n    border-color: var(--text-border-color);\n    color: var(--text-color);\n    box-shadow: none;\n  }\n  .kol-toolbar {\n    padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n    border-radius: var(--border-radius);\n    background-color: var(--color-light);\n    border-width: var(--border-width);\n    border-style: solid;\n  }\n  .kol-link {\n    text-decoration: none;\n    --text-background-color: var(--color-light);\n    --text-border-color: var(--color-primary);\n    --text-color: var(--color-primary);\n  }\n  .kol-link:not([disabled]):hover {\n    --text-background-color: var(--color-primary-variant);\n    --text-border-color: var(--color-primary-variant);\n    --text-color: var(--color-light);\n  }\n}";
 var css_248z$1r = "@layer kol-theme-component {\n  .kol-tree-item {\n    --tree-item-indentation: calc(20rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tree-item__link {\n    display: block;\n    border: 1px solid transparent;\n  }\n  .kol-tree-item__link .kol-link {\n    color: var(--color-text);\n    text-align: left;\n  }\n  .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n    border: 1px solid var(--color-primary);\n    background-color: var(--color-primary-variant);\n  }\n  .kol-tree-item__link:hover .kol-link, .kol-tree-item__link:focus-within .kol-link {\n    outline-offset: 0;\n    color: var(--color-light);\n  }\n  .kol-tree-item__link--active {\n    background-color: var(--color-primary);\n  }\n  .kol-tree-item__link--active .kol-link {\n    color: var(--color-light);\n  }\n  .kol-tree-item__toggle-button:hover .kol-tree-item__toggle-button-icon::part(icon) {\n    transform: scale(1.6);\n  }\n  .kol-tree-item__text {\n    text-decoration: none;\n  }\n}";