@public-ui/themes 3.0.5-rc.0 → 3.0.6-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/default/src/index.d.ts +1 -2
  2. package/dist/ecl/src/ecl-ec/index.d.ts +1 -2
  3. package/dist/ecl/src/ecl-eu/index.d.ts +1 -2
  4. package/dist/index.cjs +106 -107
  5. package/dist/index.cjs.map +1 -1
  6. package/dist/index.mjs +106 -107
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +6 -5
  9. package/assets/codicons/codicon.html +0 -4239
package/dist/index.cjs CHANGED
@@ -411,57 +411,56 @@ var TagEnum;
411
411
  (function (TagEnum) {
412
412
  TagEnum[TagEnum["abbr"] = 0] = "abbr";
413
413
  TagEnum[TagEnum["accordion"] = 1] = "accordion";
414
- TagEnum[TagEnum["accordion-group"] = 2] = "accordion-group";
415
- TagEnum[TagEnum["alert"] = 3] = "alert";
416
- TagEnum[TagEnum["avatar"] = 4] = "avatar";
417
- TagEnum[TagEnum["badge"] = 5] = "badge";
418
- TagEnum[TagEnum["breadcrumb"] = 6] = "breadcrumb";
419
- TagEnum[TagEnum["button"] = 7] = "button";
420
- TagEnum[TagEnum["button-link"] = 8] = "button-link";
421
- TagEnum[TagEnum["card"] = 9] = "card";
422
- TagEnum[TagEnum["combobox"] = 10] = "combobox";
423
- TagEnum[TagEnum["details"] = 11] = "details";
424
- TagEnum[TagEnum["drawer"] = 12] = "drawer";
425
- TagEnum[TagEnum["form"] = 13] = "form";
426
- TagEnum[TagEnum["heading"] = 14] = "heading";
427
- TagEnum[TagEnum["icon"] = 15] = "icon";
428
- TagEnum[TagEnum["image"] = 16] = "image";
429
- TagEnum[TagEnum["input-checkbox"] = 17] = "input-checkbox";
430
- TagEnum[TagEnum["input-color"] = 18] = "input-color";
431
- TagEnum[TagEnum["input-date"] = 19] = "input-date";
432
- TagEnum[TagEnum["input-email"] = 20] = "input-email";
433
- TagEnum[TagEnum["input-file"] = 21] = "input-file";
434
- TagEnum[TagEnum["input-number"] = 22] = "input-number";
435
- TagEnum[TagEnum["input-password"] = 23] = "input-password";
436
- TagEnum[TagEnum["input-radio"] = 24] = "input-radio";
437
- TagEnum[TagEnum["input-range"] = 25] = "input-range";
438
- TagEnum[TagEnum["input-text"] = 26] = "input-text";
439
- TagEnum[TagEnum["kolibri"] = 27] = "kolibri";
440
- TagEnum[TagEnum["link"] = 28] = "link";
441
- TagEnum[TagEnum["link-button"] = 29] = "link-button";
442
- TagEnum[TagEnum["logo"] = 30] = "logo";
443
- TagEnum[TagEnum["modal"] = 31] = "modal";
444
- TagEnum[TagEnum["nav"] = 32] = "nav";
445
- TagEnum[TagEnum["pagination"] = 33] = "pagination";
446
- TagEnum[TagEnum["popover-button"] = 34] = "popover-button";
447
- TagEnum[TagEnum["progress"] = 35] = "progress";
414
+ TagEnum[TagEnum["alert"] = 2] = "alert";
415
+ TagEnum[TagEnum["avatar"] = 3] = "avatar";
416
+ TagEnum[TagEnum["badge"] = 4] = "badge";
417
+ TagEnum[TagEnum["breadcrumb"] = 5] = "breadcrumb";
418
+ TagEnum[TagEnum["button"] = 6] = "button";
419
+ TagEnum[TagEnum["button-link"] = 7] = "button-link";
420
+ TagEnum[TagEnum["card"] = 8] = "card";
421
+ TagEnum[TagEnum["combobox"] = 9] = "combobox";
422
+ TagEnum[TagEnum["details"] = 10] = "details";
423
+ TagEnum[TagEnum["drawer"] = 11] = "drawer";
424
+ TagEnum[TagEnum["form"] = 12] = "form";
425
+ TagEnum[TagEnum["heading"] = 13] = "heading";
426
+ TagEnum[TagEnum["icon"] = 14] = "icon";
427
+ TagEnum[TagEnum["image"] = 15] = "image";
428
+ TagEnum[TagEnum["input-checkbox"] = 16] = "input-checkbox";
429
+ TagEnum[TagEnum["input-color"] = 17] = "input-color";
430
+ TagEnum[TagEnum["input-date"] = 18] = "input-date";
431
+ TagEnum[TagEnum["input-email"] = 19] = "input-email";
432
+ TagEnum[TagEnum["input-file"] = 20] = "input-file";
433
+ TagEnum[TagEnum["input-number"] = 21] = "input-number";
434
+ TagEnum[TagEnum["input-password"] = 22] = "input-password";
435
+ TagEnum[TagEnum["input-radio"] = 23] = "input-radio";
436
+ TagEnum[TagEnum["input-range"] = 24] = "input-range";
437
+ TagEnum[TagEnum["input-text"] = 25] = "input-text";
438
+ TagEnum[TagEnum["kolibri"] = 26] = "kolibri";
439
+ TagEnum[TagEnum["link"] = 27] = "link";
440
+ TagEnum[TagEnum["link-button"] = 28] = "link-button";
441
+ TagEnum[TagEnum["logo"] = 29] = "logo";
442
+ TagEnum[TagEnum["modal"] = 30] = "modal";
443
+ TagEnum[TagEnum["nav"] = 31] = "nav";
444
+ TagEnum[TagEnum["pagination"] = 32] = "pagination";
445
+ TagEnum[TagEnum["popover-button"] = 33] = "popover-button";
446
+ TagEnum[TagEnum["progress"] = 34] = "progress";
447
+ TagEnum[TagEnum["quote"] = 35] = "quote";
448
448
  TagEnum[TagEnum["select"] = 36] = "select";
449
- TagEnum[TagEnum["separator"] = 37] = "separator";
450
- TagEnum[TagEnum["single-select"] = 38] = "single-select";
451
- TagEnum[TagEnum["skip-nav"] = 39] = "skip-nav";
452
- TagEnum[TagEnum["spin"] = 40] = "spin";
453
- TagEnum[TagEnum["split-button"] = 41] = "split-button";
454
- TagEnum[TagEnum["symbol"] = 42] = "symbol";
455
- TagEnum[TagEnum["table"] = 43] = "table";
456
- TagEnum[TagEnum["table-stateful"] = 44] = "table-stateful";
457
- TagEnum[TagEnum["table-stateless"] = 45] = "table-stateless";
458
- TagEnum[TagEnum["tabs"] = 46] = "tabs";
459
- TagEnum[TagEnum["textarea"] = 47] = "textarea";
460
- TagEnum[TagEnum["toast-container"] = 48] = "toast-container";
461
- TagEnum[TagEnum["toolbar"] = 49] = "toolbar";
462
- TagEnum[TagEnum["tooltip"] = 50] = "tooltip";
463
- TagEnum[TagEnum["tree"] = 51] = "tree";
464
- TagEnum[TagEnum["tree-item"] = 52] = "tree-item";
449
+ TagEnum[TagEnum["single-select"] = 37] = "single-select";
450
+ TagEnum[TagEnum["skip-nav"] = 38] = "skip-nav";
451
+ TagEnum[TagEnum["spin"] = 39] = "spin";
452
+ TagEnum[TagEnum["split-button"] = 40] = "split-button";
453
+ TagEnum[TagEnum["symbol"] = 41] = "symbol";
454
+ TagEnum[TagEnum["table"] = 42] = "table";
455
+ TagEnum[TagEnum["table-stateful"] = 43] = "table-stateful";
456
+ TagEnum[TagEnum["table-stateless"] = 44] = "table-stateless";
457
+ TagEnum[TagEnum["tabs"] = 45] = "tabs";
458
+ TagEnum[TagEnum["textarea"] = 46] = "textarea";
459
+ TagEnum[TagEnum["toast-container"] = 47] = "toast-container";
460
+ TagEnum[TagEnum["toolbar"] = 48] = "toolbar";
461
+ TagEnum[TagEnum["tooltip"] = 49] = "tooltip";
462
+ TagEnum[TagEnum["tree"] = 50] = "tree";
463
+ TagEnum[TagEnum["tree-item"] = 51] = "tree-item";
465
464
  })(TagEnum || (TagEnum = {}));
