@schukai/monster 4.148.8 → 4.149.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/source/components/accessibility/stylesheet/locale-picker.mjs +61 -1
- package/source/components/content/image-editor.mjs +79 -11
- package/source/components/content/style/copy.pcss +1 -1
- package/source/components/content/stylesheet/camera-capture.mjs +1 -1
- package/source/components/content/stylesheet/copy.mjs +1 -1
- package/source/components/content/stylesheet/fetch-box.mjs +1 -1
- package/source/components/content/stylesheet/viewer.mjs +61 -1
- package/source/components/data/kpi-tile.mjs +5 -3
- package/source/components/data/metric-graph.mjs +22 -20
- package/source/components/data/metric.mjs +20 -18
- package/source/components/data/style/kpi-tile.pcss +65 -43
- package/source/components/data/style/metric-graph.pcss +35 -18
- package/source/components/data/style/metric.pcss +35 -28
- package/source/components/data/stylesheet/kpi-tile.mjs +61 -1
- package/source/components/data/stylesheet/metric-graph.mjs +61 -1
- package/source/components/data/stylesheet/metric.mjs +61 -1
- package/source/components/datatable/columnbar.mjs +4 -2
- package/source/components/datatable/datatable.mjs +73 -15
- package/source/components/datatable/filter/date-range.mjs +61 -61
- package/source/components/datatable/filter/date-time.mjs +5 -1
- package/source/components/datatable/filter/range.mjs +3 -3
- package/source/components/datatable/filter/select-operator.mjs +7 -1
- package/source/components/datatable/filter/text-operator.mjs +11 -3
- package/source/components/datatable/filter.mjs +16 -0
- package/source/components/datatable/pagination.mjs +2 -2
- package/source/components/datatable/style/column-bar.pcss +115 -23
- package/source/components/datatable/style/datatable.pcss +257 -29
- package/source/components/datatable/style/embedded-pagination.pcss +63 -34
- package/source/components/datatable/style/filter-button.pcss +1 -1
- package/source/components/datatable/style/filter-controls-defaults.pcss +49 -3
- package/source/components/datatable/style/filter-select.pcss +4 -1
- package/source/components/datatable/style/filter.pcss +18 -1
- package/source/components/datatable/stylesheet/change-button.mjs +61 -1
- package/source/components/datatable/stylesheet/column-bar.mjs +69 -1
- package/source/components/datatable/stylesheet/dataset.mjs +61 -1
- package/source/components/datatable/stylesheet/datatable.mjs +71 -1
- package/source/components/datatable/stylesheet/embedded-pagination.mjs +1 -1
- package/source/components/datatable/stylesheet/filter-button.mjs +1 -1
- package/source/components/datatable/stylesheet/filter-controls-defaults.mjs +1 -1
- package/source/components/datatable/stylesheet/filter-select.mjs +61 -1
- package/source/components/datatable/stylesheet/filter.mjs +61 -1
- package/source/components/datatable/stylesheet/pagination.mjs +67 -1
- package/source/components/datatable/stylesheet/save-button.mjs +61 -1
- package/source/components/datatable/stylesheet/status.mjs +61 -1
- package/source/components/form/action-button.mjs +2 -1
- package/source/components/form/button-bar.mjs +7 -2
- package/source/components/form/context-error.mjs +4 -3
- package/source/components/form/context-help.mjs +10 -4
- package/source/components/form/context-hint.mjs +1 -1
- package/source/components/form/context-info.mjs +1 -1
- package/source/components/form/context-note.mjs +1 -1
- package/source/components/form/context-success.mjs +1 -1
- package/source/components/form/context-warning.mjs +1 -1
- package/source/components/form/control-bar.mjs +300 -14
- package/source/components/form/credential-button.mjs +4 -2
- package/source/components/form/digits.mjs +28 -1
- package/source/components/form/field-set.mjs +30 -0
- package/source/components/form/login.mjs +13 -10
- package/source/components/form/password.mjs +6 -0
- package/source/components/form/popper-button.mjs +1 -1
- package/source/components/form/quantity.mjs +14 -6
- package/source/components/form/register-wizard.mjs +46 -26
- package/source/components/form/select.mjs +17 -10
- package/source/components/form/sheet.mjs +13 -2
- package/source/components/form/style/action-button.pcss +131 -5
- package/source/components/form/style/button-bar.pcss +204 -3
- package/source/components/form/style/control-bar.pcss +254 -26
- package/source/components/form/style/digits.pcss +7 -6
- package/source/components/form/style/input-group.pcss +65 -1
- package/source/components/form/style/login.pcss +1 -1
- package/source/components/form/style/mixin/field-set-layout.pcss +8 -0
- package/source/components/form/style/password.pcss +25 -1
- package/source/components/form/style/popper-button.pcss +1 -0
- package/source/components/form/style/quantity.pcss +11 -20
- package/source/components/form/style/select.pcss +52 -7
- package/source/components/form/style/sheet.pcss +70 -1
- package/source/components/form/style/state-button.pcss +5 -2
- package/source/components/form/style/toggle-switch.pcss +7 -4
- package/source/components/form/stylesheet/action-button.mjs +63 -1
- package/source/components/form/stylesheet/button-bar.mjs +153 -1
- package/source/components/form/stylesheet/button.mjs +61 -1
- package/source/components/form/stylesheet/control-bar.mjs +163 -1
- package/source/components/form/stylesheet/digits.mjs +1 -1
- package/source/components/form/stylesheet/field-layout.mjs +1 -1
- package/source/components/form/stylesheet/field-set.mjs +1 -1
- package/source/components/form/stylesheet/form.mjs +1 -1
- package/source/components/form/stylesheet/input-group.mjs +15 -1
- package/source/components/form/stylesheet/login.mjs +1 -1
- package/source/components/form/stylesheet/password.mjs +7 -1
- package/source/components/form/stylesheet/popper-button.mjs +61 -1
- package/source/components/form/stylesheet/quantity.mjs +1 -1
- package/source/components/form/stylesheet/register-wizard.mjs +1 -1
- package/source/components/form/stylesheet/select.mjs +3 -1
- package/source/components/form/stylesheet/sheet.mjs +1 -1
- package/source/components/form/stylesheet/state-button.mjs +3 -1
- package/source/components/form/stylesheet/toggle-switch.mjs +1 -1
- package/source/components/form/stylesheet/wizard.mjs +1 -1
- package/source/components/form/util/floating-ui.mjs +35 -7
- package/source/components/host/call-button.mjs +3 -1
- package/source/components/host/stylesheet/call-button.mjs +61 -1
- package/source/components/host/stylesheet/host.mjs +1 -1
- package/source/components/host/stylesheet/toggle-button.mjs +61 -1
- package/source/components/layout/full-screen.mjs +31 -23
- package/source/components/layout/iframe.mjs +5 -1
- package/source/components/layout/popper.mjs +34 -4
- package/source/components/layout/style/full-screen.pcss +94 -23
- package/source/components/layout/style/split-panel.pcss +57 -5
- package/source/components/layout/style/tabs.pcss +277 -47
- package/source/components/layout/style/vertical-tabs.pcss +147 -0
- package/source/components/layout/stylesheet/collapse.mjs +61 -1
- package/source/components/layout/stylesheet/details.mjs +61 -1
- package/source/components/layout/stylesheet/full-screen.mjs +23 -1
- package/source/components/layout/stylesheet/overlay.mjs +1 -1
- package/source/components/layout/stylesheet/panel.mjs +1 -1
- package/source/components/layout/stylesheet/slider.mjs +1 -1
- package/source/components/layout/stylesheet/split-panel.mjs +17 -1
- package/source/components/layout/stylesheet/tabs.mjs +97 -1
- package/source/components/layout/stylesheet/vertical-tabs.mjs +33 -95
- package/source/components/layout/tabs.mjs +63 -0
- package/source/components/layout/vertical-tabs.mjs +63 -0
- package/source/components/navigation/stylesheet/site-navigation.mjs +1 -1
- package/source/components/navigation/stylesheet/table-of-content.mjs +1 -1
- package/source/components/navigation/stylesheet/wizard-navigation.mjs +1 -1
- package/source/components/navigation/table-of-content.mjs +13 -0
- package/source/components/notify/style/notify.pcss +1 -2
- package/source/components/notify/stylesheet/message.mjs +1 -1
- package/source/components/notify/stylesheet/notify.mjs +1 -1
- package/source/components/state/style/log.pcss +1 -0
- package/source/components/state/style/state.pcss +5 -1
- package/source/components/state/stylesheet/log.mjs +1 -1
- package/source/components/state/stylesheet/state.mjs +7 -1
- package/source/components/style/button.css +61 -205
- package/source/components/style/button.pcss +78 -34
- package/source/components/style/common.css +1 -170
- package/source/components/style/common.pcss +5 -9
- package/source/components/style/form.css +1 -49
- package/source/components/style/form.pcss +24 -6
- package/source/components/style/link.css +1 -39
- package/source/components/style/link.pcss +8 -16
- package/source/components/style/mixin/button.pcss +19 -10
- package/source/components/style/mixin/property.pcss +8 -0
- package/source/components/style/mixin/skeleton.pcss +11 -5
- package/source/components/style/normalize.css +1 -144
- package/source/components/style/normalize.pcss +5 -5
- package/source/components/style/property.css +1 -387
- package/source/components/style/skeleton.css +1 -198
- package/source/components/style/skeleton.pcss +8 -2
- package/source/components/style/theme-modern.css +74 -0
- package/source/components/style/theme-modern.pcss +498 -0
- package/source/components/stylesheet/button.mjs +61 -1
- package/source/components/stylesheet/common.mjs +1 -1
- package/source/components/stylesheet/form.mjs +1 -1
- package/source/components/stylesheet/link.mjs +1 -1
- package/source/components/stylesheet/normalize.mjs +1 -1
- package/source/components/stylesheet/property.mjs +1 -1
- package/source/components/stylesheet/skeleton.mjs +1 -1
- package/source/components/stylesheet/theme-modern.mjs +110 -0
- package/source/components/time/stylesheet/day.mjs +61 -1
- package/source/components/time/stylesheet/month-calendar.mjs +61 -1
- package/source/components/time/timeline/stylesheet/appointment.mjs +61 -1
- package/source/components/time/timeline/stylesheet/segment.mjs +61 -1
- package/source/components/tree-menu/style/tree-menu.pcss +26 -37
- package/source/components/tree-menu/stylesheet/tree-menu.mjs +1 -1
- package/source/dom/customelement.mjs +105 -40
- package/source/dom/updater.mjs +381 -119
- package/test/cases/components/content/image-editor.mjs +19 -0
- package/test/cases/components/datatable/accessibility-defaults.mjs +112 -0
- package/test/cases/components/datatable/filter-availability.mjs +37 -0
- package/test/cases/components/datatable/filter-date-range-layout.mjs +40 -0
- package/test/cases/components/datatable/filter-select-operator.mjs +118 -0
- package/test/cases/components/datatable/mobile-layout.mjs +203 -0
- package/test/cases/components/datatable/responsive-breakpoint.mjs +41 -0
- package/test/cases/components/datatable/selection.mjs +149 -0
- package/test/cases/components/form/action-button-style.mjs +85 -0
- package/test/cases/components/form/button-bar.mjs +222 -3
- package/test/cases/components/form/context-theme-colors.mjs +59 -0
- package/test/cases/components/form/control-bar.mjs +228 -3
- package/test/cases/components/form/control-heights.mjs +103 -0
- package/test/cases/components/form/digits-accessibility.mjs +65 -0
- package/test/cases/components/form/field-set.mjs +54 -0
- package/test/cases/components/form/floating-ui.mjs +74 -0
- package/test/cases/components/form/input-group.mjs +61 -28
- package/test/cases/components/form/login.mjs +47 -0
- package/test/cases/components/form/password.mjs +63 -0
- package/test/cases/components/form/popper-button.mjs +30 -15
- package/test/cases/components/form/quantity-accessibility.mjs +46 -0
- package/test/cases/components/form/register-wizard.mjs +79 -0
- package/test/cases/components/form/select.mjs +94 -2
- package/test/cases/components/form/sheet.mjs +56 -2
- package/test/cases/components/host/toggle-button.mjs +50 -0
- package/test/cases/components/layout/full-screen.mjs +60 -0
- package/test/cases/components/layout/iframe-accessibility.mjs +44 -0
- package/test/cases/components/layout/popper.mjs +128 -0
- package/test/cases/components/layout/slit-panel.mjs +30 -1
- package/test/cases/components/layout/tabs.mjs +93 -0
- package/test/cases/components/navigation/table-of-content.mjs +18 -0
- package/test/cases/components/state/state-style.mjs +31 -0
- package/test/cases/components/style/action-menu.mjs +74 -0
- package/test/cases/components/style/form-controls.mjs +37 -0
- package/test/cases/components/style/kpi-tile.mjs +60 -0
- package/test/cases/components/style/legacy-theme-compatibility.mjs +137 -0
- package/test/cases/components/style/metric-layout.mjs +94 -0
- package/test/cases/components/style/skeleton.mjs +69 -0
- package/test/cases/components/style/theme-component-catalog.mjs +853 -0
- package/test/cases/components/style/theme-modern.mjs +439 -0
- package/test/cases/components/style/theme-review-regressions.mjs +41 -0
- package/test/cases/dom/customelement.mjs +136 -1
- package/test/cases/dom/updater.mjs +174 -0
|
@@ -44,6 +44,7 @@ import { random } from "../../math/random.mjs";
|
|
|
44
44
|
import { getGlobal } from "../../types/global.mjs";
|
|
45
45
|
import { ID } from "../../types/id.mjs";
|
|
46
46
|
import { isArray, isString } from "../../types/is.mjs";
|
|
47
|
+
import { Observer } from "../../types/observer.mjs";
|
|
47
48
|
import { TokenList } from "../../types/tokenlist.mjs";
|
|
48
49
|
import { clone } from "../../util/clone.mjs";
|
|
49
50
|
import { DeadMansSwitch } from "../../util/deadmansswitch.mjs";
|
|
@@ -102,6 +103,7 @@ const measurementNavElementSymbol = Symbol("measurementNavElement");
|
|
|
102
103
|
* @type {symbol}
|
|
103
104
|
*/
|
|
104
105
|
const switchElementSymbol = Symbol("switchElement");
|
|
106
|
+
const popperSwitchOptionObserverSymbol = Symbol("popperSwitchOptionObserver");
|
|
105
107
|
|
|
106
108
|
/**
|
|
107
109
|
* @private
|
|
@@ -150,6 +152,7 @@ const popperSwitchEventHandler = Symbol("popperSwitchEventHandler");
|
|
|
150
152
|
* @type {symbol}
|
|
151
153
|
*/
|
|
152
154
|
const closeEventHandler = Symbol("closeEventHandler");
|
|
155
|
+
const escapeEventHandler = Symbol("escapeEventHandler");
|
|
153
156
|
|
|
154
157
|
/**
|
|
155
158
|
* @private
|
|
@@ -263,6 +266,7 @@ class Tabs extends CustomElement {
|
|
|
263
266
|
* @property {string} templates.main Main template
|
|
264
267
|
* @property {Object} labels
|
|
265
268
|
* @property {string} labels.new-tab-label="New Tab"
|
|
269
|
+
* @property {string} labels.moreActions="More tabs"
|
|
266
270
|
* @property {Object} features
|
|
267
271
|
* @property {number} features.openDelay=500 Open delay in milliseconds
|
|
268
272
|
* @property {string} features.removeBehavior Remove behavior, auto, next, previous and none
|
|
@@ -629,6 +633,7 @@ class Tabs extends CustomElement {
|
|
|
629
633
|
// close on outside ui-events
|
|
630
634
|
document.addEventListener(type, this[closeEventHandler]);
|
|
631
635
|
}
|
|
636
|
+
document.addEventListener("keydown", this[escapeEventHandler]);
|
|
632
637
|
}
|
|
633
638
|
|
|
634
639
|
/**
|
|
@@ -645,6 +650,7 @@ class Tabs extends CustomElement {
|
|
|
645
650
|
for (const [, type] of Object.entries(["click", "touch"])) {
|
|
646
651
|
document.removeEventListener(type, this[closeEventHandler]);
|
|
647
652
|
}
|
|
653
|
+
document.removeEventListener("keydown", this[escapeEventHandler]);
|
|
648
654
|
|
|
649
655
|
this[popperInstanceSymbol]?.destroy();
|
|
650
656
|
this[tabListMutationObserverSymbol]?.disconnect();
|
|
@@ -681,39 +687,48 @@ function getTranslations() {
|
|
|
681
687
|
case "de":
|
|
682
688
|
return {
|
|
683
689
|
"new-tab-label": "Neuer Tab",
|
|
690
|
+
moreActions: "Weitere Tabs",
|
|
684
691
|
};
|
|
685
692
|
case "fr":
|
|
686
693
|
return {
|
|
687
694
|
"new-tab-label": "Nouvel Onglet",
|
|
695
|
+
moreActions: "Autres onglets",
|
|
688
696
|
};
|
|
689
697
|
case "sp":
|
|
690
698
|
return {
|
|
691
699
|
"new-tab-label": "Nueva Pestaña",
|
|
700
|
+
moreActions: "Más pestañas",
|
|
692
701
|
};
|
|
693
702
|
case "it":
|
|
694
703
|
return {
|
|
695
704
|
"new-tab-label": "Nuova Scheda",
|
|
705
|
+
moreActions: "Altre schede",
|
|
696
706
|
};
|
|
697
707
|
case "pl":
|
|
698
708
|
return {
|
|
699
709
|
"new-tab-label": "Nowa Karta",
|
|
710
|
+
moreActions: "Więcej kart",
|
|
700
711
|
};
|
|
701
712
|
case "no":
|
|
702
713
|
return {
|
|
703
714
|
"new-tab-label": "Ny Fane",
|
|
715
|
+
moreActions: "Flere faner",
|
|
704
716
|
};
|
|
705
717
|
case "dk":
|
|
706
718
|
return {
|
|
707
719
|
"new-tab-label": "Ny Fane",
|
|
720
|
+
moreActions: "Flere faner",
|
|
708
721
|
};
|
|
709
722
|
case "sw":
|
|
710
723
|
return {
|
|
711
724
|
"new-tab-label": "Ny Flik",
|
|
725
|
+
moreActions: "Fler flikar",
|
|
712
726
|
};
|
|
713
727
|
default:
|
|
714
728
|
case "en":
|
|
715
729
|
return {
|
|
716
730
|
"new-tab-label": "New Tab",
|
|
731
|
+
moreActions: "More tabs",
|
|
717
732
|
};
|
|
718
733
|
}
|
|
719
734
|
}
|
|
@@ -923,6 +938,13 @@ function initPopperSwitch() {
|
|
|
923
938
|
}
|
|
924
939
|
|
|
925
940
|
this[switchElementSymbol] = switchButton;
|
|
941
|
+
syncPopperSwitchAccessibility.call(this);
|
|
942
|
+
if (!this[popperSwitchOptionObserverSymbol]) {
|
|
943
|
+
this[popperSwitchOptionObserverSymbol] = new Observer(() => {
|
|
944
|
+
syncPopperSwitchAccessibility.call(this);
|
|
945
|
+
});
|
|
946
|
+
this.attachObserver(this[popperSwitchOptionObserverSymbol]);
|
|
947
|
+
}
|
|
926
948
|
updatePopperSwitchVisibility.call(this);
|
|
927
949
|
}
|
|
928
950
|
|
|
@@ -930,6 +952,7 @@ function initPopperSwitch() {
|
|
|
930
952
|
* @private
|
|
931
953
|
*/
|
|
932
954
|
function hidePopper() {
|
|
955
|
+
this[switchElementSymbol]?.setAttribute("aria-expanded", "false");
|
|
933
956
|
if (!this[popperInstanceSymbol]) {
|
|
934
957
|
return;
|
|
935
958
|
}
|
|
@@ -944,9 +967,11 @@ function hidePopper() {
|
|
|
944
967
|
*/
|
|
945
968
|
function showPopper() {
|
|
946
969
|
if (this[popperElementSymbol].style.display === STYLE_DISPLAY_MODE_BLOCK) {
|
|
970
|
+
this[switchElementSymbol]?.setAttribute("aria-expanded", "true");
|
|
947
971
|
return;
|
|
948
972
|
}
|
|
949
973
|
|
|
974
|
+
this[switchElementSymbol]?.setAttribute("aria-expanded", "true");
|
|
950
975
|
this[popperElementSymbol].style.visibility = "hidden";
|
|
951
976
|
this[popperElementSymbol].style.display = STYLE_DISPLAY_MODE_BLOCK;
|
|
952
977
|
// performance https://popper.js.org/docs/v2/tutorial/#performance
|
|
@@ -964,6 +989,32 @@ function showPopper() {
|
|
|
964
989
|
});
|
|
965
990
|
}
|
|
966
991
|
|
|
992
|
+
/**
|
|
993
|
+
* @private
|
|
994
|
+
*/
|
|
995
|
+
function syncPopperSwitchAccessibility() {
|
|
996
|
+
const switchButton = this[switchElementSymbol];
|
|
997
|
+
const popper = this[popperElementSymbol];
|
|
998
|
+
if (!(switchButton instanceof HTMLButtonElement)) {
|
|
999
|
+
return;
|
|
1000
|
+
}
|
|
1001
|
+
|
|
1002
|
+
const popperId = "monster-tabs-overflow";
|
|
1003
|
+
if (popper instanceof HTMLElement) {
|
|
1004
|
+
popper.id = popperId;
|
|
1005
|
+
}
|
|
1006
|
+
switchButton.type = "button";
|
|
1007
|
+
switchButton.setAttribute(
|
|
1008
|
+
"aria-label",
|
|
1009
|
+
this.getOption("labels.moreActions", "More tabs"),
|
|
1010
|
+
);
|
|
1011
|
+
switchButton.setAttribute("aria-controls", popperId);
|
|
1012
|
+
switchButton.setAttribute(
|
|
1013
|
+
"aria-expanded",
|
|
1014
|
+
popper?.style.display === STYLE_DISPLAY_MODE_BLOCK ? "true" : "false",
|
|
1015
|
+
);
|
|
1016
|
+
}
|
|
1017
|
+
|
|
967
1018
|
/**
|
|
968
1019
|
* @private
|
|
969
1020
|
*/
|
|
@@ -1340,6 +1391,18 @@ function initEventHandler() {
|
|
|
1340
1391
|
|
|
1341
1392
|
hidePopper.call(this);
|
|
1342
1393
|
};
|
|
1394
|
+
this[escapeEventHandler] = (event) => {
|
|
1395
|
+
if (
|
|
1396
|
+
event.key !== "Escape" ||
|
|
1397
|
+
this[popperElementSymbol]?.style.display !== STYLE_DISPLAY_MODE_BLOCK
|
|
1398
|
+
) {
|
|
1399
|
+
return;
|
|
1400
|
+
}
|
|
1401
|
+
|
|
1402
|
+
event.preventDefault();
|
|
1403
|
+
hidePopper.call(this);
|
|
1404
|
+
this[switchElementSymbol]?.focus();
|
|
1405
|
+
};
|
|
1343
1406
|
|
|
1344
1407
|
// the order is important, because the remove must be before the change
|
|
1345
1408
|
this[navElementSymbol].addEventListener("touch", this[removeTabEventHandler]);
|
|
@@ -40,6 +40,7 @@ import { random } from "../../math/random.mjs";
|
|
|
40
40
|
import { getGlobal } from "../../types/global.mjs";
|
|
41
41
|
import { ID } from "../../types/id.mjs";
|
|
42
42
|
import { isArray, isString } from "../../types/is.mjs";
|
|
43
|
+
import { Observer } from "../../types/observer.mjs";
|
|
43
44
|
import { TokenList } from "../../types/tokenlist.mjs";
|
|
44
45
|
import { clone } from "../../util/clone.mjs";
|
|
45
46
|
import { DeadMansSwitch } from "../../util/deadmansswitch.mjs";
|
|
@@ -92,6 +93,7 @@ const navElementSymbol = Symbol("navElement");
|
|
|
92
93
|
* @type {symbol}
|
|
93
94
|
*/
|
|
94
95
|
const switchElementSymbol = Symbol("switchElement");
|
|
96
|
+
const popperSwitchOptionObserverSymbol = Symbol("popperSwitchOptionObserver");
|
|
95
97
|
|
|
96
98
|
/**
|
|
97
99
|
* @private
|
|
@@ -116,6 +118,7 @@ const popperSwitchEventHandler = Symbol("popperSwitchEventHandler");
|
|
|
116
118
|
* @type {symbol}
|
|
117
119
|
*/
|
|
118
120
|
const closeEventHandler = Symbol("closeEventHandler");
|
|
121
|
+
const escapeEventHandler = Symbol("escapeEventHandler");
|
|
119
122
|
|
|
120
123
|
/**
|
|
121
124
|
* @private
|
|
@@ -180,6 +183,7 @@ class VerticalTabs extends CustomElement {
|
|
|
180
183
|
* @property {string} templates.main Main template
|
|
181
184
|
* @property {Object} labels
|
|
182
185
|
* @property {string} labels.new-tab-label="New Tab"
|
|
186
|
+
* @property {string} labels.moreActions="More tabs"
|
|
183
187
|
* @property {Object} features
|
|
184
188
|
* @property {number} features.openDelay=500 Open delay in milliseconds
|
|
185
189
|
* @property {string} features.removeBehavior Remove behavior, auto, next, previous and none
|
|
@@ -458,6 +462,7 @@ class VerticalTabs extends CustomElement {
|
|
|
458
462
|
// close on outside ui-events
|
|
459
463
|
document.addEventListener(type, this[closeEventHandler]);
|
|
460
464
|
}
|
|
465
|
+
document.addEventListener("keydown", this[escapeEventHandler]);
|
|
461
466
|
}
|
|
462
467
|
|
|
463
468
|
/**
|
|
@@ -474,6 +479,7 @@ class VerticalTabs extends CustomElement {
|
|
|
474
479
|
for (const [, type] of Object.entries(["click", "touch"])) {
|
|
475
480
|
document.removeEventListener(type, this[closeEventHandler]);
|
|
476
481
|
}
|
|
482
|
+
document.removeEventListener("keydown", this[escapeEventHandler]);
|
|
477
483
|
|
|
478
484
|
this[popperInstanceSymbol]?.destroy();
|
|
479
485
|
}
|
|
@@ -489,39 +495,48 @@ function getTranslations() {
|
|
|
489
495
|
case "de":
|
|
490
496
|
return {
|
|
491
497
|
"new-tab-label": "Neuer Tab",
|
|
498
|
+
moreActions: "Weitere Tabs",
|
|
492
499
|
};
|
|
493
500
|
case "fr":
|
|
494
501
|
return {
|
|
495
502
|
"new-tab-label": "Nouvel Onglet",
|
|
503
|
+
moreActions: "Autres onglets",
|
|
496
504
|
};
|
|
497
505
|
case "sp":
|
|
498
506
|
return {
|
|
499
507
|
"new-tab-label": "Nueva Pestaña",
|
|
508
|
+
moreActions: "Más pestañas",
|
|
500
509
|
};
|
|
501
510
|
case "it":
|
|
502
511
|
return {
|
|
503
512
|
"new-tab-label": "Nuova Scheda",
|
|
513
|
+
moreActions: "Altre schede",
|
|
504
514
|
};
|
|
505
515
|
case "pl":
|
|
506
516
|
return {
|
|
507
517
|
"new-tab-label": "Nowa Karta",
|
|
518
|
+
moreActions: "Więcej kart",
|
|
508
519
|
};
|
|
509
520
|
case "no":
|
|
510
521
|
return {
|
|
511
522
|
"new-tab-label": "Ny Fane",
|
|
523
|
+
moreActions: "Flere faner",
|
|
512
524
|
};
|
|
513
525
|
case "dk":
|
|
514
526
|
return {
|
|
515
527
|
"new-tab-label": "Ny Fane",
|
|
528
|
+
moreActions: "Flere faner",
|
|
516
529
|
};
|
|
517
530
|
case "sw":
|
|
518
531
|
return {
|
|
519
532
|
"new-tab-label": "Ny Flik",
|
|
533
|
+
moreActions: "Fler flikar",
|
|
520
534
|
};
|
|
521
535
|
default:
|
|
522
536
|
case "en":
|
|
523
537
|
return {
|
|
524
538
|
"new-tab-label": "New Tab",
|
|
539
|
+
moreActions: "More tabs",
|
|
525
540
|
};
|
|
526
541
|
}
|
|
527
542
|
}
|
|
@@ -564,12 +579,20 @@ function initPopperSwitch() {
|
|
|
564
579
|
}
|
|
565
580
|
|
|
566
581
|
this[switchElementSymbol] = switchButton;
|
|
582
|
+
syncPopperSwitchAccessibility.call(this);
|
|
583
|
+
if (!this[popperSwitchOptionObserverSymbol]) {
|
|
584
|
+
this[popperSwitchOptionObserverSymbol] = new Observer(() => {
|
|
585
|
+
syncPopperSwitchAccessibility.call(this);
|
|
586
|
+
});
|
|
587
|
+
this.attachObserver(this[popperSwitchOptionObserverSymbol]);
|
|
588
|
+
}
|
|
567
589
|
}
|
|
568
590
|
|
|
569
591
|
/**
|
|
570
592
|
* @private
|
|
571
593
|
*/
|
|
572
594
|
function hidePopper() {
|
|
595
|
+
this[switchElementSymbol]?.setAttribute("aria-expanded", "false");
|
|
573
596
|
if (!this[popperInstanceSymbol]) {
|
|
574
597
|
return;
|
|
575
598
|
}
|
|
@@ -584,9 +607,11 @@ function hidePopper() {
|
|
|
584
607
|
*/
|
|
585
608
|
function showPopper() {
|
|
586
609
|
if (this[popperElementSymbol].style.display === STYLE_DISPLAY_MODE_BLOCK) {
|
|
610
|
+
this[switchElementSymbol]?.setAttribute("aria-expanded", "true");
|
|
587
611
|
return;
|
|
588
612
|
}
|
|
589
613
|
|
|
614
|
+
this[switchElementSymbol]?.setAttribute("aria-expanded", "true");
|
|
590
615
|
this[popperElementSymbol].style.visibility = "hidden";
|
|
591
616
|
this[popperElementSymbol].style.display = STYLE_DISPLAY_MODE_BLOCK;
|
|
592
617
|
// performance https://popper.js.org/docs/v2/tutorial/#performance
|
|
@@ -604,6 +629,32 @@ function showPopper() {
|
|
|
604
629
|
});
|
|
605
630
|
}
|
|
606
631
|
|
|
632
|
+
/**
|
|
633
|
+
* @private
|
|
634
|
+
*/
|
|
635
|
+
function syncPopperSwitchAccessibility() {
|
|
636
|
+
const switchButton = this[switchElementSymbol];
|
|
637
|
+
const popper = this[popperElementSymbol];
|
|
638
|
+
if (!(switchButton instanceof HTMLButtonElement)) {
|
|
639
|
+
return;
|
|
640
|
+
}
|
|
641
|
+
|
|
642
|
+
const popperId = "monster-vertical-tabs-overflow";
|
|
643
|
+
if (popper instanceof HTMLElement) {
|
|
644
|
+
popper.id = popperId;
|
|
645
|
+
}
|
|
646
|
+
switchButton.type = "button";
|
|
647
|
+
switchButton.setAttribute(
|
|
648
|
+
"aria-label",
|
|
649
|
+
this.getOption("labels.moreActions", "More tabs"),
|
|
650
|
+
);
|
|
651
|
+
switchButton.setAttribute("aria-controls", popperId);
|
|
652
|
+
switchButton.setAttribute(
|
|
653
|
+
"aria-expanded",
|
|
654
|
+
popper?.style.display === STYLE_DISPLAY_MODE_BLOCK ? "true" : "false",
|
|
655
|
+
);
|
|
656
|
+
}
|
|
657
|
+
|
|
607
658
|
/**
|
|
608
659
|
* @private
|
|
609
660
|
*/
|
|
@@ -960,6 +1011,18 @@ function initEventHandler() {
|
|
|
960
1011
|
|
|
961
1012
|
hidePopper.call(this);
|
|
962
1013
|
};
|
|
1014
|
+
this[escapeEventHandler] = (event) => {
|
|
1015
|
+
if (
|
|
1016
|
+
event.key !== "Escape" ||
|
|
1017
|
+
this[popperElementSymbol]?.style.display !== STYLE_DISPLAY_MODE_BLOCK
|
|
1018
|
+
) {
|
|
1019
|
+
return;
|
|
1020
|
+
}
|
|
1021
|
+
|
|
1022
|
+
event.preventDefault();
|
|
1023
|
+
hidePopper.call(this);
|
|
1024
|
+
this[switchElementSymbol]?.focus();
|
|
1025
|
+
};
|
|
963
1026
|
|
|
964
1027
|
// the order is important, because the remove must be before the change
|
|
965
1028
|
this[navElementSymbol].addEventListener("touch", this[removeTabEventHandler]);
|
|
@@ -25,7 +25,7 @@ try {
|
|
|
25
25
|
SiteNavigationStyleSheet.insertRule(
|
|
26
26
|
`
|
|
27
27
|
@layer sitenavigation {
|
|
28
|
-
:after,:before,:root{--monster-font-family:-apple-system,BlinkMacSystemFont,\"Quicksand\",\"Segoe UI\",\"Roboto\",\"Oxygen\",\"Ubuntu\",\"Cantarell\",\"Fira Sans\",\"Droid Sans\",\"Helvetica Neue\",Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";--monster-font-family-monospace:\"Consolas\",\"Courier New\",\"Roboto Mono\",\"Source Code Pro\",\"Fira Mono\",monospace;--monster-font-size-min:15px;--monster-font-size-base:16px;--monster-font-size-max:16px;--monster-font-scale:1;--monster-font-scale-hi-dpi:1.25;--monster-font-scale-xhi-dpi:1.25;--monster-font-size-fluid:clamp(var(--monster-font-size-min),calc(var(--monster-font-size-min) + 0.1vw),var(--monster-font-size-max))}@media (min-resolution:1.5dppx){:after,:before,:root{--monster-font-scale:var(--monster-font-scale-hi-dpi,1.1)}}@media (min-resolution:3dppx){:after,:before,:root{--monster-font-scale:var(--monster-font-scale-xhi-dpi,1.18)}}:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-6);--monster-color-primary-2:var(--monster-color-gray-6);--monster-color-primary-3:var(--monster-color-cinnamon-1);--monster-color-primary-4:var(--monster-color-cinnamon-1);--monster-bg-color-primary-1:var(--monster-color-gray-1);--monster-bg-color-primary-2:var(--monster-color-gray-2);--monster-bg-color-primary-3:var(--monster-color-gray-6);--monster-bg-color-primary-4:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-1);--monster-color-primary-2:var(--monster-color-gray-1);--monster-color-primary-3:var(--monster-color-gray-6);--monster-color-primary-4:var(--monster-color-gray-6);--monster-bg-color-primary-1:var(--monster-color-gray-6);--monster-bg-color-primary-2:var(--monster-color-gray-3);--monster-bg-color-primary-3:var(--monster-color-gray-2);--monster-bg-color-primary-4:var(--monster-color-gray-1)}}:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-4);--monster-color-secondary-2:var(--monster-color-red-4);--monster-color-secondary-3:var(--monster-color-red-1);--monster-color-secondary-4:var(--monster-color-red-1);--monster-bg-color-secondary-1:var(--monster-color-gray-1);--monster-bg-color-secondary-2:var(--monster-color-red-2);--monster-bg-color-secondary-3:var(--monster-color-red-3);--monster-bg-color-secondary-4:var(--monster-color-red-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-1);--monster-color-secondary-2:var(--monster-color-red-1);--monster-color-secondary-3:var(--monster-color-red-6);--monster-color-secondary-4:var(--monster-color-red-4);--monster-bg-color-secondary-1:var(--monster-color-gray-6);--monster-bg-color-secondary-2:var(--monster-color-red-3);--monster-bg-color-secondary-3:var(--monster-color-red-2);--monster-bg-color-secondary-4:var(--monster-color-red-1)}}:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-4);--monster-color-tertiary-2:var(--monster-color-magenta-4);--monster-color-tertiary-3:var(--monster-color-magenta-6);--monster-color-tertiary-4:var(--monster-color-magenta-1);--monster-bg-color-tertiary-1:var(--monster-color-gray-1);--monster-bg-color-tertiary-2:var(--monster-color-magenta-1);--monster-bg-color-tertiary-3:var(--monster-color-magenta-2);--monster-bg-color-tertiary-4:var(--monster-color-magenta-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-1);--monster-color-tertiary-2:var(--monster-color-magenta-6);--monster-color-tertiary-3:var(--monster-color-magenta-4);--monster-color-tertiary-4:var(--monster-color-magenta-4);--monster-bg-color-tertiary-1:var(--monster-color-gray-6);--monster-bg-color-tertiary-2:var(--monster-color-magenta-2);--monster-bg-color-tertiary-3:var(--monster-color-magenta-1);--monster-bg-color-tertiary-4:var(--monster-color-magenta-1)}}:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-4);--monster-color-destructive-3:var(--monster-color-red-6);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-4);--monster-bg-color-destructive-2:var(--monster-color-gray-1);--monster-bg-color-destructive-3:var(--monster-color-red-2);--monster-bg-color-destructive-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-3);--monster-color-destructive-3:var(--monster-color-red-4);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-5);--monster-bg-color-destructive-2:var(--monster-color-gray-6);--monster-bg-color-destructive-3:var(--monster-color-red-1);--monster-bg-color-destructive-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-danger-1:var(--monster-color-raspberry-1);--monster-color-danger-2:var(--monster-color-raspberry-4);--monster-color-danger-3:var(--monster-color-raspberry-6);--monster-color-danger-4:var(--monster-color-raspberry-1);--monster-bg-color-danger-1:var(--monster-color-raspberry-4);--monster-bg-color-danger-2:var(--monster-color-gray-1);--monster-bg-color-danger-3:var(--monster-color-raspberry-2);--monster-bg-color-danger-4:var(--monster-color-raspberry-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-danger-1:var(--monster-color-raspberry-1);--monster-color-danger-2:var(--monster-color-raspberry-3);--monster-color-danger-3:var(--monster-color-raspberry-4);--monster-color-danger-4:var(--monster-color-raspberry-1);--monster-bg-color-danger-1:var(--monster-color-raspberry-5);--monster-bg-color-danger-2:var(--monster-color-gray-6);--monster-bg-color-danger-3:var(--monster-color-raspberry-1);--monster-bg-color-danger-4:var(--monster-color-raspberry-4)}}:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-4);--monster-color-success-3:var(--monster-color-green-6);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-3);--monster-bg-color-success-2:var(--monster-color-gray-1);--monster-bg-color-success-3:var(--monster-color-green-2);--monster-bg-color-success-4:var(--monster-color-green-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-2);--monster-color-success-3:var(--monster-color-green-4);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-5);--monster-bg-color-success-2:var(--monster-color-gray-6);--monster-bg-color-success-3:var(--monster-color-green-1);--monster-bg-color-success-4:var(--monster-color-green-3)}}:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-4);--monster-color-warning-3:var(--monster-color-orange-6);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-3);--monster-bg-color-warning-2:var(--monster-color-gray-1);--monster-bg-color-warning-3:var(--monster-color-orange-2);--monster-bg-color-warning-4:var(--monster-color-orange-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-3);--monster-color-warning-3:var(--monster-color-orange-4);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-5);--monster-bg-color-warning-2:var(--monster-color-gray-6);--monster-bg-color-warning-3:var(--monster-color-orange-1);--monster-bg-color-warning-4:var(--monster-color-orange-3)}}:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-4);--monster-color-error-3:var(--monster-color-red-6);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-4);--monster-bg-color-error-2:var(--monster-color-gray-1);--monster-bg-color-error-3:var(--monster-color-red-2);--monster-bg-color-error-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-3);--monster-color-error-3:var(--monster-color-red-4);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-5);--monster-bg-color-error-2:var(--monster-color-gray-6);--monster-bg-color-error-3:var(--monster-color-red-1);--monster-bg-color-error-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}}:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-4);--monster-color-primary-disabled-4:var(--monster-color-gray-4);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-1);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-6);--monster-color-gradient-1:#833ab4;--monster-color-gradient-2:#fd1d1d;--monster-color-gradient-3:#fcb045}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-3);--monster-color-primary-disabled-4:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-6);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-1);--monster-color-gradient-1:#ffe0b2;--monster-color-gradient-2:#ad8275;--monster-color-gradient-3:#771ba3}}:after,:before,:root{--monster-box-shadow-1:none;--monster-box-shadow-2:-1px 1px 10px 1px hsla(0,0%,76%,.61);--monster-text-shadow:none;--monster-theme-control-bg-color:var(--monster-color-seashell-1);--monster-theme-control-color:var(--monster-color-seashell-6);--monster-theme-control-hover-color:var(--monster-color-seashell-6);--monster-theme-control-hover-bg-color:var(--monster-color-seashell-2);--monster-theme-control-border-width:2px;--monster-theme-control-border-style:solid;--monster-theme-control-border-radius:0;--monster-theme-control-border-color:var(--monster-color-primary-1)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-control-bg-color:var(--monster-color-gray-5);--monster-theme-control-color:var(--monster-color-gray-1);--monster-theme-control-border-color:var(--monster-color-gray-3);--monster-theme-control-hover-color:var(--monster-color-gray-1);--monster-theme-control-hover-bg-color:var(--monster-color-gray-6)}}:after,:before,:root{--monster-theme-on-color:var(--monster-color-green-1);--monster-theme-on-bg-color:var(--monster-color-green-5);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-on-color:var(--monster-color-gray-6);--monster-theme-on-bg-color:var(--monster-color-gray-1);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-5)}}:after,:before,:root{--monster-border-style:solid;--monster-border-width:3px;--monster-border-radius:0;--monster-outline-width:1px;--monster-popper-witharrrow-distance:-4px;--monster-z-index-default:0;--monster-z-index-outline:10;--monster-z-index-dropdown:200;--monster-z-index-dropdown-overlay:210;--monster-z-index-sticky:300;--monster-z-index-sticky-overlay:310;--monster-z-index-fixed:400;--monster-z-index-fixed-overlay:410;--monster-z-index-modal-backdrop:500;--monster-z-index-modal-backdrop-overlay:510;--monster-z-index-offcanvas:600;--monster-z-index-offcanvas-overlay:610;--monster-z-index-modal:700;--monster-z-index-modal-overlay:710;--monster-z-index-popover:800;--monster-z-index-popover-overlay:810;--monster-z-index-tooltip:800;--monster-z-index-tooltip-overlay:910;--monster-space-0:0;--monster-space-1:2px;--monster-space-2:4px;--monster-space-3:6px;--monster-space-4:10px;--monster-space-5:16px;--monster-space-6:26px;--monster-space-7:42px;--monster-breakpoint-0:480px;--monster-breakpoint-4:480px;--monster-breakpoint-7:768px;--monster-breakpoint-9:992px;--monster-breakpoint-12:1200px;--monster-dragger-width:2px;--monster-dragger-handle-width:4px;--monster-dragger-handle-height:50px}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.grid{display:grid}.inline-grid{display:inline-grid}.flex{display:flex}.inline-flex{display:inline-flex}.hidden,.hide,.none{display:none}.visible{visibility:visible}.invisible{visibility:hidden}.monster-border-primary-1,.monster-border-primary-2,.monster-border-primary-3,.monster-border-primary-4{border-width:var(--monster-border-width);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style)}.monster-border-0{border-width:0;border-radius:0;border-style:none}.monster-border-primary-1{border-color:var(--monster-bg-color-primary-1)}.monster-border-primary-2{border-color:var(--monster-bg-color-primary-2)}.monster-border-primary-3{border-color:var(--monster-bg-color-primary-3)}.monster-border-primary-4{border-color:var(--monster-bg-color-primary-4)}.monster-border-secondary-1,.monster-border-secondary-2,.monster-border-secondary-3,.monster-border-secondary-4{border-width:var(--monster-border-width);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style)}.monster-border-secondary-1{border-color:var(--monster-bg-color-secondary-1)}.monster-border-secondary-2{border-color:var(--monster-bg-color-secondary-2)}.monster-border-secondary-3{border-color:var(--monster-bg-color-secondary-3)}.monster-border-secondary-4{border-color:var(--monster-bg-color-secondary-4)}.monster-border-tertiary-1,.monster-border-tertiary-2,.monster-border-tertiary-3,.monster-border-tertiary-4{border-width:var(--monster-border-width);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style)}.monster-border-tertiary-1{border-color:var(--monster-bg-color-tertiary-1)}.monster-border-tertiary-2{border-color:var(--monster-bg-color-tertiary-2)}.monster-border-tertiary-3{border-color:var(--monster-bg-color-tertiary-3)}.monster-border-tertiary-4{border-color:var(--monster-bg-color-tertiary-4)}.monster-theme-primary-1{background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1)}.monster-theme-primary-disabled-1{background-color:var(--monster-bg-color-primary-disabled-1);color:var(--monster-color-primary-disabled-1)}.monster-theme-secondary-1{background-color:var(--monster-bg-color-secondary-1);color:var(--monster-color-secondary-1)}.monster-theme-tertiary-1{background-color:var(--monster-bg-color-tertiary-1);color:var(--monster-color-tertiary-1)}.monster-theme-destructive-1{background-color:var(--monster-bg-color-destructive-1);color:var(--monster-color-destructive-1)}.monster-theme-danger-1{background-color:var(--monster-bg-color-danger-1);color:var(--monster-color-danger-1)}.monster-theme-success-1{background-color:var(--monster-bg-color-success-1);color:var(--monster-color-success-1)}.monster-theme-warning-1{background-color:var(--monster-bg-color-warning-1);color:var(--monster-color-warning-1)}.monster-theme-error-1{background-color:var(--monster-bg-color-error-1);color:var(--monster-color-error-1)}.monster-theme-selection-1{background-color:var(--monster-bg-color-selection-1);color:var(--monster-color-selection-1)}.monster-border-color-1{border-color:var(--monster-color-border-1)}.monster-color-neutral-1{color:var(--monster-color-primary-1)}.monster-bg-color-primary-1{background-color:var(--monster-bg-color-primary-1)}.monster-bg-color-secondary-1{background-color:var(--monster-bg-color-secondary-1)}.monster-bg-color-tertiary-1{background-color:var(--monster-bg-color-tertiary-1)}.monster-color-primary-1{background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1)}.monster-color-secondary-1{background-color:var(--monster-bg-color-secondary-1);color:var(--monster-color-secondary-1)}.monster-color-tertiary-1{background-color:var(--monster-bg-color-tertiary-1);color:var(--monster-color-tertiary-1)}.monster-color-destructive-1{background-color:var(--monster-bg-color-destructive-1);color:var(--monster-color-destructive-1)}.monster-color-danger-1{background-color:var(--monster-bg-color-danger-1);color:var(--monster-color-danger-1)}.monster-color-success-1{background-color:var(--monster-bg-color-success-1);color:var(--monster-color-success-1)}.monster-color-warning-1{background-color:var(--monster-bg-color-warning-1);color:var(--monster-color-warning-1)}.monster-color-error-1{background-color:var(--monster-bg-color-error-1);color:var(--monster-color-error-1)}.monster-color-selection-1{background-color:var(--monster-bg-color-selection-1);color:var(--monster-color-selection-1)}.monster-theme-primary-2{background-color:var(--monster-bg-color-primary-2);color:var(--monster-color-primary-2)}.monster-theme-primary-disabled-2{background-color:var(--monster-bg-color-primary-disabled-2);color:var(--monster-color-primary-disabled-2)}.monster-theme-secondary-2{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-2)}.monster-theme-tertiary-2{background-color:var(--monster-bg-color-tertiary-2);color:var(--monster-color-tertiary-2)}.monster-theme-destructive-2{background-color:var(--monster-bg-color-destructive-2);color:var(--monster-color-destructive-2)}.monster-theme-danger-2{background-color:var(--monster-bg-color-danger-2);color:var(--monster-color-danger-2)}.monster-theme-success-2{background-color:var(--monster-bg-color-success-2);color:var(--monster-color-success-2)}.monster-theme-warning-2{background-color:var(--monster-bg-color-warning-2);color:var(--monster-color-warning-2)}.monster-theme-error-2{background-color:var(--monster-bg-color-error-2);color:var(--monster-color-error-2)}.monster-theme-selection-2{background-color:var(--monster-bg-color-selection-2);color:var(--monster-color-selection-2)}.monster-border-color-2{border-color:var(--monster-color-border-2)}.monster-color-neutral-2{color:var(--monster-color-primary-2)}.monster-bg-color-primary-2{background-color:var(--monster-bg-color-primary-2)}.monster-bg-color-secondary-2{background-color:var(--monster-bg-color-secondary-2)}.monster-bg-color-tertiary-2{background-color:var(--monster-bg-color-tertiary-2)}.monster-color-primary-2{background-color:var(--monster-bg-color-primary-2);color:var(--monster-color-primary-2)}.monster-color-secondary-2{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-2)}.monster-color-tertiary-2{background-color:var(--monster-bg-color-tertiary-2);color:var(--monster-color-tertiary-2)}.monster-color-destructive-2{background-color:var(--monster-bg-color-destructive-2);color:var(--monster-color-destructive-2)}.monster-color-danger-2{background-color:var(--monster-bg-color-danger-2);color:var(--monster-color-danger-2)}.monster-color-success-2{background-color:var(--monster-bg-color-success-2);color:var(--monster-color-success-2)}.monster-color-warning-2{background-color:var(--monster-bg-color-warning-2);color:var(--monster-color-warning-2)}.monster-color-error-2{background-color:var(--monster-bg-color-error-2);color:var(--monster-color-error-2)}.monster-color-selection-2{background-color:var(--monster-bg-color-selection-2);color:var(--monster-color-selection-2)}.monster-theme-primary-3{background-color:var(--monster-bg-color-primary-3);color:var(--monster-color-primary-3)}.monster-theme-primary-disabled-3{background-color:var(--monster-bg-color-primary-disabled-3);color:var(--monster-color-primary-disabled-3)}.monster-theme-secondary-3{background-color:var(--monster-bg-color-secondary-3);color:var(--monster-color-secondary-3)}.monster-theme-tertiary-3{background-color:var(--monster-bg-color-tertiary-3);color:var(--monster-color-tertiary-3)}.monster-theme-destructive-3{background-color:var(--monster-bg-color-destructive-3);color:var(--monster-color-destructive-3)}.monster-theme-danger-3{background-color:var(--monster-bg-color-danger-3);color:var(--monster-color-danger-3)}.monster-theme-success-3{background-color:var(--monster-bg-color-success-3);color:var(--monster-color-success-3)}.monster-theme-warning-3{background-color:var(--monster-bg-color-warning-3);color:var(--monster-color-warning-3)}.monster-theme-error-3{background-color:var(--monster-bg-color-error-3);color:var(--monster-color-error-3)}.monster-theme-selection-3{background-color:var(--monster-bg-color-selection-3);color:var(--monster-color-selection-3)}.monster-border-color-3{border-color:var(--monster-color-border-3)}.monster-color-neutral-3{color:var(--monster-color-primary-3)}.monster-bg-color-primary-3{background-color:var(--monster-bg-color-primary-3)}.monster-bg-color-secondary-3{background-color:var(--monster-bg-color-secondary-3)}.monster-bg-color-tertiary-3{background-color:var(--monster-bg-color-tertiary-3)}.monster-color-primary-3{background-color:var(--monster-bg-color-primary-3);color:var(--monster-color-primary-3)}.monster-color-secondary-3{background-color:var(--monster-bg-color-secondary-3);color:var(--monster-color-secondary-3)}.monster-color-tertiary-3{background-color:var(--monster-bg-color-tertiary-3);color:var(--monster-color-tertiary-3)}.monster-color-destructive-3{background-color:var(--monster-bg-color-destructive-3);color:var(--monster-color-destructive-3)}.monster-color-danger-3{background-color:var(--monster-bg-color-danger-3);color:var(--monster-color-danger-3)}.monster-color-success-3{background-color:var(--monster-bg-color-success-3);color:var(--monster-color-success-3)}.monster-color-warning-3{background-color:var(--monster-bg-color-warning-3);color:var(--monster-color-warning-3)}.monster-color-error-3{background-color:var(--monster-bg-color-error-3);color:var(--monster-color-error-3)}.monster-color-selection-3{background-color:var(--monster-bg-color-selection-3);color:var(--monster-color-selection-3)}.monster-theme-primary-4{background-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4)}.monster-theme-primary-disabled-4{background-color:var(--monster-bg-color-primary-disabled-4);color:var(--monster-color-primary-disabled-4)}.monster-theme-secondary-4{background-color:var(--monster-bg-color-secondary-4);color:var(--monster-color-secondary-4)}.monster-theme-tertiary-4{background-color:var(--monster-bg-color-tertiary-4);color:var(--monster-color-tertiary-4)}.monster-theme-destructive-4{background-color:var(--monster-bg-color-destructive-4);color:var(--monster-color-destructive-4)}.monster-theme-danger-4{background-color:var(--monster-bg-color-danger-4);color:var(--monster-color-danger-4)}.monster-theme-success-4{background-color:var(--monster-bg-color-success-4);color:var(--monster-color-success-4)}.monster-theme-warning-4{background-color:var(--monster-bg-color-warning-4);color:var(--monster-color-warning-4)}.monster-theme-error-4{background-color:var(--monster-bg-color-error-4);color:var(--monster-color-error-4)}.monster-theme-selection-4{background-color:var(--monster-bg-color-selection-4);color:var(--monster-color-selection-4)}.monster-border-color-4{border-color:var(--monster-color-border-4)}.monster-color-neutral-4{color:var(--monster-color-primary-4)}.monster-bg-color-primary-4{background-color:var(--monster-bg-color-primary-4)}.monster-bg-color-secondary-4{background-color:var(--monster-bg-color-secondary-4)}.monster-bg-color-tertiary-4{background-color:var(--monster-bg-color-tertiary-4)}.monster-color-primary-4{background-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4)}.monster-color-secondary-4{background-color:var(--monster-bg-color-secondary-4);color:var(--monster-color-secondary-4)}.monster-color-tertiary-4{background-color:var(--monster-bg-color-tertiary-4);color:var(--monster-color-tertiary-4)}.monster-color-destructive-4{background-color:var(--monster-bg-color-destructive-4);color:var(--monster-color-destructive-4)}.monster-color-danger-4{background-color:var(--monster-bg-color-danger-4);color:var(--monster-color-danger-4)}.monster-color-success-4{background-color:var(--monster-bg-color-success-4);color:var(--monster-color-success-4)}.monster-color-warning-4{background-color:var(--monster-bg-color-warning-4);color:var(--monster-color-warning-4)}.monster-color-error-4{background-color:var(--monster-bg-color-error-4);color:var(--monster-color-error-4)}.monster-color-selection-4{background-color:var(--monster-bg-color-selection-4);color:var(--monster-color-selection-4)}.monster-theme-control-container-1,.monster-theme-control-row-1{border:1px solid var(--monster-theme-control-border-color)}.monster-theme-control-container-1,.monster-theme-control-element,.monster-theme-control-row-1{background-color:var(--monster-theme-control-bg-color);color:var(--monster-theme-control-color)}.monster-theme-control-background{background-color:var(--monster-theme-control-bg-color)}.monster-theme-background-inherit{background-color:inherit!important}.monster-theme-on{color:var(--monster-theme-on-color);background-color:var(--monster-theme-on-bg-color)}.monster-theme-off{color:var(--monster-theme-off-color);background-color:var(--monster-theme-off-bg-color)}a,a:active,a:focus,a:hover,a:link,a:visited{color:var(--monster-color-secondary-1);text-decoration:none;outline:none;transition:color .3s ease-in-out,text-decoration-color .3s ease-in-out}a:active,a:focus,a:hover{color:var(--monster-color-primary-2);text-decoration:underline;text-decoration-color:var(--monster-color-secondary-1 );text-decoration-thickness:1px;text-underline-offset:2px}a:focus{outline:1px dashed var(--monster-color-selection-1);outline-offset:2px}@media (prefers-color-scheme:dark){a,a:active,a:focus,a:hover,a:link,a:visited{color:var(--monster-color-amber-2)}a:focus{outline:1px dashed var(--monster-color-selection-4)}}div[data-monster-role=popper]{box-sizing:border-box;display:none;padding:1.1em;z-index:var(--monster-z-index-modal);background:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);border-radius:var(--monster-border-radius);border-width:var(--monster-border-width);border-style:var(--monster-border-style);border-color:var(--monster-bg-color-primary-4);box-shadow:var(--monster-box-shadow-1)}[data-popper-arrow],[data-popper-arrow]:before{position:absolute;width:calc(max(var(--monster-popper-witharrrow-distance), -1*var(--monster-popper-witharrrow-distance))*2);height:calc(max(var(--monster-popper-witharrrow-distance), -1*var(--monster-popper-witharrrow-distance))*2);background:inherit}[data-popper-arrow]{visibility:hidden}[data-popper-arrow]:before{visibility:visible;content:\"\";transform:rotate(45deg);box-sizing:border-box}div[data-popper-placement^=top]>[data-popper-arrow]{bottom:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width)/2)}div[data-popper-placement^=top]>[data-popper-arrow]:before{border-left:transparent;border-right:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:transparent}div[data-popper-placement^=bottom]>[data-popper-arrow]{top:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width))}div[data-popper-placement^=bottom]>[data-popper-arrow]:before{border-right:transparent;border-left:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:transparent}div[data-popper-placement^=left]>[data-popper-arrow]{right:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width))}div[data-popper-placement^=left]>[data-popper-arrow]:before{border-left:transparent;border-right:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:transparent}div[data-popper-placement^=right]>[data-popper-arrow]{left:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width)/2)}div[data-popper-placement^=right]>[data-popper-arrow]:before{border-right:transparent;border-left:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:transparent}[data-monster-role=control]{outline:none}[data-monster-role=control].flex{display:flex;flex-direction:row;align-items:center}:host{display:block;box-sizing:border-box}.monster-badge-primary{padding:.25em .4em}.monster-badge-primary,.monster-badge-primary-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;color:var(--monster-color-primary-4);background-color:var(--monster-bg-color-primary-4)}.monster-badge-primary-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-secondary{padding:.25em .4em}.monster-badge-secondary,.monster-badge-secondary-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-secondary-3);color:var(--monster-color-secondary-3)}.monster-badge-secondary-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-tertiary{padding:.25em .4em}.monster-badge-tertiary,.monster-badge-tertiary-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-tertiary-3);color:var(--monster-color-tertiary-3)}.monster-badge-tertiary-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-destructive{padding:.25em .4em}.monster-badge-destructive,.monster-badge-destructive-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-destructive-1);color:var(--monster-color-destructive-1)}.monster-badge-destructive-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-success{padding:.25em .4em}.monster-badge-success,.monster-badge-success-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-success-1);color:var(--monster-color-success-1)}.monster-badge-success-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-warning{padding:.25em .4em}.monster-badge-warning,.monster-badge-warning-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-warning-1);color:var(--monster-color-warning-1)}.monster-badge-warning-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-error{padding:.25em .4em}.monster-badge-error,.monster-badge-error-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-error-1);color:var(--monster-color-error-1)}.monster-badge-error-pill{padding:.25em .6em;border-radius:10rem}:host{display:flex;width:100%;max-width:100%;min-width:0}[data-monster-role=control]{box-sizing:border-box;padding:var(--monster-space-1);position:relative;margin:0;display:flex;width:100%;max-width:100%;min-width:0;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:var(--monster-space-2);background:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);border:var(--monster-border-width) solid var(--monster-color-primary-2);border-radius:var(--monster-border-radius)}#visible-elements{display:flex;flex-wrap:nowrap;list-style:none;padding:0;margin:0;gap:var(--monster-space-1)}#visible-elements li{white-space:nowrap;cursor:pointer;position:relative}#visible-elements li>a{display:block;padding:var(--monster-space-2) var(--monster-space-3);color:var(--monster-color-primary-1);text-decoration:none;border-radius:var(--monster-border-radius);transition:background-color .2s,color .2s;outline-offset:-2px}#visible-elements li>a:hover{color:var(--monster-color-secondary-1);background-color:var(--monster-bg-color-secondary-2)}#hamburger-button{display:flex;align-items:center;justify-content:center;margin:0;padding:var(--monster-space-2);cursor:pointer;background:transparent;color:var(--monster-color-primary-1);border:1px solid transparent;border-radius:var(--monster-border-radius);transition:background-color .2s,color .2s;flex-shrink:0;width:auto;height:auto}#hamburger-button:hover{background:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-1)}#hamburger-button>svg{fill:currentColor}[data-monster-role=navigation]{flex-grow:1;min-width:0}[part=hamburger-container]{height:100%;display:flex;align-items:center}#hamburger-button{height:100%;aspect-ratio:1/1}[part=hamburger-nav],[part=mega-menu],[part=submenu]{display:none;position:absolute;top:0;left:0;background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);border-radius:var(--monster-border-radius);border:1px solid var(--monster-color-primary-2);box-shadow:var(--monster-box-shadow-2);list-style:none;padding:var(--monster-space-1);margin:0;z-index:var(--monster-z-index-modal);min-width:220px}[part=mega-menu].is-open,[part=submenu].is-open{display:block}[part=submenu]>li:not(:last-child){margin-bottom:var(--monster-space-1)}[part=hamburger-nav] li a,[part=submenu] li a{-webkit-user-select:none;-moz-user-select:none;user-select:none;display:block;padding:var(--monster-space-2) var(--monster-space-3);text-decoration:none;color:var(--monster-color-primary-1);border-radius:var(--monster-border-radius);white-space:nowrap;outline-offset:-2px;transition:background-color .2s,color .2s}[part=hamburger-nav] li a:hover,[part=submenu] li a:hover{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-1)}[part=hamburger-nav] [part=hidden-list]{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--monster-space-1)}[part=hamburger-nav] [part=mega-menu],[part=hamburger-nav] [part=submenu]{box-sizing:border-box;position:relative;width:100%;margin-top:var(--monster-space-3);padding:var(--monster-space-3) 0 0 var(--monster-space-4);background-color:transparent;border:none;box-shadow:none;min-width:unset;top:auto;left:auto}[part=hamburger-nav] [part=mega-menu]:before,[part=hamburger-nav] [part=submenu]:before{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background-color:var(--monster-color-primary-2)}[part=mega-menu]{padding:var(--monster-space-4);min-width:400px}.mega-menu-columns{flex-wrap:wrap;gap:var(--monster-space-2)}.column{flex:1}[part=hamburger-header]{display:none}@media (max-width:768px){[part=hamburger-nav][style*=\"display: block\"]{display:flex;flex-direction:column;position:fixed;top:0;left:0;width:100vw;height:100vh;padding:var(--monster-space-4);box-sizing:border-box;overflow-y:auto;border-radius:0;border:none;z-index:var(--monster-z-index-overlay)}[part=hamburger-nav] [part=hidden-list]{flex-grow:1}[part=hamburger-header]{display:flex;justify-content:flex-end;align-items:center;padding-bottom:var(--monster-space-3);margin-bottom:var(--monster-space-3);border-bottom:1px solid var(--monster-color-primary-2)}[part=hamburger-close-button]{background:transparent;border:none;color:var(--monster-color-primary-1);cursor:pointer;padding:var(--monster-space-1)}[part=hamburger-close-button]:hover{color:var(--monster-color-secondary-1)}:global(body.monster-navigation-open){overflow:hidden}}
|
|
28
|
+
:after,:before,:root{--monster-font-family:-apple-system,BlinkMacSystemFont,\"Quicksand\",\"Segoe UI\",\"Roboto\",\"Oxygen\",\"Ubuntu\",\"Cantarell\",\"Fira Sans\",\"Droid Sans\",\"Helvetica Neue\",Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\";--monster-font-family-monospace:\"Consolas\",\"Courier New\",\"Roboto Mono\",\"Source Code Pro\",\"Fira Mono\",monospace;--monster-font-size-min:15px;--monster-font-size-base:16px;--monster-font-size-max:16px;--monster-font-scale:1;--monster-font-scale-hi-dpi:1.25;--monster-font-scale-xhi-dpi:1.25;--monster-font-size-fluid:clamp(var(--monster-font-size-min),calc(var(--monster-font-size-min) + 0.1vw),var(--monster-font-size-max))}@media (min-resolution:1.5dppx){:after,:before,:root{--monster-font-scale:var(--monster-font-scale-hi-dpi,1.1)}}@media (min-resolution:3dppx){:after,:before,:root{--monster-font-scale:var(--monster-font-scale-xhi-dpi,1.18)}}:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-6);--monster-color-primary-2:var(--monster-color-gray-6);--monster-color-primary-3:var(--monster-color-cinnamon-1);--monster-color-primary-4:var(--monster-color-cinnamon-1);--monster-bg-color-primary-1:var(--monster-color-gray-1);--monster-bg-color-primary-2:var(--monster-color-gray-2);--monster-bg-color-primary-3:var(--monster-color-gray-6);--monster-bg-color-primary-4:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-1:var(--monster-color-gray-1);--monster-color-primary-2:var(--monster-color-gray-1);--monster-color-primary-3:var(--monster-color-gray-6);--monster-color-primary-4:var(--monster-color-gray-6);--monster-bg-color-primary-1:var(--monster-color-gray-6);--monster-bg-color-primary-2:var(--monster-color-gray-3);--monster-bg-color-primary-3:var(--monster-color-gray-2);--monster-bg-color-primary-4:var(--monster-color-gray-1)}}:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-4);--monster-color-secondary-2:var(--monster-color-red-4);--monster-color-secondary-3:var(--monster-color-red-1);--monster-color-secondary-4:var(--monster-color-red-1);--monster-bg-color-secondary-1:var(--monster-color-gray-1);--monster-bg-color-secondary-2:var(--monster-color-red-2);--monster-bg-color-secondary-3:var(--monster-color-red-3);--monster-bg-color-secondary-4:var(--monster-color-red-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-secondary-1:var(--monster-color-red-1);--monster-color-secondary-2:var(--monster-color-red-1);--monster-color-secondary-3:var(--monster-color-red-6);--monster-color-secondary-4:var(--monster-color-red-4);--monster-bg-color-secondary-1:var(--monster-color-gray-6);--monster-bg-color-secondary-2:var(--monster-color-red-3);--monster-bg-color-secondary-3:var(--monster-color-red-2);--monster-bg-color-secondary-4:var(--monster-color-red-1)}}:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-4);--monster-color-tertiary-2:var(--monster-color-magenta-4);--monster-color-tertiary-3:var(--monster-color-magenta-6);--monster-color-tertiary-4:var(--monster-color-magenta-1);--monster-bg-color-tertiary-1:var(--monster-color-gray-1);--monster-bg-color-tertiary-2:var(--monster-color-magenta-1);--monster-bg-color-tertiary-3:var(--monster-color-magenta-2);--monster-bg-color-tertiary-4:var(--monster-color-magenta-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-tertiary-1:var(--monster-color-magenta-1);--monster-color-tertiary-2:var(--monster-color-magenta-6);--monster-color-tertiary-3:var(--monster-color-magenta-4);--monster-color-tertiary-4:var(--monster-color-magenta-4);--monster-bg-color-tertiary-1:var(--monster-color-gray-6);--monster-bg-color-tertiary-2:var(--monster-color-magenta-2);--monster-bg-color-tertiary-3:var(--monster-color-magenta-1);--monster-bg-color-tertiary-4:var(--monster-color-magenta-1)}}:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-4);--monster-color-destructive-3:var(--monster-color-red-6);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-4);--monster-bg-color-destructive-2:var(--monster-color-gray-1);--monster-bg-color-destructive-3:var(--monster-color-red-2);--monster-bg-color-destructive-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-destructive-1:var(--monster-color-red-1);--monster-color-destructive-2:var(--monster-color-red-3);--monster-color-destructive-3:var(--monster-color-red-4);--monster-color-destructive-4:var(--monster-color-red-1);--monster-bg-color-destructive-1:var(--monster-color-red-5);--monster-bg-color-destructive-2:var(--monster-color-gray-6);--monster-bg-color-destructive-3:var(--monster-color-red-1);--monster-bg-color-destructive-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-danger-1:var(--monster-color-raspberry-1);--monster-color-danger-2:var(--monster-color-raspberry-4);--monster-color-danger-3:var(--monster-color-raspberry-6);--monster-color-danger-4:var(--monster-color-raspberry-1);--monster-bg-color-danger-1:var(--monster-color-raspberry-4);--monster-bg-color-danger-2:var(--monster-color-gray-1);--monster-bg-color-danger-3:var(--monster-color-raspberry-2);--monster-bg-color-danger-4:var(--monster-color-raspberry-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-danger-1:var(--monster-color-raspberry-1);--monster-color-danger-2:var(--monster-color-raspberry-3);--monster-color-danger-3:var(--monster-color-raspberry-4);--monster-color-danger-4:var(--monster-color-raspberry-1);--monster-bg-color-danger-1:var(--monster-color-raspberry-5);--monster-bg-color-danger-2:var(--monster-color-gray-6);--monster-bg-color-danger-3:var(--monster-color-raspberry-1);--monster-bg-color-danger-4:var(--monster-color-raspberry-4)}}:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-4);--monster-color-success-3:var(--monster-color-green-6);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-3);--monster-bg-color-success-2:var(--monster-color-gray-1);--monster-bg-color-success-3:var(--monster-color-green-2);--monster-bg-color-success-4:var(--monster-color-green-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-success-1:var(--monster-color-green-1);--monster-color-success-2:var(--monster-color-green-2);--monster-color-success-3:var(--monster-color-green-4);--monster-color-success-4:var(--monster-color-green-1);--monster-bg-color-success-1:var(--monster-color-green-5);--monster-bg-color-success-2:var(--monster-color-gray-6);--monster-bg-color-success-3:var(--monster-color-green-1);--monster-bg-color-success-4:var(--monster-color-green-3)}}:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-4);--monster-color-warning-3:var(--monster-color-orange-6);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-3);--monster-bg-color-warning-2:var(--monster-color-gray-1);--monster-bg-color-warning-3:var(--monster-color-orange-2);--monster-bg-color-warning-4:var(--monster-color-orange-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-warning-1:var(--monster-color-orange-1);--monster-color-warning-2:var(--monster-color-orange-3);--monster-color-warning-3:var(--monster-color-orange-4);--monster-color-warning-4:var(--monster-color-orange-1);--monster-bg-color-warning-1:var(--monster-color-orange-5);--monster-bg-color-warning-2:var(--monster-color-gray-6);--monster-bg-color-warning-3:var(--monster-color-orange-1);--monster-bg-color-warning-4:var(--monster-color-orange-3)}}:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-4);--monster-color-error-3:var(--monster-color-red-6);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-4);--monster-bg-color-error-2:var(--monster-color-gray-1);--monster-bg-color-error-3:var(--monster-color-red-2);--monster-bg-color-error-4:var(--monster-color-red-5)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-error-1:var(--monster-color-red-1);--monster-color-error-2:var(--monster-color-red-3);--monster-color-error-3:var(--monster-color-red-4);--monster-color-error-4:var(--monster-color-red-1);--monster-bg-color-error-1:var(--monster-color-red-5);--monster-bg-color-error-2:var(--monster-color-gray-6);--monster-bg-color-error-3:var(--monster-color-red-1);--monster-bg-color-error-4:var(--monster-color-red-4)}}:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-selection-1:var(--monster-color-gray-6);--monster-color-selection-2:var(--monster-color-gray-6);--monster-color-selection-3:var(--monster-color-gray-6);--monster-color-selection-4:var(--monster-color-gray-1);--monster-bg-color-selection-1:var(--monster-color-yellow-2);--monster-bg-color-selection-2:var(--monster-color-yellow-1);--monster-bg-color-selection-3:var(--monster-color-yellow-2);--monster-bg-color-selection-4:var(--monster-color-yellow-6)}}:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-4);--monster-color-primary-disabled-4:var(--monster-color-gray-4);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-1);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-6);--monster-color-gradient-1:#833ab4;--monster-color-gradient-2:#fd1d1d;--monster-color-gradient-3:#fcb045}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-color-primary-disabled-1:var(--monster-color-gray-4);--monster-color-primary-disabled-2:var(--monster-color-gray-4);--monster-color-primary-disabled-3:var(--monster-color-gray-3);--monster-color-primary-disabled-4:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-1:var(--monster-color-gray-6);--monster-bg-color-primary-disabled-2:var(--monster-color-gray-3);--monster-bg-color-primary-disabled-3:var(--monster-color-gray-2);--monster-bg-color-primary-disabled-4:var(--monster-color-gray-1);--monster-color-gradient-1:#ffe0b2;--monster-color-gradient-2:#ad8275;--monster-color-gradient-3:#771ba3}}:after,:before,:root{--monster-box-shadow-1:none;--monster-box-shadow-2:-1px 1px 10px 1px hsla(0,0%,76%,.61);--monster-text-shadow:none;--monster-theme-control-bg-color:var(--monster-color-seashell-1);--monster-theme-control-color:var(--monster-color-seashell-6);--monster-theme-control-hover-color:var(--monster-color-seashell-6);--monster-theme-control-hover-bg-color:var(--monster-color-seashell-2);--monster-theme-control-border-width:2px;--monster-theme-control-border-style:solid;--monster-theme-control-border-radius:0;--monster-theme-control-border-color:var(--monster-color-primary-1)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-control-bg-color:var(--monster-color-gray-5);--monster-theme-control-color:var(--monster-color-gray-1);--monster-theme-control-border-color:var(--monster-color-gray-3);--monster-theme-control-hover-color:var(--monster-color-gray-1);--monster-theme-control-hover-bg-color:var(--monster-color-gray-6)}}:after,:before,:root{--monster-theme-on-color:var(--monster-color-green-1);--monster-theme-on-bg-color:var(--monster-color-green-5);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-4)}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-theme-on-color:var(--monster-color-gray-6);--monster-theme-on-bg-color:var(--monster-color-gray-1);--monster-theme-off-color:var(--monster-color-gray-1);--monster-theme-off-bg-color:var(--monster-color-gray-5)}}:after,:before,:root{--monster-border-style:solid;--monster-border-width:3px;--monster-border-radius:0;--monster-outline-width:1px;--monster-focus-ring-width:2px;--monster-focus-ring-style:solid;--monster-focus-ring-color:var(--monster-color-blue-4);--monster-focus-ring-offset:2px}@media (prefers-color-scheme:dark){:after,:before,:root{--monster-focus-ring-color:var(--monster-color-yellow-2)}}:after,:before,:root{--monster-popper-witharrrow-distance:-4px;--monster-z-index-default:0;--monster-z-index-outline:10;--monster-z-index-dropdown:200;--monster-z-index-dropdown-overlay:210;--monster-z-index-sticky:300;--monster-z-index-sticky-overlay:310;--monster-z-index-fixed:400;--monster-z-index-fixed-overlay:410;--monster-z-index-modal-backdrop:500;--monster-z-index-modal-backdrop-overlay:510;--monster-z-index-offcanvas:600;--monster-z-index-offcanvas-overlay:610;--monster-z-index-modal:700;--monster-z-index-modal-overlay:710;--monster-z-index-popover:800;--monster-z-index-popover-overlay:810;--monster-z-index-tooltip:800;--monster-z-index-tooltip-overlay:910;--monster-space-0:0;--monster-space-1:2px;--monster-space-2:4px;--monster-space-3:6px;--monster-space-4:10px;--monster-space-5:16px;--monster-space-6:26px;--monster-space-7:42px;--monster-breakpoint-0:480px;--monster-breakpoint-4:480px;--monster-breakpoint-7:768px;--monster-breakpoint-9:992px;--monster-breakpoint-12:1200px;--monster-dragger-width:2px;--monster-dragger-handle-width:4px;--monster-dragger-handle-height:50px}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.grid{display:grid}.inline-grid{display:inline-grid}.flex{display:flex}.inline-flex{display:inline-flex}.hidden,.hide,.none{display:none}.visible{visibility:visible}.invisible{visibility:hidden}.monster-border-primary-1,.monster-border-primary-2,.monster-border-primary-3,.monster-border-primary-4{border-width:var(--monster-border-width);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style)}.monster-border-0{border-width:0;border-radius:0;border-style:none}.monster-border-primary-1{border-color:var(--monster-bg-color-primary-1)}.monster-border-primary-2{border-color:var(--monster-bg-color-primary-2)}.monster-border-primary-3{border-color:var(--monster-bg-color-primary-3)}.monster-border-primary-4{border-color:var(--monster-bg-color-primary-4)}.monster-border-secondary-1,.monster-border-secondary-2,.monster-border-secondary-3,.monster-border-secondary-4{border-width:var(--monster-border-width);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style)}.monster-border-secondary-1{border-color:var(--monster-bg-color-secondary-1)}.monster-border-secondary-2{border-color:var(--monster-bg-color-secondary-2)}.monster-border-secondary-3{border-color:var(--monster-bg-color-secondary-3)}.monster-border-secondary-4{border-color:var(--monster-bg-color-secondary-4)}.monster-border-tertiary-1,.monster-border-tertiary-2,.monster-border-tertiary-3,.monster-border-tertiary-4{border-width:var(--monster-border-width);border-radius:var(--monster-border-radius);border-style:var(--monster-border-style)}.monster-border-tertiary-1{border-color:var(--monster-bg-color-tertiary-1)}.monster-border-tertiary-2{border-color:var(--monster-bg-color-tertiary-2)}.monster-border-tertiary-3{border-color:var(--monster-bg-color-tertiary-3)}.monster-border-tertiary-4{border-color:var(--monster-bg-color-tertiary-4)}.monster-theme-primary-1{background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1)}.monster-theme-primary-disabled-1{background-color:var(--monster-bg-color-primary-disabled-1);color:var(--monster-color-primary-disabled-1)}.monster-theme-secondary-1{background-color:var(--monster-bg-color-secondary-1);color:var(--monster-color-secondary-1)}.monster-theme-tertiary-1{background-color:var(--monster-bg-color-tertiary-1);color:var(--monster-color-tertiary-1)}.monster-theme-destructive-1{background-color:var(--monster-bg-color-destructive-1);color:var(--monster-color-destructive-1)}.monster-theme-danger-1{background-color:var(--monster-bg-color-danger-1);color:var(--monster-color-danger-1)}.monster-theme-success-1{background-color:var(--monster-bg-color-success-1);color:var(--monster-color-success-1)}.monster-theme-warning-1{background-color:var(--monster-bg-color-warning-1);color:var(--monster-color-warning-1)}.monster-theme-error-1{background-color:var(--monster-bg-color-error-1);color:var(--monster-color-error-1)}.monster-theme-selection-1{background-color:var(--monster-bg-color-selection-1);color:var(--monster-color-selection-1)}.monster-border-color-1{border-color:var(--monster-color-border-1)}.monster-color-neutral-1{color:var(--monster-color-primary-1)}.monster-bg-color-primary-1{background-color:var(--monster-bg-color-primary-1)}.monster-bg-color-secondary-1{background-color:var(--monster-bg-color-secondary-1)}.monster-bg-color-tertiary-1{background-color:var(--monster-bg-color-tertiary-1)}.monster-color-primary-1{background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1)}.monster-color-secondary-1{background-color:var(--monster-bg-color-secondary-1);color:var(--monster-color-secondary-1)}.monster-color-tertiary-1{background-color:var(--monster-bg-color-tertiary-1);color:var(--monster-color-tertiary-1)}.monster-color-destructive-1{background-color:var(--monster-bg-color-destructive-1);color:var(--monster-color-destructive-1)}.monster-color-danger-1{background-color:var(--monster-bg-color-danger-1);color:var(--monster-color-danger-1)}.monster-color-success-1{background-color:var(--monster-bg-color-success-1);color:var(--monster-color-success-1)}.monster-color-warning-1{background-color:var(--monster-bg-color-warning-1);color:var(--monster-color-warning-1)}.monster-color-error-1{background-color:var(--monster-bg-color-error-1);color:var(--monster-color-error-1)}.monster-color-selection-1{background-color:var(--monster-bg-color-selection-1);color:var(--monster-color-selection-1)}.monster-theme-primary-2{background-color:var(--monster-bg-color-primary-2);color:var(--monster-color-primary-2)}.monster-theme-primary-disabled-2{background-color:var(--monster-bg-color-primary-disabled-2);color:var(--monster-color-primary-disabled-2)}.monster-theme-secondary-2{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-2)}.monster-theme-tertiary-2{background-color:var(--monster-bg-color-tertiary-2);color:var(--monster-color-tertiary-2)}.monster-theme-destructive-2{background-color:var(--monster-bg-color-destructive-2);color:var(--monster-color-destructive-2)}.monster-theme-danger-2{background-color:var(--monster-bg-color-danger-2);color:var(--monster-color-danger-2)}.monster-theme-success-2{background-color:var(--monster-bg-color-success-2);color:var(--monster-color-success-2)}.monster-theme-warning-2{background-color:var(--monster-bg-color-warning-2);color:var(--monster-color-warning-2)}.monster-theme-error-2{background-color:var(--monster-bg-color-error-2);color:var(--monster-color-error-2)}.monster-theme-selection-2{background-color:var(--monster-bg-color-selection-2);color:var(--monster-color-selection-2)}.monster-border-color-2{border-color:var(--monster-color-border-2)}.monster-color-neutral-2{color:var(--monster-color-primary-2)}.monster-bg-color-primary-2{background-color:var(--monster-bg-color-primary-2)}.monster-bg-color-secondary-2{background-color:var(--monster-bg-color-secondary-2)}.monster-bg-color-tertiary-2{background-color:var(--monster-bg-color-tertiary-2)}.monster-color-primary-2{background-color:var(--monster-bg-color-primary-2);color:var(--monster-color-primary-2)}.monster-color-secondary-2{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-2)}.monster-color-tertiary-2{background-color:var(--monster-bg-color-tertiary-2);color:var(--monster-color-tertiary-2)}.monster-color-destructive-2{background-color:var(--monster-bg-color-destructive-2);color:var(--monster-color-destructive-2)}.monster-color-danger-2{background-color:var(--monster-bg-color-danger-2);color:var(--monster-color-danger-2)}.monster-color-success-2{background-color:var(--monster-bg-color-success-2);color:var(--monster-color-success-2)}.monster-color-warning-2{background-color:var(--monster-bg-color-warning-2);color:var(--monster-color-warning-2)}.monster-color-error-2{background-color:var(--monster-bg-color-error-2);color:var(--monster-color-error-2)}.monster-color-selection-2{background-color:var(--monster-bg-color-selection-2);color:var(--monster-color-selection-2)}.monster-theme-primary-3{background-color:var(--monster-bg-color-primary-3);color:var(--monster-color-primary-3)}.monster-theme-primary-disabled-3{background-color:var(--monster-bg-color-primary-disabled-3);color:var(--monster-color-primary-disabled-3)}.monster-theme-secondary-3{background-color:var(--monster-bg-color-secondary-3);color:var(--monster-color-secondary-3)}.monster-theme-tertiary-3{background-color:var(--monster-bg-color-tertiary-3);color:var(--monster-color-tertiary-3)}.monster-theme-destructive-3{background-color:var(--monster-bg-color-destructive-3);color:var(--monster-color-destructive-3)}.monster-theme-danger-3{background-color:var(--monster-bg-color-danger-3);color:var(--monster-color-danger-3)}.monster-theme-success-3{background-color:var(--monster-bg-color-success-3);color:var(--monster-color-success-3)}.monster-theme-warning-3{background-color:var(--monster-bg-color-warning-3);color:var(--monster-color-warning-3)}.monster-theme-error-3{background-color:var(--monster-bg-color-error-3);color:var(--monster-color-error-3)}.monster-theme-selection-3{background-color:var(--monster-bg-color-selection-3);color:var(--monster-color-selection-3)}.monster-border-color-3{border-color:var(--monster-color-border-3)}.monster-color-neutral-3{color:var(--monster-color-primary-3)}.monster-bg-color-primary-3{background-color:var(--monster-bg-color-primary-3)}.monster-bg-color-secondary-3{background-color:var(--monster-bg-color-secondary-3)}.monster-bg-color-tertiary-3{background-color:var(--monster-bg-color-tertiary-3)}.monster-color-primary-3{background-color:var(--monster-bg-color-primary-3);color:var(--monster-color-primary-3)}.monster-color-secondary-3{background-color:var(--monster-bg-color-secondary-3);color:var(--monster-color-secondary-3)}.monster-color-tertiary-3{background-color:var(--monster-bg-color-tertiary-3);color:var(--monster-color-tertiary-3)}.monster-color-destructive-3{background-color:var(--monster-bg-color-destructive-3);color:var(--monster-color-destructive-3)}.monster-color-danger-3{background-color:var(--monster-bg-color-danger-3);color:var(--monster-color-danger-3)}.monster-color-success-3{background-color:var(--monster-bg-color-success-3);color:var(--monster-color-success-3)}.monster-color-warning-3{background-color:var(--monster-bg-color-warning-3);color:var(--monster-color-warning-3)}.monster-color-error-3{background-color:var(--monster-bg-color-error-3);color:var(--monster-color-error-3)}.monster-color-selection-3{background-color:var(--monster-bg-color-selection-3);color:var(--monster-color-selection-3)}.monster-theme-primary-4{background-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4)}.monster-theme-primary-disabled-4{background-color:var(--monster-bg-color-primary-disabled-4);color:var(--monster-color-primary-disabled-4)}.monster-theme-secondary-4{background-color:var(--monster-bg-color-secondary-4);color:var(--monster-color-secondary-4)}.monster-theme-tertiary-4{background-color:var(--monster-bg-color-tertiary-4);color:var(--monster-color-tertiary-4)}.monster-theme-destructive-4{background-color:var(--monster-bg-color-destructive-4);color:var(--monster-color-destructive-4)}.monster-theme-danger-4{background-color:var(--monster-bg-color-danger-4);color:var(--monster-color-danger-4)}.monster-theme-success-4{background-color:var(--monster-bg-color-success-4);color:var(--monster-color-success-4)}.monster-theme-warning-4{background-color:var(--monster-bg-color-warning-4);color:var(--monster-color-warning-4)}.monster-theme-error-4{background-color:var(--monster-bg-color-error-4);color:var(--monster-color-error-4)}.monster-theme-selection-4{background-color:var(--monster-bg-color-selection-4);color:var(--monster-color-selection-4)}.monster-border-color-4{border-color:var(--monster-color-border-4)}.monster-color-neutral-4{color:var(--monster-color-primary-4)}.monster-bg-color-primary-4{background-color:var(--monster-bg-color-primary-4)}.monster-bg-color-secondary-4{background-color:var(--monster-bg-color-secondary-4)}.monster-bg-color-tertiary-4{background-color:var(--monster-bg-color-tertiary-4)}.monster-color-primary-4{background-color:var(--monster-bg-color-primary-4);color:var(--monster-color-primary-4)}.monster-color-secondary-4{background-color:var(--monster-bg-color-secondary-4);color:var(--monster-color-secondary-4)}.monster-color-tertiary-4{background-color:var(--monster-bg-color-tertiary-4);color:var(--monster-color-tertiary-4)}.monster-color-destructive-4{background-color:var(--monster-bg-color-destructive-4);color:var(--monster-color-destructive-4)}.monster-color-danger-4{background-color:var(--monster-bg-color-danger-4);color:var(--monster-color-danger-4)}.monster-color-success-4{background-color:var(--monster-bg-color-success-4);color:var(--monster-color-success-4)}.monster-color-warning-4{background-color:var(--monster-bg-color-warning-4);color:var(--monster-color-warning-4)}.monster-color-error-4{background-color:var(--monster-bg-color-error-4);color:var(--monster-color-error-4)}.monster-color-selection-4{background-color:var(--monster-bg-color-selection-4);color:var(--monster-color-selection-4)}.monster-theme-control-container-1,.monster-theme-control-row-1{border:1px solid var(--monster-theme-control-border-color)}.monster-theme-control-container-1,.monster-theme-control-element,.monster-theme-control-row-1{background-color:var(--monster-theme-control-bg-color);color:var(--monster-theme-control-color)}.monster-theme-control-background{background-color:var(--monster-theme-control-bg-color)}.monster-theme-background-inherit{background-color:inherit!important}.monster-theme-on{color:var(--monster-theme-on-color);background-color:var(--monster-theme-on-bg-color)}.monster-theme-off{color:var(--monster-theme-off-color);background-color:var(--monster-theme-off-bg-color)}a,a:active,a:focus-visible,a:hover,a:link,a:visited{color:var(--monster-color-secondary-1);text-decoration:none;outline:none;transition:color .3s ease-in-out,text-decoration-color .3s ease-in-out}a:active,a:focus-visible,a:hover{color:var(--monster-color-primary-2);text-decoration:underline;text-decoration-color:var(--monster-color-secondary-1 );text-decoration-thickness:1px;text-underline-offset:2px}a:focus-visible{outline:var(--monster-focus-ring-width,2px) var(--monster-focus-ring-style,solid) var(--monster-focus-ring-color,currentColor);outline-offset:var(--monster-focus-ring-offset,2px)}div[data-monster-role=popper]{box-sizing:border-box;display:none;padding:1.1em;z-index:var(--monster-z-index-modal);background:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);border-radius:var(--monster-border-radius);border-width:var(--monster-border-width);border-style:var(--monster-border-style);border-color:var(--monster-bg-color-primary-4);box-shadow:var(--monster-box-shadow-1)}[data-popper-arrow],[data-popper-arrow]:before{position:absolute;width:calc(max(var(--monster-popper-witharrrow-distance), -1*var(--monster-popper-witharrrow-distance))*2);height:calc(max(var(--monster-popper-witharrrow-distance), -1*var(--monster-popper-witharrrow-distance))*2);background:inherit}[data-popper-arrow]{visibility:hidden}[data-popper-arrow]:before{visibility:visible;content:\"\";transform:rotate(45deg);box-sizing:border-box}div[data-popper-placement^=top]>[data-popper-arrow]{bottom:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width)/2)}div[data-popper-placement^=top]>[data-popper-arrow]:before{border-left:transparent;border-right:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:transparent}div[data-popper-placement^=bottom]>[data-popper-arrow]{top:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width))}div[data-popper-placement^=bottom]>[data-popper-arrow]:before{border-right:transparent;border-left:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:transparent}div[data-popper-placement^=left]>[data-popper-arrow]{right:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width))}div[data-popper-placement^=left]>[data-popper-arrow]:before{border-left:transparent;border-right:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:transparent}div[data-popper-placement^=right]>[data-popper-arrow]{left:calc(var(--monster-popper-witharrrow-distance) - var(--monster-border-width)/2)}div[data-popper-placement^=right]>[data-popper-arrow]:before{border-right:transparent;border-left:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-bottom:var(--monster-border-width) var(--monster-border-style) var(--monster-bg-color-primary-4);border-top:transparent}[data-monster-role=control]{outline:none}[data-monster-role=control].flex{display:flex;flex-direction:row;align-items:center}:host{display:block;box-sizing:border-box}.monster-badge-primary{padding:.25em .4em}.monster-badge-primary,.monster-badge-primary-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;color:var(--monster-color-primary-4);background-color:var(--monster-bg-color-primary-4)}.monster-badge-primary-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-secondary{padding:.25em .4em}.monster-badge-secondary,.monster-badge-secondary-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-secondary-3);color:var(--monster-color-secondary-3)}.monster-badge-secondary-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-tertiary{padding:.25em .4em}.monster-badge-tertiary,.monster-badge-tertiary-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-tertiary-3);color:var(--monster-color-tertiary-3)}.monster-badge-tertiary-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-destructive{padding:.25em .4em}.monster-badge-destructive,.monster-badge-destructive-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-destructive-1);color:var(--monster-color-destructive-1)}.monster-badge-destructive-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-success{padding:.25em .4em}.monster-badge-success,.monster-badge-success-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-success-1);color:var(--monster-color-success-1)}.monster-badge-success-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-warning{padding:.25em .4em}.monster-badge-warning,.monster-badge-warning-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-warning-1);color:var(--monster-color-warning-1)}.monster-badge-warning-pill{padding:.25em .6em;border-radius:10rem}.monster-badge-error{padding:.25em .4em}.monster-badge-error,.monster-badge-error-pill{display:inline-block;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;text-decoration:none;background-color:var(--monster-bg-color-error-1);color:var(--monster-color-error-1)}.monster-badge-error-pill{padding:.25em .6em;border-radius:10rem}:host{display:flex;width:100%;max-width:100%;min-width:0}[data-monster-role=control]{box-sizing:border-box;padding:var(--monster-space-1);position:relative;margin:0;display:flex;width:100%;max-width:100%;min-width:0;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:var(--monster-space-2);background:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);border:var(--monster-border-width) solid var(--monster-color-primary-2);border-radius:var(--monster-border-radius)}#visible-elements{display:flex;flex-wrap:nowrap;list-style:none;padding:0;margin:0;gap:var(--monster-space-1)}#visible-elements li{white-space:nowrap;cursor:pointer;position:relative}#visible-elements li>a{display:block;padding:var(--monster-space-2) var(--monster-space-3);color:var(--monster-color-primary-1);text-decoration:none;border-radius:var(--monster-border-radius);transition:background-color .2s,color .2s;outline-offset:-2px}#visible-elements li>a:hover{color:var(--monster-color-secondary-1);background-color:var(--monster-bg-color-secondary-2)}#hamburger-button{display:flex;align-items:center;justify-content:center;margin:0;padding:var(--monster-space-2);cursor:pointer;background:transparent;color:var(--monster-color-primary-1);border:1px solid transparent;border-radius:var(--monster-border-radius);transition:background-color .2s,color .2s;flex-shrink:0;width:auto;height:auto}#hamburger-button:hover{background:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-1)}#hamburger-button>svg{fill:currentColor}[data-monster-role=navigation]{flex-grow:1;min-width:0}[part=hamburger-container]{height:100%;display:flex;align-items:center}#hamburger-button{height:100%;aspect-ratio:1/1}[part=hamburger-nav],[part=mega-menu],[part=submenu]{display:none;position:absolute;top:0;left:0;background-color:var(--monster-bg-color-primary-1);color:var(--monster-color-primary-1);border-radius:var(--monster-border-radius);border:1px solid var(--monster-color-primary-2);box-shadow:var(--monster-box-shadow-2);list-style:none;padding:var(--monster-space-1);margin:0;z-index:var(--monster-z-index-modal);min-width:220px}[part=mega-menu].is-open,[part=submenu].is-open{display:block}[part=submenu]>li:not(:last-child){margin-bottom:var(--monster-space-1)}[part=hamburger-nav] li a,[part=submenu] li a{-webkit-user-select:none;-moz-user-select:none;user-select:none;display:block;padding:var(--monster-space-2) var(--monster-space-3);text-decoration:none;color:var(--monster-color-primary-1);border-radius:var(--monster-border-radius);white-space:nowrap;outline-offset:-2px;transition:background-color .2s,color .2s}[part=hamburger-nav] li a:hover,[part=submenu] li a:hover{background-color:var(--monster-bg-color-secondary-2);color:var(--monster-color-secondary-1)}[part=hamburger-nav] [part=hidden-list]{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--monster-space-1)}[part=hamburger-nav] [part=mega-menu],[part=hamburger-nav] [part=submenu]{box-sizing:border-box;position:relative;width:100%;margin-top:var(--monster-space-3);padding:var(--monster-space-3) 0 0 var(--monster-space-4);background-color:transparent;border:none;box-shadow:none;min-width:unset;top:auto;left:auto}[part=hamburger-nav] [part=mega-menu]:before,[part=hamburger-nav] [part=submenu]:before{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background-color:var(--monster-color-primary-2)}[part=mega-menu]{padding:var(--monster-space-4);min-width:400px}.mega-menu-columns{flex-wrap:wrap;gap:var(--monster-space-2)}.column{flex:1}[part=hamburger-header]{display:none}@media (max-width:768px){[part=hamburger-nav][style*=\"display: block\"]{display:flex;flex-direction:column;position:fixed;top:0;left:0;width:100vw;height:100vh;padding:var(--monster-space-4);box-sizing:border-box;overflow-y:auto;border-radius:0;border:none;z-index:var(--monster-z-index-overlay)}[part=hamburger-nav] [part=hidden-list]{flex-grow:1}[part=hamburger-header]{display:flex;justify-content:flex-end;align-items:center;padding-bottom:var(--monster-space-3);margin-bottom:var(--monster-space-3);border-bottom:1px solid var(--monster-color-primary-2)}[part=hamburger-close-button]{background:transparent;border:none;color:var(--monster-color-primary-1);cursor:pointer;padding:var(--monster-space-1)}[part=hamburger-close-button]:hover{color:var(--monster-color-secondary-1)}:global(body.monster-navigation-open){overflow:hidden}}
|
|
29
29
|
}`,
|
|
30
30
|
0,
|
|
31
31
|
);
|