@maggioli-design-system/magma 1.10.4 → 1.10.5

package/dist/magma-components/{p-22c5a63b.entry.js → p-d8a0b371.entry.js}

@@ -1 +1 @@
-import{r as t,h as n,H as r,g as o}from"./p-3a6b32e7.js";import{K as a}from"./p-23e7e277.js";import{u as s,s as e}from"./p-f00c93f4.js";const d={sm:"action",md:"action",lg:"h6",xl:"h4"},i="data:image/svg+xml;base64,",h=t=>!!t&&t.startsWith(i),c=t=>!!t&&t.startsWith("<svg "),b=class{constructor(n){t(this,n),n.$hostElement$["s-ei"]?this.internals=n.$hostElement$["s-ei"]:(this.internals=n.$hostElement$.attachInternals(),n.$hostElement$["s-ei"]=this.internals),this.km=new a,this.iconPosition="left",this.type="submit",this.variant="primary",this.tone="strong",this.size="md",this.target="self",this.truncate="word",this.handleRequestSubmitForm=t=>{var n;t.preventDefault(),null===(n=this.internals.form)||void 0===n||n.requestSubmit()},this.handleReset=t=>{var n;t.preventDefault(),null===(n=this.internals.form)||void 0===n||n.reset()},this.mouseDown=()=>{this.active=!0},this.mouseUp=()=>{this.active=!1},this.redirectBlank=()=>{if("undefined"==typeof window)throw Error("Object window is not defined");window.open(this.href,"_blank")},this.onSlotChangeHandler=()=>{this.hasText=""!==this.host.innerHTML.trim()||this.host.children.length>0}}disabledChanged(t){t?this.km.attachClickBehavior():(this.km.detachClickBehavior(),this.disabled=void 0)}awaitChanged(t){this.host.setAttribute("aria-busy",(!!t).toString()),t?this.km.attachClickBehavior():this.km.detachClickBehavior()}handleTypeChange(t){this.internals.form&&("submit"===t?(this.host.removeEventListener("click",this.handleReset),this.host.addEventListener("click",this.handleRequestSubmitForm)):"reset"===t?(this.host.removeEventListener("click",this.handleRequestSubmitForm),this.host.addEventListener("click",this.handleReset)):(this.host.removeEventListener("click",this.handleRequestSubmitForm),this.host.removeEventListener("click",this.handleReset)))}handleVariantChange(t){"google"!==t?"apple"!==t||(this.icon='<svg xmlns="http://www.w3.org/2000/svg" id="mdi-apple" viewBox="0 0 24 24"><path d="M18.71,19.5C17.88,20.74 17,21.95 15.66,21.97C14.32,22 13.89,21.18 12.37,21.18C10.84,21.18 10.37,21.95 9.1,22C7.79,22.05 6.8,20.68 5.96,19.47C4.25,17 2.94,12.45 4.7,9.39C5.57,7.87 7.13,6.91 8.82,6.88C10.1,6.86 11.32,7.75 12.11,7.75C12.89,7.75 14.37,6.68 15.92,6.84C16.57,6.87 18.39,7.1 19.56,8.82C19.47,8.88 17.39,10.1 17.41,12.63C17.44,15.65 20.06,16.66 20.09,16.67C20.06,16.74 19.67,18.11 18.71,19.5M13,3.5C13.73,2.67 14.94,2.04 15.94,2C16.07,3.17 15.6,4.35 14.9,5.19C14.21,6.04 13.07,6.7 11.95,6.61C11.8,5.46 12.36,4.26 13,3.5Z" /></svg>'):this.icon='<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" xmlnsXlink="http://www.w3.org/1999/xlink"><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path><path fill="none" d="M0 0h48v48H0z"></path></svg>\n'}componentWillLoad(){this.hasNotification=null!==this.host.querySelector(':scope > [slot="notification"]'),this.hasText=""!==this.host.innerHTML.trim()||this.host.children.length>0,this.handleVariantChange(this.variant),this.href?this.host.addEventListener("click",(t=>{var n;t.preventDefault(),"blank"!==this.target?"undefined"!=typeof window&&(window.location.href=null!==(n=this.href)&&void 0!==n?n:""):this.redirectBlank()})):this.internals.form&&("submit"===this.type?this.host.addEventListener("click",this.handleRequestSubmitForm):"reset"===this.type&&this.host.addEventListener("click",this.handleReset))}componentDidLoad(){if(this.km.addElement(this.host),this.await||this.km.attachClickBehavior(),this.host.setAttribute("aria-busy",this.await?"true":"false"),this.autoFocus&&this.host.focus(),!h(this.icon)&&!c(this.icon)){if(!this.hasText&&this.icon){const t=s(this.icon);this.host.hasAttribute("aria-label")||e(this.host,"title",t),this.host.hasAttribute("title")||e(this.host,"aria-label",t)}e(this.host,"role","button")}}handleAwaitChange(t){if(!1===t)return this.await=void 0,void this.km.detachClickBehavior();this.km.attachClickBehavior()}connectedCallback(){this.disabled||this.host.removeAttribute("disabled")}disconnectedCallback(){this.km.detachClickBehavior()}render(){return this.typography=d[this.size],n(r,{key:"3c54ecab2250be89d7f925cd4fea6eaeea05fa1f",onMouseDown:this.mouseDown,onMouseUp:this.mouseUp,onMouseOut:this.mouseUp,tabindex:"0"},n("div",{key:"41edeab2fca583980ac046866f9b0b4c14268f60",class:"await"},n("mds-spinner",{key:"9b7d06b88d13aa5f343f476fc7aec4aef824670b",class:"spinner",running:this.await})),this.icon&&"left"===this.iconPosition&&n("mds-icon",{key:"46f069315b6006c19183b10fc5e3fdc73d2b7e09","aria-hidden":"true",class:"icon",name:this.icon,part:"icon"}),n("mds-text",{key:"6f15cf82126c3c1e04e00eae75fc43ea657782ea",class:"text",part:"label",typography:this.typography,truncate:this.truncate},n("slot",{key:"3e068fcac844e33b49afdc5dbff20bd65238136d",onSlotchange:this.onSlotChangeHandler})),this.hasNotification&&n("slot",{key:"0482835f6c3160521b9fe2e04ef6721d28815167",name:"notification"}),this.icon&&"right"===this.iconPosition&&n("mds-icon",{key:"8d11f6f28287b34517b276431f7cb1d31fad9617","aria-hidden":"true",class:"icon",name:this.icon,part:"icon"}))}static get formAssociated(){return!0}get host(){return o(this)}static get watchers(){return{disabled:["disabledChanged"],await:["awaitChanged","handleAwaitChange"],type:["handleTypeChange"],variant:["handleVariantChange"]}}};function m(t){return new Promise((function(n,r){t.oncomplete=t.onsuccess=function(){return n(t.result)},t.onabort=t.onerror=function(){return r(t.error)}}))}var u;function v(){return u||(u=function(t,n){var r=indexedDB.open("keyval-store");r.onupgradeneeded=function(){return r.result.createObjectStore(n)};var o=m(r);return function(t,r){return o.then((function(o){return r(o.transaction(n,t).objectStore(n))}))}}(0,"keyval")),u}b.style='@-webkit-keyframes focus-bounce {\n  0%, 75%, 100% {\n    outline-offset: var(--magma-outline-focus-offset, 6px);\n  }\n\n  50% {\n    outline-offset: var(--magma-outline-blur-offset, 2px);\n  }\n}\n\n@keyframes focus-bounce {\n  0%, 75%, 100% {\n    outline-offset: var(--magma-outline-focus-offset, 6px);\n  }\n\n  50% {\n    outline-offset: var(--magma-outline-blur-offset, 2px);\n  }\n}\n\n@tailwind components;\n\n\n/**\n * @prop --mds-button-await-duration: Sets the duration of the rotation of the spinner await component\n * @prop --mds-button-background: Sets the background-color of the component\n * @prop --mds-button-border-color: Sets the color of the border of the component (based on box-shadow declaration)\n * @prop --mds-button-border-default-opacity: Sets the default opacity of the border color of the component (based on box-shadow declaration)\n * @prop --mds-button-border-high-contrast-hover-width: Sets the width of the border when the component is hovered and the contrast is high (based on box-shadow declaration)\n * @prop --mds-button-border-high-contrast-width: Sets the width of the border of the component and the contrast is high (based on box-shadow declaration)\n * @prop --mds-button-border-hover-opacity: Sets the opacity of the border color when the component is hovered (based on box-shadow declaration)\n * @prop --mds-button-border-opacity: Sets the border opacity of the component (based on box-shadow declaration)\n * @prop --mds-button-border-tone-ghost-hover-width: Sets the width of the border when the component is hovered when the tone is set to `ghost` (based on box-shadow declaration)\n * @prop --mds-button-border-tone-strong-hover-width: Sets the width of the border when the component is hovered when the tone is set to `strong` (based on box-shadow declaration)\n * @prop --mds-button-border-tone-weak-hover-width: Sets the width of the border when the component is hovered when the tone is set to `weak` (based on box-shadow declaration)\n * @prop --mds-button-border-width: Sets the border width of the component (based on box-shadow declaration)\n * @prop --mds-button-color: Sets the text color of the component\n * @prop --mds-button-gap: Sets the distance betwen element inside the components, use it instead of setting gap property directly.\n * @prop --mds-button-radius: Sets the border-radius of the component\n */\n\n:host {\n  --mds-button-await-duration: 0.725s;\n  --mds-button-background: rgb(var(--variant-primary-02));\n  --mds-button-border-color: 0 0 0;\n  --mds-button-border-hover-opacity: 0.75;\n  --mds-button-border-default-opacity: 0.5;\n  --mds-button-border-tone-strong-hover-width: 0.0625rem;\n  --mds-button-border-tone-ghost-hover-width: 3px;\n  --mds-button-border-tone-weak-hover-width: 0.0625rem;\n  --mds-button-border-high-contrast-width: 0.125rem;\n  --mds-button-border-high-contrast-hover-width: 3px;\n  --mds-button-border-opacity: 0;\n  --mds-button-border-width: 0.125rem;\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-gap: 0.5rem;\n  --mds-button-line-clamp: 1;\n  --mds-button-radius: 0.5rem;\n    -webkit-animation-duration: var(--magma-outline-animation-duration, 1s);\n    animation-duration: var(--magma-outline-animation-duration, 1s);\n    -webkit-animation-fill-mode: forwards;\n    animation-fill-mode: forwards;\n    -webkit-animation-iteration-count: infinite;\n    animation-iteration-count: infinite;\n    -webkit-animation-name: focus-bounce;\n    animation-name: focus-bounce;\n    -webkit-animation-play-state: paused;\n    animation-play-state: paused;\n    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    outline: var(--magma-outline-blur);\n    -webkit-transition-duration: 200ms;\n    transition-duration: 200ms;\n    -webkit-transition-property: background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;\n    transition-property: background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;\n    transition-property: background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;\n    transition-property: background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;\n    -webkit-transition-timing-function: ease-in-out;\n    transition-timing-function: ease-in-out;\n}\n\n:host:focus-visible {\n    --magma-outline-blur: var(--magma-outline-focus);\n\n    -webkit-animation-play-state: running;\n\n    animation-play-state: running;\n  }\n\n:host {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  -webkit-transition-duration: 200ms;\n  transition-duration: 200ms;\n  -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n\n  -ms-flex-align: center;\n\n  align-items: center;\n  background-color: var(--mds-button-background);\n  border-radius: var(--mds-button-radius);\n  -webkit-box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n  box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n  -webkit-box-sizing: border-box;\n  box-sizing: border-box;\n  color: var(--mds-button-color);\n  cursor: pointer;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  fill: currentcolor;\n  gap: var(--mds-button-gap);\n  -ms-flex-pack: center;\n  justify-content: center;\n  position: relative;\n  -webkit-transition-property: background-color, border-color, color, outline, outline-offset, padding-left, padding-right, -webkit-box-shadow, -webkit-transform;\n  transition-property: background-color, border-color, color, outline, outline-offset, padding-left, padding-right, -webkit-box-shadow, -webkit-transform;\n  transition-property: background-color, border-color, box-shadow, color, outline, outline-offset, padding-left, padding-right, transform;\n  transition-property: background-color, border-color, box-shadow, color, outline, outline-offset, padding-left, padding-right, transform, -webkit-box-shadow, -webkit-transform;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          -ms-user-select: none;\n          user-select: none;\n}\n\n:host(:focus-visible) {\n    --magma-outline-blur: var(--magma-outline-focus);\n\n    -webkit-animation-play-state: running;\n\n    animation-play-state: running;\n\n    z-index: 10;\n  }\n\n.text {\n  --mds-text-line-clamp: var(--mds-button-line-clamp);\n}\n\n.text::first-letter {\n  text-transform: uppercase;\n}\n\n.icon {\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -ms-flex-align: center;\n\n  align-items: center;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  fill: inherit;\n  -ms-flex-negative: 0;\n  flex-shrink: 0;\n  -ms-flex-pack: center;\n  justify-content: center;\n  pointer-events: none;\n  -webkit-transition-property: fill;\n  transition-property: fill;\n}\n\n:host-context(mds-button-group):host(:not(:first-child)) {\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n\n:host-context(mds-button-group):host(:not(:last-child)) {\n  border-bottom-right-radius: 0;\n  border-top-right-radius: 0;\n}\n\n.await {\n  height: 1.5rem;\n  width: 1.5rem;\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  display: none;\n  margin-right: calc(calc(-1 * var(--mds-button-gap)) - 1.5rem);\n  -webkit-transform: scale(0);\n  transform: scale(0);\n  transition-behavior: allow-discrete;\n  -webkit-transition-property: display, margin-right, opacity, width, -webkit-transform;\n  transition-property: display, margin-right, opacity, width, -webkit-transform;\n  transition-property: display, margin-right, opacity, transform, width;\n  transition-property: display, margin-right, opacity, transform, width, -webkit-transform;\n}\n\n.spinner {\n  height: 1.5rem;\n  width: 1.5rem;\n\n  --mds-spinner-duration: var(--mds-button-await-duration);\n\n  color: currentcolor;\n}\n\n:host(:not([await])) .spinner,\n:host([await="false"]) .spinner {\n  -webkit-transition-duration: 200ms;\n  transition-duration: 200ms;\n  -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n:host([await]:not([await="false"])) .await {\n  margin-right: 0rem;\n  opacity: 1;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -webkit-transform: scale(1);\n  transform: scale(1);\n\n  @starting-style {\n    margin-right: calc(calc(-1 * var(--mds-button-gap)) - 1.5rem);\n    opacity: 0;\n    -webkit-transform: scale(0);\n    transform: scale(0);\n  }\n}\n\n:host([await]:not([await="false"])) {\n  pointer-events: none;\n}\n\n:host([disabled]:not([disabled="false"])) {\n  opacity: 0.5;\n\n  pointer-events: none;\n}\n\n:host([size="sm"]) {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0rem;\n  padding-bottom: 0rem;\n\n  --mds-button-radius: 0.375rem;\n\n  min-height: 1.75rem;\n  min-width: 1.75rem;\n}\n\n:host([size="sm"]:not([has-text])) {\n  padding: 0rem;\n}\n\n:host([size="sm"]) .text {\n  font-weight: 500;\n}\n\n:host([size="sm"]) .icon {\n  height: 1rem;\n  width: 1rem;\n}\n\n:host([size="sm"][await]:not([await="false"]) ) .await {\n  -webkit-transform: scale(.75);\n  transform: scale(.75);\n}\n\n:host([size="md"]) {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\n:host([size="md"]:not([has-text])) {\n  padding: 0.25rem;\n}\n\n:host([size="lg"]) {\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n\n  min-height: 3rem;\n  min-width: 3rem;\n}\n\n:host([size="lg"]:not([has-text])) {\n  padding: 0.5rem;\n}\n\n:host([size="xl"]) {\n  padding-left: 2rem;\n  padding-right: 2rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n\n  min-height: 3.25rem;\n  min-width: 3.25rem;\n}\n\n:host([size="xl"]:not([has-text])) {\n  padding: 0.5rem;\n}\n\n:host(:not([has-text])) .text {\n  display: none;\n}\n\n:host([variant="dark"][tone="strong"]) {\n  --mds-button-background: rgb(var(--tone-neutral-04));\n  --mds-button-border-color: var(--tone-neutral-04);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="dark"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral-05));\n  --mds-button-border-color: var(--tone-neutral-05);\n}\n\n:host([variant="dark"][tone="weak"]) {\n  --mds-button-background: rgb(var(--tone-neutral-08));\n  --mds-button-border-color: var(--tone-neutral-08);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n\n  fill: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="dark"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral-07));\n  --mds-button-border-color: var(--tone-neutral-07);\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="dark"][tone="ghost"]) {\n  --mds-button-border-color: var(--tone-neutral-04);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="dark"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--tone-neutral-04);\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="dark"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="dark"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--tone-neutral-04));\n}\n\n:host([variant="dark"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--tone-neutral-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-ai-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--variant-ai-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="ai"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-02));\n  --mds-button-border-color: var(--variant-ai-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-ai-09));\n  --mds-button-color: rgb(var(--variant-ai-02));\n  --mds-button-border-color: var(--variant-ai-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--variant-ai-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-10));\n  --mds-button-color: rgb(var(--variant-ai-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--variant-ai-08));\n  --mds-button-color: rgb(var(--variant-ai-01));\n\n  fill: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-ai-03);\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-ai-03);\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--variant-ai-04);\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-ai-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="strong"]) {\n    --mds-button-background: rgb(var(--variant-ai-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--variant-ai-02));\n    --mds-button-border-color: var(--variant-ai-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="weak"]) {\n    --mds-button-background: rgb(var(--variant-ai-09));\n    --mds-button-color: rgb(var(--variant-ai-02));\n    --mds-button-border-color: var(--variant-ai-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--variant-ai-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--variant-ai-10));\n    --mds-button-color: rgb(var(--variant-ai-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--variant-ai-08));\n    --mds-button-color: rgb(var(--variant-ai-01));\n\n    fill: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="ghost"]) {\n    --mds-button-border-color: var(--variant-ai-03);\n    --mds-button-color: rgb(var(--variant-ai-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--variant-ai-03);\n    --mds-button-color: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--variant-ai-04);\n    --mds-button-color: rgb(var(--variant-ai-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--variant-ai-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--variant-ai-01));\n  }\n}\n\n:host([variant="ai"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-ai-05));\n  --mds-button-border-color: var(--variant-ai-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="ai"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-04));\n  --mds-button-border-color: var(--variant-ai-04);\n}\n\n:host([variant="ai"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-ai-09));\n  --mds-button-border-color: var(--variant-ai-09);\n  --mds-button-color: rgb(var(--variant-ai-03));\n\n  fill: rgb(var(--variant-ai-03));\n}\n\n:host([variant="ai"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-08));\n  --mds-button-border-color: var(--variant-ai-08);\n}\n\n:host([variant="ai"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-ai-04);\n  --mds-button-color: rgb(var(--variant-ai-03));\n}\n\n:host([variant="ai"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-ai-04);\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host([variant="ai"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host([variant="ai"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-ai-04));\n}\n\n:host([variant="ai"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-error-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-error-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="error"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-error-02));\n  --mds-button-border-color: var(--status-error-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-error-09));\n  --mds-button-color: rgb(var(--status-error-02));\n  --mds-button-border-color: var(--status-error-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-error-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-error-10));\n  --mds-button-color: rgb(var(--status-error-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-error-08));\n  --mds-button-color: rgb(var(--status-error-01));\n\n  fill: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-error-03);\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-error-03);\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-error-04);\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-error-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="error"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-error-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="error"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-error-02));\n    --mds-button-border-color: var(--status-error-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-error-09));\n    --mds-button-color: rgb(var(--status-error-02));\n    --mds-button-border-color: var(--status-error-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-error-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-error-10));\n    --mds-button-color: rgb(var(--status-error-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-error-08));\n    --mds-button-color: rgb(var(--status-error-01));\n\n    fill: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-error-03);\n    --mds-button-color: rgb(var(--status-error-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-error-03);\n    --mds-button-color: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-error-04);\n    --mds-button-color: rgb(var(--status-error-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-error-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-error-01));\n  }\n}\n\n:host([variant="error"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-error-05));\n  --mds-button-border-color: var(--status-error-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="error"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-error-04));\n  --mds-button-border-color: var(--status-error-04);\n}\n\n:host([variant="error"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-error-09));\n  --mds-button-border-color: var(--status-error-09);\n  --mds-button-color: rgb(var(--status-error-03));\n\n  fill: rgb(var(--status-error-03));\n}\n\n:host([variant="error"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-error-08));\n  --mds-button-border-color: var(--status-error-08);\n}\n\n:host([variant="error"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-error-04);\n  --mds-button-color: rgb(var(--status-error-03));\n}\n\n:host([variant="error"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-error-04);\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host([variant="error"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host([variant="error"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-error-04));\n}\n\n:host([variant="error"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-info-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-info-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="info"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-info-02));\n  --mds-button-border-color: var(--status-info-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-info-09));\n  --mds-button-color: rgb(var(--status-info-02));\n  --mds-button-border-color: var(--status-info-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-info-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-info-10));\n  --mds-button-color: rgb(var(--status-info-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-info-08));\n  --mds-button-color: rgb(var(--status-info-01));\n\n  fill: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-info-03);\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-info-03);\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-info-04);\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-info-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="info"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-info-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="info"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-info-02));\n    --mds-button-border-color: var(--status-info-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-info-09));\n    --mds-button-color: rgb(var(--status-info-02));\n    --mds-button-border-color: var(--status-info-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-info-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-info-10));\n    --mds-button-color: rgb(var(--status-info-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-info-08));\n    --mds-button-color: rgb(var(--status-info-01));\n\n    fill: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-info-03);\n    --mds-button-color: rgb(var(--status-info-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-info-03);\n    --mds-button-color: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-info-04);\n    --mds-button-color: rgb(var(--status-info-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-info-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-info-01));\n  }\n}\n\n:host([variant="info"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-info-05));\n  --mds-button-border-color: var(--status-info-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="info"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-info-04));\n  --mds-button-border-color: var(--status-info-04);\n}\n\n:host([variant="info"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-info-09));\n  --mds-button-border-color: var(--status-info-09);\n  --mds-button-color: rgb(var(--status-info-03));\n\n  fill: rgb(var(--status-info-03));\n}\n\n:host([variant="info"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-info-08));\n  --mds-button-border-color: var(--status-info-08);\n}\n\n:host([variant="info"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-info-04);\n  --mds-button-color: rgb(var(--status-info-03));\n}\n\n:host([variant="info"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-info-04);\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host([variant="info"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host([variant="info"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-info-04));\n}\n\n:host([variant="info"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n:host([variant="light"][tone="strong"]) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="light"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n}\n\n:host([variant="light"][tone="weak"]) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n\n  fill: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="light"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="light"][tone="ghost"]) {\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-primary-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--variant-primary-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="primary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-02));\n  --mds-button-border-color: var(--variant-primary-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-primary-09));\n  --mds-button-color: rgb(var(--variant-primary-02));\n  --mds-button-border-color: var(--variant-primary-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--variant-primary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-10));\n  --mds-button-color: rgb(var(--variant-primary-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--variant-primary-08));\n  --mds-button-color: rgb(var(--variant-primary-01));\n\n  fill: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-primary-03);\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-primary-03);\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-primary-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="strong"]) {\n    --mds-button-background: rgb(var(--variant-primary-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--variant-primary-02));\n    --mds-button-border-color: var(--variant-primary-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="weak"]) {\n    --mds-button-background: rgb(var(--variant-primary-09));\n    --mds-button-color: rgb(var(--variant-primary-02));\n    --mds-button-border-color: var(--variant-primary-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--variant-primary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--variant-primary-10));\n    --mds-button-color: rgb(var(--variant-primary-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--variant-primary-08));\n    --mds-button-color: rgb(var(--variant-primary-01));\n\n    fill: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="ghost"]) {\n    --mds-button-border-color: var(--variant-primary-03);\n    --mds-button-color: rgb(var(--variant-primary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--variant-primary-03);\n    --mds-button-color: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--variant-primary-04);\n    --mds-button-color: rgb(var(--variant-primary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--variant-primary-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--variant-primary-01));\n  }\n}\n\n:host([variant="primary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-primary-04));\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="primary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-03));\n  --mds-button-border-color: var(--variant-primary-03);\n}\n\n:host([variant="primary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-primary-09));\n  --mds-button-border-color: var(--variant-primary-09);\n  --mds-button-color: rgb(var(--variant-primary-03));\n\n  fill: rgb(var(--variant-primary-03));\n}\n\n:host([variant="primary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-08));\n  --mds-button-border-color: var(--variant-primary-08);\n}\n\n:host([variant="primary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--variant-primary-03));\n}\n\n:host([variant="primary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host([variant="primary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host([variant="primary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-primary-04));\n}\n\n:host([variant="primary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-secondary-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--variant-secondary-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-02));\n  --mds-button-border-color: var(--variant-secondary-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-secondary-09));\n  --mds-button-color: rgb(var(--variant-secondary-02));\n  --mds-button-border-color: var(--variant-secondary-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--variant-secondary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-10));\n  --mds-button-color: rgb(var(--variant-secondary-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--variant-secondary-08));\n  --mds-button-color: rgb(var(--variant-secondary-01));\n\n  fill: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-secondary-03);\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-secondary-03);\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-secondary-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="strong"]) {\n    --mds-button-background: rgb(var(--variant-secondary-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--variant-secondary-02));\n    --mds-button-border-color: var(--variant-secondary-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="weak"]) {\n    --mds-button-background: rgb(var(--variant-secondary-09));\n    --mds-button-color: rgb(var(--variant-secondary-02));\n    --mds-button-border-color: var(--variant-secondary-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--variant-secondary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--variant-secondary-10));\n    --mds-button-color: rgb(var(--variant-secondary-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--variant-secondary-08));\n    --mds-button-color: rgb(var(--variant-secondary-01));\n\n    fill: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="ghost"]) {\n    --mds-button-border-color: var(--variant-secondary-03);\n    --mds-button-color: rgb(var(--variant-secondary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--variant-secondary-03);\n    --mds-button-color: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--variant-secondary-04);\n    --mds-button-color: rgb(var(--variant-secondary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--variant-secondary-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--variant-secondary-01));\n  }\n}\n\n:host([variant="secondary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-secondary-04));\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="secondary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-03));\n  --mds-button-border-color: var(--variant-secondary-03);\n}\n\n:host([variant="secondary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-secondary-09));\n  --mds-button-border-color: var(--variant-secondary-09);\n  --mds-button-color: rgb(var(--variant-secondary-03));\n\n  fill: rgb(var(--variant-secondary-03));\n}\n\n:host([variant="secondary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-08));\n  --mds-button-border-color: var(--variant-secondary-08);\n}\n\n:host([variant="secondary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--variant-secondary-03));\n}\n\n:host([variant="secondary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host([variant="secondary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host([variant="secondary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-secondary-04));\n}\n\n:host([variant="secondary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-success-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-success-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="success"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-success-02));\n  --mds-button-border-color: var(--status-success-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-success-09));\n  --mds-button-color: rgb(var(--status-success-02));\n  --mds-button-border-color: var(--status-success-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-success-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-success-10));\n  --mds-button-color: rgb(var(--status-success-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-success-08));\n  --mds-button-color: rgb(var(--status-success-01));\n\n  fill: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-success-03);\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-success-03);\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-success-04);\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-success-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="success"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-success-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="success"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-success-02));\n    --mds-button-border-color: var(--status-success-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-success-09));\n    --mds-button-color: rgb(var(--status-success-02));\n    --mds-button-border-color: var(--status-success-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-success-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-success-10));\n    --mds-button-color: rgb(var(--status-success-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-success-08));\n    --mds-button-color: rgb(var(--status-success-01));\n\n    fill: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-success-03);\n    --mds-button-color: rgb(var(--status-success-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-success-03);\n    --mds-button-color: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-success-04);\n    --mds-button-color: rgb(var(--status-success-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-success-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-success-01));\n  }\n}\n\n:host([variant="success"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-success-05));\n  --mds-button-border-color: var(--status-success-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="success"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-success-04));\n  --mds-button-border-color: var(--status-success-04);\n}\n\n:host([variant="success"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-success-09));\n  --mds-button-border-color: var(--status-success-09);\n  --mds-button-color: rgb(var(--status-success-03));\n\n  fill: rgb(var(--status-success-03));\n}\n\n:host([variant="success"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-success-08));\n  --mds-button-border-color: var(--status-success-08);\n}\n\n:host([variant="success"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-success-04);\n  --mds-button-color: rgb(var(--status-success-03));\n}\n\n:host([variant="success"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-success-04);\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host([variant="success"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host([variant="success"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-success-04));\n}\n\n:host([variant="success"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-warning-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-warning-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="warning"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-02));\n  --mds-button-border-color: var(--status-warning-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-warning-09));\n  --mds-button-color: rgb(var(--status-warning-02));\n  --mds-button-border-color: var(--status-warning-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-warning-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-10));\n  --mds-button-color: rgb(var(--status-warning-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-warning-08));\n  --mds-button-color: rgb(var(--status-warning-01));\n\n  fill: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-warning-03);\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-warning-03);\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-warning-04);\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-warning-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-warning-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-warning-02));\n    --mds-button-border-color: var(--status-warning-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-warning-09));\n    --mds-button-color: rgb(var(--status-warning-02));\n    --mds-button-border-color: var(--status-warning-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-warning-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-warning-10));\n    --mds-button-color: rgb(var(--status-warning-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-warning-08));\n    --mds-button-color: rgb(var(--status-warning-01));\n\n    fill: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-warning-03);\n    --mds-button-color: rgb(var(--status-warning-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-warning-03);\n    --mds-button-color: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-warning-04);\n    --mds-button-color: rgb(var(--status-warning-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-warning-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-warning-01));\n  }\n}\n\n:host([variant="warning"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-warning-05));\n  --mds-button-border-color: var(--status-warning-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="warning"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-04));\n  --mds-button-border-color: var(--status-warning-04);\n}\n\n:host([variant="warning"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-warning-09));\n  --mds-button-border-color: var(--status-warning-09);\n  --mds-button-color: rgb(var(--status-warning-03));\n\n  fill: rgb(var(--status-warning-03));\n}\n\n:host([variant="warning"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-08));\n  --mds-button-border-color: var(--status-warning-08);\n}\n\n:host([variant="warning"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-warning-04);\n  --mds-button-color: rgb(var(--status-warning-03));\n}\n\n:host([variant="warning"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-warning-04);\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host([variant="warning"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host([variant="warning"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-warning-04));\n}\n\n:host([variant="warning"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n:host([tone="quiet"]),\n:host([tone="quiet"]:hover),\n:host([tone="ghost"]) {\n  --mds-button-background: transparent;\n}\n\n:host([tone="strong"]),\n:host([tone="weak"]) {\n  --mds-button-border-default-opacity: 1;\n  --mds-button-border-width: 0;\n}\n\n:host([tone="strong"]),\n:host([tone="weak"]),\n:host([tone="ghost"]) {\n  --mds-button-border-opacity: var(--mds-button-border-default-opacity);\n}\n\n:host([tone="strong"]:hover),\n:host([tone="strong"][active]) {\n  --mds-button-border-width: var(--mds-button-border-tone-strong-hover-width);\n}\n\n:host([tone="weak"]:hover),\n:host([tone="weak"][active]) {\n  --mds-button-border-width: var(--mds-button-border-tone-weak-hover-width);\n}\n\n:host([tone="ghost"]:hover),\n:host([tone="ghost"][active]) {\n  --mds-button-background: transparent;\n  --mds-button-border-width: var(--mds-button-border-tone-ghost-hover-width);\n  --mds-button-border-opacity: var(--mds-button-border-hover-opacity);\n}\n\n:host([variant="google"]),\n:host([variant="google"][tone]) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-hover-opacity: 0.5;\n  --mds-button-border-hover-width: 0.125rem;\n  --mds-button-border-opacity: 0.2;\n  --mds-button-border-width: 0.0625rem;\n  --mds-button-color: rgb(var(--tone-neutral-03));\n  --mds-button-border-color: var(--tone-neutral-01);\n\n  -webkit-box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n\n  box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n}\n\n:host([variant="google"]:hover),\n:host([variant="google"][tone]:hover) {\n  --mds-button-border-width: var(--mds-button-border-hover-width);\n  --mds-button-border-opacity: var(--mds-button-border-hover-opacity);\n}\n\n:host([variant="apple"]),\n:host([variant="apple"][tone]) {\n  --mds-button-background: rgb(var(--tone-neutral-02));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-width: 0;\n}\n\n:host-context(.pref-theme-dark):host([variant="google"]),\n:host-context(.pref-theme-dark):host([variant="google"][tone]) {\n  --mds-button-border-width: 0.125rem;\n  --mds-button-border-opacity: 0.3;\n}\n\n:host-context(.pref-theme-dark):host([variant="google"]:hover),\n:host-context(.pref-theme-dark):host([variant="google"][tone]:hover) {\n  --mds-button-border-opacity: 0.5;\n}\n\n:host-context(.pref-theme-dark):host([variant="apple"]),\n:host-context(.pref-theme-dark):host([variant="apple"][tone]) {\n  --mds-button-background: rgb(var(--tone-neutral-01));\n}\n\n@media (prefers-color-scheme: dark) {\n  :host-context(.pref-theme-system):host([variant="apple"]),\n  :host-context(.pref-theme-system):host([variant="apple"][tone]) {\n    --mds-button-background: rgb(var(--tone-neutral-01));\n  }\n\n  :host-context(.pref-theme-system):host([variant="google"]),\n  :host-context(.pref-theme-system):host([variant="google"][tone]) {\n    --mds-button-border-width: 0.125rem;\n    --mds-button-border-opacity: 0.3;\n  }\n\n  :host-context(.pref-theme-system):host([variant="google"]:hover),\n  :host-context(.pref-theme-system):host([variant="google"][tone]:hover) {\n    --mds-button-border-opacity: 0.5;\n  }\n}\n\n:host-context(.pref-animation-reduce),\n:host-context(.pref-animation-reduce) .await,\n:host-context(.pref-animation-reduce) .icon {\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n}\n\n@media (prefers-reduced-motion) {\n  :host-context(.pref-animation-system),\n  :host-context(.pref-animation-system) .await,\n  :host-context(.pref-animation-system) .icon {\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n:host(:not(:is([hydrated], .hydrated))) {\n  -webkit-animation-duration: 0s;\n  animation-duration: 0s;\n  border-color: transparent;\n  -webkit-box-shadow: 0 0 0 transparent;\n  box-shadow: 0 0 0 transparent;\n  opacity: 0;\n  outline-color: transparent;\n  -webkit-transition-delay: 0s;\n  transition-delay: 0s;\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n  visibility: hidden;\n}\n\n/* TODO refact(stencil): Uses only used selector from parent shadowDOM component */\n\nmds-accordion:not(:is([hydrated], .hydrated)),\nmds-accordion-item:not(:is([hydrated], .hydrated)),\nmds-accordion-timer:not(:is([hydrated], .hydrated)),\nmds-accordion-timer-item:not(:is([hydrated], .hydrated)),\nmds-author:not(:is([hydrated], .hydrated)),\nmds-avatar:not(:is([hydrated], .hydrated)),\nmds-badge:not(:is([hydrated], .hydrated)),\nmds-banner:not(:is([hydrated], .hydrated)),\nmds-benchmark-bar:not(:is([hydrated], .hydrated)),\nmds-bibliography:not(:is([hydrated], .hydrated)),\nmds-breadcrumb:not(:is([hydrated], .hydrated)),\nmds-breadcrumb-item:not(:is([hydrated], .hydrated)),\nmds-button:not(:is([hydrated], .hydrated)),\nmds-card:not(:is([hydrated], .hydrated)),\nmds-card-content:not(:is([hydrated], .hydrated)),\nmds-card-footer:not(:is([hydrated], .hydrated)),\nmds-card-header:not(:is([hydrated], .hydrated)),\nmds-card-media:not(:is([hydrated], .hydrated)),\nmds-chip:not(:is([hydrated], .hydrated)),\nmds-details:not(:is([hydrated], .hydrated)),\nmds-dropdown:not(:is([hydrated], .hydrated)),\nmds-entity:not(:is([hydrated], .hydrated)),\nmds-file:not(:is([hydrated], .hydrated)),\nmds-file-preview:not(:is([hydrated], .hydrated)),\nmds-filter:not(:is([hydrated], .hydrated)),\nmds-filter-item:not(:is([hydrated], .hydrated)),\nmds-header:not(:is([hydrated], .hydrated)),\nmds-header-bar:not(:is([hydrated], .hydrated)),\nmds-help:not(:is([hydrated], .hydrated)),\nmds-horizontal-scroll:not(:is([hydrated], .hydrated)),\nmds-hr:not(:is([hydrated], .hydrated)),\nmds-icon:not(:is([hydrated], .hydrated)),\nmds-img:not(:is([hydrated], .hydrated)),\nmds-input:not(:is([hydrated], .hydrated)),\nmds-input-field:not(:is([hydrated], .hydrated)),\nmds-input-range:not(:is([hydrated], .hydrated)),\nmds-input-select:not(:is([hydrated], .hydrated)),\nmds-input-switch:not(:is([hydrated], .hydrated)),\nmds-input-tip:not(:is([hydrated], .hydrated)),\nmds-input-tip-item:not(:is([hydrated], .hydrated)),\nmds-input-upload:not(:is([hydrated], .hydrated)),\nmds-keyboard:not(:is([hydrated], .hydrated)),\nmds-keyboard-key:not(:is([hydrated], .hydrated)),\nmds-kpi:not(:is([hydrated], .hydrated)),\nmds-kpi-item:not(:is([hydrated], .hydrated)),\nmds-label:not(:is([hydrated], .hydrated)),\nmds-list:not(:is([hydrated], .hydrated)),\nmds-list-item:not(:is([hydrated], .hydrated)),\nmds-modal:not(:is([hydrated], .hydrated)),\nmds-note:not(:is([hydrated], .hydrated)),\nmds-notification:not(:is([hydrated], .hydrated)),\nmds-paginator:not(:is([hydrated], .hydrated)),\nmds-paginator-item:not(:is([hydrated], .hydrated)),\nmds-pref:not(:is([hydrated], .hydrated)),\nmds-pref-animation:not(:is([hydrated], .hydrated)),\nmds-pref-consumption:not(:is([hydrated], .hydrated)),\nmds-pref-contrast:not(:is([hydrated], .hydrated)),\nmds-pref-language:not(:is([hydrated], .hydrated)),\nmds-pref-language-item:not(:is([hydrated], .hydrated)),\nmds-pref-theme:not(:is([hydrated], .hydrated)),\nmds-price-table:not(:is([hydrated], .hydrated)),\nmds-price-table-features:not(:is([hydrated], .hydrated)),\nmds-price-table-features-cell:not(:is([hydrated], .hydrated)),\nmds-price-table-features-row:not(:is([hydrated], .hydrated)),\nmds-price-table-header:not(:is([hydrated], .hydrated)),\nmds-price-table-list:not(:is([hydrated], .hydrated)),\nmds-price-table-list-item:not(:is([hydrated], .hydrated)),\nmds-progress:not(:is([hydrated], .hydrated)),\nmds-push-notification:not(:is([hydrated], .hydrated)),\nmds-push-notifications:not(:is([hydrated], .hydrated)),\nmds-quote:not(:is([hydrated], .hydrated)),\nmds-separator:not(:is([hydrated], .hydrated)),\nmds-spinner:not(:is([hydrated], .hydrated)),\nmds-stepper-bar:not(:is([hydrated], .hydrated)),\nmds-stepper-bar-item:not(:is([hydrated], .hydrated)),\nmds-tab:not(:is([hydrated], .hydrated)),\nmds-tab-bar:not(:is([hydrated], .hydrated)),\nmds-tab-bar-item:not(:is([hydrated], .hydrated)),\nmds-tab-item:not(:is([hydrated], .hydrated)),\nmds-table:not(:is([hydrated], .hydrated)),\nmds-table-body:not(:is([hydrated], .hydrated)),\nmds-table-cell:not(:is([hydrated], .hydrated)),\nmds-table-footer:not(:is([hydrated], .hydrated)),\nmds-table-header:not(:is([hydrated], .hydrated)),\nmds-table-header-cell:not(:is([hydrated], .hydrated)),\nmds-table-row:not(:is([hydrated], .hydrated)),\nmds-text:not(:is([hydrated], .hydrated)),\nmds-toast:not(:is([hydrated], .hydrated)),\nmds-tooltip:not(:is([hydrated], .hydrated)),\nmds-tree:not(:is([hydrated], .hydrated)),\nmds-tree-item:not(:is([hydrated], .hydrated)),\nmds-url-view:not(:is([hydrated], .hydrated)),\nmds-usage:not(:is([hydrated], .hydrated)),\nmds-video-wall:not(:is([hydrated], .hydrated)),\nmds-zero:not(:is([hydrated], .hydrated))\n{\n  -webkit-animation-duration: 0s;\n  animation-duration: 0s;\n  border-color: transparent;\n  -webkit-box-shadow: 0 0 0 transparent;\n  box-shadow: 0 0 0 transparent;\n  opacity: 0;\n  outline-color: transparent;\n  -webkit-transition-delay: 0s;\n  transition-delay: 0s;\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n  visibility: hidden;\n}\n\n';class l{resolveIconName(t){return this._resolveIconName(t,this.name,this.path)}constructor(t,n,r){this.name=t,this.path=n,this._resolveIconName=r}get resolver(){return this._resolveIconName}}const y=new class{constructor(){this._svgPathKey="mdsIconSvgPath",this._iconsSets=new Map,this._svgPathUpdate="mdsIconSvgPathUpdate",this.cacheExp=864e5,this.listeners=[],this.memoryCache={},this.isCacheAvailable=async t=>{try{const n=await function(t){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:v())("readonly",(function(n){return m(n.get(t))}))}(`loader_${t}`);if(!n)return!1;const r=JSON.parse(n);return Date.now()<r.expiry?r.data:(function(t){(arguments.length>1&&void 0!==arguments[1]?arguments[1]:v())("readwrite",(function(n){return n.delete(t),m(n.transaction)}))}(`loader_${t}`),!1)}catch(t){return console.error("isCacheAvailable error",t),!1}},this.setCache=async(t,n)=>{try{await function(t,n){return(arguments.length>2&&void 0!==arguments[2]?arguments[2]:v())("readwrite",(function(r){return r.put(n,t),m(r.transaction)}))}(`loader_${t}`,JSON.stringify({data:n,expiry:Date.now()+this.cacheExp}))}catch(t){console.error("setCache error",t)}},this.setUpListener()}addIconSet(t,n,r){let o=r;const a=this._iconsSets.get(t);if(!o&&a&&"function"==typeof a.resolver)o=a.resolver;else{if(o&&"function"!=typeof o)return console.error("MdsIconSvg: the third input of addIconSet should be a function that parses and returns the icons's filename."),!1;if(!o)return console.error(`MdsIconSvg: the set ${t} needs a resolve function for the icon names.`),!1}return this._iconsSets.set(t,new l(t,n,o)),!0}getIconSet(t){return t?{set:this._iconsSets.get(t.split("/")[0])}:{set:null}}setSvgPath(t){const n=/^(((https?:\/\/)?[.\w]+(:\d+)?)|\/)([\w/-]+)*/.exec(t);if(!n)throw Error(`Svg path not recognize ${t}, ensure is a absolute path starting with '/' or a url`);"undefined"!=typeof window&&(this._svgPath=n[1]?n[0]:window.location.origin.concat(n[0]),window.dispatchEvent(new Event(this._svgPathUpdate)))}getSvgPath(){return this._svgPath}registerListener(t){this.listeners.push(t)}setUpListener(){"undefined"!=typeof window&&window.addEventListener(this._svgPathUpdate,(()=>{for(const t of this.listeners)t()}))}async fetchSvg(t){var n;try{if(!this._svgPath&&"undefined"==typeof window)throw Error("Cant find svgPath, ensure you set it");this._svgPath||this.setSvgPath(null!==(n=window.sessionStorage.getItem(y._svgPathKey))&&void 0!==n?n:"");const r=this._svgPath&&!t.startsWith("http")?this._svgPath.concat(t,".svg"):t,o=await this.isCacheAvailable(r);if(this.memoryCache[r]||o)return this.memoryCache[r]||o;const a=await fetch(r);if(!a.ok)throw Error(`Request for '${r}' returned ${a.status} (${a.statusText})`);const s=await a.text(),e=s.toLowerCase().trim();if(!e.startsWith("<svg")&&!e.startsWith("<?xml"))throw Error(`Resource '${r}' returned an invalid SVG file`);return this.setCache(r,s),this.memoryCache[r]=s,s}catch(t){return console.error("fetchSvg error",t),""}}},g=class{constructor(n){t(this,n),this.convertBase64ToSvg=()=>{const t=this.name.replace(i,"").replace(/\=/i,"");return atob(t)}}componentWillLoad(){this.updateIcon(),y.registerListener((()=>this.updateIcon()))}static setSvgPathStatic(t){y.setSvgPath(t)}async setSvgPath(t){y.setSvgPath(t)}async updateIcon(){return this.name?h(this.name)?(this.svgHTML=this.convertBase64ToSvg(),Promise.resolve()):c(this.name)?(this.svgHTML=this.name,Promise.resolve()):void(this.svgHTML=await y.fetchSvg(this.name)):Promise.resolve()}render(){return n(r,{key:"992765f41d4d37744457b9e5da2c9531412e58e6"},this.svgHTML&&n("i",{key:"45fbed1f98dc82f5d1cfc5cf1c396d175a515a9d","aria-hidden":"true",class:"icon",part:"svg",innerHTML:this.svgHTML}))}get hostElement(){return o(this)}static get watchers(){return{name:["updateIcon"]}}};g.style=":host{aspect-ratio:1/1;width:1.5rem;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center}.icon{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;font-style:normal;-ms-flex-pack:center;justify-content:center;width:100%}.icon svg{height:auto;width:100%}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}";const p=class{constructor(n){t(this,n),this.running=!1}handleRunning(t){!1===t&&(this.running=void 0)}render(){return n(r,{key:"26cc04164b95792fbabf4248eceff7b630d14171"},n("i",{key:"15a3883a3c6777b5475974269e1a946a955b315a",class:"await-icon",innerHTML:'<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n  <path opacity="0.25" d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="currentColor" stroke-width="4"/>\n  <path opacity="0.75" d="M10 2.2002C5.43552 3.12674 2 7.16224 2 12.0002C2 13.5118 2.3354 14.9451 2.93585 16.2297" stroke="currentColor" stroke-width="4" stroke-linecap="round"/>\n</svg>\n'}))}static get watchers(){return{running:["handleRunning"]}}};p.style=":host{--mds-spinner-duration:0.725s;height:3rem;width:3rem;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);-ms-flex-align:center;align-items:center;color:rgb(var(--variant-primary-03));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:opacity, transform;transition-property:opacity, transform, -webkit-transform}:host([running]){-webkit-transition-duration:700ms;transition-duration:700ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1);opacity:1;-webkit-transform:scale(1);transform:scale(1)}.await-icon{aspect-ratio:1/1;width:100%}@-webkit-keyframes spin{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.await-icon{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);-webkit-animation-duration:var(--mds-spinner-duration);animation-duration:var(--mds-spinner-duration);-webkit-animation-play-state:paused;animation-play-state:paused;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;stroke:currentcolor;-webkit-transition-property:stroke;transition-property:stroke}.await-icon svg{width:100%}:host([running]) .await-icon{-webkit-animation-play-state:running;animation-play-state:running}:host-context(.pref-animation-reduce){--mds-spinner-duration:8s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){--mds-spinner-duration:8s}}:host-context(.pref-contrast-more){color:rgb(var(--variant-primary-01))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){color:rgb(var(--variant-primary-01))}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}";export{b as mds_button,g as mds_icon,p as mds_spinner}
+import{r as t,h as n,H as r,g as o}from"./p-3a6b32e7.js";import{K as a}from"./p-23e7e277.js";import{u as s,s as e}from"./p-f00c93f4.js";const d={sm:"action",md:"action",lg:"h6",xl:"h4"},i="data:image/svg+xml;base64,",h=t=>!!t&&t.startsWith(i),c=t=>!!t&&t.startsWith("<svg "),b=class{constructor(n){t(this,n),n.$hostElement$["s-ei"]?this.internals=n.$hostElement$["s-ei"]:(this.internals=n.$hostElement$.attachInternals(),n.$hostElement$["s-ei"]=this.internals),this.km=new a,this.iconPosition="left",this.type="submit",this.variant="primary",this.tone="strong",this.size="md",this.target="self",this.truncate="word",this.handleRequestSubmitForm=t=>{var n;t.preventDefault(),null===(n=this.internals.form)||void 0===n||n.requestSubmit()},this.handleReset=t=>{var n;t.preventDefault(),null===(n=this.internals.form)||void 0===n||n.reset()},this.mouseDown=()=>{this.active=!0},this.mouseUp=()=>{this.active=!1},this.redirectBlank=()=>{if("undefined"==typeof window)throw Error("Object window is not defined");window.open(this.href,"_blank")},this.onSlotChangeHandler=()=>{this.hasText=""!==this.host.innerHTML.trim()||this.host.children.length>0}}disabledChanged(t){t?this.km.attachClickBehavior():(this.km.detachClickBehavior(),this.disabled=void 0)}awaitChanged(t){this.host.setAttribute("aria-busy",(!!t).toString()),t?this.km.attachClickBehavior():this.km.detachClickBehavior()}handleTypeChange(t){this.internals.form&&("submit"===t?(this.host.removeEventListener("click",this.handleReset),this.host.addEventListener("click",this.handleRequestSubmitForm)):"reset"===t?(this.host.removeEventListener("click",this.handleRequestSubmitForm),this.host.addEventListener("click",this.handleReset)):(this.host.removeEventListener("click",this.handleRequestSubmitForm),this.host.removeEventListener("click",this.handleReset)))}handleVariantChange(t){"google"!==t?"apple"!==t||(this.icon='<svg xmlns="http://www.w3.org/2000/svg" id="mdi-apple" viewBox="0 0 24 24"><path d="M18.71,19.5C17.88,20.74 17,21.95 15.66,21.97C14.32,22 13.89,21.18 12.37,21.18C10.84,21.18 10.37,21.95 9.1,22C7.79,22.05 6.8,20.68 5.96,19.47C4.25,17 2.94,12.45 4.7,9.39C5.57,7.87 7.13,6.91 8.82,6.88C10.1,6.86 11.32,7.75 12.11,7.75C12.89,7.75 14.37,6.68 15.92,6.84C16.57,6.87 18.39,7.1 19.56,8.82C19.47,8.88 17.39,10.1 17.41,12.63C17.44,15.65 20.06,16.66 20.09,16.67C20.06,16.74 19.67,18.11 18.71,19.5M13,3.5C13.73,2.67 14.94,2.04 15.94,2C16.07,3.17 15.6,4.35 14.9,5.19C14.21,6.04 13.07,6.7 11.95,6.61C11.8,5.46 12.36,4.26 13,3.5Z" /></svg>'):this.icon='<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" xmlnsXlink="http://www.w3.org/1999/xlink"><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path><path fill="none" d="M0 0h48v48H0z"></path></svg>\n'}componentWillLoad(){this.hasNotification=null!==this.host.querySelector(':scope > [slot="notification"]'),this.hasText=""!==this.host.innerHTML.trim()||this.host.children.length>0,this.handleVariantChange(this.variant),this.href?this.host.addEventListener("click",(t=>{var n;t.preventDefault(),"blank"!==this.target?"undefined"!=typeof window&&(window.location.href=null!==(n=this.href)&&void 0!==n?n:""):this.redirectBlank()})):this.internals.form&&("submit"===this.type?this.host.addEventListener("click",this.handleRequestSubmitForm):"reset"===this.type&&this.host.addEventListener("click",this.handleReset))}componentDidLoad(){if(this.km.addElement(this.host),this.await||this.km.attachClickBehavior(),this.host.setAttribute("aria-busy",this.await?"true":"false"),this.autoFocus&&this.host.focus(),!h(this.icon)&&!c(this.icon)){if(!this.hasText&&this.icon){const t=s(this.icon);this.host.hasAttribute("aria-label")||e(this.host,"title",t),this.host.hasAttribute("title")||e(this.host,"aria-label",t)}e(this.host,"role","button")}}handleAwaitChange(t){if(!1===t)return this.await=void 0,void this.km.detachClickBehavior();this.km.attachClickBehavior()}connectedCallback(){this.disabled||this.host.removeAttribute("disabled")}disconnectedCallback(){this.km.detachClickBehavior()}render(){return this.typography=d[this.size],n(r,{key:"3c54ecab2250be89d7f925cd4fea6eaeea05fa1f",onMouseDown:this.mouseDown,onMouseUp:this.mouseUp,onMouseOut:this.mouseUp,tabindex:"0"},n("div",{key:"41edeab2fca583980ac046866f9b0b4c14268f60",class:"await"},n("mds-spinner",{key:"9b7d06b88d13aa5f343f476fc7aec4aef824670b",class:"spinner",running:this.await})),this.icon&&"left"===this.iconPosition&&n("mds-icon",{key:"46f069315b6006c19183b10fc5e3fdc73d2b7e09","aria-hidden":"true",class:"icon",name:this.icon,part:"icon"}),n("mds-text",{key:"6f15cf82126c3c1e04e00eae75fc43ea657782ea",class:"text",part:"label",typography:this.typography,truncate:this.truncate},n("slot",{key:"3e068fcac844e33b49afdc5dbff20bd65238136d",onSlotchange:this.onSlotChangeHandler})),this.hasNotification&&n("slot",{key:"0482835f6c3160521b9fe2e04ef6721d28815167",name:"notification"}),this.icon&&"right"===this.iconPosition&&n("mds-icon",{key:"8d11f6f28287b34517b276431f7cb1d31fad9617","aria-hidden":"true",class:"icon",name:this.icon,part:"icon"}))}static get formAssociated(){return!0}get host(){return o(this)}static get watchers(){return{disabled:["disabledChanged"],await:["awaitChanged","handleAwaitChange"],type:["handleTypeChange"],variant:["handleVariantChange"]}}};function m(t){return new Promise((function(n,r){t.oncomplete=t.onsuccess=function(){return n(t.result)},t.onabort=t.onerror=function(){return r(t.error)}}))}var u;function v(){return u||(u=function(t,n){var r=indexedDB.open("keyval-store");r.onupgradeneeded=function(){return r.result.createObjectStore(n)};var o=m(r);return function(t,r){return o.then((function(o){return r(o.transaction(n,t).objectStore(n))}))}}(0,"keyval")),u}b.style='@-webkit-keyframes focus-bounce {\n  0%, 75%, 100% {\n    outline-offset: var(--magma-outline-focus-offset, 6px);\n  }\n\n  50% {\n    outline-offset: var(--magma-outline-blur-offset, 2px);\n  }\n}\n\n@keyframes focus-bounce {\n  0%, 75%, 100% {\n    outline-offset: var(--magma-outline-focus-offset, 6px);\n  }\n\n  50% {\n    outline-offset: var(--magma-outline-blur-offset, 2px);\n  }\n}\n\n@tailwind components;\n\n\n/**\n * @prop --mds-button-await-duration: Sets the duration of the rotation of the spinner await component\n * @prop --mds-button-background: Sets the background-color of the component\n * @prop --mds-button-border-color: Sets the color of the border of the component (based on box-shadow declaration)\n * @prop --mds-button-border-default-opacity: Sets the default opacity of the border color of the component (based on box-shadow declaration)\n * @prop --mds-button-border-high-contrast-hover-width: Sets the width of the border when the component is hovered and the contrast is high (based on box-shadow declaration)\n * @prop --mds-button-border-high-contrast-width: Sets the width of the border of the component and the contrast is high (based on box-shadow declaration)\n * @prop --mds-button-border-hover-opacity: Sets the opacity of the border color when the component is hovered (based on box-shadow declaration)\n * @prop --mds-button-border-opacity: Sets the border opacity of the component (based on box-shadow declaration)\n * @prop --mds-button-border-tone-ghost-hover-width: Sets the width of the border when the component is hovered when the tone is set to `ghost` (based on box-shadow declaration)\n * @prop --mds-button-border-tone-strong-hover-width: Sets the width of the border when the component is hovered when the tone is set to `strong` (based on box-shadow declaration)\n * @prop --mds-button-border-tone-weak-hover-width: Sets the width of the border when the component is hovered when the tone is set to `weak` (based on box-shadow declaration)\n * @prop --mds-button-border-width: Sets the border width of the component (based on box-shadow declaration)\n * @prop --mds-button-color: Sets the text color of the component\n * @prop --mds-button-gap: Sets the distance betwen element inside the components, use it instead of setting gap property directly.\n * @prop --mds-button-radius: Sets the border-radius of the component\n */\n\n:host {\n  --mds-button-await-duration: 0.725s;\n  --mds-button-background: rgb(var(--variant-primary-02));\n  --mds-button-border-color: 0 0 0;\n  --mds-button-border-hover-opacity: 0.75;\n  --mds-button-border-default-opacity: 0.5;\n  --mds-button-border-tone-strong-hover-width: 0.0625rem;\n  --mds-button-border-tone-ghost-hover-width: 3px;\n  --mds-button-border-tone-weak-hover-width: 0.0625rem;\n  --mds-button-border-high-contrast-width: 0.125rem;\n  --mds-button-border-high-contrast-hover-width: 3px;\n  --mds-button-border-opacity: 0;\n  --mds-button-border-width: 0.125rem;\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-gap: 0.5rem;\n  --mds-button-line-clamp: 1;\n  --mds-button-radius: 0.5rem;\n    -webkit-animation-duration: var(--magma-outline-animation-duration, 1s);\n    animation-duration: var(--magma-outline-animation-duration, 1s);\n    -webkit-animation-fill-mode: forwards;\n    animation-fill-mode: forwards;\n    -webkit-animation-iteration-count: infinite;\n    animation-iteration-count: infinite;\n    -webkit-animation-name: focus-bounce;\n    animation-name: focus-bounce;\n    -webkit-animation-play-state: paused;\n    animation-play-state: paused;\n    -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    outline: var(--magma-outline-blur);\n    -webkit-transition-duration: 200ms;\n    transition-duration: 200ms;\n    -webkit-transition-property: background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;\n    transition-property: background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;\n    transition-property: background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;\n    transition-property: background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform;\n    -webkit-transition-timing-function: ease-in-out;\n    transition-timing-function: ease-in-out;\n}\n\n:host:focus-visible {\n    --magma-outline-blur: var(--magma-outline-focus);\n\n    -webkit-animation-play-state: running;\n\n    animation-play-state: running;\n  }\n\n:host {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n  -webkit-transition-duration: 200ms;\n  transition-duration: 200ms;\n  -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n\n  -ms-flex-align: center;\n\n  align-items: center;\n  background-color: var(--mds-button-background);\n  border-radius: var(--mds-button-radius);\n  -webkit-box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n  box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n  -webkit-box-sizing: border-box;\n  box-sizing: border-box;\n  color: var(--mds-button-color);\n  cursor: pointer;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  fill: currentcolor;\n  gap: var(--mds-button-gap);\n  -ms-flex-pack: center;\n  justify-content: center;\n  position: relative;\n  -webkit-transition-property: background-color, border-color, color, outline, outline-offset, padding-left, padding-right, -webkit-box-shadow, -webkit-transform;\n  transition-property: background-color, border-color, color, outline, outline-offset, padding-left, padding-right, -webkit-box-shadow, -webkit-transform;\n  transition-property: background-color, border-color, box-shadow, color, outline, outline-offset, padding-left, padding-right, transform;\n  transition-property: background-color, border-color, box-shadow, color, outline, outline-offset, padding-left, padding-right, transform, -webkit-box-shadow, -webkit-transform;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n          -ms-user-select: none;\n          user-select: none;\n}\n\n:host(:focus-visible) {\n    --magma-outline-blur: var(--magma-outline-focus);\n\n    -webkit-animation-play-state: running;\n\n    animation-play-state: running;\n\n    z-index: 10;\n  }\n\n.text {\n  --mds-text-line-clamp: var(--mds-button-line-clamp);\n}\n\n.text::first-letter {\n  text-transform: uppercase;\n}\n\n.icon {\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  -ms-flex-align: center;\n\n  align-items: center;\n  display: -ms-inline-flexbox;\n  display: inline-flex;\n  fill: inherit;\n  -ms-flex-negative: 0;\n  flex-shrink: 0;\n  -ms-flex-pack: center;\n  justify-content: center;\n  pointer-events: none;\n  -webkit-transition-property: fill;\n  transition-property: fill;\n}\n\n:host-context(mds-button-group):host(:not(:first-child)) {\n  border-bottom-left-radius: 0;\n  border-top-left-radius: 0;\n}\n\n:host-context(mds-button-group):host(:not(:last-child)) {\n  border-bottom-right-radius: 0;\n  border-top-right-radius: 0;\n}\n\n.await {\n  height: 1.5rem;\n  width: 1.5rem;\n  -webkit-transition-duration: 300ms;\n  transition-duration: 300ms;\n  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n\n  display: none;\n  margin-right: calc(calc(-1 * var(--mds-button-gap)) - 1.5rem);\n  -webkit-transform: scale(0);\n  transform: scale(0);\n  transition-behavior: allow-discrete;\n  -webkit-transition-property: display, margin-right, opacity, width, -webkit-transform;\n  transition-property: display, margin-right, opacity, width, -webkit-transform;\n  transition-property: display, margin-right, opacity, transform, width;\n  transition-property: display, margin-right, opacity, transform, width, -webkit-transform;\n}\n\n.spinner {\n  height: 1.5rem;\n  width: 1.5rem;\n\n  --mds-spinner-duration: var(--mds-button-await-duration);\n\n  color: currentcolor;\n}\n\n:host(:not([await])) .spinner,\n:host([await="false"]) .spinner {\n  -webkit-transition-duration: 200ms;\n  transition-duration: 200ms;\n  -webkit-transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n\n:host([await]:not([await="false"])) .await {\n  margin-right: 0rem;\n  opacity: 1;\n\n  display: -ms-flexbox;\n\n  display: flex;\n  -webkit-transform: scale(1);\n  transform: scale(1);\n\n  @starting-style {\n    margin-right: calc(calc(-1 * var(--mds-button-gap)) - 1.5rem);\n    opacity: 0;\n    -webkit-transform: scale(0);\n    transform: scale(0);\n  }\n}\n\n:host([await]:not([await="false"])) {\n  pointer-events: none;\n}\n\n:host([disabled]:not([disabled="false"])) {\n  opacity: 0.5;\n\n  pointer-events: none;\n}\n\n:host([size="sm"]) {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0rem;\n  padding-bottom: 0rem;\n\n  --mds-button-radius: 0.375rem;\n\n  min-height: 1.75rem;\n  min-width: 1.75rem;\n}\n\n:host([size="sm"]:not([has-text])) {\n  padding: 0rem;\n}\n\n:host([size="sm"]) .text {\n  font-weight: 500;\n}\n\n:host([size="sm"]) .icon {\n  height: 1rem;\n  width: 1rem;\n}\n\n:host([size="sm"][await]:not([await="false"]) ) .await {\n  -webkit-transform: scale(.75);\n  transform: scale(.75);\n}\n\n:host([size="md"]) {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\n:host([size="md"]:not([has-text])) {\n  padding: 0.25rem;\n}\n\n:host([size="lg"]) {\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n\n  min-height: 3rem;\n  min-width: 3rem;\n}\n\n:host([size="lg"]:not([has-text])) {\n  padding: 0.5rem;\n}\n\n:host([size="xl"]) {\n  padding-left: 2rem;\n  padding-right: 2rem;\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n\n  min-height: 3.25rem;\n  min-width: 3.25rem;\n}\n\n:host([size="xl"]:not([has-text])) {\n  padding: 0.5rem;\n}\n\n:host(:not([has-text])) .text {\n  display: none;\n}\n\n:host([variant="dark"][tone="strong"]) {\n  --mds-button-background: rgb(var(--tone-neutral-04));\n  --mds-button-border-color: var(--tone-neutral-04);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="dark"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral-05));\n  --mds-button-border-color: var(--tone-neutral-05);\n}\n\n:host([variant="dark"][tone="weak"]) {\n  --mds-button-background: rgb(var(--tone-neutral-08));\n  --mds-button-border-color: var(--tone-neutral-08);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n\n  fill: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="dark"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral-07));\n  --mds-button-border-color: var(--tone-neutral-07);\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="dark"][tone="ghost"]) {\n  --mds-button-border-color: var(--tone-neutral-04);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="dark"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--tone-neutral-04);\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="dark"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="dark"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--tone-neutral-04));\n}\n\n:host([variant="dark"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--tone-neutral-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-ai-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--variant-ai-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="ai"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-02));\n  --mds-button-border-color: var(--variant-ai-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-ai-09));\n  --mds-button-color: rgb(var(--variant-ai-02));\n  --mds-button-border-color: var(--variant-ai-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--variant-ai-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-10));\n  --mds-button-color: rgb(var(--variant-ai-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--variant-ai-08));\n  --mds-button-color: rgb(var(--variant-ai-01));\n\n  fill: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-ai-03);\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-ai-03);\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--variant-ai-04);\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-ai-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="ai"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="strong"]) {\n    --mds-button-background: rgb(var(--variant-ai-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--variant-ai-02));\n    --mds-button-border-color: var(--variant-ai-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="weak"]) {\n    --mds-button-background: rgb(var(--variant-ai-09));\n    --mds-button-color: rgb(var(--variant-ai-02));\n    --mds-button-border-color: var(--variant-ai-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--variant-ai-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--variant-ai-10));\n    --mds-button-color: rgb(var(--variant-ai-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--variant-ai-08));\n    --mds-button-color: rgb(var(--variant-ai-01));\n\n    fill: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="ghost"]) {\n    --mds-button-border-color: var(--variant-ai-03);\n    --mds-button-color: rgb(var(--variant-ai-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--variant-ai-03);\n    --mds-button-color: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--variant-ai-04);\n    --mds-button-color: rgb(var(--variant-ai-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--variant-ai-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--variant-ai-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="ai"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--variant-ai-01));\n  }\n}\n\n:host([variant="ai"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-ai-05));\n  --mds-button-border-color: var(--variant-ai-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="ai"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-04));\n  --mds-button-border-color: var(--variant-ai-04);\n}\n\n:host([variant="ai"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-ai-09));\n  --mds-button-border-color: var(--variant-ai-09);\n  --mds-button-color: rgb(var(--variant-ai-03));\n\n  fill: rgb(var(--variant-ai-03));\n}\n\n:host([variant="ai"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-ai-08));\n  --mds-button-border-color: var(--variant-ai-08);\n}\n\n:host([variant="ai"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-ai-04);\n  --mds-button-color: rgb(var(--variant-ai-03));\n}\n\n:host([variant="ai"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-ai-04);\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host([variant="ai"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-ai-02));\n}\n\n:host([variant="ai"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-ai-04));\n}\n\n:host([variant="ai"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-ai-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-error-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-error-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="error"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-error-02));\n  --mds-button-border-color: var(--status-error-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-error-09));\n  --mds-button-color: rgb(var(--status-error-02));\n  --mds-button-border-color: var(--status-error-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-error-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-error-10));\n  --mds-button-color: rgb(var(--status-error-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-error-08));\n  --mds-button-color: rgb(var(--status-error-01));\n\n  fill: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-error-03);\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-error-03);\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-error-04);\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-error-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="error"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="error"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-error-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="error"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-error-02));\n    --mds-button-border-color: var(--status-error-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-error-09));\n    --mds-button-color: rgb(var(--status-error-02));\n    --mds-button-border-color: var(--status-error-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-error-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-error-10));\n    --mds-button-color: rgb(var(--status-error-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-error-08));\n    --mds-button-color: rgb(var(--status-error-01));\n\n    fill: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-error-03);\n    --mds-button-color: rgb(var(--status-error-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-error-03);\n    --mds-button-color: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-error-04);\n    --mds-button-color: rgb(var(--status-error-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-error-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-error-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="error"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-error-01));\n  }\n}\n\n:host([variant="error"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-error-05));\n  --mds-button-border-color: var(--status-error-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="error"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-error-04));\n  --mds-button-border-color: var(--status-error-04);\n}\n\n:host([variant="error"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-error-09));\n  --mds-button-border-color: var(--status-error-09);\n  --mds-button-color: rgb(var(--status-error-03));\n\n  fill: rgb(var(--status-error-03));\n}\n\n:host([variant="error"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-error-08));\n  --mds-button-border-color: var(--status-error-08);\n}\n\n:host([variant="error"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-error-04);\n  --mds-button-color: rgb(var(--status-error-03));\n}\n\n:host([variant="error"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-error-04);\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host([variant="error"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-error-02));\n}\n\n:host([variant="error"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-error-04));\n}\n\n:host([variant="error"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-error-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-info-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-info-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="info"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-info-02));\n  --mds-button-border-color: var(--status-info-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-info-09));\n  --mds-button-color: rgb(var(--status-info-02));\n  --mds-button-border-color: var(--status-info-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-info-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-info-10));\n  --mds-button-color: rgb(var(--status-info-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-info-08));\n  --mds-button-color: rgb(var(--status-info-01));\n\n  fill: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-info-03);\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-info-03);\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-info-04);\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-info-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="info"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="info"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-info-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="info"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-info-02));\n    --mds-button-border-color: var(--status-info-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-info-09));\n    --mds-button-color: rgb(var(--status-info-02));\n    --mds-button-border-color: var(--status-info-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-info-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-info-10));\n    --mds-button-color: rgb(var(--status-info-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-info-08));\n    --mds-button-color: rgb(var(--status-info-01));\n\n    fill: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-info-03);\n    --mds-button-color: rgb(var(--status-info-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-info-03);\n    --mds-button-color: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-info-04);\n    --mds-button-color: rgb(var(--status-info-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-info-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-info-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="info"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-info-01));\n  }\n}\n\n:host([variant="info"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-info-05));\n  --mds-button-border-color: var(--status-info-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="info"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-info-04));\n  --mds-button-border-color: var(--status-info-04);\n}\n\n:host([variant="info"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-info-09));\n  --mds-button-border-color: var(--status-info-09);\n  --mds-button-color: rgb(var(--status-info-03));\n\n  fill: rgb(var(--status-info-03));\n}\n\n:host([variant="info"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-info-08));\n  --mds-button-border-color: var(--status-info-08);\n}\n\n:host([variant="info"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-info-04);\n  --mds-button-color: rgb(var(--status-info-03));\n}\n\n:host([variant="info"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-info-04);\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host([variant="info"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-info-02));\n}\n\n:host([variant="info"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-info-04));\n}\n\n:host([variant="info"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-info-01));\n}\n\n:host([variant="light"][tone="strong"]) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="light"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n}\n\n:host([variant="light"][tone="weak"]) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral-03));\n\n  fill: rgb(var(--tone-neutral-03));\n}\n\n:host([variant="light"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral-02));\n}\n\n:host([variant="light"][tone="ghost"]) {\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--tone-neutral);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="light"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-primary-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--variant-primary-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="primary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-02));\n  --mds-button-border-color: var(--variant-primary-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-primary-09));\n  --mds-button-color: rgb(var(--variant-primary-02));\n  --mds-button-border-color: var(--variant-primary-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--variant-primary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-10));\n  --mds-button-color: rgb(var(--variant-primary-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--variant-primary-08));\n  --mds-button-color: rgb(var(--variant-primary-01));\n\n  fill: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-primary-03);\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-primary-03);\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-primary-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="primary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="strong"]) {\n    --mds-button-background: rgb(var(--variant-primary-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--variant-primary-02));\n    --mds-button-border-color: var(--variant-primary-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="weak"]) {\n    --mds-button-background: rgb(var(--variant-primary-09));\n    --mds-button-color: rgb(var(--variant-primary-02));\n    --mds-button-border-color: var(--variant-primary-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--variant-primary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--variant-primary-10));\n    --mds-button-color: rgb(var(--variant-primary-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--variant-primary-08));\n    --mds-button-color: rgb(var(--variant-primary-01));\n\n    fill: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="ghost"]) {\n    --mds-button-border-color: var(--variant-primary-03);\n    --mds-button-color: rgb(var(--variant-primary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--variant-primary-03);\n    --mds-button-color: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--variant-primary-04);\n    --mds-button-color: rgb(var(--variant-primary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--variant-primary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--variant-primary-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="primary"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--variant-primary-01));\n  }\n}\n\n:host([variant="primary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-primary-04));\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="primary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-03));\n  --mds-button-border-color: var(--variant-primary-03);\n}\n\n:host([variant="primary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-primary-09));\n  --mds-button-border-color: var(--variant-primary-09);\n  --mds-button-color: rgb(var(--variant-primary-03));\n\n  fill: rgb(var(--variant-primary-03));\n}\n\n:host([variant="primary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-primary-08));\n  --mds-button-border-color: var(--variant-primary-08);\n}\n\n:host([variant="primary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--variant-primary-03));\n}\n\n:host([variant="primary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-primary-04);\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host([variant="primary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-primary-02));\n}\n\n:host([variant="primary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-primary-04));\n}\n\n:host([variant="primary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-primary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-secondary-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--variant-secondary-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-02));\n  --mds-button-border-color: var(--variant-secondary-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-secondary-09));\n  --mds-button-color: rgb(var(--variant-secondary-02));\n  --mds-button-border-color: var(--variant-secondary-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--variant-secondary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-10));\n  --mds-button-color: rgb(var(--variant-secondary-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--variant-secondary-08));\n  --mds-button-color: rgb(var(--variant-secondary-01));\n\n  fill: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-secondary-03);\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-secondary-03);\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-secondary-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="secondary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="strong"]) {\n    --mds-button-background: rgb(var(--variant-secondary-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--variant-secondary-02));\n    --mds-button-border-color: var(--variant-secondary-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="weak"]) {\n    --mds-button-background: rgb(var(--variant-secondary-09));\n    --mds-button-color: rgb(var(--variant-secondary-02));\n    --mds-button-border-color: var(--variant-secondary-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--variant-secondary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--variant-secondary-10));\n    --mds-button-color: rgb(var(--variant-secondary-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--variant-secondary-08));\n    --mds-button-color: rgb(var(--variant-secondary-01));\n\n    fill: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="ghost"]) {\n    --mds-button-border-color: var(--variant-secondary-03);\n    --mds-button-color: rgb(var(--variant-secondary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--variant-secondary-03);\n    --mds-button-color: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--variant-secondary-04);\n    --mds-button-color: rgb(var(--variant-secondary-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--variant-secondary-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--variant-secondary-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="secondary"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--variant-secondary-01));\n  }\n}\n\n:host([variant="secondary"][tone="strong"]) {\n  --mds-button-background: rgb(var(--variant-secondary-04));\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="secondary"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-03));\n  --mds-button-border-color: var(--variant-secondary-03);\n}\n\n:host([variant="secondary"][tone="weak"]) {\n  --mds-button-background: rgb(var(--variant-secondary-09));\n  --mds-button-border-color: var(--variant-secondary-09);\n  --mds-button-color: rgb(var(--variant-secondary-03));\n\n  fill: rgb(var(--variant-secondary-03));\n}\n\n:host([variant="secondary"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--variant-secondary-08));\n  --mds-button-border-color: var(--variant-secondary-08);\n}\n\n:host([variant="secondary"][tone="ghost"]) {\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--variant-secondary-03));\n}\n\n:host([variant="secondary"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--variant-secondary-04);\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host([variant="secondary"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--variant-secondary-02));\n}\n\n:host([variant="secondary"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--variant-secondary-04));\n}\n\n:host([variant="secondary"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--variant-secondary-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-success-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-success-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="success"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-success-02));\n  --mds-button-border-color: var(--status-success-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-success-09));\n  --mds-button-color: rgb(var(--status-success-02));\n  --mds-button-border-color: var(--status-success-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-success-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-success-10));\n  --mds-button-color: rgb(var(--status-success-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-success-08));\n  --mds-button-color: rgb(var(--status-success-01));\n\n  fill: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-success-03);\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-success-03);\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-success-04);\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-success-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="success"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="success"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-success-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="success"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-success-02));\n    --mds-button-border-color: var(--status-success-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-success-09));\n    --mds-button-color: rgb(var(--status-success-02));\n    --mds-button-border-color: var(--status-success-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-success-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-success-10));\n    --mds-button-color: rgb(var(--status-success-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-success-08));\n    --mds-button-color: rgb(var(--status-success-01));\n\n    fill: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-success-03);\n    --mds-button-color: rgb(var(--status-success-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-success-03);\n    --mds-button-color: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-success-04);\n    --mds-button-color: rgb(var(--status-success-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-success-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-success-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="success"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-success-01));\n  }\n}\n\n:host([variant="success"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-success-05));\n  --mds-button-border-color: var(--status-success-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="success"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-success-04));\n  --mds-button-border-color: var(--status-success-04);\n}\n\n:host([variant="success"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-success-09));\n  --mds-button-border-color: var(--status-success-09);\n  --mds-button-color: rgb(var(--status-success-03));\n\n  fill: rgb(var(--status-success-03));\n}\n\n:host([variant="success"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-success-08));\n  --mds-button-border-color: var(--status-success-08);\n}\n\n:host([variant="success"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-success-04);\n  --mds-button-color: rgb(var(--status-success-03));\n}\n\n:host([variant="success"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-success-04);\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host([variant="success"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-success-02));\n}\n\n:host([variant="success"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-success-04));\n}\n\n:host([variant="success"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-success-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-warning-03));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-color: var(--status-warning-03);\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="strong"][active]),\n:host-context(.pref-contrast-more):host([variant="warning"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-02));\n  --mds-button-border-color: var(--status-warning-02);\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-warning-09));\n  --mds-button-color: rgb(var(--status-warning-02));\n  --mds-button-border-color: var(--status-warning-06);\n  --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n  fill: rgb(var(--status-warning-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-10));\n  --mds-button-color: rgb(var(--status-warning-01));\n  --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n  fill: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="weak"][active]) {\n  --mds-button-background: rgb(var(--status-warning-08));\n  --mds-button-color: rgb(var(--status-warning-01));\n\n  fill: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-warning-03);\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-warning-03);\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="ghost"][active]) {\n  --mds-button-border-color: var(--status-warning-04);\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-warning-03));\n}\n\n:host-context(.pref-contrast-more):host([variant="warning"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n@media (prefers-contrast: more) {\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="strong"]) {\n    --mds-button-background: rgb(var(--status-warning-03));\n    --mds-button-color: rgb(var(--tone-neutral));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="strong"][active]),\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="strong"]:hover) {\n    --mds-button-background: rgb(var(--status-warning-02));\n    --mds-button-border-color: var(--status-warning-02);\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="weak"]) {\n    --mds-button-background: rgb(var(--status-warning-09));\n    --mds-button-color: rgb(var(--status-warning-02));\n    --mds-button-border-color: var(--status-warning-06);\n    --mds-button-border-width: var(--mds-button-border-high-contrast-width);\n\n    fill: rgb(var(--status-warning-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="weak"]:hover) {\n    --mds-button-background: rgb(var(--status-warning-10));\n    --mds-button-color: rgb(var(--status-warning-01));\n    --mds-button-border-width: var(--mds-button-border-high-contrast-hover-width);\n\n    fill: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="weak"][active]) {\n    --mds-button-background: rgb(var(--status-warning-08));\n    --mds-button-color: rgb(var(--status-warning-01));\n\n    fill: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="ghost"]) {\n    --mds-button-border-color: var(--status-warning-03);\n    --mds-button-color: rgb(var(--status-warning-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="ghost"]:hover) {\n    --mds-button-border-color: var(--status-warning-03);\n    --mds-button-color: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="ghost"][active]) {\n    --mds-button-border-color: var(--status-warning-04);\n    --mds-button-color: rgb(var(--status-warning-02));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="quiet"]) {\n    --mds-button-color: rgb(var(--status-warning-01));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="quiet"]:hover) {\n    --mds-button-color: rgb(var(--status-warning-03));\n  }\n\n  :host-context(.pref-contrast-system):host([variant="warning"][tone="quiet"][active]) {\n    --mds-button-color: rgb(var(--status-warning-01));\n  }\n}\n\n:host([variant="warning"][tone="strong"]) {\n  --mds-button-background: rgb(var(--status-warning-05));\n  --mds-button-border-color: var(--status-warning-05);\n  --mds-button-color: rgb(var(--tone-neutral));\n}\n\n:host([variant="warning"][tone="strong"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-04));\n  --mds-button-border-color: var(--status-warning-04);\n}\n\n:host([variant="warning"][tone="weak"]) {\n  --mds-button-background: rgb(var(--status-warning-09));\n  --mds-button-border-color: var(--status-warning-09);\n  --mds-button-color: rgb(var(--status-warning-03));\n\n  fill: rgb(var(--status-warning-03));\n}\n\n:host([variant="warning"][tone="weak"]:hover) {\n  --mds-button-background: rgb(var(--status-warning-08));\n  --mds-button-border-color: var(--status-warning-08);\n}\n\n:host([variant="warning"][tone="ghost"]) {\n  --mds-button-border-color: var(--status-warning-04);\n  --mds-button-color: rgb(var(--status-warning-03));\n}\n\n:host([variant="warning"][tone="ghost"]:hover) {\n  --mds-button-border-color: var(--status-warning-04);\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host([variant="warning"][tone="quiet"]) {\n  --mds-button-color: rgb(var(--status-warning-02));\n}\n\n:host([variant="warning"][tone="quiet"]:hover) {\n  --mds-button-color: rgb(var(--status-warning-04));\n}\n\n:host([variant="warning"][tone="quiet"][active]) {\n  --mds-button-color: rgb(var(--status-warning-01));\n}\n\n:host([tone="quiet"]),\n:host([tone="quiet"]:hover),\n:host([tone="ghost"]) {\n  --mds-button-background: transparent;\n}\n\n:host([tone="strong"]),\n:host([tone="weak"]) {\n  --mds-button-border-default-opacity: 1;\n  --mds-button-border-width: 0;\n}\n\n:host([tone="strong"]),\n:host([tone="weak"]),\n:host([tone="ghost"]) {\n  --mds-button-border-opacity: var(--mds-button-border-default-opacity);\n}\n\n:host([tone="strong"]:hover),\n:host([tone="strong"][active]) {\n  --mds-button-border-width: var(--mds-button-border-tone-strong-hover-width);\n}\n\n:host([tone="weak"]:hover),\n:host([tone="weak"][active]) {\n  --mds-button-border-width: var(--mds-button-border-tone-weak-hover-width);\n}\n\n:host([tone="ghost"]:hover),\n:host([tone="ghost"][active]) {\n  --mds-button-background: transparent;\n  --mds-button-border-width: var(--mds-button-border-tone-ghost-hover-width);\n  --mds-button-border-opacity: var(--mds-button-border-hover-opacity);\n}\n\n:host([variant="google"]),\n:host([variant="google"][tone]) {\n  --mds-button-background: rgb(var(--tone-neutral));\n  --mds-button-border-hover-opacity: 0.5;\n  --mds-button-border-hover-width: 0.125rem;\n  --mds-button-border-opacity: 0.2;\n  --mds-button-border-width: 0.0625rem;\n  --mds-button-color: rgb(var(--tone-neutral-03));\n  --mds-button-border-color: var(--tone-neutral-01);\n\n  -webkit-box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n\n  box-shadow: 0 0 0 var(--mds-button-border-width) rgb(var(--mds-button-border-color) / var(--mds-button-border-opacity));\n}\n\n:host([variant="google"]:hover),\n:host([variant="google"][tone]:hover) {\n  --mds-button-border-width: var(--mds-button-border-hover-width);\n  --mds-button-border-opacity: var(--mds-button-border-hover-opacity);\n}\n\n:host([variant="apple"]),\n:host([variant="apple"][tone]) {\n  --mds-button-background: rgb(var(--tone-neutral-02));\n  --mds-button-color: rgb(var(--tone-neutral));\n  --mds-button-border-width: 0;\n}\n\n:host-context(.pref-theme-dark):host([variant="google"]),\n:host-context(.pref-theme-dark):host([variant="google"][tone]) {\n  --mds-button-border-width: 0.125rem;\n  --mds-button-border-opacity: 0.3;\n}\n\n:host-context(.pref-theme-dark):host([variant="google"]:hover),\n:host-context(.pref-theme-dark):host([variant="google"][tone]:hover) {\n  --mds-button-border-opacity: 0.5;\n}\n\n:host-context(.pref-theme-dark):host([variant="apple"]),\n:host-context(.pref-theme-dark):host([variant="apple"][tone]) {\n  --mds-button-background: rgb(var(--tone-neutral-01));\n}\n\n@media (prefers-color-scheme: dark) {\n  :host-context(.pref-theme-system):host([variant="apple"]),\n  :host-context(.pref-theme-system):host([variant="apple"][tone]) {\n    --mds-button-background: rgb(var(--tone-neutral-01));\n  }\n\n  :host-context(.pref-theme-system):host([variant="google"]),\n  :host-context(.pref-theme-system):host([variant="google"][tone]) {\n    --mds-button-border-width: 0.125rem;\n    --mds-button-border-opacity: 0.3;\n  }\n\n  :host-context(.pref-theme-system):host([variant="google"]:hover),\n  :host-context(.pref-theme-system):host([variant="google"][tone]:hover) {\n    --mds-button-border-opacity: 0.5;\n  }\n}\n\n:host-context(.pref-animation-reduce),\n:host-context(.pref-animation-reduce) .await,\n:host-context(.pref-animation-reduce) .icon {\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n}\n\n@media (prefers-reduced-motion) {\n  :host-context(.pref-animation-system),\n  :host-context(.pref-animation-system) .await,\n  :host-context(.pref-animation-system) .icon {\n    -webkit-transition-duration: 0s;\n    transition-duration: 0s;\n  }\n}\n\n:host(:not(:is([hydrated], .hydrated))) {\n  -webkit-animation-duration: 0s;\n  animation-duration: 0s;\n  border-color: transparent;\n  -webkit-box-shadow: 0 0 0 transparent;\n  box-shadow: 0 0 0 transparent;\n  opacity: 0;\n  outline-color: transparent;\n  -webkit-transition-delay: 0s;\n  transition-delay: 0s;\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n  visibility: hidden;\n}\n\n/* TODO refact(stencil): Uses only used selector from parent shadowDOM component */\n\nmds-accordion:not(:is([hydrated], .hydrated)),\nmds-accordion-item:not(:is([hydrated], .hydrated)),\nmds-accordion-timer:not(:is([hydrated], .hydrated)),\nmds-accordion-timer-item:not(:is([hydrated], .hydrated)),\nmds-author:not(:is([hydrated], .hydrated)),\nmds-avatar:not(:is([hydrated], .hydrated)),\nmds-badge:not(:is([hydrated], .hydrated)),\nmds-banner:not(:is([hydrated], .hydrated)),\nmds-benchmark-bar:not(:is([hydrated], .hydrated)),\nmds-bibliography:not(:is([hydrated], .hydrated)),\nmds-breadcrumb:not(:is([hydrated], .hydrated)),\nmds-breadcrumb-item:not(:is([hydrated], .hydrated)),\nmds-button:not(:is([hydrated], .hydrated)),\nmds-card:not(:is([hydrated], .hydrated)),\nmds-card-content:not(:is([hydrated], .hydrated)),\nmds-card-footer:not(:is([hydrated], .hydrated)),\nmds-card-header:not(:is([hydrated], .hydrated)),\nmds-card-media:not(:is([hydrated], .hydrated)),\nmds-chip:not(:is([hydrated], .hydrated)),\nmds-details:not(:is([hydrated], .hydrated)),\nmds-dropdown:not(:is([hydrated], .hydrated)),\nmds-entity:not(:is([hydrated], .hydrated)),\nmds-file:not(:is([hydrated], .hydrated)),\nmds-file-preview:not(:is([hydrated], .hydrated)),\nmds-filter:not(:is([hydrated], .hydrated)),\nmds-filter-item:not(:is([hydrated], .hydrated)),\nmds-header:not(:is([hydrated], .hydrated)),\nmds-header-bar:not(:is([hydrated], .hydrated)),\nmds-help:not(:is([hydrated], .hydrated)),\nmds-horizontal-scroll:not(:is([hydrated], .hydrated)),\nmds-hr:not(:is([hydrated], .hydrated)),\nmds-icon:not(:is([hydrated], .hydrated)),\nmds-img:not(:is([hydrated], .hydrated)),\nmds-input:not(:is([hydrated], .hydrated)),\nmds-input-field:not(:is([hydrated], .hydrated)),\nmds-input-range:not(:is([hydrated], .hydrated)),\nmds-input-select:not(:is([hydrated], .hydrated)),\nmds-input-switch:not(:is([hydrated], .hydrated)),\nmds-input-tip:not(:is([hydrated], .hydrated)),\nmds-input-tip-item:not(:is([hydrated], .hydrated)),\nmds-input-upload:not(:is([hydrated], .hydrated)),\nmds-keyboard:not(:is([hydrated], .hydrated)),\nmds-keyboard-key:not(:is([hydrated], .hydrated)),\nmds-kpi:not(:is([hydrated], .hydrated)),\nmds-kpi-item:not(:is([hydrated], .hydrated)),\nmds-label:not(:is([hydrated], .hydrated)),\nmds-list:not(:is([hydrated], .hydrated)),\nmds-list-item:not(:is([hydrated], .hydrated)),\nmds-modal:not(:is([hydrated], .hydrated)),\nmds-note:not(:is([hydrated], .hydrated)),\nmds-notification:not(:is([hydrated], .hydrated)),\nmds-paginator:not(:is([hydrated], .hydrated)),\nmds-paginator-item:not(:is([hydrated], .hydrated)),\nmds-pref:not(:is([hydrated], .hydrated)),\nmds-pref-animation:not(:is([hydrated], .hydrated)),\nmds-pref-consumption:not(:is([hydrated], .hydrated)),\nmds-pref-contrast:not(:is([hydrated], .hydrated)),\nmds-pref-language:not(:is([hydrated], .hydrated)),\nmds-pref-language-item:not(:is([hydrated], .hydrated)),\nmds-pref-theme:not(:is([hydrated], .hydrated)),\nmds-price-table:not(:is([hydrated], .hydrated)),\nmds-price-table-features:not(:is([hydrated], .hydrated)),\nmds-price-table-features-cell:not(:is([hydrated], .hydrated)),\nmds-price-table-features-row:not(:is([hydrated], .hydrated)),\nmds-price-table-header:not(:is([hydrated], .hydrated)),\nmds-price-table-list:not(:is([hydrated], .hydrated)),\nmds-price-table-list-item:not(:is([hydrated], .hydrated)),\nmds-progress:not(:is([hydrated], .hydrated)),\nmds-push-notification:not(:is([hydrated], .hydrated)),\nmds-push-notifications:not(:is([hydrated], .hydrated)),\nmds-quote:not(:is([hydrated], .hydrated)),\nmds-separator:not(:is([hydrated], .hydrated)),\nmds-spinner:not(:is([hydrated], .hydrated)),\nmds-stepper-bar:not(:is([hydrated], .hydrated)),\nmds-stepper-bar-item:not(:is([hydrated], .hydrated)),\nmds-tab:not(:is([hydrated], .hydrated)),\nmds-tab-bar:not(:is([hydrated], .hydrated)),\nmds-tab-bar-item:not(:is([hydrated], .hydrated)),\nmds-tab-item:not(:is([hydrated], .hydrated)),\nmds-table:not(:is([hydrated], .hydrated)),\nmds-table-body:not(:is([hydrated], .hydrated)),\nmds-table-cell:not(:is([hydrated], .hydrated)),\nmds-table-footer:not(:is([hydrated], .hydrated)),\nmds-table-header:not(:is([hydrated], .hydrated)),\nmds-table-header-cell:not(:is([hydrated], .hydrated)),\nmds-table-row:not(:is([hydrated], .hydrated)),\nmds-text:not(:is([hydrated], .hydrated)),\nmds-toast:not(:is([hydrated], .hydrated)),\nmds-tooltip:not(:is([hydrated], .hydrated)),\nmds-tree:not(:is([hydrated], .hydrated)),\nmds-tree-item:not(:is([hydrated], .hydrated)),\nmds-url-view:not(:is([hydrated], .hydrated)),\nmds-usage:not(:is([hydrated], .hydrated)),\nmds-video-wall:not(:is([hydrated], .hydrated)),\nmds-zero:not(:is([hydrated], .hydrated))\n{\n  -webkit-animation-duration: 0s;\n  animation-duration: 0s;\n  border-color: transparent;\n  -webkit-box-shadow: 0 0 0 transparent;\n  box-shadow: 0 0 0 transparent;\n  opacity: 0;\n  outline-color: transparent;\n  -webkit-transition-delay: 0s;\n  transition-delay: 0s;\n  -webkit-transition-duration: 0s;\n  transition-duration: 0s;\n  visibility: hidden;\n}\n\n';class l{resolveIconName(t){return this._resolveIconName(t,this.name,this.path)}constructor(t,n,r){this.name=t,this.path=n,this._resolveIconName=r}get resolver(){return this._resolveIconName}}const y=new class{constructor(){this._svgPathKey="mdsIconSvgPath",this._iconsSets=new Map,this._svgPathUpdate="mdsIconSvgPathUpdate",this.cacheExp=864e5,this.listeners=[],this.memoryCache={},this.isCacheAvailable=async t=>{try{const n=await function(t){return(arguments.length>1&&void 0!==arguments[1]?arguments[1]:v())("readonly",(function(n){return m(n.get(t))}))}(`loader_${t}`);if(!n)return!1;const r=JSON.parse(n);return Date.now()<r.expiry?r.data:(function(t){(arguments.length>1&&void 0!==arguments[1]?arguments[1]:v())("readwrite",(function(n){return n.delete(t),m(n.transaction)}))}(`loader_${t}`),!1)}catch(t){return console.error("isCacheAvailable error",t),!1}},this.setCache=async(t,n)=>{try{await function(t,n){return(arguments.length>2&&void 0!==arguments[2]?arguments[2]:v())("readwrite",(function(r){return r.put(n,t),m(r.transaction)}))}(`loader_${t}`,JSON.stringify({data:n,expiry:Date.now()+this.cacheExp}))}catch(t){console.error("setCache error",t)}},this.setUpListener()}addIconSet(t,n,r){let o=r;const a=this._iconsSets.get(t);if(!o&&a&&"function"==typeof a.resolver)o=a.resolver;else{if(o&&"function"!=typeof o)return console.error("MdsIconSvg: the third input of addIconSet should be a function that parses and returns the icons's filename."),!1;if(!o)return console.error(`MdsIconSvg: the set ${t} needs a resolve function for the icon names.`),!1}return this._iconsSets.set(t,new l(t,n,o)),!0}getIconSet(t){return t?{set:this._iconsSets.get(t.split("/")[0])}:{set:null}}setSvgPath(t){const n=/^(((https?:\/\/)?[.\w]+(:\d+)?)|\/)([\w/-]+)*/.exec(t);if(!n)throw Error(`Svg path not recognize ${t}, ensure is a absolute path starting with '/' or a url`);"undefined"!=typeof window&&(this._svgPath=n[1]?n[0]:window.location.origin.concat(n[0]),window.dispatchEvent(new Event(this._svgPathUpdate)))}getSvgPath(){return this._svgPath}registerListener(t){this.listeners.push(t)}setUpListener(){"undefined"!=typeof window&&window.addEventListener(this._svgPathUpdate,(()=>{for(const t of this.listeners)t()}))}async fetchSvg(t){var n;try{if(!this._svgPath&&"undefined"==typeof window)throw Error("Cant find svgPath, ensure you set it");this._svgPath||this.setSvgPath(null!==(n=window.sessionStorage.getItem(y._svgPathKey))&&void 0!==n?n:"");const r=this._svgPath&&!t.startsWith("http")?this._svgPath.concat(t,".svg"):t,o=await this.isCacheAvailable(r);if(this.memoryCache[r]||o)return this.memoryCache[r]||o;const a=await fetch(r);if(!a.ok)throw Error(`Request for '${r}' returned ${a.status} (${a.statusText})`);const s=await a.text(),e=s.toLowerCase().trim();if(!e.startsWith("<svg")&&!e.startsWith("<?xml"))throw Error(`Resource '${r}' returned an invalid SVG file`);return this.setCache(r,s),this.memoryCache[r]=s,s}catch(t){return console.error("fetchSvg error",t),""}}},g=class{constructor(n){t(this,n),this.convertBase64ToSvg=()=>{const t=this.name.replace(i,"").replace(/\=/i,"");return atob(t)}}componentWillLoad(){this.updateIcon(),y.registerListener((()=>this.updateIcon()))}static setSvgPathStatic(t){y.setSvgPath(t)}async setSvgPath(t){y.setSvgPath(t)}async updateIcon(){return this.name?h(this.name)?(this.svgHTML=this.convertBase64ToSvg(),Promise.resolve()):c(this.name)?(this.svgHTML=this.name,Promise.resolve()):void(this.svgHTML=await y.fetchSvg(this.name)):Promise.resolve()}render(){return n(r,{key:"b64516e083273f19955d483ace9a7bf2b8c25903"},this.svgHTML&&n("i",{key:"e9e61853cb3895c0e291f39358d9ab545cb3cfa6","aria-hidden":"true",class:"icon",part:"svg",innerHTML:this.svgHTML}))}get hostElement(){return o(this)}static get watchers(){return{name:["updateIcon"]}}};g.style=":host{aspect-ratio:1/1;width:1.5rem;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center}.icon{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;font-style:normal;-ms-flex-pack:center;justify-content:center;width:100%}.icon svg{height:auto;width:100%}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}";const p=class{constructor(n){t(this,n),this.running=!1}handleRunning(t){!1===t&&(this.running=void 0)}render(){return n(r,{key:"d7a24ade119468b787a963a6f4223a1210dd52c3"},n("i",{key:"9b1e19e3508723672118b7ce8d7968bb2966d15f",class:"await-icon",innerHTML:'<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n  <path opacity="0.25" d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="currentColor" stroke-width="4"/>\n  <path opacity="0.75" d="M10 2.2002C5.43552 3.12674 2 7.16224 2 12.0002C2 13.5118 2.3354 14.9451 2.93585 16.2297" stroke="currentColor" stroke-width="4" stroke-linecap="round"/>\n</svg>\n'}))}static get watchers(){return{running:["handleRunning"]}}};p.style=":host{--mds-spinner-duration:0.725s;height:3rem;width:3rem;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);-ms-flex-align:center;align-items:center;color:rgb(var(--variant-primary-03));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;opacity:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:opacity, transform;transition-property:opacity, transform, -webkit-transform}:host([running]){-webkit-transition-duration:700ms;transition-duration:700ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1);opacity:1;-webkit-transform:scale(1);transform:scale(1)}.await-icon{aspect-ratio:1/1;width:100%}@-webkit-keyframes spin{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.await-icon{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);-webkit-animation-duration:var(--mds-spinner-duration);animation-duration:var(--mds-spinner-duration);-webkit-animation-play-state:paused;animation-play-state:paused;display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;stroke:currentcolor;-webkit-transition-property:stroke;transition-property:stroke}.await-icon svg{width:100%}:host([running]) .await-icon{-webkit-animation-play-state:running;animation-play-state:running}:host-context(.pref-animation-reduce){--mds-spinner-duration:8s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){--mds-spinner-duration:8s}}:host-context(.pref-contrast-more){color:rgb(var(--variant-primary-01))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){color:rgb(var(--variant-primary-01))}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}";export{b as mds_button,g as mds_icon,p as mds_spinner}