466
465
  const MODES = ['development', 'production', 'test'];
467
466
  let runtimeMode = 'production';
@@ -1188,7 +1187,7 @@ var css_248z$1U = "/* forward the rem function */\n@layer kol-theme-component {\
1188
1187
 
1189
1188
  var css_248z$1T = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: var(--color-light);\n box-shadow: 0 0 4px color-mix(in srgb, black 80%, var(--color-subtle));\n border-radius: var(--border-radius);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n padding: calc(16rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n line-height: 1.75;\n }\n .kol-card__content {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
1190
1189
 
1191
- var css_248z$1S = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-primary-variant);\n }\n .kol-custom-suggestions-option:focus {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\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__input {\n position: relative;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-combobox__input::placeholder {\n color: var(--color-subtle);\n }\n}";
1190
+ var css_248z$1S = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-primary-variant);\n }\n .kol-custom-suggestions-option:focus {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\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__input {\n position: relative;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-combobox__input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-combobox__input::placeholder {\n color: var(--color-subtle);\n }\n}";
1192
1191
 
1193
1192
  var css_248z$1R = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-details {\n display: grid;\n width: 100%;\n height: 100%;\n }\n .kol-details__content.indented-text {\n width: 100%;\n margin-left: calc(-2rem / var(--kolibri-root-font-size, 16));\n padding: 0 calc(18rem / var(--kolibri-root-font-size, 16)) 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-left: 2px solid var(--color-primary-variant);\n margin: calc(4rem / var(--kolibri-root-font-size, 16)) 0 0 calc(10.4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-details__heading {\n margin: 0;\n }\n .kol-details__heading-button .kol-icon {\n font-size: calc(19.2rem / 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__heading-button .kol-span__label {\n border-bottom-color: #000;\n }\n .kol-details__heading-button .kol-button:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n cursor: pointer;\n }\n}";
1194
1193
 
@@ -1198,25 +1197,25 @@ var css_248z$1P = "/* forward the rem function */\n@layer kol-theme-component {\
1198
1197
 
1199
1198
  var css_248z$1O = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: calc(24rem / var(--kolibri-root-font-size, 16));\n line-height: 1.667;\n }\n .kol-headline--h2 {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1.4;\n }\n .kol-headline--h3 {\n font-size: calc(18rem / var(--kolibri-root-font-size, 16));\n line-height: 1.333;\n }\n .kol-headline--h1, .kol-headline--h2, .kol-headline--h3, .kol-headline--h4, .kol-headline--h5, .kol-headline--h6 {\n color: inherit;\n font-style: normal;\n }\n .kol-headline--h1, .kol-headline--h2, .kol-headline--h3 {\n font-weight: 700;\n }\n}";
1200
1199
 
1201
- var css_248z$1N = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n :host {\n --theme-visibility-delay: 0.5s;\n }\n .kol-form-field--disabled .kol-form-field__input {\n outline: none;\n }\n .kol-field-control--required .kol-field-control__label-text::after {\n padding-left: 0.125em;\n }\n .kol-field-control--required .kol-field-control__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-field-control--label-align-left:not(.kol-input-checkbox__field-control--variant-button) .kol-field-control__label {\n padding-right: calc(6.4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right:not(.kol-input-checkbox__field-control--variant-button) .kol-field-control__label {\n padding-left: calc(6.4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox .kol-input {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n line-height: 1.5;\n background-color: white;\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n width: 100%;\n margin: 0;\n border-width: 2px;\n order: 1;\n appearance: none;\n transition: 0.5s;\n }\n .kol-checkbox .kol-input:checked, .kol-checkbox .kol-input:indeterminate {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-checkbox .kol-input:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-checkbox .kol-input:focus:hover {\n box-shadow: none;\n }\n .kol-checkbox .kol-input:active {\n box-shadow: none;\n }\n .kol-checkbox .kol-input:not(:disabled):hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary);\n }\n .kol-checkbox.kol-checkbox--disabled {\n opacity: 0.5;\n }\n .kol-checkbox--variant-default {\n width: initial;\n min-width: initial;\n }\n .kol-checkbox--variant-default .kol-input {\n border-radius: var(--border-radius);\n width: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n min-width: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n height: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox--variant-default .kol-icon {\n color: var(--color-light);\n }\n .kol-checkbox--variant-switch .kol-icon {\n left: calc(2rem / var(--kolibri-root-font-size, 16));\n width: 1.25em;\n height: 1.25em;\n }\n .kol-checkbox--variant-switch .kol-input {\n background-color: var(--color-subtle);\n /* Visible with forced colors */\n outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n border-radius: 1.25em;\n display: block;\n position: relative;\n width: 3.5em;\n min-width: 3.5em;\n height: 1.5em;\n border-width: 0;\n }\n .kol-checkbox--variant-switch .kol-input:focus {\n outline-color: var(--color-primary);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-checkbox--variant-switch .kol-input:before {\n background-color: white;\n border-radius: 1.25em;\n position: absolute;\n top: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n left: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n width: 1.25em;\n height: 1.25em;\n }\n .kol-checkbox--variant-switch .kol-input:checked {\n background-color: var(--color-primary);\n }\n .kol-checkbox--variant-switch .kol-input:checked::before {\n transform: translateX(2em);\n }\n .kol-checkbox--variant-switch .kol-input:indeterminate::before {\n transform: translateX(1em);\n }\n .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon {\n transform: translate(2em, -50%);\n }\n .kol-checkbox--variant-switch.kol-checkbox--indeterminate .kol-icon {\n transform: translate(1em, -50%);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__input, .kol-input-checkbox__field-control--variant-button .kol-field-control__label {\n color: var(--color-primary);\n background-color: var(--color-light);\n border-color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__input {\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n height: 100%;\n border-width: 1px 0 1px 1px;\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__label {\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n display: flex;\n padding-right: calc(16rem / var(--kolibri-root-font-size, 16));\n border-width: 1px 1px 1px 0;\n align-self: stretch;\n justify-self: stretch;\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__label-text {\n margin: auto auto;\n font-weight: 700;\n }\n .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--indeterminate .kol-field-control__input, .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--indeterminate .kol-field-control__label {\n color: var(--color-primary);\n background-color: var(--color-mute);\n border-color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--checked .kol-field-control__input, .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--checked .kol-field-control__label {\n color: var(--color-light);\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled) .kol-field-control__input, .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled) .kol-field-control__label {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary-variant);\n }\n .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__label {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) 0);\n }\n .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__input {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) 0 calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)));\n }\n .kol-input-checkbox__field-control--variant-button:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__input {\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n border-width: 1px 1px 1px 0;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__label {\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n border-width: 1px 0 1px 1px;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__label {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) 0 calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)));\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__input {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) 0);\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--hide-label .kol-field-control__input {\n border-style: solid;\n border-radius: var(--border-radius);\n border-width: 1px;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--disabled .kol-field-control__input {\n opacity: 0.5;\n outline: none;\n }\n}";
1200
+ var css_248z$1N = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n :host {\n --theme-visibility-delay: 0.5s;\n }\n .kol-form-field--disabled .kol-form-field__input {\n outline: none;\n }\n .kol-field-control--required .kol-field-control__label-text::after {\n padding-left: 0.125em;\n }\n .kol-field-control--required .kol-field-control__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-field-control--label-align-left:not(.kol-input-checkbox__field-control--variant-button) .kol-field-control__label {\n padding-right: calc(6.4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right:not(.kol-input-checkbox__field-control--variant-button) .kol-field-control__label {\n padding-left: calc(6.4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox .kol-input {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n line-height: 1.5;\n background-color: white;\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n width: 100%;\n margin: 0;\n border-width: 2px;\n order: 1;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n transition: 0.5s;\n }\n .kol-checkbox .kol-input:checked, .kol-checkbox .kol-input:indeterminate {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-checkbox .kol-input:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-checkbox .kol-input:focus:hover {\n box-shadow: none;\n }\n .kol-checkbox .kol-input:active {\n box-shadow: none;\n }\n .kol-checkbox .kol-input:not(:disabled):hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary);\n }\n .kol-checkbox.kol-checkbox--disabled {\n opacity: 0.5;\n }\n .kol-checkbox--variant-default {\n width: initial;\n min-width: initial;\n }\n .kol-checkbox--variant-default .kol-input {\n border-radius: var(--border-radius);\n width: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n min-width: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n height: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox--variant-default .kol-icon {\n color: var(--color-light);\n }\n .kol-checkbox--variant-switch .kol-icon {\n left: calc(2rem / var(--kolibri-root-font-size, 16));\n width: 1.25em;\n height: 1.25em;\n }\n .kol-checkbox--variant-switch .kol-input {\n background-color: var(--color-subtle);\n /* Visible with forced colors */\n outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n border-radius: 1.25em;\n display: block;\n position: relative;\n width: 3.5em;\n min-width: 3.5em;\n height: 1.5em;\n border-width: 0;\n }\n .kol-checkbox--variant-switch .kol-input:focus {\n outline-color: var(--color-primary);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-checkbox--variant-switch .kol-input:before {\n background-color: white;\n border-radius: 1.25em;\n position: absolute;\n top: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n left: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n width: 1.25em;\n height: 1.25em;\n }\n .kol-checkbox--variant-switch .kol-input:checked {\n background-color: var(--color-primary);\n }\n .kol-checkbox--variant-switch .kol-input:checked::before {\n transform: translateX(2em);\n }\n .kol-checkbox--variant-switch .kol-input:indeterminate::before {\n transform: translateX(1em);\n }\n .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon {\n transform: translate(2em, -50%);\n }\n .kol-checkbox--variant-switch.kol-checkbox--indeterminate .kol-icon {\n transform: translate(1em, -50%);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__input, .kol-input-checkbox__field-control--variant-button .kol-field-control__label {\n color: var(--color-primary);\n background-color: var(--color-light);\n border-color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__input {\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n height: 100%;\n border-width: 1px 0 1px 1px;\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__label {\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n display: flex;\n padding-right: calc(16rem / var(--kolibri-root-font-size, 16));\n border-width: 1px 1px 1px 0;\n align-self: stretch;\n justify-self: stretch;\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__label-text {\n margin: auto auto;\n font-weight: 700;\n }\n .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--indeterminate .kol-field-control__input, .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--indeterminate .kol-field-control__label {\n color: var(--color-primary);\n background-color: var(--color-mute);\n border-color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--checked .kol-field-control__input, .kol-input-checkbox__field-control--variant-button.kol-input-checkbox__field-control--checked .kol-field-control__label {\n color: var(--color-light);\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled) .kol-field-control__input, .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled) .kol-field-control__label {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary-variant);\n }\n .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__label {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) 0);\n }\n .kol-input-checkbox__field-control--variant-button:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__input {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) 0 calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)));\n }\n .kol-input-checkbox__field-control--variant-button:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__input {\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n border-width: 1px 1px 1px 0;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__label {\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n border-width: 1px 0 1px 1px;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__label {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) 0 calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)));\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left:is(:active, :hover):not(.kol-field-control--disabled):not(.kol-field-control--hide-label) .kol-field-control__input {\n clip-path: inset(calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) calc(-10rem / var(--kolibri-root-font-size, 16)) 0);\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--hide-label .kol-field-control__input {\n border-style: solid;\n border-radius: var(--border-radius);\n border-width: 1px;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--disabled .kol-field-control__input {\n opacity: 0.5;\n outline: none;\n }\n}";
1202
1201
 
1203
- var css_248z$1M = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n}\n.kol-input-color__input--text, .kol-input-color__input--color {\n background-color: var(--color-light);\n min-height: calc(var(--a11y-min-size) - 8rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-subtle);\n}";
1202
+ var css_248z$1M = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n}\n.kol-input-color__input--text, .kol-input-color__input--color {\n background-color: var(--color-light);\n min-height: calc(var(--a11y-min-size) - 8rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-subtle);\n}";
1204
1203
 
1205
- var css_248z$1L = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1204
+ var css_248z$1L = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1206
1205
 
1207
- var css_248z$1K = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1206
+ var css_248z$1K = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1208
1207
 
1209
- var css_248z$1J = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n.kol-input-container {\n padding: 0 0 0 calc(8rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-theme-component {\n :host {\n --theme-visibility-delay: 0.5s;\n }\n .kol-button__text {\n border-style: solid;\n border-radius: var(--border-radius);\n border-width: var(--border-width);\n font-weight: 700;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-secondary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--tertiary {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-text);\n --text-color: var(--color-text);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled], [aria-disabled=true]):hover, .kol-button--secondary:not([disabled], [aria-disabled=true]):hover, .kol-button--tertiary:not([disabled], [aria-disabled=true]):hover, .kol-button--normal:not([disabled], [aria-disabled=true]):hover, .kol-button--danger:not([disabled], [aria-disabled=true]):hover, .kol-button--ghost:not([disabled], [aria-disabled=true]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled], [aria-disabled=true]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\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 min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--text-border-color);\n }\n .kol-button--hide-label .kol-button__text {\n width: unset;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n position: relative;\n }\n .kol-button:is(:disabled, [aria-disabled=true]):hover .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: none;\n border-color: var(--text-border-color);\n }\n .kol-input-container {\n padding: 0 0 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: initial;\n }\n .kol-input-container__filename {\n color: var(--color-subtle);\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-primary);\n }\n .kol-button__text {\n white-space: nowrap;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: calc(var(--border-radius) - 2px);\n border-top-left-radius: 0;\n border-top-right-radius: calc(var(--border-radius) - 2px);\n }\n .kol-input {\n background-color: transparent;\n padding-top: calc(0.5em + 2rem / var(--kolibri-root-font-size, 16));\n }\n}";
1208
+ var css_248z$1J = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n.kol-input-container {\n padding: 0 0 0 calc(8rem / var(--kolibri-root-font-size, 16));\n}\n\n@layer kol-theme-component {\n :host {\n --theme-visibility-delay: 0.5s;\n }\n .kol-button__text {\n border-style: solid;\n border-radius: var(--border-radius);\n border-width: var(--border-width);\n font-weight: 700;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-secondary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--tertiary {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-text);\n --text-color: var(--color-text);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled], [aria-disabled=true]):hover, .kol-button--secondary:not([disabled], [aria-disabled=true]):hover, .kol-button--tertiary:not([disabled], [aria-disabled=true]):hover, .kol-button--normal:not([disabled], [aria-disabled=true]):hover, .kol-button--danger:not([disabled], [aria-disabled=true]):hover, .kol-button--ghost:not([disabled], [aria-disabled=true]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled], [aria-disabled=true]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\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 min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--text-border-color);\n }\n .kol-button--hide-label .kol-button__text {\n width: unset;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n position: relative;\n }\n .kol-button:is(:disabled, [aria-disabled=true]):hover .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: none;\n border-color: var(--text-border-color);\n }\n .kol-input-container {\n padding: 0 0 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: initial;\n }\n .kol-input-container__filename {\n color: var(--color-subtle);\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-primary);\n }\n .kol-button__text {\n white-space: nowrap;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: calc(var(--border-radius) - 2px);\n border-top-left-radius: 0;\n border-top-right-radius: calc(var(--border-radius) - 2px);\n }\n .kol-input {\n background-color: transparent;\n padding-top: calc(0.5em + 2rem / var(--kolibri-root-font-size, 16));\n }\n}";
1210
1209
 
