@public-ui/theme-ecl 4.0.0-alpha.1 → 4.0.0-alpha.10
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.
- package/README.md +1 -1
- package/dist/index.cjs +201 -200
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +201 -200
- package/dist/index.mjs.map +1 -1
- package/package.json +20 -18
package/dist/index.cjs
CHANGED
|
@@ -798,9 +798,9 @@ var hasRequiredCjs$1;
|
|
|
798
798
|
function requireCjs$1 () {
|
|
799
799
|
if (hasRequiredCjs$1) return cjs$1;
|
|
800
800
|
hasRequiredCjs$1 = 1;
|
|
801
|
-
(function (exports) {
|
|
802
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
803
|
-
exports.querySelectorAll = void 0;
|
|
801
|
+
(function (exports$1) {
|
|
802
|
+
Object.defineProperty(exports$1, "__esModule", { value: true });
|
|
803
|
+
exports$1.querySelectorAll = void 0;
|
|
804
804
|
const pushNodes = (set, domNodes) => {
|
|
805
805
|
domNodes.forEach((domNode) => {
|
|
806
806
|
if (set.has(domNode) === false) {
|
|
@@ -818,10 +818,10 @@ function requireCjs$1 () {
|
|
|
818
818
|
for (let i = 0; i < nodeList.length; i++) {
|
|
819
819
|
const shadowRoot = nodeList[i].shadowRoot;
|
|
820
820
|
if (typeof shadowRoot === "object" && shadowRoot !== null) {
|
|
821
|
-
pushNodes(domNodes, (0, exports.querySelectorAll)(selector, shadowRoot));
|
|
821
|
+
pushNodes(domNodes, (0, exports$1.querySelectorAll)(selector, shadowRoot));
|
|
822
822
|
}
|
|
823
823
|
else {
|
|
824
|
-
pushNodes(domNodes, (0, exports.querySelectorAll)(selector, nodeList[i]));
|
|
824
|
+
pushNodes(domNodes, (0, exports$1.querySelectorAll)(selector, nodeList[i]));
|
|
825
825
|
}
|
|
826
826
|
}
|
|
827
827
|
return Array.from(domNodes);
|
|
@@ -830,7 +830,7 @@ function requireCjs$1 () {
|
|
|
830
830
|
throw new Error(`The parameter document for the method querySelectorAll is not type of Document, HTMLElement or ShadowRoot.`);
|
|
831
831
|
}
|
|
832
832
|
};
|
|
833
|
-
exports.querySelectorAll = querySelectorAll;
|
|
833
|
+
exports$1.querySelectorAll = querySelectorAll;
|
|
834
834
|
|
|
835
835
|
} (cjs$1));
|
|
836
836
|
return cjs$1;
|
|
@@ -845,9 +845,9 @@ var hasRequiredCjs;
|
|
|
845
845
|
function requireCjs () {
|
|
846
846
|
if (hasRequiredCjs) return cjs;
|
|
847
847
|
hasRequiredCjs = 1;
|
|
848
|
-
(function (exports) {
|
|
849
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
850
|
-
exports.querySelector = void 0;
|
|
848
|
+
(function (exports$1) {
|
|
849
|
+
Object.defineProperty(exports$1, "__esModule", { value: true });
|
|
850
|
+
exports$1.querySelector = void 0;
|
|
851
851
|
const querySelector = (selector, node = document) => {
|
|
852
852
|
if (node instanceof Document ||
|
|
853
853
|
node instanceof HTMLElement ||
|
|
@@ -858,10 +858,10 @@ function requireCjs () {
|
|
|
858
858
|
for (let i = 0; i < nodeList.length; i++) {
|
|
859
859
|
const shadowRoot = nodeList[i].shadowRoot;
|
|
860
860
|
if (typeof shadowRoot === "object" && shadowRoot !== null) {
|
|
861
|
-
domNode = (0, exports.querySelector)(selector, shadowRoot);
|
|
861
|
+
domNode = (0, exports$1.querySelector)(selector, shadowRoot);
|
|
862
862
|
}
|
|
863
863
|
else {
|
|
864
|
-
domNode = (0, exports.querySelector)(selector, nodeList[i]);
|
|
864
|
+
domNode = (0, exports$1.querySelector)(selector, nodeList[i]);
|
|
865
865
|
}
|
|
866
866
|
if (domNode !== null) {
|
|
867
867
|
break;
|
|
@@ -874,7 +874,7 @@ function requireCjs () {
|
|
|
874
874
|
throw new Error(`The parameter document for the method querySelector is not type of Document, HTMLElement or ShadowRoot.`);
|
|
875
875
|
}
|
|
876
876
|
};
|
|
877
|
-
exports.querySelector = querySelector;
|
|
877
|
+
exports$1.querySelector = querySelector;
|
|
878
878
|
|
|
879
879
|
} (cjs));
|
|
880
880
|
return cjs;
|
|
@@ -883,30 +883,6 @@ function requireCjs () {
|
|
|
883
883
|
requireCjs();
|
|
884
884
|
new Event('StateChange');
|
|
885
885
|
|
|
886
|
-
/*!
|
|
887
|
-
* KoliBri - The accessible HTML-Standard
|
|
888
|
-
*/
|
|
889
|
-
var KolEvent;
|
|
890
|
-
(function (KolEvent) {
|
|
891
|
-
KolEvent["blur"] = "kolBlur";
|
|
892
|
-
KolEvent["change"] = "kolChange";
|
|
893
|
-
KolEvent["changePage"] = "kolChangePage";
|
|
894
|
-
KolEvent["changePageSize"] = "kolChangePageSize";
|
|
895
|
-
KolEvent["click"] = "kolClick";
|
|
896
|
-
KolEvent["close"] = "kolClose";
|
|
897
|
-
KolEvent["create"] = "kolCreate";
|
|
898
|
-
KolEvent["focus"] = "kolFocus";
|
|
899
|
-
KolEvent["input"] = "kolInput";
|
|
900
|
-
KolEvent["mousedown"] = "kolMousedown";
|
|
901
|
-
KolEvent["reset"] = "kolReset";
|
|
902
|
-
KolEvent["select"] = "kolSelect";
|
|
903
|
-
KolEvent["selectionChange"] = "kolSelectionChange";
|
|
904
|
-
KolEvent["settingsChange"] = "settingsChange";
|
|
905
|
-
KolEvent["sort"] = "kolSort";
|
|
906
|
-
KolEvent["submit"] = "kolSubmit";
|
|
907
|
-
KolEvent["toggle"] = "kolToggle";
|
|
908
|
-
})(KolEvent || (KolEvent = {}));
|
|
909
|
-
|
|
910
886
|
/*!
|
|
911
887
|
* KoliBri - The accessible HTML-Standard
|
|
912
888
|
*/
|
|
@@ -984,17 +960,42 @@ function c(){const e=new Map,n=(t,o,r)=>{try{return e.get(t)(o,r)}catch{return e
|
|
|
984
960
|
*/
|
|
985
961
|
|
|
986
962
|
const bem$1 = c();
|
|
987
|
-
bem$1('kol-
|
|
988
|
-
bem$1('kol-
|
|
989
|
-
bem$1('kol-alert', 'icon');
|
|
963
|
+
bem$1('kol-icon');
|
|
964
|
+
bem$1('kol-icon', 'icon');
|
|
990
965
|
|
|
991
966
|
/*!
|
|
992
967
|
* KoliBri - The accessible HTML-Standard
|
|
993
968
|
*/
|
|
994
969
|
|
|
995
970
|
const bem = c();
|
|
996
|
-
bem('kol-
|
|
997
|
-
bem('kol-
|
|
971
|
+
bem('kol-alert', 'closer');
|
|
972
|
+
bem('kol-alert', 'content');
|
|
973
|
+
bem('kol-alert', 'icon');
|
|
974
|
+
|
|
975
|
+
/*!
|
|
976
|
+
* KoliBri - The accessible HTML-Standard
|
|
977
|
+
*/
|
|
978
|
+
var KolEvent;
|
|
979
|
+
(function (KolEvent) {
|
|
980
|
+
KolEvent["blur"] = "kolBlur";
|
|
981
|
+
KolEvent["change"] = "kolChange";
|
|
982
|
+
KolEvent["changePage"] = "kolChangePage";
|
|
983
|
+
KolEvent["changePageSize"] = "kolChangePageSize";
|
|
984
|
+
KolEvent["click"] = "kolClick";
|
|
985
|
+
KolEvent["close"] = "kolClose";
|
|
986
|
+
KolEvent["create"] = "kolCreate";
|
|
987
|
+
KolEvent["focus"] = "kolFocus";
|
|
988
|
+
KolEvent["input"] = "kolInput";
|
|
989
|
+
KolEvent["keydown"] = "kolKeydown";
|
|
990
|
+
KolEvent["mousedown"] = "kolMousedown";
|
|
991
|
+
KolEvent["reset"] = "kolReset";
|
|
992
|
+
KolEvent["select"] = "kolSelect";
|
|
993
|
+
KolEvent["selectionChange"] = "kolSelectionChange";
|
|
994
|
+
KolEvent["settingsChange"] = "settingsChange";
|
|
995
|
+
KolEvent["sort"] = "kolSort";
|
|
996
|
+
KolEvent["submit"] = "kolSubmit";
|
|
997
|
+
KolEvent["toggle"] = "kolToggle";
|
|
998
|
+
})(KolEvent || (KolEvent = {}));
|
|
998
999
|
|
|
999
1000
|
/*!
|
|
1000
1001
|
* KoliBri - The accessible HTML-Standard
|
|
@@ -1169,265 +1170,265 @@ BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Arzneimittel und Mediz
|
|
|
1169
1170
|
BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Bevölkerungsforschung'], ['Bundesinstitut', 'für Bevölkerungsforschung']);
|
|
1170
1171
|
BUND_LOGO_TEXT_MAP.set(Bundesanstalt['Bundesinstitut für Sportwissenschaft'], ['Bundesinstitut', 'für Sportwissenschaft']);
|
|
1171
1172
|
|
|
1172
|
-
var css_248z$1k = "/* forward the rem function */\n@layer kol-theme-
|
|
1173
|
+
var css_248z$1k = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-accordion {\n background-color: var(--color-grey-5);\n border-color: var(--color-grey-25);\n border-style: solid;\n border-width: 1px;\n }\n .kol-accordion:focus-within {\n outline: 2px solid var(--color-blue);\n outline-offset: -2px;\n }\n .kol-accordion__heading-button .kol-button {\n display: flex;\n width: 100%;\n padding: 0 var(--spacing-m);\n place-items: center;\n line-height: 1.2;\n text-align: left;\n }\n .kol-accordion__heading-button .kol-button__text {\n color: var(--color-grey);\n width: 100%;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16)) 0;\n font-weight: var(--font-weight-bold);\n border: none;\n }\n .kol-accordion__heading-button .kol-button:focus, .kol-accordion__heading-button .kol-button:hover {\n background-color: var(--color-grey-25);\n }\n .kol-accordion__heading-button .kol-button:focus {\n outline: none;\n }\n .kol-accordion__heading-button .kol-icon {\n margin-top: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n margin-bottom: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n margin-inline-end: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n margin-inline-start: 0;\n }\n .kol-accordion__content {\n padding: var(--spacing-s) var(--spacing-m);\n }\n}";
|
|
1173
1174
|
|
|
1174
|
-
var css_248z$1j = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1175
|
+
var css_248z$1j = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
1175
1176
|
|
|
1176
|
-
var css_248z$1i = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1177
|
+
var css_248z$1i = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-badge {\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16) - 1 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 1 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal var(--font-weight) 1em var(--font-family);\n text-transform: uppercase;\n }\n}";
|
|
1177
1178
|
|
|
1178
|
-
var css_248z$1h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1179
|
+
var css_248z$1h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n .kol-breadcrumb {\n font: normal normal 400 calc(14 * 1rem / var(--kolibri-root-font-size, 16))/calc(16 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: var(--font-weight-bold);\n }\n .kol-breadcrumb__icon::part(icon separator)::before {\n color: var(--color-blue);\n }\n .kol-breadcrumb__icon[exportparts*=separator] {\n padding: 0;\n margin-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n margin-inline-start: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-breadcrumb__list-element:last-child {\n color: var(--color-grey-75);\n }\n}";
|
|
1179
1180
|
|
|
1180
|
-
var css_248z$1g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1181
|
+
var css_248z$1g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:hover {\n color: var(--color-blue-130);\n }\n .badge-text-hint {\n color: var(--color-text);\n background-color: var(--color-mute-variant);\n border-radius: 3px;\n padding: 0 0.3em;\n }\n}";
|
|
1181
1182
|
|
|
1182
|
-
var css_248z$1f = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n
|
|
1183
|
+
var css_248z$1f = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n}";
|
|
1183
1184
|
|
|
1184
|
-
var css_248z$1e = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1185
|
+
var css_248z$1e = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n display: inline-flex;\n padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);\n font-size: 1.25em;\n font-weight: 700;\n line-height: 1.75em;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}";
|
|
1185
1186
|
|
|
1186
|
-
var css_248z$1d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n
|
|
1187
|
+
var css_248z$1d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-blue);\n }\n .kol-custom-suggestions-option:focus {\n color: white;\n background-color: var(--color-blue);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-blue);\n border-style: solid;\n width: 100%;\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-combobox__group {\n color: var(--color-grey);\n display: inline-flex;\n width: 100%;\n min-height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n align-items: center;\n text-align: left;\n }\n .kol-combobox__input {\n position: relative;\n width: calc(100% - 24 * 1rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-combobox__input::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-combobox__input::placeholder {\n color: var(--color-grey-50);\n }\n .kol-combobox__input:first-child {\n padding-left: var(--spacing);\n }\n .kol-combobox__input:last-child {\n padding-right: var(--spacing);\n }\n .kol-combobox__input:focus {\n border: none;\n }\n}";
|
|
1187
1188
|
|
|
1188
|
-
var css_248z$1c = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1189
|
+
var css_248z$1c = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-details__heading-button:focus-within {\n cursor: pointer;\n }\n .kol-details__heading-button .kol-button .kol-span__label {\n border-bottom-color: #000;\n }\n .kol-details__heading-button .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-details__heading-button .kol-span__container {\n display: flex;\n gap: 0;\n text-align: left;\n }\n .kol-details__content.indented-text {\n margin: 0;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n }\n}";
|
|
1189
1190
|
|
|
1190
|
-
var css_248z$1b = "
|
|
1191
|
+
var css_248z$1b = "@layer kol-theme-component {\n .kol-drawer__wrapper {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
|
|
1191
1192
|
|
|
1192
|
-
var css_248z$1a = "@layer kol-theme-component {\n .kol-
|
|
1193
|
+
var css_248z$1a = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form {\n width: 100%;\n }\n .kol-form__link {\n display: inline-block;\n }\n .kol-form__mandatory-fields-hint {\n margin: 0;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: 0;\n border-inline-start: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) solid var(--color-yellow);\n border-start-start-radius: 0;\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
|
|
1193
1194
|
|
|
1194
|
-
var css_248z$19 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1195
|
+
var css_248z$19 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.25;\n }\n .kol-headline--h2 {\n font-size: calc(28 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.143;\n }\n .kol-headline--h3 {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.1667;\n }\n .kol-headline--h4 {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.4;\n }\n .kol-headline--h5 {\n font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.5;\n }\n .kol-headline--h6 {\n color: rgb(234, 0, 255);\n }\n}";
|
|
1195
1196
|
|
|
1196
|
-
var css_248z$18 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1197
|
+
var css_248z$18 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n color: var(--color-grey);\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-field-control--label-align-left .kol-field-control__label {\n padding-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right .kol-field-control__label {\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-checkbox .kol-input {\n color: var(--color-grey);\n background-color: var(--color-white);\n border-color: var(--color-grey-75);\n border-style: solid;\n border-width: 2px;\n line-height: 1.5;\n }\n .kol-checkbox .kol-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-checkbox .kol-input:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-checkbox .kol-input:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-checkbox .kol-input:checked:not(:disabled):hover {\n background-color: var(--color-blue-130);\n border-color: var(--color-blue-130);\n }\n .kol-checkbox .kol-input--error {\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:checked {\n background-color: var(--color-red);\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:not(:disabled):hover {\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:checked:not(:disabled):hover {\n background-color: var(--color-red-120);\n border-color: var(--color-red-120);\n }\n .kol-checkbox--variant-default {\n width: unset;\n min-width: unset;\n }\n .kol-checkbox--variant-default.kol-checkbox--checked .kol-icon {\n color: var(--color-white);\n }\n .kol-checkbox--variant-switch .kol-icon {\n color: var(--color-white);\n }\n .kol-checkbox--variant-switch .kol-input {\n display: block;\n }\n .kol-checkbox--variant-switch .kol-input::before {\n background-color: var(--color-grey-75);\n }\n .kol-checkbox--variant-switch.kol-checkbox--checked .kol-icon {\n color: #000;\n background-color: var(--color-white);\n }\n .kol-checkbox--variant-switch:hover .kol-input:not(:disabled)::before {\n background-color: var(--color-blue);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error .kol-icon {\n color: var(--color-white);\n background-color: var(--color-red);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error .kol-input::before {\n background-color: var(--color-red);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error.kol-checkbox--checked .kol-icon {\n color: #000;\n background-color: var(--color-white);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error:hover .kol-input:not(:disabled)::before {\n background-color: var(--color-red);\n }\n .kol-input-checkbox--variant-button {\n gap: var(--spacing-xs) 0;\n }\n .kol-input-checkbox--variant-button .kol-form-field__input {\n order: 1;\n }\n .kol-input-checkbox--variant-button .kol-form-field__hint {\n order: 2;\n }\n .kol-input-checkbox--variant-button .kol-form-field__msg {\n order: 3;\n }\n .kol-input-checkbox--variant-button:focus-within {\n outline-color: var(--color-blue-130);\n outline-style: solid;\n outline-width: 2px;\n }\n}";
|
|
1197
1198
|
|
|
1198
|
-
var css_248z$17 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-
|
|
1199
|
+
var css_248z$17 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n}\n.kol-input-color__input--text, .kol-input-color__input--color {\n background-color: var(--color-white);\n min-height: calc(var(--a11y-min-size) - 8 * 1rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
|
|
1199
1200
|
|
|
1200
|
-
var css_248z$16 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}
|
|
1201
|
+
var css_248z$16 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1201
1202
|
|
|
1202
1203
|
var css_248z$15 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1203
1204
|
|
|
1204
|
-
var css_248z$14 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1205
|
+
var css_248z$14 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n .kol-button__text {\n white-space: nowrap;\n }\n .kol-input-container {\n padding: 0 0 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
|
|
1205
1206
|
|
|
1206
|
-
var css_248z$13 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}
|
|
1207
|
+
var css_248z$13 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1207
1208
|
|
|
1208
1209
|
var css_248z$12 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1209
1210
|
|
|
1210
|
-
var css_248z$11 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-
|
|
1211
|
+
var css_248z$11 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n /**\n * normalizes the layout of form elements.\n */\n .kol-form-field {\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n border: 0;\n }\n /**\n * order the layout of form elements.\n */\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__input {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-form-field {\n padding: 0 calc(14 * 1rem / var(--kolibri-root-font-size, 16)) calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-wrap: wrap;\n align-items: flex-start;\n border: 0;\n }\n .kol-form-field__label {\n color: var(--color-grey);\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__input {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-field-control {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input:before {\n display: none;\n }\n .kol-input:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-input:focus {\n outline-color: var(--color-blue);\n }\n .kol-input:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input.kol-input--error {\n border: 2px solid var(--color-red);\n }\n .kol-input.kol-input--error:before {\n display: none;\n }\n .kol-input.kol-input--error:checked {\n border-color: var(--color-red);\n border-width: 7px;\n }\n .kol-input.kol-input--error:not(:disabled):hover {\n border-color: var(--color-red-1xx);\n }\n}";
|
|
1211
1212
|
|
|
1212
|
-
var css_248z$10 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n
|
|
1213
|
+
var css_248z$10 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}";
|
|
1213
1214
|
|
|
1214
|
-
var css_248z$$ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}";
|
|
1215
|
+
var css_248z$$ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1215
1216
|
|
|
1216
|
-
var css_248z$_ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1217
|
+
var css_248z$_ = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n color: var(--color-blue);\n text-decoration: underline;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
|
|
1217
1218
|
|
|
1218
|
-
var css_248z$Z = "
|
|
1219
|
+
var css_248z$Z = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
|
|
1219
1220
|
|
|
1220
|
-
var css_248z$Y = "@layer kol-theme-component {\n .kol-
|
|
1221
|
+
var css_248z$Y = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n display: inline-flex;\n padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);\n font-size: 1.25em;\n font-weight: 700;\n line-height: 1.75em;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}\n@layer kol-theme-component {\n .kol-modal__card {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
|
|
1221
1222
|
|
|
1222
|
-
var css_248z$X = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1223
|
+
var css_248z$X = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-nav__navigation {\n background-color: var(--color-blue);\n }\n .kol-nav__list {\n display: flex;\n margin: 0;\n padding: 0;\n list-style: none;\n }\n .kol-nav__list--vertical {\n flex-direction: column;\n }\n .kol-nav__list-item {\n border-color: var(--color-blue-75);\n border-style: solid;\n border-width: 0;\n }\n .kol-nav__list-item:not(:first-child), .kol-nav__list--nested .kol-nav__list-item {\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry {\n flex-grow: 1;\n }\n .kol-nav__expand-button .kol-button {\n background-color: var(--color-blue-130);\n height: 100%;\n margin: auto;\n }\n .kol-nav__expand-button--expanded .kol-icon::part(icon)::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::part(icon)::before {\n content: \"\\eab6\";\n }\n .kol-nav__toggle-button .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-nav__toggle-button .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-nav__toggle-button .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-nav__toggle-button .kol-button--ghost:hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color) !important;\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n text-decoration: none !important;\n }\n .kol-nav__toggle-button .kol-button--ghost:focus .kol-nav__toggle-button .kol-button__text {\n outline-offset: -2px;\n }\n .kol-link {\n text-decoration: none;\n }\n .kol-span {\n color: var(--color-white);\n border-color: transparent;\n border-style: solid;\n height: 100%;\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :is(.kol-button, .kol-link):focus-within .kol-span {\n border-color: var(--color-white);\n }\n :is(.kol-button, .kol-link):focus-within .kol-span, :is(.kol-button, .kol-link):hover .kol-span {\n text-decoration: underline;\n }\n}";
|
|
1223
1224
|
|
|
1224
|
-
var css_248z$W = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1225
|
+
var css_248z$W = "/* forward the rem function */\n@layer kol-theme-component {\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n}";
|
|
1225
1226
|
|
|
1226
|
-
var css_248z$V = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1227
|
+
var css_248z$V = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n}";
|
|
1227
1228
|
|
|
1228
|
-
var css_248z$U = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1229
|
+
var css_248z$U = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-progress__bar-progress {\n fill: var(--color-blue-130);\n }\n .kol-progress__cycle-background {\n stroke: var(--color-grey-25);\n }\n .kol-progress__cycle-progress {\n stroke: var(--color-blue-130);\n }\n}";
|
|
1229
1230
|
|
|
1230
|
-
var css_248z$T = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1231
|
+
var css_248z$T = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1231
1232
|
|
|
1232
|
-
var css_248z$S = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1233
|
+
var css_248z$S = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-blue);\n }\n .kol-custom-suggestions-option:focus {\n color: white;\n background-color: var(--color-blue);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-blue);\n border-style: solid;\n width: 100%;\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-single-select__group {\n color: var(--color-grey);\n display: inline-flex;\n width: 100%;\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n text-align: left;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 40 * 1rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-single-select__input::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-single-select__input::placeholder {\n color: var(--color-grey-50);\n }\n .kol-single-select__input:first-child {\n padding-left: var(--spacing);\n }\n .kol-single-select__input:last-child {\n padding-right: var(--spacing);\n }\n .kol-single-select__input:not(.disabled) .kol-single-select__input:hover {\n border-color: var(--color-blue);\n }\n .kol-single-select__input:focus {\n border: none;\n }\n}";
|
|
1233
1234
|
|
|
1234
|
-
var css_248z$R = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1235
|
+
var css_248z$R = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-skip-nav .kol-link__text {\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n border-style: solid;\n border-radius: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-weight: var(--font-weight-bold);\n line-height: 1;\n cursor: pointer;\n }\n}";
|
|
1235
1236
|
|
|
1236
|
-
var css_248z$Q = "/* forward the rem function */\n@layer kol-theme-component {\n .
|
|
1237
|
+
var css_248z$Q = "/* forward the rem function */\n@layer kol-theme-component {\n .cycle {\n padding: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .cycle span {\n background-color: var(--color-blue-75);\n }\n}";
|
|
1237
1238
|
|
|
1238
|
-
var css_248z$P = "/* forward the rem function */\n@layer kol-theme-component {\n .
|
|
1239
|
+
var css_248z$P = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-split-button {\n border-color: var(--color-blue);\n border-style: solid;\n border-radius: 0;\n border-width: 2px;\n }\n .kol-split-button .kol-popover__content {\n background-color: #fff;\n }\n .kol-split-button .kol-button .kol-span {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n }\n .kol-split-button__horizontal-line {\n border: 0;\n border-top: 1px solid var(--color-blue);\n }\n .kol-split-button .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-split-button .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-split-button .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-split-button .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-split-button .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-split-button .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-split-button .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-split-button .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-split-button .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-split-button .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-split-button .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-split-button .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-split-button .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-split-button .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-split-button .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-split-button .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-split-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-split-button .kol-button--secondary:focus .kol-split-button .kol-button__text {\n outline-offset: -6px;\n }\n .kol-split-button .kol-button--ghost:focus .kol-split-button .kol-button__text {\n outline-offset: -2px;\n }\n}";
|
|
1239
1240
|
|
|
1240
|
-
var css_248z$O = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1241
|
+
var css_248z$O = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n }\n .kol-table__scroll-container {\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination-wrapper {\n grid-auto-flow: column;\n }\n }\n .kol-table-stateful__pagination {\n grid-auto-flow: column;\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination .kol-table-stateful .kol-pagination {\n display: flex;\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n}";
|
|
1241
1242
|
|
|
1242
|
-
var css_248z$N = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n }\n .kol-table__scroll-container {\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n
|
|
1243
|
+
var css_248z$N = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination {\n display: grid;\n }\n .kol-pagination .kol-button {\n background-color: none;\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-pagination .kol-button__text {\n color: var(--color-black);\n background-color: var(--color-yellow);\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: 0.25em 0.75em;\n font-weight: var(--font-weight-bold);\n border: 2px solid var(--color-yellow);\n }\n .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: var(--color-yellow-120);\n border-color: var(--color-yellow-120);\n }\n .kol-pagination .kol-button:focus .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination__button--selected .kol-button:not(:disabled) {\n opacity: 1;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n }\n .kol-table__scroll-container {\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\n }\n .kol-table__cell--ascending, .kol-table__cell--descending {\n font-weight: 700;\n }\n .kol-table__cell--ascending .kol-button, .kol-table__cell--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n}";
|
|
1243
1244
|
|
|
1244
|
-
var css_248z$M = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1245
|
+
var css_248z$M = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__button-group {\n margin-bottom: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n border-bottom: 1px solid var(--color-grey-25);\n }\n .kol-tabs .kol-button {\n margin-bottom: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-tabs .kol-button:hover:not(:disabled) .kol-span {\n color: var(--color-blue-130);\n }\n .kol-tabs .kol-button:focus .kol-span {\n outline: var(--color-blue-130) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs .kol-button.selected .kol-span {\n color: var(--color-blue);\n box-shadow: 0 -3px var(--color-blue);\n border-color: var(--color-grey-25);\n border-style: solid;\n border-top-color: var(--color-blue);\n border-bottom-color: white;\n border-width: 1px;\n font-weight: var(--font-weight-bold);\n }\n .kol-tabs .kol-button .kol-span {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
1245
1246
|
|
|
1246
|
-
var css_248z$L = "/* forward the rem function */\n@layer kol-theme-component {\n :
|
|
1247
|
+
var css_248z$L = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1247
1248
|
|
|
1248
|
-
var css_248z$K = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-
|
|
1249
|
+
var css_248z$K = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(440 * 1rem / var(--kolibri-root-font-size, 16));\n max-width: 100%;\n }\n .kol-toast-item .kol-alert--variant-msg {\n border: none;\n }\n .kol-toast-item .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-toast-item .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-toast-item .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-toast-item .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-toast-item .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-toast-item .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-msg .kol-toast-item .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-toast-item .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-msg .kol-toast-item .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n background-color: #fff;\n display: block;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item__alert {\n display: block;\n }\n}";
|
|
1249
1250
|
|
|
1250
|
-
var css_248z$J = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1251
|
+
var css_248z$J = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-button--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-button--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-button--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-button--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-button--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-button--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button--secondary:focus .kol-button__text {\n outline-offset: -6px;\n }\n .kol-button--ghost:focus .kol-button__text {\n outline-offset: -2px;\n }\n .kol-link {\n outline: none;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:focus {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link {\n --text-focus-outline-color: var(--color-black);\n }\n .kol-link--primary {\n --text-background-color: var(--color-blue);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-white);\n }\n .kol-link--primary:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: var(--color-blue-130);\n --text-border-color: var(--color-blue-130);\n }\n .kol-link--secondary {\n --text-background-color: var(--color-white);\n --text-border-color: var(--color-blue);\n --text-color: var(--color-blue);\n }\n .kol-link--secondary:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-border-color: var(--color-blue-130);\n --text-color: var(--color-blue-130);\n }\n .kol-link--normal {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n .kol-link--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-link--danger:focus {\n --text-focus-outline-color: var(--color-white);\n }\n .kol-link--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-background-color: transparent;\n --text-border-color: transparent;\n --text-color: var(--color-blue);\n }\n .kol-link--ghost:focus {\n --text-focus-outline-color: var(--color-blue);\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-background-color: unset;\n --text-border-color: transparent;\n --text-color: var(--color-blue-130);\n }\n .kol-link__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-style: solid;\n border-radius: 0;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: 0.25em 0.75em;\n border-width: 2px;\n font-weight: var(--font-weight-bold);\n line-height: 1.2;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-link--secondary:focus .kol-link__text {\n outline-offset: -6px;\n }\n .kol-link--ghost:focus .kol-link__text {\n outline-offset: -2px;\n }\n .kol-toolbar {\n background-color: var(--color-grey-5);\n border-color: var(--color-grey-25);\n border-style: solid;\n padding: var(--spacing-s);\n border-width: 1px;\n }\n .kol-link {\n --text-background-color: var(--color-yellow);\n --text-border-color: var(--color-yellow);\n --text-color: var(--color-black);\n }\n .kol-link:hover {\n --text-background-color: var(--color-yellow-120);\n --text-border-color: var(--color-yellow-120);\n }\n}";
|
|
1251
1252
|
|
|
1252
|
-
var css_248z$I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1253
|
+
var css_248z$I = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree-item__children {\n display: flex;\n flex-direction: column;\n }\n .kol-tree-item__link {\n display: block;\n border: 2px solid transparent;\n }\n .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n background-color: var(--color-sky);\n border: 2px solid var(--color-yellow-120);\n }\n .kol-tree-item__link:hover .kol-link, .kol-tree-item__link:focus-within .kol-link {\n color: var(--color-black);\n }\n .kol-tree-item__link--active {\n background-color: var(--color-yellow);\n font-weight: 700;\n }\n .kol-tree-item__link--active .kol-link {\n color: var(--color-black);\n background-color: var(--color-yellow);\n }\n .kol-tree-item__link .kol-link {\n color: var(--color-black);\n text-align: left;\n }\n .kol-tree-item__link .kol-link:focus {\n color: var(--color-black);\n }\n .kol-tree-item__toggle-button:hover .kol-tree-item__toggle-button-icon::part(icon) {\n transform: scale(1.3);\n }\n .kol-tree-item__text {\n text-decoration: none;\n }\n}";
|
|
1253
1254
|
|
|
1254
1255
|
var css_248z$H = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree__treeview-navigation {\n display: flex;\n flex-direction: column;\n }\n}";
|
|
1255
1256
|
|
|
1256
|
-
var css_248z$G = "/* forward the rem function */\n@layer kol-theme-
|
|
1257
|
+
var css_248z$G = "/* forward the rem function */\n@layer kol-theme-global {\n .kol-tooltip__arrow {\n background-color: #626262;\n }\n .kol-tooltip__content {\n background-color: #f2f2f2;\n border-radius: 2px;\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.2;\n border: 1px solid #626262;\n }\n :host {\n --color-blue: #004494;\n --color-yellow: #ffd617;\n --color-grey: #404040;\n --color-blue-130: #002f67;\n --color-blue-120: #003776;\n --color-blue-110: #003d84;\n --color-blue-100: var(--color-blue);\n --color-blue-75: #4073af;\n --color-blue-50: #bfd0e4;\n --color-blue-25: #bfd0e4;\n --color-blue-5: #f2f5f9;\n --color-yellow-120: #f8ae21;\n --color-yellow-110: #fbc11d;\n --color-yellow-100: var(--color-yellow);\n --color-yellow-75: #ffde39;\n --color-yellow-50: #ffe879;\n --color-yellow-25: #fff4bb;\n --color-grey-100: var(--color-grey);\n --color-grey-75: #707070;\n --color-grey-50: #9f9f9f;\n --color-grey-25: #cfcfcf;\n --color-grey-20: #d9d9d9;\n --color-grey-15: #e3e3e3;\n --color-grey-10: #ebebeb;\n --color-grey-5: #f5f5f5;\n --color-grey-3: #f9f9f9;\n --color-blue-n: #006fb4;\n --color-orange: #f29527;\n --color-green: #467a39;\n --color-red: #da2131;\n --color-red-1xx: #981722;\n --color-black: #000;\n --color-white: #fff;\n --font-family: Arial, sans-serif;\n --font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --font-weight: 400;\n --font-weight-bold: 600;\n --line-height-regular: 1.5;\n --line-height-heading: 1.2;\n --spacing-4xl: calc(64 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-3xl: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-2xl: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-xl: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-l: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-m: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-s: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-xs: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-2xs: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n }\n a,\n button {\n outline: none;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n font-weight: var(--font-weight-bold);\n line-height: var(--line-height-heading);\n }\n p {\n font-weight: var(--font-weight);\n }\n .kol-span,\n .kol-span__container {\n gap: 0.5em;\n }\n .required label span::after,\n .required legend span::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .badge-text-hint {\n border-radius: 3px;\n padding: 0 0.3em;\n }\n}";
|
|
1257
1258
|
|
|
1258
1259
|
const ECL_EC = KoliBri.createTheme('ecl-ec', {
|
|
1259
|
-
GLOBAL: css_248z$
|
|
1260
|
-
'KOL-ACCORDION': css_248z$
|
|
1261
|
-
'KOL-ALERT': css_248z$
|
|
1262
|
-
'KOL-BADGE': css_248z$
|
|
1263
|
-
'KOL-BREADCRUMB': css_248z$
|
|
1260
|
+
GLOBAL: css_248z$G,
|
|
1261
|
+
'KOL-ACCORDION': css_248z$1k,
|
|
1262
|
+
'KOL-ALERT': css_248z$1j,
|
|
1263
|
+
'KOL-BADGE': css_248z$1i,
|
|
1264
|
+
'KOL-BREADCRUMB': css_248z$1h,
|
|
1264
1265
|
'KOL-BUTTON': css_248z$1f,
|
|
1265
|
-
'KOL-BUTTON-LINK': css_248z$
|
|
1266
|
-
'KOL-CARD': css_248z$
|
|
1267
|
-
'KOL-COMBOBOX': css_248z$
|
|
1268
|
-
'KOL-DETAILS': css_248z$
|
|
1269
|
-
'KOL-DRAWER': css_248z$
|
|
1270
|
-
'KOL-FORM': css_248z$
|
|
1271
|
-
'KOL-HEADING': css_248z$
|
|
1272
|
-
'KOL-INPUT-CHECKBOX': css_248z$
|
|
1273
|
-
'KOL-INPUT-COLOR': css_248z$
|
|
1274
|
-
'KOL-INPUT-DATE': css_248z$
|
|
1275
|
-
'KOL-INPUT-EMAIL': css_248z$
|
|
1276
|
-
'KOL-INPUT-FILE': css_248z$
|
|
1277
|
-
'KOL-INPUT-NUMBER': css_248z$
|
|
1278
|
-
'KOL-INPUT-PASSWORD': css_248z$
|
|
1279
|
-
'KOL-INPUT-RADIO': css_248z$
|
|
1280
|
-
'KOL-INPUT-RANGE': css_248z
|
|
1281
|
-
'KOL-INPUT-TEXT': css_248z
|
|
1282
|
-
'KOL-LINK': css_248z$
|
|
1283
|
-
'KOL-LINK-BUTTON': css_248z$
|
|
1284
|
-
'KOL-MODAL': css_248z$
|
|
1285
|
-
'KOL-NAV': css_248z$
|
|
1286
|
-
'KOL-PAGINATION': css_248z$
|
|
1287
|
-
'KOL-POPOVER-BUTTON': css_248z$
|
|
1288
|
-
'KOL-PROGRESS': css_248z$
|
|
1289
|
-
'KOL-SELECT': css_248z$
|
|
1290
|
-
'KOL-SINGLE-SELECT': css_248z$
|
|
1291
|
-
'KOL-SKIP-NAV': css_248z$
|
|
1292
|
-
'KOL-SPIN': css_248z$
|
|
1293
|
-
'KOL-SPLIT-BUTTON': css_248z$
|
|
1294
|
-
'KOL-TABLE-STATEFUL': css_248z$
|
|
1295
|
-
'KOL-TABLE-STATELESS': css_248z$
|
|
1296
|
-
'KOL-TABS': css_248z$
|
|
1297
|
-
'KOL-TEXTAREA': css_248z$
|
|
1298
|
-
'KOL-TOAST-CONTAINER': css_248z$
|
|
1299
|
-
'KOL-TOOLBAR': css_248z$
|
|
1266
|
+
'KOL-BUTTON-LINK': css_248z$1g,
|
|
1267
|
+
'KOL-CARD': css_248z$1e,
|
|
1268
|
+
'KOL-COMBOBOX': css_248z$1d,
|
|
1269
|
+
'KOL-DETAILS': css_248z$1c,
|
|
1270
|
+
'KOL-DRAWER': css_248z$1b,
|
|
1271
|
+
'KOL-FORM': css_248z$1a,
|
|
1272
|
+
'KOL-HEADING': css_248z$19,
|
|
1273
|
+
'KOL-INPUT-CHECKBOX': css_248z$18,
|
|
1274
|
+
'KOL-INPUT-COLOR': css_248z$17,
|
|
1275
|
+
'KOL-INPUT-DATE': css_248z$16,
|
|
1276
|
+
'KOL-INPUT-EMAIL': css_248z$15,
|
|
1277
|
+
'KOL-INPUT-FILE': css_248z$14,
|
|
1278
|
+
'KOL-INPUT-NUMBER': css_248z$13,
|
|
1279
|
+
'KOL-INPUT-PASSWORD': css_248z$12,
|
|
1280
|
+
'KOL-INPUT-RADIO': css_248z$11,
|
|
1281
|
+
'KOL-INPUT-RANGE': css_248z$10,
|
|
1282
|
+
'KOL-INPUT-TEXT': css_248z$$,
|
|
1283
|
+
'KOL-LINK': css_248z$Z,
|
|
1284
|
+
'KOL-LINK-BUTTON': css_248z$_,
|
|
1285
|
+
'KOL-MODAL': css_248z$Y,
|
|
1286
|
+
'KOL-NAV': css_248z$X,
|
|
1287
|
+
'KOL-PAGINATION': css_248z$W,
|
|
1288
|
+
'KOL-POPOVER-BUTTON': css_248z$V,
|
|
1289
|
+
'KOL-PROGRESS': css_248z$U,
|
|
1290
|
+
'KOL-SELECT': css_248z$T,
|
|
1291
|
+
'KOL-SINGLE-SELECT': css_248z$S,
|
|
1292
|
+
'KOL-SKIP-NAV': css_248z$R,
|
|
1293
|
+
'KOL-SPIN': css_248z$Q,
|
|
1294
|
+
'KOL-SPLIT-BUTTON': css_248z$P,
|
|
1295
|
+
'KOL-TABLE-STATEFUL': css_248z$O,
|
|
1296
|
+
'KOL-TABLE-STATELESS': css_248z$N,
|
|
1297
|
+
'KOL-TABS': css_248z$M,
|
|
1298
|
+
'KOL-TEXTAREA': css_248z$L,
|
|
1299
|
+
'KOL-TOAST-CONTAINER': css_248z$K,
|
|
1300
|
+
'KOL-TOOLBAR': css_248z$J,
|
|
1300
1301
|
'KOL-TREE': css_248z$H,
|
|
1301
|
-
'KOL-TREE-ITEM': css_248z$
|
|
1302
|
+
'KOL-TREE-ITEM': css_248z$I,
|
|
1302
1303
|
});
|
|
1303
1304
|
|
|
1304
|
-
var css_248z$F = "/* forward the rem function */\n@layer kol-theme-
|
|
1305
|
+
var css_248z$F = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-accordion {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-radius: 8px;\n margin: 0;\n }\n .kol-accordion:focus-within {\n outline: 2px solid var(--color-blue);\n outline-offset: -1px;\n }\n .kol-accordion__heading {\n font-size: 2em;\n }\n .kol-accordion__heading-button .kol-button {\n color: #171a22;\n border-radius: 8px;\n border-bottom-color: #cfdaf5;\n display: block;\n position: relative;\n width: 100%;\n padding: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(18 * 1rem / var(--kolibri-root-font-size, 16))/calc(28 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n line-height: 1.2;\n border: 0;\n border-bottom-style: solid;\n outline-offset: -1px;\n text-align: start;\n }\n .kol-accordion__heading-button .kol-button__text {\n align-items: baseline;\n }\n .kol-accordion__heading-button .kol-button::before {\n background-color: #fc0;\n position: absolute;\n top: 0;\n left: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(6 * 1rem / var(--kolibri-root-font-size, 16));\n height: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n content: \"\";\n border-end-end-radius: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: calc(2 * 1rem / 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 margin-right: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-accordion__heading-button .kol-icon::part(icon)::before {\n color: #0e47cb;\n font-family: \"Font Awesome 6 Free\";\n font-weight: 900;\n }\n .kol-accordion__content {\n color: #515560;\n padding: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(24 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n border-inline-start: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n border-bottom: 2px solid #cfdaf5;\n -webkit-border-start: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n margin-inline-start: 0;\n -webkit-margin-start: 0;\n }\n .collapsible--open .kol-accordion__heading-button .kol-button {\n border-start-end-radius: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n border-start-start-radius: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .collapsible--open .kol-accordion__heading-button .kol-icon::part(icon)::before {\n content: \"\\f077\";\n }\n :not(.collapsible--open) .kol-accordion__heading-button .kol-button .kol-icon::part(icon)::before {\n content: \"\\f078\";\n }\n}";
|
|
1305
1306
|
|
|
1306
|
-
var css_248z$E = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1307
|
+
var css_248z$E = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
1307
1308
|
|
|
1308
|
-
var css_248z$D = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1309
|
+
var css_248z$D = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-badge {\n padding: calc(8 * 1rem / var(--kolibri-root-font-size, 16) - 1 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 1 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal var(--font-weight) calc(14 * 1rem / var(--kolibri-root-font-size, 16))/1em var(--font-family);\n text-transform: uppercase;\n }\n}";
|
|
1309
1310
|
|
|
1310
|
-
var css_248z$C = "
|
|
1311
|
+
var css_248z$C = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
|
|
1311
1312
|
|
|
1312
|
-
var css_248z$B = "@layer kol-theme-component {\n .kol-
|
|
1313
|
+
var css_248z$B = "@layer kol-theme-component {\n .kol-button {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button:hover {\n color: var(--color-blue-130);\n }\n}";
|
|
1313
1314
|
|
|
1314
1315
|
var css_248z$A = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n}";
|
|
1315
1316
|
|
|
1316
|
-
var css_248z$z = "@layer kol-theme-component {\n .kol-
|
|
1317
|
+
var css_248z$z = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n display: inline-flex;\n padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);\n font-size: 1.25em;\n font-weight: 700;\n line-height: 1.75;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}";
|
|
1317
1318
|
|
|
1318
|
-
var css_248z$y = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n
|
|
1319
|
+
var css_248z$y = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-blue);\n }\n .kol-custom-suggestions-option:focus {\n color: white;\n background-color: var(--color-blue);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8 * 1rem / var(--kolibri-root-font-size, 16));\n left: calc(-8 * 1rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-combobox__group {\n color: var(--color-grey);\n display: inline-flex;\n width: 100%;\n min-height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n text-align: left;\n }\n .kol-combobox__input {\n position: relative;\n width: calc(100% - 24 * 1rem / var(--kolibri-root-font-size, 16));\n flex-grow: 1;\n border: none;\n }\n .kol-combobox__input::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-combobox__input::placeholder {\n color: var(--color-grey-50);\n }\n .kol-combobox__input:first-child {\n padding-left: var(--spacing);\n }\n .kol-combobox__input:last-child {\n padding-right: var(--spacing);\n }\n .kol-combobox__input:focus {\n border: none;\n }\n}";
|
|
1319
1320
|
|
|
1320
|
-
var css_248z$x = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1321
|
+
var css_248z$x = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-details__heading-button:focus-within {\n cursor: pointer;\n }\n .kol-details__heading-button .kol-button .kol-span__label {\n border-bottom-color: #000;\n }\n .kol-details__heading-button .kol-icon {\n font-size: calc(19.2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-details__heading-button .kol-span__container {\n display: flex;\n gap: 0;\n text-align: left;\n }\n .kol-details__content.indented-text {\n display: inline-block;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-inline-start: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n -webkit-border-start: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n border-start-start-radius: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n -webkit-padding-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n }\n}";
|
|
1321
1322
|
|
|
1322
|
-
var css_248z$w = "
|
|
1323
|
+
var css_248z$w = "@layer kol-theme-component {\n .kol-drawer__wrapper {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
|
|
1323
1324
|
|
|
1324
|
-
var css_248z$v = "@layer kol-theme-component {\n .kol-
|
|
1325
|
+
var css_248z$v = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form {\n width: 100%;\n }\n .kol-form__link {\n display: inline-block;\n }\n .kol-form__mandatory-fields-hint {\n display: inline-block;\n padding-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-end-start-radius: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-inline-start: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n -webkit-border-start: calc(8 * 1rem / var(--kolibri-root-font-size, 16)) solid #0e47cb;\n border-start-start-radius: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n -webkit-padding-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form__alert .kol-alert__heading {\n display: flex;\n place-items: center;\n }\n}";
|
|
1325
1326
|
|
|
1326
|
-
var css_248z$u = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1327
|
+
var css_248z$u = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-headline--h1 {\n font-size: calc(42 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 3.25;\n }\n .kol-headline--h2 {\n font-size: calc(36 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 2.755;\n }\n .kol-headline--h3 {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 2.5;\n }\n .kol-headline--h4 {\n font-size: calc(28 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 2;\n }\n .kol-headline--h5 {\n font-size: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.75;\n }\n .kol-headline--h6 {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.75;\n }\n .kol-headline--h1, .kol-headline--h2, .kol-headline--h3, .kol-headline--h4, .kol-headline--h5, .kol-headline--h6 {\n font-weight: var(--font-weight-bold);\n }\n}";
|
|
1327
1328
|
|
|
1328
|
-
var css_248z$t = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1329
|
+
var css_248z$t = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field {\n color: var(--color-grey);\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-field-control--label-align-left .kol-field-control__label {\n padding-right: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control--label-align-right .kol-field-control__label {\n padding-left: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-field-control__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-checkbox .kol-input {\n color: var(--color-grey);\n background-color: var(--color-white);\n border-color: var(--color-grey-75);\n border-style: solid;\n border-width: 2px;\n line-height: 1.5;\n }\n .kol-checkbox .kol-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-checkbox .kol-input:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-checkbox .kol-input:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-checkbox .kol-input:checked:not(:disabled):hover {\n background-color: var(--color-blue-130);\n border-color: var(--color-blue-130);\n }\n .kol-checkbox .kol-input--error {\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:checked {\n background-color: var(--color-red);\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:not(:disabled):hover {\n border-color: var(--color-red);\n }\n .kol-checkbox .kol-input--error:checked:not(:disabled):hover {\n background-color: var(--color-red-120);\n border-color: var(--color-red-120);\n }\n .kol-checkbox--variant-default {\n width: unset;\n min-width: unset;\n }\n .kol-checkbox--variant-default.kol-checkbox--checked .kol-icon {\n color: var(--color-white);\n }\n .kol-checkbox--variant-switch .kol-icon {\n color: var(--color-white);\n }\n .kol-checkbox--variant-switch .kol-input {\n display: block;\n }\n .kol-checkbox--variant-switch .kol-input::before {\n background-color: var(--color-grey-75);\n }\n .kol-checkbox--variant-switch:hover .kol-input:not(:disabled)::before {\n background-color: var(--color-blue);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error .kol-icon {\n color: var(--color-white);\n background-color: var(--color-red);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error .kol-input::before {\n background-color: var(--color-red);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error.kol-checkbox--checked .kol-icon {\n color: #000;\n background-color: var(--color-white);\n }\n .kol-checkbox--variant-switch.kol-checkbox--error:hover .kol-input:not(:disabled)::before {\n background-color: var(--color-red);\n }\n .kol-input-checkbox--variant-button {\n gap: var(--spacing-xs) 0;\n }\n .kol-input-checkbox--variant-button .kol-form-field__input {\n order: 1;\n }\n .kol-input-checkbox--variant-button .kol-form-field__hint {\n order: 2;\n }\n .kol-input-checkbox--variant-button .kol-form-field__msg {\n order: 3;\n }\n .kol-input-checkbox--variant-button:focus-within {\n outline-color: var(--color-blue-130);\n outline-style: solid;\n outline-width: 2px;\n }\n}";
|
|
1329
1330
|
|
|
1330
|
-
var css_248z$s = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-
|
|
1331
|
+
var css_248z$s = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n.kol-input-color__inputs-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n}\n.kol-input-color__input--text, .kol-input-color__input--color {\n background-color: var(--color-white);\n min-height: calc(var(--a11y-min-size) - 8 * 1rem / var(--kolibri-root-font-size, 16));\n border: 1px solid var(--color-blue);\n}";
|
|
1331
1332
|
|
|
1332
|
-
var css_248z$r = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}
|
|
1333
|
+
var css_248z$r = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1333
1334
|
|
|
1334
1335
|
var css_248z$q = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1335
1336
|
|
|
1336
|
-
var css_248z$p = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1337
|
+
var css_248z$p = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-button__text {\n border-radius: 0;\n white-space: nowrap;\n }\n .kol-input-container {\n padding: 0 0 0 calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input-container--is-dragover {\n border-color: var(--color-blue);\n }\n}";
|
|
1337
1338
|
|
|
1338
|
-
var css_248z$o = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}
|
|
1339
|
+
var css_248z$o = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1339
1340
|
|
|
1340
1341
|
var css_248z$n = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1341
1342
|
|
|
1342
|
-
var css_248z$m = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-
|
|
1343
|
+
var css_248z$m = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n /**\n * normalizes the layout of form elements.\n */\n .kol-form-field {\n margin: 0;\n padding: 0;\n flex-wrap: wrap;\n border: 0;\n }\n /**\n * order the layout of form elements.\n */\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__input {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__hint {\n order: 4;\n }\n .kol-form-field {\n padding: 0 calc(14 * 1rem / var(--kolibri-root-font-size, 16)) calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-wrap: wrap;\n align-items: flex-start;\n border: 0;\n }\n .kol-form-field__label {\n color: var(--color-grey);\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14.4 * 1rem / var(--kolibri-root-font-size, 16));\n font-style: italic;\n }\n .kol-form-field__input {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-field-control {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-input {\n outline: 2px solid var(--color-grey-75);\n outline-offset: 2px;\n }\n .kol-input:before {\n display: none;\n }\n .kol-input:checked {\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-input:focus {\n outline-color: var(--color-blue);\n }\n .kol-input:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input.kol-input--error {\n border: 2px solid var(--color-red);\n }\n .kol-input.kol-input--error:before {\n display: none;\n }\n .kol-input.kol-input--error:checked {\n border-color: var(--color-red);\n border-width: 7px;\n }\n .kol-input.kol-input--error:not(:disabled):hover {\n border-color: var(--color-red-1xx);\n }\n}";
|
|
1343
1344
|
|
|
1344
|
-
var css_248z$l = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n
|
|
1345
|
+
var css_248z$l = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input-range__inputs-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
1345
1346
|
|
|
1346
|
-
var css_248z$k = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input-
|
|
1347
|
+
var css_248z$k = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1347
1348
|
|
|
1348
|
-
var css_248z$j = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1349
|
+
var css_248z$j = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-link {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-link--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-link--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-link--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-link__text:active, .kol-link__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-link--secondary .kol-link__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-link--secondary.button:focus-visible .kol-link__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-link:focus-visible .kol-link__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n}";
|
|
1349
1350
|
|
|
1350
|
-
var css_248z$i = "
|
|
1351
|
+
var css_248z$i = "@layer kol-theme-component {\n .kol-link {\n color: var(--color-blue);\n line-height: 1.2;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link:hover {\n color: var(--color-blue-130);\n }\n}";
|
|
1351
1352
|
|
|
1352
|
-
var css_248z$h = "@layer kol-theme-component {\n .kol-
|
|
1353
|
+
var css_248z$h = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-card {\n background-color: white;\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n display: grid;\n width: 100%;\n height: 100%;\n grid-template-rows: min-content 2fr min-content;\n }\n .kol-card__header {\n display: inline-flex;\n padding: var(--spacing-m) var(--spacing-m) var(--spacing-xs) var(--spacing-m);\n font-size: 1.25em;\n font-weight: 700;\n line-height: 1.75;\n font-style: normal;\n }\n .kol-card__content {\n padding: var(--spacing-xs) var(--spacing-m) var(--spacing-m);\n }\n}\n@layer kol-theme-component {\n .kol-modal__card {\n box-shadow: 0 0 calc(var(--spacing-2xs) / 2) var(--color-black);\n }\n}";
|
|
1353
1354
|
|
|
1354
|
-
var css_248z$g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1355
|
+
var css_248z$g = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-nav__navigation {\n background-color: var(--color-blue);\n }\n .kol-nav__list {\n display: flex;\n margin: 0;\n padding: 0;\n list-style: none;\n }\n .kol-nav__list--vertical {\n flex-direction: column;\n }\n .kol-nav__list-item {\n border-color: var(--color-blue-75);\n border-style: solid;\n border-width: 0;\n }\n .kol-nav__list-item:not(:first-child), .kol-nav__list--nested .kol-nav__list-item {\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-nav__entry-wrapper {\n display: flex;\n }\n .kol-nav__entry {\n flex-grow: 1;\n }\n .kol-nav__expand-button .kol-button {\n background-color: var(--color-blue-130);\n height: 100%;\n margin: auto;\n }\n .kol-nav__expand-button--expanded .kol-icon::part(icon)::before {\n content: \"\\eab4\";\n }\n .kol-nav__expand-button:not(.kol-nav__expand-button--expanded) .kol-icon::part(icon)::before {\n content: \"\\eab6\";\n }\n .kol-nav__toggle-button .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-nav__toggle-button .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-nav__toggle-button .kol-button--ghost:hover {\n --text-color: #0e47cb;\n }\n .kol-nav__toggle-button .kol-button:focus {\n outline: none;\n }\n .kol-nav__toggle-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-radius: 4px;\n min-width: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n min-height: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n text-decoration: none !important;\n }\n .kol-nav__toggle-button .kol-button__text:active, .kol-nav__toggle-button .kol-button__text:hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-nav__toggle-button .kol-button:focus-visible .kol-nav__toggle-button .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-nav__toggle-button .kol-button--hide-label .kol-nav__toggle-button .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-link {\n text-decoration: none;\n }\n .kol-span {\n color: var(--color-white);\n border-color: transparent;\n border-style: solid;\n height: 100%;\n padding: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n justify-items: start;\n font-size: calc(18 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :is(.kol-button, .kol-link):focus-within .kol-span {\n border-color: var(--color-white);\n }\n :is(.kol-button, .kol-link):focus-within .kol-span, :is(.kol-button, .kol-link):hover .kol-span {\n text-decoration: underline;\n }\n}";
|
|
1355
1356
|
|
|
1356
|
-
var css_248z$f = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1357
|
+
var css_248z$f = "/* forward the rem function */\n@layer kol-theme-component {\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-pagination .kol-button:focus {\n outline: none;\n }\n .kol-pagination .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:not(:disabled):active .kol-button__text, .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n font-weight: bold;\n text-decoration: underline;\n }\n .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-button:not(:disabled):active .kol-button__text, .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n font-weight: bold;\n text-decoration: underline;\n }\n .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n}";
|
|
1357
1358
|
|
|
1358
|
-
var css_248z$e = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1359
|
+
var css_248z$e = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n}";
|
|
1359
1360
|
|
|
1360
|
-
var css_248z$d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1361
|
+
var css_248z$d = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1361
1362
|
|
|
1362
|
-
var css_248z$c = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1363
|
+
var css_248z$c = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-custom-suggestions-option {\n display: flex;\n min-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n padding: calc(10 * 1rem / var(--kolibri-root-font-size, 16)) calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n align-items: center;\n line-height: 1.2;\n }\n .kol-custom-suggestions-option[aria-selected] {\n color: var(--color-blue);\n }\n .kol-custom-suggestions-option:focus {\n color: white;\n background-color: var(--color-blue);\n outline: 0;\n }\n .kol-custom-suggestions-options-group {\n border-color: var(--color-subtle);\n border-style: solid;\n border-radius: var(--border-radius);\n right: calc(-8 * 1rem / var(--kolibri-root-font-size, 16));\n left: calc(-8 * 1rem / var(--kolibri-root-font-size, 16));\n max-height: calc(40 * 1rem / var(--kolibri-root-font-size, 16) * 5 + 2 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 1px;\n }\n .kol-custom-suggestions-toggle {\n display: grid;\n padding-right: 1em;\n padding-left: 1em;\n place-items: center;\n }\n .kol-custom-suggestions-toggle:focus {\n outline: 0;\n }\n .kol-single-select__group {\n color: var(--color-grey);\n display: inline-flex;\n width: 100%;\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n }\n .kol-single-select__input {\n position: relative;\n width: calc(100% - 2.5rem);\n flex-grow: 1;\n border: none;\n }\n .kol-single-select__input::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-single-select__input::placeholder {\n color: var(--color-grey-50);\n }\n .kol-single-select__input:first-child {\n padding-left: var(--spacing);\n }\n .kol-single-select__input:last-child {\n padding-right: var(--spacing);\n }\n .kol-single-select__input:not(.disabled) .kol-single-select__input:hover {\n border-color: var(--color-blue);\n }\n .kol-single-select__input:focus {\n border: none;\n }\n}";
|
|
1363
1364
|
|
|
1364
|
-
var css_248z$b = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1365
|
+
var css_248z$b = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-skip-nav .kol-link__text {\n color: #fff;\n background-color: #0e47cb;\n border-radius: 4px;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1;\n cursor: pointer;\n }\n}";
|
|
1365
1366
|
|
|
1366
|
-
var css_248z$a = "/* forward the rem function */\n@layer kol-theme-component {\n .
|
|
1367
|
+
var css_248z$a = "/* forward the rem function */\n@layer kol-theme-component {\n .cycle {\n padding: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .cycle span {\n background-color: var(--color-blue-80);\n }\n}";
|
|
1367
1368
|
|
|
1368
|
-
var css_248z$9 = "/* forward the rem function */\n@layer kol-theme-component {\n .
|
|
1369
|
+
var css_248z$9 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-split-button {\n border-color: var(--color-blue);\n border-style: solid;\n border-radius: 4px;\n border-width: 2px;\n }\n .kol-split-button__horizontal-line {\n border: 0;\n border-top: 1px solid var(--color-blue);\n }\n .kol-split-button .kol-popover__content {\n background-color: #fff;\n }\n .kol-split-button .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-split-button .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-split-button .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-split-button .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-split-button .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-split-button .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-split-button .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-split-button .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-split-button .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-split-button .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-split-button .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-split-button .kol-button:focus {\n outline: none;\n }\n .kol-split-button .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-split-button .kol-button__text:active, .kol-split-button .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-split-button .kol-button--secondary .kol-split-button .kol-button__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-split-button .kol-button--secondary.button:focus-visible .kol-split-button .kol-button__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-split-button .kol-button:focus-visible .kol-split-button .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-split-button .kol-button--hide-label .kol-split-button .kol-button__text .kol-span__label {\n display: none;\n }\n}";
|
|
1369
1370
|
|
|
1370
|
-
var css_248z$8 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1371
|
+
var css_248z$8 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-pagination .kol-button:focus {\n outline: none;\n }\n .kol-pagination .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:not(:disabled):active .kol-button__text, .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n font-weight: bold;\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\n }\n .kol-table__cell--header--ascending, .kol-table__cell--header--descending {\n font-weight: 700;\n }\n .kol-table__cell--header--ascending .kol-button, .kol-table__cell--header--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n outline-offset: 2px;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n outline: 2px solid var(--color-blue);\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination-wrapper {\n grid-auto-flow: column;\n }\n }\n .kol-table-stateful__pagination {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n grid-auto-flow: column;\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination .kol-table-stateful .kol-pagination {\n display: flex;\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n}";
|
|
1371
1372
|
|
|
1372
|
-
var css_248z$7 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-pagination .kol-button:focus {\n outline: none;\n }\n .kol-pagination .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:not(:disabled):active .kol-button__text, .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n font-weight: bold;\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\n }\n .kol-table__cell--header--ascending, .kol-table__cell--header--descending {\n font-weight: 700;\n }\n .kol-table__cell--header--ascending .kol-button, .kol-table__cell--header--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n outline-offset: 2px;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n outline: 2px solid var(--color-blue);\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n
|
|
1373
|
+
var css_248z$7 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n @media (min-width: 1024px) {\n .kol-table-stateful__pagination, .kol-table-stateful__pagination-wrapper {\n gap: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n }\n .kol-pagination .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n border-radius: 4px;\n }\n .kol-pagination .kol-button:focus {\n outline: none;\n }\n .kol-pagination .kol-button:focus-visible .kol-button__text {\n outline: 2px solid var(--color-black);\n outline-offset: -4px;\n }\n .kol-pagination .kol-button:not(:disabled):active .kol-button__text, .kol-pagination .kol-button:not(:disabled):hover .kol-button__text {\n background-color: #fc0;\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-color: #fc0;\n }\n .kol-pagination .kol-button:disabled .kol-button__text {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .kol-pagination .kol-button__text {\n color: #171a22;\n background-color: #fc0;\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) Arial, sans-serif;\n }\n .kol-pagination__button--selected .kol-button__text {\n opacity: 1;\n color: var(--color-white);\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n font-weight: bold;\n text-decoration: underline;\n }\n :host {\n display: flex;\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n flex-direction: column;\n }\n .kol-table {\n display: block;\n padding: 0.5em;\n }\n .kol-table__caption {\n padding: 0.5em;\n }\n .kol-table__focus-element:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n outline-offset: 2px;\n }\n .kol-table__table {\n border-color: var(--color-ice);\n border-style: solid;\n width: 100%;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n border-spacing: 0;\n }\n .kol-table__cell {\n padding: 0.5em;\n }\n .kol-table__head-row:first-child .kol-table__cell--selection, .kol-table__head-row:first-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-top-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__head-row:last-child .kol-table__cell--selection, .kol-table__head-row:last-child .kol-table__cell--header {\n border-color: var(--color-ice);\n border-style: solid;\n border-width: 0;\n border-bottom-width: calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-table__cell--header {\n color: var(--color-midnight);\n background-color: var(--color-white);\n font-weight: normal;\n }\n .kol-table__cell--header--ascending, .kol-table__cell--header--descending {\n font-weight: 700;\n }\n .kol-table__cell--header--ascending .kol-button, .kol-table__cell--header--descending .kol-button {\n font-weight: 700;\n }\n .kol-table__row--body:nth-child(odd) {\n background-color: var(--color-grey-10);\n }\n .kol-table__selection {\n display: flex;\n gap: 0.5em;\n align-items: center;\n grid-template-columns: 1fr auto;\n }\n .kol-table__selection-input:focus {\n outline-color: var(--color-blue);\n outline-style: solid;\n outline-width: 2px;\n border-color: var(--color-blue);\n outline-offset: 2px;\n }\n .kol-table__selection-input--checkbox {\n border-color: var(--color-grey-75);\n }\n .kol-table__selection-input--checkbox:checked {\n background-color: var(--color-blue);\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio {\n border-color: var(--color-grey-75);\n display: block;\n outline-offset: 2px;\n }\n .kol-table__selection-input--radio:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-table__selection-input--radio:checked {\n outline: 2px solid var(--color-blue);\n border-color: var(--color-blue);\n border-width: 7px;\n }\n .kol-table__selection-input--radio:checked:before {\n background-color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-input {\n background-color: var(--color-white);\n }\n .kol-table__selection-icon {\n color: var(--color-white);\n }\n .kol-table__selection--indeterminate .kol-table__selection-icon {\n color: var(--color-blue);\n }\n .kol-icon:hover ~ .kol-table__selection-input--checkbox:not(:disabled), .kol-table__selection-input--checkbox:not(:disabled):hover {\n border-color: var(--color-blue);\n }\n}";
|
|
1373
1374
|
|
|
1374
|
-
var css_248z$6 = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1375
|
+
var css_248z$6 = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs__button-group {\n margin-bottom: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n border-bottom: 1px solid var(--color-grey-25);\n }\n .kol-tabs .kol-button {\n margin-bottom: calc(-1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-tabs .kol-button:hover:not(:disabled) .kol-span {\n color: var(--color-blue-130);\n }\n .kol-tabs .kol-button:focus .kol-span {\n outline: var(--color-blue-130) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-tabs .kol-button.selected .kol-span {\n color: var(--color-blue);\n box-shadow: 0 -3px var(--color-blue);\n border-color: var(--color-grey-25);\n border-style: solid;\n border-top-color: var(--color-blue);\n border-bottom-color: white;\n border-width: 1px;\n font-weight: var(--font-weight-bold);\n }\n .kol-tabs .kol-button .kol-span {\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n}";
|
|
1375
1376
|
|
|
1376
|
-
var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n :
|
|
1377
|
+
var css_248z$5 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-alert--variant-card .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-card .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__label {\n order: 1;\n }\n .kol-form-field__hint {\n order: 2;\n }\n .kol-form-field__msg {\n order: 3;\n }\n .kol-form-field__input {\n order: 4;\n }\n .kol-form-field {\n color: var(--color-grey);\n gap: var(--spacing-xs);\n }\n .kol-form-field__label {\n font-weight: var(--font-weight-bold);\n }\n .kol-form-field__label-text::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n .kol-form-field__hint {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-form-field__msg {\n color: var();\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__msg.kol-alert--type-error {\n color: var(--color-red);\n margin-left: calc(-1 * var(--spacing-2xs));\n font-size: 0.875em;\n }\n .kol-form-field__counter--exceeded {\n color: var(--color-red);\n }\n .kol-input-container {\n color: var(--color-grey);\n min-height: var(--a11y-min-size);\n padding: calc(1 * 1rem / var(--kolibri-root-font-size, 16)) 0.5em;\n order: 4;\n align-items: center;\n border: 1px solid var(--color-grey-75);\n }\n .kol-input-container:focus-within {\n box-shadow: inset calc(1 * 1rem / var(--kolibri-root-font-size, 16)) calc(1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue), inset calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) calc(-1 * 1rem / var(--kolibri-root-font-size, 16)) var(--color-blue);\n outline: none;\n }\n .kol-input-container:focus-within, .kol-input-container:not(.kol-input-container--disabled):hover {\n border-color: var(--color-blue);\n }\n .kol-input-container--disabled {\n cursor: not-allowed;\n }\n .kol-input-container.kol-input-container--error {\n border-color: var(--color-red);\n }\n}\n@layer kol-theme-component {\n .kol-input,\n .kol-select,\n .kol-textarea {\n outline: none;\n margin: calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n border: none;\n }\n .kol-input,\n .kol-select:not([multiple]) {\n height: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n }\n .kol-input:focus,\n .kol-select:focus,\n .kol-textarea:focus {\n border-bottom: 1px solid var(--color-blue);\n border-top: 1px solid var(--color-blue);\n }\n .kol-input::-moz-placeholder, .kol-textarea::-moz-placeholder {\n color: var(--color-grey-50);\n }\n .kol-input::placeholder,\n .kol-textarea::placeholder {\n color: var(--color-grey-50);\n }\n}";
|
|
1377
1378
|
|
|
1378
|
-
var css_248z$4 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-alert--variant-msg {\n border: none;\n }\n .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-alert--variant-card .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert--variant-msg .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-card .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-alert--variant-msg .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-
|
|
1379
|
+
var css_248z$4 = "/* forward the rem function */\n@layer kol-theme-component {\n :host {\n top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n right: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n width: calc(440 * 1rem / var(--kolibri-root-font-size, 16));\n max-width: 100%;\n }\n .kol-toast-item .kol-alert--variant-msg {\n border: none;\n }\n .kol-toast-item .kol-alert--variant-card {\n border-style: solid;\n padding-top: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n padding-bottom: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n border-width: 2px;\n padding-inline-end: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n padding-inline-start: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--type-default {\n --alert-accent-color: var(--color-grey);\n }\n .kol-toast-item .kol-alert--type-error {\n --alert-accent-color: var(--color-red);\n }\n .kol-toast-item .kol-alert--type-info {\n --alert-accent-color: var(--color-blue);\n }\n .kol-toast-item .kol-alert--type-success {\n --alert-accent-color: var(--color-green);\n }\n .kol-toast-item .kol-alert--type-warning {\n --alert-accent-color: var(--color-orange);\n }\n .kol-toast-item .kol-alert__container {\n background-color: var(--color-white);\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__container {\n gap: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-msg .kol-toast-item .kol-alert__container-content {\n padding: var(--spacing-2xs);\n }\n .kol-toast-item .kol-alert__closer .kol-button {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__closer .kol-icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert__icon {\n color: var(--alert-accent-color);\n }\n .kol-toast-item .kol-alert--variant-msg .kol-toast-item .kol-alert__icon {\n margin: var(--spacing-2xs);\n font-size: 1.5em;\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__icon {\n font-size: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item .kol-alert--variant-card .kol-toast-item .kol-alert__content {\n margin-left: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item {\n background-color: #fff;\n display: block;\n margin-top: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .kol-toast-item__alert {\n display: block;\n }\n .kol-toast-item .heading {\n width: 100%;\n }\n .kol-toast-item .heading .heading-content {\n flex: 1;\n }\n}";
|
|
1379
1380
|
|
|
1380
|
-
var css_248z$3 = "/* forward the rem function */\n@layer kol-theme-component {\n
|
|
1381
|
+
var css_248z$3 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-button {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-button--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-button--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-button--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-button--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-button--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-button--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-button--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-button--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-button--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-button:focus {\n outline: none;\n }\n .kol-button__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-button__text:active, .kol-button__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-button--secondary .kol-button__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-button--secondary.button:focus-visible .kol-button__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-button:focus-visible .kol-button__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-button--hide-label .kol-button__text .kol-span__label {\n display: none;\n }\n .kol-link {\n --kolibri-spacing: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n --text-focus-outline-color: var(--color-white);\n border-radius: 4px;\n text-decoration: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .kol-link--primary {\n --text-background-color: #0e47cb;\n --text-color: #fff;\n --text-focus-outline-color: #fff;\n }\n .kol-link--primary:not(:disabled):hover {\n --text-background-color: #3e6cd5;\n }\n .kol-link--secondary {\n --text-background-color: #fff;\n --text-color: #0e47cb;\n --text-border-color: #0e47cb;\n --text-focus-outline-color: #fff;\n }\n .kol-link--secondary:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link--normal {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link--normal:not(:disabled):hover {\n --text-background-color: #fc0;\n }\n .kol-link--danger {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n --text-color: var(--color-white);\n }\n .kol-link--danger:not(:disabled):hover {\n --text-background-color: var(--color-red);\n --text-border-color: var(--color-red);\n }\n .kol-link--ghost {\n --text-color: #0e47cb;\n --text-focus-outline-color: #0e47cb;\n }\n .kol-link--ghost:not(:disabled):hover {\n --text-color: #0e47cb;\n }\n .kol-link:focus {\n outline: none;\n }\n .kol-link__text {\n color: var(--text-color);\n background-color: var(--text-background-color);\n border-color: var(--text-border-color);\n border-radius: 4px;\n min-width: var(--a11y-min-size);\n min-height: var(--a11y-min-size);\n margin: 0;\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n font: normal normal 400 calc(16 * 1rem / var(--kolibri-root-font-size, 16))/calc(20 * 1rem / var(--kolibri-root-font-size, 16)) arial, sans-serif;\n font-weight: 400;\n line-height: 1.2;\n }\n .kol-link__text:active, .kol-link__text:not(:disabled):hover {\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n }\n .kol-link--secondary .kol-link__text {\n padding: calc(12 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16)) calc(16 * 1rem / var(--kolibri-root-font-size, 16) - 2 * 1rem / var(--kolibri-root-font-size, 16));\n border: 2px solid #0e47cb;\n }\n .kol-link--secondary.button:focus-visible .kol-link__text {\n box-shadow: inset 0 0 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) #0e47cb;\n }\n .kol-link:focus-visible .kol-link__text {\n outline: var(--text-focus-outline-color) solid calc(2 * 1rem / var(--kolibri-root-font-size, 16));\n outline-offset: -4px;\n }\n .kol-link--hide-label .kol-link__text .kol-span__label {\n display: none;\n }\n .kol-toolbar {\n background-color: var(--color-white);\n box-shadow: 0 calc(2 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.08), 0 0 calc(10 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(5 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04), 0 calc(-4 * 1rem / var(--kolibri-root-font-size, 16)) calc(4 * 1rem / var(--kolibri-root-font-size, 16)) rgba(9, 49, 142, 0.04);\n border-radius: 8px;\n padding: var(--spacing-s);\n }\n .kol-link {\n --text-background-color: #fc0;\n --text-color: #171a22;\n --text-focus-outline-color: #000;\n --text-border-color: #fc0;\n }\n .kol-link:hover {\n --text-background-color: #fc0;\n }\n}";
|
|
1381
1382
|
|
|
1382
|
-
var css_248z$2 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-
|
|
1383
|
+
var css_248z$2 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree-item__children {\n display: flex;\n flex-direction: column;\n }\n .kol-tree-item__link {\n border-radius: 4px;\n display: block;\n border: 2px solid transparent;\n }\n .kol-tree-item__link:hover, .kol-tree-item__link:focus-within {\n background-color: var(--color-sky);\n border: 2px solid var(--color-blue);\n }\n .kol-tree-item__link:hover .kol-link, .kol-tree-item__link:focus-within .kol-link {\n color: var(--color-black);\n }\n .kol-tree-item__link--active {\n background-color: var(--color-yellow);\n }\n .kol-tree-item__link--active .kol-link {\n color: var(--color-black);\n background-color: var(--color-yellow);\n }\n .kol-tree-item__link .kol-link {\n color: var(--color-black);\n text-align: left;\n }\n .kol-tree-item__link .kol-link:focus {\n color: var(--color-black);\n }\n .kol-tree-item__toggle-button {\n color: var(--color-blue);\n }\n .kol-tree-item__toggle-button:hover .kol-tree-item__toggle-button-icon::part(icon) {\n transform: scale(1.3);\n }\n .kol-tree-item__text {\n text-decoration: none;\n }\n}";
|
|
1383
1384
|
|
|
1384
1385
|
var css_248z$1 = "/* forward the rem function */\n@layer kol-theme-component {\n .kol-tree__treeview-navigation {\n display: flex;\n flex-direction: column;\n }\n}";
|
|
1385
1386
|
|
|
1386
|
-
var css_248z = "/* forward the rem function */\n@layer kol-theme-
|
|
1387
|
+
var css_248z = "/* forward the rem function */\n@layer kol-theme-global {\n .kol-tooltip__arrow {\n background-color: #626262;\n }\n .kol-tooltip__content {\n background-color: #f2f2f2;\n border-radius: 2px;\n padding: calc(4 * 1rem / var(--kolibri-root-font-size, 16)) calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: 1.2;\n border: 1px solid #626262;\n }\n :host {\n --color-blue: #0e47cb;\n --color-blue-140: #082b7a;\n --color-blue-130: #082b7a;\n --color-blue-120: #0b39a2;\n --color-blue-110: #0d40b7;\n --color-blue-100: #0e47cb;\n --color-blue-80: #3e6cd5;\n --color-blue-60: #6e91e0;\n --color-blue-40: #9fb5ea;\n --color-blue-20: #cfdaf5;\n --color-blue-10: #e7edfa;\n --color-blue-5: #f3f6fc;\n --color-yellow: #ffcc00;\n --color-yellow-140: #997a00;\n --color-yellow-130: #b38f00;\n --color-yellow-120: #cca300;\n --color-yellow-110: #e6b800;\n --color-yellow-100: #ffcc00;\n --color-yellow-80: #ffd633;\n --color-yellow-60: #ffe066;\n --color-yellow-40: #ffeb99;\n --color-yellow-20: #fff5cc;\n --color-yellow-10: #fffae6;\n --color-yellow-5: #fffcf2;\n --color-grey: #262b38;\n --color-grey-140: #171a22;\n --color-grey-130: #1b1e27;\n --color-grey-120: #1e222d;\n --color-grey-110: #222732;\n --color-grey-100: #262b38;\n --color-grey-80: #515560;\n --color-grey-75: #515560;\n --color-grey-60: #7d8088;\n --color-grey-40: #a8aaaf;\n --color-grey-20: #d4d5d7;\n --color-grey-10: #e9eaeb;\n --color-grey-5: #f4f5f5;\n --color-grey-3: #f9f9f9;\n --color-orange: #ff6200;\n --color-orange-140: #993b00;\n --color-orange-130: #b34500;\n --color-orange-120: #cc4e00;\n --color-orange-110: #e65800;\n --color-orange-100: #e65800;\n --color-orange-80: #ff8133;\n --color-orange-60: #ff914d;\n --color-orange-40: #ffb180;\n --color-orange-20: #ffd0b3;\n --color-orange-10: #ffefe6;\n --color-orange-5: #fff7f2;\n --color-green: #00c991;\n --color-green-140: #007957;\n --color-green-130: #008d66;\n --color-green-120: #008d66;\n --color-green-110: #00b583;\n --color-green-100: #00c991;\n --color-green-80: #00c991;\n --color-green-60: #66dfbd;\n --color-green-40: #99e9d3;\n --color-green-20: #ccf4e9;\n --color-green-10: #e6faf4;\n --color-green-5: #f2fcf9;\n --color-red: #ef0044;\n --color-red-140: #8f0029;\n --color-red-130: #a70030;\n --color-red-120: #bf0036;\n --color-red-110: #d7003d;\n --color-red-100: #ef0044;\n --color-red-80: #f23369;\n --color-red-60: #f5668f;\n --color-red-40: #f999b4;\n --color-red-20: #fcccda;\n --color-red-10: #fde6ec;\n --color-red-5: #fef2f5;\n --color-accent-blue-100: #00e9ff;\n --color-accent-blue-30: #b3f8ff;\n --color-purple: #510dcd;\n --color-purple-140: #31087b;\n --color-purple-130: #390990;\n --color-purple-120: #410aa4;\n --color-purple-110: #490cb9;\n --color-purple-100: #510dcd;\n --color-purple-80: #743dd7;\n --color-purple-60: #976ee1;\n --color-purple-40: #bf9af1;\n --color-purple-20: #dccff5;\n --color-purple-10: #eee7fa;\n --color-purple-5: #eee7fa;\n --color-white: #fff;\n --color-black: #000;\n --font-family: Arial, sans-serif;\n --font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --font-weight-regular: 400;\n --font-weight-bold: 700;\n --line-height-regular: 1.5;\n --line-height-heading: 1.2;\n --spacing-4xl: calc(64 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-3xl: calc(48 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-2xl: calc(40 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-xl: calc(32 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-l: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-m: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-s: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-xs: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n --spacing-2xs: calc(4 * 1rem / var(--kolibri-root-font-size, 16));\n }\n :host {\n font-family: var(--font-family);\n font-size: var(--font-size);\n }\n a,\n button {\n outline: none;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n padding: 0;\n font-weight: var(--font-weight-bold);\n line-height: var(--line-height-heading);\n }\n p {\n font-weight: var(--font-weight);\n }\n .kol-span,\n .kol-span__container {\n gap: 0.5em;\n }\n .required label span::after,\n .required legend span::after {\n color: var(--color-red);\n padding-left: 0.25em;\n }\n p.l,\n p.lead {\n font-size: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(28 * 1rem / var(--kolibri-root-font-size, 16));\n }\n p,\n p.m,\n p.medium {\n line-height: calc(24 * 1rem / var(--kolibri-root-font-size, 16));\n }\n p.s,\n p.small {\n font-size: calc(14 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n p.xs,\n p.extra-small {\n font-size: calc(12 * 1rem / var(--kolibri-root-font-size, 16));\n line-height: calc(20 * 1rem / var(--kolibri-root-font-size, 16));\n }\n .badge-text-hint {\n border-radius: 3px;\n padding: 0 0.3em;\n }\n}";
|
|
1387
1388
|
|
|
1388
1389
|
const ECL_EU = KoliBri.createTheme('ecl-eu', {
|
|
1389
|
-
GLOBAL: css_248z
|
|
1390
|
-
'KOL-ACCORDION': css_248z$
|
|
1391
|
-
'KOL-ALERT': css_248z$
|
|
1392
|
-
'KOL-BADGE': css_248z$
|
|
1393
|
-
'KOL-BREADCRUMB': css_248z$
|
|
1390
|
+
GLOBAL: css_248z,
|
|
1391
|
+
'KOL-ACCORDION': css_248z$F,
|
|
1392
|
+
'KOL-ALERT': css_248z$E,
|
|
1393
|
+
'KOL-BADGE': css_248z$D,
|
|
1394
|
+
'KOL-BREADCRUMB': css_248z$C,
|
|
1394
1395
|
'KOL-BUTTON': css_248z$A,
|
|
1395
|
-
'KOL-BUTTON-LINK': css_248z$
|
|
1396
|
-
'KOL-CARD': css_248z$
|
|
1397
|
-
'KOL-COMBOBOX': css_248z$
|
|
1398
|
-
'KOL-DETAILS': css_248z$
|
|
1399
|
-
'KOL-DRAWER': css_248z$
|
|
1400
|
-
'KOL-FORM': css_248z$
|
|
1401
|
-
'KOL-HEADING': css_248z$
|
|
1402
|
-
'KOL-INPUT-CHECKBOX': css_248z$
|
|
1403
|
-
'KOL-INPUT-COLOR': css_248z$
|
|
1404
|
-
'KOL-INPUT-DATE': css_248z$
|
|
1405
|
-
'KOL-INPUT-EMAIL': css_248z$
|
|
1406
|
-
'KOL-INPUT-FILE': css_248z$
|
|
1407
|
-
'KOL-INPUT-NUMBER': css_248z$
|
|
1408
|
-
'KOL-INPUT-PASSWORD': css_248z$
|
|
1409
|
-
'KOL-INPUT-RADIO': css_248z$
|
|
1410
|
-
'KOL-INPUT-RANGE': css_248z$
|
|
1411
|
-
'KOL-INPUT-TEXT': css_248z$
|
|
1412
|
-
'KOL-LINK': css_248z$
|
|
1413
|
-
'KOL-LINK-BUTTON': css_248z$
|
|
1414
|
-
'KOL-MODAL': css_248z$
|
|
1415
|
-
'KOL-NAV': css_248z$
|
|
1416
|
-
'KOL-PAGINATION': css_248z$
|
|
1417
|
-
'KOL-POPOVER-BUTTON': css_248z$
|
|
1418
|
-
'KOL-SELECT': css_248z$
|
|
1419
|
-
'KOL-SINGLE-SELECT': css_248z$
|
|
1420
|
-
'KOL-SKIP-NAV': css_248z$
|
|
1421
|
-
'KOL-SPIN': css_248z$
|
|
1422
|
-
'KOL-SPLIT-BUTTON': css_248z$
|
|
1423
|
-
'KOL-TABLE-STATEFUL': css_248z$
|
|
1424
|
-
'KOL-TABLE-STATELESS': css_248z$
|
|
1425
|
-
'KOL-TABS': css_248z$
|
|
1426
|
-
'KOL-TEXTAREA': css_248z$
|
|
1427
|
-
'KOL-TOAST-CONTAINER': css_248z$
|
|
1428
|
-
'KOL-TOOLBAR': css_248z$
|
|
1396
|
+
'KOL-BUTTON-LINK': css_248z$B,
|
|
1397
|
+
'KOL-CARD': css_248z$z,
|
|
1398
|
+
'KOL-COMBOBOX': css_248z$y,
|
|
1399
|
+
'KOL-DETAILS': css_248z$x,
|
|
1400
|
+
'KOL-DRAWER': css_248z$w,
|
|
1401
|
+
'KOL-FORM': css_248z$v,
|
|
1402
|
+
'KOL-HEADING': css_248z$u,
|
|
1403
|
+
'KOL-INPUT-CHECKBOX': css_248z$t,
|
|
1404
|
+
'KOL-INPUT-COLOR': css_248z$s,
|
|
1405
|
+
'KOL-INPUT-DATE': css_248z$r,
|
|
1406
|
+
'KOL-INPUT-EMAIL': css_248z$q,
|
|
1407
|
+
'KOL-INPUT-FILE': css_248z$p,
|
|
1408
|
+
'KOL-INPUT-NUMBER': css_248z$o,
|
|
1409
|
+
'KOL-INPUT-PASSWORD': css_248z$n,
|
|
1410
|
+
'KOL-INPUT-RADIO': css_248z$m,
|
|
1411
|
+
'KOL-INPUT-RANGE': css_248z$l,
|
|
1412
|
+
'KOL-INPUT-TEXT': css_248z$k,
|
|
1413
|
+
'KOL-LINK': css_248z$i,
|
|
1414
|
+
'KOL-LINK-BUTTON': css_248z$j,
|
|
1415
|
+
'KOL-MODAL': css_248z$h,
|
|
1416
|
+
'KOL-NAV': css_248z$g,
|
|
1417
|
+
'KOL-PAGINATION': css_248z$f,
|
|
1418
|
+
'KOL-POPOVER-BUTTON': css_248z$e,
|
|
1419
|
+
'KOL-SELECT': css_248z$d,
|
|
1420
|
+
'KOL-SINGLE-SELECT': css_248z$c,
|
|
1421
|
+
'KOL-SKIP-NAV': css_248z$b,
|
|
1422
|
+
'KOL-SPIN': css_248z$a,
|
|
1423
|
+
'KOL-SPLIT-BUTTON': css_248z$9,
|
|
1424
|
+
'KOL-TABLE-STATEFUL': css_248z$8,
|
|
1425
|
+
'KOL-TABLE-STATELESS': css_248z$7,
|
|
1426
|
+
'KOL-TABS': css_248z$6,
|
|
1427
|
+
'KOL-TEXTAREA': css_248z$5,
|
|
1428
|
+
'KOL-TOAST-CONTAINER': css_248z$4,
|
|
1429
|
+
'KOL-TOOLBAR': css_248z$3,
|
|
1429
1430
|
'KOL-TREE': css_248z$1,
|
|
1430
|
-
'KOL-TREE-ITEM': css_248z,
|
|
1431
|
+
'KOL-TREE-ITEM': css_248z$2,
|
|
1431
1432
|
});
|
|
1432
1433
|
|
|
1433
1434
|
exports.ECL_EC = ECL_EC;
|