@public-ui/theme-ecl 4.1.4-rc.1 → 4.1.4-rc.3

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 (18) hide show
  1. package/README.md +79 -194
  2. package/assets/ecl-icons/ecl-icons.eot +0 -0
  3. package/assets/ecl-icons/ecl-icons.json +93 -0
  4. package/assets/ecl-icons/ecl-icons.svg +285 -0
  5. package/assets/ecl-icons/ecl-icons.ttf +0 -0
  6. package/assets/ecl-icons/ecl-icons.woff +0 -0
  7. package/assets/ecl-icons/ecl-icons.woff2 +0 -0
  8. package/assets/ecl-icons/style.css +113 -0
  9. package/assets/kolicons/kolicons.eot +0 -0
  10. package/assets/kolicons/kolicons.ttf +0 -0
  11. package/assets/kolicons/kolicons.woff +0 -0
  12. package/assets/kolicons/kolicons.woff2 +0 -0
  13. package/assets/kolicons/style.css +9 -9
  14. package/dist/index.cjs +65 -59
  15. package/dist/index.cjs.map +1 -1
  16. package/dist/index.mjs +65 -59
  17. package/dist/index.mjs.map +1 -1
  18. package/package.json +14 -10
package/dist/index.cjs CHANGED
@@ -991,106 +991,111 @@ BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Arzneimittel und Mediz
991
991
  BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Bevölkerungsforschung'], ['Bundesinstitut', 'für Bevölkerungsforschung']);
992
992
  BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Sportwissenschaft'], ['Bundesinstitut', 'für Sportwissenschaft']);
993
993
 
994
- var css_248z$1k = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-accordion {\n background-color: var(--color-grey-5);\n border-color: var(--color-grey-25);\n border-style: solid;\n border-width: 1px;\n }\n .kol-accordion:focus-within {\n outline: 2px solid var(--color-blue);\n outline-offset: -2px;\n }\n .kol-accordion__heading-button .kol-button {\n display: flex;\n width: 100%;\n padding: 0 var(--spacing-m);\n place-items: center;\n line-height: 1.2;\n text-align: left;\n }\n .kol-accordion__heading-button .kol-button__text {\n color: var(--color-grey);\n width: 100%;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16)) 0;\n font-weight: var(--font-weight-bold);\n border: none;\n }\n .kol-accordion__heading-button .kol-button:focus, .kol-accordion__heading-button .kol-button:hover {\n background-color: var(--color-grey-25);\n }\n .kol-accordion__heading-button .kol-button:focus {\n outline: none;\n }\n .kol-accordion__heading-button .kol-icon {\n margin-top: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n margin-bottom: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n margin-inline-end: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n margin-inline-start: 0;\n }\n .kol-accordion__content {\n padding: var(--spacing-s) var(--spacing-m);\n }\n}";
994
+ var css_248z$1m = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-accordion {\n border-top: var(--ecl-color-neutral) solid 1px;\n }\n .kol-accordion:focus-visible {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-accordion__heading-button .kol-button {\n padding: var(--ecl-spacing-xl);\n }\n .kol-accordion__heading-button .kol-button:hover {\n background-color: var(--ecl-color-neutral-60);\n }\n .kol-accordion__heading-button .kol-button:focus {\n outline: none;\n }\n .kol-accordion__heading-button .kol-button .kol-icon {\n font-family: ecl-icons;\n }\n .kol-accordion__heading-button .kol-button .kol-icon::before {\n content: \"\\ea46\";\n }\n .kol-accordion__heading-button .kol-button[aria-expanded=true] {\n padding-bottom: var(--ecl-spacing-l);\n }\n .kol-accordion__heading-button .kol-button[aria-expanded=true] .kol-icon {\n font-family: ecl-icons;\n }\n .kol-accordion__heading-button .kol-button[aria-expanded=true] .kol-icon::before {\n content: \"\\ea38\";\n }\n .kol-accordion__heading-button .kol-span__container {\n width: 100%;\n flex-direction: row-reverse;\n justify-content: space-between;\n }\n .kol-accordion__content {\n padding: 0 var(--ecl-spacing-xl) var(--ecl-spacing-xl);\n }\n}";
995
995
 
996
- var css_248z$1j = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
996
+ var css_248z$1l = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
997
997
 
998
- var css_248z$1i = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-badge {\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16) - 1 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 1 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal var(--font-weight) 1em var(--font-family);\n text-transform: uppercase;\n }\n}";
998
+ var css_248z$1k = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-badge {\n border-radius: 12px;\n padding: var(--ecl-spacing-2xs) var(--ecl-spacing-s);\n font-size: var(--ecl-font-size-s);\n }\n .kol-badge__smart-button {\n --a11y-min-size: 26px;\n margin-top: -2px;\n margin-bottom: -2px;\n margin-left: var(--ecl-spacing-2xs);\n }\n .kol-badge__smart-button .kol-button .kol-icon::before {\n content: \"\\ea0e\";\n }\n .kol-badge__smart-button .kol-button:hover {\n color: var(--ecl-color-white);\n background-color: var(--ecl-color-primary);\n }\n}";
999
999
 
1000
- var css_248z$1h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n .kol-breadcrumb {\n font: normal normal 400 calc(14 * 1rem / var(--kolibri-root-font-size, 16))/calc(16 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: var(--font-weight-bold);\n }\n .kol-breadcrumb__icon[exportparts*=separator]::before {\n color: var(--color-blue);\n padding: 0;\n margin-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n margin-inline-start: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-breadcrumb__list-element:last-child {\n color: var(--color-grey-75);\n }\n}";
1000
+ var css_248z$1j = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--ecl-color-primary);\n }\n .kol-link .kol-span__label {\n text-decoration-thickness: from-font;\n text-underline-offset: clamp(3px, 0.245em, 10px);\n }\n .kol-link:hover {\n color: var(--ecl-color-primary-140);\n }\n .kol-link:focus {\n outline: 2px solid var(--ecl-color-primary);\n border-radius: 1px;\n outline-offset: 2px;\n }\n .kol-breadcrumb__separator {\n color: var(--ecl-color-primary);\n margin-inline-end: var(--ecl-spacing-m);\n margin-inline-start: var(--ecl-spacing-m);\n }\n}";
1001
1001
 
1002
- var css_248z$1g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:hover {\n color: var(--color-blue-130);\n }\n .badge-text-hint {\n color: var(--color-text);\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n padding: 0 0.3em;\n }\n}";
1002
+ var css_248z$1i = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n color: var(--ecl-color-primary);\n }\n .kol-button .kol-span__label {\n text-decoration-thickness: from-font;\n text-underline-offset: clamp(3px, 0.245em, 10px);\n }\n .kol-button:hover {\n color: var(--ecl-color-primary-140);\n }\n .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n border-radius: 1px;\n outline-offset: 2px;\n }\n}";
1003
1003
 
1004
- var css_248z$1f = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n}";
1004
+ var css_248z$1h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n}";
1005
1005
 
1006
- var css_248z$1e = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n display: inline-flex;\n padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);\n font-size: 1.25em;\n font-weight: 700;\n line-height: 1.75em;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}";
1006
+ var css_248z$1g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-card .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-card .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-card .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-card .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-card .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-card .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-card .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-card .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-card .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-card .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-card .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-card .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-card {\n background-color: var(--ecl-color-white);\n box-shadow: var(--ecl-shadow-1);\n border-radius: 0 0 2px 2px;\n border: 1px solid var(--ecl-color-stroke);\n border-bottom: 4px solid var(--ecl-color-primary);\n }\n .kol-card__header {\n display: block;\n padding: var(--ecl-spacing-xl) var(--ecl-spacing-m) var(--ecl-spacing-s) var(--ecl-spacing-xl);\n font-size: var(--ecl-font-size-l);\n font-weight: 400;\n line-height: var(--ecl-line-height-l);\n }\n .kol-card__content {\n padding: 0 var(--ecl-spacing-xl) var(--ecl-spacing-xl);\n }\n .kol-card__content ::slotted(p:first-child) {\n margin-top: 0;\n }\n .kol-card__content ::slotted(p:last-child) {\n margin-bottom: 0;\n }\n .kol-card__close-button .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card__close-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card__close-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n}";
1007
1007
 
1008
- var css_248z$1d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-blue);\n }\n .kol-custom-suggestions-option:focus {\n color: white;\n background-color: var(--color-blue);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-blue);\n border-style: solid;\n width: 100%;\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-combobox__group {\n color: var(--color-grey);\n display: inline-flex;\n width: 100%;\n min-height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n align-items: center;\n text-align: left;\n }\n .kol-combobox__input {\n position: relative;\n width: calc(100% - 24 * 1rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-combobox__input::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-combobox__input::placeholder {\n color: var(--color-grey-50);\n }\n .kol-combobox__input:first-child {\n padding-left: var(--spacing);\n }\n .kol-combobox__input:last-child {\n padding-right: var(--spacing);\n }\n .kol-combobox__input:focus {\n border: none;\n }\n}";
1008
+ var css_248z$1f = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n background-color: var(--ecl-color-neutral-80);\n }\n .kol-custom-suggestions-option:focus {\n background-color: var(--ecl-color-neutral-60);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--ecl-color-primary);\n border-style: solid;\n width: 100%;\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-combobox__group {\n display: inline-flex;\n width: 100%;\n align-items: center;\n }\n .kol-combobox__delete {\n margin-top: -2px;\n margin-bottom: -2px;\n }\n}";
1009
1009
 