package/dist/magma-components/{p-337e6444.system.entry.js → p-db5d1973.system.entry.js}

@@ -1 +1 @@
-System.register(["./p-2aef517c.system.js"],(function(d){"use strict";var t,e,r;return{setters:[function(d){t=d.r;e=d.h;r=d.H}],execute:function(){var a=":host{--mds-price-table-features-border-color:rgb(var(--tone-neutral-06));--mds-price-table-features-padding:0.75rem;-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);display:-ms-flexbox;display:flex;-webkit-transition-property:border-color;transition-property:border-color;width:100%}.table-wrapper{scroll-margin-left:1.5rem;scroll-margin-right:1.5rem;width:100%}table{border-collapse:collapse;min-width:100%;table-layout:fixed}header{border-bottom:1px solid var(--mds-price-table-features-border-color);padding:var(--mds-price-table-features-padding) var(--mds-price-table-features-padding) var(--mds-price-table-features-padding) 0}:host-context(.pref-animation-reduce){-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){-webkit-transition-duration:0s;transition-duration:0s}}:host-context(.pref-theme-dark){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05))}@media (prefers-color-scheme: dark){:host-context(.pref-theme-system){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05))}}:host-context(.pref-contrast-more){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03))}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}";var s=a;var i=d("mds_price_table_features",function(){function d(d){t(this,d)}d.prototype.render=function(){return e(r,{key:"1ef1d2675e4f0c86d69b109458fb57da81ee4b32"},e("div",{key:"157e0596180ff8679de3aeeca1581e7f106de222",class:"table-wrapper"},this.label&&e("header",{key:"ff01e4d69f70de954d36e62067685459fa6bc848",part:"header"},e("mds-text",{key:"1fae2b224e92a49814a49fe0b9f10109b2953336",typography:"detail"},e("b",{key:"1a725c8f0266b7cbfcebd99345d4223b217fd040"},this.label))),e("table",{key:"788f7696352facee6b02de88f79a890df5e3241d"},e("tbody",{key:"be75dedb22a10c6c9240c0a64c51b66e388fca81"},e("slot",{key:"cbd012ba80ca3080f342ee2d3f117f4e4aef0d4e"})))))};return d}());i.style=s}}}));
+System.register(["./p-2aef517c.system.js"],(function(d){"use strict";var t,e,r;return{setters:[function(d){t=d.r;e=d.h;r=d.H}],execute:function(){var a=":host{--mds-price-table-features-border-color:rgb(var(--tone-neutral-06));--mds-price-table-features-padding:0.75rem;-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);display:-ms-flexbox;display:flex;-webkit-transition-property:border-color;transition-property:border-color;width:100%}.table-wrapper{scroll-margin-left:1.5rem;scroll-margin-right:1.5rem;width:100%}table{border-collapse:collapse;min-width:100%;table-layout:fixed}header{border-bottom:1px solid var(--mds-price-table-features-border-color);padding:var(--mds-price-table-features-padding) var(--mds-price-table-features-padding) var(--mds-price-table-features-padding) 0}:host-context(.pref-animation-reduce){-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){-webkit-transition-duration:0s;transition-duration:0s}}:host-context(.pref-theme-dark){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05))}@media (prefers-color-scheme: dark){:host-context(.pref-theme-system){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05))}}:host-context(.pref-contrast-more){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03))}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}";var s=a;var i=d("mds_price_table_features",function(){function d(d){t(this,d)}d.prototype.render=function(){return e(r,{key:"65fbe8292e0f2cb896d38e251195e1b6336aad65"},e("div",{key:"afc0d405aa730019cdf162c51c2e65048ac1a367",class:"table-wrapper"},this.label&&e("header",{key:"3066a6a4ea70894a4af5dd06751584f4ccaaf96f",part:"header"},e("mds-text",{key:"61e33977213f3f8d59e7cd8b2a0da80224f1eaac",typography:"detail"},e("b",{key:"e27b98d309788d5ba03ed9d0fc5b125057da97d6"},this.label))),e("table",{key:"57790158982fe3bc897e054806f5bfe77abea87a"},e("tbody",{key:"7fae29e9d82a73b3f007220f92d2a8831906dd66"},e("slot",{key:"6ae54c5f2f0954146108da40aa855b7d094dd544"})))))};return d}());i.style=s}}}));

