@public-ui/themes 1.3.0 → 1.3.2

package/assets/kreon/OFL.txt

@@ -0,0 +1,93 @@
+Copyright 2018 The Kreon Project Authors (https://github.com/googlefonts/kreon), with Reserved Font Name "Kreon".
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/assets/kreon/README.txt

@@ -0,0 +1,67 @@
+Kreon Variable Font
+===================
+
+This download contains Kreon as both a variable font and static fonts.
+
+Kreon is a variable font with this axis:
+  wght
+
+This means all the styles are contained in a single file:
+  Kreon-VariableFont_wght.ttf
+
+If your app fully supports variable fonts, you can now pick intermediate styles
+that aren’t available as static fonts. Not all apps support variable fonts, and
+in those cases you can use the static font files for Kreon:
+  static/Kreon-Light.ttf
+  static/Kreon-Regular.ttf
+  static/Kreon-Medium.ttf
+  static/Kreon-SemiBold.ttf
+  static/Kreon-Bold.ttf
+
+Get started
+-----------
+
+1. Install the font files you want to use
+
+2. Use your app's font picker to view the font family and all the
+available styles
+
+Learn more about variable fonts
+-------------------------------
+
+  https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts
+  https://variablefonts.typenetwork.com
+  https://medium.com/variable-fonts
+
+In desktop apps
+
+  https://theblog.adobe.com/can-variable-fonts-illustrator-cc
+  https://helpx.adobe.com/nz/photoshop/using/fonts.html#variable_fonts
+
+Online
+
+  https://developers.google.com/fonts/docs/getting_started
+  https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide
+  https://developer.microsoft.com/en-us/microsoft-edge/testdrive/demos/variable-fonts
+
+Installing fonts
+
+  MacOS: https://support.apple.com/en-us/HT201749
+  Linux: https://www.google.com/search?q=how+to+install+a+font+on+gnu%2Blinux
+  Windows: https://support.microsoft.com/en-us/help/314960/how-to-install-or-remove-a-font-in-windows
+
+Android Apps
+
+  https://developers.google.com/fonts/docs/android
+  https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts
+
+License
+-------
+Please read the full license text (OFL.txt) to understand the permissions,
+restrictions and requirements for usage, redistribution, and modification.
+
+You can use them in your products & projects – print or digital,
+commercial or otherwise.
+
+This isn't legal advice, please consider consulting a lawyer and see the full
+license for all details.

package/assets/kreon/style.css

@@ -0,0 +1,41 @@
+@font-face {
+	font-family: 'Kreon';
+	font-style: normal;
+	font-weight: bold;
+	src: url(static/Kreon-SemiBold.ttf) format('truetype');
+}
+
+@font-face {
+	font-family: 'Kreon';
+	font-style: italic;
+	font-weight: bolder;
+	src: url(static/Kreon-SemiBold.ttf) format('truetype');
+}
+
+@font-face {
+	font-family: 'Kreon';
+	font-style: italic;
+	font-weight: normal;
+	src: url(static/Kreon-Regular.ttf) format('truetype');
+}
+
+@font-face {
+	font-family: 'Kreon';
+	font-style: normal;
+	font-weight: normal;
+	src: url(static/Kreon-Regular.ttf) format('truetype');
+}
+
+@font-face {
+	font-family: 'Kreon';
+	font-style: normal;
+	font-weight: lighter;
+	src: url(static/Kreon-Light.ttf) format('truetype');
+}
+
+@font-face {
+	font-family: 'Kreon';
+	font-style: italic;
+	font-weight: lighter;
+	src: url(static/Kreon-Light.ttf) format('truetype');
+}

package/dist/index.cjs

@@ -264,7 +264,35 @@ const NXT = schema.KoliBri.createTheme("nxt", {
 });
 
 const ZOLL = schema.KoliBri.createTheme("zoll", {
-  "KOL-BADGE": ":host {display: inline-block;}span {align-items: center;border-radius: 0.3125rem;display: flex;line-height: 1.25rem;gap: 0.5rem;padding: 0.25rem 0.75rem;}",
+  GLOBAL: ":host {--border-color: var(--color-neutral);--border-radius: 0.25rem;--box-shadow: rgba(0, 0, 0, 0.12) 0 12px 12px -4px,rgba(0, 0, 0, 0.04) 0 4px 4px -4px;--color-blau: #264f8e;--color-blau-dark: #08335e;--color-blau-light: #326cae;--color-akzent: #ef9e48;--color-akzent-dark: #da793c;--color-akzent-light: #f5ba6c;--color-neutral: #e3e3e3;--color-neutral-dark: #333;--color-neutral-light: #f7f7f7;--color-rot: #ce3033;--color-gelb: #f6cd35;--color-gruen: #008549;--color-grau-100: hsl(0 0% 0%);--color-grau-90: hsl(0 0% 10%);--color-grau-80: hsl(0 0% 20%);--color-grau-70: hsl(0 0% 30%);--color-grau-60: hsl(0 0% 40%);--color-grau-50: hsl(0 0% 50%);--color-grau-40: hsl(0 0% 60%);--color-grau-30: hsl(0 0% 70%);--color-grau-20: hsl(0 0% 80%);--color-grau-10: hsl(0 0% 90%);--color-grau-0: hsl(0 0% 100%);--gap: 0.25rem;--font-family: Roboto, Kreon, Georgia, Times New Roman, serif;--font-size: 16px;--font-weight-bold: 700;--line-height-bold: 1.2em; /* em! */--line-height-regular: 1.5em; /* em! */}:host {font-size: var(--font-size);}:host * {box-sizing: border-box;font-family: var(--font-family);}a,button,input,select,textarea {background-color: transparent;border-radius: var(--border-radius);text-decoration: none;}a,button,input,label,option,select,textarea {cursor: pointer;}h1,h2,h3,h4,h5,h6 {margin: 0;padding: 0;} /* a:focus, */*[tabindex]:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}@keyframes spin {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}kol-heading-wc {font-weight: 700;}",
+  "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;gap: 0.5rem;line-height: 1.25rem;padding: 0.25rem 0.5rem;}",
+  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {font-weight: var(--font-weight-bold);margin: 0;padding: 1rem 0;}h1 {font-size: 2.5rem;line-height: 1.2;padding: 0 0 1rem 0;}h2 {font-size: 2rem;line-height: 1.25;}h3 {font-size: 1.75rem;line-height: 1.29;}h4 {font-size: 1.5rem;line-height: 1.33;}h5 {font-size: 1.25rem;line-height: 1.4;}h6 {font-size: 1rem;line-height: 1.5;}",
+  "KOL-LINK": "kol-link-wc,kol-link-button-wc {display: inline-block;}a,button {color: var(--color-blau);}a:active,a:focus,a:hover,button:active,button:focus,button:hover {outline-width: 0;text-decoration-line: underline;text-decoration-thickness: 0.1rem !important;}a > kol-span-wc {order: 1;}kol-icon {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;line-height: 1em;}.skip:focus {background: white;left: unset;position: unset;}",
+  "KOL-BUTTON-LINK": "kol-link-wc,kol-link-button-wc {display: inline-block;}a,button {color: var(--color-blau);}a:active,a:focus,a:hover,button:active,button:focus,button:hover {outline-width: 0;text-decoration-line: underline;text-decoration-thickness: 0.1rem !important;}a > kol-span-wc {order: 1;}kol-icon {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;line-height: 1em;}.skip:focus {background: white;left: unset;position: unset;}",
+  "KOL-SPIN": ".spin {display: inline-block;height: 1rem;position: relative;width: 3rem;}.spin span {animation-timing-function: cubic-bezier(0, 1, 1, 0);border: 0.1rem solid rgb(255, 255, 255);border-radius: 50%;height: 0.8rem;width: 0.8rem;top: 0.1rem;position: absolute;}.spin span:nth-child(1) {background-color: #fc0;z-index: 0;animation: 2s ease 0s infinite normal none running spin1;left: 0.1rem;}.spin span:nth-child(2) {background-color: #f00;z-index: 1;animation: 2s ease 0s infinite normal none running spin2;left: 0.1rem;}.spin span:nth-child(3) {background-color: #000;z-index: 1;animation: 2s ease 0s infinite normal none running spin2;left: 1.1rem;}.spin span:nth-child(4) {background-color: #666;z-index: 0;animation: 2s ease 0s infinite normal none running spin3;left: 2.1rem;}@keyframes spin1 {0% {transform: scale(0);}100% {transform: scale(1);}}@keyframes spin2 {0% {transform: translate(0px, 0px);}100% {transform: translate(1rem, 0px);}}@keyframes spin3 {0% {transform: scale(1);}100% {transform: scale(0);}}",
+  "KOL-TABLE": "caption {background-color: var(--color-neutral);caption-side: TOP;font-size: 1.5rem; /* 1.75rem *//* line-height: 3rem; */margin-bottom: 0.25rem;padding: 0.75rem;text-align: left;}table {border-spacing: 0;border-color: var(--color-neutral);border-style: solid;border-width: 0;border-top-width: 1px;}td,th {background-color: white;color: var(--color-neutral-dark);border-color: var(--color-neutral);border-style: solid;border-width: 0;border-bottom-width: 1px;padding: 0.5rem;}",
+  "KOL-ACCORDION": ':host > div {border-color: var(--border-color);border-radius: var(--border-radius);border-style: solid;border-width: 1px;}.toggle-button,:host > div > kol-heading-wc > * {display: grid;margin: -1px;}.toggle-button button,:host > div > kol-heading-wc button {display: flex;gap: calc(2 * var(--gap));background-color: var(--color-neutral-light);border-color: var(--border-color);border-radius: var(--border-radius);border-style: solid;border-width: 2px;color: var(--color-blau);font-weight: var(--font-weight-bold);text-align: left;padding: 1.5rem;}.toggle-button button:hover,:host > div > kol-heading-wc button:hover {border-color: var(--color-blau-dark);}.content,[part*="content"] {padding: 1.5rem 1.5rem 2rem 1.5rem;}:host > div > kol-heading-wc button kol-icon::part(icon) {font-weight: 900;color: var(--color-midnight);}:host > div > kol-heading-wc button kol-icon::part(close)::before {font-family: "Font Awesome 6 Free";content: "\\f077";}:host > div > kol-heading-wc button kol-icon::part(open)::before {font-family: "Font Awesome 6 Free";content: "\\f078";}',
+  "KOL-ALERT": ':host > div {background-color: white;border-width: 2px;border-style: solid;border-radius: 0.25rem;color: var(--color-neutral-dark);}:host > div.card > div {display: grid;gap: 0.625rem;padding: 1.5rem;}:host > div.card .heading > * {display: inline-flex;align-items: center;font-size: 1.25rem;}:host > div.card .heading kol-icon {font-size: 2rem;}:host > div.card .heading .icon {margin-right: 1.5rem;align-items: center;display: inline-flex;}:host > div.default {border-color: var(--color-neutral-dark);}:host > div.card.default .heading {color: var(--color-neutral-dark);}:host > div.info {border-color: var(--color-blau);}:host > div.card.info .heading {color: var(--color-blau);}:host > div.warning {background-color: var(--color-gelb);border-color: var(--color-gelb);}:host > div.card.warning .heading {color: var(--color-neutral-dark);}:host > div.error {border-color: var(--color-rot);}:host > div.card.error .heading {color: var(--color-rot);}:host > div.success {border-color: var(--color-gruen);}:host > div.card.success .heading {color: var(--color-gruen);}:host > div.card .content {line-height: 1.5rem;padding-left: 3.5rem;}:host > div > kol-icon::part(icon) {text-align: center;width: 1rem;}:host > div.info > kol-icon::part(icon)::before {content: "\\f0eb";}/* MSG */:host > div.msg {border-width: 0;display: flex;gap: calc(2 * var(--gap));padding: var(--gap);}:host > div.msg.default {color: var(--color-neutral-dark);}:host > div.msg.error {color: var(--color-rot);}:host > div.msg.info {color: var(--color-blau);}:host > div.msg.warning {color: var(--color-neutral-dark);}:host > div.msg.success {color: var(--color-gruen);}:host > div.msg .heading {color: var(--color-neutral-dark);}/* CLOSER */:host > div > div {display: grid;gap: var(--gap);grid-template-columns: auto auto auto;}:host > div > div > kol-heading-wc {grid-column: 1 / span 3;}:host .close button {min-height: 44px;min-width: 44px;background-color: var(--color-neutral);padding: 0.75rem;color: var(--color-blau);}:host .close button kol-icon::part(icon)::before {content: "\\f00d";}',
+  "KOL-CARD": ":host > div {border-color: var(--border-color);border-radius: var(--border-radius);border-style: solid;border-width: 1px;}:host > div .header {padding: 1.5rem;}",
+  "KOL-BUTTON": ":host > kol-button-wc > button > kol-span-wc,:host > kol-link-wc > a > kol-span-wc {border-radius: var(--border-radius);border-style: solid;border-width: 2px;gap: 0.5rem;line-height: 1rem;padding: 0.75rem 1rem;}:host > kol-button-wc > button:hover,:host > kol-link-wc > a:hover {outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}:host > kol-button-wc > button > kol-span-wc span,:host > kol-link-wc > a > kol-span-wc span {gap: 0.5rem;}:host > kol-button-wc.primary > button > kol-span-wc,:host > kol-link-wc.primary > a > kol-span-wc {background-color: var(--color-akzent);border-color: var(--color-akzent);color: white;}:host > kol-button-wc.primary > button:focus > kol-span-wc,:host > kol-button-wc.primary > button:hover > kol-span-wc,:host > kol-link-wc.primary > a:focus > kol-span-wc,:host > kol-link-wc.primary > a:hover > kol-span-wc {background-color: var(--color-akzent-dark);}:host > kol-button-wc.secondary > button > kol-span-wc,:host > kol-link-wc.secondary > a > kol-span-wc {border-color: var(--color-blau);color: var(--color-blau);}:host > kol-button-wc.secondary > button:focus > kol-span-wc,:host > kol-button-wc.secondary > button:hover > kol-span-wc,:host > kol-link-wc.secondary > a:focus > kol-span-wc,:host > kol-link-wc.secondary > a:hover > kol-span-wc {border-color: var(--color-blau-dark);color: var(--color-blau-dark);}:host > kol-button-wc.normal > button > kol-span-wc,:host > kol-link-wc.normal > a > kol-span-wc {background-color: var(--color-blau);border-color: var(--color-blau);color: white;}:host > kol-button-wc.normal > button:focus > kol-span-wc,:host > kol-button-wc.normal > button:hover > kol-span-wc,:host > kol-link-wc.normal > a:focus > kol-span-wc,:host > kol-link-wc.normal > a:hover > kol-span-wc {background-color: var(--color-blau-dark);}:host > kol-button-wc.danger > button > kol-span-wc,:host > kol-link-wc.danger > a > kol-span-wc {background-color: var(--color-rot);border-color: var(--color-rot);color: white;}:host > kol-button-wc.danger > button:focus > kol-span-wc,:host > kol-button-wc.danger > button:hover > kol-span-wc,:host > kol-link-wc.danger > a:focus > kol-span-wc,:host > kol-link-wc.danger > a:hover > kol-span-wc {background-color: var(--color-rot);}:host > kol-button-wc.ghost > button > kol-span-wc,:host > kol-link-wc.ghost > a > kol-span-wc {background-color: transparent;border-color: transparent;color: var(--color-blau);}:host > kol-button-wc.ghost > button:focus > kol-span-wc,:host > kol-button-wc.ghost > button:hover > kol-span-wc,:host > kol-link-wc.ghost > a:focus > kol-span-wc,:host > kol-link-wc.ghost > a:hover > kol-span-wc {color: var(--color-blau-dark);}a:focus,button:focus {cursor: pointer;outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}",
+  "KOL-LINK-BUTTON": ":host > kol-button-wc > button > kol-span-wc,:host > kol-link-wc > a > kol-span-wc {border-radius: var(--border-radius);border-style: solid;border-width: 2px;gap: 0.5rem;line-height: 1rem;padding: 0.75rem 1rem;}:host > kol-button-wc > button:hover,:host > kol-link-wc > a:hover {outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}:host > kol-button-wc > button > kol-span-wc span,:host > kol-link-wc > a > kol-span-wc span {gap: 0.5rem;}:host > kol-button-wc.primary > button > kol-span-wc,:host > kol-link-wc.primary > a > kol-span-wc {background-color: var(--color-akzent);border-color: var(--color-akzent);color: white;}:host > kol-button-wc.primary > button:focus > kol-span-wc,:host > kol-button-wc.primary > button:hover > kol-span-wc,:host > kol-link-wc.primary > a:focus > kol-span-wc,:host > kol-link-wc.primary > a:hover > kol-span-wc {background-color: var(--color-akzent-dark);}:host > kol-button-wc.secondary > button > kol-span-wc,:host > kol-link-wc.secondary > a > kol-span-wc {border-color: var(--color-blau);color: var(--color-blau);}:host > kol-button-wc.secondary > button:focus > kol-span-wc,:host > kol-button-wc.secondary > button:hover > kol-span-wc,:host > kol-link-wc.secondary > a:focus > kol-span-wc,:host > kol-link-wc.secondary > a:hover > kol-span-wc {border-color: var(--color-blau-dark);color: var(--color-blau-dark);}:host > kol-button-wc.normal > button > kol-span-wc,:host > kol-link-wc.normal > a > kol-span-wc {background-color: var(--color-blau);border-color: var(--color-blau);color: white;}:host > kol-button-wc.normal > button:focus > kol-span-wc,:host > kol-button-wc.normal > button:hover > kol-span-wc,:host > kol-link-wc.normal > a:focus > kol-span-wc,:host > kol-link-wc.normal > a:hover > kol-span-wc {background-color: var(--color-blau-dark);}:host > kol-button-wc.danger > button > kol-span-wc,:host > kol-link-wc.danger > a > kol-span-wc {background-color: var(--color-rot);border-color: var(--color-rot);color: white;}:host > kol-button-wc.danger > button:focus > kol-span-wc,:host > kol-button-wc.danger > button:hover > kol-span-wc,:host > kol-link-wc.danger > a:focus > kol-span-wc,:host > kol-link-wc.danger > a:hover > kol-span-wc {background-color: var(--color-rot);}:host > kol-button-wc.ghost > button > kol-span-wc,:host > kol-link-wc.ghost > a > kol-span-wc {background-color: transparent;border-color: transparent;color: var(--color-blau);}:host > kol-button-wc.ghost > button:focus > kol-span-wc,:host > kol-button-wc.ghost > button:hover > kol-span-wc,:host > kol-link-wc.ghost > a:focus > kol-span-wc,:host > kol-link-wc.ghost > a:hover > kol-span-wc {color: var(--color-blau-dark);}a:focus,button:focus {cursor: pointer;outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}",
+  "KOL-BUTTON-GROUP": ":host > kol-button-group-wc > div {display: inline-flex;flex-wrap: wrap;gap: 0.25rem;}:host > kol-button-group-wc > div {background-color: var(--color-neutral);border-radius: var(--border-radius);}",
+  "KOL-PAGINATION": ":host {display: grid;gap: 1rem;}:host > div {display: inline-flex;flex-wrap: wrap;align-items: center;gap: 0.5em;}",
+  "KOL-TOAST": ":host > div {position: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 200;}:host > div > kol-alert {display: block;margin: auto;padding: 1rem;max-width: 750px;}:host > div > kol-button-wc {top: 0;position: relative;display: block;margin: auto;width: 1em;}",
+  "KOL-PROGRESS": ":host progress,:host span {display: block;height: 0px;overflow: hidden;width: 0px;}svg line:first-child,svg circle:first-child {fill: transparent;stroke: var(--color-neutral);}svg line:last-child,svg circle:last-child {stroke: var(--color-blau);fill: transparent;}progress {display: none;}",
+  "KOL-LINK-GROUP": "ul {list-style: none;margin: 0px;padding: 0px;}nav.horizontal ul {display: flex;flex-wrap: wrap;}nav.horizontal li {margin-left: 1.25rem;margin-right: 0.25rem;}nav.horizontal li:first-child {margin-left: 0;}nav.horizontal li:last-child {margin-right: 0;}nav.vertical li {margin-left: 1.75rem;margin-right: 0.5rem;}li.list-none {list-style-type: none !important;margin-left: 0;}",
+  "KOL-BREADCRUMB": 'nav {width: 100%;}ul {margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;align-items: center;}kol-link {display: inline;}:host kol-icon[exportparts*="separator"] {padding: 0 0.5rem;}:host kol-icon::part(icon separator) {font-weight: 900;font-size: 0.875rem;}:host kol-icon::part(icon separator)::before {color: black;content: "\\f054";font-family: "Font Awesome 6 Free";}:host li > kol-link > kol-link-wc > a {color: red !important;}',
+  "KOL-INPUT-CHECKBOX": '/* ALL INPUT, SELECT, TEXTAREA */:host {--spacing: 0.25rem;}input {border-color: var(--color-neutral);border-width: 2px;border-style: solid;}label {cursor: pointer;}kol-input:hover input,input:focus {border-color: var(--color-neutral-dark);}kol-input:hover label,kol-input:has(input:focus, select:focus, textarea:focus, ) label {text-decoration: underline;}.required label > span::after {content: "*";padding-left: 0.125em;}/* NEU */kol-input {display: grid;align-items: center;justify-items: left;width: 100%;}kol-input.checkbox {grid-template-columns: calc(6 * var(--spacing)) auto;}kol-input.switch {grid-template-columns: calc(13 * var(--spacing)) auto;}kol-input > div.input {display: inline-flex;order: 1;}kol-input > div.input input {margin: 0px;}kol-input > label {order: 2;padding-left: calc(2 * var(--spacing));}kol-input > kol-alert.error {order: 3;padding-top: 0.25em;grid-column: span 2 / auto;}/* CHECKBOX */input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}input[type="checkbox"]:before {content: "";cursor: pointer;}input[type="checkbox"]:checked,input[type="checkbox"]:indeterminate {background-color: var(--color-blau);border-color: var(--color-blau);}.checkbox input[type="checkbox"] {border-radius: 0.25em;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}.checkbox input[type="checkbox"]:before {border-radius: 0.25em;background-color: transparent;display: block;height: calc(6 * var(--spacing));position: relative;width: calc(6 * var(--spacing));}.checkbox input[type="checkbox"]:checked:before {border-right-width: 3px;border-bottom-width: 3px;left: calc(1.5 * var(--spacing) - 2px);top: calc(2.85 * var(--spacing) - 2px);transform: rotate(40deg) translate(-50%, -50%);background-color: transparent;border-width: 0px 3px 3px 0px;border-color: white;border-radius: 1px;border-style: solid;height: calc(3 * var(--spacing));width: calc(1.5 * var(--spacing));}.checkbox input[type="checkbox"]:indeterminate {background-color: var(--color-blau);}.checkbox input[type="checkbox"]:indeterminate:before {background-color: white;height: 0.25rem;top: 0.5rem;left: 0.25rem;width: 0.75rem;}.switch input[type="checkbox"] {min-width: 3.2em;width: 3.2em;height: 1.7em;border-radius: 0.25em;display: inline-block;position: relative;}.switch input[type="checkbox"]:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.2em;height: 1.2em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);border-radius: 0.25em;background-color: black;position: absolute;}.switch input[type="checkbox"]:checked:before {-webkit-transform: translateX(1.5em);-moz-transform: translateX(1.5em);-ms-transform: translateX(1.5em);transform: translateX(1.5em);background-color: white;}.switch input[type="checkbox"]:indeterminate {background-color: var(--color-blau);}.switch input[type="checkbox"]:indeterminate:before {-webkit-transform: translateX(0.75em);-moz-transform: translateX(0.75em);-ms-transform: translateX(0.75em);transform: translateX(0.75em);background-color: white;}.disabled {opacity: 0.33;}',
+  "KOL-INPUT-RADIO": '/* ALL INPUT, SELECT, TEXTAREA */:host {--spacing: 0.25rem;}input {border-color: var(--color-neutral);border-width: 2px;border-style: solid;}label {cursor: pointer;}kol-input:has(input:disabled) input,kol-input:has(input:disabled) label {cursor: not-allowed !important;opacity: 0.5;}kol-input:hover input,input:focus {border-color: var(--color-neutral-dark);}kol-input:hover label,kol-input:has(input:focus, select:focus, textarea:focus, ) label {text-decoration: underline;}.required legend > span::after {content: "*";padding-left: 0.125em;}label {display: grid;gap: 8px;width: 100%;}input {width: 100%;border-color: var(--border-color);border-width: 2px;border-style: solid;}input:hover {border-color: var(--color-blau);}kol-alert {display: block;width: 100%;margin-bottom: 0.4em;}/* RADIO */:host fieldset {border: 0px;margin: 0px;padding: 0px;display: grid;gap: 0.25em;}:host fieldset div {display: flex;flex-direction: row;margin-top: 0.125em;margin-bottom: 0.125em;align-items: center;position: relative;}:host fieldset div label {display: flex;padding-left: 0.25em;width: 100%;}:host fieldset div label span {margin-top: 0.125em;}:host fieldset div input[type="radio"] {appearance: none;transition: 0.5s;border-radius: 100%;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}:host fieldset div input[type="radio"]:before {content: "";cursor: pointer;left: calc(1.5 * var(--spacing) - 2px);top: calc(1.5 * var(--spacing) - 2px);position: relative;border-radius: 100%;display: block;height: calc(3 * var(--spacing));width: calc(3 * var(--spacing));}:host fieldset div input[type="radio"]:checked:before {box-shadow: 0 0 0.1rem black;background-color: var(--color-blau);}:host fieldset #error {margin: 0.4em 0;order: 3;}:host fieldset legend {order: 1;display: contents;}:host fieldset kol-input {order: 2;}.disabled {opacity: 0.33;}:host fieldset.horizontal {display: flex;flex-wrap: wrap;gap: 0.5rem 1rem;}:host fieldset.horizontal legend {display: inline-block;margin-bottom: 0.25em;}',
+  "KOL-INPUT-COLOR": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-FILE": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-EMAIL": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-NUMBER": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-PASSWORD": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-RANGE": 'kol-input {display: grid;padding: 0;margin: 0;}kol-input > label {order: 1;margin-bottom: 0.25em;}kol-input > label > span {color: var(--default-letter);font-size: 0.875rem;line-height: 1.5rem;}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: calc(100% - 4em);}input/*:not([type="range"])*/,select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--color-grau-30);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em 0.5em;border-color: transparent;border-width: 2px;border-style: solid;}.icon-left input,.icon-left select {margin-left: 2em;}.icon-right input,.icon-right select {margin-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--border-color);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}',
+  "KOL-INPUT-TEXT": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-SELECT": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-TEXTAREA": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
   "KOL-ICON": KOL_ICON
 });
 

package/dist/index.mjs

@@ -262,7 +262,35 @@ const NXT = KoliBri.createTheme("nxt", {
 });
 
 const ZOLL = KoliBri.createTheme("zoll", {
-  "KOL-BADGE": ":host {display: inline-block;}span {align-items: center;border-radius: 0.3125rem;display: flex;line-height: 1.25rem;gap: 0.5rem;padding: 0.25rem 0.75rem;}",
+  GLOBAL: ":host {--border-color: var(--color-neutral);--border-radius: 0.25rem;--box-shadow: rgba(0, 0, 0, 0.12) 0 12px 12px -4px,rgba(0, 0, 0, 0.04) 0 4px 4px -4px;--color-blau: #264f8e;--color-blau-dark: #08335e;--color-blau-light: #326cae;--color-akzent: #ef9e48;--color-akzent-dark: #da793c;--color-akzent-light: #f5ba6c;--color-neutral: #e3e3e3;--color-neutral-dark: #333;--color-neutral-light: #f7f7f7;--color-rot: #ce3033;--color-gelb: #f6cd35;--color-gruen: #008549;--color-grau-100: hsl(0 0% 0%);--color-grau-90: hsl(0 0% 10%);--color-grau-80: hsl(0 0% 20%);--color-grau-70: hsl(0 0% 30%);--color-grau-60: hsl(0 0% 40%);--color-grau-50: hsl(0 0% 50%);--color-grau-40: hsl(0 0% 60%);--color-grau-30: hsl(0 0% 70%);--color-grau-20: hsl(0 0% 80%);--color-grau-10: hsl(0 0% 90%);--color-grau-0: hsl(0 0% 100%);--gap: 0.25rem;--font-family: Roboto, Kreon, Georgia, Times New Roman, serif;--font-size: 16px;--font-weight-bold: 700;--line-height-bold: 1.2em; /* em! */--line-height-regular: 1.5em; /* em! */}:host {font-size: var(--font-size);}:host * {box-sizing: border-box;font-family: var(--font-family);}a,button,input,select,textarea {background-color: transparent;border-radius: var(--border-radius);text-decoration: none;}a,button,input,label,option,select,textarea {cursor: pointer;}h1,h2,h3,h4,h5,h6 {margin: 0;padding: 0;} /* a:focus, */*[tabindex]:focus,button:focus,input:focus,select:focus,summary:focus,textarea:focus {outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}@keyframes spin {0% {transform: rotate(0deg);}100% {transform: rotate(360deg);}}kol-heading-wc {font-weight: 700;}",
+  "KOL-BADGE": ":host {display: inline-block;}:host > span {border-radius: 0.3125rem;gap: 0.5rem;line-height: 1.25rem;padding: 0.25rem 0.5rem;}",
+  "KOL-HEADING": "h1,h2,h3,h4,h5,h6 {font-weight: var(--font-weight-bold);margin: 0;padding: 1rem 0;}h1 {font-size: 2.5rem;line-height: 1.2;padding: 0 0 1rem 0;}h2 {font-size: 2rem;line-height: 1.25;}h3 {font-size: 1.75rem;line-height: 1.29;}h4 {font-size: 1.5rem;line-height: 1.33;}h5 {font-size: 1.25rem;line-height: 1.4;}h6 {font-size: 1rem;line-height: 1.5;}",
+  "KOL-LINK": "kol-link-wc,kol-link-button-wc {display: inline-block;}a,button {color: var(--color-blau);}a:active,a:focus,a:hover,button:active,button:focus,button:hover {outline-width: 0;text-decoration-line: underline;text-decoration-thickness: 0.1rem !important;}a > kol-span-wc {order: 1;}kol-icon {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;line-height: 1em;}.skip:focus {background: white;left: unset;position: unset;}",
+  "KOL-BUTTON-LINK": "kol-link-wc,kol-link-button-wc {display: inline-block;}a,button {color: var(--color-blau);}a:active,a:focus,a:hover,button:active,button:focus,button:hover {outline-width: 0;text-decoration-line: underline;text-decoration-thickness: 0.1rem !important;}a > kol-span-wc {order: 1;}kol-icon {padding: 0 0.25em;display: inline-block;}.hidden {display: none;visibility: hidden;}.skip {left: -99999px;overflow: hidden;position: absolute;z-index: 9999999;line-height: 1em;}.skip:focus {background: white;left: unset;position: unset;}",
+  "KOL-SPIN": ".spin {display: inline-block;height: 1rem;position: relative;width: 3rem;}.spin span {animation-timing-function: cubic-bezier(0, 1, 1, 0);border: 0.1rem solid rgb(255, 255, 255);border-radius: 50%;height: 0.8rem;width: 0.8rem;top: 0.1rem;position: absolute;}.spin span:nth-child(1) {background-color: #fc0;z-index: 0;animation: 2s ease 0s infinite normal none running spin1;left: 0.1rem;}.spin span:nth-child(2) {background-color: #f00;z-index: 1;animation: 2s ease 0s infinite normal none running spin2;left: 0.1rem;}.spin span:nth-child(3) {background-color: #000;z-index: 1;animation: 2s ease 0s infinite normal none running spin2;left: 1.1rem;}.spin span:nth-child(4) {background-color: #666;z-index: 0;animation: 2s ease 0s infinite normal none running spin3;left: 2.1rem;}@keyframes spin1 {0% {transform: scale(0);}100% {transform: scale(1);}}@keyframes spin2 {0% {transform: translate(0px, 0px);}100% {transform: translate(1rem, 0px);}}@keyframes spin3 {0% {transform: scale(1);}100% {transform: scale(0);}}",
+  "KOL-TABLE": "caption {background-color: var(--color-neutral);caption-side: TOP;font-size: 1.5rem; /* 1.75rem *//* line-height: 3rem; */margin-bottom: 0.25rem;padding: 0.75rem;text-align: left;}table {border-spacing: 0;border-color: var(--color-neutral);border-style: solid;border-width: 0;border-top-width: 1px;}td,th {background-color: white;color: var(--color-neutral-dark);border-color: var(--color-neutral);border-style: solid;border-width: 0;border-bottom-width: 1px;padding: 0.5rem;}",
+  "KOL-ACCORDION": ':host > div {border-color: var(--border-color);border-radius: var(--border-radius);border-style: solid;border-width: 1px;}.toggle-button,:host > div > kol-heading-wc > * {display: grid;margin: -1px;}.toggle-button button,:host > div > kol-heading-wc button {display: flex;gap: calc(2 * var(--gap));background-color: var(--color-neutral-light);border-color: var(--border-color);border-radius: var(--border-radius);border-style: solid;border-width: 2px;color: var(--color-blau);font-weight: var(--font-weight-bold);text-align: left;padding: 1.5rem;}.toggle-button button:hover,:host > div > kol-heading-wc button:hover {border-color: var(--color-blau-dark);}.content,[part*="content"] {padding: 1.5rem 1.5rem 2rem 1.5rem;}:host > div > kol-heading-wc button kol-icon::part(icon) {font-weight: 900;color: var(--color-midnight);}:host > div > kol-heading-wc button kol-icon::part(close)::before {font-family: "Font Awesome 6 Free";content: "\\f077";}:host > div > kol-heading-wc button kol-icon::part(open)::before {font-family: "Font Awesome 6 Free";content: "\\f078";}',
+  "KOL-ALERT": ':host > div {background-color: white;border-width: 2px;border-style: solid;border-radius: 0.25rem;color: var(--color-neutral-dark);}:host > div.card > div {display: grid;gap: 0.625rem;padding: 1.5rem;}:host > div.card .heading > * {display: inline-flex;align-items: center;font-size: 1.25rem;}:host > div.card .heading kol-icon {font-size: 2rem;}:host > div.card .heading .icon {margin-right: 1.5rem;align-items: center;display: inline-flex;}:host > div.default {border-color: var(--color-neutral-dark);}:host > div.card.default .heading {color: var(--color-neutral-dark);}:host > div.info {border-color: var(--color-blau);}:host > div.card.info .heading {color: var(--color-blau);}:host > div.warning {background-color: var(--color-gelb);border-color: var(--color-gelb);}:host > div.card.warning .heading {color: var(--color-neutral-dark);}:host > div.error {border-color: var(--color-rot);}:host > div.card.error .heading {color: var(--color-rot);}:host > div.success {border-color: var(--color-gruen);}:host > div.card.success .heading {color: var(--color-gruen);}:host > div.card .content {line-height: 1.5rem;padding-left: 3.5rem;}:host > div > kol-icon::part(icon) {text-align: center;width: 1rem;}:host > div.info > kol-icon::part(icon)::before {content: "\\f0eb";}/* MSG */:host > div.msg {border-width: 0;display: flex;gap: calc(2 * var(--gap));padding: var(--gap);}:host > div.msg.default {color: var(--color-neutral-dark);}:host > div.msg.error {color: var(--color-rot);}:host > div.msg.info {color: var(--color-blau);}:host > div.msg.warning {color: var(--color-neutral-dark);}:host > div.msg.success {color: var(--color-gruen);}:host > div.msg .heading {color: var(--color-neutral-dark);}/* CLOSER */:host > div > div {display: grid;gap: var(--gap);grid-template-columns: auto auto auto;}:host > div > div > kol-heading-wc {grid-column: 1 / span 3;}:host .close button {min-height: 44px;min-width: 44px;background-color: var(--color-neutral);padding: 0.75rem;color: var(--color-blau);}:host .close button kol-icon::part(icon)::before {content: "\\f00d";}',
+  "KOL-CARD": ":host > div {border-color: var(--border-color);border-radius: var(--border-radius);border-style: solid;border-width: 1px;}:host > div .header {padding: 1.5rem;}",
+  "KOL-BUTTON": ":host > kol-button-wc > button > kol-span-wc,:host > kol-link-wc > a > kol-span-wc {border-radius: var(--border-radius);border-style: solid;border-width: 2px;gap: 0.5rem;line-height: 1rem;padding: 0.75rem 1rem;}:host > kol-button-wc > button:hover,:host > kol-link-wc > a:hover {outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}:host > kol-button-wc > button > kol-span-wc span,:host > kol-link-wc > a > kol-span-wc span {gap: 0.5rem;}:host > kol-button-wc.primary > button > kol-span-wc,:host > kol-link-wc.primary > a > kol-span-wc {background-color: var(--color-akzent);border-color: var(--color-akzent);color: white;}:host > kol-button-wc.primary > button:focus > kol-span-wc,:host > kol-button-wc.primary > button:hover > kol-span-wc,:host > kol-link-wc.primary > a:focus > kol-span-wc,:host > kol-link-wc.primary > a:hover > kol-span-wc {background-color: var(--color-akzent-dark);}:host > kol-button-wc.secondary > button > kol-span-wc,:host > kol-link-wc.secondary > a > kol-span-wc {border-color: var(--color-blau);color: var(--color-blau);}:host > kol-button-wc.secondary > button:focus > kol-span-wc,:host > kol-button-wc.secondary > button:hover > kol-span-wc,:host > kol-link-wc.secondary > a:focus > kol-span-wc,:host > kol-link-wc.secondary > a:hover > kol-span-wc {border-color: var(--color-blau-dark);color: var(--color-blau-dark);}:host > kol-button-wc.normal > button > kol-span-wc,:host > kol-link-wc.normal > a > kol-span-wc {background-color: var(--color-blau);border-color: var(--color-blau);color: white;}:host > kol-button-wc.normal > button:focus > kol-span-wc,:host > kol-button-wc.normal > button:hover > kol-span-wc,:host > kol-link-wc.normal > a:focus > kol-span-wc,:host > kol-link-wc.normal > a:hover > kol-span-wc {background-color: var(--color-blau-dark);}:host > kol-button-wc.danger > button > kol-span-wc,:host > kol-link-wc.danger > a > kol-span-wc {background-color: var(--color-rot);border-color: var(--color-rot);color: white;}:host > kol-button-wc.danger > button:focus > kol-span-wc,:host > kol-button-wc.danger > button:hover > kol-span-wc,:host > kol-link-wc.danger > a:focus > kol-span-wc,:host > kol-link-wc.danger > a:hover > kol-span-wc {background-color: var(--color-rot);}:host > kol-button-wc.ghost > button > kol-span-wc,:host > kol-link-wc.ghost > a > kol-span-wc {background-color: transparent;border-color: transparent;color: var(--color-blau);}:host > kol-button-wc.ghost > button:focus > kol-span-wc,:host > kol-button-wc.ghost > button:hover > kol-span-wc,:host > kol-link-wc.ghost > a:focus > kol-span-wc,:host > kol-link-wc.ghost > a:hover > kol-span-wc {color: var(--color-blau-dark);}a:focus,button:focus {cursor: pointer;outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}",
+  "KOL-LINK-BUTTON": ":host > kol-button-wc > button > kol-span-wc,:host > kol-link-wc > a > kol-span-wc {border-radius: var(--border-radius);border-style: solid;border-width: 2px;gap: 0.5rem;line-height: 1rem;padding: 0.75rem 1rem;}:host > kol-button-wc > button:hover,:host > kol-link-wc > a:hover {outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}:host > kol-button-wc > button > kol-span-wc span,:host > kol-link-wc > a > kol-span-wc span {gap: 0.5rem;}:host > kol-button-wc.primary > button > kol-span-wc,:host > kol-link-wc.primary > a > kol-span-wc {background-color: var(--color-akzent);border-color: var(--color-akzent);color: white;}:host > kol-button-wc.primary > button:focus > kol-span-wc,:host > kol-button-wc.primary > button:hover > kol-span-wc,:host > kol-link-wc.primary > a:focus > kol-span-wc,:host > kol-link-wc.primary > a:hover > kol-span-wc {background-color: var(--color-akzent-dark);}:host > kol-button-wc.secondary > button > kol-span-wc,:host > kol-link-wc.secondary > a > kol-span-wc {border-color: var(--color-blau);color: var(--color-blau);}:host > kol-button-wc.secondary > button:focus > kol-span-wc,:host > kol-button-wc.secondary > button:hover > kol-span-wc,:host > kol-link-wc.secondary > a:focus > kol-span-wc,:host > kol-link-wc.secondary > a:hover > kol-span-wc {border-color: var(--color-blau-dark);color: var(--color-blau-dark);}:host > kol-button-wc.normal > button > kol-span-wc,:host > kol-link-wc.normal > a > kol-span-wc {background-color: var(--color-blau);border-color: var(--color-blau);color: white;}:host > kol-button-wc.normal > button:focus > kol-span-wc,:host > kol-button-wc.normal > button:hover > kol-span-wc,:host > kol-link-wc.normal > a:focus > kol-span-wc,:host > kol-link-wc.normal > a:hover > kol-span-wc {background-color: var(--color-blau-dark);}:host > kol-button-wc.danger > button > kol-span-wc,:host > kol-link-wc.danger > a > kol-span-wc {background-color: var(--color-rot);border-color: var(--color-rot);color: white;}:host > kol-button-wc.danger > button:focus > kol-span-wc,:host > kol-button-wc.danger > button:hover > kol-span-wc,:host > kol-link-wc.danger > a:focus > kol-span-wc,:host > kol-link-wc.danger > a:hover > kol-span-wc {background-color: var(--color-rot);}:host > kol-button-wc.ghost > button > kol-span-wc,:host > kol-link-wc.ghost > a > kol-span-wc {background-color: transparent;border-color: transparent;color: var(--color-blau);}:host > kol-button-wc.ghost > button:focus > kol-span-wc,:host > kol-button-wc.ghost > button:hover > kol-span-wc,:host > kol-link-wc.ghost > a:focus > kol-span-wc,:host > kol-link-wc.ghost > a:hover > kol-span-wc {color: var(--color-blau-dark);}a:focus,button:focus {cursor: pointer;outline-color: var(--color-blau-dark);outline-offset: 0.125rem;outline-style: solid;outline-width: 0.125rem;transition: outline-offset 0.2s linear;}",
+  "KOL-BUTTON-GROUP": ":host > kol-button-group-wc > div {display: inline-flex;flex-wrap: wrap;gap: 0.25rem;}:host > kol-button-group-wc > div {background-color: var(--color-neutral);border-radius: var(--border-radius);}",
+  "KOL-PAGINATION": ":host {display: grid;gap: 1rem;}:host > div {display: inline-flex;flex-wrap: wrap;align-items: center;gap: 0.5em;}",
+  "KOL-TOAST": ":host > div {position: fixed;top: 0;left: 0;width: 100%;height: 0;z-index: 200;}:host > div > kol-alert {display: block;margin: auto;padding: 1rem;max-width: 750px;}:host > div > kol-button-wc {top: 0;position: relative;display: block;margin: auto;width: 1em;}",
+  "KOL-PROGRESS": ":host progress,:host span {display: block;height: 0px;overflow: hidden;width: 0px;}svg line:first-child,svg circle:first-child {fill: transparent;stroke: var(--color-neutral);}svg line:last-child,svg circle:last-child {stroke: var(--color-blau);fill: transparent;}progress {display: none;}",
+  "KOL-LINK-GROUP": "ul {list-style: none;margin: 0px;padding: 0px;}nav.horizontal ul {display: flex;flex-wrap: wrap;}nav.horizontal li {margin-left: 1.25rem;margin-right: 0.25rem;}nav.horizontal li:first-child {margin-left: 0;}nav.horizontal li:last-child {margin-right: 0;}nav.vertical li {margin-left: 1.75rem;margin-right: 0.5rem;}li.list-none {list-style-type: none !important;margin-left: 0;}",
+  "KOL-BREADCRUMB": 'nav {width: 100%;}ul {margin: 0;padding: 0;list-style: none;display: flex;flex-wrap: wrap;align-items: center;}kol-link {display: inline;}:host kol-icon[exportparts*="separator"] {padding: 0 0.5rem;}:host kol-icon::part(icon separator) {font-weight: 900;font-size: 0.875rem;}:host kol-icon::part(icon separator)::before {color: black;content: "\\f054";font-family: "Font Awesome 6 Free";}:host li > kol-link > kol-link-wc > a {color: red !important;}',
+  "KOL-INPUT-CHECKBOX": '/* ALL INPUT, SELECT, TEXTAREA */:host {--spacing: 0.25rem;}input {border-color: var(--color-neutral);border-width: 2px;border-style: solid;}label {cursor: pointer;}kol-input:hover input,input:focus {border-color: var(--color-neutral-dark);}kol-input:hover label,kol-input:has(input:focus, select:focus, textarea:focus, ) label {text-decoration: underline;}.required label > span::after {content: "*";padding-left: 0.125em;}/* NEU */kol-input {display: grid;align-items: center;justify-items: left;width: 100%;}kol-input.checkbox {grid-template-columns: calc(6 * var(--spacing)) auto;}kol-input.switch {grid-template-columns: calc(13 * var(--spacing)) auto;}kol-input > div.input {display: inline-flex;order: 1;}kol-input > div.input input {margin: 0px;}kol-input > label {order: 2;padding-left: calc(2 * var(--spacing));}kol-input > kol-alert.error {order: 3;padding-top: 0.25em;grid-column: span 2 / auto;}/* CHECKBOX */input[type="checkbox"] {appearance: none;background-color: white;cursor: pointer;transition: 0.5s;}input[type="checkbox"].kol-disabled:before {cursor: not-allowed;}input[type="checkbox"]:before {content: "";cursor: pointer;}input[type="checkbox"]:checked,input[type="checkbox"]:indeterminate {background-color: var(--color-blau);border-color: var(--color-blau);}.checkbox input[type="checkbox"] {border-radius: 0.25em;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}.checkbox input[type="checkbox"]:before {border-radius: 0.25em;background-color: transparent;display: block;height: calc(6 * var(--spacing));position: relative;width: calc(6 * var(--spacing));}.checkbox input[type="checkbox"]:checked:before {border-right-width: 3px;border-bottom-width: 3px;left: calc(1.5 * var(--spacing) - 2px);top: calc(2.85 * var(--spacing) - 2px);transform: rotate(40deg) translate(-50%, -50%);background-color: transparent;border-width: 0px 3px 3px 0px;border-color: white;border-radius: 1px;border-style: solid;height: calc(3 * var(--spacing));width: calc(1.5 * var(--spacing));}.checkbox input[type="checkbox"]:indeterminate {background-color: var(--color-blau);}.checkbox input[type="checkbox"]:indeterminate:before {background-color: white;height: 0.25rem;top: 0.5rem;left: 0.25rem;width: 0.75rem;}.switch input[type="checkbox"] {min-width: 3.2em;width: 3.2em;height: 1.7em;border-radius: 0.25em;display: inline-block;position: relative;}.switch input[type="checkbox"]:before {-webkit-transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;transition: 0.5;width: 1.2em;height: 1.2em;left: calc(0.25em - 2px);top: calc(0.25em - 2px);border-radius: 0.25em;background-color: black;position: absolute;}.switch input[type="checkbox"]:checked:before {-webkit-transform: translateX(1.5em);-moz-transform: translateX(1.5em);-ms-transform: translateX(1.5em);transform: translateX(1.5em);background-color: white;}.switch input[type="checkbox"]:indeterminate {background-color: var(--color-blau);}.switch input[type="checkbox"]:indeterminate:before {-webkit-transform: translateX(0.75em);-moz-transform: translateX(0.75em);-ms-transform: translateX(0.75em);transform: translateX(0.75em);background-color: white;}.disabled {opacity: 0.33;}',
+  "KOL-INPUT-RADIO": '/* ALL INPUT, SELECT, TEXTAREA */:host {--spacing: 0.25rem;}input {border-color: var(--color-neutral);border-width: 2px;border-style: solid;}label {cursor: pointer;}kol-input:has(input:disabled) input,kol-input:has(input:disabled) label {cursor: not-allowed !important;opacity: 0.5;}kol-input:hover input,input:focus {border-color: var(--color-neutral-dark);}kol-input:hover label,kol-input:has(input:focus, select:focus, textarea:focus, ) label {text-decoration: underline;}.required legend > span::after {content: "*";padding-left: 0.125em;}label {display: grid;gap: 8px;width: 100%;}input {width: 100%;border-color: var(--border-color);border-width: 2px;border-style: solid;}input:hover {border-color: var(--color-blau);}kol-alert {display: block;width: 100%;margin-bottom: 0.4em;}/* RADIO */:host fieldset {border: 0px;margin: 0px;padding: 0px;display: grid;gap: 0.25em;}:host fieldset div {display: flex;flex-direction: row;margin-top: 0.125em;margin-bottom: 0.125em;align-items: center;position: relative;}:host fieldset div label {display: flex;padding-left: 0.25em;width: 100%;}:host fieldset div label span {margin-top: 0.125em;}:host fieldset div input[type="radio"] {appearance: none;transition: 0.5s;border-radius: 100%;height: calc(6 * var(--spacing));min-width: calc(6 * var(--spacing));width: calc(6 * var(--spacing));}:host fieldset div input[type="radio"]:before {content: "";cursor: pointer;left: calc(1.5 * var(--spacing) - 2px);top: calc(1.5 * var(--spacing) - 2px);position: relative;border-radius: 100%;display: block;height: calc(3 * var(--spacing));width: calc(3 * var(--spacing));}:host fieldset div input[type="radio"]:checked:before {box-shadow: 0 0 0.1rem black;background-color: var(--color-blau);}:host fieldset #error {margin: 0.4em 0;order: 3;}:host fieldset legend {order: 1;display: contents;}:host fieldset kol-input {order: 2;}.disabled {opacity: 0.33;}:host fieldset.horizontal {display: flex;flex-wrap: wrap;gap: 0.5rem 1rem;}:host fieldset.horizontal legend {display: inline-block;margin-bottom: 0.25em;}',
+  "KOL-INPUT-COLOR": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-FILE": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-EMAIL": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-NUMBER": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-PASSWORD": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-INPUT-RANGE": 'kol-input {display: grid;padding: 0;margin: 0;}kol-input > label {order: 1;margin-bottom: 0.25em;}kol-input > label > span {color: var(--default-letter);font-size: 0.875rem;line-height: 1.5rem;}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;color: var(--default-letter);border-color: var(--default-border);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: calc(100% - 4em);}input/*:not([type="range"])*/,select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;border-color: var(--border-default);background-color: var(--color-grau-30);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em 0.5em;border-color: transparent;border-width: 2px;border-style: solid;}.icon-left input,.icon-left select {margin-left: 2em;}.icon-right input,.icon-right select {margin-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border: 1px solid var(--border-color);border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}',
+  "KOL-INPUT-TEXT": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-SELECT": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
+  "KOL-TEXTAREA": 'kol-input {display: grid;padding: 0;margin: 0;}input:focus,input:hover,select:focus,select:hover,textarea:focus,textarea:hover {border-color: var(--color-grau-60);}kol-input > label {font-weight: var(--font-weight-bold);order: 1;margin-bottom: 0.5em;}kol-input > label > span {color: var(--default-letter);}kol-input > div.input {background-color: white;border-radius: 0.25rem;display: block;order: 2;}kol-input > span.hint {color: var(--color-grau-40);font-style: italic;margin-top: 0.25em;order: 4;font-size: 0.8rem;}kol-input > kol-alert.error {margin-top: 0.25em;order: 3;}input,select,textarea {font-family: var(--font-family);background-color: transparent;box-sizing: border-box;font-size: 1rem;display: inline-flex;line-height: 1.5em;border-color: var(--color-grau-30);border-width: 2px;border-style: solid;padding: 0.5em 0.75em;border-radius: 0.25rem;overflow: hidden;width: 100%;}input:not([type="range"]),select:not([multiple]) {height: 2.75em;}textarea {display: inherit;}input:not([type="color"]):read-only,input:disabled,/* select:read-only, */select:disabled,textarea:read-only,textarea:disabled {cursor: not-allowed;background-color: var(--color-grau-10);}.required label > span::after {content: "*";padding-left: 0.125em;}.icons {display: flex;justify-content: space-between;height: 0;}.icons > * {margin: 0.75em;}.icon-left input,.icon-left select {padding-left: 2em;}.icon-right input,.icon-right select {padding-right: 2em;}kol-button-wc {position: relative;float: right;z-index: 1000;margin-top: -33px;}kol-button-wc button {border-radius: 0.25rem;box-sizing: border-box;background-color: transparent;cursor: pointer;}.icon-right kol-button-wc {margin-right: 2.5em;}.disabled {opacity: 0.33;}select[multiple],textarea {overflow: auto;}textarea {display: block;}select option {margin: 1px 0;padding: 0.5em;border-radius: 0.25em;cursor: pointer;}select option:disabled {cursor: not-allowed;}option:active:not(:disabled),option:checked:not(:disabled),option:focus:not(:disabled),option:hover:not(:disabled) {background-color: var(--color-blau);color: white;}',
   "KOL-ICON": KOL_ICON
 });
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@public-ui/themes",
-	"version": "1.3.0",
+	"version": "1.3.2",
 	"license": "EUPL-1.2",
 	"homepage": "https://public-ui.github.io",
 	"repository": "https://github.com/public-ui/kolibri",
@@ -48,19 +48,19 @@
 		"prepack": "unbuild"
 	},
 	"dependencies": {
-		"@public-ui/schema": "1.3.0"
+		"@public-ui/schema": "1.3.2"
 	},
 	"devDependencies": {
 		"@types/node": "18.11.18",
-		"@typescript-eslint/eslint-plugin": "5.49.0",
-		"@typescript-eslint/parser": "5.49.0",
-		"eslint": "8.32.0",
+		"@typescript-eslint/eslint-plugin": "5.50.0",
+		"@typescript-eslint/parser": "5.50.0",
+		"eslint": "8.33.0",
 		"eslint-plugin-no-loops": "0.3.0",
-		"typescript": "4.9.4",
+		"typescript": "4.9.5",
 		"unbuild": "1.1.1"
 	},
 	"peerDependencies": {
-		"@public-ui/components": "1.3.0"
+		"@public-ui/components": "1.3.2"
 	},
 	"sideEffects": false,
 	"type": "module",