1010
- var css_248z$1c = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-details__heading-button:focus-within {\n cursor: pointer;\n }\n .kol-details__heading-button .kol-button .kol-span__label {\n border-bottom-color: #000;\n }\n .kol-details__heading-button .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-details__heading-button .kol-span__container {\n display: flex;\n gap: 0;\n text-align: left;\n }\n .kol-details__content.indented-text {\n margin: 0;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n }\n}";
1010
+ var css_248z$1e = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-details {\n --detail-icon-rotate: rotate(180deg);\n }\n .kol-details__heading-button .kol-button {\n width: -moz-max-content;\n width: max-content;\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-details__heading-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-details__heading-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-details__heading-button .kol-button .kol-span__container {\n flex-direction: row-reverse;\n }\n .kol-details__heading-button .kol-button .kol-span__icon--left {\n transform: var(--detail-icon-rotate);\n transition: transform 0.3s ease-in-out;\n }\n .kol-details.collapsible--open {\n --detail-icon-rotate: rotate(0);\n }\n .kol-details__content {\n margin-top: var(--ecl-spacing-s);\n padding-inline-start: var(--ecl-spacing-m);\n }\n}";
1011
1011
 
1012
- var css_248z$1b = "@layer kol-theme-component {\n .kol-drawer__wrapper {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
1012
+ var css_248z$1d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-card .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-card .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-card .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-card .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-card .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-card .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-card .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-card .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-card .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-card .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-card .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-card .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-card {\n background-color: var(--ecl-color-white);\n box-shadow: var(--ecl-shadow-1);\n border-radius: 0 0 2px 2px;\n border: 1px solid var(--ecl-color-stroke);\n border-bottom: 4px solid var(--ecl-color-primary);\n }\n .kol-card__header {\n display: block;\n padding: var(--ecl-spacing-xl) var(--ecl-spacing-m) var(--ecl-spacing-s) var(--ecl-spacing-xl);\n font-size: var(--ecl-font-size-l);\n font-weight: 400;\n line-height: var(--ecl-line-height-l);\n }\n .kol-card__content {\n padding: 0 var(--ecl-spacing-xl) var(--ecl-spacing-xl);\n }\n .kol-card__content ::slotted(p:first-child) {\n margin-top: 0;\n }\n .kol-card__content ::slotted(p:last-child) {\n margin-bottom: 0;\n }\n .kol-card__close-button .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card__close-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card__close-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-dialog__card,\n .kol-modal__card {\n box-shadow: var(--ecl-shadow-16);\n padding: var(--ecl-spacing-m);\n }\n .kol-dialog .kol-card,\n .kol-modal .kol-card {\n box-shadow: none;\n border: 0;\n }\n .kol-dialog::backdrop,\n .kol-modal::backdrop {\n background-color: var(--ecl-color-overlay-light);\n }\n}";
1013
1013
 
1014
- var css_248z$1a = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form {\n width: 100%;\n }\n .kol-form__link {\n display: inline-block;\n }\n .kol-form__mandatory-fields-hint {\n margin: 0;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
1014
+ var css_248z$1c = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-card .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-card .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-card .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-card .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-card .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-card .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-card .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-card .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-card .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-card .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-card .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-card .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-card .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-card .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-card .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-card {\n background-color: var(--ecl-color-white);\n box-shadow: var(--ecl-shadow-1);\n border-radius: 0 0 2px 2px;\n border: 1px solid var(--ecl-color-stroke);\n border-bottom: 4px solid var(--ecl-color-primary);\n }\n .kol-card__header {\n display: block;\n padding: var(--ecl-spacing-xl) var(--ecl-spacing-m) var(--ecl-spacing-s) var(--ecl-spacing-xl);\n font-size: var(--ecl-font-size-l);\n font-weight: 400;\n line-height: var(--ecl-line-height-l);\n }\n .kol-card__content {\n padding: 0 var(--ecl-spacing-xl) var(--ecl-spacing-xl);\n }\n .kol-card__content ::slotted(p:first-child) {\n margin-top: 0;\n }\n .kol-card__content ::slotted(p:last-child) {\n margin-bottom: 0;\n }\n .kol-card__close-button .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-card__close-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-card__close-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-drawer__card {\n box-shadow: var(--ecl-shadow-16);\n padding: var(--ecl-spacing-m);\n }\n .kol-drawer .kol-card {\n box-shadow: none;\n border: 0;\n }\n .kol-drawer__dialog::backdrop {\n background-color: var(--ecl-color-overlay-light);\n }\n}";
1015
1015
 
