@public-ui/theme-default 3.0.0-rc.6 → 3.0.0-rc.8

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 (5) hide show
  1. package/dist/index.cjs +30 -30
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.mjs +30 -30
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +18 -11
package/dist/index.mjs CHANGED
@@ -362,7 +362,7 @@ var loglevel = {exports: {}};
362
362
  }));
363
363
  }(loglevel));
364
364
 
365
- const R=(e,t)=>s=>s(e,t),H=(e,t)=>s=>s(e,t,{append:!1}),$=new Map,M=[],Y=new Map,a={A11yUi:{CSS_STYLE_CACHE:$,HYDRATED_HISTORY:M,STYLING_TASK_QUEUE:Y,Themes:{}}};const w=new Set,q=/--[^;]+/g,J=/:/,V=(e,t)=>{let s=t.match(q);if(Array.isArray(s)){s=s.filter(n=>J.test(n));const o=document.createElement("style");o.innerHTML=`.${e} {${s.join(";")}}`,document.querySelector("head")?.appendChild(o);}w.add(e);},f=(e,t)=>typeof a.A11yUi=="object"&&a.A11yUi!==null&&typeof a.A11yUi.Themes=="object"&&a.A11yUi.Themes!==null&&typeof a.A11yUi.Themes[e]=="object"&&a.A11yUi.Themes[e]!==null&&typeof a.A11yUi.Themes[e][t]=="string"?a.A11yUi.Themes[e][t].replace(/\r?\n/g,""):"",W=e=>{for(const t of Array.from(e.childNodes))if(t instanceof HTMLStyleElement&&t.tagName==="STYLE"&&t.dataset.themingFallback===void 0)e.removeChild(t);else break},X=(e,t)=>{try{if(a.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=[];t.forEach(o=>{const n=new CSSStyleSheet;n.replaceSync(o),s.push(n);}),e.adoptedStyleSheets=s;}catch{[...t].reverse().forEach((s,o)=>{if(typeof s!="string"||s.length===0)return;const n=document.createElement("style");switch(n.dataset.themingFallback="",o){case 4:n.dataset.themingBaseA11y="";break;case 3:n.dataset.themingBaseGlobal="";break;case 2:n.dataset.themingBaseComponent="";break;case 1:n.dataset.themingCustomGlobal="";break;case 0:n.dataset.themingCustomComponent="";break;default:n.dataset.themingUnknown="";break}n.innerHTML=s,e.insertBefore(n,e.firstChild);});}},Z=(e,t,s)=>{if(s!==!1){const o=[...Array.from(e.childNodes).filter(r=>r instanceof HTMLStyleElement&&r.tagName==="STYLE")];let n;try{n=[...Array.from(e.adoptedStyleSheets)];}catch{n=[];}s?.mode==="before"?(o.reverse().forEach(r=>t.unshift(r.innerHTML)),n.reverse().forEach(r=>t.unshift(Array.from(r.cssRules).map(i=>i.cssText).join("")))):s?.mode==="after"&&(o.forEach(r=>t.push(r.innerHTML)),n.forEach(r=>t.push(Array.from(r.cssRules).map(i=>i.cssText).join(""))));}},L=(e,t,s)=>{const o=t.name||"default";let n;try{if(e.shadowRoot===null)throw new Error("ShadowRoot is null");n=e.shadowRoot;}catch{n=e;}if(a.A11yUi.CSS_STYLE_CACHE.get(o)?.has(e.tagName))_(e,n,a.A11yUi.CSS_STYLE_CACHE.get(o)?.get(e.tagName),s);else {const r=f(o,"PROPERTIES"),i=f(o,"GLOBAL"),m=f(o,e.tagName);w.has(o)===!1&&V(o,i);const h=[r,i,m];Z(n,h,t.encroachCss),t.loglevel==="debug"&&console.log(e.tagName,h),t.cache===!0&&(a.A11yUi.CSS_STYLE_CACHE.has(o)===!1&&a.A11yUi.CSS_STYLE_CACHE.set(o,new Map),a.A11yUi.CSS_STYLE_CACHE.get(o)?.set(e.tagName,h)),_(e,n,h,s);}},_=(e,t,s,o)=>{W(t),X(t,s),e.style.display=o;},N=e=>{e.loglevel==="debug"&&a.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:a.A11yUi.STYLING_TASK_QUEUE.size});},se=e=>{a.A11yUi.STYLING_TASK_QUEUE.delete(e);},j=(e,t)=>{se(e),N(t);},oe=e=>{for(const t of e)if(a.A11yUi.STYLING_TASK_QUEUE.has(t.target)&&t.target.classList.contains("hydrated")){const{styleDisplay:s,themeDetails:o}=a.A11yUi.STYLING_TASK_QUEUE.get(t.target);L(t.target,o,s),j(t.target,o);}};let d;try{d=new MutationObserver(oe);}catch{d=null;}class re{constructor(t,s,o){this.createTheme=(n,r)=>H(n,r),this.createTranslation=(n,r)=>R(n,r),this.Prefix=t,this.Key=Object.getOwnPropertyNames(s),this.Tag=Object.getOwnPropertyNames(o);}}
365
+ const j=(t,e)=>s=>s(t,e),H=(t,e)=>s=>s(t,e,{append:false}),M=new Map,Y=[],$=new Map,o={A11yUi:{CSS_STYLE_CACHE:M,HYDRATED_HISTORY:Y,STYLING_TASK_QUEUE:$,Themes:{}}};const C=new Set,F=/--[^;]+/g,V=/:/,q=(t,e)=>{let s=e.match(F);if(Array.isArray(s)){s=s.filter(r=>V.test(r));const a=document.createElement("style");a.innerHTML=`.${t} {${s.join(";")}}`,document.querySelector("head")?.appendChild(a);}C.add(t);},f=(t,e)=>typeof o.A11yUi=="object"&&o.A11yUi!==null&&typeof o.A11yUi.Themes=="object"&&o.A11yUi.Themes!==null&&typeof o.A11yUi.Themes[t]=="object"&&o.A11yUi.Themes[t]!==null&&typeof o.A11yUi.Themes[t][e]=="string"?o.A11yUi.Themes[t][e].replace(/\r?\n/g,""):"",J=t=>{for(const e of Array.from(t.childNodes))if(e instanceof HTMLStyleElement&&e.tagName==="STYLE"&&e.dataset.themingFallback===void 0)t.removeChild(e);else break},W=(t,e)=>{try{if(o.A11yUi.Theme?.mode==="ssr")throw new Error("SSR");const s=[];e.forEach(a=>{const r=new CSSStyleSheet;r.replaceSync(a),s.push(r);}),t.adoptedStyleSheets=s;}catch{[...e].reverse().forEach((a,r)=>{if(typeof a!="string"||a.length===0)return;const n=document.createElement("style");switch(n.dataset.themingFallback="",r){case 4:n.dataset.themingBaseA11y="";break;case 3:n.dataset.themingBaseGlobal="";break;case 2:n.dataset.themingBaseComponent="";break;case 1:n.dataset.themingCustomGlobal="";break;case 0:n.dataset.themingCustomComponent="";break;default:n.dataset.themingUnknown="";break}n.innerHTML=a,t.insertBefore(n,t.firstChild);});}},X=(t,e,s)=>{if(s!==false){const a=[...Array.from(t.childNodes).filter(n=>n instanceof HTMLStyleElement&&n.tagName==="STYLE")];let r;try{r=[...Array.from(t.adoptedStyleSheets)];}catch{r=[];}s?.mode==="before"?(a.reverse().forEach(n=>e.unshift(n.innerHTML)),r.reverse().forEach(n=>e.unshift(Array.from(n.cssRules).map(i=>i.cssText).join("")))):s?.mode==="after"&&(a.forEach(n=>e.push(n.innerHTML)),r.forEach(n=>e.push(Array.from(n.cssRules).map(i=>i.cssText).join(""))));}},w=(t,e,s)=>{const a=e.name||"default";let r;try{if(t.shadowRoot===null)throw new Error("ShadowRoot is null");r=t.shadowRoot;}catch{r=t;}if(o.A11yUi.CSS_STYLE_CACHE.get(a)?.has(t.tagName))L(t,r,o.A11yUi.CSS_STYLE_CACHE.get(a)?.get(t.tagName),s);else {const n=f(a,"PROPERTIES"),i=f(a,"GLOBAL"),c=f(a,t.tagName);C.has(a)===false&&q(a,i);const m=[n,i,c];X(r,m,e.encroachCss),e.loglevel==="debug"&&console.log(t.tagName,m),e.cache===true&&(o.A11yUi.CSS_STYLE_CACHE.has(a)===false&&o.A11yUi.CSS_STYLE_CACHE.set(a,new Map),o.A11yUi.CSS_STYLE_CACHE.get(a)?.set(t.tagName,m)),L(t,r,m,s);}},L=(t,e,s,a)=>{J(e),W(e,s),t.style.visibility=a;},v=t=>{t.loglevel==="debug"&&o.A11yUi.HYDRATED_HISTORY.push({timestamp:Date.now(),numberOfTasks:o.A11yUi.STYLING_TASK_QUEUE.size});},te=t=>{o.A11yUi.STYLING_TASK_QUEUE.delete(t);},_=(t,e)=>{te(t),v(e);},se=t=>{for(const e of t)if(o.A11yUi.STYLING_TASK_QUEUE.has(e.target)&&e.target.classList.contains("hydrated")){const{styleVisibility:s,themeDetails:a}=o.A11yUi.STYLING_TASK_QUEUE.get(e.target);w(e.target,a,s),_(e.target,a);}};let d;try{d=new MutationObserver(se);}catch{d=null;}class ne{Prefix;Key;Tag;createTheme=(e,s)=>H(e,s);createTranslation=(e,s)=>j(e,s);constructor(e,s,a){this.Prefix=e,this.Key=Object.getOwnPropertyNames(s),this.Tag=Object.getOwnPropertyNames(a);}}
366
366
 