package/assets/fontawesome-free/v5/LICENSE.txt

@@ -1,34 +0,0 @@
-Font Awesome Free License
--------------------------
-
-Font Awesome Free is free, open source, and GPL friendly. You can use it for
-commercial projects, open source projects, or really almost whatever you want.
-Full Font Awesome Free license: https://fontawesome.com/license/free.
-
-# Icons: CC BY 4.0 License (https://creativecommons.org/licenses/by/4.0/)
-In the Font Awesome Free download, the CC BY 4.0 license applies to all icons
-packaged as SVG and JS file types.
-
-# Fonts: SIL OFL 1.1 License (https://scripts.sil.org/OFL)
-In the Font Awesome Free download, the SIL OFL license applies to all icons
-packaged as web and desktop font files.
-
-# Code: MIT License (https://opensource.org/licenses/MIT)
-In the Font Awesome Free download, the MIT license applies to all non-font and
-non-icon files.
-
-# Attribution
-Attribution is required by MIT, SIL OFL, and CC BY licenses. Downloaded Font
-Awesome Free files already contain embedded comments with sufficient
-attribution, so you shouldn't need to do anything additional when using these
-files normally.
-
-We've kept attribution comments terse, so we ask that you do not actively work
-to remove them from files, especially code. They're a great way for folks to
-learn about Font Awesome.
-
-# Brand Icons
-All brand icons are trademarks of their respective owners. The use of these
-trademarks does not indicate endorsement of the trademark holder by Font
-Awesome, nor vice versa. **Please do not use brand logos for any purpose except
-to represent the company, product, or service to which they refer.**