1016
- var css_248z$19 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.25;\n }\n .kol-headline--h2 {\n font-size: calc(28 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.143;\n }\n .kol-headline--h3 {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.1667;\n }\n .kol-headline--h4 {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.4;\n }\n .kol-headline--h5 {\n font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.5;\n }\n .kol-headline--h6 {\n color: rgb(234, 0, 255);\n }\n}";
1016
+ var css_248z$1b = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--ecl-color-primary);\n }\n .kol-link .kol-span__label {\n text-decoration-thickness: from-font;\n text-underline-offset: clamp(3px, 0.245em, 10px);\n }\n .kol-link:hover {\n color: var(--ecl-color-primary-140);\n }\n .kol-link:focus {\n outline: 2px solid var(--ecl-color-primary);\n border-radius: 1px;\n outline-offset: 2px;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form {\n width: 100%;\n }\n .kol-form__link {\n display: inline-block;\n }\n .kol-form__mandatory-fields-hint {\n margin: 0;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-start-start-radius: 0;\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
1017
1017
 
1018
- var css_248z$18 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n color: var(--color-grey);\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-field-control--label-align-left .kol-field-control__label {\n padding-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right .kol-field-control__label {\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-checkbox .kol-input {\n color: var(--color-grey);\n background-color: var(--color-white);\n border-color: var(--color-grey-75);\n border-style: solid;\n border-width: 2px;\n line-height: 1.5;\n }\n .kol-checkbox .kol-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-checkbox .kol-input:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-checkbox .kol-input:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-checkbox .kol-input:checked:not(:disabled):hover {\n background-color: var(--color-blue-130);\n border-color: var(--color-blue-130);\n }\n .kol-checkbox .kol-input--error {\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:checked {\n background-color: var(--color-red);\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:not(:disabled):hover {\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:checked:not(:disabled):hover {\n background-color: var(--color-red-120);\n border-color: var(--color-red-120);\n }\n .kol-checkbox--variant-default {\n width: unset;\n min-width: unset;\n }\n .kol-checkbox--variant-default.kol-checkbox--checked .kol-icon {\n color: var(--color-white);\n }\n .kol-checkbox--variant-switch .kol-icon {\n color: var(--color-white);\n }\n .kol-checkbox--variant-switch .kol-input {\n display: block;\n }\n .kol-checkbox--variant-switch .kol-input::before {\n background-color: var(--color-grey-75);\n }\n .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon {\n color: #000;\n background-color: var(--color-white);\n }\n .kol-checkbox--variant-switch:hover .kol-input:not(:disabled)::before {\n background-color: var(--color-blue);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error .kol-icon {\n color: var(--color-white);\n background-color: var(--color-red);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error .kol-input::before {\n background-color: var(--color-red);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error.kol-checkbox--checked .kol-icon {\n color: #000;\n background-color: var(--color-white);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error:hover .kol-input:not(:disabled)::before {\n background-color: var(--color-red);\n }\n .kol-input-checkbox--variant-button {\n gap: var(--spacing-xs) 0;\n }\n .kol-input-checkbox--variant-button .kol-form-field__input {\n order: 1;\n }\n .kol-input-checkbox--variant-button .kol-form-field__hint {\n order: 2;\n }\n .kol-input-checkbox--variant-button .kol-form-field__msg {\n order: 3;\n }\n .kol-input-checkbox--variant-button:focus-within {\n outline-color: var(--color-blue-130);\n outline-style: solid;\n outline-width: 2px;\n }\n}";
1018
+ var css_248z$1a = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: var(--ecl-font-size-3xl);\n line-height: var(--ecl-line-height-3xl);\n }\n @media (min-width: 768px) {\n .kol-headline--h1 {\n font-size: var(--ecl-font-size-4xl);\n line-height: var(--ecl-line-height-4xl);\n }\n }\n .kol-headline--h2 {\n font-size: var(--ecl-font-size-2xl);\n line-height: var(--ecl-line-height-2xl);\n }\n @media (min-width: 768px) {\n .kol-headline--h2 {\n font-size: var(--ecl-font-size-3xl);\n line-height: var(--ecl-line-height-3xl);\n }\n }\n .kol-headline--h3 {\n font-size: var(--ecl-font-size-xl);\n line-height: var(--ecl-line-height-xl);\n }\n @media (min-width: 768px) {\n .kol-headline--h3 {\n font-size: var(--ecl-font-size-2xl);\n line-height: var(--ecl-line-height-2xl);\n }\n }\n .kol-headline--h4 {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n @media (min-width: 768px) {\n .kol-headline--h4 {\n font-size: var(--ecl-font-size-xl);\n line-height: var(--ecl-line-height-xl);\n }\n }\n .kol-headline--h5 {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-headline--h6 {\n font-size: var(--ecl-font-size-m);\n font-weight: var(--ecl-font-weight-bold);\n line-height: var(--ecl-line-height-m);\n }\n}";
1019
1019
 
1020
- var css_248z$17 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n}\n.kol-input-color__input--text, .kol-input-color__input--color {\n background-color: var(--color-white);\n min-height: calc(var(--a11y-min-size) - 8 * 1rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
1020
+ var css_248z$19 = "@layer kol-theme-component {\n @font-face {\n font-family: \"ecl-icons\";\n src: url(\"ecl-icons.eot?t=1777089082980\"); /* IE9*/\n src: url(\"ecl-icons.eot?t=1777089082980#iefix\") format(\"embedded-opentype\"), url(\"ecl-icons.woff2?t=1777089082980\") format(\"woff2\"), url(\"ecl-icons.woff?t=1777089082980\") format(\"woff\"), url(\"ecl-icons.ttf?t=1777089082980\") format(\"truetype\"), url(\"ecl-icons.svg?t=1777089082980#ecl-icons\") format(\"svg\"); /* iOS 4.1- */\n }\n [class^=ecl-icons-], [class*=\" ecl-icons-\"] {\n font-family: \"ecl-icons\";\n font-style: normal;\n font-weight: 400;\n line-height: 1em;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n .ecl-icons-arrow-left::before {\n content: \"\\ea01\";\n }\n .ecl-icons-audio::before {\n content: \"\\ea02\";\n }\n .ecl-icons-book::before {\n content: \"\\ea03\";\n }\n .ecl-icons-brochure::before {\n content: \"\\ea04\";\n }\n .ecl-icons-budget::before {\n content: \"\\ea05\";\n }\n .ecl-icons-calendar::before {\n content: \"\\ea06\";\n }\n .ecl-icons-camera::before {\n content: \"\\ea07\";\n }\n .ecl-icons-chain::before {\n content: \"\\ea08\";\n }\n .ecl-icons-check-filled::before {\n content: \"\\ea09\";\n }\n .ecl-icons-check::before {\n content: \"\\ea0a\";\n }\n .ecl-icons-clock-filled::before {\n content: \"\\ea0b\";\n }\n .ecl-icons-clock::before {\n content: \"\\ea0c\";\n }\n .ecl-icons-close-filled::before {\n content: \"\\ea0d\";\n }\n .ecl-icons-close-outline::before {\n content: \"\\ea0e\";\n }\n .ecl-icons-close::before {\n content: \"\\ea0f\";\n }\n .ecl-icons-copy::before {\n content: \"\\ea10\";\n }\n .ecl-icons-corner-arrow::before {\n content: \"\\ea11\";\n }\n .ecl-icons-data::before {\n content: \"\\ea12\";\n }\n .ecl-icons-digital::before {\n content: \"\\ea13\";\n }\n .ecl-icons-document::before {\n content: \"\\ea14\";\n }\n .ecl-icons-download::before {\n content: \"\\ea15\";\n }\n .ecl-icons-edit::before {\n content: \"\\ea16\";\n }\n .ecl-icons-email::before {\n content: \"\\ea17\";\n }\n .ecl-icons-energy::before {\n content: \"\\ea18\";\n }\n .ecl-icons-error-outline::before {\n content: \"\\ea19\";\n }\n .ecl-icons-error::before {\n content: \"\\ea1a\";\n }\n .ecl-icons-euro::before {\n content: \"\\ea1b\";\n }\n .ecl-icons-event::before {\n content: \"\\ea1c\";\n }\n .ecl-icons-external-events::before {\n content: \"\\ea1d\";\n }\n .ecl-icons-external::before {\n content: \"\\ea1e\";\n }\n .ecl-icons-eye::before {\n content: \"\\ea1f\";\n }\n .ecl-icons-faq::before {\n content: \"\\ea20\";\n }\n .ecl-icons-feedback::before {\n content: \"\\ea21\";\n }\n .ecl-icons-file-blank::before {\n content: \"\\ea22\";\n }\n .ecl-icons-file::before {\n content: \"\\ea23\";\n }\n .ecl-icons-folder::before {\n content: \"\\ea24\";\n }\n .ecl-icons-fullscreen::before {\n content: \"\\ea25\";\n }\n .ecl-icons-global::before {\n content: \"\\ea26\";\n }\n .ecl-icons-growth::before {\n content: \"\\ea27\";\n }\n .ecl-icons-hamburger::before {\n content: \"\\ea28\";\n }\n .ecl-icons-image::before {\n content: \"\\ea29\";\n }\n .ecl-icons-infographic::before {\n content: \"\\ea2a\";\n }\n .ecl-icons-information-outline::before {\n content: \"\\ea2b\";\n }\n .ecl-icons-information-round::before {\n content: \"\\ea2c\";\n }\n .ecl-icons-information::before {\n content: \"\\ea2d\";\n }\n .ecl-icons-laco-filled::before {\n content: \"\\ea2e\";\n }\n .ecl-icons-laco::before {\n content: \"\\ea2f\";\n }\n .ecl-icons-list::before {\n content: \"\\ea30\";\n }\n .ecl-icons-livestreaming::before {\n content: \"\\ea31\";\n }\n .ecl-icons-location-filled::before {\n content: \"\\ea32\";\n }\n .ecl-icons-location::before {\n content: \"\\ea33\";\n }\n .ecl-icons-log-in-outline::before {\n content: \"\\ea34\";\n }\n .ecl-icons-log-in::before {\n content: \"\\ea35\";\n }\n .ecl-icons-logged-in::before {\n content: \"\\ea36\";\n }\n .ecl-icons-minus-outline::before {\n content: \"\\ea37\";\n }\n .ecl-icons-minus::before {\n content: \"\\ea38\";\n }\n .ecl-icons-multiple-files::before {\n content: \"\\ea39\";\n }\n .ecl-icons-notification-active::before {\n content: \"\\ea3a\";\n }\n .ecl-icons-notification::before {\n content: \"\\ea3b\";\n }\n .ecl-icons-organigram::before {\n content: \"\\ea3c\";\n }\n .ecl-icons-package::before {\n content: \"\\ea3d\";\n }\n .ecl-icons-pause-filled::before {\n content: \"\\ea3e\";\n }\n .ecl-icons-pause-outline::before {\n content: \"\\ea3f\";\n }\n .ecl-icons-pause::before {\n content: \"\\ea40\";\n }\n .ecl-icons-play-filled::before {\n content: \"\\ea41\";\n }\n .ecl-icons-play-outline::before {\n content: \"\\ea42\";\n }\n .ecl-icons-play::before {\n content: \"\\ea43\";\n }\n .ecl-icons-plus-filled::before {\n content: \"\\ea44\";\n }\n .ecl-icons-plus-outline::before {\n content: \"\\ea45\";\n }\n .ecl-icons-plus::before {\n content: \"\\ea46\";\n }\n .ecl-icons-presentation::before {\n content: \"\\ea47\";\n }\n .ecl-icons-print::before {\n content: \"\\ea48\";\n }\n .ecl-icons-regulation::before {\n content: \"\\ea49\";\n }\n .ecl-icons-rss::before {\n content: \"\\ea4a\";\n }\n .ecl-icons-search::before {\n content: \"\\ea4b\";\n }\n .ecl-icons-settings::before {\n content: \"\\ea4c\";\n }\n .ecl-icons-share-filled::before {\n content: \"\\ea4d\";\n }\n .ecl-icons-share::before {\n content: \"\\ea4e\";\n }\n .ecl-icons-shopping-bag::before {\n content: \"\\ea4f\";\n }\n .ecl-icons-solid-arrow::before {\n content: \"\\ea50\";\n }\n .ecl-icons-sort-carets::before {\n content: \"\\ea51\";\n }\n .ecl-icons-spinner::before {\n content: \"\\ea52\";\n }\n .ecl-icons-spreadsheet::before {\n content: \"\\ea53\";\n }\n .ecl-icons-star-filled::before {\n content: \"\\ea54\";\n }\n .ecl-icons-star-outline::before {\n content: \"\\ea55\";\n }\n .ecl-icons-tag::before {\n content: \"\\ea56\";\n }\n .ecl-icons-trash::before {\n content: \"\\ea57\";\n }\n .ecl-icons-upload::before {\n content: \"\\ea58\";\n }\n .ecl-icons-warning-outline::before {\n content: \"\\ea59\";\n }\n .ecl-icons-warning-round::before {\n content: \"\\ea5a\";\n }\n .ecl-icons-warning::before {\n content: \"\\ea5b\";\n }\n}\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n}";
1021
1021
 
1022
- var css_248z$16 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1022
+ var css_248z$18 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n --kol-checkbox-color: var(--ecl-color-primary);\n }\n .kol-form-field__input {\n order: 2;\n }\n .kol-form-field__hint {\n order: 1;\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n justify-content: center;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox:focus-within::before, .kol-input-checkbox__field-control--variant-default .kol-checkbox:hover:not(:has(input:disabled))::before {\n background-color: var(--ecl-color-primary-20);\n border-radius: 100%;\n position: absolute;\n width: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n height: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n content: \"\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-eye,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-eye::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-link,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-link::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-check,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-check::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-cross,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-cross::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-settings,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-settings::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-up,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon .kol-icon[class*=\" kolicon-\"].kolicon-up::before,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox__icon,\n .kol-input-checkbox__field-control--variant-default .kol-checkbox .kol-checkbox-icon {\n color: var(--ecl-color-white);\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox input {\n border-color: var(--kol-checkbox-color);\n border-radius: 2px;\n position: relative;\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox input:checked, .kol-input-checkbox__field-control--variant-default .kol-checkbox input:indeterminate {\n background-color: var(--kol-checkbox-color);\n border-color: var(--kol-checkbox-color);\n }\n .kol-input-checkbox__field-control--variant-default .kol-checkbox input:focus {\n outline: transparent;\n }\n .kol-field-control--label-align-left .kol-field-control__label {\n padding-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right .kol-field-control__label {\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--error {\n --kol-checkbox-color: var(--ecl-color-error);\n }\n .kol-checkbox--variant-switch .kol-input {\n border-color: var(--kol-checkbox-color);\n border-radius: 16px;\n }\n .kol-checkbox--variant-switch .kol-input::before {\n background-color: var(--ecl-color-white);\n border-radius: 50%;\n }\n .kol-checkbox--variant-switch .kol-icon {\n color: var(--kol-checkbox-color);\n }\n .kol-checkbox--variant-switch.kol-checkbox--checked .kol-input::before {\n background-color: var(--kol-checkbox-color);\n }\n .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon {\n color: var(--ecl-color-white);\n }\n .kol-checkbox--variant-switch:hover .kol-input:not(:disabled) {\n outline: var(--ecl-color-primary-20) 8px solid;\n }\n .kol-input-checkbox--variant-button {\n gap: var(--spacing-xs) 0;\n }\n .kol-input-checkbox--variant-button:focus-within {\n outline-color: var(--ecl-color-primary-130);\n outline-style: solid;\n outline-width: 2px;\n }\n}";
1023
1023
 
1024
- var css_248z$15 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1024
+ var css_248z$17 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-color__inputs-wrapper {\n height: 100%;\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-color__input--text, .kol-input-color__input--color {\n background-color: var(--ecl-color-white);\n min-height: calc(var(--a11y-min-size) - 8 * 1rem / var(--kolibri-root-font-size, 16));\n border: 0;\n }\n}";
1025
1025
 
1026
- var css_248z$14 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n .kol-button__text {\n white-space: nowrap;\n }\n .kol-input-container {\n padding: 0 0 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
1026
+ var css_248z$16 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}";
1027
1027
 
1028
- var css_248z$13 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1028
+ var css_248z$15 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}";
1029
1029
 
1030
- var css_248z$12 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1030
+ var css_248z$14 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button__text {\n white-space: nowrap;\n }\n .kol-input-container {\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n -moz-column-gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n column-gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--ecl-color-primary);\n }\n}";
1031
1031
 
1032
- var css_248z$11 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n /**\n * normalizes the layout of form elements.\n */\n .kol-form-field {\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n border: 0;\n }\n /**\n * order the layout of form elements.\n */\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__input {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-form-field {\n padding: 0 calc(14 * 1rem / var(--kolibri-root-font-size, 16)) calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-wrap: wrap;\n align-items: flex-start;\n border: 0;\n }\n .kol-form-field__label {\n color: var(--color-grey);\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__input {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-field-control {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input:before {\n display: none;\n }\n .kol-input:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-input:focus {\n outline-color: var(--color-blue);\n }\n .kol-input:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input.kol-input--error {\n border: 2px solid var(--color-red);\n }\n .kol-input.kol-input--error:before {\n display: none;\n }\n .kol-input.kol-input--error:checked {\n border-color: var(--color-red);\n border-width: 7px;\n }\n .kol-input.kol-input--error:not(:disabled):hover {\n border-color: var(--color-red-1xx);\n }\n}";
1032
+ var css_248z$13 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n .kol-input-number .kol-input-number__step-button {\n color: var(--ecl-color-primary);\n font-weight: 700;\n transition-duration: 0.3s;\n transition-property: background-color, color;\n }\n .kol-input-number .kol-input-number__step-button:focus {\n outline: 0;\n }\n .kol-input-number .kol-input-number__step-button:hover {\n color: var(--ecl-color-white);\n background-color: var(--ecl-color-primary-140);\n }\n .kol-input-number .kol-input {\n min-width: calc(3 * var(--a11y-min-size) + 8px);\n }\n}";
1033
1033
 
1034
- var css_248z$10 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}";
1034
+ var css_248z$12 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}";
1035
1035
 
1036
- var css_248z$$ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1036
+ var css_248z$11 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control .kol-input-radio {\n width: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n min-width: 0;\n }\n .kol-field-control input {\n background-color: var(--ecl-color-white);\n border-color: var(--kol-radio-color);\n position: relative;\n border-width: 1px;\n }\n .kol-field-control input:checked::before {\n background-color: var(--kol-radio-color);\n inset: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control:not(:has(input:disabled)):hover input {\n outline: var(--ecl-color-primary-20) 8px solid;\n }\n .kol-form-field {\n --kol-radio-color: var(--ecl-color-primary);\n margin: 0;\n padding: 0;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-wrap: wrap;\n align-items: flex-start;\n border: 0;\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__input {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n order: 3;\n align-items: flex-start;\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__hint {\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-field-control {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input--error {\n --kol-radio-color: var(--ecl-color-error);\n }\n}";
1037
1037
 
1038
- var css_248z$_ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n color: var(--color-blue);\n text-decoration: underline;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
1038
+ var css_248z$10 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container {\n border-width: 0;\n }\n .kol-input-container:has(.kol-input:focus) {\n outline-width: 0;\n }\n .kol-input-container:has(.kol-input:focus) ::-webkit-slider-thumb {\n outline: 8px solid var(--ecl-color-primary-20);\n outline-offset: 0;\n }\n .kol-input-range__inputs-wrapper {\n flex-direction: column;\n align-items: stretch;\n }\n .kol-input-range__input--number {\n font-weight: bold;\n border: 0;\n text-align: left;\n }\n .kol-input-range__input--range {\n background-color: var(--ecl-color-neutral);\n width: 100%;\n height: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n margin: calc(20 * 1rem / var(--kolibri-root-font-size, 16)) 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0;\n border-width: 0;\n }\n .kol-input-range__input--range::-webkit-slider-thumb {\n background-color: var(--ecl-color-primary);\n width: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n height: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-range__input--range::-webkit-slider-thumb:hover {\n outline: 4px solid var(--ecl-color-primary);\n outline-offset: -1px;\n }\n}";
1039
1039
 
1040
- var css_248z$Z = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
1040
+ var css_248z$$ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}";
1041
1041
 
1042
- var css_248z$Y = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n display: inline-flex;\n padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);\n font-size: 1.25em;\n font-weight: 700;\n line-height: 1.75em;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}\n@layer kol-theme-component {\n .kol-dialog__card,\n .kol-modal__card {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
1042
+ var css_248z$_ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-link {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-link:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-link--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-link--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-link--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-link--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-link--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-link--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-link--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-link--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-link--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-link--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-link--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-link--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-link--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-link--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-link--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-link--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-link__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-link__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-link__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-link__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n}";
1043
1043
 
1044
- var css_248z$X = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-nav__navigation {\n background-color: var(--color-blue);\n }\n .kol-nav__list {\n display: flex;\n margin: 0;\n padding: 0;\n list-style: none;\n }\n .kol-nav__list--vertical {\n flex-direction: column;\n }\n .kol-nav__list-item {\n border-color: var(--color-blue-75);\n border-style: solid;\n border-width: 0;\n }\n .kol-nav__list-item:not(:first-child), .kol-nav__list--nested .kol-nav__list-item {\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry {\n flex-grow: 1;\n }\n .kol-nav__expand-button .kol-button {\n background-color: var(--color-blue-130);\n height: 100%;\n margin: auto;\n }\n .kol-nav__expand-button--expanded .kol-icon::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::before {\n content: \"\\eab6\";\n }\n .kol-nav__toggle-button .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-nav__toggle-button .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-nav__toggle-button .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-nav__toggle-button .kol-button--ghost:hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color) !important;\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n text-decoration: none !important;\n }\n .kol-nav__toggle-button .kol-button--ghost:focus .kol-nav__toggle-button .kol-button__text {\n outline-offset: -2px;\n }\n .kol-link {\n text-decoration: none;\n }\n .kol-span {\n color: var(--color-white);\n border-color: transparent;\n border-style: solid;\n height: 100%;\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :is(.kol-button, .kol-link):focus-within .kol-span {\n border-color: var(--color-white);\n }\n :is(.kol-button, .kol-link):focus-within .kol-span, :is(.kol-button, .kol-link):hover .kol-span {\n text-decoration: underline;\n }\n}";
1044
+ var css_248z$Z = "@layer kol-theme-component {\n .kol-link {\n color: var(--ecl-color-primary);\n }\n .kol-link .kol-span__label {\n text-decoration-thickness: from-font;\n text-underline-offset: clamp(3px, 0.245em, 10px);\n }\n .kol-link:hover {\n color: var(--ecl-color-primary-140);\n }\n .kol-link:focus {\n outline: 2px solid var(--ecl-color-primary);\n border-radius: 1px;\n outline-offset: 2px;\n }\n}";
1045
1045
 
1046
- var css_248z$W = "/* forward the rem function */\n@layer kol-theme-component {\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n}";
1046
+ var css_248z$Y = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-nav {\n --kol-nav-item-padding-left: -24;\n --kol-nav-item-padding-right: 8;\n }\n .kol-nav__list {\n list-style: none;\n --kol-nav-nested-padding-left: calc(var(--kol-nav-item-padding-left) + 12);\n }\n .kol-nav__list-item {\n --kol-nav-item-padding-left: calc(var(--kol-nav-nested-padding-left) + 12);\n }\n .kol-nav__entry--link {\n display: flex;\n }\n .kol-nav__entry .kol-link,\n .kol-nav__entry .kol-button {\n display: flex;\n min-height: var(--a11y-min-size);\n padding-right: calc(var(--kol-nav-item-padding-right) * 1rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n text-decoration: none;\n }\n .kol-nav__entry .kol-link .kol-span__icon--right,\n .kol-nav__entry .kol-button .kol-span__icon--right {\n transform: rotate(180deg);\n }\n .kol-nav__entry .kol-link .kol-span__icon--right::before,\n .kol-nav__entry .kol-button .kol-span__icon--right::before {\n content: \"\\ea11\";\n }\n .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-link,\n .kol-nav__list-item--active > .kol-nav__entry-wrapper .kol-nav__entry .kol-button {\n font-weight: bold;\n }\n .kol-nav__list-item--expanded {\n background-color: var(--ecl-color-neutral-60);\n position: relative;\n }\n .kol-nav__list-item--expanded::before {\n background-color: var(--ecl-color-primary);\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n width: 4px;\n content: \"\";\n }\n .kol-nav__list-item--expanded > .kol-nav__entry-wrapper .kol-span__icon--right {\n transform: rotate(0);\n }\n .kol-nav__list--nested .kol-link,\n .kol-nav__list--nested .kol-button {\n padding-left: calc(var(--kol-nav-item-padding-left) * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__list--nested .kol-link .kol-span__container,\n .kol-nav__list--nested .kol-button .kol-span__container {\n display: grid;\n gap: 0;\n justify-content: flex-start;\n grid-template-areas: \"expander deco label\";\n grid-template-columns: 24px min-content 1fr;\n }\n .kol-nav__list--nested .kol-link .kol-span__icon--left,\n .kol-nav__list--nested .kol-button .kol-span__icon--left {\n margin-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n grid-area: deco;\n }\n .kol-nav__list--nested .kol-link .kol-span__icon--right,\n .kol-nav__list--nested .kol-button .kol-span__icon--right {\n transform: rotate(90deg);\n width: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n margin-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n grid-area: expander;\n }\n .kol-nav__list--nested .kol-link .kol-span__icon--right::before,\n .kol-nav__list--nested .kol-button .kol-span__icon--right::before {\n content: \"\\ea50\";\n }\n .kol-nav__list--nested .kol-link .kol-span__label,\n .kol-nav__list--nested .kol-button .kol-span__label {\n grid-area: label;\n }\n .kol-nav__list--nested .kol-nav__list-item--expanded > .kol-nav__entry-wrapper .kol-span__icon--right {\n transform: rotate(180deg);\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-nav__toggle-button .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-nav__toggle-button .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-nav__toggle-button .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-nav__toggle-button .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-nav__toggle-button .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-nav__toggle-button .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-nav__toggle-button .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-nav__toggle-button .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-nav__toggle-button .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-nav__toggle-button .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-nav__toggle-button .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-nav__toggle-button .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-nav__toggle-button .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-nav__toggle-button .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-nav__toggle-button .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-nav__toggle-button .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-nav__toggle-button .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-nav__toggle-button .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-nav__toggle-button .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-nav__toggle-button .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-nav__toggle-button .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-nav__toggle-button .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__toggle-button .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-nav__toggle-button .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-nav__toggle-button .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-nav__toggle-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-nav__toggle-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n}";
1047
1047
 
1048
- var css_248z$V = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n}";
1048
+ var css_248z$X = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-pagination .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-pagination .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-pagination .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-pagination .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-pagination .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-pagination .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-pagination .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-pagination .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-pagination .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-pagination .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-pagination .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-pagination .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-pagination {\n gap: var(--ecl-spacing-m);\n }\n .kol-pagination__navigation {\n gap: var(--ecl-spacing-m);\n }\n .kol-pagination .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n}";
1049
1049
 
1050
- var css_248z$U = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-progress__bar-progress {\n fill: var(--color-blue-130);\n }\n .kol-progress__cycle-background {\n stroke: var(--color-grey-25);\n }\n .kol-progress__cycle-progress {\n stroke: var(--color-blue-130);\n }\n}";
1050
+ var css_248z$W = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n}";
1051
1051
 
1052
- var css_248z$T = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1052
+ var css_248z$V = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-progress__bar-progress {\n fill: var(--ecl-color-primary);\n }\n .kol-progress__bar-background {\n fill: var(--ecl-color-neutral);\n }\n .kol-progress__bar-border {\n stroke: transparent;\n }\n .kol-progress__cycle-background {\n stroke: var(--ecl-color-neutral);\n }\n .kol-progress__cycle-progress {\n stroke: var(--ecl-color-primary);\n }\n .kol-progress__cycle-border {\n stroke: transparent;\n }\n}";
1053
1053
 
1054
- var css_248z$S = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-blue);\n }\n .kol-custom-suggestions-option:focus {\n color: white;\n background-color: var(--color-blue);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-blue);\n border-style: solid;\n width: 100%;\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-single-select__group {\n color: var(--color-grey);\n display: inline-flex;\n width: 100%;\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n text-align: left;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 40 * 1rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-single-select__input::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-single-select__input::placeholder {\n color: var(--color-grey-50);\n }\n .kol-single-select__input:first-child {\n padding-left: var(--spacing);\n }\n .kol-single-select__input:last-child {\n padding-right: var(--spacing);\n }\n .kol-single-select__input:not(.disabled) .kol-single-select__input:hover {\n border-color: var(--color-blue);\n }\n .kol-single-select__input:focus {\n border: none;\n }\n}";
1054
+ var css_248z$U = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-quote--block {\n box-shadow: var(--ecl-shadow-1);\n border-radius: 2px;\n display: block;\n padding: var(--ecl-spacing-3xl);\n border-inline-start: 4px solid var(--ecl-color-primary);\n }\n .kol-quote--block .kol-quote__blockquote {\n margin: 0;\n font-size: var(--ecl-font-size-l);\n }\n .kol-quote--block .kol-quote__cite {\n display: inline-block;\n margin-top: var(--ecl-spacing-m);\n font-weight: 700;\n }\n .kol-quote--block .kol-quote__cite::before {\n display: none;\n }\n}";
1055
1055
 
1056
- var css_248z$R = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-skip-nav .kol-link__text {\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n border-style: solid;\n border-radius: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-weight: var(--font-weight-bold);\n line-height: 1;\n cursor: pointer;\n }\n}";
1056
+ var css_248z$T = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-select {\n border: none;\n }\n .kol-select[multiple] {\n overflow: auto;\n }\n .kol-select__option {\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0;\n }\n .kol-select__option:active:not(:disabled), .kol-select__option:checked:not(:disabled), .kol-select__option:focus:not(:disabled), .kol-select__option:hover:not(:disabled) {\n color: var(--ecl-color-white);\n background-color: var(--ecl-color-dark);\n }\n .kol-select:not([multiple]) .kol-select__option {\n padding: 0.5em;\n }\n .kol-select:not([multiple], [size]) {\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])) {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-input-container__adornment {\n position: absolute;\n top: calc(-2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-select {\n border-left: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) solid transparent;\n border-right: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) solid transparent;\n }\n .kol-input-container:has(:not(.kol-select[multiple])):has(.kol-input-container__adornment--start:not(:empty)) .kol-select {\n border-left-width: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])):has(.kol-input-container__adornment--end:not(:empty)) .kol-select {\n border-right-width: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])):has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-select {\n border-right-width: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(:not(.kol-select[multiple])) .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}";
1057
1057
 
