myrta-ui 13.0.9 → 13.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/button/button.component.mjs +3 -3
- package/esm2020/lib/components/form/input-number/input-number.component.mjs +7 -4
- package/esm2020/lib/components/pdf-viewer/pdf-viewer.component.mjs +2 -2
- package/fesm2015/myrta-ui.mjs +9 -6
- package/fesm2015/myrta-ui.mjs.map +1 -1
- package/fesm2020/myrta-ui.mjs +9 -6
- package/fesm2020/myrta-ui.mjs.map +1 -1
- package/lib/components/form/input-number/input-number.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -71,10 +71,10 @@ export class ButtonComponent {
|
|
|
71
71
|
}
|
|
72
72
|
}
|
|
73
73
|
ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
74
|
-
ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ButtonComponent, selector: "mrx-button", inputs: { size: "size", type: "type", color: "color", iconPosition: "iconPosition", active: "active", disabled: "disabled", isLoading: "isLoading", iconOnly: "iconOnly", customClasses: "customClasses", label: "label", icon: "icon", iconClass: "iconClass", buttonType: "buttonType", href: "href", target: "target", routerLink: "routerLink", queryParams: "queryParams" }, outputs: { mrxClick: "mrxClick" }, ngImport: i0, template: "<ng-template #contentTemplate>\r\n <ng-template #spinner>\r\n <mrx-loader [color]=\"getLoaderColor\" [size]=\"getLoaderSize\"></mrx-loader>\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"isIconLeft && isLoading && !disabled\">\r\n <div\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <div\r\n *ngIf=\"icon && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div class=\"mrx-btn-label\">{{ getLabel }}\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"icon && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"isIconRight && isLoading && !disabled\">\r\n <div\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n (click)=\"$event.preventDefault()\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-container [ngSwitch]=\"true\">\r\n <a\r\n *ngSwitchCase=\"!!href\"\r\n [attr.rel]=\"target === '_blank' ? 'noopener noreferrer' : null\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [href]=\"href\"\r\n [target]=\"target\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <a\r\n *ngSwitchCase=\"!!routerLink\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [queryParams]=\"queryParams\"\r\n [routerLink]=\"routerLink\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <button\r\n *ngSwitchDefault\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [disabled]=\"disabled\"\r\n [type]=\"buttonType\"\r\n class=\"mrx-btn\"\r\n (click)=\"buttonClick($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </button>\r\n</ng-container>\r\n", styles: [":host{display:inline-flex}.mrx-btn.mrx-btn{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;cursor:pointer;border-radius:var(--border-radius-1);outline:none;transition:background-color .2s;text-align:center;text-decoration:none}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive{background-color:var(--system-bg-controls-positive-default);border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive:hover{background-color:var(--system-bg-controls-positive-hover);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative{background-color:var(--system-bg-controls-negative-default);border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative:hover{background-color:var(--system-bg-controls-negative-hover);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention{background-color:var(--system-bg-controls-attention-default);border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention:hover{background-color:var(--system-bg-controls-attention-hover);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive{background-color:transparent;border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative{background-color:transparent;border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active{background-color:var(--system-bg-negative-secondary);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention{background-color:transparent;border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active{background-color:var(--system-bg-attention-secondary);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.disabled,:host::ng-deep .mrx-btn.mrx-btn:disabled,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn[disabled]{cursor:default}:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-icon{color:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled]:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled]:disabled .mrx-icon{color:var(--neutral-icon-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill path{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill circle{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled]{background-color:var(--neutral-bg-disabled)!important;border-color:var(--neutral-bg-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled]{background-color:transparent!important;border-color:var(--neutral-bg-stroke-default)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled]{background-color:transparent!important;border-color:transparent!important}.mrx-btn.mrx-btn.icon-loading svg{transform:rotate(-40deg);animation-duration:1.2s;animation-name:icon-loading;animation-iteration-count:infinite;transition-timing-function:ease-in-out}@keyframes icon-loading{0%{transform:rotate(-40deg)}to{transform:rotate(320deg)}}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary{border:var(--border-width-default) solid var(--brand-bg-primary-default);background-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.active{background-color:var(--brand-bg-primary-hover);border-color:var(--brand-bg-primary-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill path{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill circle{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke path{stroke:transparent;fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary{background-color:transparent;border:var(--border-width-default) solid var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading path{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading circle{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .mrx-icon{color:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active{background-color:var(--brand-bg-tertiary-hover);border-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary{background-color:transparent;border:var(--border-width-default) solid transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}.mrx-btn.mrx-btn.mrx-btn-lg{font-family:var(--body-lg-bold-font-family);font-size:var(--body-lg-bold-font-size);font-weight:var(--body-lg-bold-font-weight);line-height:var(--body-lg-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-lg:not(.icon-only){padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-6) - var(--border-width-default));min-width:var(--sizing-24)}.mrx-btn.mrx-btn.mrx-btn-lg.icon-only{padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-lg.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-lg .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-md{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-md:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));min-width:var(--sizing-20)}.mrx-btn.mrx-btn.mrx-btn-md.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-md.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-md .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-sm{font-family:var(--body-sm-bold-font-family);font-size:var(--body-sm-bold-font-size);font-weight:var(--body-sm-bold-font-weight);line-height:var(--body-sm-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-sm:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));min-width:var(--sizing-16)}.mrx-btn.mrx-btn.mrx-btn-sm.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-sm.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-sm .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-4)}.mrx-btn.mrx-btn.icon-left .icon-wrapper,.mrx-btn.mrx-btn.icon-right .icon-wrapper{display:flex;align-items:center;justify-content:center}.mrx-btn.mrx-btn.icon-left .icon-wrapper svg,.mrx-btn.mrx-btn.icon-right .icon-wrapper svg{width:100%}.mrx-btn.mrx-btn.icon-left.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-left.mrx-btn-md .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-md .icon-wrapper{width:var(--sizing-6)}.mrx-btn.mrx-btn.icon-left.mrx-btn-sm .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-sm .icon-wrapper{width:var(--sizing-4)}\n"], components: [{ type: i1.LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }], pipes: { "safe": i4.SafePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
74
|
+
ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: ButtonComponent, selector: "mrx-button", inputs: { size: "size", type: "type", color: "color", iconPosition: "iconPosition", active: "active", disabled: "disabled", isLoading: "isLoading", iconOnly: "iconOnly", customClasses: "customClasses", label: "label", icon: "icon", iconClass: "iconClass", buttonType: "buttonType", href: "href", target: "target", routerLink: "routerLink", queryParams: "queryParams" }, outputs: { mrxClick: "mrxClick" }, ngImport: i0, template: "<ng-template #contentTemplate>\r\n <ng-template #spinner>\r\n <mrx-loader [color]=\"getLoaderColor\" [size]=\"getLoaderSize\"></mrx-loader>\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"isIconLeft && isLoading\">\r\n <div\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <div\r\n *ngIf=\"icon && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div class=\"mrx-btn-label\">{{ getLabel }}\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"icon && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"isIconRight && isLoading\">\r\n <div\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n (click)=\"$event.preventDefault()\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-container [ngSwitch]=\"true\">\r\n <a\r\n *ngSwitchCase=\"!!href\"\r\n [attr.rel]=\"target === '_blank' ? 'noopener noreferrer' : null\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [href]=\"href\"\r\n [target]=\"target\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <a\r\n *ngSwitchCase=\"!!routerLink\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [queryParams]=\"queryParams\"\r\n [routerLink]=\"routerLink\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <button\r\n *ngSwitchDefault\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [disabled]=\"disabled\"\r\n [type]=\"buttonType\"\r\n class=\"mrx-btn\"\r\n (click)=\"buttonClick($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </button>\r\n</ng-container>\r\n", styles: [":host{display:inline-flex}.mrx-btn.mrx-btn{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;cursor:pointer;border-radius:var(--border-radius-1);outline:none;transition:background-color .2s;text-align:center;text-decoration:none}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive{background-color:var(--system-bg-controls-positive-default);border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive:hover{background-color:var(--system-bg-controls-positive-hover);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative{background-color:var(--system-bg-controls-negative-default);border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative:hover{background-color:var(--system-bg-controls-negative-hover);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention{background-color:var(--system-bg-controls-attention-default);border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention:hover{background-color:var(--system-bg-controls-attention-hover);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive{background-color:transparent;border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative{background-color:transparent;border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active{background-color:var(--system-bg-negative-secondary);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention{background-color:transparent;border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active{background-color:var(--system-bg-attention-secondary);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.disabled,:host::ng-deep .mrx-btn.mrx-btn:disabled,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn[disabled]{cursor:default}:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-icon{color:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled]:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled]:disabled .mrx-icon{color:var(--neutral-icon-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill path{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill circle{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled]{background-color:var(--neutral-bg-disabled)!important;border-color:var(--neutral-bg-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled]{background-color:transparent!important;border-color:var(--neutral-bg-stroke-default)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled]{background-color:transparent!important;border-color:transparent!important}.mrx-btn.mrx-btn.icon-loading svg{transform:rotate(-40deg);animation-duration:1.2s;animation-name:icon-loading;animation-iteration-count:infinite;transition-timing-function:ease-in-out}@keyframes icon-loading{0%{transform:rotate(-40deg)}to{transform:rotate(320deg)}}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary{border:var(--border-width-default) solid var(--brand-bg-primary-default);background-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.active{background-color:var(--brand-bg-primary-hover);border-color:var(--brand-bg-primary-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill path{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill circle{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke path{stroke:transparent;fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary{background-color:transparent;border:var(--border-width-default) solid var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading path{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading circle{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .mrx-icon{color:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active{background-color:var(--brand-bg-tertiary-hover);border-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary{background-color:transparent;border:var(--border-width-default) solid transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}.mrx-btn.mrx-btn.mrx-btn-lg{font-family:var(--body-lg-bold-font-family);font-size:var(--body-lg-bold-font-size);font-weight:var(--body-lg-bold-font-weight);line-height:var(--body-lg-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-lg:not(.icon-only){padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-6) - var(--border-width-default));min-width:var(--sizing-24)}.mrx-btn.mrx-btn.mrx-btn-lg.icon-only{padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-lg.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-lg .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-md{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-md:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));min-width:var(--sizing-20)}.mrx-btn.mrx-btn.mrx-btn-md.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-md.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-md .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-sm{font-family:var(--body-sm-bold-font-family);font-size:var(--body-sm-bold-font-size);font-weight:var(--body-sm-bold-font-weight);line-height:var(--body-sm-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-sm:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));min-width:var(--sizing-16)}.mrx-btn.mrx-btn.mrx-btn-sm.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-sm.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-sm .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-4)}.mrx-btn.mrx-btn.icon-left .icon-wrapper,.mrx-btn.mrx-btn.icon-right .icon-wrapper{display:flex;align-items:center;justify-content:center}.mrx-btn.mrx-btn.icon-left .icon-wrapper svg,.mrx-btn.mrx-btn.icon-right .icon-wrapper svg{width:100%}.mrx-btn.mrx-btn.icon-left.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-left.mrx-btn-md .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-md .icon-wrapper{width:var(--sizing-6)}.mrx-btn.mrx-btn.icon-left.mrx-btn-sm .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-sm .icon-wrapper{width:var(--sizing-4)}\n"], components: [{ type: i1.LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }], pipes: { "safe": i4.SafePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
75
75
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
76
76
|
type: Component,
|
|
77
|
-
args: [{ selector: 'mrx-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #contentTemplate>\r\n <ng-template #spinner>\r\n <mrx-loader [color]=\"getLoaderColor\" [size]=\"getLoaderSize\"></mrx-loader>\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"isIconLeft && isLoading && !disabled\">\r\n <div\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <div\r\n *ngIf=\"icon && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div class=\"mrx-btn-label\">{{ getLabel }}\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"icon && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"isIconRight && isLoading && !disabled\">\r\n <div\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n (click)=\"$event.preventDefault()\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-container [ngSwitch]=\"true\">\r\n <a\r\n *ngSwitchCase=\"!!href\"\r\n [attr.rel]=\"target === '_blank' ? 'noopener noreferrer' : null\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [href]=\"href\"\r\n [target]=\"target\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <a\r\n *ngSwitchCase=\"!!routerLink\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [queryParams]=\"queryParams\"\r\n [routerLink]=\"routerLink\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <button\r\n *ngSwitchDefault\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [disabled]=\"disabled\"\r\n [type]=\"buttonType\"\r\n class=\"mrx-btn\"\r\n (click)=\"buttonClick($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </button>\r\n</ng-container>\r\n", styles: [":host{display:inline-flex}.mrx-btn.mrx-btn{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;cursor:pointer;border-radius:var(--border-radius-1);outline:none;transition:background-color .2s;text-align:center;text-decoration:none}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive{background-color:var(--system-bg-controls-positive-default);border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive:hover{background-color:var(--system-bg-controls-positive-hover);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative{background-color:var(--system-bg-controls-negative-default);border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative:hover{background-color:var(--system-bg-controls-negative-hover);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention{background-color:var(--system-bg-controls-attention-default);border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention:hover{background-color:var(--system-bg-controls-attention-hover);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive{background-color:transparent;border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative{background-color:transparent;border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active{background-color:var(--system-bg-negative-secondary);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention{background-color:transparent;border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active{background-color:var(--system-bg-attention-secondary);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.disabled,:host::ng-deep .mrx-btn.mrx-btn:disabled,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn[disabled]{cursor:default}:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-icon{color:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled]:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled]:disabled .mrx-icon{color:var(--neutral-icon-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill path{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill circle{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled]{background-color:var(--neutral-bg-disabled)!important;border-color:var(--neutral-bg-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled]{background-color:transparent!important;border-color:var(--neutral-bg-stroke-default)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled]{background-color:transparent!important;border-color:transparent!important}.mrx-btn.mrx-btn.icon-loading svg{transform:rotate(-40deg);animation-duration:1.2s;animation-name:icon-loading;animation-iteration-count:infinite;transition-timing-function:ease-in-out}@keyframes icon-loading{0%{transform:rotate(-40deg)}to{transform:rotate(320deg)}}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary{border:var(--border-width-default) solid var(--brand-bg-primary-default);background-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.active{background-color:var(--brand-bg-primary-hover);border-color:var(--brand-bg-primary-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill path{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill circle{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke path{stroke:transparent;fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary{background-color:transparent;border:var(--border-width-default) solid var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading path{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading circle{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .mrx-icon{color:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active{background-color:var(--brand-bg-tertiary-hover);border-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary{background-color:transparent;border:var(--border-width-default) solid transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}.mrx-btn.mrx-btn.mrx-btn-lg{font-family:var(--body-lg-bold-font-family);font-size:var(--body-lg-bold-font-size);font-weight:var(--body-lg-bold-font-weight);line-height:var(--body-lg-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-lg:not(.icon-only){padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-6) - var(--border-width-default));min-width:var(--sizing-24)}.mrx-btn.mrx-btn.mrx-btn-lg.icon-only{padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-lg.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-lg .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-md{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-md:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));min-width:var(--sizing-20)}.mrx-btn.mrx-btn.mrx-btn-md.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-md.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-md .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-sm{font-family:var(--body-sm-bold-font-family);font-size:var(--body-sm-bold-font-size);font-weight:var(--body-sm-bold-font-weight);line-height:var(--body-sm-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-sm:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));min-width:var(--sizing-16)}.mrx-btn.mrx-btn.mrx-btn-sm.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-sm.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-sm .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-4)}.mrx-btn.mrx-btn.icon-left .icon-wrapper,.mrx-btn.mrx-btn.icon-right .icon-wrapper{display:flex;align-items:center;justify-content:center}.mrx-btn.mrx-btn.icon-left .icon-wrapper svg,.mrx-btn.mrx-btn.icon-right .icon-wrapper svg{width:100%}.mrx-btn.mrx-btn.icon-left.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-left.mrx-btn-md .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-md .icon-wrapper{width:var(--sizing-6)}.mrx-btn.mrx-btn.icon-left.mrx-btn-sm .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-sm .icon-wrapper{width:var(--sizing-4)}\n"] }]
|
|
77
|
+
args: [{ selector: 'mrx-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #contentTemplate>\r\n <ng-template #spinner>\r\n <mrx-loader [color]=\"getLoaderColor\" [size]=\"getLoaderSize\"></mrx-loader>\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"isIconLeft && isLoading\">\r\n <div\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n\r\n\r\n <div\r\n *ngIf=\"icon && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconLeft && !isLoading\"\r\n [class.mr-1]=\"size === 'small' && !iconOnly\"\r\n [class.mr-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div class=\"mrx-btn-label\">{{ getLabel }}\r\n <ng-content></ng-content>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"iconClass && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n >\r\n <span\r\n [class.icon-font-16]=\"size === 'small'\"\r\n [class.icon-font-24]=\"size === 'large' || size === 'medium'\"\r\n [class]=\"iconClass\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"icon && isIconRight && !isLoading\"\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n [innerHTML]=\"getReplacedIcon | safe\" class=\"icon-wrapper\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"isIconRight && isLoading\">\r\n <div\r\n [class.ml-1]=\"size === 'small' && !iconOnly\"\r\n [class.ml-2]=\"(size === 'large' || size === 'medium') && !iconOnly\"\r\n class=\"icon-wrapper\"\r\n (click)=\"$event.preventDefault()\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"spinner\"></ng-container>\r\n </div>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-container [ngSwitch]=\"true\">\r\n <a\r\n *ngSwitchCase=\"!!href\"\r\n [attr.rel]=\"target === '_blank' ? 'noopener noreferrer' : null\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [href]=\"href\"\r\n [target]=\"target\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <a\r\n *ngSwitchCase=\"!!routerLink\"\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [queryParams]=\"queryParams\"\r\n [routerLink]=\"routerLink\"\r\n class=\"mrx-btn\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </a>\r\n\r\n <button\r\n *ngSwitchDefault\r\n [class.active]=\"active\"\r\n [class.icon-loading]=\"isLoading && !disabled\"\r\n [class.icon-only]=\"iconOnly\"\r\n [class]=\"getClasses\"\r\n [disabled]=\"disabled\"\r\n [type]=\"buttonType\"\r\n class=\"mrx-btn\"\r\n (click)=\"buttonClick($event)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n </button>\r\n</ng-container>\r\n", styles: [":host{display:inline-flex}.mrx-btn.mrx-btn{display:inline-flex;box-sizing:border-box;align-items:center;justify-content:center;cursor:pointer;border-radius:var(--border-radius-1);outline:none;transition:background-color .2s;text-align:center;text-decoration:none}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive{background-color:var(--system-bg-controls-positive-default);border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-positive:hover{background-color:var(--system-bg-controls-positive-hover);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative{background-color:var(--system-bg-controls-negative-default);border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-negative:hover{background-color:var(--system-bg-controls-negative-hover);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention{background-color:var(--system-bg-controls-attention-default);border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.mrx-btn-color-attention:hover{background-color:var(--system-bg-controls-attention-hover);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive{background-color:transparent;border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative{background-color:transparent;border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active{background-color:var(--system-bg-negative-secondary);border-color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention{background-color:transparent;border-color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active{background-color:var(--system-bg-attention-secondary);border-color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill path{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill circle{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.fill-rect rect{fill:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active .mrx-icon{color:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill path{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill circle{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.fill-rect rect{fill:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke path{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke circle{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.green.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-positive.active svg.stroke-rect rect{stroke:var(--system-bg-controls-positive-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill path{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill circle{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.fill-rect rect{fill:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active .mrx-icon{color:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill path{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill circle{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.fill-rect rect{fill:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke path{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke circle{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.red.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-negative.active svg.stroke-rect rect{stroke:var(--system-bg-controls-negative-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention{background-color:transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention .mrx-icon{color:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill path{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill circle{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.fill-rect rect{fill:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke path{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke circle{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active .mrx-icon{color:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill path{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill circle{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.fill-rect rect{fill:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke path{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke circle{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention:hover svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.yellow.active svg.stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.mrx-btn-color-attention.active svg.stroke-rect rect{stroke:var(--system-bg-controls-attention-hover)}:host::ng-deep .mrx-btn.mrx-btn.disabled,:host::ng-deep .mrx-btn.mrx-btn:disabled,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn[disabled]{cursor:default}:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled] .mrx-icon{color:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn:disabled:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled]:disabled .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn[disabled]:disabled .mrx-icon{color:var(--neutral-icon-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn:disabled .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] .icon-loading circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill path{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill circle{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke path{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn:disabled svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled=disabled] svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn[disabled] svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-tertiary)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary[disabled]{background-color:var(--neutral-bg-disabled)!important;border-color:var(--neutral-bg-disabled)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary[disabled]{background-color:transparent!important;border-color:var(--neutral-bg-stroke-default)!important}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:disabled,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled=disabled],:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary[disabled]{background-color:transparent!important;border-color:transparent!important}.mrx-btn.mrx-btn.icon-loading svg{transform:rotate(-40deg);animation-duration:1.2s;animation-name:icon-loading;animation-iteration-count:infinite;transition-timing-function:ease-in-out}@keyframes icon-loading{0%{transform:rotate(-40deg)}to{transform:rotate(320deg)}}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary{border:var(--border-width-default) solid var(--brand-bg-primary-default);background-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary.active{background-color:var(--brand-bg-primary-hover);border-color:var(--brand-bg-primary-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary .mrx-icon{color:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill path{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill circle{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).fill-rect rect{fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke path{stroke:transparent;fill:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke circle{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-primary svg:not(.icon-loading).stroke-rect rect{stroke:var(--neutral-text-inverse)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary{background-color:transparent;border:var(--border-width-default) solid var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading path{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .icon-loading circle{stroke:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.red .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-negative .mrx-icon{color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading path{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .icon-loading circle{stroke:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.green .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-positive .mrx-icon{color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading path{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .icon-loading circle{stroke:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.yellow .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.color-attention .mrx-icon{color:var(--Orange)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active{background-color:var(--brand-bg-tertiary-hover);border-color:var(--brand-bg-primary-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .icon-loading circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary:hover:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-secondary.active:not(.red,.green,.yellow,.color-positive,.color-negative,.color-attention) svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary{background-color:transparent;border:var(--border-width-default) solid transparent}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-btn-label,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary:hover .mrx-icon,:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary.active .mrx-icon{color:var(--brand-text-controls-hover)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary .mrx-icon{color:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill path{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill circle{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).fill-rect rect{fill:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke path{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke circle{stroke:var(--brand-text-controls-default)}:host::ng-deep .mrx-btn.mrx-btn.mrx-btn-tertiary svg:not(.icon-loading).stroke-rect rect{stroke:var(--brand-text-controls-default)}.mrx-btn.mrx-btn.mrx-btn-lg{font-family:var(--body-lg-bold-font-family);font-size:var(--body-lg-bold-font-size);font-weight:var(--body-lg-bold-font-weight);line-height:var(--body-lg-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-lg:not(.icon-only){padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-6) - var(--border-width-default));min-width:var(--sizing-24)}.mrx-btn.mrx-btn.mrx-btn-lg.icon-only{padding:calc(var(--spacing-3) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-lg.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-lg .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-md{font-family:var(--body-md-bold-font-family);font-size:var(--body-md-bold-font-size);font-weight:var(--body-md-bold-font-weight);line-height:var(--body-md-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-md:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-4) - var(--border-width-default));min-width:var(--sizing-20)}.mrx-btn.mrx-btn.mrx-btn-md.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-md.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-md .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-6)}.mrx-btn.mrx-btn.mrx-btn-sm{font-family:var(--body-sm-bold-font-family);font-size:var(--body-sm-bold-font-size);font-weight:var(--body-sm-bold-font-weight);line-height:var(--body-sm-bold-line-height)}.mrx-btn.mrx-btn.mrx-btn-sm:not(.icon-only){padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--spacing-3) - var(--border-width-default));min-width:var(--sizing-16)}.mrx-btn.mrx-btn.mrx-btn-sm.icon-only{padding:calc(var(--sizing-2) - var(--border-width-default)) calc(var(--sizing-2) - var(--border-width-default))}.mrx-btn.mrx-btn.mrx-btn-sm.mrx-btn-tertiary{padding-left:0;padding-right:0;min-width:auto}.mrx-btn.mrx-btn.mrx-btn-sm .mrx-btn-label{display:flex;align-items:center;justify-content:center;min-height:var(--sizing-4)}.mrx-btn.mrx-btn.icon-left .icon-wrapper,.mrx-btn.mrx-btn.icon-right .icon-wrapper{display:flex;align-items:center;justify-content:center}.mrx-btn.mrx-btn.icon-left .icon-wrapper svg,.mrx-btn.mrx-btn.icon-right .icon-wrapper svg{width:100%}.mrx-btn.mrx-btn.icon-left.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-lg .icon-wrapper,.mrx-btn.mrx-btn.icon-left.mrx-btn-md .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-md .icon-wrapper{width:var(--sizing-6)}.mrx-btn.mrx-btn.icon-left.mrx-btn-sm .icon-wrapper,.mrx-btn.mrx-btn.icon-right.mrx-btn-sm .icon-wrapper{width:var(--sizing-4)}\n"] }]
|
|
78
78
|
}], propDecorators: { size: [{
|
|
79
79
|
type: Input
|
|
80
80
|
}], type: [{
|
|
@@ -112,4 +112,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
|
|
|
112
112
|
}], mrxClick: [{
|
|
113
113
|
type: Output
|
|
114
114
|
}] } });
|
|
115
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL215cnRhLXVpL3NyYy9saWIvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL215cnRhLXVpL3NyYy9saWIvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHaEcsT0FBTyxFQUVMLGdCQUFnQixFQUVoQixzQkFBc0IsRUFFdEIsZUFBZSxFQUlmLGVBQWUsRUFDaEIsTUFBTSxlQUFlLENBQUM7Ozs7OztBQVF2QixNQUFNLE9BQU8sZUFBZTtJQU41QjtRQU9XLFNBQUksR0FBcUIsT0FBTyxDQUFDO1FBQ2pDLFNBQUksR0FBZ0IsU0FBUyxDQUFDO1FBQzlCLFVBQUssR0FBc0IsU0FBUyxDQUFDO1FBQ3JDLGlCQUFZLEdBQTRCLE1BQU0sQ0FBQztRQUMvQyxXQUFNLEdBQVksS0FBSyxDQUFDO1FBQ3hCLGFBQVEsR0FBWSxLQUFLLENBQUM7UUFDMUIsY0FBUyxHQUFZLEtBQUssQ0FBQztRQUMzQixhQUFRLEdBQVksS0FBSyxDQUFDO1FBQzFCLGtCQUFhLEdBQVcsRUFBRSxDQUFDO1FBQzNCLFVBQUssR0FBVyxFQUFFLENBQUM7UUFDbkIsU0FBSSxHQUFXLEVBQUUsQ0FBQztRQUNsQixjQUFTLEdBQVcsRUFBRSxDQUFDO1FBQ3ZCLGVBQVUsR0FBb0IsUUFBUSxDQUFDO1FBQ3ZDLFNBQUksR0FBVyxFQUFFLENBQUM7UUFDbEIsV0FBTSxHQUFzQixRQUFRLENBQUM7UUFDckMsZUFBVSxHQUFXLEVBQUUsQ0FBQztRQUN4QixnQkFBVyxHQUE4QixFQUFFLENBQUM7UUFFM0MsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFjLENBQUM7S0FrRHJEO0lBaERDLElBQVcsUUFBUTtRQUNqQixPQUFPLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQTtJQUMxQyxDQUFDO0lBRUQsSUFBVyxNQUFNO1FBQ2YsT0FBTyxJQUFJLENBQUMsWUFBWSxLQUFLLE1BQU0sQ0FBQTtJQUNyQyxDQUFDO0lBRUQsSUFBVyxVQUFVO1FBQ25CLE9BQU8sSUFBSSxDQUFDLFlBQVksS0FBSyxNQUFNLENBQUE7SUFDckMsQ0FBQztJQUVELElBQVcsV0FBVztRQUNwQixPQUFPLElBQUksQ0FBQyxZQUFZLEtBQUssT0FBTyxDQUFBO0lBQ3RDLENBQUM7SUFFRCxJQUFXLFVBQVU7UUFDbkIsT0FBTyxHQUFHLGVBQWUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksZUFBZSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksSUFBSSxDQUFDLGFBQWEsSUFBSSxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLEVBQUUsQ0FBQztJQUMxSyxDQUFDO0lBRUQsSUFBVyxjQUFjO1FBQ3ZCLElBQUksSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNqQixPQUFPLE9BQU8sQ0FBQTtTQUNmO1FBQ0QsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLFNBQVMsRUFBRTtZQUM1QixPQUFPLElBQUksQ0FBQyxJQUFJLEtBQUssU0FBUyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQTtTQUNuRDthQUFNLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxTQUFTLEVBQUU7WUFDbEMsT0FBTyxPQUFPLENBQUE7U0FDZjthQUFNO1lBQ0wsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFBO1NBQ2xCO0lBQ0gsQ0FBQztJQUVELElBQVcsYUFBYTtRQUN0QixPQUFPLElBQUksQ0FBQyxJQUFJLEtBQUssT0FBTyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLEtBQUssUUFBUSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQTtJQUMzRixDQUFDO0lBRUQsSUFBVyxlQUFlO1FBQ3hCLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxFQUFFLFFBQVEsQ0FBQyxDQUFBO0lBQ2xELENBQUM7SUFFTSxXQUFXLENBQUMsTUFBa0I7UUFDbkMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDbEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUE7U0FDM0I7YUFBTTtZQUNMLE1BQU0sQ0FBQyxlQUFlLEVBQUUsQ0FBQTtTQUN6QjtJQUNILENBQUM7OzRHQXBFVSxlQUFlO2dHQUFmLGVBQWUsdWNDdEI1Qix1d0hBb0hBOzJGRDlGYSxlQUFlO2tCQU4zQixTQUFTOytCQUNFLFlBQVksbUJBR0wsdUJBQXVCLENBQUMsTUFBTTs4QkFHdEMsSUFBSTtzQkFBWixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFFSSxRQUFRO3NCQUFqQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5pbXBvcnQgeyBMb2FkZXJDb2xvclR5cGVzLCBMb2FkZXJTaXplc1R5cGVzIH0gZnJvbSAnLi4vbG9hZGVyL2xvYWRlci5lbnVtJztcclxuaW1wb3J0IHtcclxuICBCdXR0b25BdHRyVHlwZXMsXHJcbiAgQnV0dG9uQ29sb3JzRW51bSxcclxuICBCdXR0b25Db2xvcnNUeXBlcyxcclxuICBCdXR0b25JY29uUG9zaXRpb25FbnVtLFxyXG4gIEJ1dHRvbkljb25Qb3NpdGlvblR5cGVzLFxyXG4gIEJ1dHRvblNpemVzRW51bSxcclxuICBCdXR0b25TaXplc1R5cGVzLFxyXG4gIEJ1dHRvblRhcmdldFR5cGVzLFxyXG4gIEJ1dHRvblR5cGVzLFxyXG4gIEJ1dHRvblR5cGVzRW51bVxyXG59IGZyb20gJy4vYnV0dG9uLmVudW0nO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdtcngtYnV0dG9uJyxcclxuICB0ZW1wbGF0ZVVybDogJ2J1dHRvbi5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vYnV0dG9uLmNvbXBvbmVudC5sZXNzJ10sXHJcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBCdXR0b25Db21wb25lbnQge1xyXG4gIEBJbnB1dCgpIHNpemU6IEJ1dHRvblNpemVzVHlwZXMgPSAnbGFyZ2UnO1xyXG4gIEBJbnB1dCgpIHR5cGU6IEJ1dHRvblR5cGVzID0gJ3ByaW1hcnknO1xyXG4gIEBJbnB1dCgpIGNvbG9yOiBCdXR0b25Db2xvcnNUeXBlcyA9ICdkZWZhdWx0JztcclxuICBASW5wdXQoKSBpY29uUG9zaXRpb246IEJ1dHRvbkljb25Qb3NpdGlvblR5cGVzID0gJ2xlZnQnO1xyXG4gIEBJbnB1dCgpIGFjdGl2ZTogYm9vbGVhbiA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgaXNMb2FkaW5nOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgaWNvbk9ubHk6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoKSBjdXN0b21DbGFzc2VzOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBsYWJlbDogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgaWNvbjogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgaWNvbkNsYXNzOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBidXR0b25UeXBlOiBCdXR0b25BdHRyVHlwZXMgPSAnYnV0dG9uJztcclxuICBASW5wdXQoKSBocmVmOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSB0YXJnZXQ6IEJ1dHRvblRhcmdldFR5cGVzID0gJ19ibGFuayc7XHJcbiAgQElucHV0KCkgcm91dGVyTGluazogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgcXVlcnlQYXJhbXM6IHsgW2tleTogc3RyaW5nXTogc3RyaW5nIH0gPSB7fTtcclxuXHJcbiAgQE91dHB1dCgpIG1yeENsaWNrID0gbmV3IEV2ZW50RW1pdHRlcjxNb3VzZUV2ZW50PigpO1xyXG5cclxuICBwdWJsaWMgZ2V0IGdldExhYmVsKCk6IG51bGwgfCBzdHJpbmcge1xyXG4gICAgcmV0dXJuIHRoaXMuaWNvbk9ubHkgPyBudWxsIDogdGhpcy5sYWJlbFxyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBpc0ljb24oKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5pY29uUG9zaXRpb24gIT09ICdub25lJ1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBpc0ljb25MZWZ0KCk6IGJvb2xlYW4ge1xyXG4gICAgcmV0dXJuIHRoaXMuaWNvblBvc2l0aW9uID09PSAnbGVmdCdcclxuICB9XHJcblxyXG4gIHB1YmxpYyBnZXQgaXNJY29uUmlnaHQoKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5pY29uUG9zaXRpb24gPT09ICdyaWdodCdcclxuICB9XHJcblxyXG4gIHB1YmxpYyBnZXQgZ2V0Q2xhc3NlcygpOiBzdHJpbmcge1xyXG4gICAgcmV0dXJuIGAke0J1dHRvblNpemVzRW51bVt0aGlzLnNpemVdfSAke0J1dHRvblR5cGVzRW51bVt0aGlzLnR5cGVdfSAke0J1dHRvbkNvbG9yc0VudW1bdGhpcy5jb2xvcl19ICR7dGhpcy5jdXN0b21DbGFzc2VzfSAke0J1dHRvbkljb25Qb3NpdGlvbkVudW1bdGhpcy5pY29uUG9zaXRpb25dfWA7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgZ2V0IGdldExvYWRlckNvbG9yKCk6IExvYWRlckNvbG9yVHlwZXMge1xyXG4gICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcclxuICAgICAgcmV0dXJuICdibGFjaydcclxuICAgIH1cclxuICAgIGlmICh0aGlzLmNvbG9yID09PSAnZGVmYXVsdCcpIHtcclxuICAgICAgcmV0dXJuIHRoaXMudHlwZSA9PT0gJ3ByaW1hcnknID8gJ3doaXRlJyA6ICdicmFuZCdcclxuICAgIH0gZWxzZSBpZiAodGhpcy50eXBlID09PSAncHJpbWFyeScpIHtcclxuICAgICAgcmV0dXJuICd3aGl0ZSdcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHJldHVybiB0aGlzLmNvbG9yXHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgZ2V0IGdldExvYWRlclNpemUoKTogTG9hZGVyU2l6ZXNUeXBlcyB7XHJcbiAgICByZXR1cm4gdGhpcy5zaXplID09PSAnbGFyZ2UnID8gJ3NtYWxsJyA6IHRoaXMuc2l6ZSA9PT0gJ21lZGl1bScgPyAnc21hbGwnIDogJ2V4dHJhLXNtYWxsJ1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBnZXRSZXBsYWNlZEljb24oKTogc3RyaW5nIHtcclxuICAgIHJldHVybiB0aGlzLmljb24ucmVwbGFjZSgvXCIoW15cIl0rKVwiL2csICdcXCckMVxcJycpXHJcbiAgfVxyXG5cclxuICBwdWJsaWMgYnV0dG9uQ2xpY2soJGV2ZW50OiBNb3VzZUV2ZW50KTogdm9pZCB7XHJcbiAgICBpZiAoIXRoaXMuZGlzYWJsZWQpIHtcclxuICAgICAgdGhpcy5tcnhDbGljay5lbWl0KCRldmVudClcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgICRldmVudC5zdG9wUHJvcGFnYXRpb24oKVxyXG4gICAgfVxyXG4gIH1cclxufVxyXG4iLCI8bmctdGVtcGxhdGUgI2NvbnRlbnRUZW1wbGF0ZT5cclxuICA8bmctdGVtcGxhdGUgI3NwaW5uZXI+XHJcbiAgICA8bXJ4LWxvYWRlciBbY29sb3JdPVwiZ2V0TG9hZGVyQ29sb3JcIiBbc2l6ZV09XCJnZXRMb2FkZXJTaXplXCI+PC9tcngtbG9hZGVyPlxyXG4gIDwvbmctdGVtcGxhdGU+XHJcblxyXG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCJpc0ljb25MZWZ0ICYmIGlzTG9hZGluZyAmJiAhZGlzYWJsZWRcIj5cclxuICAgIDxkaXZcclxuICAgICAgW2NsYXNzLm1yLTFdPVwic2l6ZSA9PT0gJ3NtYWxsJyAmJiAhaWNvbk9ubHlcIlxyXG4gICAgICBbY2xhc3MubXItMl09XCIoc2l6ZSA9PT0gJ2xhcmdlJyB8fCBzaXplID09PSAnbWVkaXVtJykgJiYgIWljb25Pbmx5XCJcclxuICAgICAgY2xhc3M9XCJpY29uLXdyYXBwZXJcIlxyXG4gICAgPlxyXG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwic3Bpbm5lclwiPjwvbmctY29udGFpbmVyPlxyXG4gICAgPC9kaXY+XHJcbiAgPC9uZy1jb250YWluZXI+XHJcblxyXG5cclxuICA8ZGl2XHJcbiAgICAqbmdJZj1cImljb24gJiYgaXNJY29uTGVmdCAmJiAhaXNMb2FkaW5nXCJcclxuICAgIFtjbGFzcy5tci0xXT1cInNpemUgPT09ICdzbWFsbCcgJiYgIWljb25Pbmx5XCJcclxuICAgIFtjbGFzcy5tci0yXT1cIihzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nKSAmJiAhaWNvbk9ubHlcIlxyXG4gICAgW2lubmVySFRNTF09XCJnZXRSZXBsYWNlZEljb24gfCBzYWZlXCIgY2xhc3M9XCJpY29uLXdyYXBwZXJcIlxyXG4gID48L2Rpdj5cclxuXHJcbiAgPGRpdlxyXG4gICAgKm5nSWY9XCJpY29uQ2xhc3MgJiYgaXNJY29uTGVmdCAmJiAhaXNMb2FkaW5nXCJcclxuICAgIFtjbGFzcy5tci0xXT1cInNpemUgPT09ICdzbWFsbCcgJiYgIWljb25Pbmx5XCJcclxuICAgIFtjbGFzcy5tci0yXT1cIihzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nKSAmJiAhaWNvbk9ubHlcIlxyXG4gICAgY2xhc3M9XCJpY29uLXdyYXBwZXJcIlxyXG4gID5cclxuICAgIDxzcGFuXHJcbiAgICAgIFtjbGFzcy5pY29uLWZvbnQtMTZdPVwic2l6ZSA9PT0gJ3NtYWxsJ1wiXHJcbiAgICAgIFtjbGFzcy5pY29uLWZvbnQtMjRdPVwic2l6ZSA9PT0gJ2xhcmdlJyB8fCBzaXplID09PSAnbWVkaXVtJ1wiXHJcbiAgICAgIFtjbGFzc109XCJpY29uQ2xhc3NcIlxyXG4gICAgICBjbGFzcz1cIm1yeC1pY29uXCJcclxuICAgID48L3NwYW4+XHJcbiAgPC9kaXY+XHJcblxyXG4gIDxkaXYgY2xhc3M9XCJtcngtYnRuLWxhYmVsXCI+e3sgZ2V0TGFiZWwgfX1cclxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICA8L2Rpdj5cclxuXHJcbiAgPGRpdlxyXG4gICAgKm5nSWY9XCJpY29uQ2xhc3MgJiYgaXNJY29uUmlnaHQgJiYgIWlzTG9hZGluZ1wiXHJcbiAgICBbY2xhc3MubWwtMV09XCJzaXplID09PSAnc21hbGwnICYmICFpY29uT25seVwiXHJcbiAgICBbY2xhc3MubWwtMl09XCIoc2l6ZSA9PT0gJ2xhcmdlJyB8fCBzaXplID09PSAnbWVkaXVtJykgJiYgIWljb25Pbmx5XCJcclxuICAgIGNsYXNzPVwiaWNvbi13cmFwcGVyXCJcclxuICA+XHJcbiAgICA8c3BhblxyXG4gICAgICBbY2xhc3MuaWNvbi1mb250LTE2XT1cInNpemUgPT09ICdzbWFsbCdcIlxyXG4gICAgICBbY2xhc3MuaWNvbi1mb250LTI0XT1cInNpemUgPT09ICdsYXJnZScgfHwgc2l6ZSA9PT0gJ21lZGl1bSdcIlxyXG4gICAgICBbY2xhc3NdPVwiaWNvbkNsYXNzXCJcclxuICAgICAgY2xhc3M9XCJtcngtaWNvblwiXHJcbiAgICA+PC9zcGFuPlxyXG4gIDwvZGl2PlxyXG5cclxuICA8ZGl2XHJcbiAgICAqbmdJZj1cImljb24gJiYgaXNJY29uUmlnaHQgJiYgIWlzTG9hZGluZ1wiXHJcbiAgICBbY2xhc3MubWwtMV09XCJzaXplID09PSAnc21hbGwnICYmICFpY29uT25seVwiXHJcbiAgICBbY2xhc3MubWwtMl09XCIoc2l6ZSA9PT0gJ2xhcmdlJyB8fCBzaXplID09PSAnbWVkaXVtJykgJiYgIWljb25Pbmx5XCJcclxuICAgIFtpbm5lckhUTUxdPVwiZ2V0UmVwbGFjZWRJY29uIHwgc2FmZVwiIGNsYXNzPVwiaWNvbi13cmFwcGVyXCJcclxuICA+PC9kaXY+XHJcblxyXG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCJpc0ljb25SaWdodCAmJiBpc0xvYWRpbmcgJiYgIWRpc2FibGVkXCI+XHJcbiAgICA8ZGl2XHJcbiAgICAgIFtjbGFzcy5tbC0xXT1cInNpemUgPT09ICdzbWFsbCcgJiYgIWljb25Pbmx5XCJcclxuICAgICAgW2NsYXNzLm1sLTJdPVwiKHNpemUgPT09ICdsYXJnZScgfHwgc2l6ZSA9PT0gJ21lZGl1bScpICYmICFpY29uT25seVwiXHJcbiAgICAgIGNsYXNzPVwiaWNvbi13cmFwcGVyXCJcclxuICAgICAgKGNsaWNrKT1cIiRldmVudC5wcmV2ZW50RGVmYXVsdCgpXCJcclxuICAgID5cclxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cInNwaW5uZXJcIj48L25nLWNvbnRhaW5lcj5cclxuICAgIDwvZGl2PlxyXG4gIDwvbmctY29udGFpbmVyPlxyXG48L25nLXRlbXBsYXRlPlxyXG5cclxuPG5nLWNvbnRhaW5lciBbbmdTd2l0Y2hdPVwidHJ1ZVwiPlxyXG4gIDxhXHJcbiAgICAqbmdTd2l0Y2hDYXNlPVwiISFocmVmXCJcclxuICAgIFthdHRyLnJlbF09XCJ0YXJnZXQgPT09ICdfYmxhbmsnID8gJ25vb3BlbmVyIG5vcmVmZXJyZXInIDogbnVsbFwiXHJcbiAgICBbY2xhc3MuYWN0aXZlXT1cImFjdGl2ZVwiXHJcbiAgICBbY2xhc3MuaWNvbi1sb2FkaW5nXT1cImlzTG9hZGluZyAmJiAhZGlzYWJsZWRcIlxyXG4gICAgW2NsYXNzLmljb24tb25seV09XCJpY29uT25seVwiXHJcbiAgICBbY2xhc3NdPVwiZ2V0Q2xhc3Nlc1wiXHJcbiAgICBbaHJlZl09XCJocmVmXCJcclxuICAgIFt0YXJnZXRdPVwidGFyZ2V0XCJcclxuICAgIGNsYXNzPVwibXJ4LWJ0blwiXHJcbiAgPlxyXG4gICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImNvbnRlbnRUZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxyXG4gIDwvYT5cclxuXHJcbiAgPGFcclxuICAgICpuZ1N3aXRjaENhc2U9XCIhIXJvdXRlckxpbmtcIlxyXG4gICAgW2NsYXNzLmFjdGl2ZV09XCJhY3RpdmVcIlxyXG4gICAgW2NsYXNzLmljb24tbG9hZGluZ109XCJpc0xvYWRpbmcgJiYgIWRpc2FibGVkXCJcclxuICAgIFtjbGFzcy5pY29uLW9ubHldPVwiaWNvbk9ubHlcIlxyXG4gICAgW2NsYXNzXT1cImdldENsYXNzZXNcIlxyXG4gICAgW3F1ZXJ5UGFyYW1zXT1cInF1ZXJ5UGFyYW1zXCJcclxuICAgIFtyb3V0ZXJMaW5rXT1cInJvdXRlckxpbmtcIlxyXG4gICAgY2xhc3M9XCJtcngtYnRuXCJcclxuICA+XHJcbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFRlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XHJcbiAgPC9hPlxyXG5cclxuICA8YnV0dG9uXHJcbiAgICAqbmdTd2l0Y2hEZWZhdWx0XHJcbiAgICBbY2xhc3MuYWN0aXZlXT1cImFjdGl2ZVwiXHJcbiAgICBbY2xhc3MuaWNvbi1sb2FkaW5nXT1cImlzTG9hZGluZyAmJiAhZGlzYWJsZWRcIlxyXG4gICAgW2NsYXNzLmljb24tb25seV09XCJpY29uT25seVwiXHJcbiAgICBbY2xhc3NdPVwiZ2V0Q2xhc3Nlc1wiXHJcbiAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxyXG4gICAgW3R5cGVdPVwiYnV0dG9uVHlwZVwiXHJcbiAgICBjbGFzcz1cIm1yeC1idG5cIlxyXG4gICAgKGNsaWNrKT1cImJ1dHRvbkNsaWNrKCRldmVudClcIlxyXG4gID5cclxuICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJjb250ZW50VGVtcGxhdGVcIj48L25nLWNvbnRhaW5lcj5cclxuICA8L2J1dHRvbj5cclxuPC9uZy1jb250YWluZXI+XHJcbiJdfQ==
|
|
115
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL215cnRhLXVpL3NyYy9saWIvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL215cnRhLXVpL3NyYy9saWIvY29tcG9uZW50cy9idXR0b24vYnV0dG9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHaEcsT0FBTyxFQUVMLGdCQUFnQixFQUVoQixzQkFBc0IsRUFFdEIsZUFBZSxFQUlmLGVBQWUsRUFDaEIsTUFBTSxlQUFlLENBQUM7Ozs7OztBQVF2QixNQUFNLE9BQU8sZUFBZTtJQU41QjtRQU9XLFNBQUksR0FBcUIsT0FBTyxDQUFDO1FBQ2pDLFNBQUksR0FBZ0IsU0FBUyxDQUFDO1FBQzlCLFVBQUssR0FBc0IsU0FBUyxDQUFDO1FBQ3JDLGlCQUFZLEdBQTRCLE1BQU0sQ0FBQztRQUMvQyxXQUFNLEdBQVksS0FBSyxDQUFDO1FBQ3hCLGFBQVEsR0FBWSxLQUFLLENBQUM7UUFDMUIsY0FBUyxHQUFZLEtBQUssQ0FBQztRQUMzQixhQUFRLEdBQVksS0FBSyxDQUFDO1FBQzFCLGtCQUFhLEdBQVcsRUFBRSxDQUFDO1FBQzNCLFVBQUssR0FBVyxFQUFFLENBQUM7UUFDbkIsU0FBSSxHQUFXLEVBQUUsQ0FBQztRQUNsQixjQUFTLEdBQVcsRUFBRSxDQUFDO1FBQ3ZCLGVBQVUsR0FBb0IsUUFBUSxDQUFDO1FBQ3ZDLFNBQUksR0FBVyxFQUFFLENBQUM7UUFDbEIsV0FBTSxHQUFzQixRQUFRLENBQUM7UUFDckMsZUFBVSxHQUFXLEVBQUUsQ0FBQztRQUN4QixnQkFBVyxHQUE4QixFQUFFLENBQUM7UUFFM0MsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFjLENBQUM7S0FrRHJEO0lBaERDLElBQVcsUUFBUTtRQUNqQixPQUFPLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQTtJQUMxQyxDQUFDO0lBRUQsSUFBVyxNQUFNO1FBQ2YsT0FBTyxJQUFJLENBQUMsWUFBWSxLQUFLLE1BQU0sQ0FBQTtJQUNyQyxDQUFDO0lBRUQsSUFBVyxVQUFVO1FBQ25CLE9BQU8sSUFBSSxDQUFDLFlBQVksS0FBSyxNQUFNLENBQUE7SUFDckMsQ0FBQztJQUVELElBQVcsV0FBVztRQUNwQixPQUFPLElBQUksQ0FBQyxZQUFZLEtBQUssT0FBTyxDQUFBO0lBQ3RDLENBQUM7SUFFRCxJQUFXLFVBQVU7UUFDbkIsT0FBTyxHQUFHLGVBQWUsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksZUFBZSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLElBQUksSUFBSSxDQUFDLGFBQWEsSUFBSSxzQkFBc0IsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLEVBQUUsQ0FBQztJQUMxSyxDQUFDO0lBRUQsSUFBVyxjQUFjO1FBQ3ZCLElBQUksSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNqQixPQUFPLE9BQU8sQ0FBQTtTQUNmO1FBQ0QsSUFBSSxJQUFJLENBQUMsS0FBSyxLQUFLLFNBQVMsRUFBRTtZQUM1QixPQUFPLElBQUksQ0FBQyxJQUFJLEtBQUssU0FBUyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQTtTQUNuRDthQUFNLElBQUksSUFBSSxDQUFDLElBQUksS0FBSyxTQUFTLEVBQUU7WUFDbEMsT0FBTyxPQUFPLENBQUE7U0FDZjthQUFNO1lBQ0wsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFBO1NBQ2xCO0lBQ0gsQ0FBQztJQUVELElBQVcsYUFBYTtRQUN0QixPQUFPLElBQUksQ0FBQyxJQUFJLEtBQUssT0FBTyxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLEtBQUssUUFBUSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLGFBQWEsQ0FBQTtJQUMzRixDQUFDO0lBRUQsSUFBVyxlQUFlO1FBQ3hCLE9BQU8sSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxFQUFFLFFBQVEsQ0FBQyxDQUFBO0lBQ2xELENBQUM7SUFFTSxXQUFXLENBQUMsTUFBa0I7UUFDbkMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDbEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLENBQUE7U0FDM0I7YUFBTTtZQUNMLE1BQU0sQ0FBQyxlQUFlLEVBQUUsQ0FBQTtTQUN6QjtJQUNILENBQUM7OzRHQXBFVSxlQUFlO2dHQUFmLGVBQWUsdWNDdEI1Qiw2dUhBb0hBOzJGRDlGYSxlQUFlO2tCQU4zQixTQUFTOytCQUNFLFlBQVksbUJBR0wsdUJBQXVCLENBQUMsTUFBTTs4QkFHdEMsSUFBSTtzQkFBWixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFFSSxRQUFRO3NCQUFqQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5pbXBvcnQgeyBMb2FkZXJDb2xvclR5cGVzLCBMb2FkZXJTaXplc1R5cGVzIH0gZnJvbSAnLi4vbG9hZGVyL2xvYWRlci5lbnVtJztcclxuaW1wb3J0IHtcclxuICBCdXR0b25BdHRyVHlwZXMsXHJcbiAgQnV0dG9uQ29sb3JzRW51bSxcclxuICBCdXR0b25Db2xvcnNUeXBlcyxcclxuICBCdXR0b25JY29uUG9zaXRpb25FbnVtLFxyXG4gIEJ1dHRvbkljb25Qb3NpdGlvblR5cGVzLFxyXG4gIEJ1dHRvblNpemVzRW51bSxcclxuICBCdXR0b25TaXplc1R5cGVzLFxyXG4gIEJ1dHRvblRhcmdldFR5cGVzLFxyXG4gIEJ1dHRvblR5cGVzLFxyXG4gIEJ1dHRvblR5cGVzRW51bVxyXG59IGZyb20gJy4vYnV0dG9uLmVudW0nO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdtcngtYnV0dG9uJyxcclxuICB0ZW1wbGF0ZVVybDogJ2J1dHRvbi5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vYnV0dG9uLmNvbXBvbmVudC5sZXNzJ10sXHJcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBCdXR0b25Db21wb25lbnQge1xyXG4gIEBJbnB1dCgpIHNpemU6IEJ1dHRvblNpemVzVHlwZXMgPSAnbGFyZ2UnO1xyXG4gIEBJbnB1dCgpIHR5cGU6IEJ1dHRvblR5cGVzID0gJ3ByaW1hcnknO1xyXG4gIEBJbnB1dCgpIGNvbG9yOiBCdXR0b25Db2xvcnNUeXBlcyA9ICdkZWZhdWx0JztcclxuICBASW5wdXQoKSBpY29uUG9zaXRpb246IEJ1dHRvbkljb25Qb3NpdGlvblR5cGVzID0gJ2xlZnQnO1xyXG4gIEBJbnB1dCgpIGFjdGl2ZTogYm9vbGVhbiA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgaXNMb2FkaW5nOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgaWNvbk9ubHk6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoKSBjdXN0b21DbGFzc2VzOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBsYWJlbDogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgaWNvbjogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgaWNvbkNsYXNzOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBidXR0b25UeXBlOiBCdXR0b25BdHRyVHlwZXMgPSAnYnV0dG9uJztcclxuICBASW5wdXQoKSBocmVmOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSB0YXJnZXQ6IEJ1dHRvblRhcmdldFR5cGVzID0gJ19ibGFuayc7XHJcbiAgQElucHV0KCkgcm91dGVyTGluazogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgcXVlcnlQYXJhbXM6IHsgW2tleTogc3RyaW5nXTogc3RyaW5nIH0gPSB7fTtcclxuXHJcbiAgQE91dHB1dCgpIG1yeENsaWNrID0gbmV3IEV2ZW50RW1pdHRlcjxNb3VzZUV2ZW50PigpO1xyXG5cclxuICBwdWJsaWMgZ2V0IGdldExhYmVsKCk6IG51bGwgfCBzdHJpbmcge1xyXG4gICAgcmV0dXJuIHRoaXMuaWNvbk9ubHkgPyBudWxsIDogdGhpcy5sYWJlbFxyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBpc0ljb24oKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5pY29uUG9zaXRpb24gIT09ICdub25lJ1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBpc0ljb25MZWZ0KCk6IGJvb2xlYW4ge1xyXG4gICAgcmV0dXJuIHRoaXMuaWNvblBvc2l0aW9uID09PSAnbGVmdCdcclxuICB9XHJcblxyXG4gIHB1YmxpYyBnZXQgaXNJY29uUmlnaHQoKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5pY29uUG9zaXRpb24gPT09ICdyaWdodCdcclxuICB9XHJcblxyXG4gIHB1YmxpYyBnZXQgZ2V0Q2xhc3NlcygpOiBzdHJpbmcge1xyXG4gICAgcmV0dXJuIGAke0J1dHRvblNpemVzRW51bVt0aGlzLnNpemVdfSAke0J1dHRvblR5cGVzRW51bVt0aGlzLnR5cGVdfSAke0J1dHRvbkNvbG9yc0VudW1bdGhpcy5jb2xvcl19ICR7dGhpcy5jdXN0b21DbGFzc2VzfSAke0J1dHRvbkljb25Qb3NpdGlvbkVudW1bdGhpcy5pY29uUG9zaXRpb25dfWA7XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgZ2V0IGdldExvYWRlckNvbG9yKCk6IExvYWRlckNvbG9yVHlwZXMge1xyXG4gICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcclxuICAgICAgcmV0dXJuICdibGFjaydcclxuICAgIH1cclxuICAgIGlmICh0aGlzLmNvbG9yID09PSAnZGVmYXVsdCcpIHtcclxuICAgICAgcmV0dXJuIHRoaXMudHlwZSA9PT0gJ3ByaW1hcnknID8gJ3doaXRlJyA6ICdicmFuZCdcclxuICAgIH0gZWxzZSBpZiAodGhpcy50eXBlID09PSAncHJpbWFyeScpIHtcclxuICAgICAgcmV0dXJuICd3aGl0ZSdcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIHJldHVybiB0aGlzLmNvbG9yXHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwdWJsaWMgZ2V0IGdldExvYWRlclNpemUoKTogTG9hZGVyU2l6ZXNUeXBlcyB7XHJcbiAgICByZXR1cm4gdGhpcy5zaXplID09PSAnbGFyZ2UnID8gJ3NtYWxsJyA6IHRoaXMuc2l6ZSA9PT0gJ21lZGl1bScgPyAnc21hbGwnIDogJ2V4dHJhLXNtYWxsJ1xyXG4gIH1cclxuXHJcbiAgcHVibGljIGdldCBnZXRSZXBsYWNlZEljb24oKTogc3RyaW5nIHtcclxuICAgIHJldHVybiB0aGlzLmljb24ucmVwbGFjZSgvXCIoW15cIl0rKVwiL2csICdcXCckMVxcJycpXHJcbiAgfVxyXG5cclxuICBwdWJsaWMgYnV0dG9uQ2xpY2soJGV2ZW50OiBNb3VzZUV2ZW50KTogdm9pZCB7XHJcbiAgICBpZiAoIXRoaXMuZGlzYWJsZWQpIHtcclxuICAgICAgdGhpcy5tcnhDbGljay5lbWl0KCRldmVudClcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgICRldmVudC5zdG9wUHJvcGFnYXRpb24oKVxyXG4gICAgfVxyXG4gIH1cclxufVxyXG4iLCI8bmctdGVtcGxhdGUgI2NvbnRlbnRUZW1wbGF0ZT5cclxuICA8bmctdGVtcGxhdGUgI3NwaW5uZXI+XHJcbiAgICA8bXJ4LWxvYWRlciBbY29sb3JdPVwiZ2V0TG9hZGVyQ29sb3JcIiBbc2l6ZV09XCJnZXRMb2FkZXJTaXplXCI+PC9tcngtbG9hZGVyPlxyXG4gIDwvbmctdGVtcGxhdGU+XHJcblxyXG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCJpc0ljb25MZWZ0ICYmIGlzTG9hZGluZ1wiPlxyXG4gICAgPGRpdlxyXG4gICAgICBbY2xhc3MubXItMV09XCJzaXplID09PSAnc21hbGwnICYmICFpY29uT25seVwiXHJcbiAgICAgIFtjbGFzcy5tci0yXT1cIihzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nKSAmJiAhaWNvbk9ubHlcIlxyXG4gICAgICBjbGFzcz1cImljb24td3JhcHBlclwiXHJcbiAgICA+XHJcbiAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJzcGlubmVyXCI+PC9uZy1jb250YWluZXI+XHJcbiAgICA8L2Rpdj5cclxuICA8L25nLWNvbnRhaW5lcj5cclxuXHJcblxyXG4gIDxkaXZcclxuICAgICpuZ0lmPVwiaWNvbiAmJiBpc0ljb25MZWZ0ICYmICFpc0xvYWRpbmdcIlxyXG4gICAgW2NsYXNzLm1yLTFdPVwic2l6ZSA9PT0gJ3NtYWxsJyAmJiAhaWNvbk9ubHlcIlxyXG4gICAgW2NsYXNzLm1yLTJdPVwiKHNpemUgPT09ICdsYXJnZScgfHwgc2l6ZSA9PT0gJ21lZGl1bScpICYmICFpY29uT25seVwiXHJcbiAgICBbaW5uZXJIVE1MXT1cImdldFJlcGxhY2VkSWNvbiB8IHNhZmVcIiBjbGFzcz1cImljb24td3JhcHBlclwiXHJcbiAgPjwvZGl2PlxyXG5cclxuICA8ZGl2XHJcbiAgICAqbmdJZj1cImljb25DbGFzcyAmJiBpc0ljb25MZWZ0ICYmICFpc0xvYWRpbmdcIlxyXG4gICAgW2NsYXNzLm1yLTFdPVwic2l6ZSA9PT0gJ3NtYWxsJyAmJiAhaWNvbk9ubHlcIlxyXG4gICAgW2NsYXNzLm1yLTJdPVwiKHNpemUgPT09ICdsYXJnZScgfHwgc2l6ZSA9PT0gJ21lZGl1bScpICYmICFpY29uT25seVwiXHJcbiAgICBjbGFzcz1cImljb24td3JhcHBlclwiXHJcbiAgPlxyXG4gICAgPHNwYW5cclxuICAgICAgW2NsYXNzLmljb24tZm9udC0xNl09XCJzaXplID09PSAnc21hbGwnXCJcclxuICAgICAgW2NsYXNzLmljb24tZm9udC0yNF09XCJzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nXCJcclxuICAgICAgW2NsYXNzXT1cImljb25DbGFzc1wiXHJcbiAgICAgIGNsYXNzPVwibXJ4LWljb25cIlxyXG4gICAgPjwvc3Bhbj5cclxuICA8L2Rpdj5cclxuXHJcbiAgPGRpdiBjbGFzcz1cIm1yeC1idG4tbGFiZWxcIj57eyBnZXRMYWJlbCB9fVxyXG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4gIDwvZGl2PlxyXG5cclxuICA8ZGl2XHJcbiAgICAqbmdJZj1cImljb25DbGFzcyAmJiBpc0ljb25SaWdodCAmJiAhaXNMb2FkaW5nXCJcclxuICAgIFtjbGFzcy5tbC0xXT1cInNpemUgPT09ICdzbWFsbCcgJiYgIWljb25Pbmx5XCJcclxuICAgIFtjbGFzcy5tbC0yXT1cIihzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nKSAmJiAhaWNvbk9ubHlcIlxyXG4gICAgY2xhc3M9XCJpY29uLXdyYXBwZXJcIlxyXG4gID5cclxuICAgIDxzcGFuXHJcbiAgICAgIFtjbGFzcy5pY29uLWZvbnQtMTZdPVwic2l6ZSA9PT0gJ3NtYWxsJ1wiXHJcbiAgICAgIFtjbGFzcy5pY29uLWZvbnQtMjRdPVwic2l6ZSA9PT0gJ2xhcmdlJyB8fCBzaXplID09PSAnbWVkaXVtJ1wiXHJcbiAgICAgIFtjbGFzc109XCJpY29uQ2xhc3NcIlxyXG4gICAgICBjbGFzcz1cIm1yeC1pY29uXCJcclxuICAgID48L3NwYW4+XHJcbiAgPC9kaXY+XHJcblxyXG4gIDxkaXZcclxuICAgICpuZ0lmPVwiaWNvbiAmJiBpc0ljb25SaWdodCAmJiAhaXNMb2FkaW5nXCJcclxuICAgIFtjbGFzcy5tbC0xXT1cInNpemUgPT09ICdzbWFsbCcgJiYgIWljb25Pbmx5XCJcclxuICAgIFtjbGFzcy5tbC0yXT1cIihzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nKSAmJiAhaWNvbk9ubHlcIlxyXG4gICAgW2lubmVySFRNTF09XCJnZXRSZXBsYWNlZEljb24gfCBzYWZlXCIgY2xhc3M9XCJpY29uLXdyYXBwZXJcIlxyXG4gID48L2Rpdj5cclxuXHJcbiAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImlzSWNvblJpZ2h0ICYmIGlzTG9hZGluZ1wiPlxyXG4gICAgPGRpdlxyXG4gICAgICBbY2xhc3MubWwtMV09XCJzaXplID09PSAnc21hbGwnICYmICFpY29uT25seVwiXHJcbiAgICAgIFtjbGFzcy5tbC0yXT1cIihzaXplID09PSAnbGFyZ2UnIHx8IHNpemUgPT09ICdtZWRpdW0nKSAmJiAhaWNvbk9ubHlcIlxyXG4gICAgICBjbGFzcz1cImljb24td3JhcHBlclwiXHJcbiAgICAgIChjbGljayk9XCIkZXZlbnQucHJldmVudERlZmF1bHQoKVwiXHJcbiAgICA+XHJcbiAgICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJzcGlubmVyXCI+PC9uZy1jb250YWluZXI+XHJcbiAgICA8L2Rpdj5cclxuICA8L25nLWNvbnRhaW5lcj5cclxuPC9uZy10ZW1wbGF0ZT5cclxuXHJcbjxuZy1jb250YWluZXIgW25nU3dpdGNoXT1cInRydWVcIj5cclxuICA8YVxyXG4gICAgKm5nU3dpdGNoQ2FzZT1cIiEhaHJlZlwiXHJcbiAgICBbYXR0ci5yZWxdPVwidGFyZ2V0ID09PSAnX2JsYW5rJyA/ICdub29wZW5lciBub3JlZmVycmVyJyA6IG51bGxcIlxyXG4gICAgW2NsYXNzLmFjdGl2ZV09XCJhY3RpdmVcIlxyXG4gICAgW2NsYXNzLmljb24tbG9hZGluZ109XCJpc0xvYWRpbmcgJiYgIWRpc2FibGVkXCJcclxuICAgIFtjbGFzcy5pY29uLW9ubHldPVwiaWNvbk9ubHlcIlxyXG4gICAgW2NsYXNzXT1cImdldENsYXNzZXNcIlxyXG4gICAgW2hyZWZdPVwiaHJlZlwiXHJcbiAgICBbdGFyZ2V0XT1cInRhcmdldFwiXHJcbiAgICBjbGFzcz1cIm1yeC1idG5cIlxyXG4gID5cclxuICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJjb250ZW50VGVtcGxhdGVcIj48L25nLWNvbnRhaW5lcj5cclxuICA8L2E+XHJcblxyXG4gIDxhXHJcbiAgICAqbmdTd2l0Y2hDYXNlPVwiISFyb3V0ZXJMaW5rXCJcclxuICAgIFtjbGFzcy5hY3RpdmVdPVwiYWN0aXZlXCJcclxuICAgIFtjbGFzcy5pY29uLWxvYWRpbmddPVwiaXNMb2FkaW5nICYmICFkaXNhYmxlZFwiXHJcbiAgICBbY2xhc3MuaWNvbi1vbmx5XT1cImljb25Pbmx5XCJcclxuICAgIFtjbGFzc109XCJnZXRDbGFzc2VzXCJcclxuICAgIFtxdWVyeVBhcmFtc109XCJxdWVyeVBhcmFtc1wiXHJcbiAgICBbcm91dGVyTGlua109XCJyb3V0ZXJMaW5rXCJcclxuICAgIGNsYXNzPVwibXJ4LWJ0blwiXHJcbiAgPlxyXG4gICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImNvbnRlbnRUZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxyXG4gIDwvYT5cclxuXHJcbiAgPGJ1dHRvblxyXG4gICAgKm5nU3dpdGNoRGVmYXVsdFxyXG4gICAgW2NsYXNzLmFjdGl2ZV09XCJhY3RpdmVcIlxyXG4gICAgW2NsYXNzLmljb24tbG9hZGluZ109XCJpc0xvYWRpbmcgJiYgIWRpc2FibGVkXCJcclxuICAgIFtjbGFzcy5pY29uLW9ubHldPVwiaWNvbk9ubHlcIlxyXG4gICAgW2NsYXNzXT1cImdldENsYXNzZXNcIlxyXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcclxuICAgIFt0eXBlXT1cImJ1dHRvblR5cGVcIlxyXG4gICAgY2xhc3M9XCJtcngtYnRuXCJcclxuICAgIChjbGljayk9XCJidXR0b25DbGljaygkZXZlbnQpXCJcclxuICA+XHJcbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFRlbXBsYXRlXCI+PC9uZy1jb250YWluZXI+XHJcbiAgPC9idXR0b24+XHJcbjwvbmctY29udGFpbmVyPlxyXG4iXX0=
|