1211
- var css_248z$1I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1210
+ var css_248z$1I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1212
1211
 
1213
- var css_248z$1H = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1212
+ var css_248z$1H = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1214
1213
 
1215
1214
  var css_248z$1G = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-field-control--required .kol-field-control__label-text::after {\n padding-left: 0.125em;\n }\n .kol-field-control--required .kol-field-control__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field {\n display: grid;\n margin: 0;\n padding: 0;\n border: 0;\n }\n .kol-form-field--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field__label {\n display: inline-block;\n padding: 0;\n }\n .kol-form-field__input {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__input--orientation-horizontal {\n margin-top: calc(var(--spacing) / 2);\n gap: var(--spacing) calc(var(--spacing) * 2);\n }\n .kol-field-control__label {\n padding-top: 0.1em;\n }\n .kol-input-radio__input {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: 50%;\n border-width: 2px;\n line-height: 1.5;\n }\n .kol-input-radio__input:not(:disabled):hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary);\n }\n .kol-input-radio__input:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-radio__input:focus:hover {\n box-shadow: none;\n }\n .kol-input-radio__input:checked:before {\n background-color: var(--color-primary);\n }\n .kol-input-radio__input:disabled {\n background-color: var(--color-mute-variant);\n }\n .kol-input--error:focus {\n outline-color: var(--color-danger);\n }\n .kol-field-control__hint,\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-alert--type-error {\n margin-left: -0.25em;\n }\n}";