package/dist/magma-components/p-dbae0ec8.system.entry.js

@@ -0,0 +1 @@
+System.register(["./p-2aef517c.system.js"],(function(t){"use strict";var n,e,i,r;return{setters:[function(t){n=t.r;e=t.h;i=t.H;r=t.g}],execute:function(){var u=":host{display:-ms-inline-flexbox;display:inline-flex;gap:1rem}.input{width:3rem}.input::part(field){text-align:center}.input::part(tip-count){display:none}";var s=u;var a=t("mds_input_otp",function(){function t(t){var e=this;n(this,t);if(t.$hostElement$["s-ei"]){this.internals=t.$hostElement$["s-ei"]}else{this.internals=t.$hostElement$.attachInternals();t.$hostElement$["s-ei"]=this.internals}this.length=6;this.autosubmit=false;this.value="";this.getOtpCode=function(){var t=Array.from(e.element.shadowRoot.querySelectorAll("mds-input"));var n=t.map((function(t){return t.value})).join("");return n};this.setOtpDigit=function(t,n){t.value=n;var i=e.getOtpCode();e.value=i;e.internals.setFormValue(i)};this.submit=function(t){var n;var i=e.getOtpCode().length===e.length;t.blur();if(e.autosubmit&&i){(n=e.internals.form)===null||n===void 0?void 0:n.requestSubmit()}};this.handleKeyDown=function(t){if(t.ctrlKey){return}t.preventDefault();if(isNaN(Number(t.key))){return}var n=t.target;e.setOtpDigit(n,t.key);var i=n.nextElementSibling;if(i){i.setFocus()}else{e.submit(n)}};this.handlePaste=function(t){var n,i;t.preventDefault();var r=(n=t.clipboardData)===null||n===void 0?void 0:n.getData("text");if(isNaN(Number(r))){return}var u=(i=r===null||r===void 0?void 0:r.split(""))!==null&&i!==void 0?i:[];var s=t.target;for(var a=0,f=u;a<f.length;a++){var o=f[a];e.setOtpDigit(s,o);s=s.nextElementSibling;if(s){s.setFocus()}else{e.submit(s);return}}}}t.prototype.render=function(){var t=this;return e(i,{key:"377691dfe4f437ed62db8b81b7fdae30589bc4c1"},Array.from({length:this.length}).map((function(){return e("mds-input",{class:"input",maxlength:1,onKeyDown:t.handleKeyDown,onPaste:t.handlePaste})})))};Object.defineProperty(t,"formAssociated",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"element",{get:function(){return r(this)},enumerable:false,configurable:true});return t}());a.style=s}}}));