367
367
  /*!
368
368
  * KoliBri - The accessible HTML-Standard
@@ -454,7 +454,7 @@ var TagEnum;
454
454
  TagEnum[TagEnum["tree-item"] = 52] = "tree-item";
455
455
  })(TagEnum || (TagEnum = {}));
456
456
 
457
- const KoliBri = new re('kol', KeyEnum, TagEnum);
457
+ const KoliBri = new ne('kol', KeyEnum, TagEnum);
458
458
 
459
459
  var Bundesministerium;
460
460
  (function (Bundesministerium) {
@@ -623,11 +623,11 @@ BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Arzneimittel und Mediz
623
623
  BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Bevölkerungsforschung'], ['Bundesinstitut', 'für Bevölkerungsforschung']);
624
624
  BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Sportwissenschaft'], ['Bundesinstitut', 'für Sportwissenschaft']);
625
625
 
626
- var css_248z$H = "@layer kol-theme-global {\n :host {\n --border-radius: var(--kolibri-border-radius, 5px);\n --font-family: var(--kolibri-font-family, Verdana, Arial, Calibri, Helvetica, sans-serif);\n --font-size: var(--kolibri-font-size, calc(16rem / var(--kolibri-root-font-size, 16)));\n --spacing: var(--kolibri-spacing, calc(4rem / var(--kolibri-root-font-size, 16)));\n --border-width: var(--kolibri-border-width, 1px);\n --color-primary: var(--kolibri-color-primary, #004b76);\n --color-primary-variant: var(--kolibri-color-primary-variant, #0077b6);\n --color-danger: var(--kolibri-color-danger, #b4003c);\n --color-warning: var(--kolibri-color-warning, #c44931);\n --color-success: var(--kolibri-color-success, #005c45);\n --color-subtle: var(--kolibri-color-subtle, #576164);\n --color-light: var(--kolibri-color-light, #ffffff);\n --color-text: var(--kolibri-color-text, #202020);\n --color-mute: var(--kolibri-color-mute, #f2f3f4);\n --color-mute-variant: var(--kolibri-color-mute-variant, #bec5c9);\n }\n * {\n box-sizing: border-box;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n *[tabindex]:focus,\n .kol-input:not(.checkbox, .radio) .input:focus-within,\n .kol-input:is(.checkbox, .radio) input:focus,\n summary:focus {\n cursor: pointer;\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n }\n .kol-headline {\n font-weight: 700;\n }\n .kol-tooltip__floating {\n border: var(--border-width) solid var(--color-subtle);\n border-radius: var(--border-radius);\n }\n .kol-tooltip__arrow {\n background-color: var(--color-light);\n border: var(--border-width) solid var(--color-subtle);\n }\n .kol-tooltip__content {\n background-color: var(--color-light);\n border-radius: var(--border-radius);\n line-height: 1.5;\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-span,\n .kol-span__container {\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n}";
626
+ var css_248z$H = "@layer kol-theme-global {\n :host {\n --border-radius: var(--kolibri-border-radius, 5px);\n --font-family: var(--kolibri-font-family, Verdana, Arial, Calibri, Helvetica, sans-serif);\n --font-size: var(--kolibri-font-size, calc(16rem / var(--kolibri-root-font-size, 16)));\n --spacing: var(--kolibri-spacing, calc(4rem / var(--kolibri-root-font-size, 16)));\n --border-width: var(--kolibri-border-width, 1px);\n --color-primary: var(--kolibri-color-primary, #004b76);\n --color-primary-variant: var(--kolibri-color-primary-variant, #0077b6);\n --color-danger: var(--kolibri-color-danger, #b4003c);\n --color-warning: var(--kolibri-color-warning, #c44931);\n --color-success: var(--kolibri-color-success, #005c45);\n --color-subtle: var(--kolibri-color-subtle, #576164);\n --color-light: var(--kolibri-color-light, #ffffff);\n --color-text: var(--kolibri-color-text, #202020);\n --color-mute: var(--kolibri-color-mute, #f2f3f4);\n --color-mute-variant: var(--kolibri-color-mute-variant, #bec5c9);\n }\n * {\n box-sizing: border-box;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n }\n *[tabindex]:focus,\n .kol-input:not(.checkbox, .radio) .input:focus-within,\n .kol-input:is(.checkbox, .radio) input:focus,\n summary:focus {\n cursor: pointer;\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n }\n .kol-headline {\n font-weight: 700;\n }\n .kol-tooltip__floating {\n border: var(--border-width) solid var(--color-subtle);\n border-radius: var(--border-radius);\n }\n .kol-tooltip__arrow {\n background-color: var(--color-light);\n border: var(--border-width) solid var(--color-subtle);\n }\n .kol-tooltip__content {\n background-color: var(--color-light);\n border-radius: var(--border-radius);\n line-height: 1.5;\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-span,\n .kol-span__container {\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n @keyframes spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n}";
627
627
 
628
628
  var css_248z$G = "@layer kol-theme-component {\n :host {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n font-family: var(--font-family);\n }\n .kol-accordion {\n width: 100%;\n height: 100%;\n display: grid;\n }\n .kol-accordion__content {\n margin: 0;\n padding-left: 2.25em;\n padding-bottom: calc(12rem / var(--kolibri-root-font-size, 16));\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-accordion__heading {\n margin: 0;\n }\n .kol-accordion__heading-button {\n display: flex;\n border-radius: var(--border-radius);\n min-height: calc(35.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-accordion__heading-button:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n cursor: pointer;\n }\n .kol-accordion__heading-button:focus-within .kol-button {\n outline: 0;\n }\n .kol-accordion__heading-button .kol-span__container {\n display: flex;\n place-items: baseline center;\n text-align: left;\n gap: 0.5em;\n font-weight: 700;\n font-size: calc(18rem / var(--kolibri-root-font-size, 16));\n line-height: 1.1;\n }\n .kol-accordion__heading-button .kol-button {\n padding: calc(12rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-accordion__heading-button .kol-button :focus {\n outline: none;\n }\n .kol-accordion__heading-button .kol-icon {\n color: var(--color-primary);\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
629
629
 
630
- var css_248z$F = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
630
+ var css_248z$F = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
631
631
 
632
632
  var css_248z$E = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n}";
633
633
 
@@ -635,79 +635,79 @@ var css_248z$D = "@layer kol-theme-component {\n .kol-badge {\n font-family:
635
635
 
636
636
  var css_248z$C = "@layer kol-theme-component {\n .kol-breadcrumb {\n font-family: var(--font-family);\n }\n .kol-breadcrumb__list-element-span {\n color: var(--color-subtle);\n }\n .kol-breadcrumb__link::part(icon) {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-breadcrumb__icon {\n font-size: calc(12rem / var(--kolibri-root-font-size, 16));\n color: var(--color-subtle);\n }\n}";
637
637
 
638
- var css_248z$B = "@layer kol-theme-component {\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-button .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n}";
638
+ var css_248z$B = "@layer kol-theme-component {\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n}";
639
639
 
640
- var css_248z$A = "@layer kol-theme-component {\n .kol-button {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button:visited {\n color: var(--visited);\n }\n .kol-button:focus .kol-button__text {\n border-radius: var(--border-radius);\n outline: var(--border-width) solid;\n }\n .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .kol-button {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\n font-size: inherit;\n }\n .kol-button:focus {\n outline: none;\n --text-border-radius: var(--border-radius);\n --text-outline: calc(var(--border-width) * 2) solid;\n }\n .kol-button:visited {\n color: var(--visited);\n }\n .kol-button:focus .kol-button__text {\n border-radius: var(--text-border-radius);\n outline: var(--text-outline);\n }\n .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n}";
640
+ var css_248z$A = "@layer kol-theme-component {\n .kol-button {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button:visited {\n color: var(--visited);\n }\n .kol-button:focus .kol-button__text {\n border-radius: var(--border-radius);\n outline: var(--border-width) solid;\n }\n .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n .kol-button {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\n font-size: inherit;\n }\n .kol-button:focus {\n outline: none;\n --text-border-radius: var(--border-radius);\n --text-outline: calc(var(--border-width) * 2) solid;\n }\n .kol-button:visited {\n color: var(--visited);\n }\n .kol-button:focus .kol-button__text {\n border-radius: var(--text-border-radius);\n outline: var(--text-outline);\n }\n .kol-button:is(:focus, :hover):not([aria-disabled], [disabled]) .kol-button__text .kol-span__label {\n text-decoration-thickness: 0.25em;\n }\n}";
641
641
 
642
642
  var css_248z$z = "@layer kol-theme-component {\n .kol-card {\n font-family: var(--font-family);\n display: grid;\n width: 100%;\n height: 100%;\n background-color: var(--color-light);\n grid-template-rows: min-content 2fr min-content;\n box-shadow: 0 0 4px color-mix(in srgb, black 80%, var(--color-subtle));\n border-radius: var(--border-radius);\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 }\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 overflow: hidden;\n }\n .kol-card__headline {\n line-height: 1.75;\n }\n}";
643
643
 
644
- var css_248z$y = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n align-items: center;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option:focus {\n background-color: var(--color-primary-variant);\n color: var(--color-light);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-style: solid;\n border-width: 1px;\n border-radius: var(--border-radius);\n border-color: var(--color-subtle);\n overflow-y: auto;\n overflow-x: hidden;\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n place-items: center;\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n :host {\n font-family: var(--font-family);\n }\n .kol-combobox__group {\n display: inline-flex;\n align-items: center;\n width: 100%;\n }\n .kol-combobox__input {\n flex-grow: 1;\n border: none;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n .kol-combobox__input::placeholder {\n color: var(--color-subtle);\n }\n}";
644
+ var css_248z$y = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n align-items: center;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option:focus {\n background-color: var(--color-primary-variant);\n color: var(--color-light);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-style: solid;\n border-width: 1px;\n border-radius: var(--border-radius);\n border-color: var(--color-subtle);\n overflow-y: auto;\n overflow-x: hidden;\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n place-items: center;\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n :host {\n font-family: var(--font-family);\n }\n .kol-combobox__group {\n display: inline-flex;\n align-items: center;\n width: 100%;\n }\n .kol-combobox__input {\n flex-grow: 1;\n border: none;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n .kol-combobox__input::placeholder {\n color: var(--color-subtle);\n }\n}";
645
645
 
646
646
  var css_248z$x = "@layer kol-theme-component {\n .kol-details {\n font-family: var(--font-family);\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n height: 100%;\n display: grid;\n }\n .kol-details__content.indented-text {\n font-family: var(--font-family);\n border-left: 2px solid var(--color-primary-variant);\n padding: 0 calc(18rem / var(--kolibri-root-font-size, 16)) 0 calc(8rem / var(--kolibri-root-font-size, 16));\n margin-left: calc(-2rem / var(--kolibri-root-font-size, 16));\n width: 100%;\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 text-align: left;\n gap: 0;\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 border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n cursor: pointer;\n }\n}";
647
647
 
648
648
  var css_248z$w = "@layer kol-theme-component {\n .kol-drawer__wrapper {\n box-shadow: 0 0 4px var(--color-subtle);\n }\n .kol-drawer__wrapper--left {\n animation: slideInLeft 0.4s forwards;\n }\n .kol-drawer__wrapper--left.kol-drawer__wrapper--is-closing {\n animation: slideOutLeft 0.4s forwards;\n }\n .kol-drawer__wrapper--right {\n animation: slideInRight 0.4s forwards;\n }\n .kol-drawer__wrapper--right.kol-drawer__wrapper--is-closing {\n animation: slideOutRight 0.4s forwards;\n }\n .kol-drawer__wrapper--top {\n animation: slideInTop 0.4s forwards;\n }\n .kol-drawer__wrapper--top.kol-drawer__wrapper--is-closing {\n animation: slideOutTop 0.4s forwards;\n }\n .kol-drawer__wrapper--bottom {\n animation: slideInBottom 0.4s forwards;\n }\n .kol-drawer__wrapper--bottom.kol-drawer__wrapper--is-closing {\n animation: slideOutBottom 0.4s forwards;\n }\n}\n@keyframes slideInLeft {\n from {\n transform: translateX(-100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@keyframes slideInRight {\n from {\n transform: translateX(100%);\n }\n to {\n transform: translateX(0);\n }\n}\n@keyframes slideInTop {\n from {\n transform: translateY(-100%);\n }\n to {\n transform: translateY(0);\n }\n}\n@keyframes slideInBottom {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n@keyframes slideOutLeft {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(-100%);\n }\n}\n@keyframes slideOutRight {\n from {\n transform: translateX(0);\n }\n to {\n transform: translateX(100%);\n }\n}\n@keyframes slideOutTop {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(-100%);\n }\n}\n@keyframes slideOutBottom {\n from {\n transform: translateY(0);\n }\n to {\n transform: translateY(100%);\n }\n}";
649
649
 
650
- var css_248z$v = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\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 border-radius: var(--border-radius);\n outline: var(--border-width) solid;\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-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form {\n font-family: var(--font-family);\n }\n .kol-form__link {\n display: inline-block;\n }\n .kol-form__mandatory-fields-hint {\n font-family: var(--font-family);\n border-left: 2px solid var(--color-primary-variant);\n padding: 0 calc(18rem / var(--kolibri-root-font-size, 16)) 0 calc(8rem / var(--kolibri-root-font-size, 16));\n margin-left: calc(-2rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n}";
650
+ var css_248z$v = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\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 border-radius: var(--border-radius);\n outline: var(--border-width) solid;\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-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form {\n font-family: var(--font-family);\n }\n .kol-form__link {\n display: inline-block;\n }\n .kol-form__mandatory-fields-hint {\n font-family: var(--font-family);\n border-left: 2px solid var(--color-primary-variant);\n padding: 0 calc(18rem / var(--kolibri-root-font-size, 16)) 0 calc(8rem / var(--kolibri-root-font-size, 16));\n margin-left: calc(-2rem / var(--kolibri-root-font-size, 16));\n width: 100%;\n }\n}";
651
651
 
652
652
  var css_248z$u = "@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 font-family: var(--font-family);\n }\n .kol-headline--h1, .kol-headline--h2, .kol-headline--h3 {\n font-weight: 700;\n }\n}";
653
653
 
654
- var css_248z$t = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-form-field--disabled .kol-form-field__input {\n outline: none;\n cursor: not-allowed;\n }\n .kol-form-field--disabled .kol-form-field__label {\n cursor: not-allowed;\n }\n .kol-field-control {\n column-gap: calc(8rem / var(--kolibri-root-font-size, 16));\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 {\n gap: 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 cursor: pointer;\n order: 1;\n width: 100%;\n border-color: var(--color-subtle);\n border-width: 2px;\n border-style: solid;\n border-radius: var(--border-radius);\n appearance: none;\n background-color: white;\n transition: 0.5s;\n margin: 0;\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:disabled {\n cursor: not-allowed;\n }\n .kol-checkbox .kol-input:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-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:hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\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 height: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n min-width: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n width: 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 width: 1.25em;\n height: 1.25em;\n left: calc(2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox--variant-switch .kol-input {\n background-color: var(--color-subtle);\n border-radius: 1.25em;\n border-width: 0;\n display: block;\n height: 1.5em;\n min-width: 3.5em;\n position: relative;\n width: 3.5em;\n /* Visible with forced colors */\n outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox--variant-switch .kol-input:focus {\n outline-color: var(--color-primary);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 2px;\n }\n .kol-checkbox--variant-switch .kol-input:before {\n width: 1.25em;\n height: 1.25em;\n left: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n top: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n border-radius: 1.25em;\n background-color: white;\n position: absolute;\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 {\n gap: unset;\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 border-color: var(--color-primary);\n background-color: var(--color-light);\n color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__input {\n height: 100%;\n border-width: 1px 0 1px 1px;\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__label {\n border-width: 1px 1px 1px 0;\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n justify-self: stretch;\n align-self: stretch;\n display: flex;\n padding-right: calc(16rem / var(--kolibri-root-font-size, 16));\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 border-color: var(--color-primary);\n background-color: var(--color-mute);\n 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 border-color: var(--color-primary);\n background-color: var(--color-primary);\n color: var(--color-light);\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 background-color: var(--color-primary-variant);\n border-color: var(--color-primary-variant);\n color: var(--color-light);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\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 border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__input {\n border-width: 1px 1px 1px 0;\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__label {\n border-width: 1px 0 1px 1px;\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\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-width: 1px;\n border-style: solid;\n border-radius: var(--border-radius);\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 cursor: not-allowed;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--disabled .kol-field-control__label {\n cursor: not-allowed;\n }\n}";
654
+ var css_248z$t = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-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 order: 1;\n width: 100%;\n border-color: var(--color-subtle);\n border-width: 2px;\n border-style: solid;\n border-radius: var(--border-radius);\n appearance: none;\n background-color: white;\n transition: 0.5s;\n margin: 0;\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 border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-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 border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\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 height: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n min-width: calc(6 * 4rem / var(--kolibri-root-font-size, 16));\n width: 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 width: 1.25em;\n height: 1.25em;\n left: calc(2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox--variant-switch .kol-input {\n background-color: var(--color-subtle);\n border-radius: 1.25em;\n border-width: 0;\n display: block;\n height: 1.5em;\n min-width: 3.5em;\n position: relative;\n width: 3.5em;\n /* Visible with forced colors */\n outline: transparent solid calc(1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-checkbox--variant-switch .kol-input:focus {\n outline-color: var(--color-primary);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 2px;\n }\n .kol-checkbox--variant-switch .kol-input:before {\n width: 1.25em;\n height: 1.25em;\n left: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n top: calc(0.25em - 2rem / var(--kolibri-root-font-size, 16));\n border-radius: 1.25em;\n background-color: white;\n position: absolute;\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 border-color: var(--color-primary);\n background-color: var(--color-light);\n color: var(--color-primary);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__input {\n height: 100%;\n border-width: 1px 0 1px 1px;\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n }\n .kol-input-checkbox__field-control--variant-button .kol-field-control__label {\n border-width: 1px 1px 1px 0;\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n justify-self: stretch;\n align-self: stretch;\n display: flex;\n padding-right: calc(16rem / var(--kolibri-root-font-size, 16));\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 border-color: var(--color-primary);\n background-color: var(--color-mute);\n 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 border-color: var(--color-primary);\n background-color: var(--color-primary);\n color: var(--color-light);\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 background-color: var(--color-primary-variant);\n border-color: var(--color-primary-variant);\n color: var(--color-light);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\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 border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__input {\n border-width: 1px 1px 1px 0;\n border-style: solid solid solid none;\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n }\n .kol-input-checkbox__field-control--variant-button.kol-field-control--label-align-left .kol-field-control__label {\n border-width: 1px 0 1px 1px;\n border-style: solid none solid solid;\n border-radius: var(--border-radius) 0 0 var(--border-radius);\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-width: 1px;\n border-style: solid;\n border-radius: var(--border-radius);\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}";
655
655
 
656
- var css_248z$s = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}";
656
+ var css_248z$s = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n.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 border: 1px solid var(--color-subtle);\n min-height: calc(var(--a11y-min-size) - 8rem / var(--kolibri-root-font-size, 16));\n}";
657
657
 
658
- var css_248z$r = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}";
658
+ var css_248z$r = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
659
659
 
660
- var css_248z$q = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}";
660
+ var css_248z$q = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
661
661
 
662
- var css_248z$p = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}\n@layer kol-theme-component {\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-button .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n .kol-input-container {\n gap: initial;\n }\n .kol-input-container__filename {\n color: var(--color-subtle);\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-primary) !important;\n }\n .kol-button__text {\n border-radius: 0 !important;\n white-space: nowrap;\n }\n .kol-input {\n padding-top: calc(0.5em + 2rem / var(--kolibri-root-font-size, 16));\n background-color: transparent;\n }\n}";
662
+ var css_248z$p = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n@layer kol-theme-component {\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-input-container {\n gap: initial;\n }\n .kol-input-container__filename {\n color: var(--color-subtle);\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-primary);\n }\n .kol-button__text {\n border-top-right-radius: calc(var(--border-radius) - 2px);\n border-bottom-right-radius: calc(var(--border-radius) - 2px);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n white-space: nowrap;\n }\n .kol-input {\n padding-top: calc(0.5em + 2rem / var(--kolibri-root-font-size, 16));\n background-color: transparent;\n }\n}";
663
663
 
664
- var css_248z$o = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}";
664
+ var css_248z$o = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
665
665
 
666
- var css_248z$n = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}";
666
+ var css_248z$n = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
667
667
 
668
- var css_248z$m = "@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-field-control {\n column-gap: calc(8rem / var(--kolibri-root-font-size, 16));\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 border: 0;\n display: grid;\n font-family: var(--font-family);\n margin: 0;\n padding: 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__wrapper {\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control__label {\n padding-top: 0.1em;\n }\n .kol-input-radio {\n cursor: pointer;\n width: 100%;\n border-color: var(--color-subtle);\n border-width: 2px;\n border-style: solid;\n border-radius: 50%;\n line-height: 1.5;\n }\n .kol-input-radio:hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n }\n .kol-input-radio:focus {\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-radio:focus:hover {\n box-shadow: none;\n }\n .kol-input-radio:checked:before {\n background-color: var(--color-primary);\n }\n .kol-input-radio:disabled {\n cursor: not-allowed;\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--error {\n margin-left: -0.25em;\n }\n}";
668
+ var css_248z$m = "@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-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 border: 0;\n display: grid;\n font-family: var(--font-family);\n margin: 0;\n padding: 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 padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-radio {\n width: 100%;\n border-color: var(--color-subtle);\n border-width: 2px;\n border-style: solid;\n border-radius: 50%;\n line-height: 1.5;\n }\n .kol-input-radio:not(:disabled):hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n }\n .kol-input-radio:focus {\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-radio:focus:hover {\n box-shadow: none;\n }\n .kol-input-radio:checked:before {\n background-color: var(--color-primary);\n }\n .kol-input-radio: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--error {\n margin-left: -0.25em;\n }\n}";
669
669
 
670
- var css_248z$l = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input-range__inputs-wrapper {\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
670
+ var css_248z$l = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input-range__inputs-wrapper {\n gap: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
671
671
 
672
- var css_248z$k = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}";
672
+ var css_248z$k = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}";
673
673
 
674
674
  var css_248z$j = "@layer kol-theme-component {\n .kol-kolibri {\n font-family: var(--font-family);\n }\n}";
675
675
 
676
- var css_248z$i = "@layer kol-theme-component {\n .kol-link:focus {\n outline: none;\n }\n .kol-link--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-link--secondary, .kol-link--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-link--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-link--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-link--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-link__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-link__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-link--hide-label .kol-link__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-link:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-link:disabled:hover .kol-link__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-link .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n :host {\n font-family: var(--font-family);\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link__text {\n font-weight: 700;\n border-style: solid;\n border-radius: var(--a11y-min-size);\n outline-width: calc(var(--border-width) * 2);\n }\n .kol-link:focus .kol-link__text {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: calc(var(--border-width) * 2);\n transition: outline-offset 0.2s linear;\n }\n .kol-link:disabled:hover .kol-link__text {\n box-shadow: none;\n }\n .kol-link:focus:hover .kol-link__text {\n box-shadow: none;\n }\n}";
676
+ var css_248z$i = "@layer kol-theme-component {\n .kol-link {\n font-family: var(--font-family);\n }\n .kol-link__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-link--secondary, .kol-link--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-link--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-link--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-link--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-link__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-link__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-link--hide-label .kol-link__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-link:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-link:disabled:hover .kol-link__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n :host {\n font-family: var(--font-family);\n }\n}";
677
677
 
678
678
  var css_248z$h = "@layer kol-theme-component {\n .kol-modal__card {\n box-shadow: 0 0 4px var(--color-subtle);\n border-radius: var(--border-radius);\n }\n}";
679
679
 
680
680
  var css_248z$g = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-primary);\n font-style: normal;\n font-weight: 400;\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 border-radius: var(--border-radius);\n outline: var(--border-width) solid;\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 :host {\n font-family: inherit;\n }\n .kol-link {\n line-height: 1;\n }\n}";