1058
- var css_248z$Q = "/* forward the rem function */\n@layer kol-theme-component {\n .cycle {\n padding: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .cycle span {\n background-color: var(--color-blue-75);\n }\n}";
1058
+ var css_248z$S = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n background-color: var(--ecl-color-neutral-80);\n }\n .kol-custom-suggestions-option:focus {\n background-color: var(--ecl-color-neutral-60);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--ecl-color-primary);\n border-style: solid;\n width: 100%;\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n .kol-single-select__group {\n display: inline-flex;\n width: 100%;\n align-items: center;\n }\n .kol-single-select__delete {\n margin-top: -2px;\n margin-bottom: -2px;\n }\n}";
1059
1059
 
1060
- var css_248z$P = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-split-button {\n border-color: var(--color-blue);\n border-style: solid;\n border-radius: 0;\n border-width: 2px;\n }\n .kol-split-button .kol-popover__content {\n background-color: transparent;\n border: 0;\n }\n .kol-split-button .kol-button .kol-span {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n }\n .kol-split-button__horizontal-line {\n border: 0;\n border-top: 1px solid var(--color-blue);\n }\n .kol-split-button .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-split-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-split-button .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-split-button .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-split-button .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-split-button .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-split-button .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-split-button .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-split-button .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-split-button .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-split-button .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-split-button .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-split-button .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-split-button .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-split-button .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-split-button .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-split-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\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--secondary:focus .kol-split-button .kol-button__text {\n outline-offset: -6px;\n }\n .kol-split-button .kol-button--ghost:focus .kol-split-button .kol-button__text {\n outline-offset: -2px;\n }\n}";
1060
+ var css_248z$R = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-skip-nav .kol-link__text {\n color: var(--ecl-color-white);\n background-color: var(--ecl-color-primary);\n border-color: var(--ecl-color-primary);\n border-style: solid;\n border-radius: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n cursor: pointer;\n }\n}";
1061
1061
 