package/dist/magma-components/{p-0a274718.system.entry.js → p-ddd20d05.system.entry.js}

@@ -1 +1 @@
-var __awaiter=this&&this.__awaiter||function(t,e,r,d){function a(t){return t instanceof r?t:new r((function(e){e(t)}))}return new(r||(r=Promise))((function(r,o){function n(t){try{i(d.next(t))}catch(t){o(t)}}function s(t){try{i(d["throw"](t))}catch(t){o(t)}}function i(t){t.done?r(t.value):a(t.value).then(n,s)}i((d=d.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var r={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},d,a,o,n;return n={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(n[Symbol.iterator]=function(){return this}),n;function s(t){return function(e){return i([t,e])}}function i(s){if(d)throw new TypeError("Generator is already executing.");while(n&&(n=0,s[0]&&(r=0)),r)try{if(d=1,a&&(o=s[0]&2?a["return"]:s[0]?a["throw"]||((o=a["return"])&&o.call(a),0):a.next)&&!(o=o.call(a,s[1])).done)return o;if(a=0,o)s=[s[0]&2,o.value];switch(s[0]){case 0:case 1:o=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;a=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(o=r.trys,o=o.length>0&&o[o.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!o||s[1]>o[0]&&s[1]<o[3])){r.label=s[1];break}if(s[0]===6&&r.label<o[1]){r.label=o[1];o=s;break}if(o&&r.label<o[2]){r.label=o[2];r.ops.push(s);break}if(o[2])r.ops.pop();r.trys.pop();continue}s=e.call(t,r)}catch(t){s=[6,t];a=0}finally{d=o=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-2aef517c.system.js","./p-d68089ba.system.js"],(function(t){"use strict";var e,r,d,a,o,n;return{setters:[function(t){e=t.r;r=t.c;d=t.h;a=t.H;o=t.g},function(t){n=t.c}],execute:function(){var s=':host{--mds-table-actions-gap:0.5rem;--mds-table-background-alt:rgb(var(--tone-neutral-10));--mds-table-background:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-08));--mds-table-border-width:2px;--mds-table-cell-padding:1rem;--mds-table-color-alt:rgb(var(--tone-neutral-05));--mds-table-color:rgb(var(--tone-neutral-02));--mds-table-cell-border-color:var(--mds-table-border-color);--mds-table-cell-border-width:var(--mds-table-border-width);border-radius:1rem;-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);background-color:var(--mds-table-background);border:var(--mds-table-border-width) solid var(--mds-table-border-color) !important;border-color:var(--mds-table-border-color);display:-ms-flexbox;display:flex;overflow:auto;-webkit-transition-property:background-color, border-color, color;transition-property:background-color, border-color, color}.table{border-collapse:separate;border-spacing:0;width:100%}:host([selection]:not([selection="false"])){--mds-table-body-background:var(--mds-table-body-background-hover)}:host-context(.pref-animation-reduce){-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){-webkit-transition-duration:0s;transition-duration:0s}}:host-context(.pref-theme-dark){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral-10));--mds-table-border-color:rgb(var(--tone-neutral-07));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-03))}@media (prefers-color-scheme: dark){:host-context(.pref-theme-system){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral-10));--mds-table-border-color:rgb(var(--tone-neutral-07));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-03))}}:host-context(.pref-contrast-more){--mds-tab-bar-item-color:rgb(var(--tone-neutral-04));--mds-tab-bar-item-color-selected:rgb(var(--variant-primary-02))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){--mds-tab-bar-item-color:rgb(var(--tone-neutral-04));--mds-tab-bar-item-color-selected:rgb(var(--variant-primary-02))}}:host-context(.pref-contrast-more.pref-theme-dark){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}@media (prefers-contrast: more){:host-context(.pref-contrast-system.pref-theme-dark){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}}@media (prefers-color-scheme: dark){:host-context(.pref-contrast-more.pref-theme-system){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}}@media (prefers-contrast: more) and (prefers-color-scheme: dark){:host-context(.pref-contrast-system.pref-theme-system){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}';var i=s;var h=t("mds_table",function(){function t(t){var d=this;e(this,t);this.selectionEvent=r(this,"mdsTableSelectionChange",7);this.cellsWidth=0;this.selectedRows=[];this.updateInteractive=function(){d.body.interactive=d.interactive;d.rows.forEach((function(t){t.interactive=d.interactive}))};this.updateCellsSize=function(){var t;var e=d.rows[0].querySelectorAll("mds-table-cell");var r=(t=d.rows[0].shadowRoot)===null||t===void 0?void 0:t.querySelector(".selection-cell");d.cellsWidth=r?r.offsetWidth:0;e.forEach((function(t){d.cellsWidth+=t.offsetWidth}))};this.hasActions=function(){d.updateCellsSize();return d.host.querySelector('mds-table-row > [slot="action"]')!==null};this.handleSelection=function(){d.rows.forEach((function(t){t.selectable=d.selectable}))};this.handleActions=function(){d.updateCellsSize();var t=d.host.offsetWidth+d.host.scrollLeft<d.cellsWidth;d.rows.forEach((function(e){e.overlayActions=t}))};this.updateSlottedElements=function(){d.rows=d.host.querySelectorAll("mds-table-row");d.updateInteractive();d.handleSelection()}}t.prototype.onTableInteractive=function(){this.updateInteractive()};t.prototype.onTableSelectable=function(t){this.handleSelection();this.header.selectable=t};t.prototype.updateSelection=function(){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(e){if(!this.selectable){return[2]}this.selectedRows=[];this.rows.forEach((function(e,r){if(e.selected){t.selectedRows.push({index:r,value:e.value})}}));this.selectionEvent.emit({rows:this.selectedRows});this.header.setSelection(this.selectedRows.length,this.rows.length);this.selection=this.selectedRows.length>0;this.body.selection=this.selection;return[2]}))}))};t.prototype.selectAll=function(){return __awaiter(this,arguments,void 0,(function(t){if(t===void 0){t=true}return __generator(this,(function(e){if(!this.selectable){return[2]}this.rows.forEach((function(e){e.selected=t}));this.updateSelection();return[2]}))}))};t.prototype.componentWillLoad=function(){var t=this;this.body=this.host.querySelector("mds-table-body");this.header=this.host.querySelector("mds-table-header");this.rows=this.host.querySelectorAll("mds-table-row");this.tableBodyObserver=new MutationObserver((function(){t.updateSlottedElements()}));this.tableBodyObserver.observe(this.body,{childList:true})};t.prototype.componentDidLoad=function(){this.header.selectable=this.selectable;if(this.hasActions()){this.host.addEventListener("scroll",this.handleActions);this.resizeObserver=new ResizeObserver(this.handleActions);this.resizeObserver.observe(this.host);this.handleActions()}};t.prototype.disconnectedCallback=function(){var t;this.host.removeEventListener("scroll",this.handleActions);(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect();this.tableBodyObserver.disconnect()};t.prototype.render=function(){return d(a,{key:"4f097c1e4c9985e20acce993be1c9510b2843010"},d("table",{key:"e0176b33cfc4b2b876d658108de7acd3d38d0b2c",class:n("table",this.interactive&&"table--interactive"),role:"table"},d("slot",{key:"ec9bf47afc49055525aa4c3a7c4d0b6cb7669d37",onSlotchange:this.updateSlottedElements})))};Object.defineProperty(t.prototype,"host",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{interactive:["onTableInteractive"],selectable:["onTableSelectable"]}},enumerable:false,configurable:true});return t}());h.style=i}}}));
+var __awaiter=this&&this.__awaiter||function(t,e,r,d){function a(t){return t instanceof r?t:new r((function(e){e(t)}))}return new(r||(r=Promise))((function(r,o){function n(t){try{i(d.next(t))}catch(t){o(t)}}function s(t){try{i(d["throw"](t))}catch(t){o(t)}}function i(t){t.done?r(t.value):a(t.value).then(n,s)}i((d=d.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var r={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},d,a,o,n;return n={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(n[Symbol.iterator]=function(){return this}),n;function s(t){return function(e){return i([t,e])}}function i(s){if(d)throw new TypeError("Generator is already executing.");while(n&&(n=0,s[0]&&(r=0)),r)try{if(d=1,a&&(o=s[0]&2?a["return"]:s[0]?a["throw"]||((o=a["return"])&&o.call(a),0):a.next)&&!(o=o.call(a,s[1])).done)return o;if(a=0,o)s=[s[0]&2,o.value];switch(s[0]){case 0:case 1:o=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;a=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(o=r.trys,o=o.length>0&&o[o.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!o||s[1]>o[0]&&s[1]<o[3])){r.label=s[1];break}if(s[0]===6&&r.label<o[1]){r.label=o[1];o=s;break}if(o&&r.label<o[2]){r.label=o[2];r.ops.push(s);break}if(o[2])r.ops.pop();r.trys.pop();continue}s=e.call(t,r)}catch(t){s=[6,t];a=0}finally{d=o=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};System.register(["./p-2aef517c.system.js","./p-d68089ba.system.js"],(function(t){"use strict";var e,r,d,a,o,n;return{setters:[function(t){e=t.r;r=t.c;d=t.h;a=t.H;o=t.g},function(t){n=t.c}],execute:function(){var s=':host{--mds-table-actions-gap:0.5rem;--mds-table-background-alt:rgb(var(--tone-neutral-10));--mds-table-background:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-08));--mds-table-border-width:2px;--mds-table-cell-padding:1rem;--mds-table-color-alt:rgb(var(--tone-neutral-05));--mds-table-color:rgb(var(--tone-neutral-02));--mds-table-cell-border-color:var(--mds-table-border-color);--mds-table-cell-border-width:var(--mds-table-border-width);border-radius:1rem;-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);background-color:var(--mds-table-background);border:var(--mds-table-border-width) solid var(--mds-table-border-color) !important;border-color:var(--mds-table-border-color);display:-ms-flexbox;display:flex;overflow:auto;-webkit-transition-property:background-color, border-color, color;transition-property:background-color, border-color, color}.table{border-collapse:separate;border-spacing:0;width:100%}:host([selection]:not([selection="false"])){--mds-table-body-background:var(--mds-table-body-background-hover)}:host-context(.pref-animation-reduce){-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system){-webkit-transition-duration:0s;transition-duration:0s}}:host-context(.pref-theme-dark){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral-10));--mds-table-border-color:rgb(var(--tone-neutral-07));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-03))}@media (prefers-color-scheme: dark){:host-context(.pref-theme-system){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral-10));--mds-table-border-color:rgb(var(--tone-neutral-07));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-03))}}:host-context(.pref-contrast-more){--mds-tab-bar-item-color:rgb(var(--tone-neutral-04));--mds-tab-bar-item-color-selected:rgb(var(--variant-primary-02))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){--mds-tab-bar-item-color:rgb(var(--tone-neutral-04));--mds-tab-bar-item-color-selected:rgb(var(--variant-primary-02))}}:host-context(.pref-contrast-more.pref-theme-dark){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}@media (prefers-contrast: more){:host-context(.pref-contrast-system.pref-theme-dark){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}}@media (prefers-color-scheme: dark){:host-context(.pref-contrast-more.pref-theme-system){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}}@media (prefers-contrast: more) and (prefers-color-scheme: dark){:host-context(.pref-contrast-system.pref-theme-system){--mds-table-background:rgb(var(--tone-neutral-08));--mds-table-body-background-hover:rgb(var(--tone-neutral));--mds-table-border-color:rgb(var(--tone-neutral-05));--mds-table-color-hover:rgb(var(--tone-neutral-02));--mds-table-color:rgb(var(--tone-neutral-01))}}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}';var i=s;var h=t("mds_table",function(){function t(t){var d=this;e(this,t);this.selectionEvent=r(this,"mdsTableSelectionChange",7);this.cellsWidth=0;this.selectedRows=[];this.updateInteractive=function(){d.body.interactive=d.interactive;d.rows.forEach((function(t){t.interactive=d.interactive}))};this.updateCellsSize=function(){var t;var e=d.rows[0].querySelectorAll("mds-table-cell");var r=(t=d.rows[0].shadowRoot)===null||t===void 0?void 0:t.querySelector(".selection-cell");d.cellsWidth=r?r.offsetWidth:0;e.forEach((function(t){d.cellsWidth+=t.offsetWidth}))};this.hasActions=function(){d.updateCellsSize();return d.host.querySelector('mds-table-row > [slot="action"]')!==null};this.handleSelection=function(){d.rows.forEach((function(t){t.selectable=d.selectable}))};this.handleActions=function(){d.updateCellsSize();var t=d.host.offsetWidth+d.host.scrollLeft<d.cellsWidth;d.rows.forEach((function(e){e.overlayActions=t}))};this.updateSlottedElements=function(){d.rows=d.host.querySelectorAll("mds-table-row");d.updateInteractive();d.handleSelection()}}t.prototype.onTableInteractive=function(){this.updateInteractive()};t.prototype.onTableSelectable=function(t){this.handleSelection();this.header.selectable=t};t.prototype.updateSelection=function(){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(e){if(!this.selectable){return[2]}this.selectedRows=[];this.rows.forEach((function(e,r){if(e.selected){t.selectedRows.push({index:r,value:e.value})}}));this.selectionEvent.emit({rows:this.selectedRows});this.header.setSelection(this.selectedRows.length,this.rows.length);this.selection=this.selectedRows.length>0;this.body.selection=this.selection;return[2]}))}))};t.prototype.selectAll=function(){return __awaiter(this,arguments,void 0,(function(t){if(t===void 0){t=true}return __generator(this,(function(e){if(!this.selectable){return[2]}this.rows.forEach((function(e){e.selected=t}));this.updateSelection();return[2]}))}))};t.prototype.componentWillLoad=function(){var t=this;this.body=this.host.querySelector("mds-table-body");this.header=this.host.querySelector("mds-table-header");this.rows=this.host.querySelectorAll("mds-table-row");this.tableBodyObserver=new MutationObserver((function(){t.updateSlottedElements()}));this.tableBodyObserver.observe(this.body,{childList:true})};t.prototype.componentDidLoad=function(){this.header.selectable=this.selectable;if(this.hasActions()){this.host.addEventListener("scroll",this.handleActions);this.resizeObserver=new ResizeObserver(this.handleActions);this.resizeObserver.observe(this.host);this.handleActions()}};t.prototype.disconnectedCallback=function(){var t;this.host.removeEventListener("scroll",this.handleActions);(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect();this.tableBodyObserver.disconnect()};t.prototype.render=function(){return d(a,{key:"657ccbef8268b49eb345799af7a879f14817edcd"},d("table",{key:"6a261c25b7900ed21ede8a2589773c9dbba02cc7",class:n("table",this.interactive&&"table--interactive"),role:"table"},d("slot",{key:"11085b78efcd328e1287bef9d8a6d798ce04c6af",onSlotchange:this.updateSlottedElements})))};Object.defineProperty(t.prototype,"host",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{interactive:["onTableInteractive"],selectable:["onTableSelectable"]}},enumerable:false,configurable:true});return t}());h.style=i}}}));