681
681
 
682
- var css_248z$f = "@layer kol-theme-component {\n .kol-nav {\n font-family: var(--font-family);\n }\n .kol-nav__navigation {\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 font-weight: normal !important;\n border-left-color: transparent !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 align-items: center;\n color: var(--color-primary);\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n min-height: var(--a11y-min-size);\n text-decoration: none;\n }\n .kol-nav__entry .kol-link:focus-visible,\n .kol-nav__entry .kol-button:focus-visible {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-nav__list--vertical .kol-nav__entry .kol-link,\n .kol-nav__list--vertical .kol-nav__entry .kol-button {\n border-left: 2px solid transparent;\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\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 {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__expand-button .kol-button:hover {\n background-color: var(--color-primary);\n color: var(--color-light);\n }\n .kol-nav__expand-button .kol-button:focus-visible {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-nav__expand-button .kol-button__text {\n justify-content: center;\n }\n}";
682
+ var css_248z$f = "@layer kol-theme-component {\n .kol-nav {\n font-family: var(--font-family);\n }\n .kol-nav__navigation {\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 font-weight: normal !important;\n border-left-color: transparent !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 align-items: center;\n color: var(--color-primary);\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n min-height: var(--a11y-min-size);\n text-decoration: none;\n }\n .kol-nav__entry .kol-link:focus-visible,\n .kol-nav__entry .kol-button:focus-visible {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-nav__list--vertical .kol-nav__entry .kol-link,\n .kol-nav__list--vertical .kol-nav__entry .kol-button {\n border-left: 2px solid transparent;\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\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 {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__expand-button .kol-button:hover {\n background-color: var(--color-primary);\n color: var(--color-light);\n }\n .kol-nav__expand-button .kol-button:focus-visible {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-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 font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-nav__toggle-button .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\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 border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-nav__toggle-button .kol-button:disabled:hover .kol-nav__toggle-button .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n}";
683
683
 