1062
- var css_248z$O = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n }\n .kol-table__scroll-container {\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\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__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\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-blue);\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination-wrapper {\n grid-auto-flow: column;\n }\n }\n .kol-table-stateful__pagination {\n grid-auto-flow: column;\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination .kol-table-stateful .kol-pagination {\n display: flex;\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n}";
1062
+ var css_248z$Q = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-spin__spinner {\n background-color: var(--ecl-color-primary);\n }\n}";
1063
1063
 
1064
- var css_248z$N = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n }\n .kol-table__scroll-container {\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\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__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\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-blue);\n }\n}";
1064
+ var css_248z$P = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-split-button .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-split-button .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-split-button .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-split-button .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-split-button .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-split-button .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-split-button .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-split-button .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-split-button .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-split-button .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-split-button .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-split-button .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-split-button .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-split-button .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-split-button .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-split-button .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-split-button .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-split-button .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-split-button .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-split-button .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-split-button .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-split-button .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-split-button .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-split-button .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-split-button .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-split-button .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-split-button .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-split-button .kol-button--standalone {\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-split-button__button .kol-button__text {\n border-radius: 2px 0 0 2px;\n border-right-width: 0;\n }\n .kol-split-button__secondary-button .kol-button__text {\n border-radius: 0 2px 2px 0;\n }\n}";
1065
1065
 