1216
1215
 
1217
1216
  var css_248z$1F = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input-range__inputs-wrapper {\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-range__input--number {\n text-align: right;\n }\n}";
1218
1217
 
1219
- var css_248z$1E = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1218
+ var css_248z$1E = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
1220
1219
 
1221
1220
  var css_248z$1D = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n --theme-visibility-delay: 0.5s;\n }\n .kol-link__text {\n border-style: solid;\n border-radius: var(--border-radius);\n border-width: var(--border-width);\n font-weight: 700;\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-link--secondary {\n --text-background-color: var(--color-secondary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-link--tertiary {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-link--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-text);\n --text-color: var(--color-text);\n }\n .kol-link--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-link--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-link--primary:not([disabled], [aria-disabled=true]):hover, .kol-link--secondary:not([disabled], [aria-disabled=true]):hover, .kol-link--tertiary:not([disabled], [aria-disabled=true]):hover, .kol-link--normal:not([disabled], [aria-disabled=true]):hover, .kol-link--danger:not([disabled], [aria-disabled=true]):hover, .kol-link--ghost:not([disabled], [aria-disabled=true]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-link--danger:not([disabled], [aria-disabled=true]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\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 min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-link__text:hover {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--text-border-color);\n }\n .kol-link--hide-label .kol-link__text {\n width: unset;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-link:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n position: relative;\n }\n .kol-link:is(:disabled, [aria-disabled=true]):hover .kol-link__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: none;\n border-color: var(--text-border-color);\n }\n}";
1222
1221
 
@@ -1224,7 +1223,7 @@ var css_248z$1C = "/* forward the rem function */\n@layer kol-theme-component {\
1224
1223
 
1225
1224
  var css_248z$1B = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-primary);\n font-weight: 400;\n font-style: normal;\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link:visited {\n color: var(--visited);\n }\n .kol-link:focus .kol-link__text {\n outline: var(--border-width) solid;\n border-radius: var(--border-radius);\n position: relative;\n }\n .kol-link:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-link__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .kol-link {\n line-height: 1;\n }\n}";
1226
1225
 