684
684
  var css_248z$e = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-pagination__button--selected .kol-button {\n opacity: 1;\n }\n .kol-button__text {\n background-color: var(--color-light);\n border-radius: var(--border-radius);\n border: 1px solid var(--color-primary);\n color: var(--color-primary);\n font-weight: 700;\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-pagination__button--selected .kol-button__text {\n background-color: var(--color-primary);\n color: var(--color-light);\n border: 0;\n }\n .kol-button:focus .kol-button__text {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:is(:active, :hover):not(:disabled) .kol-button__text {\n background-color: var(--color-primary-variant);\n border-color: var(--color-primary-variant);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n color: var(--color-light);\n }\n .kol-button:active .kol-button__text {\n color: var(--color-light);\n outline: none;\n }\n}";
685
685
 
686
- var css_248z$d = "@layer kol-theme-component {\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-button .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-popover-button__popover {\n border: var(--border-width) solid var(--color-primary);\n padding: var(--spacing);\n }\n}";
686
+ var css_248z$d = "@layer kol-theme-component {\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-popover-button__popover {\n border: var(--border-width) solid var(--color-primary);\n padding: var(--spacing);\n }\n}";
687
687
 
688
688
  var css_248z$c = "@layer kol-theme-component {\n .kol-progress {\n font-family: var(--font-family);\n }\n .kol-progress__bar-progress {\n fill: var(--color-primary-variant);\n }\n .kol-progress__cycle-background {\n stroke: var(--color-mute-variant);\n }\n .kol-progress__cycle-progress {\n stroke: var(--color-primary-variant);\n }\n}";
689
689
 
690
- var css_248z$b = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-select {\n border: none;\n }\n .kol-select[multiple] {\n overflow: auto;\n }\n .kol-select__option {\n margin: calc(1rem / var(--kolibri-root-font-size, 16)) 0;\n border-radius: var(--border-radius);\n cursor: pointer;\n }\n .kol-select__option:disabled {\n cursor: not-allowed;\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 background-color: var(--color-primary-variant);\n color: var(--color-light);\n }\n .kol-select:not([multiple]) .kol-select__option {\n padding: 0.5em;\n }\n}";
690
+ var css_248z$b = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-select {\n border: none;\n }\n .kol-select[multiple] {\n overflow: auto;\n }\n .kol-select__option {\n margin: calc(1rem / var(--kolibri-root-font-size, 16)) 0;\n border-radius: var(--border-radius);\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 background-color: var(--color-primary-variant);\n color: var(--color-light);\n }\n .kol-select:not([multiple]) .kol-select__option {\n padding: 0.5em;\n }\n}";
691
691
 