1066
- var css_248z$M = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__button-group {\n margin-bottom: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n border-bottom: 1px solid var(--color-grey-25);\n }\n .kol-tabs .kol-button {\n margin-bottom: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-tabs .kol-button:hover:not(:disabled) .kol-span {\n color: var(--color-blue-130);\n }\n .kol-tabs .kol-button:focus .kol-span {\n outline: var(--color-blue-130) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs .kol-button.selected .kol-span {\n color: var(--color-blue);\n box-shadow: 0 -3px var(--color-blue);\n border-color: var(--color-grey-25);\n border-style: solid;\n border-top-color: var(--color-blue);\n border-bottom-color: white;\n border-width: 1px;\n font-weight: var(--font-weight-bold);\n }\n .kol-tabs .kol-button .kol-span {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
1066
+ var css_248z$O = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-pagination .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-pagination .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-pagination .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-pagination .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-pagination .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-pagination .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-pagination .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-pagination .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-pagination .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-pagination .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-pagination .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-pagination .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-pagination {\n gap: var(--ecl-spacing-m);\n }\n .kol-pagination__navigation {\n gap: var(--ecl-spacing-m);\n }\n .kol-pagination .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings {\n display: flex;\n position: static;\n justify-content: flex-end;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-table-settings .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-table-settings .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-table-settings .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-table-settings .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table-settings .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table-settings .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table-settings .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table-settings .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table-settings .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-table-settings .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-table-settings .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table-settings .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-table-settings .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-table-settings .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-table-settings .kol-popover-button .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table-settings .kol-popover-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-popover-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings__content {\n padding: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__error-message {\n display: block;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__columns {\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__actions {\n display: flex;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n justify-content: flex-end;\n border-top: 1px solid var(--ecl-color-neutral-60);\n }\n .kol-table__caption {\n color: var(--ecl-color-dark-80);\n min-height: 0;\n margin-top: var(--ecl-spacing-xs);\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n caption-side: bottom;\n }\n .kol-table__table {\n border: 1px solid var(--ecl-color-neutral-60);\n border-spacing: 0;\n }\n .kol-table__row .kol-table__cell {\n border-top: 1px solid var(--ecl-color-neutral-60);\n }\n .kol-table__head-row:not(:first-child) .kol-table__cell {\n border-top: 1px solid var(--ecl-color-neutral-160);\n }\n .kol-table__cell {\n padding: var(--ecl-spacing-m);\n }\n .kol-table__cell:not(:last-child) {\n border-right: 1px solid var(--ecl-color-neutral-60);\n }\n .kol-table__cell--header {\n background-color: var(--ecl-color-neutral);\n }\n .kol-table__cell--header:has(.kol-button) {\n padding: 0;\n }\n .kol-table__cell--header .kol-table__sort {\n display: flex;\n height: 100%;\n align-items: stretch;\n }\n .kol-table__cell--header .kol-table__sort-button {\n flex: 1 0 100%;\n }\n .kol-table__cell--header .kol-button {\n padding: var(--ecl-spacing-m);\n font-weight: 700;\n }\n .kol-table__head-row .kol-table__cell--header:not(:last-child) {\n border-right-color: var(--ecl-color-neutral-160);\n }\n .kol-table__row--body .kol-table__cell--header {\n border-right: 2px solid var(--ecl-color-neutral-160);\n }\n .kol-table__row--body:not(:first-child) .kol-table__cell--header {\n border-top-color: var(--ecl-color-neutral-160);\n }\n .kol-table__cell-actions {\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-table__cell-actions .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-table__cell-actions .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-table__cell-actions .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-table__cell-actions .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table__cell-actions .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table__cell-actions .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table__cell-actions .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table__cell-actions .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table__cell-actions .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table__cell-actions .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table__cell-actions .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table__cell-actions .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-table__cell-actions .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-table__cell-actions .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table__cell-actions .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table__cell-actions .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table__cell-actions .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-table__cell-actions .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell-actions .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-table__cell-actions .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) {\n --kol-checkbox-color: var(--ecl-color-primary);\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n justify-content: center;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection:focus-within::before, .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection:hover:not(:has(input:disabled))::before {\n background-color: var(--ecl-color-primary-20);\n border-radius: 100%;\n position: absolute;\n width: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n height: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n content: \"\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-eye,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-eye::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-check,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-check::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cross,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cross::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-settings,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-settings::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-up,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-up::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon {\n color: var(--ecl-color-white);\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input {\n border-color: var(--kol-checkbox-color);\n border-radius: 2px;\n position: relative;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input:checked, .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input:indeterminate {\n background-color: var(--kol-checkbox-color);\n border-color: var(--kol-checkbox-color);\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input:focus {\n outline: transparent;\n }\n .kol-table:has(.kol-table__selection-input--radio) {\n --kol-radio-color: var(--ecl-color-primary);\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection .kol-input-radio {\n width: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n min-width: 0;\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection input {\n background-color: var(--ecl-color-white);\n border-color: var(--kol-radio-color);\n position: relative;\n border-width: 1px;\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection input:checked::before {\n background-color: var(--kol-radio-color);\n inset: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection:not(:has(input:disabled)):hover input {\n outline: var(--ecl-color-primary-20) 8px solid;\n }\n}";
1067
1067
 
1068
- var css_248z$L = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1068
+ var css_248z$N = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-pagination .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-pagination .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-pagination .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-pagination .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-pagination .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-pagination .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-pagination .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-pagination .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-pagination .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-pagination .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-pagination .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-pagination .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-pagination .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-pagination .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-pagination .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-pagination {\n gap: var(--ecl-spacing-m);\n }\n .kol-pagination__navigation {\n gap: var(--ecl-spacing-m);\n }\n .kol-pagination .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-pagination .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-pagination .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings {\n display: flex;\n position: static;\n justify-content: flex-end;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-table-settings .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-table-settings .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-table-settings .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-table-settings .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-table-settings .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table-settings .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table-settings .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table-settings .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table-settings .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table-settings .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-table-settings .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table-settings .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-table-settings .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table-settings .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-table-settings .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-table-settings .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-table-settings .kol-popover-button .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table-settings .kol-popover-button .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table-settings .kol-popover-button .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table-settings__content {\n padding: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__error-message {\n display: block;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__columns {\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__actions {\n display: flex;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n justify-content: flex-end;\n border-top: 1px solid var(--ecl-color-neutral-60);\n }\n .kol-table__caption {\n color: var(--ecl-color-dark-80);\n min-height: 0;\n margin-top: var(--ecl-spacing-xs);\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n caption-side: bottom;\n }\n .kol-table__table {\n border: 1px solid var(--ecl-color-neutral-60);\n border-spacing: 0;\n }\n .kol-table__row .kol-table__cell {\n border-top: 1px solid var(--ecl-color-neutral-60);\n }\n .kol-table__head-row:not(:first-child) .kol-table__cell {\n border-top: 1px solid var(--ecl-color-neutral-160);\n }\n .kol-table__cell {\n padding: var(--ecl-spacing-m);\n }\n .kol-table__cell:not(:last-child) {\n border-right: 1px solid var(--ecl-color-neutral-60);\n }\n .kol-table__cell--header {\n background-color: var(--ecl-color-neutral);\n }\n .kol-table__cell--header:has(.kol-button) {\n padding: 0;\n }\n .kol-table__cell--header .kol-table__sort {\n display: flex;\n height: 100%;\n align-items: stretch;\n }\n .kol-table__cell--header .kol-table__sort-button {\n flex: 1 0 100%;\n }\n .kol-table__cell--header .kol-button {\n padding: var(--ecl-spacing-m);\n font-weight: 700;\n }\n .kol-table__head-row .kol-table__cell--header:not(:last-child) {\n border-right-color: var(--ecl-color-neutral-160);\n }\n .kol-table__row--body .kol-table__cell--header {\n border-right: 2px solid var(--ecl-color-neutral-160);\n }\n .kol-table__row--body:not(:first-child) .kol-table__cell--header {\n border-top-color: var(--ecl-color-neutral-160);\n }\n .kol-table__cell-actions {\n gap: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-table__cell-actions .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-table__cell-actions .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-table__cell-actions .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-table__cell-actions .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-table__cell-actions .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table__cell-actions .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table__cell-actions .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table__cell-actions .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table__cell-actions .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-table__cell-actions .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table__cell-actions .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-table__cell-actions .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table__cell-actions .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-table__cell-actions .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-table__cell-actions .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-table__cell-actions .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-table__cell-actions .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-table__cell-actions .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-table__cell-actions .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-table__cell-actions .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell-actions .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-table__cell-actions .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) {\n --kol-checkbox-color: var(--ecl-color-primary);\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n justify-content: center;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection:focus-within::before, .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection:hover:not(:has(input:disabled))::before {\n background-color: var(--ecl-color-primary-20);\n border-radius: 100%;\n position: absolute;\n width: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n height: calc(38 * 1rem / var(--kolibri-root-font-size, 16));\n content: \"\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-eye,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-eye::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-link::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-check,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-check::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cross,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cross::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-settings,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-settings::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-up,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon .kol-icon[class*=\" kolicon-\"].kolicon-up::before,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection__icon,\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection .kol-table__selection-icon {\n color: var(--ecl-color-white);\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input {\n border-color: var(--kol-checkbox-color);\n border-radius: 2px;\n position: relative;\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input:checked, .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input:indeterminate {\n background-color: var(--kol-checkbox-color);\n border-color: var(--kol-checkbox-color);\n }\n .kol-table:has(.kol-table__selection-input--checkbox) .kol-table__selection input:focus {\n outline: transparent;\n }\n .kol-table:has(.kol-table__selection-input--radio) {\n --kol-radio-color: var(--ecl-color-primary);\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection .kol-input-radio {\n width: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n min-width: 0;\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection input {\n background-color: var(--ecl-color-white);\n border-color: var(--kol-radio-color);\n position: relative;\n border-width: 1px;\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection input:checked::before {\n background-color: var(--kol-radio-color);\n inset: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table:has(.kol-table__selection-input--radio) .kol-table__selection:not(:has(input:disabled)):hover input {\n outline: var(--ecl-color-primary-20) 8px solid;\n }\n}";
1069
1069
 
1070
- var css_248z$K = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(440 * 1rem / var(--kolibri-root-font-size, 16));\n max-width: 100%;\n }\n .kol-toast-item .kol-alert--variant-msg {\n border: none;\n }\n .kol-toast-item .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-toast-item .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-toast-item .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-toast-item .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-toast-item .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-toast-item .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-msg .kol-toast-item .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-toast-item .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-msg .kol-toast-item .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n background-color: #fff;\n display: block;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item__alert {\n display: block;\n }\n}";
1070
+ var css_248z$M = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tabs__button-group {\n border-bottom: 2px solid var(--ecl-color-neutral-60);\n }\n .kol-tabs .kol-button {\n margin-bottom: -2px;\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border: none;\n border-bottom: solid 2px transparent;\n }\n .kol-tabs .kol-button:hover:not(:disabled) {\n border-bottom-color: var(--ecl-color-dark-80);\n }\n .kol-tabs .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n border-radius: 1px;\n outline-offset: -2px;\n }\n .kol-tabs .kol-button.selected {\n border-bottom-color: var(--ecl-color-primary);\n font-weight: var(--ecl-font-weight-bold);\n }\n}";
1071
1071
 
1072
- var css_248z$J = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n .kol-link {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-link--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-link--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-link--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-link--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-link--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-link--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-link--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-link--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-link--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-link__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-link--secondary:focus .kol-link__text {\n outline-offset: -6px;\n }\n .kol-link--ghost:focus .kol-link__text {\n outline-offset: -2px;\n }\n .kol-toolbar {\n background-color: var(--color-grey-5);\n border-color: var(--color-grey-25);\n border-style: solid;\n padding: var(--spacing-s);\n border-width: 1px;\n }\n .kol-link {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-link:hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n}";
1072
+ var css_248z$L = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: var(--ecl-spacing-xs);\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__label-text::after {\n color: var(--ecl-color-error);\n margin-left: var(--ecl-spacing-2xs);\n vertical-align: text-bottom;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__label__read-only {\n display: none;\n }\n .kol-form-field__hint {\n margin-top: calc(-4 * 1rem / var(--kolibri-root-font-size, 16));\n order: 2;\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-font-size-s);\n }\n .kol-form-field__msg {\n order: 4;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter--exceeded {\n color: var(--ecl-color-error);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-input-container {\n background-color: var(--ecl-color-white);\n align-items: center;\n border: 1px solid var(--ecl-color-dark-80);\n }\n .kol-input-container:has(.kol-input:focus, .kol-select:focus, .kol-textarea:focus) {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: -2px;\n }\n .kol-input-container--error {\n border-color: var(--ecl-color-error);\n }\n .kol-input-container--disabled {\n opacity: 0.5;\n }\n .kol-input-container__smart-button {\n position: relative;\n z-index: 2;\n }\n .kol-input-container__smart-button .kol-button:focus {\n outline: 2px solid var(--ecl-color-primary);\n outline-offset: 0;\n }\n .kol-input-container__adornment {\n min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon:first-child {\n margin-left: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon:last-child {\n margin-right: calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n background-color: transparent;\n height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(15 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input::placeholder {\n color: var(--ecl-color-dark-60);\n }\n .kol-input--disabled {\n opacity: 1;\n }\n .kol-input-container {\n position: relative;\n padding: 0;\n gap: 0;\n grid-template-columns: auto max-content min-content;\n }\n .kol-input-container__adornment {\n position: absolute;\n top: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start {\n left: 0;\n }\n .kol-input-container__adornment--end {\n right: 0;\n }\n .kol-input-container:has(.kol-input-container__adornment--start:not(:empty)) .kol-input {\n padding-left: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--start .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-left: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end:not(:empty)) .kol-input {\n padding-right: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__icon + .kol-input-container__smart-button) .kol-input, .kol-input-container:has(.kol-input-container__adornment--end .kol-input-container__smart-button + .kol-input-container__icon) .kol-input {\n padding-right: calc(76 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__container {\n position: relative;\n z-index: 1;\n }\n}";
1073
1073
 
1074
- var css_248z$I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree-item__children {\n display: flex;\n flex-direction: column;\n }\n .kol-tree-item__link {\n display: block;\n border: 2px solid transparent;\n }\n .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n background-color: var(--color-sky);\n border: 2px solid var(--color-yellow-120);\n }\n .kol-tree-item__link:hover .kol-link, .kol-tree-item__link:focus-within .kol-link {\n color: var(--color-black);\n }\n .kol-tree-item__link--active {\n background-color: var(--color-yellow);\n font-weight: 700;\n }\n .kol-tree-item__link--active .kol-link {\n color: var(--color-black);\n background-color: var(--color-yellow);\n }\n .kol-tree-item__link .kol-link {\n color: var(--color-black);\n text-align: left;\n }\n .kol-tree-item__link .kol-link:focus {\n color: var(--color-black);\n }\n .kol-tree-item__toggle-button:hover .kol-tree-item__toggle-button-icon {\n transform: scale(1.3);\n }\n .kol-tree-item__text {\n text-decoration: none;\n }\n}";
1074
+ var css_248z$K = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(440 * 1rem / var(--kolibri-root-font-size, 16));\n max-width: 100%;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-toast-item .kol-alert .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-toast-item .kol-alert .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-toast-item .kol-alert .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-toast-item .kol-alert .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-toast-item .kol-alert .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-toast-item .kol-alert .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-toast-item .kol-alert .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-toast-item .kol-alert .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-toast-item .kol-alert .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-toast-item .kol-alert .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-toast-item .kol-alert .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-toast-item .kol-alert .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-toast-item .kol-alert .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-toast-item .kol-alert .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-toast-item .kol-alert .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-toast-item .kol-alert .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-toast-item .kol-alert .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-toast-item .kol-alert .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-toast-item .kol-alert .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-toast-item .kol-alert .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-toast-item .kol-alert .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-toast-item .kol-alert .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-toast-item .kol-alert .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-toast-item .kol-alert .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-toast-item .kol-alert .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-toast-item .kol-alert .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-toast-item .kol-alert--variant-msg {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-msg .kol-alert__icon {\n margin-right: var(--ecl-spacing-2xs);\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-msg .kol-alert__container {\n line-height: var(--ecl-line-height-s);\n }\n .kol-toast-item .kol-alert--variant-msg .kol-alert__content {\n font-size: var(--ecl-font-size-s);\n line-height: var(--ecl-line-height-s);\n }\n .kol-toast-item .kol-alert--variant-card {\n background-color: var(--ecl-color-neutral-20);\n padding: var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-m) var(--ecl-spacing-s);\n border: solid 1px var(--ecl-color-neutral);\n border-inline-start: 4px solid var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-card .kol-alert__icon {\n margin-right: var(--ecl-spacing-xs);\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--type-default {\n --alert-accent-color: var(--ecl-color-dark);\n }\n .kol-toast-item .kol-alert--type-error {\n --alert-accent-color: var(--ecl-color-error);\n }\n .kol-toast-item .kol-alert--type-info {\n --alert-accent-color: var(--ecl-color-info);\n }\n .kol-toast-item .kol-alert--type-success {\n --alert-accent-color: var(--ecl-color-success);\n }\n .kol-toast-item .kol-alert--type-warning {\n --alert-accent-color: var(--ecl-color-warning);\n }\n .kol-toast-item .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert__heading {\n font-size: var(--ecl-font-size-l);\n line-height: var(--ecl-line-height-l);\n }\n .kol-toast-item .kol-alert__closer .kol-button {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-toast-item .kol-alert__closer .kol-button:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-toast-item .kol-alert__closer .kol-button:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-toast-item .kol-alert__closer .kol-button {\n height: var(--a11y-min-size);\n }\n .kol-toast-item .kol-alert__closer .kol-button .kol-icon {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n background-color: #fff;\n display: block;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item__alert {\n display: block;\n }\n}";
1075
+
1076
+ var css_248z$J = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-button {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-button:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-button--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-button--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-button--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-button--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-button--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-button--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-button--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-button--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-button--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-button__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-button__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-button__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-down::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left {\n transform: rotate(-90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-left::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right {\n transform: rotate(90deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-right::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-chevron-up::before {\n content: \"\\ea11\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-eye::before {\n content: \"\\ea1f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link-external::before {\n content: \"\\ea1e\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-link::before {\n content: \"\\ea08\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-plus::before {\n content: \"\\ea46\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-minus::before {\n content: \"\\ea38\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-warning::before {\n content: \"\\ea5b\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-error::before {\n content: \"\\ea1a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-success::before {\n content: \"\\ea09\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-alert-info::before {\n content: \"\\ea2d\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-check::before {\n content: \"\\ea0a\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cross::before {\n content: \"\\ea0f\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-cogwheel::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-settings::before {\n content: \"\\ea4c\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-asc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc {\n transform: rotate(180deg);\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-desc::before {\n content: \"\\ea50\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-sort-neutral::before {\n content: \"\\ea51\";\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up {\n font-family: ecl-icons;\n }\n .kol-icon[class*=\" kolicon-\"].kolicon-up::before {\n content: \"\\ea58\";\n }\n .kol-link {\n --button-border-width: 2px;\n --button-focus-outline-color: var(--ecl-color-dark);\n --button-focus-outline-offset: -3px;\n --button-focus-outline-width: 1px;\n }\n .kol-link:focus {\n outline: var(--button-focus-outline-color) solid var(--button-focus-outline-width);\n outline-offset: var(--button-focus-outline-offset);\n }\n .kol-link--primary {\n --button-background-color: var(--ecl-color-primary);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--primary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-link--primary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n }\n .kol-link--secondary {\n --button-background-color: var(--ecl-color-white);\n --button-border-color: var(--ecl-color-primary);\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-link--secondary:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--secondary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-140);\n --button-border-color: var(--ecl-color-primary-140);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--tertiary {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-link--tertiary:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-link--tertiary:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-link--normal {\n --button-background-color: var(--ecl-color-white);\n --button-text-color: var(--ecl-color-dark);\n --button-border-color: transparent;\n --button-border-width: 1px;\n }\n .kol-link--normal:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-link--normal:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n }\n .kol-link--call-to-action {\n --button-background-color: var(--ecl-color-secondary);\n --button-border-color: var(--ecl-color-secondary);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-link--call-to-action:not(:disabled):hover {\n --button-background-color: var(--ecl-color-secondary-120);\n --button-border-color: var(--ecl-color-secondary-120);\n }\n .kol-link--danger {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-error);\n --button-text-color: var(--ecl-color-white);\n }\n .kol-link--danger:focus {\n --button-focus-outline-color: var(--ecl-color-white);\n }\n .kol-link--danger:not(:disabled):hover {\n --button-background-color: var(--ecl-color-error);\n --button-border-color: var(--ecl-color-dark);\n }\n .kol-link--ghost {\n --button-background-color: transparent;\n --button-border-color: transparent;\n --button-border-width: 1px;\n --button-text-color: var(--ecl-color-primary);\n }\n .kol-link--ghost:focus {\n --button-focus-outline-color: var(--ecl-color-primary);\n --button-focus-outline-offset: 0;\n --button-focus-outline-width: 2px;\n }\n .kol-link--ghost:not(:disabled):hover {\n --button-background-color: var(--ecl-color-primary-20);\n --button-border-color: var(--ecl-color-dark-80);\n --button-text-color: var(--ecl-color-dark);\n }\n .kol-link__text {\n color: var(--button-text-color);\n background-color: var(--button-background-color);\n border-color: var(--button-border-color);\n border-style: solid;\n border-radius: 2px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: var(--ecl-spacing-xs) var(--ecl-spacing-m);\n border-width: var(--button-border-width);\n line-height: 1.2;\n }\n .kol-link__text .kol-span__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-link__text .kol-span__label {\n word-break: keep-all;\n }\n .kol-link__text.kol-span--hide-label {\n padding: var(--ecl-spacing-xs);\n }\n}";
1077
+
1078
+ var css_248z$I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree-item {\n --indentation: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tree-item__children {\n display: flex;\n flex-direction: column;\n }\n .kol-tree-item__link {\n display: block;\n position: relative;\n }\n .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n background-color: var(--ecl-color-neutral-60);\n }\n .kol-tree-item__link--active::before {\n background-color: var(--ecl-color-primary);\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n width: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n content: \"\";\n }\n .kol-tree-item__link .kol-link {\n padding-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-left: max(var(--indentation) * var(--level));\n }\n .kol-tree-item__text {\n text-decoration: none;\n }\n}";
1075
1079
 
1076
1080
  var css_248z$H = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree__treeview-navigation {\n display: flex;\n flex-direction: column;\n }\n}";
1077
1081
 
1078
- var css_248z$G = "/* forward the rem function */\n@layer kol-theme-global {\n .kol-tooltip__arrow {\n background-color: #626262;\n }\n .kol-tooltip__content {\n background-color: #f2f2f2;\n border-radius: 2px;\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.2;\n border: 1px solid #626262;\n }\n :host {\n --color-blue: #004494;\n --color-yellow: #ffd617;\n --color-grey: #404040;\n --color-blue-130: #002f67;\n --color-blue-120: #003776;\n --color-blue-110: #003d84;\n --color-blue-100: var(--color-blue);\n --color-blue-75: #4073af;\n --color-blue-50: #bfd0e4;\n --color-blue-25: #bfd0e4;\n --color-blue-5: #f2f5f9;\n --color-yellow-120: #f8ae21;\n --color-yellow-110: #fbc11d;\n --color-yellow-100: var(--color-yellow);\n --color-yellow-75: #ffde39;\n --color-yellow-50: #ffe879;\n --color-yellow-25: #fff4bb;\n --color-grey-100: var(--color-grey);\n --color-grey-75: #707070;\n --color-grey-50: #9f9f9f;\n --color-grey-25: #cfcfcf;\n --color-grey-20: #d9d9d9;\n --color-grey-15: #e3e3e3;\n --color-grey-10: #ebebeb;\n --color-grey-5: #f5f5f5;\n --color-grey-3: #f9f9f9;\n --color-blue-n: #006fb4;\n --color-orange: #f29527;\n --color-green: #467a39;\n --color-red: #da2131;\n --color-red-1xx: #981722;\n --color-black: #000;\n --color-white: #fff;\n --font-family: Arial, sans-serif;\n --font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --font-weight: 400;\n --font-weight-bold: 600;\n --line-height-regular: 1.5;\n --line-height-heading: 1.2;\n --spacing-4xl: calc(64 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-3xl: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-2xl: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-xl: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-l: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-m: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-s: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-xs: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-2xs: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n }\n a,\n button {\n outline: none;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n font-weight: var(--font-weight-bold);\n line-height: var(--line-height-heading);\n }\n p {\n font-weight: var(--font-weight);\n }\n .kol-span,\n .kol-span__container {\n gap: 0.5em;\n }\n .required label span::after,\n .required legend span::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .badge-text-hint {\n border-radius: 3px;\n padding: 0 0.3em;\n }\n}";
1082
+ var css_248z$G = "/* forward the rem function */\n@layer kol-theme-global {\n .kol-tooltip__arrow {\n background-color: #626262;\n }\n .kol-tooltip__content {\n background-color: #f2f2f2;\n border-radius: 2px;\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.2;\n border: 1px solid #626262;\n }\n :host {\n --ecl-color-primary: var(--ecl-color-primary-100);\n --ecl-color-primary-180: #051036;\n --ecl-color-primary-160: #0a1f6c;\n --ecl-color-primary-140: #0f2fa2;\n --ecl-color-primary-120: #143fd9;\n --ecl-color-primary-100: #3860ed;\n --ecl-color-primary-80: #5577f0;\n --ecl-color-primary-60: #89a1f4;\n --ecl-color-primary-40: #b1c0f8;\n --ecl-color-primary-20: #d8e0fb;\n --ecl-color-secondary: var(--ecl-color-secondary-100);\n --ecl-color-secondary-180: #8f5600;\n --ecl-color-secondary-160: #e08700;\n --ecl-color-secondary-140: #ff9d0a;\n --ecl-color-secondary-120: #ffad33;\n --ecl-color-secondary-100: #ffbe5c;\n --ecl-color-secondary-80: #ffcb7c;\n --ecl-color-secondary-60: #ffd89d;\n --ecl-color-secondary-40: #ffe5be;\n --ecl-color-secondary-20: #fff2de;\n --ecl-color-dark: var(--ecl-color-dark-100);\n --ecl-color-dark-100: #26324b;\n --ecl-color-dark-80: #546fa6;\n --ecl-color-dark-60: #9ac;\n --ecl-color-dark-06-o: rgb(38, 50, 75, 0.06);\n --ecl-color-dark-05-o: rgb(38, 50, 75, 0.05);\n --ecl-color-info: var(--ecl-color-primary-100);\n --ecl-color-success: #24a148;\n --ecl-color-error: #da1e28;\n --ecl-color-warning: #f39811;\n --ecl-color-background: #fcfcfc;\n --ecl-color-branding: #004494;\n --ecl-color-stroke: color-mix(in srgb, var(--ecl-color-primary) 50%, transparent);\n --ecl-color-overlay-light: color-mix(in srgb, var(--ecl-color-dark) 70%, transparent);\n --ecl-color-overlay-dark: color-mix(in srgb, var(--ecl-color-dark) 90%, transparent);\n --ecl-color-white: #fff;\n --ecl-color-neutral: var(--ecl-color-neutral-100);\n --ecl-color-neutral-180: #6c85d1;\n --ecl-color-neutral-160: #7f95d7;\n --ecl-color-neutral-140: #92a5dd;\n --ecl-color-neutral-120: #a6b5e3;\n --ecl-color-neutral-100: #b9c5e9;\n --ecl-color-neutral-80: #cdd5ef;\n --ecl-color-neutral-60: #e0e5f5;\n --ecl-color-neutral-40: #f3f5fb;\n --ecl-color-neutral-20: #f8f9fd;\n --ecl-color-accent: var(--ecl-color-accent-100);\n --ecl-color-accent-160: #887de8;\n --ecl-color-accent-140: #978cf2;\n --ecl-color-accent-120: #a89efa;\n --ecl-color-accent-100: #bbb3ff;\n --ecl-color-accent-80: #bfb2ff;\n --ecl-color-accent-60: #d1ccff;\n --ecl-color-accent-40: #fafaff;\n --ecl-font-family-default: arial, sans-serif;\n --ecl-font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-weight: 400;\n --ecl-font-weight-bold: 700;\n --line-height-regular: 1.5;\n --ecl-spacing-2xs: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-xs: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-s: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-m: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-l: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-xl: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-2xl: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-3xl: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-4xl: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-5xl: calc(56 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-spacing-6xl: calc(64 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-shadow-1:\n \t0 0 1px var(--ecl-color-dark-06-o), 2px 2px 2px var(--ecl-color-dark-05-o), 4px 4px 6px var(--ecl-color-dark-05-o),\n \t0 1px 0 var(--ecl-color-neutral-60) inset;\n --ecl-shadow-6:\n \t0 0 6px var(--ecl-color-dark-06-o), 12px 12px 12px var(--ecl-color-dark-05-o), 24px 24px 36px var(--ecl-color-dark-05-o),\n \t0 1px 0 var(--ecl-color-neutral-60) inset;\n --ecl-shadow-12:\n \t0 0 12px var(--ecl-color-dark-06-o), 24px 24px 24px var(--ecl-color-dark-05-o), 48px 48px 72px var(--ecl-color-dark-05-o),\n \t0 1px 0 var(--ecl-color-neutral-60) inset;\n --ecl-shadow-16:\n \t0 0 16px var(--ecl-color-dark-06-o), 32px 32px 32px var(--ecl-color-dark-05-o), 64px 64px 96px var(--ecl-color-dark-05-o),\n \t0 1px 0 var(--ecl-color-neutral-60) inset;\n --ecl-max-width: 80ch;\n --ecl-font-size-xs: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-s: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-m: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-l: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-xl: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-2xl: calc(28 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-3xl: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-font-size-4xl: calc(52 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-xs: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-s: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-m: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-l: calc(28 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-xl: calc(36 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-2xl: calc(36 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-3xl: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n --ecl-line-height-4xl: calc(54 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n color: var(--ecl-color-dark);\n font-family: var(--ecl-font-family-default);\n font-size: var(--ecl-font-size-m);\n font-weight: var(--ecl-font-weight);\n line-height: var(--ecl-line-height-m);\n }\n a,\n button {\n outline: none;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n .badge-text-hint {\n border-radius: 3px;\n padding: 0 0.3em;\n }\n}";
1079
1083
 
1080
1084
  const ECL_EC = KoliBri.createTheme('ecl-ec', {
1081
1085
  GLOBAL: css_248z$G,
1082
- 'KOL-ACCORDION': css_248z$1k,
1083
- 'KOL-ALERT': css_248z$1j,
1084
- 'KOL-BADGE': css_248z$1i,
1085
- 'KOL-BREADCRUMB': css_248z$1h,
1086
- 'KOL-BUTTON': css_248z$1f,
1087
- 'KOL-BUTTON-LINK': css_248z$1g,
1088
- 'KOL-CARD': css_248z$1e,
1089
- 'KOL-COMBOBOX': css_248z$1d,
1090
- 'KOL-DETAILS': css_248z$1c,
1091
- 'KOL-DRAWER': css_248z$1b,
1092
- 'KOL-FORM': css_248z$1a,
1093
- 'KOL-HEADING': css_248z$19,
1086
+ 'KOL-ACCORDION': css_248z$1m,
1087
+ 'KOL-ALERT': css_248z$1l,
1088
+ 'KOL-BADGE': css_248z$1k,
1089
+ 'KOL-BREADCRUMB': css_248z$1j,
1090
+ 'KOL-BUTTON': css_248z$1h,
1091
+ 'KOL-BUTTON-LINK': css_248z$1i,
1092
+ 'KOL-CARD': css_248z$1g,
1093
+ 'KOL-COMBOBOX': css_248z$1f,
1094
+ 'KOL-DETAILS': css_248z$1e,
1095
+ 'KOL-DRAWER': css_248z$1c,
1096
+ 'KOL-FORM': css_248z$1b,
1097
+ 'KOL-HEADING': css_248z$1a,
1098
+ 'KOL-ICON': css_248z$19,
1094
1099
  'KOL-INPUT-CHECKBOX': css_248z$18,
1095
1100
  'KOL-INPUT-COLOR': css_248z$17,
1096
1101
  'KOL-INPUT-DATE': css_248z$16,
@@ -1103,11 +1108,12 @@ const ECL_EC = KoliBri.createTheme('ecl-ec', {
1103
1108
  'KOL-INPUT-TEXT': css_248z$$,
1104
1109
  'KOL-LINK': css_248z$Z,
1105
1110
  'KOL-LINK-BUTTON': css_248z$_,
1106
- 'KOL-MODAL': css_248z$Y,
1107
- 'KOL-NAV': css_248z$X,
1108
- 'KOL-PAGINATION': css_248z$W,
1109
- 'KOL-POPOVER-BUTTON': css_248z$V,
1110
- 'KOL-PROGRESS': css_248z$U,
1111
+ 'KOL-DIALOG': css_248z$1d,
1112
+ 'KOL-NAV': css_248z$Y,
1113
+ 'KOL-PAGINATION': css_248z$X,
1114
+ 'KOL-POPOVER-BUTTON': css_248z$W,
1115
+ 'KOL-PROGRESS': css_248z$V,
1116
+ 'KOL-QUOTE': css_248z$U,
1111
1117
  'KOL-SELECT': css_248z$T,
1112
1118
  'KOL-SINGLE-SELECT': css_248z$S,
1113
1119
  'KOL-SKIP-NAV': css_248z$R,