1227
- var css_248z$1A = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n background-color: var(--color-mute);\n }\n .kol-nav__list {\n list-style: none;\n }\n .kol-nav__list--nested {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__list--nested .kol-link,\n .kol-nav__list--nested .kol-button {\n border-left-color: transparent !important;\n font-weight: normal !important;\n }\n .kol-nav__entry--link {\n display: flex;\n }\n .kol-nav__entry .kol-link:hover {\n text-decoration: underline;\n }\n .kol-nav__entry .kol-link,\n .kol-nav__entry .kol-button {\n color: var(--color-primary);\n display: flex;\n min-height: var(--a11y-min-size);\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n text-decoration: none;\n }\n .kol-nav__entry .kol-link:focus-visible,\n .kol-nav__entry .kol-button:focus-visible {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__list--vertical .kol-nav__entry .kol-link,\n .kol-nav__list--vertical .kol-nav__entry .kol-button {\n padding-right: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 2px solid transparent;\n }\n .kol-nav--horizontal .kol-nav__entry .kol-link,\n .kol-nav--horizontal .kol-nav__entry .kol-button {\n padding: 0 calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav--vertical .kol-nav__list-item--active .kol-nav__entry .kol-link,\n .kol-nav--vertical .kol-nav__list-item--active .kol-nav__entry .kol-button {\n border-left-color: var(--color-primary);\n }\n .kol-nav__list-item--active .kol-nav__entry .kol-link,\n .kol-nav__list-item--active .kol-nav__entry .kol-button {\n font-weight: bold;\n }\n .kol-nav__expand-button .kol-button:hover {\n color: var(--color-light);\n background-color: var(--color-primary);\n }\n .kol-nav__expand-button .kol-button:focus-visible {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__expand-button .kol-button__text {\n justify-content: center;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: none;\n }\n .kol-nav__toggle-button .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-nav__toggle-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: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n border-width: var(--border-width);\n font-weight: 700;\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-nav__toggle-button .kol-button__text:hover {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--text-border-color);\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text {\n width: unset;\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__toggle-button .kol-button:disabled:hover .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: none;\n border-color: var(--text-border-color);\n }\n}";
1226
+ var css_248z$1A = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n background-color: var(--color-mute);\n }\n .kol-nav__list {\n list-style: none;\n }\n .kol-nav__list--nested {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__list--nested .kol-link,\n .kol-nav__list--nested .kol-button {\n border-left-color: transparent !important;\n font-weight: normal !important;\n }\n .kol-nav__entry--link {\n display: flex;\n }\n .kol-nav__entry .kol-button:hover,\n .kol-nav__entry .kol-link:hover {\n text-decoration: underline;\n }\n .kol-nav__entry .kol-link,\n .kol-nav__entry .kol-button {\n color: var(--color-primary);\n display: flex;\n min-height: var(--a11y-min-size);\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n text-decoration: none;\n }\n .kol-nav__entry .kol-link:focus-visible,\n .kol-nav__entry .kol-button:focus-visible {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__list--vertical .kol-nav__entry .kol-link,\n .kol-nav__list--vertical .kol-nav__entry .kol-button {\n padding-right: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 2px solid transparent;\n }\n .kol-nav--horizontal .kol-nav__entry .kol-link,\n .kol-nav--horizontal .kol-nav__entry .kol-button {\n padding: 0 calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav--vertical .kol-nav__list-item--active .kol-nav__entry .kol-link,\n .kol-nav--vertical .kol-nav__list-item--active .kol-nav__entry .kol-button {\n border-left-color: var(--color-primary);\n }\n .kol-nav__list-item--active .kol-nav__entry .kol-link,\n .kol-nav__list-item--active .kol-nav__entry .kol-button {\n font-weight: bold;\n }\n .kol-nav__expand-button .kol-button:hover {\n color: var(--color-light);\n background-color: var(--color-primary);\n }\n .kol-nav__expand-button .kol-button:focus-visible {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__expand-button .kol-button__text {\n justify-content: center;\n }\n .kol-nav__toggle-button .kol-button {\n margin-bottom: calc(5rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: none;\n }\n .kol-nav__toggle-button .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-nav__toggle-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: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n border-width: var(--border-width);\n font-weight: 700;\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-nav__toggle-button .kol-button__text:hover {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--text-border-color);\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text {\n width: unset;\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-nav__toggle-button .kol-button:disabled:hover .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n box-shadow: none;\n border-color: var(--text-border-color);\n }\n}";
1228
1227
 
1229
1228
  var css_248z$1z = "/* 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(16rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-pagination .kol-button:is(:active, :hover):not(:disabled) .kol-button__text {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n border-color: var(--color-primary-variant);\n }\n .kol-pagination .kol-button:active .kol-button__text {\n color: var(--color-light);\n outline: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-primary);\n background-color: var(--color-light);\n border-radius: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n font-weight: 700;\n border: 1px solid var(--color-primary);\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-pagination__button--selected .kol-button {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n color: var(--color-light);\n background-color: var(--color-primary);\n border: 0;\n }\n}";
1230
1229
 
@@ -1234,7 +1233,7 @@ var css_248z$1x = "/* forward the rem function */\n@layer kol-theme-component {\
1234
1233
 
1235
1234
  var css_248z$1w = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-select {\n border: none;\n }\n .kol-select[multiple] {\n overflow: auto;\n }\n .kol-select__option {\n border-radius: var(--border-radius);\n margin: calc(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(--color-light);\n background-color: var(--color-primary-variant);\n }\n .kol-select:not([multiple]) .kol-select__option {\n padding: 0.5em;\n }\n}";
1236
1235
 
1237
- var css_248z$1v = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-primary-variant);\n }\n .kol-custom-suggestions-option:focus {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-single-select__group {\n display: inline-flex;\n width: 100%;\n align-items: center;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-single-select__input::placeholder {\n color: var(--color-subtle);\n }\n}";
1236
+ var css_248z$1v = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-primary-variant);\n }\n .kol-custom-suggestions-option:focus {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-single-select__group {\n display: inline-flex;\n width: 100%;\n align-items: center;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 40rem / 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-subtle);\n }\n .kol-single-select__input::placeholder {\n color: var(--color-subtle);\n }\n}";
1238
1237
 
1239
1238
  var css_248z$1u = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-skip-nav .kol-link__text {\n color: var(--color-light);\n background-color: var(--color-primary-variant);\n border-color: var(--color-primary-variant);\n border-style: solid;\n border-radius: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n border-width: var(--border-width);\n gap: calc(var(--spacing) * 2);\n line-height: 1;\n cursor: pointer;\n }\n}";
1240
1239
 
@@ -1246,7 +1245,7 @@ var css_248z$1r = "/* forward the rem function */\n@layer kol-theme-component {\
1246
1245
 
1247
1246
  var css_248z$1q = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tabs {\n display: grid;\n grid-template-columns: var(--grid-template-columns);\n grid-template-rows: var(--grid-template-rows);\n }\n .kol-tabs--align-right {\n --display: grid;\n --grid-template-columns: 1fr auto;\n --button-group-display: grid;\n --button-group-order: 1;\n }\n .kol-tabs--align-left {\n --display: grid;\n --grid-template-columns: auto 1fr;\n --button-group-order: 0;\n }\n .kol-tabs--align-bottom {\n --display: flex;\n --grid-template-rows: 1fr auto;\n --button-group-gap: calc(32rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 1;\n }\n .kol-tabs--align-top {\n --display: flex;\n --grid-template-rows: auto 1fr;\n --button-group-gap: calc(32rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 0;\n }\n .kol-tabs__button-group {\n display: var(--display);\n gap: var(--button-group-gap);\n order: var(--button-group-order);\n flex-wrap: wrap;\n }\n .kol-tabs .kol-button {\n color: var(--color-subtle);\n background-color: transparent;\n border-radius: var(--border-radius);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0;\n font-size: calc(18rem / var(--kolibri-root-font-size, 16));\n font-weight: 700;\n line-height: 1.2;\n border: none;\n font-style: normal;\n }\n .kol-tabs .kol-button:hover {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button.primary, .kol-tabs .kol-button.selected {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button:not(.kol-tabs .kol-button.selected) .kol-span__container {\n padding-bottom: 0.25em;\n }\n .kol-tabs .kol-button.selected .kol-span__container {\n border-bottom: 0.25em solid;\n }\n .kol-tabs .kol-button .kol-span__container {\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__content {\n padding: 0.25em 0;\n }\n .kol-tabs__panel {\n height: 100%;\n }\n .kol-tabs .kol-button-wc {\n width: 100%;\n }\n}";
1248
1247
 
1249
- var css_248z$1p = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n@layer kol-theme-component {\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n display: block;\n overflow: auto;\n border: none;\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
1248
+ var css_248z$1p = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n border-left: 3px solid var(--color-danger);\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-danger);\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n color: var(--color-text);\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n outline-offset: 2px;\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n@layer kol-theme-component {\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n display: block;\n overflow: auto;\n border: none;\n }\n .kol-textarea::-moz-placeholder {\n color: var(--color-subtle);\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
1250
1249
 
1251
1250
  var css_248z$1o = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert {\n background-color: var(--color-light);\n display: flex;\n width: 100%;\n overflow: unset;\n }\n .kol-alert--variant-msg {\n align-items: start;\n }\n .kol-alert--variant-card {\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n border-radius: var(--border-radius);\n flex-direction: column;\n border: var(--border-width) solid var(--alert-accent-color);\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--variant-card .kol-alert__container {\n background-color: var(--alert-accent-color);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__closer {\n place-self: center;\n }\n .kol-alert__closer .kol-button {\n border-radius: 50%;\n width: var(--a11y-min-size);\n height: var(--a11y-min-size);\n cursor: pointer;\n }\n .kol-alert--variant-msg .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-button {\n color: var(--color-light);\n }\n .kol-alert__closer .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--variant-card .kol-alert__heading {\n color: var(--color-light);\n display: flex;\n width: 100%;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--type-default) .kol-alert__icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--variant-card .kol-alert__icon {\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n justify-self: right;\n }\n .kol-alert--variant-card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n top: calc(16rem / var(--kolibri-root-font-size, 16));\n right: calc(16rem / var(--kolibri-root-font-size, 16));\n width: calc(440rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
1252
1251
 
@@ -1310,79 +1309,79 @@ var css_248z$1i = "/* forward the rem function */\n@layer kol-theme-component {\
1310
1309
 
1311
1310
  var css_248z$1h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-badge {\n padding: calc(8rem / var(--kolibri-root-font-size, 16) - 1rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16) - 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal var(--font-weight) 1em var(--font-family);\n text-transform: uppercase;\n }\n}";
1312
1311
 
1313
- var css_248z$1g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n .kol-breadcrumb {\n font: normal normal 400 calc(14rem / var(--kolibri-root-font-size, 16))/calc(16rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: var(--font-weight-bold);\n }\n .kol-breadcrumb__icon::part(icon separator)::before {\n color: var(--color-blue);\n }\n .kol-breadcrumb__icon[exportparts*=separator] {\n padding: 0;\n margin-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n margin-inline-start: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-breadcrumb__list-element:last-child {\n color: var(--color-grey-75);\n }\n}";
1312
+ var css_248z$1g = "/* 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(14rem / var(--kolibri-root-font-size, 16))/calc(16rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: var(--font-weight-bold);\n }\n .kol-breadcrumb__icon::part(icon separator)::before {\n color: var(--color-blue);\n }\n .kol-breadcrumb__icon[exportparts*=separator] {\n padding: 0;\n margin-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n margin-inline-start: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-breadcrumb__list-element:last-child {\n color: var(--color-grey-75);\n }\n}";
1314
1313
 
1315
- var css_248z$1f = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1314
+ 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 --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1316
1315
 
1317
- var css_248z$1e = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n color: var(--color-blue);\n line-height: 1.2;\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}";
1316
+ var css_248z$1e = "/* 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}";
1318
1317
 
1319
1318
  var css_248z$1d = "/* 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}";
1320
1319
 
1321
- var css_248z$1c = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(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% - 24rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\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}";
1320
+ var css_248z$1c = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(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% - 24rem / 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}";
1322
1321
 
1323
1322
  var css_248z$1b = "/* 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.2rem / 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(16rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n }\n}";
1324
1323
 
1325
1324
  var css_248z$1a = "@layer kol-theme-component {\n .kol-drawer__wrapper {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
1326
1325
 
1327
- var css_248z$19 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
1326
+ var css_248z$19 = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
1328
1327
 
1329
1328
  var css_248z$18 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: calc(32rem / var(--kolibri-root-font-size, 16));\n line-height: 1.25;\n }\n .kol-headline--h2 {\n font-size: calc(28rem / var(--kolibri-root-font-size, 16));\n line-height: 1.143;\n }\n .kol-headline--h3 {\n font-size: calc(24rem / var(--kolibri-root-font-size, 16));\n line-height: 1.1667;\n }\n .kol-headline--h4 {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1.4;\n }\n .kol-headline--h5 {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n line-height: 1.5;\n }\n .kol-headline--h6 {\n color: rgb(234, 0, 255);\n }\n}";
1330
1329
 
1331
1330
  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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right .kol-field-control__label {\n padding-left: calc(8rem / 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}";
1332
1331
 
1333
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16rem / 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) - 8rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
1332
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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(16rem / 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) - 8rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
1334
1333
 
1335
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1334
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1336
1335
 
1337
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1336
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1338
1337
 
1339
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::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 appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
1338
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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 --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
1340
1339
 
1341
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1340
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1342
1341
 
1343
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1342
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1344
1343
 
1345
1344
  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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / var(--kolibri-root-font-size, 16)) calc(10rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n gap: calc(8rem / 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.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__input {\n gap: calc(8rem / 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(8rem / 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}";
1346
1345
 
1347
1346
  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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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}";
1348
1347
 
1349
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1348
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1350
1349
 
1351
- var css_248z$Z = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n color: var(--color-blue);\n text-decoration: underline;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
1350
+ var css_248z$Z = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4rem / 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}";
1352
1351
 
1353
- var css_248z$Y = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
1352
+ var css_248z$Y = "@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}";
1354
1353
 
1355
1354
  var css_248z$X = "/* 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-modal__card {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
1356
1355
 
1357
- var css_248z$W = "/* 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(2rem / 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::part(icon)::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::part(icon)::before {\n content: \"\\eab6\";\n }\n .kol-nav__toggle-button .kol-button {\n outline: none;\n text-decoration: none;\n appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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(44rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44rem / 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(16rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18rem / 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}";
1356
+ var css_248z$W = "/* 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(2rem / 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::part(icon)::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::part(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 --text-focus-outline-color: var(--color-black);\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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(44rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44rem / 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(16rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18rem / 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}";
1358
1357
 
1359
- var css_248z$V = "/* 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(16rem / 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 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}";
1358
+ var css_248z$V = "/* 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(16rem / 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}";
1360
1359
 
1361
- var css_248z$U = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1360
+ var css_248z$U = "/* 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 --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1362
1361
 
1363
1362
  var css_248z$T = "/* 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}";
1364
1363
 
1365
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1364
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1366
1365
 
1367
- var css_248z$R = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(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% - 40rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\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}";
1366
+ var css_248z$R = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(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% - 40rem / 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}";
1368
1367
 
1369
1368
  var css_248z$Q = "/* 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(8rem / var(--kolibri-root-font-size, 16));\n font-weight: var(--font-weight-bold);\n line-height: 1;\n cursor: pointer;\n }\n}";
1370
1369
 
1371
1370
  var css_248z$P = "/* forward the rem function */\n@layer kol-theme-component {\n .cycle {\n padding: calc(2rem / var(--kolibri-root-font-size, 16));\n }\n .cycle span {\n background-color: var(--color-blue-75);\n }\n}";
1372
1371
 
1373
- var css_248z$O = "/* 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: #fff;\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 appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-split-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1372
+ var css_248z$O = "/* 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: #fff;\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 --text-focus-outline-color: var(--color-black);\n }\n .kol-split-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1374
1373
 
1375
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / 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 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(8rem / 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(2rem / 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(2rem / 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(2rem / 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(16rem / var(--kolibri-root-font-size, 16));\n }\n }\n}";
1374
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / 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(8rem / 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(2rem / 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(2rem / 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(2rem / 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(16rem / var(--kolibri-root-font-size, 16));\n }\n }\n}";
1376
1375
 
1377
- var css_248z$M = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / 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 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(8rem / 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(2rem / 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(2rem / 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(2rem / 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}";
1376
+ var css_248z$M = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / 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(8rem / 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(2rem / 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(2rem / 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(2rem / 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}";
1378
1377
 
1379
1378
  var css_248z$L = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__button-group {\n margin-bottom: calc(-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(-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(2rem / 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(8rem / var(--kolibri-root-font-size, 16));\n }\n}";
1380
1379
 
1381
- var css_248z$K = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1380
+ var css_248z$K = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1382
1381
 
1383
1382
  var css_248z$J = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n top: calc(16rem / var(--kolibri-root-font-size, 16));\n right: calc(16rem / var(--kolibri-root-font-size, 16));\n width: calc(440rem / var(--kolibri-root-font-size, 16));\n max-width: 100%;\n }\n .kol-toast-item {\n background-color: #fff;\n display: block;\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / 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(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item__alert {\n display: block;\n }\n}";
1384
1383
 
1385
- var css_248z$I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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 appearance: none;\n --text-focus-outline-color: var(--color-black);\n }\n .kol-link:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1384
+ var css_248z$I = "/* 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 --text-focus-outline-color: var(--color-black);\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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 --text-focus-outline-color: var(--color-black);\n }\n .kol-link:focus {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\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}";
1386
1385
 
1387
1386
  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}";
1388
1387
 
@@ -1442,65 +1441,65 @@ var css_248z$D = "/* forward the rem function */\n@layer kol-theme-component {\n
1442
1441
 
1443
1442
  var css_248z$C = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-badge {\n padding: calc(8rem / var(--kolibri-root-font-size, 16) - 1rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16) - 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal var(--font-weight) calc(14rem / var(--kolibri-root-font-size, 16))/1em var(--font-family);\n text-transform: uppercase;\n }\n}";
1444
1443
 
1445
- var css_248z$B = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
1444
+ var css_248z$B = "@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}";
1446
1445
 
1447
- var css_248z$A = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n}";
1446
+ var css_248z$A = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n}";
1448
1447
 
1449
- var css_248z$z = "@layer kol-theme-component {\n .kol-button {\n color: var(--color-blue);\n line-height: 1.2;\n appearance: none;\n }\n .kol-button:hover {\n color: var(--color-blue-130);\n }\n}";
1448
+ var css_248z$z = "@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}";
1450
1449
 
1451
1450
  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.75;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}";
1452
1451
 
1453
- var css_248z$x = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n text-align: left;\n }\n .kol-combobox__input {\n position: relative;\n width: calc(100% - 24rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\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}";
1452
+ var css_248z$x = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n text-align: left;\n }\n .kol-combobox__input {\n position: relative;\n width: calc(100% - 24rem / 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}";
1454
1453
 
1455
1454
  var css_248z$w = "/* 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.2rem / 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 display: inline-block;\n padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: calc(4rem / var(--kolibri-root-font-size, 16));\n border-inline-start: calc(8rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n -webkit-border-start: calc(8rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n border-start-start-radius: calc(4rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / var(--kolibri-root-font-size, 16));\n -webkit-padding-start: calc(24rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n }\n}";
1456
1455
 
1457
1456
  var css_248z$v = "@layer kol-theme-component {\n .kol-drawer__wrapper {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
1458
1457
 
1459
- var css_248z$u = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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 display: inline-block;\n padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: calc(4rem / var(--kolibri-root-font-size, 16));\n border-inline-start: calc(8rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n -webkit-border-start: calc(8rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n border-start-start-radius: calc(4rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / var(--kolibri-root-font-size, 16));\n -webkit-padding-start: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
1458
+ var css_248z$u = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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 display: inline-block;\n padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: calc(4rem / var(--kolibri-root-font-size, 16));\n border-inline-start: calc(8rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n -webkit-border-start: calc(8rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n border-start-start-radius: calc(4rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / var(--kolibri-root-font-size, 16));\n -webkit-padding-start: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
1460
1459
 
1461
1460
  var css_248z$t = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: calc(42rem / var(--kolibri-root-font-size, 16));\n line-height: 3.25;\n }\n .kol-headline--h2 {\n font-size: calc(36rem / var(--kolibri-root-font-size, 16));\n line-height: 2.755;\n }\n .kol-headline--h3 {\n font-size: calc(32rem / var(--kolibri-root-font-size, 16));\n line-height: 2.5;\n }\n .kol-headline--h4 {\n font-size: calc(28rem / var(--kolibri-root-font-size, 16));\n line-height: 2;\n }\n .kol-headline--h5 {\n font-size: calc(24rem / var(--kolibri-root-font-size, 16));\n line-height: 1.75;\n }\n .kol-headline--h6 {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1.75;\n }\n .kol-headline--h1, .kol-headline--h2, .kol-headline--h3, .kol-headline--h4, .kol-headline--h5, .kol-headline--h6 {\n font-weight: var(--font-weight-bold);\n }\n}";
1462
1461
 
1463
1462
  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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right .kol-field-control__label {\n padding-left: calc(8rem / 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: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}";
1464
1463
 
1465
- var css_248z$r = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16rem / 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) - 8rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
1464
+ var css_248z$r = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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(16rem / 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) - 8rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
1466
1465
 
1467
- var css_248z$q = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1466
+ var css_248z$q = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1468
1467
 
1469
- var css_248z$p = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1468
+ var css_248z$p = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1470
1469
 
1471
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button__text {\n border-radius: 0;\n white-space: nowrap;\n }\n .kol-input-container {\n padding: 0 0 0 calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
1470
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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 --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button__text {\n border-radius: 0;\n white-space: nowrap;\n }\n .kol-input-container {\n padding: 0 0 0 calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
1472
1471
 
1473
- 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1472
+ 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1474
1473
 
1475
- var css_248z$m = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1474
+ var css_248z$m = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1476
1475
 
1477
1476
  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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / var(--kolibri-root-font-size, 16)) calc(10rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n gap: calc(8rem / 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.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__input {\n gap: calc(8rem / 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(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n outline: 2px solid var(--color-grey-75);\n outline-offset: 2px;\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}";
1478
1477
 
1479
1478
  var css_248z$k = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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-range__inputs-wrapper {\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
1480
1479
 
1481
- var css_248z$j = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1480
+ var css_248z$j = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1482
1481
 
1483
- var css_248z$i = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-link--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-link--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-link__text:active, .kol-link__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-link--secondary .kol-link__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-link--secondary.button:focus-visible .kol-link__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-link:focus-visible .kol-link__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n}";
1482
+ var css_248z$i = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-link--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-link__text:active, .kol-link__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-link--secondary .kol-link__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-link--secondary.button:focus-visible .kol-link__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-link:focus-visible .kol-link__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n}";
1484
1483
 
1485
- var css_248z$h = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
1484
+ var css_248z$h = "@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}";
1486
1485
 
1487
1486
  var css_248z$g = "/* 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.75;\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-modal__card {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
1488
1487
 
1489
- var css_248z$f = "/* 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(2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry-wrapper {\n display: flex;\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::part(icon)::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::part(icon)::before {\n content: \"\\eab6\";\n }\n .kol-nav__toggle-button .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-nav__toggle-button .kol-button--ghost:hover {\n --text-color: #0e47cb;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: none;\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-radius: 4px;\n min-width: calc(44rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n text-decoration: none !important;\n }\n .kol-nav__toggle-button .kol-button__text:active, .kol-nav__toggle-button .kol-button__text:hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-nav__toggle-button .kol-button:focus-visible .kol-nav__toggle-button .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text .kol-span__label {\n display: none;\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(16rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18rem / 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}";
1488
+ var css_248z$f = "/* 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(2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry-wrapper {\n display: flex;\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::part(icon)::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::part(icon)::before {\n content: \"\\eab6\";\n }\n .kol-nav__toggle-button .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-nav__toggle-button .kol-button--ghost:hover {\n --text-color: #0e47cb;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: none;\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-radius: 4px;\n min-width: calc(44rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n text-decoration: none !important;\n }\n .kol-nav__toggle-button .kol-button__text:active, .kol-nav__toggle-button .kol-button__text:hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-nav__toggle-button .kol-button:focus-visible .kol-nav__toggle-button .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text .kol-span__label {\n display: none;\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(16rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18rem / 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}";
1490
1489
 
1491
1490
  var css_248z$e = "/* 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(16rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-pagination .kol-button:focus {\n outline: none;\n }\n .kol-pagination .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:not(:disabled):active .kol-button__text, .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\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 font-weight: bold;\n text-decoration: underline;\n }\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-button:not(:disabled):active .kol-button__text, .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\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 font-weight: bold;\n text-decoration: underline;\n }\n .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n}";
1492
1491
 
1493
- var css_248z$d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n}";
1492
+ var css_248z$d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n}";
1494
1493
 
1495
- var css_248z$c = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1494
+ var css_248z$c = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1496
1495
 
1497
- var css_248z$b = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 2.5rem);\n flex-grow: 1;\n border: none;\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}";
1496
+ var css_248z$b = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / 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-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / 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(1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 2.5rem);\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}";
1498
1497
 
1499
1498
  var css_248z$a = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-skip-nav .kol-link__text {\n color: #fff;\n background-color: #0e47cb;\n border-radius: 4px;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n cursor: pointer;\n }\n}";
1500
1499
 
1501
1500
  var css_248z$9 = "/* forward the rem function */\n@layer kol-theme-component {\n .cycle {\n padding: calc(2rem / var(--kolibri-root-font-size, 16));\n }\n .cycle span {\n background-color: var(--color-blue-80);\n }\n}";
1502
1501
 
1503
- var css_248z$8 = "/* 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: 4px;\n border-width: 2px;\n }\n .kol-split-button__horizontal-line {\n border: 0;\n border-top: 1px solid var(--color-blue);\n }\n .kol-split-button .kol-popover__content {\n background-color: #fff;\n }\n .kol-split-button .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-split-button .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-split-button .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-split-button .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-split-button .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-split-button .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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: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-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-split-button .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-split-button .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-split-button .kol-button__text:active, .kol-split-button .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-split-button .kol-button--secondary .kol-split-button .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-split-button .kol-button--secondary.button:focus-visible .kol-split-button .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-split-button .kol-button:focus-visible .kol-split-button .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n display: none;\n }\n}";
1502
+ var css_248z$8 = "/* 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: 4px;\n border-width: 2px;\n }\n .kol-split-button__horizontal-line {\n border: 0;\n border-top: 1px solid var(--color-blue);\n }\n .kol-split-button .kol-popover__content {\n background-color: #fff;\n }\n .kol-split-button .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-split-button .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-split-button .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-split-button .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-split-button .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-split-button .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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: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-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-split-button .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-split-button .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-split-button .kol-button__text:active, .kol-split-button .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-split-button .kol-button--secondary .kol-split-button .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-split-button .kol-button--secondary.button:focus-visible .kol-split-button .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-split-button .kol-button:focus-visible .kol-split-button .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n display: none;\n }\n}";
1504
1503
 
1505
1504
  var css_248z$7 = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(16rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-pagination .kol-button:focus {\n outline: none;\n }\n .kol-pagination .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:not(:disabled):active .kol-button__text, .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\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 font-weight: bold;\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\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(2rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\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(2rem / 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(2rem / 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--header--ascending, .kol-table__cell--header--descending {\n font-weight: 700;\n }\n .kol-table__cell--header--ascending .kol-button, .kol-table__cell--header--descending .kol-button {\n font-weight: 700;\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 outline-offset: 2px;\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 outline: 2px solid var(--color-blue);\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 gap: calc(16rem / var(--kolibri-root-font-size, 16));\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(16rem / var(--kolibri-root-font-size, 16));\n }\n }\n}";
1506
1505
 
@@ -1508,11 +1507,11 @@ var css_248z$6 = "/* forward the rem function */\n@layer kol-theme-component {\n
1508
1507
 
1509
1508
  var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__button-group {\n margin-bottom: calc(-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(-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(2rem / 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(4rem / var(--kolibri-root-font-size, 16));\n }\n}";
1510
1509
 
1511
- var css_248z$4 = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
1510
+ var css_248z$4 = "/* 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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40rem / 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(14rem / 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(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(1rem / var(--kolibri-root-font-size, 16)) calc(1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1rem / var(--kolibri-root-font-size, 16)) calc(-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(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}";
1512
1511
 
1513
1512
  var css_248z$3 = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n top: calc(16rem / var(--kolibri-root-font-size, 16));\n right: calc(16rem / var(--kolibri-root-font-size, 16));\n width: calc(440rem / var(--kolibri-root-font-size, 16));\n max-width: 100%;\n }\n .kol-toast-item {\n background-color: #fff;\n display: block;\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\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(24rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24rem / 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(8rem / 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(32rem / 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(32rem / 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(40rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item__alert {\n display: block;\n }\n .kol-toast-item .heading {\n width: 100%;\n }\n .kol-toast-item .heading .heading-content {\n flex: 1;\n }\n}";
1514
1513
 
1515
- var css_248z$2 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-link {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n appearance: none;\n }\n .kol-link--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-link--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-link__text:active, .kol-link__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-link--secondary .kol-link__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-link--secondary.button:focus-visible .kol-link__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-link:focus-visible .kol-link__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-toolbar {\n background-color: var(--color-white);\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-radius: 8px;\n padding: var(--spacing-s);\n }\n .kol-link {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link:hover {\n --text-background-color: #fc0;\n }\n}";
1514
+ var css_248z$2 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-link {\n --kolibri-spacing: calc(4rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-link--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: #fc0;\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:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link:focus {\n outline: none;\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-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16rem / var(--kolibri-root-font-size, 16))/calc(20rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-link__text:active, .kol-link__text:not(:disabled):hover {\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-link--secondary .kol-link__text {\n padding: calc(12rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16) - 2rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-link--secondary.button:focus-visible .kol-link__text {\n box-shadow: inset 0 0 0 calc(4rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-link:focus-visible .kol-link__text {\n outline: var(--text-focus-outline-color) solid calc(2rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-toolbar {\n background-color: var(--color-white);\n box-shadow: 0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4rem / var(--kolibri-root-font-size, 16)) calc(5rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-radius: 8px;\n padding: var(--spacing-s);\n }\n .kol-link {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link:hover {\n --text-background-color: #fc0;\n }\n}";
1516
1515
 
1517
1516
  var css_248z$1 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree__treeview-navigation {\n display: flex;\n flex-direction: column;\n }\n}";
1518
1517