692
- var css_248z$a = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n align-items: center;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option:focus {\n background-color: var(--color-primary-variant);\n color: var(--color-light);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-style: solid;\n border-width: 1px;\n border-radius: var(--border-radius);\n border-color: var(--color-subtle);\n overflow-y: auto;\n overflow-x: hidden;\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n place-items: center;\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n :host {\n font-family: var(--font-family);\n }\n .kol-single-select__group {\n display: inline-flex;\n align-items: center;\n width: 100%;\n }\n .kol-single-select__input {\n flex-grow: 1;\n border: none;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n .kol-single-select__input::placeholder {\n color: var(--color-subtle);\n }\n}";
692
+ var css_248z$a = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n align-items: center;\n min-height: calc(40rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n padding: calc(10rem / var(--kolibri-root-font-size, 16)) calc(12rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option:focus {\n background-color: var(--color-primary-variant);\n color: var(--color-light);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-style: solid;\n border-width: 1px;\n border-radius: var(--border-radius);\n border-color: var(--color-subtle);\n overflow-y: auto;\n overflow-x: hidden;\n max-height: calc(40rem / var(--kolibri-root-font-size, 16) * 5 + 2rem / var(--kolibri-root-font-size, 16));\n left: calc(-8rem / var(--kolibri-root-font-size, 16));\n right: calc(-8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n place-items: center;\n padding-left: calc(8rem / var(--kolibri-root-font-size, 16));\n padding-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n :host {\n font-family: var(--font-family);\n }\n .kol-single-select__group {\n display: inline-flex;\n align-items: center;\n width: 100%;\n }\n .kol-single-select__input {\n flex-grow: 1;\n border: none;\n width: calc(100% - 40rem / var(--kolibri-root-font-size, 16));\n position: relative;\n }\n .kol-single-select__input::placeholder {\n color: var(--color-subtle);\n }\n}";
693
693
 
694
694
  var css_248z$9 = "@layer kol-theme-component {\n .kol-skip-nav {\n font-family: var(--font-family);\n }\n .kol-skip-nav .kol-link__text {\n border-radius: var(--a11y-min-size);\n border-style: solid;\n border-width: var(--border-width);\n gap: calc(var(--spacing) * 2);\n line-height: 1;\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n background-color: var(--color-primary-variant);\n border-color: var(--color-primary-variant);\n color: var(--color-light);\n cursor: pointer;\n }\n}";
695
695
 
696
- var css_248z$8 = "@layer kol-theme-component {\n .kol-split-button {\n font-family: var(--font-family);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: var(--border-width);\n border-color: var(--color-primary);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n .kol-split-button__button .kol-button .kol-span {\n border-top-left-radius: var(--border-radius);\n border-bottom-left-radius: var(--border-radius);\n }\n .kol-split-button__horizontal-line {\n background-color: var(--color-primary);\n border-radius: 2px;\n width: calc(1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-split-button__secondary-button {\n height: 100%;\n }\n .kol-split-button__secondary-button .kol-span {\n border-top-right-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius);\n }\n .kol-split-button .kol-span {\n font-weight: 700;\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-split-button .kol-popover__content {\n background-color: #fff;\n }\n .kol-split-button .kol-button:focus {\n outline: none;\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-split-button .kol-button--secondary, .kol-split-button .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-split-button .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-split-button .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-split-button .kol-button--primary:not([disabled]):hover, .kol-split-button .kol-button--secondary:not([disabled]):hover, .kol-split-button .kol-button--normal:not([disabled]):hover, .kol-split-button .kol-button--danger:not([disabled]):hover, .kol-split-button .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-split-button .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-split-button .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-split-button .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-split-button .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-split-button .kol-button:disabled:hover .kol-split-button .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-split-button .kol-button .badge-text-hint {\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n color: var(--color-text);\n padding: 0 0.3em;\n }\n}";
696
+ var css_248z$8 = "@layer kol-theme-component {\n .kol-split-button {\n font-family: var(--font-family);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: var(--border-width);\n border-color: var(--color-primary);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n }\n .kol-split-button__button .kol-button .kol-span {\n border-top-left-radius: var(--border-radius);\n border-bottom-left-radius: var(--border-radius);\n }\n .kol-split-button__horizontal-line {\n background-color: var(--color-primary);\n border-radius: 2px;\n width: calc(1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-split-button__secondary-button {\n height: 100%;\n }\n .kol-split-button__secondary-button .kol-span {\n border-top-right-radius: var(--border-radius);\n border-bottom-right-radius: var(--border-radius);\n }\n .kol-split-button .kol-span {\n font-weight: 700;\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-split-button .kol-popover__content {\n background-color: #fff;\n }\n .kol-split-button .kol-button {\n font-family: var(--font-family);\n }\n .kol-split-button .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-split-button .kol-button:focus {\n outline: none;\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-split-button .kol-button--secondary, .kol-split-button .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-split-button .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-split-button .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-split-button .kol-button--primary:not([disabled]):hover, .kol-split-button .kol-button--secondary:not([disabled]):hover, .kol-split-button .kol-button--normal:not([disabled]):hover, .kol-split-button .kol-button--danger:not([disabled]):hover, .kol-split-button .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-split-button .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-split-button .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-split-button .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-split-button .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-split-button .kol-button:disabled:hover .kol-split-button .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-split-button__button .kol-button__text {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .kol-split-button__secondary-button .kol-button__text {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n .kol-split-button .kol-button {\n height: 100%;\n }\n .kol-split-button .kol-button__text {\n height: 100%;\n border: none;\n }\n}";
697
697
 
698
- var css_248z$7 = "@layer kol-theme-component {\n .kol-table {\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n overflow-x: auto;\n overflow-y: hidden;\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__table, .kol-table__caption {\n border-width: 0;\n border-bottom-width: calc(var(--border-width) * 2);\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__table {\n width: 100%;\n border-spacing: 0;\n }\n .kol-table__caption {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n }\n .kol-table__cell {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n font-weight: normal;\n color: var(--color-primary);\n background-color: var(--color-light);\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__selection {\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n grid-template-columns: 1fr auto;\n align-items: center;\n }\n .kol-table__spacer {\n display: table-row;\n height: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__spacer-line {\n border-width: 0;\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__spacer-line--foot {\n border-bottom-width: calc(var(--border-width) * 2);\n }\n .kol-table__spacer-line--head {\n border-top-width: calc(var(--border-width) * 2);\n }\n .kol-table__row--body:nth-child(even) {\n background-color: var(--color-mute);\n }\n .kol-table__selection-input:hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n }\n .kol-table__selection-input:focus {\n border-color: var(--color-primary);\n outline-color: var(--color-primary-variant);\n outline-style: solid;\n outline-offset: 2px;\n outline-width: 3px;\n }\n .kol-table__selection-input:focus:hover {\n box-shadow: none;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-subtle);\n border-radius: 5px;\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio {\n display: flex;\n border-color: var(--color-subtle);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-primary);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-icon {\n color: var(--color-light);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox, .kol-table__selection-input--checkbox:hover {\n border-color: var(--color-primary);\n }\n .kol-table-stateful__pagination {\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n }\n @media (min-width: 1024px) {\n .kol-table-stateful .kol-pagination {\n display: flex;\n align-items: center;\n }\n }\n}";
698
+ var css_248z$7 = "@layer kol-theme-component {\n .kol-table-settings {\n right: calc(8rem / var(--kolibri-root-font-size, 16));\n top: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__content {\n padding: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__content .kol-button {\n font-family: var(--font-family);\n }\n .kol-table-settings__content .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-table-settings__content .kol-button:focus {\n outline: none;\n }\n .kol-table-settings__content .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-table-settings__content .kol-button--secondary, .kol-table-settings__content .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-table-settings__content .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-table-settings__content .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-table-settings__content .kol-button--primary:not([disabled]):hover, .kol-table-settings__content .kol-button--secondary:not([disabled]):hover, .kol-table-settings__content .kol-button--normal:not([disabled]):hover, .kol-table-settings__content .kol-button--danger:not([disabled]):hover, .kol-table-settings__content .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-table-settings__content .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-table-settings__content .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-table-settings__content .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-table-settings__content .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-table-settings__content .kol-button:disabled:hover .kol-table-settings__content .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-table-settings__error-message {\n display: block;\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__columns {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__actions {\n border-top: var(--border-width) solid var(--color-mute-variant);\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n justify-content: flex-end;\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table {\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n overflow-x: auto;\n overflow-y: hidden;\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__table, .kol-table__caption {\n border-width: 0;\n border-bottom-width: calc(var(--border-width) * 2);\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__table {\n width: 100%;\n border-spacing: 0;\n }\n .kol-table__caption {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) var(--a11y-min-size) calc(8rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n min-height: calc(var(--a11y-min-size) + 2px);\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n }\n .kol-table__cell {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n font-weight: normal;\n color: var(--color-primary);\n background-color: var(--color-light);\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__selection {\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n grid-template-columns: 1fr auto;\n align-items: center;\n }\n .kol-table__spacer {\n display: table-row;\n height: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__spacer-line {\n border-width: 0;\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__spacer-line--foot {\n border-bottom-width: calc(var(--border-width) * 2);\n }\n .kol-table__spacer-line--head {\n border-top-width: calc(var(--border-width) * 2);\n }\n .kol-table__row--body:nth-child(even) {\n background-color: var(--color-mute);\n }\n .kol-table__selection-input:not(:disabled):hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n }\n .kol-table__selection-input:focus {\n border-color: var(--color-primary);\n outline-color: var(--color-primary-variant);\n outline-style: solid;\n outline-offset: 2px;\n outline-width: 3px;\n }\n .kol-table__selection-input:focus:hover {\n box-shadow: none;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-subtle);\n border-radius: 5px;\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio {\n display: flex;\n border-color: var(--color-subtle);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-primary);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-icon {\n color: var(--color-light);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-table-stateful__pagination {\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n }\n @media (min-width: 1024px) {\n .kol-table-stateful .kol-pagination {\n display: flex;\n align-items: center;\n }\n }\n}";
699
699
 
700
- var css_248z$6 = "@layer kol-theme-component {\n .kol-table {\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n overflow-x: auto;\n overflow-y: hidden;\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__table, .kol-table__caption {\n border-width: 0;\n border-bottom-width: calc(var(--border-width) * 2);\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__table {\n width: 100%;\n border-spacing: 0;\n }\n .kol-table__caption {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n }\n .kol-table__cell {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n font-weight: normal;\n color: var(--color-primary);\n background-color: var(--color-light);\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__selection {\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n grid-template-columns: 1fr auto;\n align-items: center;\n }\n .kol-table__spacer {\n display: table-row;\n height: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__spacer-line {\n border-width: 0;\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__spacer-line--foot {\n border-bottom-width: calc(var(--border-width) * 2);\n }\n .kol-table__spacer-line--head {\n border-top-width: calc(var(--border-width) * 2);\n }\n .kol-table__row--body:nth-child(even) {\n background-color: var(--color-mute);\n }\n .kol-table__selection-input:hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n }\n .kol-table__selection-input:focus {\n border-color: var(--color-primary);\n outline-color: var(--color-primary-variant);\n outline-style: solid;\n outline-offset: 2px;\n outline-width: 3px;\n }\n .kol-table__selection-input:focus:hover {\n box-shadow: none;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-subtle);\n border-radius: 5px;\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio {\n display: flex;\n border-color: var(--color-subtle);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-primary);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-icon {\n color: var(--color-light);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox, .kol-table__selection-input--checkbox:hover {\n border-color: var(--color-primary);\n }\n}";
700
+ var css_248z$6 = "@layer kol-theme-component {\n .kol-table-settings {\n right: calc(8rem / var(--kolibri-root-font-size, 16));\n top: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__content {\n padding: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__content .kol-button {\n font-family: var(--font-family);\n }\n .kol-table-settings__content .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-table-settings__content .kol-button:focus {\n outline: none;\n }\n .kol-table-settings__content .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-table-settings__content .kol-button--secondary, .kol-table-settings__content .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-table-settings__content .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-table-settings__content .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-table-settings__content .kol-button--primary:not([disabled]):hover, .kol-table-settings__content .kol-button--secondary:not([disabled]):hover, .kol-table-settings__content .kol-button--normal:not([disabled]):hover, .kol-table-settings__content .kol-button--danger:not([disabled]):hover, .kol-table-settings__content .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-table-settings__content .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-table-settings__content .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-table-settings__content .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-table-settings__content .kol-button--hide-label .kol-table-settings__content .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-table-settings__content .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-table-settings__content .kol-button:disabled:hover .kol-table-settings__content .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-table-settings__error-message {\n display: block;\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__columns {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table-settings__actions {\n border-top: var(--border-width) solid var(--color-mute-variant);\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n justify-content: flex-end;\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n padding-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table {\n font-family: var(--font-family);\n line-height: var(--line-height);\n word-break: break-word;\n overflow-x: auto;\n overflow-y: hidden;\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__table, .kol-table__caption {\n border-width: 0;\n border-bottom-width: calc(var(--border-width) * 2);\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__table {\n width: 100%;\n border-spacing: 0;\n }\n .kol-table__caption {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) var(--a11y-min-size) calc(8rem / var(--kolibri-root-font-size, 16)) calc(8rem / var(--kolibri-root-font-size, 16));\n min-height: calc(var(--a11y-min-size) + 2px);\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-primary-variant);\n outline-offset: 2px;\n outline-style: solid;\n outline-width: 3px;\n transition: outline-offset 0.2s linear;\n }\n .kol-table__cell {\n padding: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n font-weight: normal;\n color: var(--color-primary);\n background-color: var(--color-light);\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__selection {\n display: flex;\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n grid-template-columns: 1fr auto;\n align-items: center;\n }\n .kol-table__spacer {\n display: table-row;\n height: calc(24rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__spacer-line {\n border-width: 0;\n border-color: var(--color-primary-variant);\n border-style: solid;\n }\n .kol-table__spacer-line--foot {\n border-bottom-width: calc(var(--border-width) * 2);\n }\n .kol-table__spacer-line--head {\n border-top-width: calc(var(--border-width) * 2);\n }\n .kol-table__row--body:nth-child(even) {\n background-color: var(--color-mute);\n }\n .kol-table__selection-input:not(:disabled):hover {\n border-color: var(--color-primary);\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n }\n .kol-table__selection-input:focus {\n border-color: var(--color-primary);\n outline-color: var(--color-primary-variant);\n outline-style: solid;\n outline-offset: 2px;\n outline-width: 3px;\n }\n .kol-table__selection-input:focus:hover {\n box-shadow: none;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-subtle);\n border-radius: 5px;\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio {\n display: flex;\n border-color: var(--color-subtle);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-primary);\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-primary);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-primary);\n border-color: var(--color-primary);\n }\n .kol-table__selection-icon {\n color: var(--color-light);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-primary);\n }\n}";
701
701
 
702
702
  var css_248z$5 = "@layer kol-theme-component {\n .kol-tabs {\n font-family: var(--font-family);\n display: grid;\n grid-template-rows: var(--grid-template-rows);\n grid-template-columns: var(--grid-template-columns);\n }\n .kol-tabs--align-right {\n --display: grid;\n --grid-template-columns: 1fr auto;\n --button-group-display: grid;\n --button-group-order: 1;\n }\n .kol-tabs--align-left {\n --display: grid;\n --grid-template-columns: auto 1fr;\n --button-group-order: 0;\n }\n .kol-tabs--align-bottom {\n --display: flex;\n --grid-template-rows: 1fr auto;\n --button-group-gap: calc(32rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 1;\n }\n .kol-tabs--align-top {\n --display: flex;\n --grid-template-rows: auto 1fr;\n --button-group-gap: calc(32rem / var(--kolibri-root-font-size, 16));\n --button-group-order: 0;\n }\n .kol-tabs__button-group {\n display: var(--display);\n flex-wrap: wrap;\n gap: var(--button-group-gap);\n order: var(--button-group-order);\n }\n .kol-tabs .kol-button {\n box-sizing: border-box;\n background-color: transparent;\n border: 0;\n border-radius: var(--border-radius);\n border: none;\n font-style: normal;\n font-weight: 700;\n font-size: calc(18rem / var(--kolibri-root-font-size, 16));\n line-height: 1.2;\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n color: var(--color-subtle);\n padding: 0;\n }\n .kol-tabs .kol-button:hover {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button.primary, .kol-tabs .kol-button.selected {\n color: var(--color-primary);\n }\n .kol-tabs .kol-button:not(.kol-tabs .kol-button.selected) .kol-span__container {\n padding-bottom: 0.25em;\n }\n .kol-tabs .kol-button.selected .kol-span__container {\n border-bottom: 0.25em solid;\n }\n .kol-tabs .kol-button .kol-span__container {\n gap: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs .kol-icon {\n font-size: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__content {\n padding: 0.25em 0;\n }\n .kol-tabs__panel {\n height: 100%;\n }\n .kol-tabs .kol-button-wc {\n width: 100%;\n }\n}";
703
703
 
704
- var css_248z$4 = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n .kol-input:disabled {\n cursor: not-allowed;\n }\n}\n@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\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__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n border: none;\n display: block;\n overflow: auto;\n }\n .kol-textarea:disabled {\n cursor: not-allowed;\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
704
+ var css_248z$4 = "@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\n }\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__hint {\n font-size: calc(14.4rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) {\n border-left: 3px solid var(--color-danger);\n padding-left: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field--error:not(.kol-form-field--hide-msg) .kol-form-field__msg.kol-alert--error {\n color: var(--color-danger);\n font-weight: 700;\n }\n .kol-form-field--required .kol-form-field__label-text::after {\n padding-left: 0.125em;\n }\n .kol-form-field--required .kol-form-field__tooltip .span-label::after {\n padding-left: 0.125em;\n }\n .kol-form-field__msg {\n order: 1;\n }\n .kol-form-field__label {\n order: 2;\n }\n .kol-form-field__input {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-input-container {\n background-color: var(--color-light);\n border-color: var(--color-subtle);\n border-radius: var(--border-radius);\n border-style: solid;\n border-width: 2px;\n padding: 0 calc(8rem / var(--kolibri-root-font-size, 16));\n gap: calc(6rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment {\n min-width: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--start > .kol-icon {\n margin-left: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container__adornment--end > .kol-icon {\n margin-right: calc(8rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--disabled {\n background-color: var(--color-mute);\n border-color: var(--color-mute-variant);\n color: var(--color-text);\n cursor: not-allowed;\n }\n .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-primary);\n }\n .kol-input-container:focus-within {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-input-container--error:focus-within {\n outline-color: var(--color-danger);\n }\n}\n@layer kol-theme-component {\n .kol-input {\n background-color: transparent;\n border: none;\n }\n .kol-input::placeholder {\n color: var(--color-subtle);\n }\n}\n@layer kol-theme-component {\n :host {\n font-family: var(--font-family);\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__counter {\n order: 4;\n }\n .kol-form-field__hint {\n order: 5;\n }\n .kol-textarea {\n border: none;\n display: block;\n overflow: auto;\n }\n .kol-textarea::placeholder {\n color: var(--color-subtle);\n }\n}";
705
705
 
706
- var css_248z$3 = "@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n display: flex;\n width: 1em;\n height: 1em;\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n top: calc(16rem / var(--kolibri-root-font-size, 16));\n right: calc(16rem / var(--kolibri-root-font-size, 16));\n width: calc(440rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
706
+ var css_248z$3 = "@layer kol-theme-component {\n .kol-alert {\n font-family: var(--font-family);\n display: flex;\n width: 100%;\n overflow: unset;\n background-color: var(--color-light);\n }\n .kol-alert--msg {\n align-items: start;\n }\n .kol-alert--card {\n border-radius: var(--border-radius);\n border: var(--border-width) solid var(--alert-accent-color);\n filter: drop-shadow(0 calc(2rem / var(--kolibri-root-font-size, 16)) calc(4rem / var(--kolibri-root-font-size, 16)) rgba(8, 35, 48, 0.24));\n flex-direction: column;\n }\n .kol-alert--default {\n --alert-accent-color: var(--color-subtle);\n }\n .kol-alert--error {\n --alert-accent-color: var(--color-danger);\n }\n .kol-alert--info {\n --alert-accent-color: var(--color-primary);\n }\n .kol-alert--success {\n --alert-accent-color: var(--color-success);\n }\n .kol-alert--warning {\n --alert-accent-color: var(--color-warning);\n }\n .kol-alert__container {\n display: flex;\n gap: 0.5em;\n place-items: center;\n }\n .kol-alert--card .kol-alert__container {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(16rem / var(--kolibri-root-font-size, 16));\n background-color: var(--alert-accent-color);\n }\n .kol-alert__container-content {\n display: grid;\n gap: calc(4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__container-content {\n width: 100%;\n min-height: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__close-button {\n place-self: center;\n }\n .kol-alert__close-button .kol-button {\n border-radius: 50%;\n cursor: pointer;\n height: var(--a11y-min-size);\n width: var(--a11y-min-size);\n }\n .kol-alert--msg .kol-alert__close-button .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--card .kol-alert__close-button .kol-button {\n color: var(--color-light);\n }\n .kol-alert__close-button .kol-icon {\n font-size: calc(19.2rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading {\n color: var(--alert-accent-color);\n padding-top: calc(--var-spacing / 2);\n }\n .kol-alert--card .kol-alert__heading {\n width: 100%;\n color: var(--color-light);\n display: flex;\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n }\n .kol-alert__heading-icon {\n color: var(--color-light);\n padding: 0;\n }\n .kol-alert:not(.kol-alert--default) .kol-alert__heading-icon {\n font-size: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--msg .kol-alert__heading-icon {\n color: var(--alert-accent-color);\n place-items: baseline;\n }\n .kol-alert--card .kol-alert__heading-icon {\n justify-self: right;\n margin-top: calc(-4rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--card .kol-alert__content {\n padding: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n top: calc(16rem / var(--kolibri-root-font-size, 16));\n right: calc(16rem / var(--kolibri-root-font-size, 16));\n width: calc(440rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n margin-top: calc(16rem / var(--kolibri-root-font-size, 16));\n }\n}";
707
707
 
708
- var css_248z$2 = "@layer kol-theme-component {\n .kol-toolbar {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n background-color: var(--color-light);\n border-width: var(--border-width);\n border-style: solid;\n }\n}";
708
+ var css_248z$2 = "@layer kol-theme-component {\n .kol-button {\n font-family: var(--font-family);\n }\n .kol-button__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-button--secondary, .kol-button--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-button--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-button--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-button--primary:not([disabled]):hover, .kol-button--secondary:not([disabled]):hover, .kol-button--normal:not([disabled]):hover, .kol-button--danger:not([disabled]):hover, .kol-button--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-button--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-button__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-button--hide-label .kol-button__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-button:disabled:hover .kol-button__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-link {\n font-family: var(--font-family);\n }\n .kol-link__text {\n font-weight: 700;\n border-style: solid;\n border-width: var(--border-width);\n border-radius: var(--border-radius);\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link--primary {\n --text-background-color: var(--color-primary);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-light);\n }\n .kol-link--secondary, .kol-link--normal {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-link--danger {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n --text-color: var(--color-light);\n }\n .kol-link--ghost {\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-light);\n --text-color: var(--color-primary);\n --text-box-shadow: none;\n }\n .kol-link--primary:not([disabled]):hover, .kol-link--secondary:not([disabled]):hover, .kol-link--normal:not([disabled]):hover, .kol-link--danger:not([disabled]):hover, .kol-link--ghost:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n .kol-link--danger:not([disabled]):hover {\n --text-background-color: var(--color-danger);\n --text-border-color: var(--color-danger);\n }\n .kol-link__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n min-height: var(--a11y-min-size);\n min-width: var(--a11y-min-size);\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n text-align: center;\n transition-duration: 0.5s;\n transition-property: background-color, color, border-color;\n }\n .kol-link__text:hover {\n box-shadow: 0 2px 8px 2px rgba(8, 35, 48, 0.24);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n }\n .kol-link--hide-label .kol-link__text {\n padding: calc(12.8rem / var(--kolibri-root-font-size, 16));\n width: unset;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-link:focus {\n border-radius: var(--border-radius);\n outline-offset: 2px;\n outline: var(--color-primary-variant) solid calc(3rem / var(--kolibri-root-font-size, 16));\n transition: 200ms outline-offset linear;\n }\n .kol-link:disabled:hover .kol-link__text {\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n color: var(--text-color);\n box-shadow: none;\n }\n .kol-toolbar {\n padding: calc(8rem / var(--kolibri-root-font-size, 16)) calc(14rem / var(--kolibri-root-font-size, 16));\n border-radius: var(--border-radius);\n background-color: var(--color-light);\n border-width: var(--border-width);\n border-style: solid;\n }\n .kol-link {\n text-decoration: none;\n --text-background-color: var(--color-light);\n --text-border-color: var(--color-primary);\n --text-color: var(--color-primary);\n }\n .kol-link:not([disabled]):hover {\n --text-background-color: var(--color-primary-variant);\n --text-border-color: var(--color-primary-variant);\n --text-color: var(--color-light);\n }\n}";
709
709
 
710
- var css_248z$1 = "@layer kol-theme-component {\n .kol-tree-item__link {\n display: block;\n border: 1px solid transparent;\n }\n .kol-tree-item__link .kol-link {\n display: block;\n color: var(--color-text);\n text-decoration: none;\n text-align: left;\n }\n .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n border: 1px solid var(--color-primary);\n background-color: var(--color-primary-variant);\n }\n .kol-tree-item__link:hover .kol-link, .kol-tree-item__link:focus-within .kol-link {\n outline-offset: 0;\n color: var(--color-light);\n }\n .kol-tree-item__link--active {\n background-color: var(--color-primary);\n }\n .kol-tree-item__link--active .kol-link {\n color: var(--color-light);\n }\n .kol-tree-item__toggle-button {\n display: inline-block;\n }\n .kol-tree-item__toggle-button:hover {\n transform: scale(1.3);\n }\n}";
710
+ var css_248z$1 = "@layer kol-theme-component {\n .kol-tree-item {\n --tree-item-indentation: calc(20rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tree-item__link {\n display: block;\n border: 1px solid transparent;\n }\n .kol-tree-item__link .kol-link {\n color: var(--color-text);\n text-align: left;\n }\n .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n border: 1px solid var(--color-primary);\n background-color: var(--color-primary-variant);\n }\n .kol-tree-item__link:hover .kol-link, .kol-tree-item__link:focus-within .kol-link {\n outline-offset: 0;\n color: var(--color-light);\n }\n .kol-tree-item__link--active {\n background-color: var(--color-primary);\n }\n .kol-tree-item__link--active .kol-link {\n color: var(--color-light);\n }\n .kol-tree-item__toggle-button:hover .kol-tree-item__toggle-button-icon::part(icon) {\n transform: scale(1.6);\n }\n .kol-tree-item__text {\n text-decoration: none;\n }\n}";
711
711
 
712
712
  var css_248z = "@layer kol-theme-component {\n .kol-tree__treeview-navigation {\n border: 2px solid transparent;\n border-radius: var(--border-radius);\n }\n .kol-tree:focus-within {\n outline: 0;\n }\n .kol-tree:focus-within ul {\n border: 2px solid var(--color-primary);\n }\n}";
713
713